/* ═══════════════════════════════════════════════
   OVIFONE NAVBAR — PROFI DARK (OFF-BLACK)
   ═══════════════════════════════════════════════ */

#global-nav {
    position: fixed !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important;
    height: 70px !important; 
    background: rgba(18, 18, 20, 0.98) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.5) !important;
    z-index: 9999 !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    transition: all 0.3s ease !important;
}

#global-nav.is-scrolled {
    background: rgba(14, 14, 16, 0.98) !important; 
    box-shadow: 0 6px 25px rgba(0,0,0,0.6) !important;
}

.nav-container {
    max-width: 1400px !important;
    margin: 0 auto !important;
    height: 70px !important;
    padding: 0 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
}

.nav-link {
    color: rgba(255, 255, 255, 0.75) !important; 
    font-size: 14px !important;
    font-weight: 600 !important;
    padding: 8px 4px !important;
    margin: 0 10px !important;
    border-radius: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    position: relative !important;
    transition: color 0.3s ease !important;
    text-decoration: none !important;
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: -2px; left: 0;
    width: 100%; height: 2px;
    background: #f49201;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.nav-link:hover { color: #ffffff !important; background: transparent !important; }
.nav-link:hover::after { transform: scaleX(1); transform-origin: left; }

.nav-link svg { 
    stroke: rgba(255,255,255,0.6) !important; 
    transition: all 0.3s !important; 
}
.nav-link:hover svg { 
    stroke: #f49201 !important; 
    transform: translateY(-2px); 
}
.chevron { opacity: 0.5 !important; }

.action-btn {
    width: 42px !important; height: 42px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 8px !important; 
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
    text-decoration: none !important;
}
.action-btn:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: #f49201 !important;
    transform: translateY(-2px) !important;
}
.action-btn svg { stroke: #ffffff !important; transition: stroke 0.3s ease !important;}
.action-btn:hover svg { stroke: #f49201 !important; }

.cart-badge { background: #f49201 !important; border: 2px solid #121214 !important; color: #fff !important; }

.menu-toggle { display: none !important; }
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    background-color: #ffffff !important; 
    border-radius: 0 !important; 
}

/* TRADE TOGGLE DESKTOP */
.trade-toggle-container { 
    margin-left: auto !important; 
    margin-right: 24px !important; 
    display: flex !important; 
    align-items: center !important; 
}
.trade-toggle-wrapper {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 100px !important; 
    padding: 4px !important;
    width: 240px !important; 
    position: relative !important; 
    display: flex !important; 
    align-items: center !important; 
    overflow: hidden !important;
    box-sizing: border-box !important;
}
.trade-slider-bg {
    position: absolute !important; 
    left: 4px !important; 
    top: 4px !important; 
    width: calc(50% - 4px) !important; 
    height: calc(100% - 8px) !important;
    background: linear-gradient(135deg, #f49201, #ffb833) !important; 
    border-radius: 100px !important;
    box-shadow: 0 2px 8px rgba(244,146,1,0.4) !important;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
    z-index: 1 !important; 
    pointer-events: none !important;
    box-sizing: border-box !important;
}
.trade-toggle-wrapper.is-vinde .trade-slider-bg { transform: translateX(100%) !important; }

.trade-option {
    position: relative !important; 
    z-index: 2 !important; 
    padding: 8px 0 !important;
    font-size: 13px !important; 
    font-weight: 700 !important;
    color: rgba(255,255,255,0.5) !important; 
    border-radius: 100px !important;
    display: flex !important; 
    align-items: center !important; 
    justify-content: center !important; 
    flex: 1 1 0px !important; 
    width: 50% !important; 
    gap: 6px !important;
    transition: color 0.3s ease !important; 
    cursor: pointer !important; 
    text-decoration: none !important;
    box-sizing: border-box !important;
}
.trade-option:hover { color: #ffffff !important; }
.trade-option.active { color: #fff !important; } 

/* TABLET & MOBIL */
@media (max-width: 1200px) {
    .menu-toggle { display: flex !important; }

    .trade-toggle-container {
        position: absolute !important; top: 70px !important; left: 0 !important;
        width: 100% !important; height: 60px !important;
        background: rgba(18, 18, 20, 0.98) !important;
        border-bottom: 1px solid rgba(255,255,255,0.05) !important;
        margin: 0 !important; justify-content: center !important; z-index: 10001 !important;
        box-sizing: border-box !important;
    }

    .nav-menu-wrapper {
        position: fixed !important; top: 130px !important; left: 0 !important;
        width: 100% !important; height: calc(100vh - 130px) !important;
        background: #ffffff !important; 
        padding: 30px 24px 100px !important; overflow-y: auto !important;
        opacity: 0 !important; visibility: hidden !important;
        transition: opacity 0.3s ease, visibility 0.3s !important; z-index: 10000 !important;
    }
    #global-nav.is-scrolled .nav-menu-wrapper { top: 70px !important; height: calc(100vh - 70px) !important; }
    #global-nav.menu-open .nav-menu-wrapper { opacity: 1 !important; visibility: visible !important; }

    .nav-menu { flex-direction: column !important; align-items: flex-start !important; width: 100% !important; gap: 0 !important; }
    
    .nav-link {
        width: 100% !important; font-size: 20px !important; font-weight: 800 !important;
        padding: 20px 0 !important; margin: 0 !important;
        border-bottom: 1px solid rgba(0,0,0,0.08) !important;
        color: #111 !important; 
        background: transparent !important; transform: translateY(16px) !important; opacity: 0 !important;
        transition: transform 0.3s ease, opacity 0.3s ease, color 0.2s ease, padding 0.3s ease !important;
    }
    .nav-link::after { display: none !important; } 
    #global-nav.menu-open .nav-link { transform: translateY(0) !important; opacity: 1 !important; color: #111 !important; }
    .nav-link:hover { color: #f49201 !important; padding-left: 12px !important; } 
    .nav-link svg:not(.chevron) { width: 24px !important; height: 24px !important; stroke: #f49201 !important; opacity: 1 !important; }
    .chevron { margin-left: auto !important; stroke: #999 !important; }
    
    #global-nav.menu-open .nav-item:nth-child(1) .nav-link { transition-delay: 0.04s !important; }
    #global-nav.menu-open .nav-item:nth-child(2) .nav-link { transition-delay: 0.08s !important; }
    #global-nav.menu-open .nav-item:nth-child(3) .nav-link { transition-delay: 0.12s !important; }
    #global-nav.menu-open .nav-item:nth-child(4) .nav-link { transition-delay: 0.16s !important; }
    #global-nav.menu-open .nav-item:nth-child(5) .nav-link { transition-delay: 0.20s !important; }
    #global-nav.menu-open .nav-item:nth-child(6) .nav-link { transition-delay: 0.24s !important; }
    #global-nav.menu-open .nav-item:nth-child(7) .nav-link { transition-delay: 0.28s !important; }

    #global-nav.menu-open { background: rgba(18, 18, 20, 1) !important; border-bottom: 1px solid rgba(255,255,255,0.05) !important; }
    #global-nav.menu-open .hamburger-inner,
    #global-nav.menu-open .hamburger-inner::before,
    #global-nav.menu-open .hamburger-inner::after { background-color: #ffffff !important; }
}

/* Search inline ascuns pe desktop */
.mobile-search-inline { display: none !important; }

/* MOBIL < 768px */
@media (max-width: 768px) {
    .menu-toggle { display: flex !important; }

    #global-nav { 
        height: 64px !important; 
        transition: height 0.3s cubic-bezier(0.25, 1, 0.5, 1), background 0.3s ease !important;
    }
    .nav-container { height: 64px !important; padding: 0 14px !important; }
    .nav-brand img { height: 50px !important; }
    .action-btn { width: 36px !important; height: 36px !important; border-radius: 8px !important; }
    .nav-actions { gap: 6px !important; }
    .action-btn svg { width: 17px !important; height: 17px !important; }

    .trade-toggle-container { display: none !important; }

    /* DOAR pe index + vinde: navbar mai mare cu 2 rânduri */
    #global-nav[data-show-toggle="1"] { height: 128px !important; }
    #global-nav[data-show-toggle="1"].is-scrolled { height: 64px !important; }

    #global-nav[data-show-toggle="1"] .nav-container {
        height: 100% !important;
        display: flex !important;
        align-items: flex-start !important;
        position: relative !important;
        padding-top: 0 !important;
    }

    #global-nav[data-show-toggle="1"] .nav-brand,
    #global-nav[data-show-toggle="1"] .nav-actions { height: 64px !important; }
    #global-nav[data-show-toggle="1"] .nav-actions { margin-left: auto !important; }

    #global-nav[data-show-toggle="1"] .trade-toggle-container {
        display: flex !important;
        position: absolute !important;
        top: 64px !important;
        left: 0 !important;
        width: 100% !important;
        height: 64px !important;
        background: rgba(18, 18, 20, 0.98) !important;
        border-bottom: 1px solid rgba(255,255,255,0.05) !important;
        align-items: center !important;
        justify-content: flex-start !important;
        padding: 0 14px !important;
        z-index: 2 !important;
        transition: opacity 0.25s ease, transform 0.3s ease !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        flex-direction: row !important;
        gap: 10px !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    #global-nav[data-show-toggle="1"] .trade-toggle-wrapper {
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: none !important;
        min-width: 140px !important;
    }

    /* Mobile search inline */
    /* Ascunde iconițele trade pe mobil */
    .trade-icon { display: none !important; }

    /* Search inline real */
    .mobile-search-inline {
        display: flex !important;
        align-items: center !important;
        flex: 1 1 0px !important;
        min-width: 0 !important;
        background: rgba(255,255,255,0.08) !important;
        border: 1.5px solid rgba(255,255,255,0.13) !important;
        border-radius: 14px !important;
        height: 42px !important;
        padding: 0 6px 0 14px !important;
        gap: 4px !important;
        box-sizing: border-box !important;
    }
    .mobile-search-input {
        flex: 1 !important;
        background: transparent !important;
        border: none !important;
        outline: none !important;
        color: #fff !important;
        font-size: 14px !important;
        font-weight: 400 !important;
        padding: 0 !important;
        min-width: 0 !important;
    }
    .mobile-search-input::placeholder {
        color: rgba(255,255,255,0.4) !important;
    }
    .mobile-search-btn {
        background: rgba(244,146,1,0.85) !important;
        border: none !important;
        border-radius: 10px !important;
        width: 32px !important;
        height: 32px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: pointer !important;
        flex-shrink: 0 !important;
        transition: background 0.2s ease !important;
    }
    .mobile-search-btn:active {
        background: #f49201 !important;
    }
    .mobile-search-btn svg {
        stroke: #fff !important;
    }

    #global-nav[data-show-toggle="1"].is-scrolled .trade-toggle-container {
        opacity: 0 !important;
        transform: translateY(-10px) !important;
        pointer-events: none !important;
    }

    .trade-toggle-wrapper {
        background: rgba(255,255,255,0.06) !important;
        border: 1px solid rgba(255,255,255,0.1) !important;
        border-radius: 100px !important;
        width: 100% !important;
        max-width: 320px !important;
        height: 46px !important; 
        margin: 0 auto !important; 
        padding: 4px !important; 
        box-sizing: border-box !important;
    }
    .trade-slider-bg {
        width: calc(50% - 4px) !important; 
        height: calc(100% - 8px) !important;
        left: 4px !important; top: 4px !important;
        box-shadow: 0 1px 6px rgba(244,146,1,0.35) !important;
        transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
        box-sizing: border-box !important;
        border-radius: 100px !important;
        background: linear-gradient(135deg, #f49201, #ffb833) !important;
    }
    .trade-option {
        flex: 1 1 0px !important; width: 50% !important; height: 100% !important;
        justify-content: center !important; align-items: center !important;
        padding: 0 !important; font-size: 14px !important; box-sizing: border-box !important;
    }
    .trade-option svg { width: 16px !important; height: 16px !important; }

    .nav-menu-wrapper {
        position: fixed !important; top: 64px !important; left: 0 !important;
        width: 100% !important; height: calc(100vh - 64px) !important;
        background: #ffffff !important; padding: 30px 24px 100px !important;
        overflow-y: auto !important; opacity: 0 !important; visibility: hidden !important;
        transition: opacity 0.3s ease, visibility 0.3s !important; z-index: 10000 !important;
    }
    #global-nav[data-show-toggle="1"] .nav-menu-wrapper { top: 128px !important; height: calc(100vh - 128px) !important; }
    #global-nav[data-show-toggle="1"].is-scrolled .nav-menu-wrapper { top: 64px !important; height: calc(100vh - 64px) !important; }
    #global-nav.menu-open .nav-menu-wrapper { opacity: 1 !important; visibility: visible !important; }

    .nav-menu { flex-direction: column !important; align-items: stretch !important; width: 100% !important; gap: 0 !important; }
    .nav-item { width: 100% !important; }
    .nav-link { width: 100% !important; font-size: 20px !important; font-weight: 800 !important; padding: 20px 0 !important; margin: 0 !important; border-bottom: 1px solid rgba(0,0,0,0.08) !important; color: #111 !important; background: transparent !important; transform: translateY(16px) !important; opacity: 0 !important; transition: transform 0.3s ease, opacity 0.3s ease, color 0.2s ease, padding 0.3s ease !important; }
    .nav-link::after { display: none !important; }
    #global-nav.menu-open .nav-link { transform: translateY(0) !important; opacity: 1 !important; color: #111 !important; }
    .nav-link:hover { color: #f49201 !important; padding-left: 12px !important; }
    .nav-link svg:not(.chevron) { width: 24px !important; height: 24px !important; stroke: #f49201 !important; opacity: 1 !important; }
    .chevron { margin-left: auto !important; stroke: #999 !important; }
    #global-nav.menu-open .nav-item:nth-child(1) .nav-link { transition-delay: 0.04s !important; }
    #global-nav.menu-open .nav-item:nth-child(2) .nav-link { transition-delay: 0.08s !important; }
    #global-nav.menu-open .nav-item:nth-child(3) .nav-link { transition-delay: 0.12s !important; }
    #global-nav.menu-open .nav-item:nth-child(4) .nav-link { transition-delay: 0.16s !important; }
    #global-nav.menu-open .nav-item:nth-child(5) .nav-link { transition-delay: 0.20s !important; }
    #global-nav.menu-open .nav-item:nth-child(6) .nav-link { transition-delay: 0.24s !important; }
    #global-nav.menu-open .nav-item:nth-child(7) .nav-link { transition-delay: 0.28s !important; }
    #global-nav.menu-open { background: rgba(18,18,20,1) !important; border-bottom: 1px solid rgba(255,255,255,0.05) !important; }
    #global-nav.menu-open .hamburger-inner, #global-nav.menu-open .hamburger-inner::before, #global-nav.menu-open .hamburger-inner::after { background-color: #ffffff !important; }
}

/* PADDING SUB NAVBAR */
.main-content, .vinde-main, main { padding-top: 70px !important; }

@media (max-width: 768px) {
    .main-content, .vinde-main, main { padding-top: 64px !important; }
}

/* SEARCH MODAL */
.overlay-modal {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: #ffffff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    z-index: 99999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 0.35s ease !important;
}
.overlay-modal.is-active {
    opacity: 1 !important;
    pointer-events: auto !important;
}
.overlay-modal .modal-content {
    width: 100% !important;
    max-width: 600px !important;
    padding: 40px !important;
    position: relative !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}
.overlay-modal .close-btn {
    position: absolute !important;
    top: -40px !important;
    right: 20px !important;
    color: #86868b !important;
    cursor: pointer !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
}
.overlay-modal .close-btn:hover { color: #1d1d1f !important; }
.overlay-modal .search-form-wrapper {
    display: flex !important;
    border-bottom: 2px solid #1d1d1f !important;
    padding-bottom: 10px !important;
    margin-bottom: 30px !important;
}
.overlay-modal .search-input {
    flex: 1 !important;
    border: none !important;
    background: transparent !important;
    font-size: 24px !important;
    font-weight: 500 !important;
    outline: none !important;
    font-family: inherit !important;
    color: #1d1d1f !important;
}
.overlay-modal .search-submit {
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    padding: 0 !important;
    color: #1d1d1f !important;
}
.overlay-modal .search-suggestions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    align-items: center !important;
}
.overlay-modal .suggestion-title {
    font-size: 14px !important;
    color: #86868b !important;
    font-weight: 500 !important;
}
.overlay-modal .suggestion-tag {
    background: #f5f5f7 !important;
    padding: 8px 16px !important;
    border-radius: 9999px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    border: 1px solid rgba(0,0,0,0.08) !important;
    cursor: pointer !important;
    font-family: inherit !important;
    transition: all 0.2s ease !important;
    color: #1d1d1f !important;
}
.overlay-modal .suggestion-tag:hover {
    background: #1d1d1f !important;
    color: #fff !important;
}

/* ═══════════════════════════════════════
   ACTIVE NAV ITEM
   ═══════════════════════════════════════ */
.nav-item.is-active > .nav-link,
.nav-item.is-active > .nav-link-row > .nav-link {
    color: #f49201 !important;
}
.nav-item.is-active > .nav-link svg,
.nav-item.is-active > .nav-link-row > .nav-link svg {
    stroke: #f49201 !important;
}

/* ═══════════════════════════════════════
   NAV LINK ROW (link + chevron button)
   ═══════════════════════════════════════ */
.nav-link-row {
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
}
.chevron-toggle {
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    padding: 2px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important;
    transition: background 0.2s ease !important;
    pointer-events: none !important;
}
.chevron-toggle .chevron {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), stroke 0.3s ease !important;
    stroke: rgba(255, 255, 255, 0.75) !important;
    opacity: 1 !important;
}
.has-mega-dropdown:hover .chevron-toggle .chevron {
    stroke: #f49201 !important;
}
.nav-item.is-active .chevron-toggle .chevron {
    stroke: #f49201 !important;
}

/* ═══════════════════════════════════════
   DROPDOWNS (Telefoane, Tablete, Căști, Accesorii)
   ═══════════════════════════════════════ */
.has-mega-dropdown {
    position: relative !important;
}
.acc-dropdown::before {
    content: '' !important;
    position: absolute !important;
    top: -16px !important;
    left: 0 !important;
    width: 100% !important;
    height: 16px !important;
    background: transparent !important;
}
.acc-dropdown {
    position: absolute !important;
    top: calc(100% + 12px) !important;
    left: 50% !important;
    transform: translateX(-50%) translateY(8px) !important;
    min-width: 220px !important;
    background: #1a1a1c !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 16px !important;
    padding: 8px !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s !important;
    z-index: 1000 !important;
    box-shadow: 0 20px 40px rgba(0,0,0,0.4) !important;
    backdrop-filter: blur(20px) !important;
}
.has-mega-dropdown:hover > .acc-dropdown,
.has-mega-dropdown:hover > .nav-link-row + .acc-dropdown {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateX(-50%) translateY(0) !important;
}
.acc-dropdown-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 10px 16px !important;
    color: rgba(255,255,255,0.75) !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    border-radius: 10px !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
}
.acc-dropdown-item:hover {
    background: rgba(244,146,1,0.12) !important;
    color: #f49201 !important;
}
.acc-dropdown-item svg {
    opacity: 0.6 !important;
    transition: opacity 0.2s ease !important;
    flex-shrink: 0 !important;
}
.acc-dropdown-item:hover svg {
    opacity: 1 !important;
    stroke: #f49201 !important;
}

/* Mobile: dropdown hidden by default, toggled via JS */
@media (max-width: 1024px) {
    .nav-link-row {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
    }
    .nav-link-row .nav-link {
        flex: 1 !important;
    }
    .chevron-toggle {
        display: flex !important;
        width: 44px !important;
        height: 44px !important;
        padding: 6px !important;
        border: none !important;
        outline: none !important;
        background: none !important;
        box-shadow: none !important;
        -webkit-appearance: none !important;
        border-radius: 12px !important;
        margin-left: auto !important;
        pointer-events: auto !important;
        touch-action: manipulation !important;
        -webkit-tap-highlight-color: transparent !important;
        cursor: pointer !important;
        align-items: center !important;
        justify-content: center !important;
    }
    .chevron-toggle:active {
        background: rgba(244,146,1,0.1) !important;
        transform: scale(0.9) !important;
    }
    .chevron-toggle .chevron {
        stroke: #999 !important;
        opacity: 1 !important;
        -webkit-transform: rotate(0deg) !important;
        transform: rotate(0deg) !important;
        -webkit-transition: -webkit-transform 0.3s ease, stroke 0.3s ease !important;
        transition: transform 0.3s ease, stroke 0.3s ease !important;
    }
    /* Override style.css hover rotate on mobile */
    .has-dropdown:hover .chevron,
    .has-mega-dropdown:hover .chevron {
        -webkit-transform: rotate(0deg) !important;
        transform: rotate(0deg) !important;
    }
    .has-mega-dropdown.mob-open .chevron-toggle .chevron,
    .has-mega-dropdown.mob-open:hover .chevron {
        -webkit-transform: rotate(180deg) !important;
        transform: rotate(180deg) !important;
        stroke: #f49201 !important;
    }
    .acc-dropdown {
        position: static !important;
        transform: none !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
        padding: 0 !important;
        min-width: unset !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        max-height: 0 !important;
        overflow: hidden !important;
        -webkit-transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.2s, opacity 0.2s ease, visibility 0s linear 0.5s !important;
        transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.2s, opacity 0.2s ease, visibility 0s linear 0.5s !important;
    }
    .has-mega-dropdown:hover > .acc-dropdown,
    .has-mega-dropdown:hover > .nav-link-row + .acc-dropdown {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        max-height: 0 !important;
        transform: none !important;
    }
    .nav-item.has-mega-dropdown.mob-open > .acc-dropdown {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        max-height: 250px !important;
        padding: 6px 0 !important;
        overflow: visible !important;
        display: block !important;
        height: auto !important;
        width: 100% !important;
        -webkit-transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s ease, visibility 0s linear 0s !important;
        transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s ease, visibility 0s linear 0s !important;
    }
    .acc-dropdown-item {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        padding: 10px 14px 10px 34px !important;
        font-size: 14px !important;
        color: #555 !important;
        text-decoration: none !important;
        border-radius: 12px !important;
        opacity: 0 !important;
        -webkit-transform: translateX(-12px) !important;
        transform: translateX(-12px) !important;
        -webkit-transition: opacity 0.15s ease, -webkit-transform 0.15s ease !important;
        transition: opacity 0.15s ease, transform 0.15s ease !important;
    }
    .nav-item.has-mega-dropdown.mob-open > .acc-dropdown > .acc-dropdown-item {
        opacity: 1 !important;
        -webkit-transform: translateX(0) !important;
        transform: translateX(0) !important;
        -webkit-transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1), -webkit-transform 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
        transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1), transform 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
    }
    .nav-item.has-mega-dropdown.mob-open > .acc-dropdown > .acc-dropdown-item:nth-child(1) { -webkit-transition-delay: 0.05s !important; transition-delay: 0.05s !important; }
    .nav-item.has-mega-dropdown.mob-open > .acc-dropdown > .acc-dropdown-item:nth-child(2) { -webkit-transition-delay: 0.1s !important; transition-delay: 0.1s !important; }
    .nav-item.has-mega-dropdown.mob-open > .acc-dropdown > .acc-dropdown-item:nth-child(3) { -webkit-transition-delay: 0.15s !important; transition-delay: 0.15s !important; }
    .nav-item.has-mega-dropdown.mob-open > .acc-dropdown > .acc-dropdown-item:nth-child(4) { -webkit-transition-delay: 0.2s !important; transition-delay: 0.2s !important; }
    .nav-item.has-mega-dropdown.mob-open > .acc-dropdown > .acc-dropdown-item:nth-child(5) { -webkit-transition-delay: 0.25s !important; transition-delay: 0.25s !important; }
    .nav-item.has-mega-dropdown.mob-open > .acc-dropdown > .acc-dropdown-item:nth-child(6) { -webkit-transition-delay: 0.3s !important; transition-delay: 0.3s !important; }
    .acc-dropdown-item:active {
        background: rgba(244,146,1,0.08) !important;
        color: #f49201 !important;
    }
    .acc-dropdown-item svg {
        stroke: #888 !important;
        width: 18px !important;
        height: 18px !important;
        flex-shrink: 0 !important;
    }
    .acc-dropdown-item:active svg {
        stroke: #f49201 !important;
    }
}