/* stylelint-disable no-descending-specificity */

:root {
 --desktop-submenu-wrapper-width: 366px;
 --desktop-large-panel-width: 100%;
 --desktop-panel-min-height: 100svh;
 --desktop-panel-max-height: 100svh;
 --desktop-header-height: 97px;
 --desktop-submenu-padding-horizontal: 48px 40px;
 --desktop-submenu-padding: 48px 40px;
 --default-menu-font: var(--type-display-2-font);
 --default-menu-letter-spacing: var(--type-display-2-letter-spacing);
 --default-menu-level1-font: var(--type-display-3-font);
 --default-menu-level1-letter-spacing: var(--type-display-3-letter-spacing);
 --default-menu-level2-font: var(--type-headline-1-font);
 --default-menu-level2-letter-spacing: var(--type-headline-1-letter-spacing);
 --default-menu-level3-font: var(--type-body-1-default-font);
 --default-menu-level3-letter-spacing: var(--type-body-1-default-letter-spacing);
 --li-menu-padding: 8px 0;
}

/* ---------- BASE ---------- */
.img-brand {
 display: none;
}

.brands .submenu-title {
 display: none;
}

header nav .nav-sections .brands > .submenu-wrapper > .level-1 > .submenu-title {
 display: block;
}

header nav .nav-sections ul > li.nav-drop.brands .submenu-title a {
   margin: 0;
}

.nav-links div > a {
 display: flex;
 align-items: center;
 column-gap: 16px;
 font: var(--type-select-1-font);
 line-height: 1;
 letter-spacing: var(--type-body-2-default-font);
 position: relative;
}

.brands ul.level-2 {
 display: grid;
 grid-template-columns: repeat(var(--brands-grid-columns, auto-fit), 106px);
 gap: 40px 49px;
 justify-content: center;

 .img-brand {
  display: block;
 }

 a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  height: 100%;
  color: var(--color-black-100);

  span {
   flex-grow: 1;
   display: flex;
   align-items: center;
  }
 }
}

.desktop-link {
 display: none;
}

.label-container {
 display: flex;
 justify-content: space-between;
 align-items: center;
 position: relative;
}

.nav-links {
 background: var(--color-gray-25);
 padding: 32px 16px;
 row-gap: 24px;
}

.submenu-header.level-1 {
 display: none;
}

.nav-links div > a::after {
 content: url('../../../../icons/ultaIcons/menu-right.svg');
 position: absolute;
 right: 0;
}

.nav-links img {
 vertical-align: middle;
}

.nav-links .account-register-login a::before {
 content: url('../../../../icons/user.svg');
 height: 20px;
 width: 20px;
 display: block;
}

/* Link de la barra superior replicado en el menú móvil (ver ulta-header.js): no tiene
   block-image propio, así que el icono se pone aquí para que alinee con el resto de la lista.
   Cuando contenido dé de alta su block-image, este bloque deja de aplicar por sí solo. */
.nav-links .nav-link-extra > a::before {
 content: url('../../../../icons/ultaIcons/star.svg');
 height: 20px;
 width: 20px;
 flex: 0 0 20px;
 display: block;
}

header nav .nav-sections ul {
 list-style: none;
 padding-left: 0;
 margin: 0;
}

header nav .nav-sections ul > li ul {
 margin-top: 0;
}

.main-nav a:not(.dropin-design a),
.main-nav p {
 font: var(--default-menu-font);
 letter-spacing: var(--default-menu-letter-spacing);
}

header nav .nav-sections ul > li.nav-drop .submenu-title a {
 display: flex;
 align-items: center;
 column-gap: 8px;
 margin-bottom: 24px;
 text-decoration: none;
}

.main-nav .level-1 {
 --default-menu-font: var(--default-menu-level1-font);
 --default-menu-letter-spacing: var(--default-menu-level1-letter-spacing);
}

.main-nav .level-2 {
 --default-menu-font: var(--default-menu-level2-font);
 --default-menu-letter-spacing: var(--default-menu-level2-letter-spacing);
}

.main-nav .level-3 {
 --default-menu-font: var(--default-menu-level3-font);
 --default-menu-letter-spacing: var(--default-menu-level3-letter-spacing);
}

.submenu-wrapper {
 --submenu-wrapper-background-color: var(--background-color);
}

.main-nav .level-0.brands .level-2 {
   --default-menu-font: var(--type-body-1-default-font);
   --default-menu-letter-spacing: var(--type-body-1-default-letter-spacing);
}

/* Custom layouts */
.level-1.nav-drop.search-by > .label-container {
 p {
  pointer-events: none;
  font: var(--type-details-caption-1-font);
  letter-spacing: var(--type-select-1-letter-spacing);
  color: var(--color-gray-600);
  text-transform: uppercase;
 }


 &::after {
  content: unset;
 }
}

.level-1.nav-drop.search-by > .submenu-wrapper {
 display: block;

 > .submenu-header,
 > .submenu-title {
  display: none;
 }

 .level-2 {
  --default-menu-font: var(--type-body-1-default-font);
  --default-menu-letter-spacing: var(--type-body-1-default-letter-spacing);

  > li {
   --li-menu-padding: 8px 0;
  }
 }
}

.level-0.nav-drop.new[aria-expanded='true'] li.submenu-title,
.level-0.nav-drop.new:has([aria-expanded='true']) li.submenu-title {
 display: block;

 .see-all {
  white-space: pre-line;
 }

 a {
  margin: 0;
 }
}

.level-0.nav-drop.new[aria-expanded='true'] > .submenu-wrapper > ul.level-1,
.level-0.nav-drop.new:has([aria-expanded='true']) > .submenu-wrapper > ul.level-1 {
 li.level-1 > .label-container {
  white-space: pre-line;
 }
}

@keyframes color-slide {
   0% {
       background-color: var(--color-primary-rosy-600);
       right: 100%;
       transform: skewX(0deg);
       width: 60%
   }

   20% {
       right: -20%;
       transform: skewX(-5deg)
   }

   50% {
       right: -20%;
       transform: skewX(-5deg);
       width: 60%
   }

   95% {
       right: 0;
       transform: skewX(0deg)
   }

   100% {
       background-color: var(--color-primary-sunset-300);
       right: 0;
       transform: skewX(0deg);
       width: 0
   }
}

/* ========================================================
   DESKTOP STYLES
======================================================== */
@media (width >= 1024px) {
 .menu-slide {
   animation: color-slide .8s cubic-bezier(.5,0,.15,1) forwards;
   height: 100%;
   position: absolute;
   top: 0;
   z-index: 2;
 }

 .nav-sections a:has(.see-all) svg {
  transition: transform 200ms ease-in-out;
 }

 .nav-sections a:has(.see-all):hover svg {
  transform: translateX(.5rem);
 }
   
 .main-nav-overlay {
  position: fixed;
  top: calc(var(--pre-header-height) + var(--nav-height) + var(--nav-sections-height));
  left: 0;
  width: 100%;
  height: calc(100vh - (var(--pre-header-height) + var(--nav-height) + var(--nav-sections-height)));
  background: var(--color-black);
  opacity: .4;
  z-index: 99;
 }

 ul.level-2 .label-container {
  max-width: max-content;
 }

 .search-by ul.level-2 .label-container {
  max-width: unset;
 }

 .label-container {
  height: 100%;
 }

 .label-container:hover::after {
   transform: translateX(.5rem);
 }

 li.level-3 .label-container > a {
   max-width: 100%;
   white-space: break-spaces;
 }

 .submenu-wrapper {
  --submenu-wrapper-left: 0;
 }

 .level-1 .submenu-wrapper {
  --submenu-wrapper-background-color: var(--color-gray-50);
 }

 header nav .nav-sections .submenu-wrapper {
  background-color: var(--submenu-wrapper-background-color);
  box-sizing: border-box;
  left: var(--submenu-wrapper-left, 0);
  top: var(--desktop-header-height);
  z-index: 100;
 }

 header nav .nav-sections .level-0 > .submenu-wrapper {
   width: 0;
   box-sizing: border-box;
 }

 .level-1 > .submenu-wrapper {
  overflow: hidden;
  max-width: 0;
  transition:
    max-width .6s ease-in-out,
    padding-left .6s ease-in-out,
    padding-right .6s ease-in-out;
 }

 .search-by .submenu-wrapper {
  overflow: unset;
  max-width: unset;
 }

 .level-1[aria-expanded='true'] > .submenu-wrapper {
  --submenu-wrapper-left: var(--desktop-submenu-wrapper-width);
  --desktop-header-height: 0;

  position: absolute;
  max-height: 100%;
  overflow-y: auto;
  padding: var(--desktop-submenu-padding);
  max-width: calc(100vw - var(--desktop-submenu-wrapper-width));
  min-height: 100%;
 }

 .level-1.nav-drop > .label-container {
  &::after {
   content: url('../../../../icons/ultaIcons/menu-right.svg');
   height: 16px;
   transition: transform 200ms ease-in-out;
  }
 }

 li.level-2 > .label-container {
  .desktop-link {
   display: block;
  }

  .normal-label {
   display: none;
  }
 }

 header .main-nav {
  --default-menu-font: var(--type-display-5-font);
  --default-menu-letter-spacing: var(--type-body-1-default-letter-spacing);
  --default-menu-level1-font: var(--type-display-3-font);
  --default-menu-level1-letter-spacing: var(--type-display-3-letter-spacing);
  --default-menu-level2-font: var(--type-display-3-font);
  --default-menu-level2-letter-spacing: var(--type-display-3-letter-spacing);
  --default-menu-level3-font: var(--type-display-4-font);
  --default-menu-level3-letter-spacing: var(--type-display-4-letter-spacing);
 }

 header nav .nav-sections .submenu-title,
 header nav .nav-sections .submenu-header {
  display: none;
 }

 .nav-sections a,
 .nav-sections .label-container {
  cursor: pointer;
 }

 header nav .nav-sections .default-content-wrapper > ul > li a {
  text-decoration: none;
 }

 header nav .nav-sections .default-content-wrapper > ul > li ul.level-2 a:hover,
 header nav .nav-sections .default-content-wrapper > ul > li .new.level-1 a:hover {
  text-decoration: underline;
 }

 header nav .nav-sections ul:not(.level-3) {
  display: flex;
  /* justify-content: center; */
 }

 header nav .nav-sections ul.level-0 {
  gap: clamp(1.5rem, -2.699rem + 4.096vw, 1.8rem);
 }

 header nav .nav-sections ul.level-1 {
  gap: 24px;
 }

 header nav .nav-sections ul.level-0,
 header nav .nav-sections .level-0 li.level-0,
 header nav .nav-sections .default-content-wrapper {
  height: 100%;
  align-items: center;
 }

 header nav .nav-sections li.level-0 > .label-container::before {
  background-color: var(--color-black);
  border-radius: .188rem;
  content: '';
  height: .188rem;
  pointer-events: none;
  position: absolute;
  bottom: 0;
  transition: width .2s ease;
  width: 0;
 }

 header nav .nav-sections li.level-0:has([aria-expanded='true']) li.level-1 > .label-container,
 header nav .nav-sections li.level-0:has([aria-expanded='true']) li.level-1 > .label-container a {
  color: var(--color-gray-600);

  &::after {
    filter: invert(47%) sepia(0%) saturate(476%) hue-rotate(216deg) brightness(89%) contrast(83%);
  }
 }

 header nav .nav-sections li.level-0:has([aria-expanded='true']) li.level-1 > .label-container:hover,
 header nav .nav-sections li.level-0:has([aria-expanded='true']) li.level-1 > .label-container:hover a {
  color: var(--color-black);

  &::after {
    filter: unset
  }
 }

 header nav .nav-sections li.level-1[aria-expanded='true'] > .label-container p.normal-label {
  color: var(--color-black);
 }

 header nav .nav-sections li.level-0 li.level-1[aria-expanded='true'] > span.label-container::after {
   filter: unset;
 }

 header nav .nav-sections li.level-0:hover > .label-container::before,
 header nav .nav-sections li.level-0[aria-expanded='true'] > .label-container::before {
  width: 100%;
 }

 header nav .nav-sections .default-content-wrapper > ul > li {
  flex: 0 1 auto;
 }

 header nav .nav-sections .default-content-wrapper > ul > li ul:not(.level-3) {
  display: none;
 }

 /* Open level 1 */
 header nav .nav-sections li.level-0[aria-expanded='true'] ul.level-1,
 header nav .nav-sections .level-0 ul.level-1:has(.level-1[aria-expanded='true']),
 header nav .nav-sections .level-0 .level-1:has(.search-by [aria-expanded='true']) {
  display: flex;
  flex-direction: column;
  max-height: 100%;
  width: 100%;
  box-sizing: border-box;
  overflow: hidden auto;
  padding: var(--desktop-submenu-padding);

  /* Show search by layout */
  /* stylelint-disable */
  .search-by.level-1 > .submenu-wrapper > ul {
   display: flex;
   flex-direction: column;
  }
  /* stylelint-enable */
 }

 /* Submenu level 0 */
 header nav .nav-sections li.level-0[aria-expanded='true'] > .submenu-wrapper,
 header nav .nav-sections .level-0:has(.level-1[aria-expanded='true']) > .submenu-wrapper,
 header nav .nav-sections .level-0:has(.level-2[aria-expanded='true']) > .submenu-wrapper {
  position: absolute;
  width: var(--desktop-submenu-wrapper-width);
  max-height: calc(var(--desktop-panel-max-height) - var(--desktop-header-height));
  height: calc(var(--desktop-panel-min-height) - var(--desktop-header-height));
  box-sizing: border-box;
  transition:
    width .6s cubic-bezier(.5,0,.15,1),
    padding-left .6s cubic-bezier(.5,0,.15,1),
    padding-right .6s cubic-bezier(.5,0,.15,1);
 }

 /* Show see all */
 header nav .nav-sections .nav-drop:not(.brands) [aria-expanded='true'].level-1 > .submenu-wrapper > .submenu-title {
  display: flex;
  margin-bottom: 24px;
 }

 /* Open level 2 */
 header nav .nav-sections .level-1[aria-expanded='true'] .submenu-wrapper > ul.level-2 {
  display: var(--level-2-expanded-display, block);
  column-count: var(--level-2-expanded-column-count, 3);
  max-width: var(--level-2-expanded-max-width, max-content);
  width: var(--level-2-expanded-width, max-content);
  gap: 40px;

  > li {
   margin-bottom: var(--level-2-expanded-li-margin-bottom, 40px);
   break-inside: avoid;
   max-width: 298px;
  }

  li {
   &.level-2 > .label-container {
    height: 100%;

    p,
    a {
     white-space: pre-line;
    }
   }
  }

  /* stylelint-disable */
  ul {
   margin-top: 8px;
  }
  /* stylelint-enable */
 }

 header nav .nav-sections .level-0.brands .level-1[aria-expanded='true'] .submenu-wrapper > ul.level-2 {
  --level-2-expanded-display: grid;
  --level-2-expanded-max-height: unset;
  --level-2-expanded-max-width: 100%;
  --level-2-expanded-width: 568px;
  --level-2-expanded-li-margin-bottom: 0;
  --brands-grid-columns: 4;
 }

 .level-1.search-by > .submenu-wrapper .nav-drop.level-2 > .label-container::after {
  content: url('../../../../icons/ultaIcons/menu-left.svg');
  transform: rotate(180deg);
 }

 /* stylelint-disable */
 .search-by.level-1 {
  a,
  p {
   color: var(--color-gray-600);
  }

  > .label-container {
   margin-bottom: 8px;
   cursor: default;
   pointer-events: none;
  }

  .submenu-wrapper .label-container::after {
    filter: invert(47%) sepia(0%) saturate(476%) hue-rotate(216deg) brightness(89%) contrast(83%);
  }

  li.level-2[aria-expanded='true'] .submenu-wrapper {
    p {
      color: var(--color-black);
    }

    .label-container::after {
      filter: unset;
    }
  }

  .submenu-wrapper .label-container:hover {
    a,
    p {
      color: var(--color-black);
    }

    &::after {
      filter: unset;
    }
  }

  ul.level-2 > li {
   padding: 8px 0;
  }

  .submenu-wrapper {
   --submenu-wrapper-background-color: inherit;

   ul {
    display: none;

    .desktop-link {
     display: none;
    }

    .normal-label {
     display: block;
    }
   }
  }

  .level-2[aria-expanded='true'] {
   .submenu-wrapper {
    --submenu-wrapper-background-color: var(--color-gray-50);
    --submenu-wrapper-left: var(--desktop-submenu-wrapper-width);
    --desktop-header-height: 0;

    position: absolute;
    max-height: 100%;
    height: 100%;
    overflow-y: auto;
    padding: var(--desktop-submenu-padding);
    max-width: max-content;

    a,
    p {
     --default-menu-font: var(--default-menu-level1-font);
     --default-menu-letter-spacing: var(--default-menu-level1-letter-spacing);

     color: var(--color-black);
    }

    .submenu-title {
     display: block;
     margin-bottom: 40px;

     a {
      margin: 0;
     }
    }
   }

   ul.level-3 {
    display: flex;
    flex-direction: column;
    row-gap: 40px;
   }
  }
 }
 /* stylelint-enable */
}

@media (width >= 1024px) and (width <= 1440px) {
 header nav .nav-sections .level-1[aria-expanded='true'] .submenu-wrapper > ul.level-2 {
  --level-2-expanded-column-count: 2;
 }
}


/* ========================================================
   MOBILE STYLES
======================================================== */
@media (width < 1024px) {
 header nav .nav-sections {
  box-sizing: border-box;
  position: relative;
  max-width: none;
  width: 100%;
 }

 header nav .nav-sections .main-nav-mobile {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
 }

 header nav .nav-sections .main-nav-mobile > .main-nav-mobile-section-title {
  --li-menu-padding: 0;

  color: var(--color-black);
  font: var(--type-headline-2-strong-font);
  letter-spacing: var(--type-headline-2-strong-letter-spacing);
  grid-column: 1 / -1;
  margin: 16px 0;
  padding: 0;
 }

 header nav .nav-sections .main-nav-mobile > .main-nav-mobile-top-title {
  --li-menu-padding: 0;

  align-items: center;
  color: var(--color-black);
  display: flex;
  font: var(--type-headline-2-default-font, var(--type-headline-2-strong-font));
  grid-column: 1 / -1;
  height: var(--nav-hamburger-height);
  letter-spacing: var(--type-headline-2-default-letter-spacing, var(--type-headline-2-strong-letter-spacing));
  margin: 0;
  padding: 0;
  pointer-events: none;
  position: static;
 }

 header nav .nav-sections .main-nav-mobile > .main-nav-mobile-categories-title {
  margin-top: 20px;
 }

 header nav .nav-sections .main-nav-mobile > li.level-0:not(.main-nav-mobile-featured-card) {
  --li-menu-padding: 0;

  grid-column: 1 / -1;
 }

 header nav .nav-sections .main-nav-mobile > li.level-0.main-nav-mobile-shop-item {
  border-bottom: 1px solid var(--color-gray-300);
 }

 header nav .nav-sections .main-nav-mobile,
 header nav .nav-sections .main-nav-mobile * {
  -webkit-tap-highlight-color: transparent;
 }

 header nav .nav-sections .main-nav-mobile:has(> li.level-0.nav-drop[aria-expanded='true']) > li.level-0,
 header nav .nav-sections .main-nav-mobile:has(> li.level-0.nav-drop[aria-expanded='true']) > .main-nav-mobile-section-title {
  display: none;
 }

 header nav .nav-sections .main-nav-mobile:has(> li.level-0.nav-drop[aria-expanded='true']) > li.level-0[aria-expanded='true'] {
  display: block;
  grid-column: 1 / -1;
  pointer-events: none;
 }

 header nav .nav-sections .main-nav-mobile:has(> li.level-0.nav-drop[aria-expanded='true']) > li.level-0[aria-expanded='true'] > .submenu-wrapper {
  pointer-events: auto;
 }

 header nav .nav-sections .main-nav-mobile > li.level-0:not(.main-nav-mobile-featured-card) > .label-container {
  box-sizing: border-box;
  padding: 8px 0;
  width: 100%;
 }

 header nav .nav-sections .main-nav-mobile > li.level-0:not(.main-nav-mobile-featured-card):not(.nav-drop) > .label-container > a {
  align-items: center;
  color: var(--color-black);
  display: flex;
  gap: 12px;
  text-decoration: none;
  width: 100%;
 }

 header nav .nav-sections .main-nav-mobile > li.level-0:not(.main-nav-mobile-featured-card) > .label-container > p {
  box-sizing: border-box;
  width: 100%;
 }

 header nav .nav-sections .main-nav-mobile > li.level-0.main-nav-mobile-featured-card {
  --li-menu-padding: 0;

  border-bottom: 0;
  padding: 0;
 }

 header nav .nav-sections .main-nav-mobile-featured-card > .label-container {
  display: block;
 }

 header nav .nav-sections .main-nav-mobile-shop-item-label,
 header nav .nav-sections .main-nav-mobile-shop-link {
  align-items: center;
  color: var(--color-black);
  display: flex;
  gap: 12px;
  margin: 0;
  text-decoration: none;
 }

 header nav .nav-sections .main-nav-mobile-featured-card-trigger,
 header nav .nav-sections .main-nav-mobile-featured-card-link {
  align-items: center;
  background: var(--color-neutral-200, #f5f5f5);
  border-radius: 8px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  overflow: hidden;
  padding: 12px 8px;
  text-align: center;
  text-decoration: none;
  width: 100%;
 }

 header nav .nav-sections .main-nav-mobile-featured-card-label {
  align-items: center;
  display: flex;
  flex-direction: column;
  margin: 0;
  text-align: center;
 }

 header nav .nav-sections .main-nav-mobile-shop-image {
  border-radius: 50%;
  display: block;
  flex-shrink: 0;
  height: 56px;
  object-fit: cover;
  width: 56px;
 }

 header nav .nav-sections .main-nav-mobile-featured-image {
  display: block;
  height: 56px;
  margin-bottom: 8px;
  object-fit: contain;
  width: 56px;
 }

 header nav .nav-sections,
 header nav .nav-sections .main-nav-mobile-shop-name {
  color: var(--color-black);
  font: var(--type-body-2-default-font);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: var(--type-body-2-default-letter-spacing);
  line-height: 1.25;
 }

 .main-nav-mobile-featured-name{
  font-size: 14px;
  font-weight: 400;
  line-height: 1.25;
 }

 header nav .nav-sections .main-nav-mobile-featured-name {
  display: -webkit-box;
  min-height: calc(1.25em * 3);
  overflow: hidden;
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
 }

 header nav .nav-sections .main-nav-mobile-highlight-name {
  color: var(--color-primary-rosy-500);
  /* font: var(--type-body-2-strong-font); */
  letter-spacing: var(--type-body-2-strong-letter-spacing);
 }

 header nav .nav-sections .main-nav-mobile-accordion-item {
  --li-menu-padding: 0;

  border-bottom: 1px solid var(--color-gray-300);
 }

 header nav .nav-sections .main-nav-mobile-accordion-link,
 header nav .nav-sections .main-nav-mobile-accordion-trigger {
  align-items: center;
  background: none;
  border: 0;
  box-sizing: border-box;
  color: var(--color-black);
  display: flex;
  justify-content: space-between;
  margin: 0;
  padding: 8px 0;
  text-align: left;
  text-decoration: none;
  width: 100%;
 }
 

 header nav .nav-sections .main-nav-mobile-accordion-trigger {
  cursor: pointer;
  font: inherit;
 }

 header nav .nav-sections .main-nav-mobile-accordion-summary {
  align-items: center;
  display: flex;
  gap: 12px;
  min-width: 0;
 }

 header nav .nav-sections .main-nav-mobile-accordion-image {
  display: block;
  flex-shrink: 0;
  height: 40px;
  object-fit: contain;
  width: 40px;
 }
 header nav .nav-sections .main-nav-mobile-accordion-name {
  color: var(--color-black);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: var(--type-body-1-default-letter-spacing);
 }

 header nav .nav-sections .main-nav-mobile-accordion-child-name {
  color: var(--color-black);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: var(--type-body-1-default-letter-spacing);
 }

 header nav .nav-sections .main-nav-mobile-accordion-overview .main-nav-mobile-accordion-name,
 header nav .nav-sections .main-nav-mobile-accordion-link-item-see-all a {
  font: var(--type-body-1-strong-font, var(--type-body-1-default-font));
  letter-spacing: var(--type-body-1-strong-letter-spacing, var(--type-body-1-default-letter-spacing));
 }

 header nav .nav-sections .main-nav-mobile-accordion-trigger::after {
  content: url('../../../../icons/icon-accordion-plus.svg');
  flex-shrink: 0;
  height: 16px;
 }

 header nav .nav-sections .main-nav-mobile-accordion-item-expandable.is-expanded > .main-nav-mobile-accordion-trigger::after {
  content: url('../../../../icons/icon-accordion-minus.svg');
 }

 header nav .nav-sections .main-nav-mobile-accordion-panel {
  padding: 0 0 16px 32px;
 }

 header nav .nav-sections .main-nav-mobile-accordion-item-has-image > .main-nav-mobile-accordion-panel {
  padding-left: 32px;
 }

 header nav .nav-sections .main-nav-mobile-accordion-links {
  display: grid;
  gap: 12px;
 }

 header nav .nav-sections .main-nav-mobile-accordion-link-item {
  --li-menu-padding: 0;
 }

 header nav .nav-sections .main-nav-mobile-accordion-link-item a {
  align-items: center;
  color: var(--color-black);
  display: flex;
  font: var(--type-body-1-default-font);
  gap: 12px;
  letter-spacing: var(--type-body-1-default-letter-spacing);
  margin: 0;
  text-decoration: none;
  width: 100%;
 }

header nav .nav-sections .main-nav-mobile-inspired {
  padding: 24px 12px 32px;
  position: relative;
  /* height: stretch; */
 }

 header nav .nav-sections .main-nav-mobile-inspired::before {
  background: var(--color-neutral-200, #f5f5f5);
  content: '';
  inset: 0;
  position: absolute;
  z-index: -1;
 }

 header nav .nav-sections .main-nav-mobile-inspired-title {
  color: var(--color-black);
  font: var(--type-body-2-strong-font);
  letter-spacing: var(--type-body-2-strong-letter-spacing);
  margin: 0;
 }

 header nav .nav-sections .main-nav-mobile-inspired-list {
  display: grid;
  gap: 16px;
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
 }

 header nav .nav-sections .main-nav-mobile-inspired-item {
  --li-menu-padding: 0;
 }

 header nav .nav-sections .main-nav-mobile-inspired-link {
  align-items: stretch;
  background: var(--color-neutral-50);
  border-radius: 12px;
  box-sizing: border-box;
  color: var(--color-black);
  display: grid;
  gap: 0;
  grid-template-columns: 56px minmax(0, 1fr);
  height: 56px;
  max-height: 56px;
  overflow: hidden;
  padding: 0;
  text-decoration: none;
  width: 100%;
 }

  header nav .nav-sections .main-nav-mobile-inspired-image {
  border-radius: 12px 0 0 12px;
  display: block;
  height: 100%;
  max-height: 56px;
  object-fit: cover;
  width: 56px;
 }

 header nav .nav-sections .main-nav-mobile-inspired .main-nav-inspired-text {
  align-content: center;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 8px 12px;
 }

 header nav .nav-sections .main-nav-mobile-inspired .main-nav-inspired-card-title {
  color: var(--color-black);
  display: block;
  font: var(--type-body-1-default-font);
  font-weight: 400;
  letter-spacing: var(--type-body-1-default-letter-spacing);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 250px;
 }

header nav .nav-sections .main-nav-mobile-inspired .main-nav-inspired-card-description,
header nav .nav-sections .main-nav-mobile-inspired .main-nav-inspired-card-cta {
  color: var(--color-gray-700);
  display: block;
  font: var(--type-body-2-default-font);
  font-weight: 400;
  letter-spacing: var(--type-body-2-default-letter-spacing);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 250px;
 }

 header nav .nav-sections .main-nav-mobile-inspired-brands-list {
  column-gap: 14px;
  display: flex !important;
  flex-wrap: wrap;
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
  row-gap: 14px;
  justify-content: center;
 }

 header nav .nav-sections .main-nav-mobile-inspired-brands-item {
  --li-menu-padding: 0;
  flex: 0 0 95px;
 }

 header nav .nav-sections .main-nav-mobile-inspired-brands-link {
  align-items: start;
  color: var(--color-black);
  display: grid;
  gap: 12px;
  justify-items: center;
  overflow: visible;
  padding: 0;
  text-align: center;
  text-decoration: none;
  width: 95px;
 }

 header nav .nav-sections .main-nav-mobile-inspired-brands-media {
  align-items: center;
  background: var(--color-neutral-50);
  border: 1px solid var(--color-gray-300);
  border-radius: 50%;
  display: grid;
  height: 95px;
  justify-items: center;
  overflow: hidden;
  width: 95px;
 }

 header nav .nav-sections .main-nav-mobile-inspired-brands-image {
  border-radius: 0;
  height: 100%;
  object-fit: contain;
  width: 100%;
 }

 header nav .nav-sections .main-nav-mobile-inspired-brands-placeholder {
  color: var(--color-gray-700);
  font: var(--type-body-1-strong-font, var(--type-body-1-default-font));
 }

 header nav .nav-sections .main-nav-mobile-inspired-brands-name {
  color: var(--color-black);
  display: -webkit-box;
  font: var(--type-body-2-default-font);
  font-weight: 400;
  letter-spacing: var(--type-body-2-default-letter-spacing);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  padding-right: 0;
  text-overflow: ellipsis;
  white-space: normal;
 }

 /* Level 2 config */
 .main-nav .level-1.nav-drop:not(.search-by) .level-2 {
  --li-menu-padding: 17.5px 0;
 }

 .main-nav .level-1.nav-drop:not(.search-by) .level-2.nav-drop {
  border-bottom: 1px solid var(--color-gray-300);
 }

 .main-nav .level-1.nav-drop:not(.search-by) .level-3 {
  --li-menu-padding: 8px 0;
 }

 /* END Level 2 config */
 header nav .nav-sections ul li {
  padding: var(--li-menu-padding);
 }

 header nav .nav-sections .submenu-title {
  display: none;
 }

 header nav .nav-sections ul > li.nav-drop {
  cursor: pointer;
 }

 header nav .nav-sections ul > li.nav-drop > .label-container::after {
  content: url('../../../../icons/ultaIcons/menu-right.svg');
  height: 16px;
 }

 header nav .nav-sections ul > li.main-nav-mobile-featured-card.nav-drop > .label-container::after {
  content: none;
 }

 /* Level 2 icons */
 header nav .nav-sections .level-1.nav-drop:not(.search-by) ul > .nav-drop.level-2 > .label-container::after {
  content: url('../../../../icons/icon-accordion-plus.svg');
  height: 16px;
 }

 header nav .nav-sections .level-1.nav-drop:not(.search-by) ul > .nav-drop.level-2[aria-expanded='true'] > .label-container::after {
  content: url('../../../../icons/icon-accordion-minus.svg');
  height: 16px;
 }

 header nav [aria-expanded='false'] .submenu-wrapper > .submenu-header,
 header nav [aria-expanded='false'] .submenu-wrapper > .submenu-title {
  display: none;
 }

 header [aria-expanded='true'] ul .submenu-wrapper:not(:has([aria-expanded='true'])),
 header [aria-expanded='false'].level-0:not(:has([aria-expanded='true'])) > .submenu-wrapper {
  display: none;
 }

 header nav .level-0[aria-expanded='true'] > .submenu-header.level-1,
 header nav [aria-expanded='true']:not(.level-2) .submenu-wrapper > .submenu-header,
 header nav [aria-expanded='true'] .submenu-wrapper > .submenu-title {
  display: flex;
 }

 header nav .nav-sections .submenu-wrapper > .submenu-header {
  display: none !important;
 }

 header nav .nav-sections ul > li.nav-drop[aria-expanded='true'] > .submenu-wrapper,
 header nav .nav-sections .level-1[aria-expanded='false']:has(.level-2[aria-expanded='true']) > .submenu-wrapper {
  background: var(--submenu-wrapper-background-color);
  display: block;
  /* height: calc(100svh - (var(--nav-hamburger-height) + 32px));
  min-height: calc(100svh - (var(--nav-hamburger-height) + 32px)); */
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 3;
  box-sizing: border-box;
  overflow-y: auto;
 }

 header nav .nav-sections ul > li.nav-drop[aria-expanded='true'] > .label-container,
 header nav .nav-sections .level-1[aria-expanded='false']:has(.level-2[aria-expanded='true']) > .label-container {
  display: none;
 }

 /* Custom layout */
 .level-1.nav-drop.search-by > .submenu-wrapper ul {
  --li-menu-padding: 12px 0;

  a {
   --default-menu-font: var(--type-display-2-font);
   --default-menu-letter-spacing: var(--type-display-2-letter-spacing);
  }
 }

 .level-1.nav-drop.search-by > .submenu-wrapper .submenu-title {
  --default-menu-font: var(--type-display-2-font);
  --default-menu-letter-spacing: var(--type-display-2-letter-spacing);

  padding-bottom: 12px;

  a {
   margin: 0;
  }
 }

 .level-1.nav-drop.search-by > .submenu-wrapper li.level-2:not(.nav-drop) {
  a {
    --default-menu-font: var(--type-body-1-default-font);
    --default-menu-letter-spacing: var(--type-body-1-default-letter-spacing);
   }
 }

 /* LEVEL 2 CUSTOMIZATION */
 header nav .nav-sections .level-1.nav-drop:not(.search-by) .level-2 > .submenu-wrapper > .submenu-title a {
  --default-menu-font: var(--default-menu-level3-font);
  --default-menu-letter-spacion: var(--default-menu-level3-letter-spacing);
  --li-menu-padding: 8px 0;

  margin: 10px 0 0;
  padding: var(--li-menu-padding);
 }

 header nav .nav-sections .level-1.nav-drop:not(.search-by) .level-2 > .submenu-wrapper > .submenu-title a svg {
  display: none;
 }

 header nav .nav-sections .level-1[aria-expanded='false']:has(.level-2[aria-expanded='true']) > .submenu-wrapper > .submenu-title,
 header nav .nav-sections .level-1[aria-expanded='false']:has(.level-2[aria-expanded='true']) > .submenu-wrapper > .submenu-header {
  display: flex;
 }

 header nav .nav-sections .level-1.nav-drop:not(.search-by) .level-2[aria-expanded='true'] {
  border-width: 0;
  padding: 0;
 }

 /* stylelint-disable */
 header nav .level-0.brands [aria-expanded='true'] .submenu-wrapper > .submenu-title {
  display: none;
 }

 header nav .nav-sections .level-1.nav-drop:not(.search-by) ul > li.nav-drop.level-2[aria-expanded='true'] > .label-container {
  display: flex;
 }

 header nav .nav-sections .level-1.nav-drop:not(.search-by) ul > li.nav-drop.level-2[aria-expanded='true'] > .submenu-wrapper {
  display: block;
  height: max-content;
  min-height: max-content;
  position: unset;
  width: 100%;
  padding: 0;
  box-sizing: border-box;
 }

 header nav .nav-sections .level-2[aria-expanded='true'] > .label-container {
  border-bottom: 1px solid var(--color-gray-300);
  padding: var(--li-menu-padding);
 }

 /* End customization level 2 */
header nav .nav-sections ul > li.nav-drop .submenu-header {
  align-items: center;
  height: var(--nav-hamburger-height);
  left: 0;
  position: fixed;
  top: 0;
  width: auto;
  z-index: 3;
 }

 /* stylelint-enable */
 header nav .nav-sections ul > li.nav-drop .submenu-header .back-link {
  display: flex;
  align-items: center;
  column-gap: 8px;
  font-size: 0;
  letter-spacing: 0;
  padding: 0 16px;
  width: 24px;
 }

 header nav .nav-sections ul > li .submenu-header .back-link::before {
  background: url('../../../../icons/ultaIcons/chevron-left-back.svg') center / contain no-repeat;
  content: '';
  display: block;
  height: 20px;
  width: 20px;
 }
}

/* ========================================================
   DESKTOP MEGA NAV (NEW DESIGN)
======================================================== */
@media (width >= 1024px) {
 header nav .nav-sections {
  box-sizing: border-box;
  justify-self: stretch;
  position: relative;
  width: 100%;
 }

 header nav .nav-sections::before {
  background: var(--color-gray-300);
  content: '';
  height: 1px;
  left: 50%;
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  width: 100vw;
 }

 header nav .nav-sections .main-nav-mobile {
  display: none !important;
 }

 header nav .nav-sections .main-nav-desktop {
  position: relative;
 }

 header nav .nav-sections .main-nav-tabs {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  gap: 32px;
  height: 48px;
  list-style: none;
  margin: 0 auto;
  max-width: 1360px;
  overflow-x: auto;
  /* padding: 0 40px; */
  scrollbar-width: none;
  width: 100%;
 }

 header nav .nav-sections .main-nav-tabs::-webkit-scrollbar {
  display: none;
 }

 header nav .nav-sections .main-nav-tab-item {
  flex: 0 0 auto;
  height: 100%;
 }

 header nav .nav-sections .main-nav-tab {
  align-items: center;
  border-bottom: 3px solid transparent;
  color: var(--color-gray-1000);
  display: inline-flex;
  font: var(--type-body-2-default-font);
  height: 100%;
  letter-spacing: var(--type-body-2-default-letter-spacing);
  text-decoration: none;
  white-space: nowrap;
 }

 header nav .nav-sections .main-nav-tab:hover,
 header nav .nav-sections .main-nav-tab:focus-visible,
 header nav .nav-sections .main-nav-tab.is-active {
  border-bottom-color: var(--color-black);
  color: var(--color-black);
  text-decoration: none;
 }

 header nav .nav-sections .main-nav-tab.is-active {
  font-weight: 700;
 }

 header nav .nav-sections .main-nav-tab.main-nav-tab-highlight {
  color: var(--color-primary-rosy-500);
  font-weight: 700;
 }

 header nav .nav-sections .main-nav-tab.main-nav-tab-highlight:hover,
 header nav .nav-sections .main-nav-tab.main-nav-tab-highlight:focus-visible,
 header nav .nav-sections .main-nav-tab.main-nav-tab-highlight.is-active {
  border-bottom-color: var(--color-primary-rosy-400);
  color: var(--color-primary-rosy-400);
  text-decoration: none;
 }

 header nav .nav-sections .main-nav-desktop-panel {
  background: var(--color-neutral-50);
  border-top: 1px solid var(--color-gray-300);
  box-sizing: border-box;
  left: 50%;
  max-height: calc(100vh - (var(--pre-header-height) + var(--nav-height) + var(--nav-sections-height)));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 20px 0 28px;
  position: absolute;
  right: auto;
  top: 100%;
  transform: translateX(-50%);
  -webkit-overflow-scrolling: touch;
  width: 100vw;
  z-index: 10;
 }

 header nav .nav-sections .main-nav-desktop-panel.main-nav-desktop-panel-layout-pending {
  pointer-events: none;
  visibility: hidden;
 }

 header nav .nav-sections .main-nav-desktop-content {
  box-sizing: border-box;
  display: grid;
  gap: 24px;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 310px);
  align-items: start;
  margin: 0 auto;
  max-width: 1440px;
  padding: 0 40px;
  width: 100%;
 }

 header nav .nav-sections .main-nav-desktop-categories {
  flex: 1 1 auto;
  min-width: 0;
 }

 header nav .nav-sections .main-nav-desktop-columns {
  align-items: start;
  column-gap: 24px;
  display: grid;
  grid-template-columns: repeat(var(--desktop-column-count, 1), minmax(0, 1fr));
  margin: 0;
  padding: 0;
  row-gap: 24px;
  width: 100%;
 }

 header nav .nav-sections .main-nav-desktop-column {
  min-width: 0;
 }

 header nav .nav-sections .main-nav-desktop-column-group {
  display: flex;
  flex-direction: column;
  gap: 24px;
 }

 header nav .nav-sections .main-nav-desktop-column-section {
  margin: 0;
  padding: 0;
 }

header nav .nav-sections .main-nav-desktop-inspired {
  align-self: stretch;
  min-width: 240px;
  padding-left: 24px;
  position: relative;
  width: 100%;
  z-index: 1;
 }

 header nav .nav-sections .main-nav-desktop-inspired::before {
  background: var(--color-neutral-200, #f5f5f5);
 content: '';
  inset: -20px 0 -28px 0;
  position: absolute;
  z-index: -1;
  width:50vw;
 }

 header nav .nav-sections .main-nav-desktop-inspired-title {
  color: var(--color-black);
  font-size: 16px;
  letter-spacing: var(--type-body-2-strong-letter-spacing);
  margin: 0;
  font-weight: 600;
 }

 header nav .nav-sections .main-nav-desktop-inspired-list {
  display: grid !important;
  gap: 14px;
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
 }

 header nav .nav-sections .main-nav-desktop-inspired-item {
  margin: 0;
  padding: 0;
 }

 header nav .nav-sections .main-nav-desktop-inspired-link {
  align-items: stretch;
  background: var(--color-neutral-50);
  border-radius: 12px;
  box-sizing: border-box;
  color: var(--color-black);
  display: grid;
  gap: 0;
  grid-template-columns: 56px minmax(0, 1fr);
  height: 56px;
  max-height: 56px;
  overflow: hidden;
  padding: 0;
  text-decoration: none;
  width: 100%;
 }

 header nav .nav-sections .main-nav-desktop-inspired-image {
  border-radius: 12px 0 0 12px;
  display: block;
  object-fit: cover;
  height: 100%;
  max-height: 56px;
  width: 56px;
 }

 header nav .nav-sections .main-nav-desktop-inspired .main-nav-inspired-text {
  align-content: center;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 8px 12px;
 }

 header nav .nav-sections .main-nav-desktop-inspired .main-nav-inspired-card-title {
  color: var(--color-black);
  display: block;
  font: var(--type-body-1-default-font);
  font-weight: 400;
  letter-spacing: var(--type-body-1-default-letter-spacing);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
 }

 header nav .nav-sections .main-nav-desktop-inspired .main-nav-inspired-card-description,
 header nav .nav-sections .main-nav-desktop-inspired .main-nav-inspired-card-cta {
  color: var(--color-gray-700);
  display: block;
  font: var(--type-body-2-default-font);
  font-weight: 400;
  letter-spacing: var(--type-body-2-default-letter-spacing);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
 }

 header nav .nav-sections .main-nav-desktop-inspired-link:hover,
 header nav .nav-sections .main-nav-desktop-inspired-link:focus-visible,
 header nav .nav-sections .main-nav-mobile-inspired-link:hover,
 header nav .nav-sections .main-nav-mobile-inspired-link:focus-visible,
 header nav .nav-sections .main-nav-desktop-inspired-link:hover .main-nav-inspired-card-title,
 header nav .nav-sections .main-nav-desktop-inspired-link:focus-visible .main-nav-inspired-card-title,
 header nav .nav-sections .main-nav-mobile-inspired-link:hover .main-nav-inspired-card-title,
 header nav .nav-sections .main-nav-mobile-inspired-link:focus-visible .main-nav-inspired-card-title,
 header nav .nav-sections .main-nav-mobile-inspired-brands-link:hover,
 header nav .nav-sections .main-nav-mobile-inspired-brands-link:focus-visible,
 header nav .nav-sections .main-nav-desktop-inspired-link:hover .main-nav-inspired-card-description,
 header nav .nav-sections .main-nav-desktop-inspired-link:focus-visible .main-nav-inspired-card-description,
 header nav .nav-sections .main-nav-mobile-inspired-link:hover .main-nav-inspired-card-description,
 header nav .nav-sections .main-nav-mobile-inspired-link:focus-visible .main-nav-inspired-card-description,
 header nav .nav-sections .main-nav-mobile-inspired-brands-link:hover .main-nav-mobile-inspired-brands-name,
 header nav .nav-sections .main-nav-mobile-inspired-brands-link:focus-visible .main-nav-mobile-inspired-brands-name {
  text-decoration: none;
 }

header nav .nav-sections .main-nav-desktop-inspired-brands-list {
  column-gap: 14px;
  display: grid !important;
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  row-gap: 14px;
 }

 header nav .nav-sections .main-nav-desktop-inspired-brands-item {
  padding: 0;
 }

 header nav .nav-sections .main-nav-desktop-inspired-brands-link {
  align-items: start;
  color: var(--color-black);
  display: grid;
  gap: 12px;
  justify-items: center;
  text-align: center;
  text-decoration: none;
 }

 header nav .nav-sections .main-nav-desktop-inspired-brands-media {
  align-items: center;
  background: var(--color-neutral-50);
  border: 1px solid var(--color-gray-300);
  border-radius: 50%;
  display: grid;
  height: 95px;
  justify-items: center;
  overflow: hidden;
  width: 95px;
 }

 header nav .nav-sections .main-nav-desktop-inspired-brands-image {
  border-radius: 0;
  height: 100%;
  object-fit: contain;
  width: 100%;
 }

 header nav .nav-sections .main-nav-desktop-inspired-brands-placeholder {
  color: var(--color-gray-700);
  font: var(--type-body-1-strong-font, var(--type-body-1-default-font));
 }

 header nav .nav-sections .main-nav-desktop-inspired-brands-name {
  color: var(--color-black);
  display: -webkit-box;
  font: var(--type-body-2-default-font);
  font-weight: 400;
  letter-spacing: var(--type-body-2-default-letter-spacing);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
 }

 header nav .nav-sections .main-nav-desktop-column-title {
  border-bottom: 1px solid var(--color-gray-300);
  color: var(--color-black);
  display: block;
  font: var(--type-body-2-strong-font);
  letter-spacing: var(--type-body-2-strong-letter-spacing);
  margin: 0 0 8px;
  padding-bottom: 5px;
  text-decoration: none;
  font-weight: 450;
 }

 header nav .nav-sections .main-nav-desktop-column-title-text {
  display: -webkit-box;
  line-height: 2rem;
  overflow: hidden;
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
 }

header nav .nav-sections .main-nav-desktop-panel-two-line-titles .main-nav-desktop-column-title {
  align-items: flex-end;
  display: flex;
  min-height: calc((2 * 2rem));
}

 header nav .nav-sections .main-nav-desktop-link-list {
  display: flex;
  flex-direction: column;
  list-style: none;
  margin: 0;
  padding: 0;
 }

 header nav .nav-sections .main-nav-desktop-link-list > li {
  margin: 0 0 8px;
  padding: 0;
 }

 header nav .nav-sections .main-nav-desktop-link {
  color: var(--color-gray-600);
  font: var(--type-body-1-default-font);
  letter-spacing: var(--type-body-1-default-letter-spacing);
  text-decoration: none;
 }

 header nav .nav-sections .main-nav-desktop-link-see-all {
  color: var(--color-gray-900);
 }

 header nav .nav-sections .main-nav-desktop-all-brands {
  grid-column: 1 / -1;
 }

 header nav .nav-sections .main-nav-desktop-all-brands-link {
  color: var(--color-black);
  display: inline-block;
  font: var(--type-body-2-strong-font);
  letter-spacing: var(--type-body-2-strong-letter-spacing);
  margin: 0 0 6px;
  text-decoration: none;
 }

 header nav .nav-sections .main-nav-desktop-all-brands-link:hover,
 header nav .nav-sections .main-nav-desktop-all-brands-link:focus-visible {
  text-decoration: underline;
 }

 header nav .nav-sections .main-nav-desktop-column-leaf {
  align-self: flex-start;
  border-bottom: 0;
  padding-top: 0;
 }

 header nav .nav-sections .main-nav-desktop-leaf-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
 }

 header nav .nav-sections .main-nav-desktop-leaf-list > li {
  margin: 0;
  padding: 0;
 }

 header nav .nav-sections .main-nav-desktop-leaf-link {
  color: var(--color-black);
  display: inline-block;
  font: var(--type-body-2-strong-font);
  letter-spacing: var(--type-body-2-strong-letter-spacing);
  text-decoration: none;
 }

 header nav .nav-sections .main-nav-desktop-leaf-link:hover,
 header nav .nav-sections .main-nav-desktop-leaf-link:focus-visible {
  text-decoration: underline;
 }

 header nav .nav-sections .main-nav-desktop-link:hover,
 header nav .nav-sections .main-nav-desktop-link:focus-visible {
  text-decoration: underline;
 }

 header nav .nav-sections .main-nav-desktop-overlay {
  background: rgb(0 0 0 / 75%);
  height: calc(100vh - (var(--pre-header-height) + var(--nav-height) + var(--nav-sections-height)));
  left: 0;
  pointer-events: auto;
  position: fixed;
  /* top: calc(var(--pre-header-height) + var(--nav-height) + var(--nav-sections-height)); */
  width: 100%;
  z-index: 9;
 }
}

@media (width <= 1420px) and (width >= 1024px) {
 header nav .nav-sections .main-nav-desktop-panel {
  padding-bottom: 33px;
 }

 header nav .nav-sections .main-nav-desktop-content {
  gap: 20px;
  grid-template-columns: 1fr;
 }

 header nav .nav-sections .main-nav-desktop-categories {
  width: 100%;
 }

 header nav .nav-sections .main-nav-desktop-inspired {
  border-left: 0;
  margin-top: 24px;
  max-width: none;
  min-width: 0;
  padding: 0 24px;
  }

  header nav .nav-sections .main-nav-desktop-inspired::before {
  inset: -18px -46px -33px;
  width: auto;
  }

 header nav .nav-sections .main-nav-desktop-inspired.main-nav-desktop-inspired-brands-panel {
  max-width: none;
  min-width: 0;
 }

 header nav .nav-sections .main-nav-desktop-inspired-list {
  display: flex !important;
  flex-wrap: wrap;
 }

 header nav .nav-sections .main-nav-inspired-item {
  flex: 0 0 320px;
  max-width: 320px;
 }

 header nav .nav-sections .main-nav-desktop-inspired-brands-list {
  column-gap: 14px;
  display: flex !important;
  flex-wrap: wrap;
  row-gap: 14px;
 }

 header nav .nav-sections .main-nav-desktop-inspired-brands-item {
  flex: 0 0 95px;
 }

}

@media (width < 1024px) {
 header nav .nav-sections .main-nav-desktop {
  display: none;
 }
}
/* Resalta el enlace de Hot Sale en el menú principal durante la campaña */
.main-nav a[href="/hot-sale"],
.main-nav a[href="/hot-sale"]:hover,
.main-nav a[href="/descuentos"],
.main-nav a[href="/descuentos"]:hover {
  color: #e9095b !important;
  font-weight: 700 !important;
}

.main-nav li.level-0:not([aria-expanded]) {
  .label-container {
    a {
      height: 100%;
      display: grid;
      align-items: center;
    }
  }
}