/* Main Application CSS */

@keyframes gradient-shimmer {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

.animate-gradient {
    animation: gradient-shimmer 6s ease infinite;
}

.bg-300\% {
    background-size: 300% 300%;
}

/* WhatsApp Pulse Animation */
@keyframes pulse-whatsapp {
    0% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
        transform: scale(1);
    }

    70% {
        box-shadow: 0 0 0 15px rgba(37, 211, 102, 0);
        transform: scale(1.05);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);
        transform: scale(1);
    }
}

.animate-pulse-whatsapp {
    animation: pulse-whatsapp 2s infinite;
}

/* Alpine x-cloak helper */
[x-cloak] {
    display: none !important;
}

/* Form alert shake animation */
@keyframes shake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-4px); }
    40%, 80% { transform: translateX(4px); }
}

.animate-shake {
    animation: shake 0.4s ease-in-out;
}

/* =============================================
   PRINT STYLES — Clean Brochure Output
   Hides all site chrome: navbar, footer, floating
   buttons, mobile menus, modals, sticky bars.
   ============================================= */
@media print {
    /* ---- Global Resets ---- */
    body {
        background: #fff !important;
        color: #1e293b !important;
        font-size: 11pt !important;
        padding: 0 !important;
        margin: 0 !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    * {
        box-shadow: none !important;
        text-shadow: none !important;
    }

    /* ---- Hide Site-Wide Chrome ---- */

    /* Top utility bar (dark phone/email strip) */
    body > .bg-gradient-to-r.from-slate-950,
    body > div > .bg-gradient-to-r.from-slate-950 {
        display: none !important;
    }

    /* Main Navbar / Header */
    header,
    header.sticky,
    nav.fixed,
    .sticky.top-0 {
        display: none !important;
    }

    /* Footer */
    footer {
        display: none !important;
    }

    /* Mobile Bottom Sticky Nav (5-icon tab bar) */
    .md\:hidden.fixed.bottom-0,
    .pb-safe {
        display: none !important;
    }

    /* Floating WhatsApp Button */
    a[aria-label="Chat on WhatsApp"],
    .animate-pulse-whatsapp {
        display: none !important;
    }

    /* Guest Chat Widget */
    #guest-chat-widget {
        display: none !important;
    }

    /* Scroll-to-Top Button */
    button.fixed.bottom-36,
    button.fixed.md\:bottom-8 {
        display: none !important;
    }

    /* ---- Tour Details Page Specific ---- */

    /* Sticky Sub-Navigation Bar (Experience / Highlights / Day-by-Day tabs) */
    .sticky.top-20.z-20,
    .sticky.top-32.z-20 {
        display: none !important;
    }

    /* Mobile Sticky Floating Bottom Action Bar (Book Now / Customize) */
    .lg\:hidden.fixed.bottom-0.z-40 {
        display: none !important;
    }

    /* Gallery Lightbox Modal */
    .fixed.inset-0.z-\[100\] {
        display: none !important;
    }

    /* Customize Itinerary WhatsApp Modal */
    .fixed.inset-0.z-\[110\] {
        display: none !important;
    }

    /* Share & Print Brochure buttons (no point printing the print button) */
    button[title="Share Journey"],
    button[title="Print Itinerary"] {
        display: none !important;
    }

    /* WhatsApp Customize & Quick Question buttons in booking sidebar */
    .fab.fa-whatsapp {
        display: none !important;
    }
    button[class*="from-emerald-600"],
    a[class*="fa-comment-dots"] {
        display: none !important;
    }

    /* Booking form "Reserve" / "Sign In to Reserve" button */
    #booking-form button[type="button"],
    #booking-form + button,
    #booking-form ~ button,
    #booking-form ~ a[class*="from-emerald"] {
        display: none !important;
    }

    /* Hide booking sidebar interactive elements but keep price card */
    .warm-glow form {
        display: none !important;
    }
    .warm-glow form ~ * {
        display: none !important;
    }

    /* Concierge "Call" card */
    a[href^="tel:"] {
        color: #1e293b !important;
        text-decoration: none !important;
    }

    /* ---- Layout Fixes ---- */

    /* Remove sticky positioning */
    .sticky {
        position: relative !important;
        top: auto !important;
    }

    /* Full-width content (no sidebar constraint) */
    .lg\:col-span-2 {
        grid-column: span 3 / span 3 !important;
    }
    .lg\:col-span-1 {
        display: none !important;
    }

    /* Reset max-width for full page print */
    .max-w-\[1400px\] {
        max-width: 100% !important;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    /* Ensure images print */
    img {
        max-width: 100% !important;
        page-break-inside: avoid !important;
    }

    /* Luxury cards print cleanly */
    .luxury-card {
        border: 1px solid #e2e8f0 !important;
        page-break-inside: avoid !important;
    }

    /* Section page breaks */
    section {
        page-break-inside: avoid !important;
    }

    /* Itinerary days don't split across pages */
    .relative.z-10.pl-12 {
        page-break-inside: avoid !important;
    }

    /* Google Reviews card — hide in print */
    a[href*="g.page"] {
        display: none !important;
    }

    /* Similar tours section — optional, hide to keep brochure focused */
    /* Uncomment below to hide:
    section:has(h2:contains("Similar")) { display: none !important; }
    */

    /* Links: show URL after link text */
    a[href^="http"]:not([href*="unsplash"])::after {
        content: " (" attr(href) ")" !important;
        font-size: 8pt !important;
        color: #64748b !important;
        word-break: break-all !important;
    }

    /* Remove background gradients for ink saving */
    .bg-gradient-to-br,
    .bg-gradient-to-r,
    .bg-gradient-to-b,
    .bg-gradient-to-t {
        background: #fff !important;
    }

    /* Dark card headers in booking widget — invert for print */
    .from-slate-950 {
        background: #f8fafc !important;
        color: #1e293b !important;
    }
    .from-slate-950 * {
        color: #1e293b !important;
    }

    /* Hide mobile-only elements */
    .md\:hidden {
        display: none !important;
    }

    /* No body bottom padding from mobile nav */
    body {
        padding-bottom: 0 !important;
    }
}