/* STRYT — WooCommerce overrides
 * Most WC default CSS is dequeued; we re-style only what we need.
 */

/* ─── Catalog grid (archive-product) ─── */
.woocommerce .products,
.woocommerce-page .products {
  display: grid;
  grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr));
  gap: 28px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.woocommerce .products li.product { margin: 0; padding: 0; width: auto; }

/* ─── Wishlist: 2-column desktop layout ─── */
.stryt-wishlist-products {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 40px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
@media (max-width: 720px) {
  .stryt-wishlist-products {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
}

/* hide the default WC notices style and apply our own */
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  max-width: var(--maxw);
  margin: 16px auto;
  padding: 14px 18px;
  background: var(--surface);
  color: var(--fg);
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent);
  border-radius: 8px;
  font-size: 13px;
  list-style: none;
}
.woocommerce-error { border-left-color: var(--danger); }

.woocommerce-message a.button,
.woocommerce-info a.button {
  margin-left: auto;
  background: transparent;
  color: var(--fg);
  border: 1px solid var(--line-strong);
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
}

/* ─── Sort dropdown ─── */
.woocommerce .woocommerce-ordering select,
.woocommerce-page .woocommerce-ordering select {
  background: var(--surface);
  color: var(--fg);
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 11px;
  font-family: var(--font-mono);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  cursor: pointer;
}

/* ─── Catalog layout (with sidebar) ─── */
.catalog-layout {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 12px var(--pad-x) 100px;
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 48px;
  align-items: flex-start;
}
.catalog-layout__sidebar {
  position: sticky;
  top: 100px;
  display: flex;
  flex-direction: column;
  gap: 30px;
  padding-bottom: 40px;
}
.filter-block__title {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--fg-3);
  letter-spacing: 0.14em;
  padding-bottom: 12px;
  margin: 0 0 14px;
  border-bottom: 1px solid var(--line);
  text-transform: uppercase;
}
.filter-block ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.filter-block ul a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 0;
  color: var(--fg-2);
  font-size: 13px;
  font-weight: 500;
}
.filter-block ul a:hover,
.filter-block ul .current-cat a {
  color: var(--fg);
  font-weight: 700;
}
.filter-block ul a .count {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--fg-3);
}

/* ─── Price filter widget (WooCommerce widget_price_filter) ─── */
.widget_price_filter .price_slider_wrapper { padding-top: 4px; }
.widget_price_filter .price_slider {
  position: relative;
  height: 4px;
  background: var(--line);
  border-radius: 999px;
  margin: 18px 4px 22px;
}
.widget_price_filter .ui-slider-range {
  position: absolute;
  top: 0;
  height: 100%;
  background: var(--fg);
  border-radius: 999px;
}
.widget_price_filter .ui-slider-handle {
  position: absolute;
  top: 50%;
  width: 18px;
  height: 18px;
  margin-left: -9px;
  background: var(--bg);
  border: 2px solid var(--fg);
  border-radius: 50%;
  cursor: grab;
  transform: translateY(-50%);
  transition: transform 120ms ease, box-shadow 120ms ease;
  outline: none;
  z-index: 2;
}
.widget_price_filter .ui-slider-handle:hover,
.widget_price_filter .ui-slider-handle:focus {
  transform: translateY(-50%) scale(1.1);
  box-shadow: 0 0 0 4px rgba(0,0,0,0.06);
}
.widget_price_filter .ui-slider-handle:active { cursor: grabbing; }
.widget_price_filter .price_slider_amount {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fg-2);
}
.widget_price_filter .price_slider_amount .price_label {
  flex: 1 1 auto;
  order: 1;
  color: var(--fg);
  font-weight: 600;
}
.widget_price_filter .price_slider_amount .price_label span {
  color: var(--fg);
  font-weight: 700;
}
.widget_price_filter .price_slider_amount .button {
  order: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 10px 16px;
  border-radius: 999px;
  background: var(--fg);
  color: var(--bg);
  border: none;
  cursor: pointer;
  transition: background 160ms ease, color 160ms ease, transform 80ms ease;
}
.widget_price_filter .price_slider_amount .button:hover {
  background: var(--accent);
  color: var(--accent-fg);
}
.widget_price_filter .price_slider_amount .button:active { transform: scale(0.97); }

/* ─── Catalog filter drawer (mobile only) ─── */
.catalog-filters__head,
.catalog-filters__footer,
.catalog-filters__overlay,
.catalog-sortbar__filters { display: none; }
.catalog-filters__body { display: contents; }

.catalog-sortbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 0;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--line);
  gap: 12px;
  flex-wrap: wrap;
}
.catalog-sortbar .result-count {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--fg-2);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0;
}
.catalog-sortbar__filters {
  gap: 8px;
  padding: 8px 14px;
}
.catalog-sortbar__filters .stryt-icon { color: currentColor; }

/* ─── Pagination ─── */
.woocommerce-pagination,
.stryt-pagination {
  margin-top: 56px;
  padding: 20px 0;
  border-top: 1px solid var(--line);
}
.woocommerce-pagination ul,
.stryt-pagination ul {
  display: flex;
  gap: 4px;
  list-style: none;
  padding: 0;
  margin: 0;
  border: none !important;
  justify-content: flex-end;
}
.woocommerce-pagination ul li,
.stryt-pagination ul li {
  border: none !important;
  margin: 0;
}
.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span,
.stryt-pagination a,
.stryt-pagination span {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: transparent;
  color: var(--fg-2);
  border: 1px solid var(--line) !important;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.woocommerce-pagination ul li .current,
.woocommerce-pagination ul li span.current,
.stryt-pagination span.current {
  background: var(--fg);
  color: var(--bg);
  border-color: var(--fg) !important;
}

/* ─── Single product (PDP) — custom layout ─── */
.pdp-topbar {
  position: sticky;
  top: var(--header-h, 64px);
  z-index: 9;
  background: var(--bg);
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding: 14px var(--pad-x);
  font-family: var(--font-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.pdp-topbar__back {
  color: var(--fg);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
}
.pdp-topbar__back span[aria-hidden] { font-size: 14px; line-height: 1; }
.pdp-topbar__crumbs {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--fg-3);
  flex-wrap: wrap;
  justify-content: flex-end;
}
.pdp-topbar__crumbs a { color: var(--fg-3); }
.pdp-topbar__crumbs a:hover { color: var(--fg); }
.pdp-topbar__crumbs .is-current { color: var(--fg); font-weight: 600; }
.pdp-topbar__crumbs .sep { color: var(--fg-3); opacity: 0.5; }

.single-product .pdp {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 28px var(--pad-x) 80px;
}
.pdp__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 460px;
  gap: 56px;
  align-items: flex-start;
}

/* gallery */
.pdp__gallery {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 18px;
  align-items: flex-start;
}
.pdp__thumbs {
  display: flex;
  flex-direction: column;
  gap: 10px;
  position: sticky;
  top: calc(var(--header-h, 64px) + 80px);
}
.pdp__thumb {
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  color: var(--fg-3);
  text-align: left;
  display: block;
}
.pdp__thumb-tile {
  display: block;
  width: 96px;
  aspect-ratio: 4/5;
  border: 1px solid var(--line);
  border-radius: 6px;
  overflow: hidden;
  position: relative;
  transition: border-color 160ms;
}
.pdp__thumb.is-active .pdp__thumb-tile,
.pdp__thumb:hover .pdp__thumb-tile { border-color: var(--accent); }
.pdp__thumb-tile img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.pdp__thumb-label {
  display: block;
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-top: 6px;
  color: var(--fg-3);
}
.pdp__thumb.is-active .pdp__thumb-label { color: var(--fg); }

.pdp__stage {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin: 0;
}
.pdp__stage-tile {
  width: 100%;
  aspect-ratio: 4/5;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  margin: 0;
}
.pdp__stage-tile img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.pdp__shot { scroll-margin-top: calc(var(--header-h, 64px) + 80px); }

/* summary */
.pdp__summary {
  position: sticky;
  top: calc(var(--header-h, 64px) + 80px);
  align-self: start;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}
.pdp__meta-line {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--fg-3);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  display: inline-flex;
  gap: 8px;
  margin-bottom: 14px;
}
.pdp__title {
  font-family: var(--font-display);
  font-size: 56px;
  line-height: 0.92;
  text-transform: uppercase;
  margin: 0 0 18px;
}
.pdp__price {
  font-family: var(--font-display);
  font-size: 38px;
  color: var(--accent);
  margin: 0 0 20px;
  display: flex;
  align-items: baseline;
  gap: 12px;
}
.pdp__price del {
  font-family: var(--font-mono);
  font-size: 14px;
  color: var(--fg-3);
  text-decoration: line-through;
  opacity: 1;
}
.pdp__price ins, .pdp__price .amount {
  text-decoration: none;
  color: var(--accent);
  font-family: var(--font-display);
}
.pdp__stock {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  margin: 0 0 20px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
}
.pdp__stock--out {
  background: rgba(255, 58, 58, 0.06);
  border-color: rgba(255, 58, 58, 0.35);
}
.pdp__stock--backorder {
  background: rgba(212, 255, 58, 0.06);
  border-color: rgba(212, 255, 58, 0.35);
}
.pdp__stock-dot {
  flex: none;
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: var(--danger);
}
.pdp__stock--backorder .pdp__stock-dot {
  background: var(--accent);
}
.pdp__stock-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.pdp__stock-title {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--fg);
}
.pdp__stock-sub {
  font-size: 12px;
  color: var(--fg-2);
}

.pdp__short {
  color: var(--fg-2);
  font-size: 14px;
  line-height: 1.6;
  margin: 0 0 18px;
}
.pdp__short p { margin: 0; }

.pdp__chips {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 0;
  margin: 0 0 26px;
}
.pdp__chip {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  padding: 6px 12px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  color: var(--fg-2);
}

/* attributes */
.pdp__attr { margin-bottom: 22px; }
.pdp__attr-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 10px;
}
.pdp__attr-label {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fg-2);
}
.pdp__attr-current {
  font-family: var(--font-mono);
  font-size: 11px;
  text-transform: lowercase;
  color: var(--fg);
}
.pdp__sizeguide {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  color: var(--fg-3);
  text-decoration: underline;
}
.pdp__sizeguide:hover { color: var(--fg); }

.pdp__swatches { display: flex; gap: 10px; }
.pdp__swatch {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 2px solid transparent;
  background: var(--swatch, #555);
  padding: 0;
  cursor: pointer;
  position: relative;
  outline-offset: 2px;
}
.pdp__swatch::before {
  content: "";
  position: absolute;
  inset: 2px;
  border-radius: 999px;
  background: var(--swatch, #555);
  border: 1px solid rgba(0,0,0,0.25);
}
.pdp__swatch.is-active { border-color: var(--fg); }

.pdp__sizes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.pdp__size {
  height: 46px;
  border-radius: 8px;
  border: 1px solid var(--line-strong);
  background: transparent;
  color: var(--fg);
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  cursor: pointer;
  transition: border-color 120ms, background 120ms, color 120ms;
}
.pdp__size:hover { border-color: var(--fg); }
.pdp__size.is-active { background: var(--fg); color: var(--bg); border-color: var(--fg); }
.pdp__size[disabled] { opacity: 0.35; cursor: not-allowed; text-decoration: line-through; }

/* hide native variation form chrome — we drive it ourselves */
.pdp__wc-form table.variations { display: none; }
.pdp__wc-form .single_variation_wrap { margin-top: 8px; }
.pdp__wc-form .woocommerce-variation-price { display: none; }
.pdp__wc-form .woocommerce-variation-description { display: none; }

/* CTAs */
.pdp__wc-form .cart {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  align-items: stretch;
  margin: 24px 0 18px;
}
.pdp__wc-form .quantity { display: none; }
.pdp__wc-form .single_add_to_cart_button {
  height: 54px;
  border-radius: 999px;
  background: transparent;
  color: var(--fg);
  border: 1px solid var(--line-strong);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  cursor: pointer;
  padding: 0 18px;
}
.pdp__wc-form .single_add_to_cart_button:hover { border-color: var(--fg); }
.pdp__wc-form .single_add_to_cart_button.disabled {
  opacity: 0.45; cursor: not-allowed;
}

/* info cards */
.pdp__cards {
  display: flex;
  flex-direction: column;
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  margin: 22px 0;
}
.pdp__card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  background: var(--surface);
}
.pdp__card-icon {
  width: 32px; height: 32px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface-2);
  font-size: 14px;
  flex-shrink: 0;
}
.pdp__card-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--fg);
}
.pdp__card-sub {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--fg-3);
  margin-top: 2px;
}

/* accordions */
.pdp__accordions { margin-top: 18px; }
.pdp__panel { border-top: 1px solid var(--line); }
.pdp__panel:last-of-type { border-bottom: 1px solid var(--line); }
.pdp__panel summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 0;
  cursor: pointer;
  list-style: none;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fg);
  font-weight: 700;
}
.pdp__panel summary::-webkit-details-marker { display: none; }
.pdp__panel-mark {
  width: 12px; height: 12px;
  position: relative;
}
.pdp__panel-mark::before,
.pdp__panel-mark::after {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 50%;
  height: 1.5px;
  background: var(--fg-2);
  transform: translateY(-50%);
  transition: transform 200ms;
}
.pdp__panel-mark::after { transform: translateY(-50%) rotate(90deg); }
.pdp__panel[open] .pdp__panel-mark::after { transform: translateY(-50%) rotate(0); opacity: 0; }
.pdp__panel-body {
  color: var(--fg-2);
  font-size: 14px;
  line-height: 1.65;
  padding: 0 0 18px;
}
.pdp__panel-body p:first-child { margin-top: 0; }
.pdp__panel-body p:last-child { margin-bottom: 0; }

@media (max-width: 1024px) {
  .pdp__grid { grid-template-columns: 1fr; gap: 32px; }
  .pdp__summary { position: static; }
  .pdp__title { font-size: 40px; }
}
@media (max-width: 720px) {
  .pdp__gallery { grid-template-columns: 1fr; gap: 8px; }
  .pdp__thumbs {
    position: static;
    flex-direction: row;
    overflow-x: auto;
    padding-bottom: 8px;
    gap: 8px;
    -webkit-overflow-scrolling: touch;
  }
  .pdp__thumb { flex: 0 0 auto; }
  .pdp__thumb-tile { width: 64px; }
  .pdp__thumb-label { display: none; }

  /* Stack of shots → horizontal snap carousel on phones. */
  .pdp__stage {
    flex-direction: row;
    gap: 8px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    /* bleed to screen edges */
    margin: 0 calc(var(--pad-x) * -1);
    padding: 0 var(--pad-x);
  }
  .pdp__stage::-webkit-scrollbar { display: none; }
  .pdp__shot {
    flex: 0 0 100%;
    scroll-snap-align: start;
    scroll-margin-top: 0;
  }
}

/* variations table */
.single-product table.variations {
  margin: 0 0 24px;
  width: 100%;
}
.single-product table.variations th,
.single-product table.variations td {
  display: block;
  padding: 0;
  width: 100%;
}
.single-product table.variations label {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--fg-2);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  display: block;
  margin-bottom: 10px;
}
.single-product table.variations select {
  width: 100%;
  background: var(--surface);
  color: var(--fg);
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  padding: 12px 14px;
  font-size: 14px;
  font-family: var(--font-body);
  margin-bottom: 18px;
}
.single-product .reset_variations {
  color: var(--fg-3);
  font-size: 11px;
  text-decoration: underline;
}

/* qty + add-to-cart */
.single-product .cart {
  display: flex;
  gap: 10px;
  margin-bottom: 28px;
  align-items: stretch;
}
.single-product .quantity {
  display: inline-flex;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  overflow: hidden;
  height: 54px;
}
.single-product .quantity input.qty {
  width: 60px;
  height: 100%;
  background: transparent;
  border: none;
  color: var(--fg);
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  -moz-appearance: textfield;
}
.single-product .quantity input.qty::-webkit-outer-spin-button,
.single-product .quantity input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.single-product .single_add_to_cart_button {
  flex: 1;
  padding: 0 24px;
  border-radius: 999px;
  background: var(--accent);
  color: var(--accent-fg);
  border: none;
  cursor: pointer;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  min-height: 54px;
}
.single-product .single_add_to_cart_button:hover { background: #c2eb2a; }

/* tabs (description / additional / reviews) */
.woocommerce-tabs {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 var(--pad-x) 80px;
  grid-column: 1 / -1;
}
.woocommerce-tabs ul.tabs {
  display: flex;
  gap: 0;
  list-style: none;
  padding: 0;
  margin: 0 0 32px;
  border-bottom: 1px solid var(--line);
}
.woocommerce-tabs ul.tabs li {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
}
.woocommerce-tabs ul.tabs li a {
  display: block;
  padding: 16px 24px;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--fg-3);
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}
.woocommerce-tabs ul.tabs li.active a {
  color: var(--fg);
  border-bottom-color: var(--accent);
}

/* related products */
.related.products,
.up-sells.products {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 40px var(--pad-x) 80px;
  grid-column: 1 / -1;
}
.related.products > h2,
.up-sells.products > h2 {
  font-family: var(--font-display);
  font-size: 42px;
  margin: 0 0 28px;
  text-transform: uppercase;
}

/* ─── Cart page ─── */
.woocommerce-cart .wrap,
.woocommerce-checkout .wrap {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 40px var(--pad-x) 80px;
}
.woocommerce-cart table.shop_table {
  border: none;
  border-collapse: collapse;
  width: 100%;
  background: var(--surface);
  border-radius: 12px;
  overflow: hidden;
}
.woocommerce-cart table.shop_table th,
.woocommerce-cart table.shop_table td {
  border: none;
  border-bottom: 1px solid var(--line);
  padding: 16px;
  color: var(--fg);
}
.woocommerce-cart table.shop_table thead th {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--fg-3);
  background: transparent;
}
.woocommerce-cart .cart-collaterals .cart_totals {
  background: var(--surface);
  border-radius: 12px;
  padding: 24px;
  border: 1px solid var(--line);
}
.woocommerce-cart .cart_totals h2 {
  font-family: var(--font-display);
  font-size: 28px;
  text-transform: uppercase;
  margin: 0 0 18px;
}
.woocommerce-cart .cart_totals .order-total .amount {
  font-family: var(--font-display);
  font-size: 32px;
  color: var(--accent);
}
.woocommerce-cart .checkout-button,
.woocommerce-cart .wc-proceed-to-checkout a.button {
  display: block;
  text-align: center;
  background: var(--accent);
  color: var(--accent-fg);
  border-radius: 999px;
  padding: 18px 24px;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 14px;
}

/* ─── Checkout (STRYT custom layout) ─── */
.stryt-checkout__wrap { padding-top: 24px; padding-bottom: 100px; }

.stryt-checkout__head { margin-bottom: 36px; }
.stryt-checkout__crumbs {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  color: var(--fg-3);
  text-transform: uppercase;
  margin-bottom: 18px;
}
.stryt-checkout__crumbs a { color: var(--fg-3); }
.stryt-checkout__crumbs a:hover { color: var(--fg); }
.stryt-checkout__head-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  flex-wrap: wrap;
}
.stryt-checkout__title {
  font-size: 96px;
  line-height: 0.92;
  margin: 0;
  text-transform: uppercase;
}
.stryt-checkout__subtitle {
  font-size: 13px;
  color: var(--fg-2);
  margin: 8px 0 0;
}
.stryt-checkout__steps {
  list-style: none;
  display: flex;
  gap: 18px;
  margin: 0;
  padding: 0;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.stryt-checkout__steps li { color: var(--fg-3); display: inline-flex; align-items: center; gap: 6px; }
.stryt-checkout__steps li .dot {
  width: 6px; height: 6px; border-radius: 999px; background: var(--fg-4); display: inline-block;
}
.stryt-checkout__steps li.is-active,
.stryt-checkout__steps li.is-done { color: var(--accent); }
.stryt-checkout__steps li.is-active .dot,
.stryt-checkout__steps li.is-done .dot { background: var(--accent); }

.stryt-checkout__grid {
  display: grid;
  grid-template-columns: 1fr 440px;
  gap: 48px;
  align-items: flex-start;
}

.stryt-checkout__section { margin-bottom: 36px; }
.stryt-checkout__section-title {
  font-size: 22px;
  margin: 0 0 16px;
  text-transform: uppercase;
}

/* express pay */
.stryt-express { display: flex; gap: 10px; }
.stryt-express__btn {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 18px;
  border-radius: 12px;
  background: var(--fg);
  color: var(--bg);
  border: none;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  letter-spacing: 0.02em;
}
.stryt-express__btn[disabled] { opacity: 0.85; cursor: not-allowed; }
.stryt-express__btn:hover:not([disabled]) { filter: brightness(0.95); }
.stryt-express__icon { font-family: var(--font-display); font-size: 14px; letter-spacing: 0.02em; }
.stryt-express__btn[data-express="apple"] .stryt-express__icon::before { content: "\f8ff"; font-size: 18px; }
.stryt-express__btn[data-express="google"] .stryt-express__icon { font-weight: 800; }

.stryt-checkout__sep {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 24px 0 4px;
  color: var(--fg-3);
}
.stryt-checkout__sep::before,
.stryt-checkout__sep::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--line);
}
.stryt-checkout__sep span { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; }

/* form grid + fields */
.stryt-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.stryt-form-grid--2-1 { grid-template-columns: 2fr 1fr; }
.stryt-checkout .form-row { margin: 0; padding: 0; display: block; }
.stryt-checkout .form-row label,
.stryt-checkout label.mono {
  display: block;
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--fg-3);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin: 0 0 6px;
}
.stryt-checkout .form-row .required { color: var(--accent); border: 0; text-decoration: none; }
.stryt-checkout .input-text,
.stryt-checkout input[type="text"],
.stryt-checkout input[type="email"],
.stryt-checkout input[type="tel"],
.stryt-checkout textarea,
.stryt-checkout select {
  width: 100%;
  background: var(--surface);
  color: var(--fg);
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  padding: 13px 14px;
  font-size: 14px;
  font-family: var(--font-body);
  outline: none;
  transition: border-color 140ms;
}
.stryt-checkout .input-text:focus,
.stryt-checkout textarea:focus { border-color: var(--accent); }
.stryt-checkout textarea { min-height: 90px; resize: vertical; }

/* invalid required fields — shown after a submit attempt or server-side error */
.stryt-checkout .has-error,
.stryt-checkout [aria-invalid="true"],
.stryt-checkout .woocommerce-invalid .input-text {
  border-color: var(--danger) !important;
  background: color-mix(in srgb, var(--danger) 8%, var(--surface));
}
.stryt-checkout .has-error:focus,
.stryt-checkout [aria-invalid="true"]:focus {
  border-color: var(--danger) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 25%, transparent);
}
/* WC's notice block: keep at top of form, tighten spacing */
.stryt-checkout .woocommerce-NoticeGroup,
.stryt-checkout > .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-error {
  margin: 0 0 20px;
  padding: 14px 18px;
  background: color-mix(in srgb, var(--danger) 10%, var(--surface));
  border: 1px solid var(--danger);
  border-radius: 10px;
  color: var(--fg);
  list-style: none;
  font-size: 13px;
}
.stryt-checkout .woocommerce-error li { margin: 4px 0; }

/* subscribe checkbox */
.stryt-check {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
  font-size: 13px;
  color: var(--fg-2);
  cursor: pointer;
  user-select: none;
}
.stryt-check input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 18px; height: 18px;
  border-radius: 4px;
  border: 1.5px solid var(--line-strong);
  background: var(--surface);
  cursor: pointer;
  display: inline-grid;
  place-content: center;
  transition: background 120ms, border-color 120ms;
}
.stryt-check input[type="checkbox"]:checked {
  background: var(--accent);
  border-color: var(--accent);
}
.stryt-check input[type="checkbox"]:checked::after {
  content: "";
  width: 6px; height: 10px;
  border-right: 2px solid var(--accent-fg);
  border-bottom: 2px solid var(--accent-fg);
  transform: rotate(45deg) translate(-1px, -1px);
}

/* delivery options */
.stryt-delivery { display: flex; flex-direction: column; gap: 10px; }
.stryt-delivery__empty {
  padding: 16px;
  border: 1px dashed var(--line-strong);
  border-radius: 10px;
  color: var(--fg-3);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.stryt-delivery__opt {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border-radius: 12px;
  background: var(--surface);
  border: 1px solid var(--line);
  cursor: pointer;
  color: var(--fg);
  transition: border-color 140ms, background 140ms;
}
.stryt-delivery__opt:hover { border-color: var(--line-strong); }
.stryt-delivery__opt.is-active {
  background: var(--surface-2);
  border-color: var(--accent);
}
.stryt-delivery__opt input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; }
.stryt-delivery__radio {
  width: 18px; height: 18px; border-radius: 999px;
  border: 2px solid var(--fg-3);
  flex-shrink: 0;
  transition: border 140ms;
  display: inline-block;
}
.stryt-delivery__opt.is-active .stryt-delivery__radio {
  border: 5px solid var(--accent);
}
.stryt-delivery__icon {
  width: 36px; height: 36px;
  border-radius: 8px;
  flex-shrink: 0;
  background: var(--bg);
  border: 1px solid var(--line);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--fg-2);
}
.stryt-delivery__info { flex: 1; min-width: 0; }
.stryt-delivery__label { display: block; font-size: 14px; font-weight: 600; }
.stryt-delivery__sub {
  display: block;
  font-size: 10px;
  letter-spacing: 0.1em;
  color: var(--fg-3);
  margin-top: 2px;
  text-transform: lowercase;
}
.stryt-delivery__price {
  font-size: 18px;
  color: var(--fg);
  white-space: nowrap;
}
.stryt-delivery__price.is-free { color: var(--accent); letter-spacing: 0.04em; }

/* address block */
.stryt-address { margin-top: 20px; display: flex; flex-direction: column; gap: 14px; }
.stryt-row-warehouse[hidden],
.stryt-row-address1[hidden] { display: none !important; }
.stryt-hint { display: block; margin-top: 6px; color: var(--fg-3); font-size: 10px; letter-spacing: 0.12em; }

/* autocomplete */
.stryt-autocomplete { position: relative; display: block; }
.stryt-autocomplete__list {
  position: absolute;
  z-index: 20;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  max-height: 280px;
  overflow-y: auto;
  background: var(--surface);
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  margin: 0;
  padding: 4px;
  list-style: none;
  box-shadow: 0 18px 40px rgba(0,0,0,0.45);
}
.stryt-autocomplete__list[hidden] { display: none; }
.stryt-autocomplete__item {
  padding: 10px 12px;
  border-radius: 7px;
  cursor: pointer;
  font-size: 13px;
  color: var(--fg);
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.stryt-autocomplete__item:hover,
.stryt-autocomplete__item.is-active { background: var(--surface-2); }
.stryt-autocomplete__item .num {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--fg-3);
  letter-spacing: 0.04em;
  flex-shrink: 0;
  min-width: 36px;
}
.stryt-autocomplete__item .sub {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--fg-3);
  letter-spacing: 0.08em;
}
.stryt-autocomplete__item .tag {
  margin-left: auto;
  font-family: var(--font-mono);
  font-size: 9px;
  background: var(--accent);
  color: var(--accent-fg);
  padding: 2px 6px;
  border-radius: 4px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  flex-shrink: 0;
}
.stryt-autocomplete__empty {
  padding: 12px;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--fg-3);
  text-align: center;
}

/* payment */
.stryt-pay { display: block; }
.stryt-pay__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.stryt-pay__opt {
  position: relative;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  transition: border-color 140ms, background 140ms;
}
.stryt-pay__opt.is-active { background: var(--surface-2); border-color: var(--accent); }
.stryt-pay__opt > input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; }
.stryt-pay__opt > label {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  cursor: pointer;
  margin: 0;
}
.stryt-pay__radio {
  width: 18px; height: 18px; border-radius: 999px;
  border: 2px solid var(--fg-3); flex-shrink: 0;
}
.stryt-pay__opt.is-active .stryt-pay__radio { border: 5px solid var(--accent); }
.stryt-pay__info { flex: 1; min-width: 0; }
.stryt-pay__label {
  display: flex; align-items: center; gap: 8px;
  font-size: 14px; font-weight: 600; color: var(--fg);
}
.stryt-pay__badge {
  background: var(--accent); color: var(--accent-fg);
  padding: 2px 6px; border-radius: 4px;
  font-size: 9px; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase;
}
.stryt-pay__sub {
  display: block;
  font-size: 10px; letter-spacing: 0.1em; color: var(--fg-3);
  margin-top: 4px; text-transform: lowercase;
}
.stryt-pay__sub p { margin: 0; }
.stryt-pay__fields {
  padding: 0 18px 18px 50px;
  font-size: 13px;
  color: var(--fg-2);
}
.stryt-pay__fields input, .stryt-pay__fields select {
  margin-top: 8px;
}
/* trailing price column on the deposit-mode radios */
.stryt-pay__price {
  margin-left: auto;
  font-size: 14px;
  font-weight: 600;
  color: var(--fg);
  white-space: nowrap;
}
.stryt-pay__opt.is-disabled { opacity: 0.55; pointer-events: none; }
.stryt-pay__opt.is-disabled > label { cursor: not-allowed; }

/* sticky summary */
.stryt-checkout__right { position: sticky; top: calc(var(--header-h, 80px) + 20px); }
.stryt-summary__card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}
.stryt-summary__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 18px 20px;
  border-bottom: 1px solid var(--line);
}
.stryt-summary__head .display { font-size: 22px; text-transform: uppercase; }
.stryt-summary__head .mono { font-size: 10px; color: var(--fg-3); letter-spacing: 0.12em; }

.stryt-summary__items {
  list-style: none;
  margin: 0;
  padding: 8px 20px 4px;
  max-height: 300px;
  overflow-y: auto;
}
.stryt-summary__item {
  display: grid;
  grid-template-columns: 56px 1fr auto;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  align-items: center;
}
.stryt-summary__item:last-child { border-bottom: 0; }
.stryt-summary__thumb {
  position: relative;
  width: 56px; height: 72px;
  border-radius: 6px;
  overflow: hidden;
  background: var(--surface-2);
}
.stryt-summary__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.stryt-summary__sku {
  position: absolute;
  left: 4px; bottom: 4px;
  font-size: 8px;
  letter-spacing: 0.1em;
  color: var(--fg);
  background: rgba(0,0,0,0.55);
  padding: 2px 4px;
  border-radius: 3px;
  z-index: 1;
}
.stryt-summary__info { min-width: 0; }
.stryt-summary__name {
  font-size: 13px; font-weight: 600; color: var(--fg);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.stryt-summary__meta {
  margin-top: 4px;
  font-size: 9px;
  color: var(--fg-3);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.stryt-summary__meta dl,
.stryt-summary__meta dt,
.stryt-summary__meta dd { display: inline; margin: 0; padding: 0; }
.stryt-summary__meta dt::after { content: ": "; }
.stryt-summary__meta dd + dt::before { content: " · "; }
.stryt-summary__price {
  font-size: 16px;
  text-align: right;
  color: var(--fg);
}
.stryt-summary__price .amount,
.stryt-summary__price bdi { font-family: inherit; }

.stryt-summary__promo { padding: 8px 20px 18px; }
.stryt-summary__promo-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: var(--bg);
  border: 1px dashed var(--line-strong);
  border-radius: 10px;
}
.stryt-summary__promo-icon { color: var(--fg-3); display: inline-flex; }
.stryt-summary__promo-input {
  flex: 1;
  background: transparent;
  border: 0;
  color: var(--fg);
  font-family: var(--font-body);
  font-size: 13px;
  outline: none;
  padding: 0;
  min-width: 100px;
}
.stryt-summary__promo-input::placeholder { color: var(--fg-3); }
.stryt-summary__promo-apply {
  background: transparent;
  border: 0;
  color: var(--fg);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 4px 8px;
  cursor: pointer;
}
.stryt-summary__promo-apply:hover { color: var(--accent); }
.stryt-summary__promo-hint { display: block; font-size: 9px; color: var(--fg-3); margin: 6px 0 0; letter-spacing: 0.1em; }
.stryt-summary__coupon {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 8px 8px 0 0;
  padding: 4px 10px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.stryt-summary__coupon a { color: var(--fg-3); text-decoration: none; }
.stryt-summary__coupon a:hover { color: var(--fg); }

.stryt-summary__totals {
  margin: 0;
  padding: 14px 20px;
  border-top: 1px solid var(--line);
  background: var(--surface-2);
}
.stryt-summary__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 4px 0;
  margin: 0;
}
.stryt-summary__row dt {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  color: var(--fg-2);
  margin: 0;
  text-transform: uppercase;
}
.stryt-summary__row dd {
  font-family: var(--font-mono);
  font-size: 13px;
  color: var(--fg);
  margin: 0;
  font-weight: 600;
}
.stryt-summary__row dd.is-accent,
.stryt-summary__row dd .is-accent { color: var(--accent); }
.stryt-summary__row dd .amount,
.stryt-summary__row dd bdi { font-family: inherit; font-weight: inherit; }
.stryt-summary__row--total {
  border-top: 1px solid var(--line);
  margin-top: 8px;
  padding-top: 12px;
}
.stryt-summary__row--total dt { font-family: var(--font-body); font-size: 14px; font-weight: 800; color: var(--fg); letter-spacing: 0.02em; }
.stryt-summary__row--total dd { font-size: 32px; color: var(--fg); letter-spacing: 0.02em; }

.stryt-summary__pay { padding: 14px 20px 20px; }
.stryt-summary__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  padding: 16px;
  background: var(--accent);
  color: var(--accent-fg);
  border: 0;
  border-radius: 999px;
  font-family: var(--font-body);
  font-weight: 800;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  cursor: pointer;
  transition: filter 120ms;
}
.stryt-summary__cta:hover { filter: brightness(1.05); }
.stryt-summary__cta[disabled] { opacity: 0.6; cursor: not-allowed; }
.stryt-summary__cta .amount,
.stryt-summary__cta bdi { font-family: inherit; font-weight: inherit; }
.stryt-summary__assurance {
  display: flex; align-items: center; justify-content: center;
  gap: 6px;
  color: var(--fg-3);
  margin-top: 14px;
  font-size: 9px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* trust badges below summary */
.stryt-trust {
  margin-top: 16px;
  padding: 16px;
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.stryt-trust__row { display: flex; align-items: center; gap: 12px; }
.stryt-trust__icon {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: var(--surface);
  border: 1px solid var(--line);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--fg);
}
.stryt-trust__text { display: flex; flex-direction: column; line-height: 1.3; }
.stryt-trust__text strong { font-size: 12px; font-weight: 600; color: var(--fg); }
.stryt-trust__text small { font-size: 9px; color: var(--fg-3); letter-spacing: 0.1em; margin-top: 2px; }

/* WC validation/notice styling inside our form */
.stryt-checkout .woocommerce-error,
.stryt-checkout .woocommerce-NoticeGroup .woocommerce-error {
  margin: 0 0 20px;
}
.stryt-checkout .blockUI.blockOverlay {
  background: rgba(10,10,10,0.6) !important;
}

@media (max-width: 1024px) {
  .stryt-checkout__grid { grid-template-columns: 1fr; gap: 32px; }
  .stryt-checkout__right { position: static; }
  .stryt-checkout__title { font-size: 64px; }
}
@media (max-width: 640px) {
  .stryt-form-grid { grid-template-columns: 1fr; }
  .stryt-form-grid--2-1 { grid-template-columns: 1fr 1fr; }
  .stryt-express { flex-direction: column; }
  .stryt-checkout__head-row { align-items: flex-start; }
  .stryt-checkout__title { font-size: 48px; }
}

/* ─── My account ─── */
.woocommerce-account .woocommerce {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 40px var(--pad-x) 80px;
  align-items: flex-start;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 12px 14px;
  border-radius: 8px;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--fg-2);
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
  background: var(--surface);
  color: var(--fg);
  border-left: 2px solid var(--accent);
}

.woocommerce-account .woocommerce-MyAccount-content {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 28px;
}

/* Guests get no nav — drop the empty 240px column and centre the auth block. */
body.woocommerce-account:not(.logged-in) .woocommerce-account {
  grid-template-columns: 1fr;
}
body.woocommerce-account:not(.logged-in) .woocommerce-MyAccount-navigation { display: none; }
body.woocommerce-account:not(.logged-in) .woocommerce-MyAccount-content {
  background: transparent;
  border: 0;
  padding: 0;
  max-width: 960px;
  margin: 0 auto;
  width: 100%;
}

/* ─── Login / register screen ─── */
.stryt-auth {
  max-width: 460px;
  margin: 0 auto;
  position: relative;
}
.stryt-auth__card[hidden] { display: none; }

.stryt-auth__card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 22px;
  padding: 36px 32px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  animation: stryt-auth-in 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
}
.stryt-auth__card--register {
  background: linear-gradient(180deg, var(--surface) 0%, var(--surface-2) 100%);
  border-color: var(--line-strong);
}
@keyframes stryt-auth-in {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.stryt-auth__head { display: flex; flex-direction: column; gap: 8px; }
.stryt-auth__eyebrow {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--fg-3);
}
.stryt-auth__eyebrow--accent { color: var(--accent); }
.stryt-auth__title {
  font-family: var(--font-display);
  font-size: 44px;
  line-height: 0.9;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.01em;
}

.stryt-auth__form {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0;
}

.stryt-auth__row { margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.stryt-auth__row label {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fg-3);
}
.stryt-auth__row .required {
  color: var(--accent);
  border: 0;
  text-decoration: none;
  margin-left: 4px;
}
.stryt-auth__row .input-text,
.stryt-auth__row input[type="text"],
.stryt-auth__row input[type="email"],
.stryt-auth__row input[type="password"] {
  width: 100%;
  background: var(--bg);
  color: var(--fg);
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  padding: 14px 16px;
  font-size: 14px;
  font-family: var(--font-body);
  outline: none;
  transition: border-color 140ms, background 140ms;
}
.stryt-auth__row .input-text:focus,
.stryt-auth__row input:focus {
  border-color: var(--accent);
  background: var(--surface);
}
.stryt-auth__hint {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--fg-3);
  margin-top: 2px;
}

.stryt-auth__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: -4px;
}
.stryt-auth .stryt-check { margin-top: 0; font-size: 12px; color: var(--fg-2); }
.stryt-auth__forgot {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fg-3);
  border-bottom: 1px solid var(--line);
  padding-bottom: 2px;
  transition: color 140ms, border-color 140ms;
}
.stryt-auth__forgot:hover { color: var(--accent); border-color: var(--accent); }

.stryt-auth__submit {
  width: 100%;
  margin-top: 6px;
}

.stryt-auth__notice,
.stryt-auth .woocommerce-privacy-policy-text,
.stryt-auth .woocommerce-privacy-policy-text p {
  font-size: 12px;
  line-height: 1.55;
  color: var(--fg-3);
  margin: 0;
}
.stryt-auth .woocommerce-privacy-policy-text {
  padding: 14px 16px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--line);
  border-radius: 10px;
}
.stryt-auth .woocommerce-privacy-policy-text a {
  color: var(--fg-2);
  border-bottom: 1px solid var(--line-strong);
}
.stryt-auth .woocommerce-privacy-policy-text a:hover { color: var(--accent); border-color: var(--accent); }

/* Validation states inside auth forms */
.stryt-auth .woocommerce-invalid .input-text,
.stryt-auth [aria-invalid="true"] {
  border-color: var(--danger) !important;
  background: color-mix(in srgb, var(--danger) 8%, var(--bg));
}

/* Pane footer: switcher between login and register */
.stryt-auth__foot {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
  padding-top: 22px;
  margin-top: 4px;
  border-top: 1px solid var(--line);
  font-size: 13px;
  color: var(--fg-3);
}
.stryt-auth__foot-text {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.stryt-auth__switch {
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent);
  border-bottom: 1px solid var(--accent);
  padding-bottom: 2px;
  transition: opacity 140ms;
}
.stryt-auth__switch:hover { opacity: 0.7; }

@media (max-width: 860px) {
  .stryt-auth__card { padding: 28px 22px; }
  .stryt-auth__title { font-size: 36px; }
}

/* ─── My account: layout + content endpoints ─── */

/* Navigation column + content sit side by side (guests collapse to one
   column via the :not(.logged-in) rule above; phones via responsive.css). */
.woocommerce > .woocommerce-account {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 48px;
  align-items: start;
}

.woocommerce-MyAccount-content > :first-child { margin-top: 0; }
.woocommerce-MyAccount-content > :last-child { margin-bottom: 0; }
.woocommerce-MyAccount-content p { color: var(--fg-2); }

/* Section headings inside the content card */
.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.01em;
  line-height: 1;
  font-size: 22px;
  margin: 0 0 16px;
}
.woocommerce-MyAccount-content .woocommerce-order-details__title,
.woocommerce-MyAccount-content .woocommerce-column__title { font-size: 18px; }

/* Inline text links */
.woocommerce-MyAccount-content a:not(.button):not(.woocommerce-button):not(.edit) {
  color: var(--fg);
  border-bottom: 1px solid var(--line-strong);
  transition: color 140ms, border-color 140ms;
}
.woocommerce-MyAccount-content a:not(.button):not(.woocommerce-button):not(.edit):hover {
  color: var(--accent);
  border-color: var(--accent);
}

/* Buttons → pill, matching the rest of the theme */
.woocommerce-MyAccount-content .button:not([type="submit"]),
.woocommerce-MyAccount-content .woocommerce-button:not([type="submit"]) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid var(--line-strong);
  background: transparent;
  color: var(--fg);
  cursor: pointer;
  transition: border-color 140ms, background 140ms, color 140ms;
}
.woocommerce-MyAccount-content .button:not([type="submit"]):hover,
.woocommerce-MyAccount-content .woocommerce-button:not([type="submit"]):hover { border-color: var(--fg); }

/* Primary "save" submit buttons in the edit forms */
.woocommerce-MyAccount-content button[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 14px 24px;
  border-radius: 999px;
  border: 1px solid var(--accent);
  background: var(--accent);
  color: var(--accent-fg);
  cursor: pointer;
  transition: background 140ms;
}
.woocommerce-MyAccount-content button[type="submit"]:hover { background: #c2eb2a; }

/* ── Orders / downloads tables ── */
.woocommerce-MyAccount-content table.shop_table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  font-size: 14px;
  margin: 0;
}
.woocommerce-MyAccount-content table.shop_table thead th {
  text-align: left;
  padding: 14px 16px;
  background: var(--surface-2);
  border-bottom: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fg-3);
}
.woocommerce-MyAccount-content table.shop_table tbody td,
.woocommerce-MyAccount-content table.shop_table tbody th,
.woocommerce-MyAccount-content table.shop_table tfoot td,
.woocommerce-MyAccount-content table.shop_table tfoot th {
  padding: 16px;
  border-bottom: 1px solid var(--line);
  color: var(--fg-2);
  vertical-align: middle;
}
/* order-number is a <th scope="row"> in the body — keep it cell-like, not a header */
.woocommerce-MyAccount-content table.shop_table tbody th { text-align: left; font-weight: 400; }
.woocommerce-MyAccount-content table.shop_table tbody tr:last-child td,
.woocommerce-MyAccount-content table.shop_table tbody tr:last-child th,
.woocommerce-MyAccount-content table.shop_table tfoot tr:last-child td,
.woocommerce-MyAccount-content table.shop_table tfoot tr:last-child th { border-bottom: 0; }
.woocommerce-MyAccount-content table.shop_table tbody tr:hover td,
.woocommerce-MyAccount-content table.shop_table tbody tr:hover th { background: var(--surface-2); }
.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-number a { font-weight: 600; color: var(--fg); border: 0; }
.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-status {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--fg);
}
.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions {
  text-align: right;
  white-space: nowrap;
}
.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions .button { padding: 8px 14px; }
.woocommerce-MyAccount-content table.shop_table tfoot th { font-weight: 600; color: var(--fg); }

/* ── Order overview (view single order) ── */
.woocommerce-MyAccount-content .woocommerce-order-overview {
  list-style: none;
  margin: 0 0 28px;
  padding: 20px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 18px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 12px;
}
.woocommerce-MyAccount-content .woocommerce-order-overview li {
  border: 0;
  margin: 0;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fg-3);
}
.woocommerce-MyAccount-content .woocommerce-order-overview li strong {
  display: block;
  margin-top: 6px;
  font-family: var(--font-body);
  font-size: 15px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--fg);
}

/* ── Addresses ── */
.woocommerce-MyAccount-content .woocommerce-Addresses {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin: 0;
}
.woocommerce-MyAccount-content .woocommerce-Address {
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 22px;
}
.woocommerce-MyAccount-content .woocommerce-Address-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.woocommerce-MyAccount-content .woocommerce-Address-title h2,
.woocommerce-MyAccount-content .woocommerce-Address-title h3 { margin: 0; font-size: 17px; }
.woocommerce-MyAccount-content .woocommerce-Address-title .edit {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent);
  border-bottom: 1px solid transparent;
  transition: border-color 140ms;
}
.woocommerce-MyAccount-content .woocommerce-Address-title .edit:hover { border-color: var(--accent); }
.woocommerce-MyAccount-content address {
  font-style: normal;
  font-size: 14px;
  line-height: 1.7;
  color: var(--fg-2);
}

/* ── Edit account / edit address forms ── */
.woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper,
.woocommerce-MyAccount-content .woocommerce-EditAccountForm {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 16px;
}
/* Anything that isn't an explicit half-width field spans the full row. */
.woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > .form-row-wide,
.woocommerce-MyAccount-content .woocommerce-EditAccountForm > .form-row-wide,
.woocommerce-MyAccount-content .woocommerce-EditAccountForm > fieldset,
.woocommerce-MyAccount-content .woocommerce-EditAccountForm > .woocommerce-form-row:not(.form-row-first):not(.form-row-last) {
  grid-column: 1 / -1;
}

.woocommerce-MyAccount-content .woocommerce-form-row,
.woocommerce-MyAccount-content .form-row { margin: 0 0 16px; padding: 0; display: block; }
.woocommerce-MyAccount-content form label {
  display: block;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fg-3);
  margin: 0 0 6px;
}
.woocommerce-MyAccount-content .required { color: var(--accent); border: 0; text-decoration: none; }
/* scoped to logged-in so the guest login form (.stryt-auth) keeps its own field styling */
body.logged-in .woocommerce-MyAccount-content .input-text,
body.logged-in .woocommerce-MyAccount-content input[type="text"],
body.logged-in .woocommerce-MyAccount-content input[type="email"],
body.logged-in .woocommerce-MyAccount-content input[type="tel"],
body.logged-in .woocommerce-MyAccount-content input[type="password"],
body.logged-in .woocommerce-MyAccount-content select,
body.logged-in .woocommerce-MyAccount-content textarea {
  width: 100%;
  background: var(--bg);
  color: var(--fg);
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  padding: 13px 14px;
  font-size: 14px;
  font-family: var(--font-body);
  outline: none;
  transition: border-color 140ms, background 140ms;
}
body.logged-in .woocommerce-MyAccount-content .input-text:focus,
body.logged-in .woocommerce-MyAccount-content input:focus,
body.logged-in .woocommerce-MyAccount-content select:focus,
body.logged-in .woocommerce-MyAccount-content textarea:focus { border-color: var(--accent); background: var(--surface); }

.woocommerce-MyAccount-content fieldset {
  margin: 8px 0 0;
  padding: 22px 0 0;
  border: 0;
  border-top: 1px solid var(--line);
}
.woocommerce-MyAccount-content fieldset legend {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--fg-3);
  padding: 0;
  margin-bottom: 14px;
}
.woocommerce-MyAccount-content .woocommerce-form-row span em {
  display: block;
  margin-top: 4px;
  font-style: normal;
  font-size: 12px;
  color: var(--fg-3);
}

/* Invalid fields after a failed submit */
.woocommerce-MyAccount-content .woocommerce-invalid .input-text,
.woocommerce-MyAccount-content [aria-invalid="true"] {
  border-color: var(--danger) !important;
  background: color-mix(in srgb, var(--danger) 8%, var(--bg));
}

/* Mini-cart inside drawer */
.stryt-mini-cart {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.stryt-mini-cart.is-busy { opacity: 0.5; pointer-events: none; }

.stryt-mini-cart__scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 4px 28px 24px;
}

.stryt-mini-cart__items {
  list-style: none;
  margin: 0;
  padding: 0;
}
.stryt-mini-cart__item {
  position: relative;
  display: grid;
  grid-template-columns: 84px 1fr;
  gap: 18px;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}
.stryt-mini-cart__item:first-child { padding-top: 8px; }

.stryt-mini-cart__thumb {
  width: 84px;
  height: 96px;
  background: var(--surface);
  border-radius: 4px;
  overflow: hidden;
  flex-shrink: 0;
}
.stryt-mini-cart__thumb a,
.stryt-mini-cart__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.stryt-mini-cart__info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  padding-right: 24px;
}
.stryt-mini-cart__sku {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  color: var(--fg-3);
  text-transform: uppercase;
}
.stryt-mini-cart__name {
  font-family: var(--font-display);
  font-size: 18px;
  line-height: 1.15;
  text-transform: uppercase;
  letter-spacing: 0.01em;
}
.stryt-mini-cart__name a { color: var(--fg); text-decoration: none; }
.stryt-mini-cart__name a:hover { color: var(--accent); }
.stryt-mini-cart__meta {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  color: var(--fg-3);
  text-transform: uppercase;
}
.stryt-mini-cart__meta p { margin: 0; }
.stryt-mini-cart__meta dl { margin: 0; display: inline; }
.stryt-mini-cart__meta dt,
.stryt-mini-cart__meta dd { display: inline; margin: 0; }
.stryt-mini-cart__meta dd + dt::before { content: " · "; }

.stryt-mini-cart__row {
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.stryt-mini-cart__qty {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  height: 32px;
  overflow: hidden;
}
.stryt-mini-cart__qty-btn {
  width: 28px;
  height: 100%;
  border: 0;
  background: transparent;
  color: var(--fg);
  font-size: 16px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-mono);
}
.stryt-mini-cart__qty-btn:hover { color: var(--accent); }
.stryt-mini-cart__qty-input {
  width: 32px;
  height: 100%;
  border: 0;
  background: transparent;
  color: var(--fg);
  text-align: center;
  font-family: var(--font-mono);
  font-size: 12px;
  -moz-appearance: textfield;
  appearance: textfield;
}
.stryt-mini-cart__qty-input::-webkit-outer-spin-button,
.stryt-mini-cart__qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.stryt-mini-cart__price {
  font-family: var(--font-mono);
  font-size: 14px;
  font-weight: 600;
  color: var(--fg);
  white-space: nowrap;
}
.stryt-mini-cart__price .amount,
.stryt-mini-cart__price bdi { font-family: inherit; font-weight: inherit; }

.stryt-mini-cart__remove {
  position: absolute;
  top: 14px;
  right: 0;
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--fg-3);
  text-decoration: none;
  font-size: 18px;
  line-height: 1;
  border-radius: 999px;
  transition: color 150ms;
}
.stryt-mini-cart__remove:hover { color: var(--fg); }

/* Promo input */
.stryt-mini-cart__promo {
  margin-top: 20px;
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  padding: 4px 4px 4px 16px;
  height: 52px;
}
.stryt-mini-cart__promo-icon {
  color: var(--fg-3);
  display: inline-flex;
  align-items: center;
}
.stryt-mini-cart__promo-input {
  flex: 1;
  border: 0;
  background: transparent;
  color: var(--fg);
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  outline: none;
  text-transform: uppercase;
  min-width: 100px;
}
.stryt-mini-cart__promo-input::placeholder {
  color: var(--fg-3);
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 11px;
}
.stryt-mini-cart__promo-apply {
  background: transparent;
  border: 0;
  color: var(--fg);
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 0 16px;
  height: 100%;
  cursor: pointer;
}
.stryt-mini-cart__promo-apply:hover { color: var(--accent); }
.stryt-mini-cart__promo.is-error { border-color: var(--danger, #ff3a3a); }

.stryt-mini-cart__coupons {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.stryt-mini-cart__coupons li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.stryt-mini-cart__coupon-remove {
  color: var(--fg-3);
  text-decoration: none;
  font-size: 14px;
  line-height: 1;
}
.stryt-mini-cart__coupon-remove:hover { color: var(--fg); }

/* Bottom payment block */
.stryt-mini-cart__pay {
  border-top: 1px solid var(--line);
  padding: 20px 28px 22px;
  background: var(--bg);
}

.stryt-mini-cart__totals {
  margin: 0 0 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.stryt-mini-cart__totals-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin: 0;
}
.stryt-mini-cart__totals-row dt {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--fg-3);
  margin: 0;
}
.stryt-mini-cart__totals-row dd {
  font-family: var(--font-mono);
  font-size: 14px;
  color: var(--fg);
  margin: 0;
  font-weight: 600;
}
.stryt-mini-cart__totals-row dd .amount,
.stryt-mini-cart__totals-row dd bdi { font-family: inherit; font-weight: inherit; }
.stryt-mini-cart__free { color: var(--accent); font-weight: 700; letter-spacing: 0.04em; }

.stryt-mini-cart__totals-row--total {
  padding-top: 4px;
}
.stryt-mini-cart__totals-row--total dt {
  font-family: var(--font-display);
  font-size: 22px;
  letter-spacing: 0.02em;
  color: var(--fg);
}
.stryt-mini-cart__totals-row--total dd {
  font-family: var(--font-display);
  font-size: 32px;
  color: var(--accent);
  letter-spacing: 0.02em;
}

.stryt-mini-cart__checkout {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  background: var(--accent);
  color: var(--accent-fg);
  border: 0;
  border-radius: 6px;
  padding: 18px 22px;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  transition: filter 150ms;
}
.stryt-mini-cart__checkout:hover { filter: brightness(1.05); color: var(--accent-fg); }
.stryt-mini-cart__checkout svg { stroke: currentColor; }

.stryt-mini-cart__badges {
  margin-top: 14px;
  text-align: center;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  color: var(--fg-3);
  text-transform: uppercase;
}

/* onsale flash */
.woocommerce span.onsale {
  background: var(--danger);
  color: #fff;
  border-radius: 3px;
  padding: 4px 8px;
  font-family: var(--font-mono);
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  min-width: 0;
  min-height: 0;
  line-height: 1.2;
}

/* ─── Order-pay endpoint (form-pay.php) ─── */
/* Suppress page.php's duplicate header on order-pay; our form has its own.
   Also flatten the `.entry-content` typography inheritance so it doesn't
   re-color all the inner text. */
.woocommerce-order-pay .page-header { display: none; }
.woocommerce-order-pay .site-main > .container {
  padding: 0;
}
.woocommerce-order-pay .entry-content {
  font-size: inherit;
  line-height: inherit;
  color: inherit;
}
.stryt-orderpay { display: block; }

.stryt-orderpay__head {
  margin-bottom: 32px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--line);
}
.stryt-orderpay__head-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--fg-3);
  margin-bottom: 14px;
}
.stryt-orderpay__head-meta > span { display: inline-flex; align-items: center; }
.stryt-orderpay__title {
  font-size: 64px;
  line-height: 0.95;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: -0.01em;
}
.stryt-orderpay__sub {
  margin: 10px 0 0;
  color: var(--fg-3);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.stryt-orderpay__status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 8px;
  border-radius: 4px;
  font-weight: 700;
  background: var(--surface-2);
  color: var(--fg-2);
  letter-spacing: 0.08em;
}
.stryt-orderpay__status::before {
  content: "";
  width: 6px; height: 6px; border-radius: 999px;
  background: currentColor;
}
.stryt-orderpay__status--pending,
.stryt-orderpay__status--on-hold,
.stryt-orderpay__status--failed { color: var(--accent); }
.stryt-orderpay__status--processing,
.stryt-orderpay__status--completed { color: #2c8a4c; }
.stryt-orderpay__status--cancelled,
.stryt-orderpay__status--refunded { color: var(--fg-3); }

/* Order items list (read-only — items come from the order, not the cart) */
.stryt-orderpay__items {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  background: var(--surface);
}
.stryt-orderpay__item {
  display: grid;
  grid-template-columns: 56px 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}
.stryt-orderpay__item:last-child { border-bottom: 0; }
.stryt-orderpay__thumb {
  position: relative;
  width: 56px; height: 70px;
  background: var(--surface-2);
  border-radius: 6px;
  overflow: hidden;
}
.stryt-orderpay__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.stryt-orderpay__sku {
  position: absolute;
  top: 4px; left: 4px;
  background: var(--bg);
  color: var(--fg-3);
  padding: 1px 4px;
  border-radius: 3px;
  font-size: 8px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  z-index: 1;
}
.stryt-orderpay__info { min-width: 0; }
.stryt-orderpay__name {
  font-size: 14px;
  font-weight: 600;
  color: var(--fg);
  line-height: 1.3;
}
.stryt-orderpay__meta {
  margin-top: 4px;
  font-size: 10px;
  letter-spacing: 0.1em;
  color: var(--fg-3);
  text-transform: lowercase;
}
.stryt-orderpay__meta dl,
.stryt-orderpay__meta dt,
.stryt-orderpay__meta dd { display: inline; margin: 0; padding: 0; }
.stryt-orderpay__meta dt::after { content: ": "; }
.stryt-orderpay__meta dd + dt::before { content: " · "; }
.stryt-orderpay__price {
  font-size: 15px;
  font-weight: 700;
  color: var(--fg);
  white-space: nowrap;
}
.stryt-orderpay__price .amount,
.stryt-orderpay__price bdi { font-family: inherit; font-weight: inherit; }

/* Shipping / contact block (read-only) */
.stryt-orderpay__ship {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px 18px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
}
.stryt-orderpay__ship-row {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 12px;
  align-items: baseline;
  font-size: 13px;
  color: var(--fg);
}
.stryt-orderpay__ship-row .mono {
  font-size: 10px;
  letter-spacing: 0.12em;
  color: var(--fg-3);
  text-transform: uppercase;
}

/* When the form-pay.php is shown but the order is already paid, hide the
   payment column entirely and let the summary stretch (handled in markup
   by not rendering the .stryt-pay section). */
.stryt-orderpay .stryt-summary { position: sticky; top: 24px; }

@media (max-width: 960px) {
  .stryt-orderpay__title { font-size: 44px; }
  .stryt-orderpay__head { margin-bottom: 24px; padding-bottom: 18px; }
  .stryt-orderpay__ship-row { grid-template-columns: 80px 1fr; }
  .stryt-orderpay .stryt-summary { position: static; }
}

/* ─── Size-guide modal ─────────────────────────────────────── */
.pdp__sizeguide {
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  font: inherit;
  color: var(--fg-3, #666);
  text-decoration: underline;
  text-underline-offset: 3px;
  letter-spacing: 0.04em;
}
.pdp__sizeguide:hover { color: var(--fg, #111); }

.stryt-sizeguide-modal {
  position: fixed;
  inset: 0;
  z-index: 400;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
  animation: fadeIn 180ms ease;
}
.stryt-sizeguide-modal[hidden] { display: none; }
.stryt-sizeguide-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.78);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 0;
  padding: 0;
  cursor: zoom-out;
}
.stryt-sizeguide-modal__dialog {
  position: relative;
  max-width: min(960px, 100%);
  max-height: 100%;
  background: var(--bg, #fff);
  border: 1px solid var(--line, #eee);
  padding: 28px 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5);
  animation: stryt-sg-pop 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
}
@keyframes stryt-sg-pop {
  from { transform: translateY(12px) scale(0.98); opacity: 0; }
  to   { transform: translateY(0) scale(1);      opacity: 1; }
}
.stryt-sizeguide-modal__title {
  font-family: var(--font-display, inherit);
  font-size: 22px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  line-height: 1;
}
.stryt-sizeguide-modal__close {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 36px;
  height: 36px;
  background: none;
  border: 0;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  color: var(--fg, #111);
}
.stryt-sizeguide-modal__close:hover { opacity: 0.6; }
.stryt-sizeguide-modal__image-wrap {
  overflow: auto;
  max-height: calc(100vh - 180px);
  text-align: center;
  background: #fafafa;
  border: 1px solid var(--line, #eee);
}
.stryt-sizeguide-modal__image-wrap img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
  height: auto;
}
@media (max-width: 600px) {
  .stryt-sizeguide-modal { padding: 0; }
  .stryt-sizeguide-modal__dialog {
    max-width: 100%;
    width: 100%;
    height: 100%;
    max-height: 100%;
    border: 0;
    padding: 56px 16px 16px;
  }
  .stryt-sizeguide-modal__image-wrap { max-height: calc(100vh - 120px); }
}