/* Relay Radio Store — Build 0027: category navigation / station identity.
 * Scoped to the custom header navigation; no WooCommerce templates, products,
 * account/cart/search behavior or Elementor homepage content are changed.
 */
body.relay-store-theme .relay-shop-header .relay-shop-nav {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(ellipse 42% 135% at 16% 0%, rgba(10, 112, 170, .10), transparent 90%),
    linear-gradient(180deg, #0b1728 0%, #080f1c 100%);
  border-top: 1px solid rgba(66, 135, 177, .18);
  border-bottom: 1px solid rgba(35, 115, 163, .24);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025), 0 12px 26px rgba(0,0,0,.18);
}
/* Keep Build 0023's station-spectrum accent, refined rather than doubled. */
body.relay-store-theme .relay-shop-header .relay-shop-nav::after {
  height: 2px;
  background: linear-gradient(90deg,
    #04bbe5 0%, #237edb 27%, #8563e9 54%, #db50ba 76%, #f29c39 100%);
  opacity: .83;
}
body.relay-store-theme .relay-shop-header .relay-shop-nav__inner {
  display: flex;
  align-items: center;
  column-gap: 7px;
  min-height: 64px;
  padding-top: 10px;
  padding-bottom: 12px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scroll-padding-inline: 12px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}
body.relay-store-theme .relay-shop-header .relay-shop-nav__inner::-webkit-scrollbar { display: none; }
body.relay-store-theme .relay-shop-header .relay-shop-nav a {
  position: relative;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 39px;
  padding: 0 13px;
  border-radius: 10px;
  border: 1px solid rgba(56, 109, 155, .21);
  background: rgba(15, 29, 49, .64);
  color: #b7cce0;
  font-size: .78rem;
  font-weight: 780;
  letter-spacing: .012em;
  line-height: 1.2;
  white-space: nowrap;
  text-decoration: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
  transition: background-color .18s ease, color .18s ease, border-color .18s ease,
    box-shadow .18s ease, transform .18s ease;
}
body.relay-store-theme .relay-shop-header .relay-shop-nav a:hover,
body.relay-store-theme .relay-shop-header .relay-shop-nav a:focus-visible {
  color: #fff;
  background: rgba(23, 73, 109, .52);
  border-color: rgba(45, 195, 235, .49);
  box-shadow: 0 4px 20px rgba(4,166,222,.10), inset 0 1px 0 rgba(200,245,255,.055);
  transform: translateY(-1px);
}
body.relay-store-theme .relay-shop-header .relay-shop-nav a:focus-visible {
  outline: 2px solid #50d7ff;
  outline-offset: 2px;
}
/* Shop All is the primary CTA, but doesn't claim the homepage is the Shop page. */
body.relay-store-theme .relay-shop-header .relay-shop-nav a.relay-shop-nav__featured {
  gap: 9px;
  margin-right: 5px;
  padding-inline: 17px;
  background: linear-gradient(120deg, rgba(5,112,175,.36), rgba(65,68,163,.38));
  border-color: rgba(39, 184, 229, .46);
  color: #f8fbff !important;
  font-weight: 875;
  box-shadow: inset 0 1px 0 rgba(218,249,255,.095), 0 4px 15px rgba(7, 131, 190, .10);
}
body.relay-store-theme .relay-shop-header .relay-shop-nav a.relay-shop-nav__featured::before {
  content: '';
  display: block;
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: #2ed8f4;
  box-shadow: 0 0 0 3px rgba(27, 191, 240, .12), 0 0 9px rgba(27,191,240,.32);
}
body.relay-store-theme .relay-shop-header .relay-shop-nav a.relay-shop-nav__featured:hover {
  background: linear-gradient(120deg, rgba(10,137,203,.57), rgba(93,77,196,.50));
  border-color: rgba(75,222,255,.69);
}
/* Meaningful selection state on WooCommerce shop / exact category archive. */
body.relay-store-theme .relay-shop-header .relay-shop-nav a[aria-current="page"] {
  background: linear-gradient(125deg, rgba(27,102,151,.47), rgba(91,64,154,.36));
  border-color: rgba(76,199,236,.62);
  color: #fff;
  box-shadow: inset 0 -2px 0 #25c9f0, 0 5px 18px rgba(16,165,215,.13);
}
body.relay-store-theme .relay-shop-header .relay-shop-nav a.relay-shop-nav__category[aria-current="page"]::after {
  content: '';
  position: absolute;
  left: 27%;
  right: 27%;
  bottom: -1px;
  height: 2px;
  border-radius: 2px;
  background: #f49b38;
  box-shadow: 0 0 8px rgba(244, 155, 56, .38);
}
/* Spacer retains far-right Station Home alignment when there is space. */
body.relay-store-theme .relay-shop-header .relay-shop-nav__spacer {
  flex: 1 0 16px;
  min-width: 16px;
}
body.relay-store-theme .relay-shop-header .relay-shop-nav a.relay-shop-nav__station-home {
  margin-left: 5px;
  gap: 9px;
  color: #e1edfa;
  background: rgba(15, 36, 55, .76);
  border-color: rgba(58, 142, 185, .32);
}
body.relay-store-theme .relay-shop-header .relay-shop-nav a.relay-shop-nav__station-home::after {
  content: '\2197';
  color: #38d0f3;
  font-size: 1rem;
  line-height: 1;
}
body.relay-store-theme .relay-shop-header .relay-shop-nav a.relay-shop-nav__station-home:hover {
  color: #fff;
  border-color: rgba(52, 201, 234, .64);
  background: rgba(20, 75, 112, .52);
}
@media (max-width: 1080px) {
  body.relay-store-theme .relay-shop-header .relay-shop-nav__inner { column-gap: 6px; min-height: 60px; }
  body.relay-store-theme .relay-shop-header .relay-shop-nav a { padding-inline: 11px; font-size: .75rem; }
  body.relay-store-theme .relay-shop-header .relay-shop-nav a.relay-shop-nav__featured { padding-inline: 14px; }
}
@media (max-width: 767px) {
  body.relay-store-theme .relay-shop-header .relay-shop-nav__inner {
    min-height: 58px;
    column-gap: 7px;
    padding-top: 9px;
    padding-bottom: 11px;
  }
  body.relay-store-theme .relay-shop-header .relay-shop-nav a {
    min-height: 39px;
    padding-inline: 13px;
    font-size: .76rem;
  }
  body.relay-store-theme .relay-shop-header .relay-shop-nav__spacer { flex: 0 0 12px; min-width: 12px; }
  body.relay-store-theme .relay-shop-header .relay-shop-nav a.relay-shop-nav__station-home { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  body.relay-store-theme .relay-shop-header .relay-shop-nav__inner { scroll-behavior: auto; }
  body.relay-store-theme .relay-shop-header .relay-shop-nav a { transition: none; }
  body.relay-store-theme .relay-shop-header .relay-shop-nav a:hover { transform: none; }
}