/* ======================= HEADER ======================= */
.site-header { position:relative; background:var(--surface); border-bottom:1px solid var(--line); }
.site-header .hdr-main {
  display:flex; align-items:center; gap:1.25rem; flex-wrap:nowrap;
  min-height:var(--header-h); height:var(--header-h); padding-block:0;
}
.site-header .wp-block-site-logo { flex-shrink:0; margin:0; }
.site-header .wp-block-site-logo img { height:2.125rem; width:auto; }
.site-header .hdr-search { flex:1 1 auto; max-width:35rem; margin:0 auto; }
/* core/search styled as the pill search */
.site-header .hdr-search .wp-block-search__inside-wrapper {
  display:flex; align-items:stretch; height:2.75rem; background:var(--surface-2);
  border:1px solid var(--line-strong); border-radius:0.625rem; overflow:hidden;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.site-header .hdr-search .wp-block-search__inside-wrapper:focus-within { border-color:var(--red); box-shadow:0 0 0 4px var(--focus); }
.site-header .hdr-search .wp-block-search__input {
  border:none; background:transparent; color:var(--ink); font-family:var(--font-body);
  font-size:0.90625rem; padding:0.6875rem 0.875rem; outline:none; margin:0;
}
.site-header .hdr-search .wp-block-search__button {
  border:none; background:var(--red); color:#fff; margin:0; border-radius:0;
  padding:0 1rem; font-family:var(--font-display); font-weight:600; font-size:0.875rem; cursor:pointer;
}
.site-header .hdr-search .wp-block-search__button:hover { background:var(--red-strong); }
.site-header .navtools { display:flex; align-items:center; gap:0.5rem; flex-shrink:0; }

/* account + cart icon buttons */
.site-header .navtools a,
.site-header .wc-block-customer-account,
.site-header .wc-block-mini-cart__button {
  position:relative; display:inline-flex; align-items:center; gap:0.5rem; height:2.75rem; padding:0 1rem;
  border-radius:0.625rem; border:1px solid var(--line); background:var(--surface); color:var(--ink);
  text-decoration:none; cursor:pointer; font-family:var(--font-display); font-weight:600; font-size:0.8125rem; line-height:1;
  transition:border-color .2s, color .2s, background .2s;
}
.site-header .navtools a:hover,
.site-header .wc-block-customer-account:hover,
.site-header .wc-block-mini-cart__button:hover { border-color:var(--red); color:var(--red); }
:root[data-theme="dark"] .site-header .navtools a:hover,
:root[data-theme="dark"] .site-header .wc-block-customer-account:hover,
:root[data-theme="dark"] .site-header .wc-block-mini-cart__button:hover { border-color:var(--red-on-dark); color:var(--red-on-dark); }
/* The block writes the badge colours inline from JS, inverted against the
   button: only !important reaches them. */
.site-header .wc-block-mini-cart__badge {
  background-color:var(--red) !important; color:#fff !important;
  font-weight:700; font-variant-numeric:tabular-nums;
}
:root[data-theme="dark"] .site-header .wc-block-mini-cart__badge { background-color:var(--red-on-dark) !important; }
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .site-header .wc-block-mini-cart__badge { background-color:var(--red-on-dark) !important; }
}

/* theme toggle (injected via JS) */
.theme-toggle {
  appearance:none; width:2.5rem; height:2.5rem; flex-shrink:0; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid transparent; border-radius:0.625rem; background:transparent; color:var(--muted);
  transition:background .2s, color .2s, border-color .2s;
}
.theme-toggle:hover { background:var(--surface-2); color:var(--ink); }
.theme-toggle:focus-visible { outline:none; border-color:var(--line-strong); box-shadow:0 0 0 3px var(--focus); }
.theme-toggle svg { width:1.1875rem; height:1.1875rem; display:block; }
.theme-toggle .ic-sun { display:none; }
:root[data-theme="dark"] .theme-toggle .ic-moon { display:none; }
:root[data-theme="dark"] .theme-toggle .ic-sun { display:block; }
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .theme-toggle .ic-moon { display:none; }
  :root:not([data-theme="light"]) .theme-toggle .ic-sun { display:block; }
}
.theme-toggle__sr { position:absolute; width:0.0625rem; height:0.0625rem; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; }

/* ======================= CATEGORY STRIP (products page only) ======================= */
.cats-strip { background:var(--surface-2); border-bottom:1px solid var(--line); margin-block:0; }
main.section-pad { padding-top:clamp(1.75rem,3.4vw,3rem); }
.hdr-cats-inner {
  display:flex; align-items:center; gap:0.25rem; min-height:3rem; flex-wrap:nowrap;
  overflow-x:auto; overflow-y:hidden; scroll-behavior:smooth; overscroll-behavior-x:contain;
  scrollbar-width:none; -ms-overflow-style:none;
  /* fade the right edge so the horizontal scroll integrates cleanly and hints "more" */
  -webkit-mask-image:linear-gradient(90deg, #000 calc(100% - 2.875rem), transparent 100%);
          mask-image:linear-gradient(90deg, #000 calc(100% - 2.875rem), transparent 100%);
}
.hdr-cats-inner::-webkit-scrollbar { width:0 !important; height:0 !important; display:none !important; -webkit-appearance:none; background:transparent; }
.cat-link { flex-shrink:0; display:inline-flex; align-items:center; gap:0.4375rem; padding:0.4375rem 0.75rem; border-radius:0.5rem; font-family:var(--font-display); font-weight:500; font-size:0.84375rem; line-height:1; color:var(--muted); text-decoration:none; white-space:nowrap; transition:color .2s, background .2s, box-shadow .2s; }
.cat-link svg { width:0.9375rem; height:0.9375rem; flex-shrink:0; }
/* inactive stays muted (must beat the global `[data-theme=dark] a` red rule) */
:root[data-theme="dark"] .cat-link { color:var(--muted); }
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .cat-link { color:var(--muted); } }
.cat-link:hover { color:var(--red); background:var(--surface); }
.cat-link.active { color:var(--red); background:var(--surface); font-weight:600; box-shadow:var(--shadow-1); }
:root[data-theme="dark"] .cat-link:hover, :root[data-theme="dark"] .cat-link.active { color:var(--red-on-dark); }
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .cat-link:hover, :root:not([data-theme="light"]) .cat-link.active { color:var(--red-on-dark); } }