/*
 * Category-listing polish.
 *
 * This is registered separately from custom.css so its versioned URL also
 * invalidates long-lived browser caches when the child-theme release changes.
 */

body#category .subcategory__link {
  border-color: rgba(146, 114, 60, 0.24);
  background: rgba(255, 255, 255, 0.56);
  color: var(--yo-ink);
  text-decoration: none;
  transition:
    border-color 160ms ease,
    background-color 160ms ease,
    color 160ms ease,
    box-shadow 160ms ease,
    transform 160ms ease;
}

body#category .subcategory__link:hover,
body#category .subcategory__link:focus {
  border-color: rgba(146, 114, 60, 0.62);
  background: rgba(241, 234, 220, 0.92);
  color: var(--yo-accent);
  box-shadow: 0 0.35rem 0.9rem rgba(31, 33, 29, 0.08);
  text-decoration: none;
  transform: translateY(-1px);
}

body#category .subcategory__link:focus-visible {
  outline: 2px solid var(--yo-gold);
  outline-offset: 2px;
}

body#category .subcategory__thumbnail {
  border: 1px solid rgba(146, 114, 60, 0.16);
}

body#category .category__additional-description {
  position: relative;
  margin-bottom: 2rem;
  padding: 1rem 1.2rem 1rem 1.4rem;
  border: 1px solid rgba(146, 114, 60, 0.18);
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.72);
  color: var(--yo-muted);
  font-size: 0.95rem;
  line-height: 1.8;
}

body#category .category__additional-description::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0.22rem;
  border-radius: 8px 0 0 8px;
  background: var(--yo-gold);
  content: "";
}

body#category .category__additional-description > :last-child {
  margin-bottom: 0;
}

@media (max-width: 991.98px) {
  body#category .category__additional-description {
    padding: 0.9rem 1rem 0.9rem 1.15rem;
  }
}