:root{--ss-black:#050505;--ss-white:#fff;--ss-gray:#f4f4f4;--ss-line:#e5e5e5;--ss-red:#ff2f2f;--ss-yellow:#ffd447;--ss-blue:#1f8fff;--ss-green:#18b56b;--ss-pink:#ff4fb8}
body{background:#fff!important;color:#050505!important}.ss-container{width:min(100% - 56px,1640px);margin:0 auto}
.ss-topbar{background:#050505;color:#fff;font-size:12px;letter-spacing:.12em;text-transform:uppercase}.ss-topbar .ss-container{height:34px;display:flex;align-items:center;justify-content:space-between}.ss-topbar strong{color:var(--ss-yellow)}
.ss-header-nav{background:#fff!important;border-bottom:1px solid var(--ss-line)!important;min-height:44px!important}.ss-nav-inner{height:44px;display:flex;align-items:center;justify-content:space-between}
.ss-header{background:rgba(255,255,255,.96)!important;border-bottom:1px solid var(--ss-line);position:sticky;top:0;z-index:1000}.ss-scrolled .ss-header{background:#050505!important;color:#fff}
.ss-header-inner{min-height:82px;display:grid;grid-template-columns:220px 1fr 220px;align-items:center;gap:24px}.ss-logo h1{margin:0}.ss-logo img{max-height:62px!important;width:auto!important}
.ss-main-menu{justify-self:center}.ss-main-menu #_desktop_top_menu,.ss-main-menu .top-menu,.ss-main-menu .menu{display:flex!important;align-items:center!important;justify-content:center!important;gap:34px!important;margin:0!important;padding:0!important;background:transparent!important;box-shadow:none!important;border:0!important}
.ss-main-menu .top-menu[data-depth="0"]>li{position:relative!important;padding:0!important;margin:0!important}.ss-main-menu .top-menu[data-depth="0"]>li>a,.ss-main-menu .top-menu[data-depth="0"]>li>.dropdown-item{color:#050505!important;font-size:14px!important;font-weight:800!important;text-transform:uppercase!important;letter-spacing:.08em!important;padding:31px 0!important;line-height:1!important;background:transparent!important}.ss-scrolled .ss-main-menu .top-menu[data-depth="0"]>li>a{color:#fff!important}.ss-main-menu .top-menu[data-depth="0"]>li:hover>a{color:var(--ss-red)!important}
.ss-main-menu .top-menu .sub-menu,.ss-main-menu .top-menu .popover,.ss-main-menu .top-menu .collapse{background:#fff!important;color:#050505!important;border:0!important;border-top:1px solid var(--ss-line)!important;box-shadow:0 22px 55px rgba(0,0,0,.12)!important;padding:38px 46px!important;z-index:2000!important}
.ss-header-actions{justify-self:end;display:flex;align-items:center;gap:12px}.ss-icon-link,.ss-search-trigger{width:42px;height:42px;border:1px solid var(--ss-line);border-radius:50%;background:#fff;color:#050505!important;display:inline-flex;align-items:center;justify-content:center;position:relative}.ss-icon-link span{position:absolute;top:-7px;right:-7px;width:19px;height:19px;background:var(--ss-red);color:#fff;border-radius:50%;font-size:11px;display:flex;align-items:center;justify-content:center}
.ss-search-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);opacity:0;visibility:hidden;pointer-events:none;z-index:3000;transition:.25s}.ss-search-overlay.is-open{opacity:1;visibility:visible;pointer-events:auto}.ss-search-panel{background:#fff;padding:34px 52px;transform:translateY(-100%);transition:.28s;position:relative}.ss-search-overlay.is-open .ss-search-panel{transform:translateY(0)}.ss-search-form{max-width:1120px;height:70px;margin:0 auto;border-bottom:2px solid #050505;display:grid;grid-template-columns:54px 1fr 140px;align-items:center}.ss-search-form input{border:0;outline:0;font-size:24px;color:#050505}.ss-search-form button{border:0;background:#050505;color:#fff;height:48px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.ss-search-close{position:absolute;right:34px;top:24px;width:38px;height:38px;border:0;background:#050505;color:#fff;border-radius:50%}
.ss-hero{min-height:calc(100vh - 34px);background:#050505;position:relative;overflow:hidden;display:grid;place-items:center;color:#fff}.ss-sock-pattern,.ss-hero-overlay{position:absolute;inset:0}.ss-sock-pattern{background:radial-gradient(circle at 12% 24%,var(--ss-red) 0 18px,transparent 19px),radial-gradient(circle at 18% 32%,var(--ss-yellow) 0 16px,transparent 17px),radial-gradient(circle at 82% 18%,var(--ss-blue) 0 18px,transparent 19px),radial-gradient(circle at 76% 74%,var(--ss-green) 0 16px,transparent 17px),radial-gradient(circle at 38% 82%,var(--ss-pink) 0 15px,transparent 16px),repeating-linear-gradient(135deg,rgba(255,255,255,.06) 0 12px,transparent 12px 28px);opacity:.9}.ss-sock-pattern:before,.ss-sock-pattern:after{content:"";position:absolute;width:210px;height:520px;border:18px solid #fff;border-top-width:65px;border-radius:95px 95px 48px 48px;opacity:.88;filter:drop-shadow(0 25px 45px rgba(0,0,0,.4))}.ss-sock-pattern:before{left:20%;top:21%;transform:rotate(-24deg);border-top-color:var(--ss-red)}.ss-sock-pattern:after{right:22%;bottom:8%;transform:rotate(20deg);border-top-color:var(--ss-blue)}.ss-hero-overlay{background:linear-gradient(90deg,rgba(0,0,0,.84),rgba(0,0,0,.45),rgba(0,0,0,.84))}
.ss-hero-content{position:relative;z-index:2;text-align:center;max-width:1160px;padding:150px 24px 120px}.ss-language-loop{height:40px;overflow:hidden;margin-bottom:20px;color:#e7e7e7;font-size:20px;letter-spacing:.16em;text-transform:uppercase}.ss-language-loop span{display:block;height:40px;animation:ssLang 14s infinite}@keyframes ssLang{0%,12%{transform:translateY(0)}16%,28%{transform:translateY(-40px)}32%,44%{transform:translateY(-80px)}48%,60%{transform:translateY(-120px)}64%,76%{transform:translateY(-160px)}80%,100%{transform:translateY(-200px)}}.ss-hero h1{font-size:clamp(52px,8vw,132px);line-height:.88;letter-spacing:-.06em;font-weight:900;margin:0 0 34px;color:#fff}.ss-watch-btn{color:#fff!important;border:2px solid #fff;padding:16px 38px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;display:inline-flex;text-decoration:none!important}.ss-watch-btn:hover{background:#fff;color:#050505!important}.ss-hero-categories{position:absolute;left:50%;bottom:36px;transform:translateX(-50%);z-index:3;display:flex;gap:36px}.ss-hero-categories a{color:#fff!important;font-weight:800;letter-spacing:.12em;text-transform:uppercase;font-size:13px}
.ss-menu-showcase{background:#fff;color:#050505;padding:90px 56px}.ss-section-label{font-size:14px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;margin-bottom:36px}.ss-menu-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:42px}.ss-menu-grid h3{color:#050505;font-size:28px;font-weight:900;margin-bottom:24px}.ss-menu-grid a{display:block;color:#3f3f3f;font-size:16px;padding:8px 0;text-transform:uppercase}
.ss-products-strip{padding:90px 56px;background:#f4f4f4}.ss-section-heading{text-align:center;margin-bottom:44px}.ss-section-heading span{font-size:13px;font-weight:900;letter-spacing:.18em;text-transform:uppercase}.ss-section-heading h2{font-size:46px;color:#050505;font-weight:900;margin-top:10px}
.ss-promo-band{background:#050505;color:#fff;padding:70px 56px;display:flex;align-items:center;justify-content:space-between}.ss-promo-band span{color:var(--ss-yellow);font-weight:900;letter-spacing:.16em;text-transform:uppercase}.ss-promo-band h2{color:#fff;font-size:42px;font-weight:900;margin:8px 0 0}.ss-promo-band a{color:#050505!important;background:#fff;padding:16px 34px;font-weight:900;text-transform:uppercase}
.product-miniature .thumbnail-container{border:1px solid var(--ss-line)!important;background:#fff!important;box-shadow:none!important}.product-miniature .product-title a{color:#050505!important;font-weight:800!important;text-transform:uppercase}.product-miniature .price{color:#050505!important;font-weight:900!important}
@media(max-width:991px){.ss-container{width:min(100% - 24px,100%)}.ss-header-inner{grid-template-columns:150px 1fr}.ss-main-menu{display:none}.ss-hero h1{font-size:54px}.ss-hero-categories{flex-wrap:wrap;justify-content:center;width:90%;gap:14px}.ss-menu-grid{grid-template-columns:1fr}.ss-promo-band{flex-direction:column;gap:28px;text-align:center}}


/* V2 Warehouse/Iqit centered-logo header */
.ss-benefits-bar {
  background: #f5f5f5 !important;
  color: #202020;
  border-bottom: 1px solid #ededed;
}

.ss-benefits-inner {
  min-height: 56px;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  align-items: center;
  gap: 24px;
}

.ss-benefits-inner > div {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-size: 14px;
  white-space: nowrap;
}

.ss-benefits-inner i {
  font-size: 30px !important;
  color: #202020;
}

.ss-warehouse-header {
  position: relative !important;
  top: auto !important;
  background: #fff !important;
  border-bottom: 1px solid #ececec !important;
  z-index: 100;
}

.ss-warehouse-inner {
  min-height: 102px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 32px;
}

.ss-warehouse-logo {
  justify-self: center;
  text-align: center;
}

.ss-warehouse-logo h1 {
  margin: 0;
}

.ss-warehouse-logo img {
  max-height: 72px !important;
  width: auto !important;
}

.ss-text-logo {
  display: inline-block;
  color: #3b2418 !important;
  font-size: 42px;
  font-weight: 900;
  letter-spacing: .15em;
  text-decoration: none !important;
}

.ss-warehouse-menu {
  justify-self: start;
}

.ss-warehouse-menu #_desktop_top_menu,
.ss-warehouse-menu .top-menu,
.ss-warehouse-menu .menu {
  display: flex !important;
  align-items: center !important;
  gap: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

.ss-warehouse-menu .top-menu[data-depth="0"] > li {
  padding: 0 !important;
  margin: 0 !important;
  position: relative !important;
}

.ss-warehouse-menu .top-menu[data-depth="0"] > li > a,
.ss-warehouse-menu .top-menu[data-depth="0"] > li > .dropdown-item {
  color: #111 !important;
  font-size: 17px !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  padding: 42px 0 !important;
  background: transparent !important;
}

.ss-warehouse-menu .top-menu[data-depth="0"] > li:hover > a,
.ss-warehouse-menu .top-menu[data-depth="0"] > li:last-child > a {
  color: #d40000 !important;
}

.ss-warehouse-menu .top-menu .sub-menu,
.ss-warehouse-menu .top-menu .popover,
.ss-warehouse-menu .top-menu .collapse {
  background: #fff !important;
  border: 0 !important;
  border-top: 1px solid #eee !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.10) !important;
  padding: 34px 42px !important;
  z-index: 1000 !important;
}

.ss-warehouse-actions {
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 24px;
}

.ss-header-search {
  width: 245px;
  height: 48px;
  background: #f7f7f7;
  display: grid;
  grid-template-columns: 1fr 46px;
  align-items: center;
}

.ss-header-search input {
  border: 0;
  background: transparent;
  outline: 0;
  height: 48px;
  padding: 0 16px;
  color: #111;
  font-size: 14px;
}

.ss-header-search button {
  width: 46px;
  height: 48px;
  border: 0;
  background: transparent;
  color: #000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ss-header-search button i {
  font-size: 26px !important;
}

.ss-action-link {
  color: #111 !important;
  text-decoration: none !important;
  display: grid;
  grid-template-rows: 28px auto;
  justify-items: center;
  gap: 3px;
  font-size: 16px;
  line-height: 1;
  white-space: nowrap;
}

.ss-action-link i {
  font-size: 29px !important;
  color: #111;
}

.ss-cart-link i {
  font-size: 27px !important;
}

.ss-scrolled .ss-warehouse-header {
  background: #fff !important;
  color: #111 !important;
}

@media (max-width: 1200px) {
  .ss-benefits-inner {
    grid-template-columns: repeat(3, 1fr);
    row-gap: 8px;
    padding: 10px 0;
  }

  .ss-warehouse-inner {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 20px 0;
  }

  .ss-warehouse-menu,
  .ss-warehouse-logo,
  .ss-warehouse-actions {
    justify-self: center;
  }
}

@media (max-width: 768px) {
  .ss-benefits-inner {
    grid-template-columns: 1fr;
  }

  .ss-warehouse-menu {
    display: none;
  }

  .ss-warehouse-actions {
    flex-wrap: wrap;
    justify-content: center;
  }

  .ss-header-search {
    width: min(100vw - 40px, 320px);
  }
}


/* V3 Full-fluid Swag Socks header + oversized centered logo + video hero */
#header,
.ss-full-header {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  background: transparent !important;
  z-index: 2000;
  border: 0 !important;
}

.ss-full-nav {
  width: 100%;
  height: 48px;
  background: #000;
  color: #fff;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 16px 0 14px;
  position: relative;
  border-bottom: 1px solid rgba(255,255,255,.18);
}

.ss-left-menu {
  display: flex;
  align-items: center;
  gap: 18px;
  min-width: 0;
}

.ss-sock-menu-icon {
  width: 40px;
  height: 40px;
  border: 3px solid #fff;
  border-radius: 50%;
  color: #fff !important;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 40px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: -.08em;
  line-height: 1;
}

.ss-left-menu #_desktop_top_menu,
.ss-left-menu .top-menu,
.ss-left-menu .menu {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

.ss-left-menu .top-menu[data-depth="0"] > li {
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
}

.ss-left-menu .top-menu[data-depth="0"] > li > a,
.ss-left-menu .top-menu[data-depth="0"] > li > .dropdown-item {
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  line-height: 48px !important;
  padding: 0 !important;
  background: transparent !important;
}

.ss-left-menu .top-menu[data-depth="0"] > li:hover > a {
  color: #dcdcdc !important;
}

.ss-left-menu .top-menu .sub-menu,
.ss-left-menu .top-menu .popover,
.ss-left-menu .top-menu .collapse {
  top: 48px !important;
  background: rgba(0,0,0,.94) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.35) !important;
  padding: 34px 42px !important;
  z-index: 2500 !important;
}

.ss-left-menu .top-menu .sub-menu a {
  color: #fff !important;
}

/* Big logo centered and protruding over hero */
.ss-big-center-logo {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  z-index: 2200;
  background: #000;
  padding: 0 28px 10px;
  min-width: 330px;
  min-height: 124px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}

.ss-big-center-logo h1 {
  margin: 0 !important;
}

.ss-big-center-logo img {
  max-height: 120px !important;
  width: auto !important;
  display: block;
}

.ss-text-logo {
  color: #fff !important;
  font-size: 54px;
  line-height: .78;
  font-weight: 1000;
  letter-spacing: -.04em;
  text-align: center;
  text-decoration: none !important;
}

.ss-right-icons {
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 18px;
}

.ss-right-icons a,
.ss-right-icons button {
  background: transparent;
  border: 0;
  color: #fff !important;
  width: 25px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 0;
}

.ss-right-icons i {
  color: #fff !important;
  font-size: 25px !important;
}

.ss-right-icons span {
  position: absolute;
  right: -9px;
  bottom: 2px;
  min-width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #d60000;
  color: #fff;
  font-size: 10px;
  line-height: 16px;
  text-align: center;
}

/* Container-fluid hero carousel/video */
.ss-fluid-hero {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  min-height: 720px;
  height: 92vh;
  position: relative;
  overflow: hidden;
  background: #000;
}

.ss-hero-video,
.ss-hero-fallback,
.ss-hero-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.ss-hero-video {
  object-fit: cover;
  z-index: 1;
}

.ss-hero-fallback {
  z-index: 0;
  background:
    radial-gradient(circle at 45% 65%, rgba(255,255,255,.16), transparent 28%),
    linear-gradient(90deg, rgba(0,0,0,.22), rgba(0,0,0,.05)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1400' height='760' viewBox='0 0 1400 760'%3E%3Crect width='1400' height='760' fill='%23111111'/%3E%3Ccircle cx='310' cy='230' r='90' fill='%23ff2f2f'/%3E%3Ccircle cx='1090' cy='180' r='100' fill='%231f8fff'/%3E%3Ccircle cx='1020' cy='620' r='90' fill='%23ffd447'/%3E%3Cpath d='M480 80h170v510H480z' rx='70' fill='%23ffffff' transform='rotate(-22 565 335)'/%3E%3Cpath d='M720 130h170v500H720z' rx='70' fill='%23ffffff' transform='rotate(20 805 380)'/%3E%3Cpath d='M450 150l165-65 22 55-165 65z' fill='%23ff2f2f'/%3E%3Cpath d='M746 210l160 60-22 56-160-60z' fill='%231f8fff'/%3E%3C/svg%3E");
  background-size: cover;
  background-position: center;
}

.ss-hero-shade {
  z-index: 2;
  background: linear-gradient(180deg, rgba(0,0,0,.20) 0%, rgba(0,0,0,.08) 45%, rgba(0,0,0,.46) 100%);
}

.ss-hero-bottom {
  position: absolute;
  z-index: 3;
  left: 24px;
  right: 24px;
  bottom: 28px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: 30px;
}

.ss-hero-bottom h1 {
  margin: 0;
  color: #fff;
  font-size: 22px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: -.02em;
  text-transform: uppercase;
}

.ss-hero-bottom a {
  color: #fff !important;
  border: 2px solid #fff;
  min-width: 220px;
  height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none !important;
  font-size: 20px;
  font-weight: 500;
  text-transform: uppercase;
}

/* Top search modal still works */
.ss-search-overlay {
  z-index: 5000 !important;
}

/* Hide previous warehouse header artifacts */
.ss-benefits-bar,
.ss-warehouse-header,
.ss-header-nav,
.ss-topbar,
.ss-header {
  box-shadow: none !important;
}

@media (max-width: 991px) {
  .ss-full-nav {
    height: auto;
    min-height: 54px;
    grid-template-columns: 1fr auto;
  }

  .ss-left-menu .top-menu {
    display: none !important;
  }

  .ss-big-center-logo {
    min-width: 210px;
    min-height: 88px;
    padding: 0 14px 8px;
  }

  .ss-big-center-logo img {
    max-height: 86px !important;
  }

  .ss-right-icons {
    gap: 10px;
  }

  .ss-fluid-hero {
    min-height: 560px;
    height: 82vh;
  }

  .ss-hero-bottom {
    grid-template-columns: 1fr;
  }

  .ss-hero-bottom a {
    width: 100%;
  }
}


/* V4: visible icons, real logo, simple submenu, sticky color inversion */
#header,
.ss-full-header {
  position: sticky !important;
  top: 0 !important;
  left: 0;
  width: 100%;
  z-index: 3000 !important;
  background: #000 !important;
  border: 0 !important;
  transition: background .25s ease, box-shadow .25s ease;
}

.ss-full-nav {
  width: 100%;
  height: 54px;
  background: #000 !important;
  color: #fff;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 18px;
  position: relative;
  border-bottom: 1px solid rgba(255,255,255,.16);
  transition: background .25s ease, border-color .25s ease;
}

.ss-scrolled #header,
.ss-scrolled .ss-full-header,
.ss-scrolled .ss-full-nav {
  background: #fff !important;
  color: #000 !important;
  border-bottom-color: #e5e5e5 !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}

/* left SS icon */
.ss-sock-menu-icon {
  width: 42px;
  height: 42px;
  border: 3px solid currentColor;
  border-radius: 50%;
  color: #fff !important;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 42px;
  font-size: 13px;
  font-weight: 1000;
  letter-spacing: -.08em;
  line-height: 1;
}

.ss-scrolled .ss-sock-menu-icon {
  color: #000 !important;
}

/* menu */
.ss-left-menu {
  display: flex;
  align-items: center;
  gap: 18px;
  min-width: 0;
}

.ss-left-menu #_desktop_top_menu,
.ss-left-menu .top-menu,
.ss-left-menu .menu {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

.ss-left-menu .top-menu[data-depth="0"] > li {
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
}

.ss-left-menu .top-menu[data-depth="0"] > li > a,
.ss-left-menu .top-menu[data-depth="0"] > li > .dropdown-item {
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  line-height: 54px !important;
  padding: 0 !important;
  background: transparent !important;
  transition: color .25s ease;
}

.ss-scrolled .ss-left-menu .top-menu[data-depth="0"] > li > a,
.ss-scrolled .ss-left-menu .top-menu[data-depth="0"] > li > .dropdown-item {
  color: #000 !important;
}

.ss-left-menu .top-menu[data-depth="0"] > li:hover > a,
.ss-scrolled .ss-left-menu .top-menu[data-depth="0"] > li:hover > a {
  color: #777 !important;
}

/* Simple dropdown, no mega menu */
.ss-left-menu .top-menu .sub-menu,
.ss-left-menu .top-menu .popover,
.ss-left-menu .top-menu .collapse {
  position: absolute !important;
  top: 54px !important;
  left: 0 !important;
  min-width: 230px !important;
  width: auto !important;
  max-width: 320px !important;
  transform: none !important;
  background: #000 !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,.25) !important;
  padding: 14px 0 !important;
  z-index: 3500 !important;
}

.ss-scrolled .ss-left-menu .top-menu .sub-menu,
.ss-scrolled .ss-left-menu .top-menu .popover,
.ss-scrolled .ss-left-menu .top-menu .collapse {
  background: #fff !important;
  color: #000 !important;
  border: 1px solid #e5e5e5 !important;
}

.ss-left-menu .top-menu .sub-menu ul,
.ss-left-menu .top-menu .sub-menu li {
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
}

.ss-left-menu .top-menu .sub-menu a,
.ss-left-menu .top-menu .popover a,
.ss-left-menu .top-menu .collapse a {
  display: block !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  line-height: 1.3 !important;
  padding: 11px 22px !important;
  white-space: nowrap !important;
  background: transparent !important;
}

.ss-scrolled .ss-left-menu .top-menu .sub-menu a,
.ss-scrolled .ss-left-menu .top-menu .popover a,
.ss-scrolled .ss-left-menu .top-menu .collapse a {
  color: #000 !important;
}

.ss-left-menu .top-menu .sub-menu a:hover {
  background: rgba(255,255,255,.12) !important;
}

.ss-scrolled .ss-left-menu .top-menu .sub-menu a:hover {
  background: #f5f5f5 !important;
}

/* Big logo visible and protruding */
.ss-big-center-logo {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  z-index: 3300;
  background: #000;
  padding: 4px 26px 12px;
  min-width: 340px;
  min-height: 124px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  transition: background .25s ease, min-height .25s ease, padding .25s ease;
}

.ss-scrolled .ss-big-center-logo {
  background: #fff;
  min-height: 92px;
  padding-bottom: 8px;
  box-shadow: 0 10px 26px rgba(0,0,0,.08);
}

.ss-big-center-logo h1 {
  margin: 0 !important;
  line-height: 0 !important;
}

.ss-big-center-logo .ss-logo-link {
  display: block;
  line-height: 0;
}

.ss-big-center-logo img {
  max-height: 122px !important;
  width: auto !important;
  display: block !important;
  object-fit: contain !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

.ss-scrolled .ss-big-center-logo img {
  max-height: 86px !important;
}

/* If the real logo is black/transparent and disappears, this keeps a text logo available */
.ss-text-logo {
  color: #fff !important;
  font-size: 56px;
  line-height: .82;
  font-weight: 1000;
  letter-spacing: -.04em;
  text-align: center;
  text-decoration: none !important;
  display: grid;
}

.ss-scrolled .ss-text-logo {
  color: #000 !important;
}

/* right icons - CSS drawn, no dependency on icon font */
.ss-right-icons {
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 18px;
}

.ss-right-icons a,
.ss-right-icons button {
  background: transparent !important;
  border: 0 !important;
  color: #fff !important;
  width: 28px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 0;
  cursor: pointer;
}

.ss-scrolled .ss-right-icons a,
.ss-scrolled .ss-right-icons button {
  color: #000 !important;
}

.ss-icon-fallback {
  width: 24px;
  height: 24px;
  display: inline-block;
  position: relative;
  color: currentColor;
}

.ss-user-icon:before {
  content: "";
  position: absolute;
  left: 7px;
  top: 2px;
  width: 9px;
  height: 9px;
  border: 2px solid currentColor;
  border-radius: 50%;
}

.ss-user-icon:after {
  content: "";
  position: absolute;
  left: 3px;
  bottom: 2px;
  width: 17px;
  height: 10px;
  border: 2px solid currentColor;
  border-radius: 12px 12px 0 0;
}

.ss-search-icon:before {
  content: "";
  position: absolute;
  left: 3px;
  top: 3px;
  width: 13px;
  height: 13px;
  border: 2px solid currentColor;
  border-radius: 50%;
}

.ss-search-icon:after {
  content: "";
  position: absolute;
  left: 15px;
  top: 16px;
  width: 9px;
  height: 2px;
  background: currentColor;
  transform: rotate(45deg);
  transform-origin: left center;
}

.ss-bag-icon:before {
  content: "";
  position: absolute;
  left: 4px;
  top: 8px;
  width: 16px;
  height: 14px;
  border: 2px solid currentColor;
  border-radius: 2px;
}

.ss-bag-icon:after {
  content: "";
  position: absolute;
  left: 8px;
  top: 2px;
  width: 8px;
  height: 8px;
  border: 2px solid currentColor;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
}

.ss-right-icons em {
  position: absolute;
  right: -10px;
  bottom: 1px;
  min-width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #d60000;
  color: #fff;
  font-style: normal;
  font-size: 10px;
  line-height: 16px;
  text-align: center;
}

/* Hero must remain full fluid behind sticky header */
.ss-fluid-hero {
  margin-top: -54px;
  padding-top: 54px;
}

/* Search modal */
.ss-search-overlay {
  z-index: 5000 !important;
}

.ss-search-close span {
  font-size: 26px;
  line-height: 1;
}

@media (max-width: 991px) {
  .ss-full-nav {
    height: 56px;
    grid-template-columns: 1fr auto;
  }

  .ss-left-menu .top-menu,
  .ss-left-menu #_desktop_top_menu {
    display: none !important;
  }

  .ss-big-center-logo {
    min-width: 210px;
    min-height: 90px;
    padding: 4px 14px 8px;
  }

  .ss-big-center-logo img {
    max-height: 88px !important;
  }

  .ss-scrolled .ss-big-center-logo img {
    max-height: 70px !important;
  }

  .ss-scrolled .ss-big-center-logo {
    min-height: 74px;
  }

  .ss-right-icons {
    gap: 10px;
  }
}


/* V5 FINAL HEADER FIX: fixed header, visible icons, no header search input */
#header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 9999 !important;
  background: transparent !important;
  transform: none !important;
}

#header .header-top,
.ss-fixed-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 9999 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* This is the real sticky bar */
.ss-fixed-nav {
  width: 100% !important;
  height: 54px !important;
  background: #000 !important;
  color: #fff !important;
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
  padding: 0 18px !important;
  border-bottom: 1px solid rgba(255,255,255,.18) !important;
  transition: background .25s ease, border-color .25s ease, box-shadow .25s ease !important;
  position: relative !important;
  z-index: 10000 !important;
}

body.ss-scrolled .ss-fixed-nav {
  background: #fff !important;
  color: #000 !important;
  border-bottom-color: #ddd !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.10) !important;
}

/* Push page below fixed nav when not hero */
body:not(#index) #wrapper {
  padding-top: 54px !important;
}

/* Make hero stay behind fixed nav */
#index #wrapper,
#index .ss-fluid-hero {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Left menu */
.ss-left-menu {
  justify-self: start !important;
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  min-width: 0 !important;
  height: 54px !important;
}

.ss-sock-menu-icon {
  width: 42px !important;
  height: 42px !important;
  border: 3px solid currentColor !important;
  border-radius: 50% !important;
  color: #fff !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 42px !important;
  font-size: 13px !important;
  font-weight: 1000 !important;
  letter-spacing: -.08em !important;
  line-height: 1 !important;
}

body.ss-scrolled .ss-sock-menu-icon {
  color: #000 !important;
}

.ss-left-menu #_desktop_top_menu,
.ss-left-menu .top-menu,
.ss-left-menu .menu {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

.ss-left-menu .top-menu[data-depth="0"] > li {
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
}

.ss-left-menu .top-menu[data-depth="0"] > li > a,
.ss-left-menu .top-menu[data-depth="0"] > li > .dropdown-item {
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  line-height: 54px !important;
  padding: 0 !important;
  background: transparent !important;
}

body.ss-scrolled .ss-left-menu .top-menu[data-depth="0"] > li > a,
body.ss-scrolled .ss-left-menu .top-menu[data-depth="0"] > li > .dropdown-item {
  color: #000 !important;
}

/* Simple submenu only */
.ss-left-menu .top-menu .sub-menu,
.ss-left-menu .top-menu .popover,
.ss-left-menu .top-menu .collapse {
  position: absolute !important;
  top: 54px !important;
  left: 0 !important;
  min-width: 230px !important;
  max-width: 320px !important;
  width: auto !important;
  transform: none !important;
  background: #000 !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,.25) !important;
  padding: 12px 0 !important;
  z-index: 10050 !important;
}

body.ss-scrolled .ss-left-menu .top-menu .sub-menu,
body.ss-scrolled .ss-left-menu .top-menu .popover,
body.ss-scrolled .ss-left-menu .top-menu .collapse {
  background: #fff !important;
  border-color: #e5e5e5 !important;
}

.ss-left-menu .top-menu .sub-menu ul,
.ss-left-menu .top-menu .sub-menu li {
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
}

.ss-left-menu .top-menu .sub-menu a,
.ss-left-menu .top-menu .popover a,
.ss-left-menu .top-menu .collapse a {
  display: block !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  line-height: 1.25 !important;
  padding: 11px 22px !important;
  white-space: nowrap !important;
  background: transparent !important;
}

body.ss-scrolled .ss-left-menu .top-menu .sub-menu a,
body.ss-scrolled .ss-left-menu .top-menu .popover a,
body.ss-scrolled .ss-left-menu .top-menu .collapse a {
  color: #000 !important;
}

/* Big logo visible above bar */
.ss-big-center-logo {
  position: absolute !important;
  left: 50% !important;
  top: 0 !important;
  transform: translateX(-50%) !important;
  z-index: 10020 !important;
  background: transparent !important;
  padding: 0 !important;
  min-width: 330px !important;
  min-height: 120px !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  pointer-events: auto !important;
}

.ss-big-center-logo .ss-logo-link,
.ss-big-center-logo h1 {
  display: block !important;
  margin: 0 !important;
  line-height: 0 !important;
}

.ss-big-center-logo img {
  max-height: 122px !important;
  width: auto !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  object-fit: contain !important;
}

body.ss-scrolled .ss-big-center-logo img {
  max-height: 82px !important;
}

/* Hide all header inline search inputs/forms from old versions */
.ss-header-search,
.ss-petsora-search,
.psr-petsora-search,
#_desktop_search_widget,
#search_widget {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Right icons - CSS drawn icons */
.ss-right-icons {
  justify-self: end !important;
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  height: 54px !important;
}

.ss-right-icons a,
.ss-right-icons button {
  width: 30px !important;
  height: 42px !important;
  background: transparent !important;
  border: 0 !important;
  color: #fff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  padding: 0 !important;
  cursor: pointer !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body.ss-scrolled .ss-right-icons a,
body.ss-scrolled .ss-right-icons button {
  color: #000 !important;
}

.ss-css-icon {
  width: 25px !important;
  height: 25px !important;
  display: inline-block !important;
  position: relative !important;
  color: currentColor !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.ss-user-css:before {
  content: "";
  position: absolute;
  left: 8px;
  top: 2px;
  width: 9px;
  height: 9px;
  border: 2px solid currentColor;
  border-radius: 50%;
}

.ss-user-css:after {
  content: "";
  position: absolute;
  left: 3px;
  bottom: 2px;
  width: 18px;
  height: 10px;
  border: 2px solid currentColor;
  border-radius: 12px 12px 0 0;
}

.ss-search-css:before {
  content: "";
  position: absolute;
  left: 3px;
  top: 3px;
  width: 13px;
  height: 13px;
  border: 2px solid currentColor;
  border-radius: 50%;
}

.ss-search-css:after {
  content: "";
  position: absolute;
  left: 15px;
  top: 16px;
  width: 10px;
  height: 2px;
  background: currentColor;
  transform: rotate(45deg);
  transform-origin: left center;
}

.ss-bag-css:before {
  content: "";
  position: absolute;
  left: 4px;
  top: 8px;
  width: 17px;
  height: 14px;
  border: 2px solid currentColor;
  border-radius: 2px;
}

.ss-bag-css:after {
  content: "";
  position: absolute;
  left: 8px;
  top: 2px;
  width: 9px;
  height: 8px;
  border: 2px solid currentColor;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
}

.ss-right-icons em {
  position: absolute !important;
  right: -10px !important;
  bottom: 1px !important;
  min-width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  background: #d60000 !important;
  color: #fff !important;
  font-style: normal !important;
  font-size: 10px !important;
  line-height: 16px !important;
  text-align: center !important;
}

/* Search modal only when clicking lupa */
.ss-search-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 20000 !important;
  background: rgba(0,0,0,.58) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity .24s ease, visibility .24s ease !important;
}

.ss-search-modal.is-open {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.ss-search-modal-panel {
  width: 100% !important;
  background: #fff !important;
  padding: 34px 58px !important;
  box-shadow: 0 20px 50px rgba(0,0,0,.22) !important;
  transform: translateY(-100%) !important;
  transition: transform .28s ease !important;
  position: relative !important;
}

.ss-search-modal.is-open .ss-search-modal-panel {
  transform: translateY(0) !important;
}

.ss-search-modal-form {
  max-width: 1120px !important;
  height: 72px !important;
  margin: 0 auto !important;
  border-bottom: 2px solid #000 !important;
  display: grid !important;
  grid-template-columns: 54px 1fr 140px !important;
  align-items: center !important;
  background: #fff !important;
}

.ss-search-modal-form input[type="text"] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  border: 0 !important;
  outline: 0 !important;
  height: 72px !important;
  font-size: 24px !important;
  color: #000 !important;
  background: transparent !important;
  padding: 0 16px !important;
}

.ss-search-modal-form button[type="submit"] {
  height: 48px !important;
  border: 0 !important;
  background: #000 !important;
  color: #fff !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}

.ss-search-close {
  position: absolute !important;
  right: 34px !important;
  top: 22px !important;
  width: 42px !important;
  height: 42px !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #000 !important;
  color: #fff !important;
  font-size: 28px !important;
  line-height: 40px !important;
}

/* Avoid old classes interfering */
.ss-search-overlay,
.psr-search-overlay {
  display: none !important;
}

/* Mobile */
@media (max-width: 991px) {
  .ss-fixed-nav {
    height: 56px !important;
    grid-template-columns: 1fr auto !important;
  }

  .ss-left-menu #_desktop_top_menu,
  .ss-left-menu .top-menu {
    display: none !important;
  }

  .ss-big-center-logo {
    min-width: 190px !important;
    min-height: 86px !important;
  }

  .ss-big-center-logo img {
    max-height: 84px !important;
  }

  body.ss-scrolled .ss-big-center-logo img {
    max-height: 66px !important;
  }

  .ss-right-icons {
    gap: 10px !important;
  }

  .ss-search-modal-panel {
    padding: 28px 20px !important;
  }

  .ss-search-modal-form {
    grid-template-columns: 42px 1fr 86px !important;
    height: 58px !important;
  }

  .ss-search-modal-form input[type="text"] {
    height: 58px !important;
    font-size: 16px !important;
  }
}


/* V6 fixes: icons far right, centered logo, no red icon backgrounds, working search modal */
.ss-fixed-nav {
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
}

/* Keep the menu on the true left side */
.ss-left-menu {
  grid-column: 1 !important;
  justify-self: start !important;
  width: 100% !important;
}

/* Center logo exactly independent of menu/icons */
.ss-big-center-logo {
  left: 50vw !important;
  top: 0 !important;
  transform: translateX(-50%) !important;
  right: auto !important;
  margin: 0 !important;
  pointer-events: auto !important;
}

/* White panel behind black logo image so it is visible while the nav is black */
.ss-big-center-logo {
  background: rgba(255,255,255,.96) !important;
  border: 0 !important;
  border-bottom-left-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.18) !important;
}

body.ss-scrolled .ss-big-center-logo {
  background: #fff !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.08) !important;
}

/* If your logo PNG is black, this keeps it visible. When you send SVG, we can invert by CSS perfectly. */
.ss-big-center-logo img {
  filter: none !important;
  mix-blend-mode: normal !important;
  background: transparent !important;
}

/* Move icons to the far right edge */
.ss-right-icons {
  grid-column: 3 !important;
  justify-self: end !important;
  margin-left: auto !important;
  margin-right: 0 !important;
  position: relative !important;
  right: 0 !important;
  z-index: 10040 !important;
}

/* Force icon buttons visible/clickable */
.ss-right-icons a,
.ss-right-icons button,
.ss-search-trigger {
  z-index: 10045 !important;
  pointer-events: auto !important;
}

/* Remove the red background from cart/count bubble */
.ss-right-icons em {
  background: transparent !important;
  color: currentColor !important;
  border: 0 !important;
  right: -11px !important;
  bottom: -1px !important;
  font-weight: 800 !important;
}

/* Also kill possible red pseudo backgrounds from prior styles */
.ss-right-icons a::before,
.ss-right-icons a::after,
.ss-right-icons button::before,
.ss-right-icons button::after {
  background-color: transparent;
}

/* Keep the CSS-drawn icons white/black depending on scroll */
.ss-right-icons,
.ss-right-icons a,
.ss-right-icons button,
.ss-css-icon {
  color: #fff !important;
}

body.ss-scrolled .ss-right-icons,
body.ss-scrolled .ss-right-icons a,
body.ss-scrolled .ss-right-icons button,
body.ss-scrolled .ss-css-icon {
  color: #000 !important;
}

/* Search modal must override old hidden overlay rules */
#ssSearchOverlay.ss-search-modal {
  display: block !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 99999 !important;
  background: rgba(0,0,0,.62) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity .24s ease, visibility .24s ease !important;
}

#ssSearchOverlay.ss-search-modal.is-open {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

#ssSearchOverlay .ss-search-modal-panel {
  display: block !important;
  width: 100% !important;
  background: #fff !important;
  padding: 36px 58px !important;
  box-shadow: 0 20px 50px rgba(0,0,0,.25) !important;
  transform: translateY(-100%) !important;
  transition: transform .28s ease !important;
  position: relative !important;
}

#ssSearchOverlay.is-open .ss-search-modal-panel {
  transform: translateY(0) !important;
}

#ssSearchOverlay .ss-search-modal-form {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-width: 1120px !important;
  height: 72px !important;
  margin: 0 auto !important;
  border-bottom: 2px solid #000 !important;
  grid-template-columns: 54px 1fr 140px !important;
  align-items: center !important;
  background: #fff !important;
}

#ssSearchOverlay .ss-search-modal-form input[type="text"] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: 72px !important;
  border: 0 !important;
  outline: none !important;
  background: transparent !important;
  font-size: 24px !important;
  color: #000 !important;
  padding: 0 16px !important;
}

#ssSearchOverlay .ss-search-modal-form button[type="submit"] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: 48px !important;
  border: 0 !important;
  background: #000 !important;
  color: #fff !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}

#ssSearchOverlay .ss-search-close {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: absolute !important;
  right: 34px !important;
  top: 22px !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  border: 0 !important;
  background: #000 !important;
  color: #fff !important;
  font-size: 28px !important;
  line-height: 39px !important;
  cursor: pointer !important;
}

/* Hide only inline search widgets, not our modal */
.ss-header-search,
#_desktop_search_widget,
#search_widget {
  display: none !important;
}

@media (max-width: 991px) {
  .ss-right-icons {
    grid-column: 2 !important;
  }

  .ss-big-center-logo {
    left: 50% !important;
    min-width: 185px !important;
  }
}


/* V7: real uploaded video hero + navbar icon/logo fixes */
.ss-video-hero,
.ss-fluid-hero.ss-video-hero {
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  min-height: 720px !important;
  height: 92vh !important;
  position: relative !important;
  overflow: hidden !important;
  background: #000 !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
}

.ss-video-hero .ss-hero-video {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  z-index: 1 !important;
  display: block !important;
}

.ss-hero-video-overlay {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  background: linear-gradient(180deg, rgba(0,0,0,.38) 0%, rgba(0,0,0,.10) 42%, rgba(0,0,0,.58) 100%) !important;
  pointer-events: none !important;
}

.ss-video-hero .ss-hero-bottom {
  z-index: 3 !important;
}

.ss-right-icons a,
.ss-right-icons button,
.ss-search-trigger,
.ss-right-icons em,
.ss-icon-link,
.ss-icon-link span,
.ss-cart-link span,
.ss-right-icons span,
.ss-right-icons a span,
.ss-right-icons button span {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

.ss-right-icons em {
  color: currentColor !important;
  border: 0 !important;
  font-weight: 900 !important;
}

.ss-right-icons,
.ss-right-icons a,
.ss-right-icons button,
.ss-right-icons .ss-css-icon,
.ss-right-icons em {
  color: #fff !important;
}

body.ss-scrolled .ss-right-icons,
body.ss-scrolled .ss-right-icons a,
body.ss-scrolled .ss-right-icons button,
body.ss-scrolled .ss-right-icons .ss-css-icon,
body.ss-scrolled .ss-right-icons em {
  color: #000 !important;
}

body.ss-scrolled .ss-big-center-logo,
.ss-big-center-logo {
  min-height: 120px !important;
  padding: 0 !important;
}

.ss-big-center-logo img,
body.ss-scrolled .ss-big-center-logo img,
.ss-scrolled .ss-big-center-logo img,
body.ss-scrolled #_desktop_logo img,
.ss-scrolled #_desktop_logo img {
  max-height: 122px !important;
  width: auto !important;
  transform: none !important;
}

.ss-big-center-logo,
body.ss-scrolled .ss-big-center-logo {
  background: rgba(255,255,255,.96) !important;
}

#header,
#header .header-top,
.ss-fixed-header,
.ss-fixed-nav {
  z-index: 9999 !important;
}

.ss-big-center-logo {
  z-index: 10020 !important;
}

#ssSearchOverlay.ss-search-modal {
  z-index: 99999 !important;
}

@media (max-width: 991px) {
  .ss-video-hero,
  .ss-fluid-hero.ss-video-hero {
    min-height: 560px !important;
    height: 82vh !important;
  }

  .ss-big-center-logo img,
  body.ss-scrolled .ss-big-center-logo img,
  .ss-scrolled .ss-big-center-logo img {
    max-height: 86px !important;
  }

  body.ss-scrolled .ss-big-center-logo,
  .ss-big-center-logo {
    min-height: 88px !important;
  }
}


/* V8: official Swag Socks logo and icon */
.ss-sock-menu-icon {
  border: 0 !important;
  width: 44px !important;
  height: 44px !important;
  background: transparent !important;
  padding: 0 !important;
}

.ss-sock-menu-icon img {
  width: 44px !important;
  height: 44px !important;
  object-fit: contain !important;
  display: block !important;
  filter: invert(1) !important;
}

body.ss-scrolled .ss-sock-menu-icon img {
  filter: none !important;
}

.ss-big-center-logo,
body.ss-scrolled .ss-big-center-logo {
  min-width: 470px !important;
  min-height: 145px !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  align-items: flex-start !important;
  top: -4px !important;
  z-index: 10030 !important;
}

.ss-big-center-logo .ss-logo-link {
  background: transparent !important;
  display: block !important;
  line-height: 0 !important;
}

.ss-big-center-logo img,
body.ss-scrolled .ss-big-center-logo img,
.ss-scrolled .ss-big-center-logo img,
body.ss-scrolled #_desktop_logo img,
.ss-scrolled #_desktop_logo img {
  max-height: 145px !important;
  width: auto !important;
  display: block !important;
  object-fit: contain !important;
  background: transparent !important;
  filter: invert(1) !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body.ss-scrolled .ss-big-center-logo img,
body.ss-scrolled #_desktop_logo img {
  max-height: 145px !important;
  filter: none !important;
}

.ss-fixed-nav {
  height: 58px !important;
}

.ss-left-menu .top-menu[data-depth="0"] > li > a,
.ss-left-menu .top-menu[data-depth="0"] > li > .dropdown-item {
  line-height: 58px !important;
}

.ss-left-menu .top-menu .sub-menu,
.ss-left-menu .top-menu .popover,
.ss-left-menu .top-menu .collapse {
  top: 58px !important;
}

@media (max-width: 991px) {
  .ss-big-center-logo,
  body.ss-scrolled .ss-big-center-logo {
    min-width: 260px !important;
    min-height: 88px !important;
  }

  .ss-big-center-logo img,
  body.ss-scrolled .ss-big-center-logo img {
    max-height: 88px !important;
  }

  .ss-sock-menu-icon,
  .ss-sock-menu-icon img {
    width: 38px !important;
    height: 38px !important;
  }
}


/* V9: updated official logo + shrink on scroll + safe content spacing */

/* New logo/icon assets keep same file names, but force sizing */
.ss-sock-menu-icon img {
  width: 42px !important;
  height: 42px !important;
  object-fit: contain !important;
  display: block !important;
}

/* Logo starts big on transparent/black navbar */
.ss-big-center-logo,
body:not(.ss-scrolled) .ss-big-center-logo {
  min-width: 470px !important;
  min-height: 142px !important;
  top: -2px !important;
  align-items: flex-start !important;
  justify-content: center !important;
  transition: min-height .25s ease, min-width .25s ease, top .25s ease, transform .25s ease !important;
}

.ss-big-center-logo img,
body:not(.ss-scrolled) .ss-big-center-logo img {
  max-height: 142px !important;
  width: auto !important;
  transition: max-height .25s ease, filter .25s ease !important;
}

/* On scroll: logo becomes navbar-sized so it does not cover content */
body.ss-scrolled .ss-big-center-logo {
  min-width: 220px !important;
  min-height: 58px !important;
  height: 58px !important;
  top: 0 !important;
  display: flex !important;
  align-items: center !important;
}

body.ss-scrolled .ss-big-center-logo img,
body.ss-scrolled #_desktop_logo img,
body.ss-scrolled .ss-big-center-logo .ss-logo-link img {
  max-height: 52px !important;
  width: auto !important;
}

/* Keep logo readable: white on black, black on white */
body:not(.ss-scrolled) .ss-big-center-logo img,
body:not(.ss-scrolled) .ss-sock-menu-icon img {
  filter: invert(1) !important;
}

body.ss-scrolled .ss-big-center-logo img,
body.ss-scrolled .ss-sock-menu-icon img {
  filter: none !important;
}

/* Navbar height and bottom spacing */
.ss-fixed-nav {
  height: 62px !important;
  padding-bottom: 0 !important;
}

.ss-left-menu,
.ss-right-icons {
  height: 62px !important;
}

.ss-left-menu .top-menu[data-depth="0"] > li > a,
.ss-left-menu .top-menu[data-depth="0"] > li > .dropdown-item {
  line-height: 62px !important;
}

.ss-left-menu .top-menu .sub-menu,
.ss-left-menu .top-menu .popover,
.ss-left-menu .top-menu .collapse {
  top: 62px !important;
}

/* Prevent breadcrumb/content from being cut by fixed navbar */
body:not(#index) #wrapper,
body:not(#index) main,
body:not(#index) #content-wrapper {
  padding-top: 96px !important;
}

/* Specific breadcrumb safety */
.breadcrumb,
#wrapper .breadcrumb,
nav.breadcrumb,
.breadcrumb-wrapper {
  margin-top: 18px !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Home hero can sit behind the navbar */
#index #wrapper,
#index main,
#index #content-wrapper {
  padding-top: 0 !important;
}

#index .ss-video-hero,
#index .ss-fluid-hero {
  margin-top: 0 !important;
}

/* Give inner page first block breathing room */
body:not(#index) .page-header,
body:not(#index) .page-content,
body:not(#index) #main {
  margin-top: 18px !important;
}

/* Mobile */
@media (max-width: 991px) {
  .ss-fixed-nav {
    height: 58px !important;
  }

  .ss-big-center-logo,
  body:not(.ss-scrolled) .ss-big-center-logo {
    min-width: 250px !important;
    min-height: 92px !important;
  }

  .ss-big-center-logo img,
  body:not(.ss-scrolled) .ss-big-center-logo img {
    max-height: 90px !important;
  }

  body.ss-scrolled .ss-big-center-logo {
    min-width: 170px !important;
    min-height: 58px !important;
    height: 58px !important;
  }

  body.ss-scrolled .ss-big-center-logo img {
    max-height: 48px !important;
  }

  body:not(#index) #wrapper,
  body:not(#index) main,
  body:not(#index) #content-wrapper {
    padding-top: 88px !important;
  }
}


/* V10: ps_mainmenu editable from PrestaShop Back Office */
.ss-left-menu .menu,
.ss-left-menu .top-menu,
.ss-left-menu #_desktop_top_menu {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

.ss-left-menu .top-menu[data-depth="0"],
.ss-left-menu .menu > ul {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.ss-left-menu .top-menu[data-depth="0"] > li,
.ss-left-menu .menu > ul > li {
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
}

.ss-left-menu .top-menu[data-depth="0"] > li > a,
.ss-left-menu .top-menu[data-depth="0"] > li > .dropdown-item,
.ss-left-menu .menu > ul > li > a {
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  line-height: 62px !important;
  padding: 0 !important;
  background: transparent !important;
  text-decoration: none !important;
}

body.ss-scrolled .ss-left-menu .top-menu[data-depth="0"] > li > a,
body.ss-scrolled .ss-left-menu .top-menu[data-depth="0"] > li > .dropdown-item,
body.ss-scrolled .ss-left-menu .menu > ul > li > a {
  color: #000 !important;
}

.ss-left-menu .top-menu .sub-menu,
.ss-left-menu .top-menu .popover,
.ss-left-menu .top-menu .collapse,
.ss-left-menu .menu .sub-menu,
.ss-left-menu .menu .popover,
.ss-left-menu .menu .collapse {
  position: absolute !important;
  top: 62px !important;
  left: 0 !important;
  min-width: 230px !important;
  max-width: 320px !important;
  width: auto !important;
  transform: none !important;
  background: #000 !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,.25) !important;
  padding: 12px 0 !important;
  z-index: 10050 !important;
}

body.ss-scrolled .ss-left-menu .top-menu .sub-menu,
body.ss-scrolled .ss-left-menu .top-menu .popover,
body.ss-scrolled .ss-left-menu .top-menu .collapse,
body.ss-scrolled .ss-left-menu .menu .sub-menu,
body.ss-scrolled .ss-left-menu .menu .popover,
body.ss-scrolled .ss-left-menu .menu .collapse {
  background: #fff !important;
  border-color: #e5e5e5 !important;
}

.ss-left-menu .top-menu .sub-menu a,
.ss-left-menu .top-menu .popover a,
.ss-left-menu .top-menu .collapse a,
.ss-left-menu .menu .sub-menu a,
.ss-left-menu .menu .popover a,
.ss-left-menu .menu .collapse a {
  display: block !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  line-height: 1.25 !important;
  padding: 11px 22px !important;
  white-space: nowrap !important;
  background: transparent !important;
}

body.ss-scrolled .ss-left-menu .top-menu .sub-menu a,
body.ss-scrolled .ss-left-menu .top-menu .popover a,
body.ss-scrolled .ss-left-menu .top-menu .collapse a,
body.ss-scrolled .ss-left-menu .menu .sub-menu a,
body.ss-scrolled .ss-left-menu .menu .popover a,
body.ss-scrolled .ss-left-menu .menu .collapse a {
  color: #000 !important;
}

.ss-left-menu .top-menu .sub-menu ul,
.ss-left-menu .top-menu .sub-menu li,
.ss-left-menu .menu .sub-menu ul,
.ss-left-menu .menu .sub-menu li {
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* V11: ps_mainmenu multi-level cascade menu */
#header,
.ss-fixed-header,
.ss-fixed-nav,
.ss-left-menu,
.ss-left-menu #_desktop_top_menu,
.ss-left-menu .top-menu,
.ss-left-menu .menu {
  overflow: visible !important;
}

.ss-left-menu #_desktop_top_menu,
.ss-left-menu .top-menu[data-depth="0"],
.ss-left-menu .menu > ul {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  overflow: visible !important;
}

.ss-left-menu li {
  position: relative !important;
  overflow: visible !important;
}

.ss-left-menu .top-menu[data-depth="0"] > li > a,
.ss-left-menu .top-menu[data-depth="0"] > li > .dropdown-item,
.ss-left-menu .menu > ul > li > a {
  color: #fff !important;
  line-height: 62px !important;
  padding: 0 !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  background: transparent !important;
}

body.ss-scrolled .ss-left-menu .top-menu[data-depth="0"] > li > a,
body.ss-scrolled .ss-left-menu .top-menu[data-depth="0"] > li > .dropdown-item,
body.ss-scrolled .ss-left-menu .menu > ul > li > a {
  color: #000 !important;
}

/* Hide all nested menus by default */
.ss-left-menu .sub-menu,
.ss-left-menu .popover,
.ss-left-menu .collapse,
.ss-left-menu ul[data-depth="1"],
.ss-left-menu ul[data-depth="2"],
.ss-left-menu ul[data-depth="3"],
.ss-left-menu ul[data-depth="4"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

/* Show direct child on hover */
.ss-left-menu li:hover > .sub-menu,
.ss-left-menu li:hover > .popover,
.ss-left-menu li:hover > .collapse,
.ss-left-menu li:hover > ul[data-depth="1"],
.ss-left-menu li:hover > ul[data-depth="2"],
.ss-left-menu li:hover > ul[data-depth="3"],
.ss-left-menu li:hover > ul[data-depth="4"] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Some ps_mainmenu wraps ul[data-depth=1] inside .sub-menu */
.ss-left-menu li:hover > .sub-menu > ul,
.ss-left-menu li:hover > .popover > ul,
.ss-left-menu li:hover > .collapse > ul {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* First level under navbar */
.ss-left-menu .top-menu[data-depth="0"] > li > .sub-menu,
.ss-left-menu .top-menu[data-depth="0"] > li > .popover,
.ss-left-menu .top-menu[data-depth="0"] > li > .collapse,
.ss-left-menu .top-menu[data-depth="0"] > li > ul[data-depth="1"],
.ss-left-menu .menu > ul > li > ul {
  position: absolute !important;
  top: 62px !important;
  left: 0 !important;
  min-width: 260px !important;
  width: 260px !important;
  background: rgba(255,255,255,.98) !important;
  border: 2px solid #111 !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.25) !important;
  padding: 0 !important;
  margin: 0 !important;
  z-index: 12000 !important;
  transform: none !important;
}

/* Next levels fly to the right */
.ss-left-menu ul[data-depth="1"] li > ul,
.ss-left-menu ul[data-depth="1"] li > .sub-menu,
.ss-left-menu ul[data-depth="1"] li > .popover,
.ss-left-menu ul[data-depth="1"] li > .collapse,
.ss-left-menu ul[data-depth="2"] li > ul,
.ss-left-menu ul[data-depth="2"] li > .sub-menu,
.ss-left-menu ul[data-depth="2"] li > .popover,
.ss-left-menu ul[data-depth="2"] li > .collapse,
.ss-left-menu ul[data-depth="3"] li > ul,
.ss-left-menu ul[data-depth="3"] li > .sub-menu,
.ss-left-menu ul[data-depth="3"] li > .popover,
.ss-left-menu ul[data-depth="3"] li > .collapse,
.ss-left-menu .sub-menu li > .sub-menu,
.ss-left-menu .sub-menu li > .popover,
.ss-left-menu .sub-menu li > .collapse {
  position: absolute !important;
  top: -2px !important;
  left: 100% !important;
  min-width: 260px !important;
  width: 260px !important;
  background: rgba(255,255,255,.98) !important;
  border: 2px solid #111 !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.20) !important;
  padding: 0 !important;
  margin: 0 !important;
  z-index: 12010 !important;
  transform: none !important;
}

.ss-left-menu ul[data-depth="1"],
.ss-left-menu ul[data-depth="2"],
.ss-left-menu ul[data-depth="3"],
.ss-left-menu ul[data-depth="4"],
.ss-left-menu .sub-menu ul,
.ss-left-menu .popover ul,
.ss-left-menu .collapse ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ss-left-menu ul[data-depth="1"] > li,
.ss-left-menu ul[data-depth="2"] > li,
.ss-left-menu ul[data-depth="3"] > li,
.ss-left-menu ul[data-depth="4"] > li,
.ss-left-menu .sub-menu li,
.ss-left-menu .popover li,
.ss-left-menu .collapse li {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ss-left-menu ul[data-depth="1"] a,
.ss-left-menu ul[data-depth="2"] a,
.ss-left-menu ul[data-depth="3"] a,
.ss-left-menu ul[data-depth="4"] a,
.ss-left-menu .sub-menu a,
.ss-left-menu .popover a,
.ss-left-menu .collapse a {
  display: block !important;
  width: 100% !important;
  color: #000 !important;
  background: #fff !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  line-height: 1.2 !important;
  padding: 11px 34px 11px 14px !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  position: relative !important;
}

.ss-left-menu ul[data-depth="1"] li:hover > a,
.ss-left-menu ul[data-depth="2"] li:hover > a,
.ss-left-menu ul[data-depth="3"] li:hover > a,
.ss-left-menu ul[data-depth="4"] li:hover > a,
.ss-left-menu .sub-menu li:hover > a,
.ss-left-menu .popover li:hover > a,
.ss-left-menu .collapse li:hover > a {
  background: #f3b18c !important;
  color: #000 !important;
}

/* Arrow indicator, JS-free */
.ss-left-menu .sub-menu li > a::after,
.ss-left-menu ul[data-depth="1"] li > a::after,
.ss-left-menu ul[data-depth="2"] li > a::after,
.ss-left-menu ul[data-depth="3"] li > a::after {
  content: "›";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 26px;
  font-weight: 900;
}

/* Do not show arrow for leaf nodes if ps_mainmenu marks no children poorly: hover still works */
.ss-left-menu li:not(:hover) > .sub-menu,
.ss-left-menu li:not(:hover) > .popover,
.ss-left-menu li:not(:hover) > .collapse {
  pointer-events: none !important;
}

.ss-left-menu li:hover > .sub-menu,
.ss-left-menu li:hover > .popover,
.ss-left-menu li:hover > .collapse {
  pointer-events: auto !important;
}

/* Mobile hidden until drawer is built */
@media (max-width: 991px) {
  .ss-left-menu #_desktop_top_menu,
  .ss-left-menu .top-menu,
  .ss-left-menu .menu {
    display: none !important;
  }
}


/* V12: force all product sections to 4 columns on desktop */

/* Main homepage product blocks */
.featured-products .products,
.product-accessories .products,
.product-miniature-list,
.products,
#products .products,
.block-category + #products .products,
.ss-products-strip .products,
#index .featured-products .products,
#index .product-accessories .products,
#index .products {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 42px !important;
  align-items: stretch !important;
}

/* Reset classic/bootstrap widths */
.featured-products .products article.product-miniature,
.product-accessories .products article.product-miniature,
.products article.product-miniature,
#products .products article.product-miniature,
#index .products article.product-miniature,
#index .featured-products .product-miniature,
#index .product-miniature,
.product-miniature {
  width: 100% !important;
  max-width: none !important;
  flex: none !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Product cards full width inside the 4-column grid */
.product-miniature .thumbnail-container {
  width: 100% !important;
  min-height: 390px !important;
  background: #fff !important;
  border: 1px solid #dedede !important;
  box-shadow: none !important;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease !important;
}

.product-miniature:hover .thumbnail-container {
  transform: translateY(-4px) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,.08) !important;
  border-color: #cfcfcf !important;
}

.product-miniature .thumbnail-container .thumbnail-top,
.product-miniature .thumbnail-top {
  background: #f3f3f3 !important;
}

.product-miniature img {
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}

/* Section spacing */
#index .featured-products,
#index .product-accessories,
#index .ss-products-strip,
.featured-products,
.product-accessories {
  padding-left: 56px !important;
  padding-right: 56px !important;
}

/* Section titles */
#index .featured-products h2,
#index .product-accessories h2,
.featured-products h2,
.product-accessories h2,
.products-section-title {
  text-align: center !important;
  font-weight: 500 !important;
  letter-spacing: .02em !important;
  text-transform: uppercase !important;
  margin-bottom: 42px !important;
}

/* Offer / bestseller links align cleanly */
.all-product-link,
.featured-products .all-product-link,
.product-accessories .all-product-link {
  display: block !important;
  text-align: right !important;
  margin-top: 24px !important;
  color: #777 !important;
}

/* If a row has only 2 products, keep them in 4-grid positions instead of stretching */
#index .featured-products .products,
#index .product-accessories .products {
  justify-content: start !important;
}

/* Tablet */
@media (max-width: 1199px) {
  .featured-products .products,
  .product-accessories .products,
  .product-miniature-list,
  .products,
  #products .products,
  .ss-products-strip .products,
  #index .featured-products .products,
  #index .product-accessories .products,
  #index .products {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 30px !important;
  }
}

/* Small tablet */
@media (max-width: 991px) {
  .featured-products .products,
  .product-accessories .products,
  .product-miniature-list,
  .products,
  #products .products,
  .ss-products-strip .products,
  #index .featured-products .products,
  #index .product-accessories .products,
  #index .products {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
  }

  #index .featured-products,
  #index .product-accessories,
  #index .ss-products-strip,
  .featured-products,
  .product-accessories {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}

/* Mobile */
@media (max-width: 575px) {
  .featured-products .products,
  .product-accessories .products,
  .product-miniature-list,
  .products,
  #products .products,
  .ss-products-strip .products,
  #index .featured-products .products,
  #index .product-accessories .products,
  #index .products {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }
}


/* V13: definitive submenu color fix */
.ss-left-menu .top-menu[data-depth="0"] .sub-menu,
.ss-left-menu .top-menu[data-depth="0"] .popover,
.ss-left-menu .top-menu[data-depth="0"] .collapse,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="1"],
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="2"],
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="3"],
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="4"] {
  background: #ffffff !important;
  color: #000000 !important;
}

.ss-left-menu .top-menu[data-depth="0"] .sub-menu *,
.ss-left-menu .top-menu[data-depth="0"] .popover *,
.ss-left-menu .top-menu[data-depth="0"] .collapse *,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="1"] *,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="2"] *,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="3"] *,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="4"] * {
  color: #000000 !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.ss-left-menu .top-menu[data-depth="0"] .sub-menu a,
.ss-left-menu .top-menu[data-depth="0"] .popover a,
.ss-left-menu .top-menu[data-depth="0"] .collapse a,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="1"] a,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="2"] a,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="3"] a,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="4"] a,
.ss-left-menu .top-menu[data-depth="0"] .sub-menu .dropdown-item,
.ss-left-menu .top-menu[data-depth="0"] .popover .dropdown-item,
.ss-left-menu .top-menu[data-depth="0"] .collapse .dropdown-item {
  color: #000000 !important;
  background: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
  font-weight: 700 !important;
  text-shadow: none !important;
}

.ss-left-menu .top-menu[data-depth="0"] .sub-menu li:hover > a,
.ss-left-menu .top-menu[data-depth="0"] .popover li:hover > a,
.ss-left-menu .top-menu[data-depth="0"] .collapse li:hover > a,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="1"] li:hover > a,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="2"] li:hover > a,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="3"] li:hover > a,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="4"] li:hover > a,
.ss-left-menu .top-menu[data-depth="0"] .sub-menu li:hover > .dropdown-item,
.ss-left-menu .top-menu[data-depth="0"] .popover li:hover > .dropdown-item,
.ss-left-menu .top-menu[data-depth="0"] .collapse li:hover > .dropdown-item {
  color: #000000 !important;
  background: #f3b18c !important;
}

/* Make arrow black too */
.ss-left-menu .top-menu[data-depth="0"] .sub-menu a::after,
.ss-left-menu .top-menu[data-depth="0"] .popover a::after,
.ss-left-menu .top-menu[data-depth="0"] .collapse a::after,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="1"] a::after,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="2"] a::after,
.ss-left-menu .top-menu[data-depth="0"] ul[data-depth="3"] a::after {
  color: #000000 !important;
}

/* Keep only main navbar links white before scroll */
body:not(.ss-scrolled) .ss-left-menu .top-menu[data-depth="0"] > li > a,
body:not(.ss-scrolled) .ss-left-menu .top-menu[data-depth="0"] > li > .dropdown-item {
  color: #ffffff !important;
}

/* But submenus always black text */
body:not(.ss-scrolled) .ss-left-menu .top-menu[data-depth="0"] .sub-menu a,
body:not(.ss-scrolled) .ss-left-menu .top-menu[data-depth="0"] .popover a,
body:not(.ss-scrolled) .ss-left-menu .top-menu[data-depth="0"] .collapse a,
body:not(.ss-scrolled) .ss-left-menu .top-menu[data-depth="0"] ul[data-depth="1"] a,
body:not(.ss-scrolled) .ss-left-menu .top-menu[data-depth="0"] ul[data-depth="2"] a,
body:not(.ss-scrolled) .ss-left-menu .top-menu[data-depth="0"] ul[data-depth="3"] a,
body:not(.ss-scrolled) .ss-left-menu .top-menu[data-depth="0"] ul[data-depth="4"] a {
  color: #000000 !important;
}

/* Improve submenu readability */
.ss-left-menu .top-menu[data-depth="0"] .sub-menu,
.ss-left-menu .top-menu[data-depth="0"] .popover,
.ss-left-menu .top-menu[data-depth="0"] .collapse {
  backdrop-filter: none !important;
}