/* ---- Icon fixes: theme ships Font Awesome PRO classes, fonts replaced with FA 6 Free ---- */

/* Outline star (ratings) exists in FA Free Regular */
.fa-light.fa-star,
.fa-thin.fa-star {
    font-weight: 400 !important;
}

/* These icons are not in the FA Free Regular set -> render them solid */
.fa-regular.fa-bag-shopping,
.fa-regular.fa-magnifying-glass,
.fa-regular.fa-arrow-up,
.fa-regular.fa-arrow-up-right,
.fa-sharp.fa-regular.fa-location-dot {
    font-weight: 900 !important;
}

/* "arrow-up-right" is Pro-only -> use free arrow-right rotated 45deg */
.fa-arrow-up-right::before {
    content: "\f061";
    display: inline-block;
    transform: rotate(-45deg);
}

/* ---- Logo sizing ---- */
.header-3 .logo-1 img,
.header-main .logo-1 img {
    max-width: 170px;
    height: auto;
}

.offcanvas__wrapper .offcanvas__logo img {
    width: 150px;
    height: auto;
}

.footer-logo img {
    max-width: 190px;
    height: auto;
}

/* ---- Black header ---- */
.header-3,
.header-3.sticky,
.sticky.header-3 {
    background-color: #000 !important;
}

/* fills the 120px gap between header bottom and hero top */
.header-3:not(.sticky) {
    min-height: 120px;
}

/* nav links */
.header-3 .header-main .main-menu > nav > ul > li > a,
.header-3 .header-main .main-menu > nav > ul > li > a::after,
.header-3 .header-main .main-menu ul li a i {
    color: var(--white);
}

.header-3 .header-main .main-menu > nav > ul > li:hover > a,
.header-3 .header-main .main-menu > nav > ul > li:hover > a::after,
.header-3 .header-main .main-menu > nav > ul > li > a:hover {
    color: var(--theme) !important;
}

/* account / cart icons */
.header-3 .shop-icon-right .shop-icon {
    color: var(--white);
    border-color: rgba(255, 255, 255, 0.35);
}

.header-3 .shop-icon-right .shop-icon:hover {
    background: var(--theme);
    color: var(--header);
    border-color: var(--theme);
}

/* mobile hamburger */
.header-3 .header-main .sidebar__toggle span,
.header-3 .header-main .sidebar__toggle.mobile_menu_bar span {
    background-color: var(--white);
}

.header-3 .header-main .sidebar__toggle.mobile_menu_bar {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.35);
}

.header-3 .mean-container a.meanmenu-reveal,
.header-3 .mean-container a.meanmenu-reveal span {
    color: var(--white);
    background-color: var(--white);
}

/* ---- One-page nav ---- */
html {
    scroll-behavior: smooth;
}

section[id] {
    scroll-margin-top: 110px;
}

.header-3 .header-main .main-menu > nav > ul > li.active > a {
    color: var(--theme) !important;
}

/* the simplified one-page menu no longer has dropdowns */
.header-3 .header-main .main-menu ul li a {
    cursor: pointer;
}

/* breathing room between the menu and the header icons */
@media (min-width: 1200px) {
    .header-3 .header-right {
        margin-inline-start: 40px;
    }

    .header-3 .shop-icon-right {
        gap: 12px;
        margin-inline-end: 22px;
    }
}

/* keep the one-page menu on a single line */
@media (min-width: 1200px) {
    .header-3 .header-main .main-menu > nav > ul {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 34px;
    }

    .header-3 .header-main .main-menu > nav > ul > li {
        margin: 0;
        white-space: nowrap;
    }

    .header-3 .header-right {
        margin-inline-start: 24px;
    }
}

/* ---- FIX: mobile hamburger lines were dark-on-dark (invisible) on black header ---- */
.header-3 .header-main .sidebar__toggle span,
.header-main .sidebar__toggle span {
    background-color: var(--white);
}
.header-3 .header-main .sidebar__toggle.mobile_menu_bar span,
.header-main .sidebar__toggle.mobile_menu_bar span {
    background-color: var(--white);
}
/* ensure hamburger is visible/tappable below xl */
.header-3 .header__hamburger { display: flex; align-items: center; }

/* ---- FIX: mobile header overflow — desktop nav wrapper pushed hamburger off-screen ---- */
@media (max-width: 1199px) {
    .header-3 .header-main .mean__menu-wrapper { display: none !important; }
    .header-3 .header-main { justify-content: space-between !important; align-items: center; }
    .header-3 .header-left { flex: 0 0 auto; }
    .header-3 .header-right { margin-inline-start: auto; gap: 16px; }
    .header-3 .header__hamburger { display: flex !important; }
}