/* Category navigation: preserve the theme's type and vertical rhythm. */
.top-sidebar .product-categories {
  --catalog-nav-accent: var(--1, #e85222);
  --catalog-nav-active: #ac3b18;
  --catalog-nav-ease: cubic-bezier(0.16, 1, 0.3, 1);
  gap: 0.25rem;
}

.top-sidebar .product-categories > li > a {
  position: relative;
  display: block;
  isolation: isolate;
  margin-inline: -0.75rem;
  padding: 0.5rem 0.75rem;
  border-radius: 0.75rem;
  text-decoration: none;
  outline-offset: 3px;
  transition:
    color 160ms ease-out,
    transform 240ms var(--catalog-nav-ease);
}

.top-sidebar .product-categories > li > a::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background-color: var(--catalog-nav-accent);
  opacity: 0;
  transform: scaleX(0.94);
  transform-origin: left center;
  pointer-events: none;
  transition:
    opacity 160ms ease-out,
    transform 240ms var(--catalog-nav-ease);
}

.top-sidebar .product-categories > li > a::after {
  content: "";
  position: absolute;
  inset-inline-start: 3px;
  top: 50%;
  width: 5px;
  height: 5px;
  border-top: 1.5px solid currentColor;
  border-right: 1.5px solid currentColor;
  opacity: 0;
  transform: translate(-3px, -50%) rotate(45deg);
  pointer-events: none;
  transition:
    opacity 140ms ease-out,
    transform 220ms var(--catalog-nav-ease);
}

.top-sidebar .product-categories > li.current-cat > a,
.top-sidebar .product-categories > li.current-cat-parent > a {
  color: var(--catalog-nav-active);
  text-decoration: none;
}

.top-sidebar .product-categories > li.current-cat > a::before,
.top-sidebar .product-categories > li.current-cat-parent > a::before {
  opacity: 0.12;
  transform: scaleX(1);
}

.top-sidebar .product-categories > li.current-cat > a::after,
.top-sidebar .product-categories > li.current-cat-parent > a::after {
  opacity: 1;
  transform: translate(0, -50%) rotate(45deg);
}

@media (hover: hover) and (pointer: fine) {
  .top-sidebar .product-categories > li > a:hover {
    color: var(--catalog-nav-active);
    transform: translateX(4px);
  }

  .top-sidebar .product-categories > li > a:hover::before {
    opacity: 0.08;
    transform: scaleX(1);
  }

  .top-sidebar .product-categories > li > a:hover::after {
    opacity: 1;
    transform: translate(0, -50%) rotate(45deg);
  }
}

.top-sidebar .product-categories > li > a:focus-visible {
  color: var(--catalog-nav-active);
  outline: 2px solid var(--catalog-nav-active);
}

.top-sidebar .product-categories > li > a:focus-visible::before {
  opacity: 0.08;
  transform: scaleX(1);
}

.top-sidebar .product-categories > li > a:focus-visible::after {
  opacity: 1;
  transform: translate(0, -50%) rotate(45deg);
}

.top-sidebar .product-categories > li > a:active {
  transform: translateX(2px);
  transition-duration: 100ms;
}

.top-sidebar .product-categories > li > a:active::before {
  opacity: 0.16;
}

@media (prefers-reduced-motion: reduce) {
  .top-sidebar .product-categories > li > a {
    transition: color 120ms ease-out;
  }

  .top-sidebar .product-categories > li > a:hover,
  .top-sidebar .product-categories > li > a:focus-visible,
  .top-sidebar .product-categories > li > a:active {
    transform: none;
  }

  .top-sidebar .product-categories > li > a::before {
    transform: none;
    transition: opacity 120ms ease-out;
  }

  .top-sidebar .product-categories > li > a::after {
    transform: translate(0, -50%) rotate(45deg);
    transition: opacity 120ms ease-out;
  }
}
