/* Header navigation for Step 1.
   This file contains only the independent navigation/dropdown styles. */

.site-main-navigation {
    position: relative;
    z-index: 60;
}

.site-main-navigation > ul {
    display: flex;
    align-items: center;
    gap: 1.75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-main-navigation li {
    position: relative;
    list-style: none;
}

.site-main-navigation > ul > li > a {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
    font-size: 1.125rem;
    font-weight: 500;
    transition: color .2s ease, opacity .2s ease;
}

.site-main-navigation > ul > li > a:hover,
.site-main-navigation > ul > li > a:focus-visible {
    color: #dbeafe;
}

.site-nav-chevron {
    font-size: .7rem;
    transition: transform .2s ease;
}

.site-nav-dropdown {
    position: absolute;
    top: calc(100% + .65rem);
    left: 0;
    min-width: 210px;
    margin: 0;
    padding: .55rem 0;
    background: #fff;
    border-radius: .65rem;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .18);
    border: 1px solid rgba(15, 23, 42, .08);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity .18s ease, visibility .18s ease, transform .18s ease;
    z-index: 100;
}

.site-nav-dropdown li a {
    display: block;
    padding: .65rem 1rem;
    color: #374151;
    text-decoration: none;
    font-size: .98rem;
    font-weight: 500;
    white-space: nowrap;
}

.site-nav-dropdown li a:hover,
.site-nav-dropdown li a:focus-visible {
    color: #0369a1;
    background: #f0f9ff;
}

.site-nav-dropdown-parent:hover > .site-nav-dropdown,
.site-nav-dropdown-parent:focus-within > .site-nav-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.site-nav-dropdown-parent:hover .site-nav-chevron,
.site-nav-dropdown-parent:focus-within .site-nav-chevron {
    transform: rotate(180deg);
}

/* Keep the existing mobile drawer design; only arrange its new navigation. */
#mobileMenu .site-mobile-navigation {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    margin: 0;
    padding: 0 1rem 2rem;
    list-style: none;
}

#mobileMenu .site-mobile-navigation > li {
    width: 100%;
    text-align: center;
}

#mobileMenu .site-mobile-navigation > li > a {
    display: block;
    padding: .55rem .35rem;
    color: #fff;
    text-decoration: none;
    font-size: 1.15rem;
    font-weight: 500;
}

#mobileMenu .site-mobile-navigation > li > a:hover,
#mobileMenu .site-mobile-navigation > li > a:focus-visible {
    color: #dbeafe;
}

#mobileMenu .site-mobile-dropdown {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    margin: .15rem 0 .55rem;
    padding: .35rem .75rem;
    background: rgba(0, 0, 0, .14);
    border-radius: .5rem;
    list-style: none;
}

#mobileMenu .site-mobile-dropdown a {
    display: block;
    padding: .45rem .25rem;
    color: #e0f2fe;
    text-decoration: none;
    font-size: .98rem;
}

#mobileMenu .site-mobile-dropdown a:hover,
#mobileMenu .site-mobile-dropdown a:focus-visible {
    color: #fff;
}

@media (max-width: 767px) {
    .site-main-navigation {
        display: none;
    }
}

#mobileMenu.mobile-menu {
    display: block !important;
    position: fixed !important;
    top: 0 !important;
    right: -320px !important;
    left: auto !important;
    width: min(320px, 86vw) !important;
    max-width: 320px !important;
    height: 100vh !important;
    overflow-y: auto !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: linear-gradient(135deg, #06b6d4 0%, #0284c7 55%, #0369a1 100%) !important;
    box-sizing: border-box !important;
    z-index: 10001 !important;
}
#mobileMenu.mobile-menu.open { right: 0 !important; }
#mobileMenu.mobile-menu .site-mobile-navigation,
#mobileMenu.mobile-menu .site-mobile-dropdown {
    display: flex !important;
    visibility: visible !important;
}
#mobileMenu.mobile-menu .site-mobile-navigation {
    flex-direction: column !important;
}
#mobileMenuOverlay.mobile-menu-overlay { z-index: 10000 !important; }

/* Responsive header correction: keep the logo and hamburger usable on all phones. */
/* eLucknow mobile header/menu correction.
   Keeps the logo at a minimum 200px and forces the drawer above the overlay. */
header .elucknow-header-logo > a > span {
    display: inline-block !important;
    flex: 0 0 200px !important;
    width: 200px !important;
    min-width: 200px !important;
    max-width: 260px !important;
}
header .elucknow-logo-image {
    display: block !important;
    width: 200px !important;
    min-width: 200px !important;
    max-width: 260px !important;
    height: auto !important;
    min-height: 44px;
    object-fit: contain;
    object-position: left center;
}
.elucknow-mobile-menu-button {
    display: none;
	background: transparent;
    flex: 0 0 46px !important;
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    margin-left: 10px !important;
    padding: 8px !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    z-index: 10002 !important;
}
.elucknow-mobile-menu-button svg { display:block !important; width:30px !important; height:30px !important; }
@media (max-width:1023px) {
    header .container {
        min-width: 260px !important;
        width: max(calc(100% - 20px), 260px) !important;
        max-width: none !important;
        display:flex !important;
        align-items:center !important;
        justify-content:space-between !important;
        overflow:visible !important;
    }
    .site-main-navigation { display:none !important; }
    .elucknow-header-account { display:none !important; }
    .elucknow-header-logo { flex:0 0 200px !important; width:200px !important; min-width:200px !important; max-width:260px !important; }
    .elucknow-mobile-menu-button { display:inline-flex !important; visibility:visible !important; opacity:1 !important; }
}
@media (min-width:1024px) { .elucknow-mobile-menu-button { display:none !important; } }