nav ul li a.active {
  color: #fff;
  background-color: var(--color-text-primary);
  border-radius: 50px;
  padding: .4rem 1rem;
}

nav ul li a {
  position: relative;
  padding: 0 2px;
  white-space: nowrap;
}

#navMobile.nav-mobile-closed {
  transform: translateX(100%);
}

html[dir="rtl"] #navMobile {
  left: 0;
  right: auto;
}

html[dir="rtl"] #navMobile.nav-mobile-closed {
  transform: translateX(-100%);
}

#navMobile.nav-mobile-open {
  transform: translateX(0);
}

@media (min-width: 768px) {
  #navMobile,
  #navMobile.nav-mobile-closed,
  #navMobile.nav-mobile-open,
  html[dir="rtl"] #navMobile.nav-mobile-closed {
    transform: translateX(0);
  }
}

@media (min-width: 768px) {
  html[dir="rtl"] #navMobile > ul {
    gap: 0.75rem;
  }

  html[dir="rtl"] #navList {
    order: 1;
  }

  html[dir="rtl"] #cartIconItem {
    order: 2;
  }

  html[dir="rtl"] #searchBox {
    order: 3;
  }

  html[dir="rtl"] #navList {
    gap: 0.5rem;
    padding-inline: 0.65rem;
  }

  html[dir="rtl"] #navList li {
    flex-shrink: 0;
  }

  html[dir="rtl"] #navList li a {
    white-space: nowrap;
    font-size: 0.875rem;
    padding-inline: 0.35rem;
  }
}

/* #searchBox.active #searchInput {
  max-width: 384px;
} */

/* Full-page content below fixed #navbar — some Tailwind spacing classes may be absent from prebuilt output.css */
.legal-page-below-nav {
  padding-top: clamp(7.5rem, 20vh, 14rem);
  padding-bottom: 5rem;
}