/*
 * === Localization Dropdown Styles ===
 */

/* 1. Fix for dropdown opening BEHIND hero content */
.header-6 {
    /* position: relative; is likely already set, but this ensures z-index works */
    position: relative;
    z-index: 100; /* Lifts the whole header above the hero image */
}

/* 2. Style for the flag-only dropdown button */
#lang-dropdown .dropdown-toggle {
    /* Match padding of other nav items */
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 12px;
    padding-right: 12px;
    line-height: 1;
}

/* 3. Style for the main flag icon */
#lang-dropdown .dropdown-toggle .flag-icon {
    font-size: 1.2rem; /* Make the flag a bit bigger */
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    border-radius: 2px;
    vertical-align: middle; /* Align it nicely with the nav text */
}

/* 4. Remove the default Bootstrap dropdown arrow */
#lang-dropdown .dropdown-toggle::after {
    display: none;
}

/* 5. Style the dropdown menu itself */
#lang-dropdown .dropdown-menu {
    right: 0;  /* Align to the right edge */
    left: auto;
    min-width: auto; /* Let it size to the content (e.g., "English (US)") */
    z-index: 1050; /* Ensure menu is on top of everything */
}

/* 6. Style the flags inside the menu */
#lang-dropdown .dropdown-item .flag-icon {
    font-size: 1rem;
    margin-right: 10px;
    box-shadow: none; /* No shadow for menu items */
}