@props([
    'icon' => null,   // e.g. carbon:email
    'text' => null,   // e.g. "or"
])

<div {{ $attributes->merge(['class' => 'flex items-center gap-3 my-4']) }}>
    <div class="flex-1 h-px bg-gray-400"></div>

    @if($icon || $text)
        <div class="flex items-center gap-1 text-xs text-muted whitespace-nowrap">
            @if($icon)
                {!! $icon !!}
            @endif

            @if($text)
                <span>{{ $text }}</span>
            @endif
        </div>
    @endif

    <div class="flex-1 h-px bg-gray-400"></div>
</div>