/* === dayuse/index.html === */
/* Accordion Animation */
details>summary {
    list-style: none;
}

details>summary::-webkit-details-marker {
    display: none;
}

details[open] summary~* {
    animation: slideDown 0.3s ease-in-out;
}

@keyframes slideDown {
    0% {
        opacity: 0;
        transform: translateY(-10px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.glass-accordion {
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.4);
    transition: all 0.2s ease;
}

.glass-accordion:hover {
    background: rgba(255, 255, 255, 0.98);
}

/* Active Menu State (matches main site) */
.nav-link.active {
    color: #FB8500;
    font-weight: 700;
    border-bottom: 2px solid #FB8500;
}

/* Keep Hugeicons visually centered */
i.hgi-stroke {
    display: inline-block;
    line-height: 1;
    vertical-align: -0.12em;
}

/* === dayuse/reservation.html === */
        .glass-card {
            background: rgba(255, 255, 255, 0.92);
            backdrop-filter: blur(12px);
            border: 1px solid rgba(226, 232, 240, 0.9);
            box-shadow: 0 16px 38px -28px rgba(15, 23, 42, 0.45);
        }

        .fade-in {
            animation: fadeIn 0.5s ease-in-out;
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
                transform: translateY(10px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* --- Flatpickr Custom Theme --- */
        .flatpickr-calendar {
            --dayuse-datepicker-padding-x: 8px;
            background: rgba(255, 255, 255, 0.95);
            backdrop-filter: blur(12px);
            border: 1px solid rgba(255, 255, 255, 0.5);
            box-shadow: 0 10px 30px -10px rgba(0, 168, 150, 0.15), 0 1px 3px rgba(0, 0, 0, 0.05);
            border-radius: 16px;
            font-family: 'Poppins', sans-serif;
            padding: 0;
            width: min(323.875px, calc(100vw - 24px)) !important;
            max-width: calc(100vw - 24px);
            box-sizing: border-box;
            z-index: 99999 !important;
            transition: opacity 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
        }

        .flatpickr-calendar.dayuse-birth-date-calendar {
            left: var(--dayuse-datepicker-left, auto) !important;
            position: fixed !important;
            top: var(--dayuse-datepicker-top, auto) !important;
            width: var(--dayuse-datepicker-width, min(323.875px, calc(100vw - 24px))) !important;
            max-width: var(--dayuse-datepicker-width, min(323.875px, calc(100vw - 24px)));
        }

        .flatpickr-calendar.dayuse-birth-date-calendar .flatpickr-rContainer,
        .flatpickr-calendar.dayuse-birth-date-calendar .flatpickr-days,
        .flatpickr-calendar.dayuse-birth-date-calendar .dayContainer {
            box-sizing: border-box;
            max-width: none !important;
            min-width: 0 !important;
            width: calc(var(--dayuse-datepicker-width, 323.875px) - (var(--dayuse-datepicker-padding-x) * 2)) !important;
        }

        .flatpickr-calendar.dayuse-birth-date-calendar .flatpickr-weekdays {
            width: 100%;
        }

        .flatpickr-calendar.dayuse-birth-date-calendar .flatpickr-day {
            max-width: none;
        }

        .flatpickr-months {
            width: 100%;
            box-sizing: border-box;
            padding: 8px var(--dayuse-datepicker-padding-x) 2px;
        }

        .flatpickr-innerContainer {
            width: 100%;
            box-sizing: border-box;
            padding: 0 var(--dayuse-datepicker-padding-x) 8px;
        }

        @media (max-width: 360px) {
            .flatpickr-calendar {
                --dayuse-datepicker-padding-x: 4px;
            }

            .flatpickr-calendar .flatpickr-rContainer,
            .flatpickr-calendar .flatpickr-days,
            .flatpickr-calendar .dayContainer {
                width: calc(100vw - 32px) !important;
                min-width: 0 !important;
                max-width: none !important;
                box-sizing: border-box;
            }

            .flatpickr-calendar .flatpickr-day {
                max-width: none;
            }

            .flatpickr-calendar .flatpickr-monthDropdown-months,
            .flatpickr-calendar .flatpickr-current-month input.numInput {
                font-size: 13px !important;
            }
        }

        .flatpickr-day.selected {
            background: #00A896 !important;
            border-color: #00A896 !important;
        }

        .dayuse-inline-calendar .flatpickr-calendar.inline {
            position: static !important;
            width: 100% !important;
            max-width: none;
            background: #ffffff;
            border: 1px solid rgba(203, 213, 225, 0.9);
            border-radius: 18px;
            box-shadow: 0 16px 34px -28px rgba(15, 23, 42, 0.65);
            margin-left: auto;
            margin-right: auto;
            padding: 18px 20px 16px;
        }

        .dayuse-inline-calendar {
            max-width: 100%;
            margin-left: auto;
            margin-right: auto;
        }

        .dayuse-inline-calendar .flatpickr-months {
            align-items: center;
            min-height: 44px;
            padding: 0 32px 14px;
            position: relative;
        }

        .dayuse-inline-calendar .flatpickr-current-month {
            align-items: center;
            display: flex;
            justify-content: center;
            padding-top: 0;
            font-size: 105%;
            font-weight: 800;
            color: #0f172a;
        }

        .dayuse-inline-calendar .flatpickr-monthDropdown-months,
        .dayuse-inline-calendar .numInputWrapper {
            font-weight: 800;
        }

        .dayuse-inline-calendar .flatpickr-prev-month,
        .dayuse-inline-calendar .flatpickr-next-month {
            align-items: center;
            border: 1px solid #e2e8f0;
            border-radius: 10px;
            color: #0f172a;
            display: flex;
            height: 34px;
            justify-content: center;
            padding: 0;
            top: 0 !important;
            width: 34px;
        }

        .dayuse-inline-calendar .flatpickr-prev-month {
            left: 32px !important;
        }

        .dayuse-inline-calendar .flatpickr-next-month {
            right: 32px !important;
        }

        .dayuse-inline-calendar .flatpickr-prev-month:hover,
        .dayuse-inline-calendar .flatpickr-next-month:hover {
            background: #f8fafc;
            color: #00A896;
        }

        .dayuse-inline-calendar .flatpickr-weekdays {
            height: auto;
            border-bottom: 1px solid #e5e7eb;
            padding: 0 0 12px;
        }

        .dayuse-inline-calendar span.flatpickr-weekday {
            color: #64748b;
            font-size: 12px;
            font-weight: 800;
            text-transform: capitalize;
        }

        .dayuse-inline-calendar .flatpickr-rContainer,
        .dayuse-inline-calendar .flatpickr-days,
        .dayuse-inline-calendar .dayContainer {
            width: 100% !important;
            min-width: 0 !important;
            max-width: none !important;
        }

        .dayuse-inline-calendar .dayContainer {
            display: grid !important;
            grid-template-columns: repeat(7, minmax(0, 1fr));
            gap: 8px 28px;
            padding-top: 12px;
        }

        .dayuse-inline-calendar .flatpickr-day {
            align-items: center;
            border: 1px solid transparent;
            display: flex;
            justify-content: center;
            justify-self: center;
            max-width: none;
            width: 38px;
            height: 38px;
            line-height: 1;
            margin: 0;
            border-radius: 999px;
            font-size: 13px;
            font-weight: 800;
            position: relative;
        }

        .dayuse-inline-calendar .flatpickr-day.dayuse-available:not(.selected) {
            background: #dcfce7 !important;
            border-color: #bbf7d0 !important;
            color: #14532d !important;
        }

        .dayuse-inline-calendar .flatpickr-day.dayuse-closed:not(.selected) {
            background: #f1f5f9 !important;
            border-color: #e2e8f0 !important;
            color: #94a3b8 !important;
        }

        .dayuse-inline-calendar .flatpickr-day.prevMonthDay,
        .dayuse-inline-calendar .flatpickr-day.nextMonthDay {
            background: transparent !important;
            border-color: transparent !important;
            color: #cbd5e1 !important;
        }

        .dayuse-inline-calendar .flatpickr-day.flatpickr-disabled,
        .dayuse-inline-calendar .flatpickr-day.notAllowed {
            cursor: not-allowed;
            opacity: 1;
        }

        .dayuse-inline-calendar .flatpickr-day.selected {
            background: #00A896 !important;
            border-color: #00A896 !important;
            color: #ffffff !important;
            box-shadow: 0 12px 20px -10px rgba(0, 168, 150, 0.85);
            font-weight: 800;
        }

        .dayuse-reservation-section {
            padding-bottom: 96px;
        }

        .visitor-form-grid {
            display: grid;
            gap: 0.75rem;
        }

        .visitor-full-row {
            grid-column: 1 / -1;
            width: 100%;
        }

        .visitor-ticket-options {
            display: grid;
            gap: 12px;
            width: 100%;
        }

        .visitor-summary-item {
            align-items: center;
            display: flex;
            flex-direction: row;
            gap: 24px;
            justify-content: space-between;
            padding: 18px 28px;
            width: 100%;
        }

        .visitor-summary-left {
            align-items: center;
            display: flex;
            flex: 1 1 auto;
            gap: 16px;
            min-width: 0;
        }

        .visitor-summary-price {
            flex: 0 0 auto;
            font-weight: 700;
            margin-left: auto;
            text-align: right;
            white-space: nowrap;
        }

        .visitor-info-tooltip {
            position: relative;
        }

        .visitor-info-tooltip__button {
            align-items: center;
            background: #f1f5f9;
            border: 1px solid #e2e8f0;
            border-radius: 999px;
            color: #475569;
            display: inline-flex;
            font-size: 10px;
            font-weight: 800;
            height: 18px;
            justify-content: center;
            line-height: 1;
            width: 18px;
        }

        .visitor-info-tooltip__content {
            background: #0f172a;
            border-radius: 10px;
            bottom: calc(100% + 8px);
            box-shadow: 0 16px 30px -18px rgba(15, 23, 42, 0.7);
            color: #ffffff;
            font-size: 12px;
            font-weight: 600;
            left: 50%;
            line-height: 1.35;
            max-width: min(280px, 78vw);
            opacity: 0;
            padding: 10px 12px;
            pointer-events: none;
            position: absolute;
            transform: translateX(-50%) translateY(4px);
            transition: opacity 160ms ease, transform 160ms ease;
            visibility: hidden;
            width: max-content;
            z-index: 30;
        }

        .visitor-info-tooltip__content::after {
            border-left: 7px solid transparent;
            border-right: 7px solid transparent;
            border-top: 7px solid #0f172a;
            content: "";
            left: 50%;
            position: absolute;
            top: 100%;
            transform: translateX(-50%);
        }

        .visitor-info-tooltip:hover .visitor-info-tooltip__content,
        .visitor-info-tooltip:focus-within .visitor-info-tooltip__content {
            opacity: 1;
            transform: translateX(-50%) translateY(0);
            visibility: visible;
        }

        @media (min-width: 640px) {
            .visitor-ticket-options {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

        @media (max-width: 480px) {
            .visitor-summary-item {
                gap: 12px;
                padding: 14px 16px;
            }

            .visitor-summary-left {
                gap: 12px;
            }

            .visitor-summary-price {
                font-size: 0.8125rem;
            }
        }

        @media (min-width: 768px) {
            .visitor-form-grid {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }
        }

        /* --- Stepper Journey Pro Max --- */
        .stepper-container {
            perspective: 1000px;
        }

        .step-indicator-card {
            transition: all 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
            position: relative;
            z-index: 20;
        }

        /* Active State: Floating Liquid Orb */
        .step-active {
            transform: scale(1.15) translateY(-2px);
            box-shadow: 
                0 10px 25px -5px rgba(0, 168, 150, 0.4),
                0 0 30px rgba(0, 168, 150, 0.2);
            animation: orb-float 3s ease-in-out infinite;
        }

        @keyframes orb-float {
            0%, 100% { transform: scale(1.15) translateY(-2px); }
            50% { transform: scale(1.18) translateY(-5px); }
        }

        /* Completed State: Solid Success */
        .step-completed {
            background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
            border-color: transparent !important;
            color: white !important;
            box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
        }

        /* Progress Bar: Liquid Flow */
        .stepper-progress-bg {
            background: rgba(0, 0, 0, 0.03);
            height: 3px;
            border-radius: 10px;
        }

        .stepper-progress-fill {
            background: linear-gradient(90deg, #10b981 0%, #00A896 50%, #007AFF 100%);
            height: 100%;
            border-radius: 10px;
            box-shadow: 0 0 15px rgba(0, 168, 150, 0.4);
            transition: width 1s cubic-bezier(0.65, 0, 0.35, 1);
        }

        /* Staggered Entrance */
        .animate-stagger-step {
            animation: step-in 0.8s cubic-bezier(0.22, 1, 0.36, 1) both;
        }
        .step-delay-1 { animation-delay: 100ms; }
        .step-delay-2 { animation-delay: 250ms; }
        .step-delay-3 { animation-delay: 400ms; }

        @keyframes step-in {
            from { opacity: 0; transform: translateY(20px) scale(0.8); }
            to { opacity: 1; transform: translateY(0) scale(1); }
        }

        /* Ensure text visibility */
        [data-step-indicator] {
            font-size: 0.875rem;
            letter-spacing: -0.01em;
        }
        [data-step-content].hidden {
            display: none !important;
        }

        /* --- Liquid Error States --- */
        .field-error {
            border-color: #ef4444 !important;
            box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.1), 0 0 20px rgba(239, 68, 68, 0.05) !important;
            animation: shake-error 0.5s cubic-bezier(.36,.07,.19,.97) both;
        }



        .animate-shake {
            animation: shake-error 0.5s cubic-bezier(.36,.07,.19,.97) both;
        }

        @keyframes shake-error {
            10%, 90% { transform: translate3d(-1px, 0, 0); }
            20%, 80% { transform: translate3d(2px, 0, 0); }
            30%, 50%, 70% { transform: translate3d(-4px, 0, 0); }
            40%, 60% { transform: translate3d(4px, 0, 0); }
        }

        .error-message {
            color: #ef4444;
            font-size: 0.75rem;
            font-weight: 600;
            margin-top: 0.25rem;
            animation: fade-in-up 0.3s ease-out;
        }

        @keyframes fade-in-up {
            from { opacity: 0; transform: translateY(5px); }
            to { opacity: 1; transform: translateY(0); }
        }

/* === js/dayuse-login-modal.js / login modal === */
.dayuse-auth-overlay{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(15,23,42,.46);backdrop-filter:blur(14px)}
            .dayuse-auth-card{position:relative;width:min(500px,100%);max-height:calc(100vh - 40px);overflow:auto;border:1px solid rgba(255,255,255,.72);border-radius:28px;background:linear-gradient(180deg,#fff 0%,#f8fbfb 100%);box-shadow:0 34px 90px rgba(15,23,42,.25)}
            .dayuse-auth-close{position:absolute;top:18px;right:18px;display:grid;place-items:center;width:42px;height:42px;border:0;border-radius:14px;background:#f1f5f9;color:#475569;cursor:pointer;transition:.18s}
            .dayuse-auth-close:hover{background:#e2e8f0;color:#0f172a}
            .dayuse-auth-head{padding:34px 34px 18px}
            .dayuse-auth-kicker{display:flex;align-items:center;gap:12px;color:#0f766e;font-size:12px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
            .dayuse-auth-lock{display:grid;place-items:center;width:46px;height:46px;border-radius:16px;background:#dff8f3;color:#00a896}
            .dayuse-auth-title{margin:22px 0 0;color:#020617;font-size:34px;line-height:1.08;font-weight:950;letter-spacing:-.03em}
            .dayuse-auth-copy{margin:14px 0 0;color:#64748b;font-size:16px;font-weight:650;line-height:1.5}
            .dayuse-auth-body{padding:0 34px 34px}
            .dayuse-auth-social{display:grid;gap:12px;margin-top:8px}
            .dayuse-auth-social-button{display:grid;grid-template-columns:24px 1fr 24px;align-items:center;min-height:58px;width:100%;border-radius:16px;border:1px solid #dbe3ef;background:#fff;color:#273244;padding:0 18px;font-size:15px;font-weight:850;line-height:1;cursor:pointer;box-shadow:0 10px 24px rgba(15,23,42,.06);transition:.18s}
            .dayuse-auth-social-button span{justify-self:center;white-space:nowrap}
            .dayuse-auth-social-button svg{justify-self:center;width:22px;height:22px}
            .dayuse-auth-social-button:hover{transform:translateY(-1px);border-color:#9ee7dc;box-shadow:0 16px 34px rgba(15,23,42,.1)}
            .dayuse-auth-social-button.apple{background:#101827;color:#fff;border-color:#101827;font-weight:900}
            .dayuse-auth-social-button.apple svg{width:22px;height:22px;color:#fff;transform:translateY(-1px)}
            .dayuse-auth-social-button[hidden],.dayuse-auth-social[hidden],.dayuse-auth-divider[hidden],.dayuse-auth-form[hidden],#dayuse-google-native[hidden]{display:none!important}
            #dayuse-google-native{display:grid;place-items:center;width:100%;min-height:58px}
            #dayuse-google-native>div,#dayuse-google-native iframe{width:100%!important;max-width:100%!important}
            .dayuse-auth-divider{display:flex;align-items:center;gap:14px;margin:22px 0;color:#94a3b8;font-size:12px;font-weight:950;letter-spacing:.14em;text-transform:uppercase}
            .dayuse-auth-divider:before,.dayuse-auth-divider:after{content:"";height:1px;flex:1;background:#e2e8f0}
            .dayuse-auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px;padding:6px;border-radius:18px;background:#eef4f3}
            .dayuse-auth-tab{min-height:48px;border:0;border-radius:14px;background:transparent;color:#475569;font-size:15px;font-weight:900;cursor:pointer;transition:.18s}
            .dayuse-auth-tab.is-active{background:#00a896;color:#fff;box-shadow:0 12px 24px rgba(0,168,150,.24)}
            .dayuse-auth-form{display:grid;gap:12px}
            .dayuse-auth-input{width:100%;min-height:54px;border:1px solid #dbe3ef;border-radius:16px;background:#fff;padding:0 16px;color:#0f172a;font-size:15px;font-weight:750;outline:0;transition:.18s}
            .dayuse-auth-input::placeholder{color:#94a3b8}
            .dayuse-auth-input:focus{border-color:#00a896;box-shadow:0 0 0 4px rgba(0,168,150,.13)}
            .dayuse-auth-submit{position:relative;min-height:56px;border:0;border-radius:16px;background:#00a896;color:#fff;font-size:16px;font-weight:950;cursor:pointer;box-shadow:0 18px 34px rgba(0,168,150,.25);transition:.18s}
            .dayuse-auth-submit:hover{transform:translateY(-1px);background:#0077b6}
            .dayuse-auth-submit.secondary{background:#0077b6;box-shadow:0 18px 34px rgba(0,119,182,.22)}
            .dayuse-auth-message{margin-top:14px;border-radius:14px;border:1px solid;padding:12px 14px;font-size:13px;font-weight:800;text-align:center}
            .dayuse-auth-message-error{border-color:#fecaca;background:#fef2f2;color:#991b1b}
            .dayuse-auth-message-success{border-color:#a7f3d0;background:#ecfdf5;color:#047857}
            .dayuse-auth-message-info{border-color:#dbe3ef;background:#f8fafc;color:#475569}
            .dayuse-auth-terms{margin:18px 0 0;text-align:center;color:#94a3b8;font-size:12px;font-weight:800;line-height:1.5}
            @media (max-width:520px){.dayuse-auth-card{border-radius:22px}.dayuse-auth-head,.dayuse-auth-body{padding-left:22px;padding-right:22px}.dayuse-auth-title{font-size:29px}}

.vt-site-header { view-transition-name: site-header; }
.vt-page-content { view-transition-name: page-content; }