{{--
    @include('emails.partials.button', ['url' => ..., 'label' => ...])

    The site's primary button (x-ui.button, .btn-primary): neutral-200 fill,
    black border, bold italic uppercase, black offset shadow. The shadow is
    built from table cells, not box-shadow (Gmail and Outlook drop it): a
    black column on the right starting $offset down, and a black row at the
    bottom starting $offset in. The button cell spans the first two rows, so
    the black column always matches its height.

    Uppercased here with the tonos removed, since emails can't run the site's
    strip-accents script and CSS uppercase would keep the accents.
--}}
@php
    $offset = 8;
    $label = strtr(mb_strtoupper($label), [
        'Ά' => 'Α', 'Έ' => 'Ε', 'Ή' => 'Η', 'Ί' => 'Ι', 'Ό' => 'Ο', 'Ύ' => 'Υ', 'Ώ' => 'Ω',
        'ΐ' => 'Ϊ', 'ΰ' => 'Ϋ',
    ]);
    $spacer = "font-size:1px;line-height:1px;mso-line-height-rule:exactly;";
@endphp

<table role="presentation" cellpadding="0" cellspacing="0" border="0" style="margin:0;border-collapse:separate;">
    <tr>
        <td rowspan="2" bgcolor="#e5e5e5" style="background-color:#e5e5e5;border:1px solid #000000;border-radius:0;mso-padding-alt:14px 28px;">
            <a href="{{ $url }}" target="_blank" style="display:inline-block;padding:14px 28px;font-family:'Manrope',Arial,Helvetica,sans-serif;font-size:16px;line-height:20px;mso-line-height-rule:exactly;font-weight:700;font-style:italic;color:#000000;text-decoration:none;">{{ $label }}</a>
        </td>
        <td width="{{ $offset }}" height="{{ $offset }}" style="width:{{ $offset }}px;height:{{ $offset }}px;{{ $spacer }}">&nbsp;</td>
    </tr>
    <tr>
        <td width="{{ $offset }}" bgcolor="#000000" style="width:{{ $offset }}px;background-color:#000000;{{ $spacer }}">&nbsp;</td>
    </tr>
    <tr>
        <td height="{{ $offset }}" style="height:{{ $offset }}px;padding:0 0 0 {{ $offset }}px;{{ $spacer }}">
            <table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0">
                <tr>
                    <td height="{{ $offset }}" bgcolor="#000000" style="height:{{ $offset }}px;background-color:#000000;{{ $spacer }}">&nbsp;</td>
                </tr>
            </table>
        </td>
        <td width="{{ $offset }}" height="{{ $offset }}" bgcolor="#000000" style="width:{{ $offset }}px;height:{{ $offset }}px;background-color:#000000;{{ $spacer }}">&nbsp;</td>
    </tr>
</table>