/* CRITICAL DROPDOWN FIXES - Architect's Definitive Solution */
/* Ensures dropdowns work reliably across ALL pages with robust .is-open rules */

/* 1. LANGUAGE SWITCHER DROPDOWN - ROBUST .is-open IMPLEMENTATION */
.language-switcher__dropdown {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    min-width: 120px;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.2s ease;
}

/* MULTIPLE SELECTORS FOR MAXIMUM RELIABILITY */
.language-switcher.is-open .language-switcher__dropdown,
.language-switcher__dropdown.is-open {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

/* 2. MOBILE MENU DROPDOWN - ROBUST .is-open IMPLEMENTATION */
.header__mobile-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-top: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.2s ease;
}

/* MULTIPLE SELECTORS FOR MAXIMUM RELIABILITY */
.header__mobile-menu.is-open {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

/* 3. ACTIVE STATES FOR TOGGLE BUTTONS */
.language-switcher.is-open .language-switcher__toggle,
.language-switcher__toggle[aria-expanded="true"] {
    background: rgba(255, 255, 255, 0.1);
}

.header__menu-toggle[aria-expanded="true"] {
    background: rgba(255, 255, 255, 0.1);
}

/* 4. MOBILE NAVIGATION STYLING */
.mobile-nav__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mobile-nav__item {
    border-bottom: 1px solid #E2E8F0;
}

.mobile-nav__item:last-child {
    border-bottom: none;
}

.mobile-nav__link {
    display: block;
    padding: 12px 16px;
    color: #2D3748;
    text-decoration: none;
    transition: background-color 0.15s ease;
}

.mobile-nav__link:hover {
    background: #F7F8FC;
    color: #052e12;
}

/* 5. LANGUAGE SWITCHER DROPDOWN STYLING */
.language-switcher__link {
    display: block;
    padding: 8px 12px;
    color: #2D3748;
    text-decoration: none;
    font-size: var(--font-size-sm, 0.875rem);
    transition: background-color 0.15s ease;
}

.language-switcher__link:hover {
    background: #F7F8FC;
    color: #052e12;
}

.language-switcher__link--current {
    font-weight: var(--font-weight-semibold, 600);
    background: #F7F8FC;
}

/* 6. RESPONSIVE ADJUSTMENTS */
@media (max-width: 768px) {
    .header__mobile-menu {
        position: absolute; /* Changed from fixed to absolute */
        top: 100%; /* Position directly under the header */
        right: 0; /* Align to right edge under toggle button */
        left: auto; /* Remove left positioning */
        width: 280px; /* Set specific width instead of full width */
        max-height: calc(100vh - 80px);
        overflow-y: auto;
        background: #FFFFFF;
        border: 1px solid #E2E8F0;
        border-radius: 4px;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
        margin-top: 4px; /* Small gap from header */
    }
    
    .language-switcher__dropdown {
        position: absolute; /* Changed from fixed to absolute */
        top: 100%; /* Position under the toggle button */
        right: 0;
        left: auto;
        width: 200px; /* Set specific width */
        transform-origin: top right;
        margin-top: 4px; /* Small gap from toggle button */
    }
}

/* 7. ACCESSIBILITY FOCUS STATES */
.language-switcher__toggle:focus,
.header__menu-toggle:focus {
    outline: 2px solid #10B981;
    outline-offset: 2px;
}

.mobile-nav__link:focus,
.language-switcher__link:focus {
    outline: 2px solid #10B981;
    outline-offset: -2px;
}