/* =========================================
   RZ SPORTS - GLOBAL NAVBAR FINAL FIX
========================================= */

.header .navbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 22px !important;
}

.header .logo {
    flex: 0 0 auto !important;
    margin: 0 !important;
}

.header .nav-links {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 1 1 auto !important;

    gap: 34px !important;

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;
}

.header .nav-links > li {
    position: relative !important;

    flex: 0 0 auto !important;

    margin: 0 !important;
    padding: 0 !important;
}

.header .nav-links > li > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 12px 0 !important;

    white-space: nowrap !important;
}

.header .nav-category-menu {
    margin: 0 !important;
    padding: 0 !important;
}

.header .category-arrow {
    margin-left: 5px !important;
}

.header .nav-actions {
    display: flex !important;
    align-items: center !important;

    flex: 0 0 auto !important;

    gap: 10px !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 820px) {

    .header .navbar {
        position: relative !important;

        gap: 10px !important;

        justify-content: space-between !important;
    }

    .header .nav-links {
        display: none !important;

        position: absolute !important;

        top: 100% !important;
        left: 0 !important;
        right: 0 !important;

        width: 100% !important;

        flex-direction: column !important;
        align-items: stretch !important;

        gap: 0 !important;

        margin: 0 !important;
        padding: 8px 0 !important;

        background: #0a0a0a !important;

        border-top: 1px solid #292929 !important;
        border-bottom: 1px solid #292929 !important;

        z-index: 99999 !important;
    }

    .header .nav-links.mobile-open {
        display: flex !important;
    }

    .header .nav-links > li {
        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .header .nav-links > li > a {
        display: flex !important;

        width: 100% !important;

        justify-content: flex-start !important;

        padding: 14px 18px !important;

        box-sizing: border-box !important;
    }

    .header .nav-actions {
        gap: 7px !important;
    }
}
/* =========================================
   NAV ACTIVE LINK SPACING FIX
========================================= */

.header .nav-links > li > a,
.header .nav-links > li > a.active,
.header .nav-links > li > a:hover {
    margin: 0 !important;
    padding: 12px 0 !important;

    border-left: 0 !important;
    border-right: 0 !important;

    transform: none !important;

    box-sizing: border-box !important;
}

.header .nav-links > li {
    margin: 0 !important;
    padding: 0 !important;
}

.header .nav-links {
    gap: 34px !important;
}
.header .nav-links > li > a.active {
    color: #ffe600 !important;
    border-bottom: 2px solid #ffe600 !important;
}
/* =========================
   PROFILE DROPDOWN FIX
========================= */

.profile-menu {
    position: relative !important;
}

.profile-dropdown {
    display: none !important;

    position: absolute !important;
    top: calc(100% + 10px) !important;
    right: 0 !important;

    min-width: 220px !important;

    background: #0b0b0b !important;
    border: 1px solid #2d2d2d !important;

    box-shadow: 0 18px 45px rgba(0,0,0,.45) !important;

    z-index: 99999 !important;
}

.profile-menu.open .profile-dropdown {
    display: block !important;
}

/* =========================================================
   MOBILE NAV ACTIONS — SHOW SEARCH / LOGIN / REGISTER
========================================================= */

@media (max-width: 820px) {

    .header .nav-actions {
        display: flex !important;
        align-items: center !important;
        gap: 4px !important;
        margin-left: auto !important;
    }

    .header .search-button,
    .header .login-button,
    .header .register-button {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        min-height: 32px !important;
        padding: 0 7px !important;

        font-size: 7px !important;
        line-height: 1 !important;
        letter-spacing: .3px !important;

        white-space: nowrap !important;
    }

    .header .search-button,
    .header .login-button {
        background: transparent !important;
        border: 1px solid #333 !important;
        color: #fff !important;
    }

    .header .register-button {
        background: #ffe000 !important;
        color: #090909 !important;
        border: 1px solid #ffe000 !important;
    }

    .header .cart-button {
        min-height: 32px !important;
        padding: 0 6px !important;
        font-size: 7px !important;
    }

    .header .cart-button span {
        width: 16px !important;
        height: 16px !important;
        min-width: 16px !important;

        margin-left: 4px !important;

        font-size: 7px !important;
    }
}


/* VERY SMALL PHONES */
@media (max-width: 390px) {

    .header .navbar {
        gap: 4px !important;
    }

    .header .nav-actions {
        gap: 3px !important;
    }

    .header .search-button,
    .header .login-button,
    .header .register-button {
        min-height: 29px !important;
        padding: 0 5px !important;
        font-size: 6px !important;
    }

    .header .cart-button {
        min-height: 29px !important;
        padding: 0 5px !important;
        font-size: 6px !important;
    }

}
/* =========================================================
   MOBILE MENU — COMPACT FINAL FIX
========================================================= */

@media (max-width: 820px) {

    .header .nav-links {
        max-height: calc(100vh - 95px) !important;
        overflow-y: auto !important;

        padding: 0 !important;
        gap: 0 !important;

        background: #090909 !important;
    }

    .header .nav-links > li > a {
        min-height: 44px !important;
        padding: 0 12px !important;

        display: flex !important;
        align-items: center !important;

        font-size: 10px !important;
        line-height: 1 !important;

        border-bottom: 1px solid #1b1b1b !important;
    }

    /* Categories submenu hidden by default */
    .nav-category-dropdown {
        display: none !important;

        padding: 0 !important;
        margin: 0 !important;

        background: #111 !important;
    }

    /* Show only when category menu is open */
    .nav-category-menu.open .nav-category-dropdown {
        display: block !important;
    }

    .nav-category-dropdown a {
        min-height: 38px !important;

        display: flex !important;
        align-items: center !important;

        padding: 0 28px !important;

        font-size: 9px !important;

        border-bottom: 1px solid #202020 !important;
    }

    .category-arrow {
        margin-left: 6px !important;
        font-size: 8px !important;
    }

    .nav-category-menu.open .category-arrow {
        transform: rotate(180deg) !important;
    }

}


/* SMALL MOBILE */
@media (max-width: 390px) {

    .header .nav-links > li > a {
        min-height: 40px !important;

        padding: 0 10px !important;

        font-size: 9px !important;
    }

    .nav-category-dropdown a {
        min-height: 35px !important;

        padding: 0 24px !important;

        font-size: 8px !important;
    }

}
/* =========================================
   MOBILE CATEGORY SMOOTH DROPDOWN
========================================= */

@media (max-width: 820px) {

    .nav-category-dropdown {
        display: block !important;

        max-height: 0 !important;
        overflow: hidden !important;

        opacity: 0 !important;

        padding: 0 !important;
        margin: 0 !important;

        background: #111 !important;

        transition:
            max-height .35s ease,
            opacity .25s ease !important;
    }

    .nav-category-menu.open .nav-category-dropdown {
        max-height: 320px !important;
        opacity: 1 !important;
    }

    .category-arrow {
        display: inline-block !important;
        margin-left: 6px !important;

        transition: transform .3s ease !important;
    }

    .nav-category-menu.open .category-arrow {
        transform: rotate(180deg) !important;
    }

}
/* MOBILE CATEGORY FONT — SMALLER + CLEANER */
@media (max-width: 820px) {

    .header .nav-links > li > a {
        font-size: 9px !important;
        font-weight: 800 !important;
        letter-spacing: .2px !important;
    }

    .nav-category-dropdown a {
        min-height: 36px !important;
        padding: 0 20px !important;

        font-size: 8px !important;
        font-weight: 800 !important;
        letter-spacing: .2px !important;
    }
}

@media (max-width: 390px) {

    .header .nav-links > li > a {
        font-size: 8px !important;
        min-height: 38px !important;
    }

    .nav-category-dropdown a {
        font-size: 7.5px !important;
        min-height: 33px !important;
        padding-left: 18px !important;
    }
}
/* =========================================
   MOBILE CATEGORIES — SMOOTH STICKY DROPDOWN
========================================= */

@media (max-width: 820px) {

    .nav-category-dropdown {
        display: block !important;

        max-height: 0 !important;
        overflow: hidden !important;

        opacity: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        background: #111 !important;

        transform: translateY(-6px) !important;

        transition:
            max-height .38s ease,
            opacity .28s ease,
            transform .32s ease !important;
    }

    .nav-category-menu.open .nav-category-dropdown {
        max-height: 350px !important;

        opacity: 1 !important;

        transform: translateY(0) !important;
    }

    .category-arrow {
        display: inline-block !important;

        margin-left: 5px !important;

        transition: transform .28s ease !important;
    }

    .nav-category-menu.open .category-arrow {
        transform: rotate(180deg) !important;
    }

    .nav-category-dropdown a {
        min-height: 34px !important;

        display: flex !important;
        align-items: center !important;

        padding: 0 18px !important;

        font-size: 7.5px !important;
        font-weight: 800 !important;

        border-bottom: 1px solid #202020 !important;
    }
}