@props([
    'url',
    'color' => 'primary',
    'align' => 'center',
    'customColor' => null,
])
@php
    // Toujours appliquer un border-radius très arrondi (quasiment rond)
    $buttonStyle = 'border-radius: 25px !important;';

    if ($customColor) {
        // Appliquer la couleur personnalisée avec !important pour override le CSS
        // Utiliser un border-radius très arrondi (quasiment rond)
        $buttonStyle = 'background-color: ' . htmlspecialchars($customColor, ENT_QUOTES, 'UTF-8') . ' !important; border-color: ' . htmlspecialchars($customColor, ENT_QUOTES, 'UTF-8') . ' !important; border-radius: 25px !important; border-bottom: 8px solid ' . htmlspecialchars($customColor, ENT_QUOTES, 'UTF-8') . ' !important; border-left: 18px solid ' . htmlspecialchars($customColor, ENT_QUOTES, 'UTF-8') . ' !important; border-right: 18px solid ' . htmlspecialchars($customColor, ENT_QUOTES, 'UTF-8') . ' !important; border-top: 8px solid ' . htmlspecialchars($customColor, ENT_QUOTES, 'UTF-8') . ' !important;';
    }
@endphp
<table class="action" align="{{ $align }}" width="100%" cellpadding="0" cellspacing="0" role="presentation">
<tr>
<td align="{{ $align }}">
<table width="100%" border="0" cellpadding="0" cellspacing="0" role="presentation">
<tr>
<td align="{{ $align }}">
<table border="0" cellpadding="0" cellspacing="0" role="presentation">
<tr>
<td>
<a href="{{ $url }}" class="button button-{{ $color }}" style="{{ $buttonStyle }}" target="_blank" rel="noopener">{!! $slot !!}</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>