/* Additional styles to replace React-based dynamic styles */
html { scroll-behavior: smooth; }

.accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
}

.accordion-content.open {
    max-height: 500px; /* Approximate max height */
}

.accordion-trigger svg {
    transition: transform 0.3s ease;
}

.accordion-trigger.open svg {
    transform: rotate(180deg);
}

/* Mobile menu styles */
#mobile-menu {
    display: flex;
}

#mobile-menu:not(.open) {
    opacity: 0;
    pointer-events: none;
}

#mobile-menu.open {
    opacity: 1;
    pointer-events: auto;
}

/* Voucher section - improved text readability */
#vouchers .container > div {
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}

#vouchers h2 {
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.6);
}

#vouchers p {
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
}

/* FAQ Accordion animations */
#faq [data-slot="accordion-content"] {
    transition: max-height 0.3s ease-out, opacity 0.2s ease-out, padding 0.3s ease-out;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
}

#faq [data-slot="accordion-content"][data-state="open"] {
    max-height: 500px;
    opacity: 1;
}

#faq [data-slot="accordion-content"][data-state="closed"] {
    max-height: 0;
    opacity: 0;
}

#faq [data-slot="accordion-content"]:not([hidden]) {
    display: block;
}

/* Menu Accordion animations */
#menu [data-loc*="Menu.tsx:79"] {
    transition: grid-template-rows 0.5s ease, opacity 0.5s ease;
}

#menu [data-loc*="Menu.tsx:40"] svg.lucide-chevron-down {
    transition: transform 0.5s ease;
}

/* Menu background images - show when opened */
#menu [data-menu-open="true"] [data-loc*="Menu.tsx:50"] {
    opacity: 1 !important;
}

#menu [data-menu-open="false"] [data-loc*="Menu.tsx:50"] {
    opacity: 0 !important;
}

/* On large screens, show images when menu is open by default */
@media (min-width: 1024px) {
    #menu [data-loc*="Menu.tsx:40"]:not([data-menu-open="false"]) [data-loc*="Menu.tsx:50"] {
        opacity: 1;
    }
}