/* Severa identity: preserve the original warm brown for primary actions. */
:root {
  --severa-brand-brown: #ad6819;
  --severa-brand-brown-hover: #955510;
  --severa-brand-on-brown: #fff;
  --severa-brand-gold: #f5b82e;
}
/* Header-only visual layer. Grid, dimensions, ordering and breakpoints live in style.css. */
.site-header {
  --header-white: #fff;
  --header-warm: #f8f5f0;
  --header-accent-soft: #f1ebe3;
  --header-text: #29241f;
  --header-muted: #71675d;
  --header-accent: #846c56;
  --header-border: #e8e1d8;
  --header-hover: #f3ede5;
  background: var(--header-white);
  border-bottom-color: var(--header-border);
  box-shadow: 0 2px 8px rgb(41 36 31 / 3%);
}
.site-header .header-inner,
.site-header .category-subnav {
  font-family: Manrope, "Segoe UI", Arial, sans-serif;
  color: var(--header-text);
}
.site-header .header-inner button,
.site-header .header-search input { font-family: inherit; }
.site-header .header-products-link {
  background: var(--header-warm);
  border-color: var(--header-border);
  border-radius: 7px;
  color: var(--header-text);
  font-weight: 600;
  box-shadow: none;
}
.site-header .header-products-link:hover,
.site-header .header-products-link.active {
  background: var(--header-accent-soft);
  border-color: var(--header-accent);
  color: var(--header-text);
  box-shadow: none;
  transform: none;
}
.site-header .header-search {
  border-color: var(--header-border);
  border-radius: 8px;
  background: var(--header-warm);
  box-shadow: none;
}
.site-header .header-search:focus-within {
  border-color: var(--header-accent);
  background: var(--header-white);
  box-shadow: 0 0 0 3px rgb(132 108 86 / 12%);
}
.site-header .header-search input { color: var(--header-text); font-weight: 400; }
.site-header .header-search input::placeholder { color: var(--header-muted); opacity: 1; }
.site-header .header-search button {
  background: transparent;
  color: var(--header-accent);
  border-radius: 6px;
}
.site-header .header-search button:hover {
  background: var(--header-hover);
  color: var(--header-text);
  transform: none;
}
.site-header .nav > a,
.site-header .dropdown-toggle {
  color: var(--header-text);
  border-radius: 6px;
  font-weight: 500;
  letter-spacing: 0;
}
.site-header .nav > a:hover,
.site-header .dropdown-toggle:hover,
.site-header .nav a.active,
.site-header .nav a.active:hover {
  color: var(--header-text);
  background: var(--header-hover);
  box-shadow: none;
}
.site-header .cart-link .badge,
.site-header .cart-link.active .badge {
  background: var(--header-accent);
  color: var(--header-white);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.site-header .header-inner svg,
.site-header .category-subnav__icon svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.site-header .header-cart-icon,
.site-header .cart-link:hover .header-cart-icon { transform: none; }
.site-header .dropdown-toggle::after {
  content: "";
  width: 6px;
  height: 6px;
  border-right: 1.8px solid currentColor;
  border-bottom: 1.8px solid currentColor;
  color: var(--header-muted);
  transform: translateY(-70%) rotate(45deg);
}
.site-header .nav-dropdown:hover .dropdown-toggle::after,
.site-header .nav-dropdown:focus-within .dropdown-toggle::after,
.site-header .nav-dropdown.open .dropdown-toggle::after {
  color: var(--header-text);
  transform: translateY(-20%) rotate(225deg);
}
.site-header .dropdown-menu {
  background: var(--header-white);
  border-color: var(--header-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgb(41 36 31 / 8%);
  transform: none;
}
/* Bridge the existing 8px gap so pointer users can reach the submenu. */
.site-header .dropdown-menu::before { content: ""; position: absolute; inset: -9px 0 auto; height: 9px; }
.site-header .nav-dropdown:focus-within .dropdown-menu,
.site-header .nav-dropdown.open .dropdown-menu { visibility: visible; opacity: 1; transform: none; }
.site-header .dropdown-menu a { color: var(--header-text); border-color: var(--header-border); font-weight: 500; }
.site-header .dropdown-menu a:hover,
.site-header .dropdown-menu a.active { background: var(--header-hover); color: var(--header-text); }
.site-header .header-search-results { border-color: var(--header-border); border-radius: 8px; box-shadow: 0 8px 24px rgb(41 36 31 / 8%); }
.site-header .header-search-result { border-radius: 5px; color: var(--header-text); }
.site-header .header-search-result:hover,
.site-header .header-search-result:focus { background: var(--header-hover); }
.site-header .header-search-result img { border-color: var(--header-border); border-radius: 5px; }
.site-header .header-search-result__copy strong { color: var(--header-text); font-weight: 600; }
.site-header .header-search-result__copy small,
.site-header .header-search-empty { color: var(--header-muted); }
.site-header .category-subnav { background: var(--header-warm); border-color: var(--header-border); }
.site-header .category-subnav__card,
.site-header .category-subnav__all {
  background: var(--header-white);
  border-color: var(--header-border);
  border-radius: 8px;
  color: var(--header-text);
  box-shadow: none;
}
.site-header .category-subnav__card:hover,
.site-header .category-subnav__all:hover {
  background: var(--header-white);
  border-color: var(--header-accent);
  color: var(--header-text);
  box-shadow: none;
  transform: none;
}
.site-header .category-subnav__card.active,
.site-header .category-subnav__card.active:hover,
.site-header .category-subnav__all.active {
  background: var(--header-accent-soft);
  border-color: var(--header-accent);
  color: var(--header-text);
  box-shadow: none;
}
.site-header .category-subnav__photo { border-radius: 5px; }
.site-header .category-subnav__card:hover .category-subnav__photo img { transform: none; }
.site-header .category-subnav__hint,
.site-header .category-subnav__card.active .category-subnav__hint { color: var(--header-muted); }
.site-header .category-subnav__icon,
.site-header .mobile-quick-order .category-subnav__icon { color: var(--header-accent); }
.site-header .quick-order-caption { font-size: .65rem; font-weight: 600; color: var(--header-muted); }
.site-header .nav .mobile-quick-order { border-top-color: var(--header-border); }
.site-header .header-inner a,
.site-header .header-inner button,
.site-header .header-search,
.site-header .category-subnav__link {
  transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease;
}
.site-header .header-inner a:focus-visible,
.site-header .header-inner button:focus-visible,
.site-header .category-subnav a:focus-visible {
  outline: 2px solid var(--header-accent);
  outline-offset: 3px;
}
@media (max-width: 900px) {
  .site-header .mobile-header-cart {
    border-radius: 7px;
    background: var(--header-accent-soft);
    color: var(--header-text);
    box-shadow: none;
  }
  .site-header .mobile-header-cart:hover,
  .site-header .mobile-header-cart:focus { background: var(--header-hover); color: var(--header-text); }
  .site-header .mobile-header-cart strong { font-weight: 600; font-variant-numeric: tabular-nums; }
  .site-header .mobile-header-cart__count { background: var(--header-accent); color: var(--header-white); border-color: var(--header-white); }
  .site-header .nav-toggle { background: var(--header-white); border-color: var(--header-border); border-radius: 7px; box-shadow: none; }
  .site-header .nav-toggle:hover,
  .site-header .nav-toggle:focus-visible { background: var(--header-hover); border-color: var(--header-accent); box-shadow: none; }
  .site-header .nav-toggle span { background: var(--header-text); transition: transform 180ms ease, opacity 180ms ease; }
  .site-header .nav { background: var(--header-white); border-color: var(--header-border); border-radius: 8px; box-shadow: 0 8px 24px rgb(41 36 31 / 8%); }
}
@media (prefers-reduced-motion: reduce) {
  .site-header :is(.header-inner, .category-subnav) :is(a, button, input, span, img, svg),
  .site-header .nav-toggle span,
  .site-header .dropdown-toggle::after { transition: none; animation: none; }
}
/* Desktop category rail only; keep the existing <=900px navigation untouched. */
@media (min-width: 901px) {
  .site-header .category-subnav {
    background: #ffffff;
    border-top-color: #e8e1d8;
  }
  .site-header .category-subnav__inner {
    padding-block: 5px;
    gap: 12px;
  }
  .site-header .category-subnav__card {
    min-height: 58px;
    padding: 0 12px 0 4px;
    gap: 10px;
    border-color: transparent;
    border-radius: 5px;
    background: transparent;
    color: #29241f;
    box-shadow: none;
  }
  .site-header .category-subnav__photo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 48px;
    flex-basis: 60px;
    border: 0;
    border-radius: 0;
    background: transparent;
  }
  .site-header .category-subnav__photo img {
    width: 100%;
    height: 48px;
    min-height: 0;
    max-height: 48px;
    max-width: 100%;
    object-fit: contain;
    object-position: center;
    border: 0;
    border-radius: 0;
    mix-blend-mode: multiply;
  }
  .site-header .category-subnav__name {
    color: #29241f;
    font-size: .82rem;
    font-weight: 600;
    line-height: 1.25;
  }
  .site-header .category-subnav__hint {
    color: #71675d;
    font-weight: 400;
  }
  .site-header .category-subnav__card:hover {
    background: #f3ede5;
    border-color: transparent;
    color: #29241f;
    box-shadow: none;
    transform: none;
  }
  .site-header .category-subnav__card.active,
  .site-header .category-subnav__card.active:hover {
    background: #f1ebe3;
    border-color: transparent;
    border-bottom-color: #846c56;
    color: #29241f;
    box-shadow: none;
  }
}
@media (min-width: 901px) and (max-width: 1100px) {
  .site-header .category-subnav__inner { gap: 4px; }
  .site-header .category-subnav__card { gap: 8px; padding-inline: 2px 5px; }
  .site-header .category-subnav__photo { width: 52px; flex-basis: 52px; }
}
.site-header .category-subnav__photo picture { display: contents; }
@media (min-width: 901px) {
  .site-header .category-subnav__card + .category-subnav__card::before {
    content: "";
    position: absolute;
    left: -7px;
    top: 50%;
    width: 1px;
    height: 26px;
    background: #e8e1d8;
    transform: translateY(-50%);
    pointer-events: none;
  }
}
@media (min-width: 901px) and (max-width: 1100px) {
  .site-header .category-subnav__card + .category-subnav__card::before { left: -3px; }
}
/* Primary shopping actions share the original brand brown on every viewport. */
.site-header .header-search button,
.site-header .nav > .cart-link,
.site-header .mobile-header-cart {
  background: var(--severa-brand-brown);
  color: var(--severa-brand-on-brown);
}
.site-header .header-search button:hover,
.site-header .nav > .cart-link:hover,
.site-header .nav > .cart-link.active,
.site-header .mobile-header-cart:hover,
.site-header .mobile-header-cart:focus {
  background: var(--severa-brand-brown-hover);
  color: var(--severa-brand-on-brown);
}
.site-header .cart-link .badge,
.site-header .cart-link.active .badge,
.site-header .mobile-header-cart__count {
  background: var(--severa-brand-gold);
  color: #50300d;
  border-color: var(--severa-brand-brown);
}
/* Explicit mobile image bounds prevent intrinsic image sizes from being clipped. */
@media (max-width: 900px) {
  .site-header .category-subnav__photo {
    display:flex;
    align-items:center;
    justify-content:center;
    width:46px;
    height:46px;
    flex:0 0 46px;
    border-radius:0;
  }
  .site-header .category-subnav__photo img {
    display:block;
    width:46px;
    height:46px;
    min-width:0;
    min-height:0;
    max-width:46px;
    max-height:46px;
    box-sizing:border-box;
    padding:2px;
    margin:0;
    object-fit:contain;
    object-position:center;
    border:0;
    border-radius:0;
    transform:none;
  }
}
/* Save header space in the existing mobile layout only. */
@media(max-width:900px){
  .site-header .header-search{display:none}
  .site-header.site-header--mobile-search .header-search{display:flex}
}