@php
    $floatingKontak = \Illuminate\Support\Facades\DB::table('mst_kontak')->where('isactive', 1)->first();
    $locale = app()->getLocale();
    $kontakLang = $floatingKontak ? \Illuminate\Support\Facades\DB::table('mst_kontak_lang')->where('idkontak', $floatingKontak->idkontak)->where('locale', $locale)->first() : null;
@endphp

@if($floatingKontak)
    @php
        $hasWa = $floatingKontak->floating_wa_isactive && !empty($floatingKontak->whatsapp);
        $hasEmail = isset($floatingKontak->floating_email_isactive) ? ($floatingKontak->floating_email_isactive && !empty($floatingKontak->email)) : (!empty($floatingKontak->email));

        $cleanWa = preg_replace('/[^0-9]/', '', $floatingKontak->whatsapp ?? '');
        $waTextDefault = ($locale === 'en') ? "Hello Intisolve, I would like to consult regarding your products and services." : "Halo Intisolve, saya ingin berkonsultasi mengenai produk dan layanan Anda.";
        $waUrl = "https://wa.me/{$cleanWa}?text=" . urlencode($waTextDefault);

        $emailSubjectDefault = ($locale === 'en') ? "Product & Service Consultation Intisolve" : "Konsultasi Produk & Layanan Intisolve";
        $emailUrl = "mailto:" . ($floatingKontak->email ?? '') . "?subject=" . urlencode($emailSubjectDefault);

        $waTooltipText = ($kontakLang && !empty($kontakLang->floating_wa_text))
            ? $kontakLang->floating_wa_text
            : ($floatingKontak->floating_wa_text ?? ($locale === 'en' ? 'Contact Us via WhatsApp' : 'Hubungi Kami via WhatsApp'));

        $emailTooltipText = ($kontakLang && !empty($kontakLang->floating_email_text))
            ? $kontakLang->floating_email_text
            : ($floatingKontak->floating_email_text ?? ($locale === 'en' ? 'Send Us an Email' : 'Kirim Email Ke Kami'));

        $isLeft = ($floatingKontak->floating_position === 'bottom-left');
        $positionClass = $isLeft ? 'start-0 ms-3 ms-md-4 align-items-start' : 'end-0 me-3 me-md-4 align-items-end';
        $tooltipDirection = $isLeft ? 'flex-row' : 'flex-row-reverse';
    @endphp

    @if($hasWa || $hasEmail)
        <div class="floating-fun-stack position-fixed bottom-0 {{ $positionClass }} mb-3 mb-md-4 d-flex flex-column gap-2 gap-md-3" style="z-index: 1080;">
            
            {{-- Floating Email Button (Icon Envelope Email) --}}
            @if($hasEmail)
                <div class="floating-btn-group position-relative d-flex align-items-center">
                    <a href="{{ $emailUrl }}" class="fab-btn fab-email shadow-lg rounded-circle d-flex align-items-center justify-content-center text-decoration-none position-relative" title="{{ $emailTooltipText }}" aria-label="Email">
                        <i class="fas fa-envelope fs-4 text-white fab-icon"></i>
                    </a>
                    <span class="fab-tooltip badge bg-dark text-white px-3 py-2 rounded-pill shadow-sm text-nowrap">
                        {{ $emailTooltipText }}
                    </span>
                </div>
            @endif

            {{-- Floating WhatsApp Button --}}
            @if($hasWa)
                <div class="floating-btn-group position-relative d-flex align-items-center">
                    <a href="{{ $waUrl }}" target="_blank" rel="noopener noreferrer" class="fab-btn fab-whatsapp shadow-lg rounded-circle d-flex align-items-center justify-content-center text-decoration-none position-relative pulse-ring-effect" title="{{ $waTooltipText }}" aria-label="WhatsApp">
                        <i class="fab fa-whatsapp fs-2 text-white fab-icon"></i>
                    </a>
                    <span class="fab-tooltip badge bg-dark text-white px-3 py-2 rounded-pill shadow-sm text-nowrap">
                        {{ $waTooltipText }}
                    </span>
                </div>
            @endif

        </div>

        <style>
        /* Container and Groups: clicks pass through transparent space */
        .floating-fun-stack {
            pointer-events: none !important;
            width: auto;
        }

        .floating-btn-group {
            pointer-events: none !important;
            position: relative;
            width: fit-content;
        }

        /* Base Floating Button Style: ONLY the button circle captures pointer events */
        .fab-btn {
            pointer-events: auto !important;
            width: 58px;
            height: 58px;
            border-radius: 50% !important;
            transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
            cursor: pointer;
            touch-action: manipulation;
        }

        /* WhatsApp Button Gradient & Style */
        .fab-whatsapp {
            background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
            box-shadow: 0 8px 20px rgba(37, 211, 102, 0.4);
        }

        /* Email Button Gradient & Style */
        .fab-email {
            background: linear-gradient(135deg, #1e3a5f 0%, #2563eb 100%);
            box-shadow: 0 8px 20px rgba(30, 58, 95, 0.35);
        }

        /* Icon Wiggle Effect */
        .fab-btn .fab-icon {
            transition: transform 0.3s ease;
        }

        /* Tooltip Slide & Fade Effect (Position absolute so it NEVER expands group hitbox) */
        .fab-tooltip {
            position: absolute;
            top: 50%;
            right: calc(100% + 12px);
            transform: translateY(-50%) scale(0.85);
            opacity: 0;
            visibility: hidden;
            transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
            font-size: 0.85rem;
            pointer-events: none !important;
            z-index: 1081;
        }

        /* Left-aligned positioning for tooltips */
        .floating-fun-stack.start-0 .fab-tooltip {
            right: auto;
            left: calc(100% + 12px);
        }

        /* Continuous Fun Pulse Ring Animation for WhatsApp */
        .pulse-ring-effect::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            border-radius: 50%;
            background-color: rgba(37, 211, 102, 0.45);
            z-index: -1;
            animation: funPulseRing 2.2s infinite ease-in-out;
            pointer-events: none !important; /* CRITICAL: Prevents ring animation from intercepting clicks/taps */
        }

        @keyframes funPulseRing {
            0% {
                transform: scale(0.98);
                opacity: 0.75;
            }
            70% {
                transform: scale(1.35);
                opacity: 0;
            }
            100% {
                transform: scale(1.35);
                opacity: 0;
            }
        }

        /* Desktop-only Hover Enhancements */
        @media (hover: hover) and (pointer: fine) {
            .fab-whatsapp:hover {
                background: linear-gradient(135deg, #28e16f 0%, #159e8f 100%);
                transform: translateY(-4px) scale(1.08) rotate(6deg);
                box-shadow: 0 12px 26px rgba(37, 211, 102, 0.55) !important;
            }
            .fab-email:hover {
                background: linear-gradient(135deg, #244775 0%, #3b82f6 100%);
                transform: translateY(-4px) scale(1.08) rotate(-6deg);
                box-shadow: 0 12px 26px rgba(37, 99, 235, 0.45) !important;
            }
            .fab-btn:hover .fab-icon {
                transform: scale(1.15);
            }
            .floating-btn-group:hover .fab-tooltip {
                opacity: 1;
                visibility: visible;
                transform: translateY(-50%) scale(1);
            }
        }

        /* Mobile specific responsiveness & strict scope */
        @media (max-width: 768px) {
            .fab-btn {
                width: 50px;
                height: 50px;
            }
            .fab-btn .fab-icon {
                font-size: 1.25rem !important;
            }
            .fab-whatsapp .fab-icon {
                font-size: 1.45rem !important;
            }
            .fab-tooltip {
                display: none !important; /* Prevents sticky tooltip popups from blocking div cards on mobile */
            }
        }
        </style>
    @endif
@endif