@include('emails.partials.brand-colors')
{{--
    Email Section Component - Highlighted content block

    Usage:
    @component('emails.components.section', ['background' => 'pearl', 'padding' => '25px'])
        <h2>Section Title</h2>
        <p>Section content goes here...</p>
    @endcomponent

    Props:
    - background: Color key from brand-colors (default: 'bg-section')
    - padding: CSS padding value (default: '25px')
    - borderRadius: CSS border-radius (default: '6px')
--}}

@php
$bgColor = isset($background) && isset($colors[$background]) ? $colors[$background] : $colors['bg-section'];
$padding = $padding ?? '25px';
$borderRadius = $borderRadius ?? '6px';
@endphp

<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="margin: 20px 0;">
    <tr>
        <td style="background-color: {{ $bgColor }}; border-radius: {{ $borderRadius }}; padding: {{ $padding }};">
            {{ $slot }}
        </td>
    </tr>
</table>