@php
    $elements = $settings->floating_elements ?? [];
    $whatsapp = $elements['whatsapp'] ?? [];
    $scrollTop = $elements['scroll_to_top'] ?? [];
    $customBtn = $elements['custom_button'] ?? [];
    $whatsappNumber = $whatsapp['number'] ?? $settings->whatsapp_number ?? null;
@endphp

<div class="fixed bottom-6 end-6 z-50 flex flex-col items-end gap-3" x-data="{ showScrollTop: false }" @scroll.window="showScrollTop = window.scrollY > 600">

    {{-- Scroll to Top --}}
    @if($scrollTop['enabled'] ?? true)
        <button x-show="showScrollTop"
                x-transition:enter="transition ease-out duration-200"
                x-transition:enter-start="opacity-0 scale-75"
                x-transition:enter-end="opacity-100 scale-100"
                x-transition:leave="transition ease-in duration-150"
                x-transition:leave-start="opacity-100 scale-100"
                x-transition:leave-end="opacity-0 scale-75"
                @click="window.scrollTo({ top: 0, behavior: 'smooth' })"
                class="w-11 h-11 rounded-full bg-gray-800/80 text-white shadow-lg hover:bg-gray-900 backdrop-blur-sm flex items-center justify-center transition-all hover:scale-110"
                aria-label="العودة للأعلى">
            <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 15l7-7 7 7"/></svg>
        </button>
    @endif

    {{-- Custom Button --}}
    @if(($customBtn['enabled'] ?? false) && !empty($customBtn['url']))
        <a href="{{ $customBtn['url'] }}"
           class="px-4 py-2.5 rounded-full text-white text-sm font-medium shadow-lg hover:shadow-xl transition-all hover:scale-105 flex items-center gap-2"
           style="background-color: {{ $customBtn['color'] ?? 'var(--site-accent)' }}">
            @if(!empty($customBtn['icon']) && $customBtn['icon'] === 'phone')
                <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/></svg>
            @endif
            {{ $customBtn['text'] ?? 'تواصل معنا' }}
        </a>
    @endif

    {{-- WhatsApp --}}
    @if(($whatsapp['enabled'] ?? true) && $whatsappNumber)
        @php
            $waMessage = $whatsapp['message'] ?? 'مرحبا، أريد الاستفسار عن...';
            $waLink = whatsapp_link($whatsappNumber, $waMessage);
        @endphp
        <a href="{{ $waLink }}" target="_blank" rel="noopener"
           class="w-14 h-14 rounded-full bg-green-500 text-white shadow-lg hover:shadow-xl hover:bg-green-600 flex items-center justify-center transition-all hover:scale-110 group"
           aria-label="تواصل عبر واتساب">
            <svg class="w-7 h-7 group-hover:scale-110 transition-transform" fill="currentColor" viewBox="0 0 24 24">
                <path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347z"/>
            </svg>
        </a>
    @endif
</div>
