/* =========================================================
   Wholesale section — flea's ts branded styling.
   Special Elite, lowercase, light & professional.
   Everything is scoped under .ws so the nav/footer stay untouched.
   ========================================================= */

/* Light page background for the whole wholesale section (site body is black). */
body.ws-page { background: #f6f3ec; }
body.ws-page main { color: #18120f; }
body.ws-page .tabbar { display: none !important; }  /* hide the ecommerce mobile tabbar */

/* =========================================================
   Wholesale page header — editorial header + breadcrumb + pills.
   Self-contained port of the retail .fs-header / .fs-pills /
   .pdp-breadcrumb (which live on store.css, not loaded here), via a
   local --w-* token set so a retail change can never break it.
   ========================================================= */
body.ws-page {
  --w-bg:          #f6f3ec;
  --w-surface:     #efe9dc;
  --w-border:      rgba(24, 18, 15, .10);
  --w-border-dark: rgba(24, 18, 15, .34);
  --w-text:        #18120f;
  --w-muted:       #6f635a;   /* was #8a8378 = 3.38:1 on cream (fails AA) */
  --w-accent:      #c8a84b;
  --w-font:        'Special Elite', 'Courier New', monospace;
  --w-trans:       180ms ease;
}

.w-head { background: var(--w-bg); border-bottom: 1px solid var(--w-border);
  position: relative; z-index: 10; font-family: var(--w-font); }
.w-head--sticky { }
@media (min-width: 540px) { .w-head--sticky { position: sticky; top: 0; } }

.w-head__top { display: grid; grid-template-columns: 1fr auto 1fr;
  align-items: center; gap: .5rem; padding: .7rem 1rem .3rem; }
.w-head__eyebrow, .w-head__count { font-size: .72rem; letter-spacing: .16em;
  text-transform: lowercase; color: var(--w-muted); line-height: 1.4; }
.w-head__eyebrow { text-align: left; }
.w-head__count { text-align: right; }
.w-head__title { font-family: var(--w-font); font-size: clamp(1.05rem, 4.5vw, 1.7rem);
  line-height: 1; text-align: center; text-transform: lowercase; letter-spacing: .01em;
  margin: 0; color: var(--w-text); }

/* Breadcrumb — port of .pdp-breadcrumb */
.w-crumbs { display: flex; align-items: center; gap: .4rem; padding: .6rem 1rem;
  font-size: .72rem; letter-spacing: .1em; text-transform: lowercase; color: var(--w-muted);
  overflow-x: auto; white-space: nowrap; scrollbar-width: none; border-bottom: 1px solid var(--w-border); }
.w-crumbs::-webkit-scrollbar { display: none; }
.w-crumbs a { color: var(--w-muted); text-decoration: none; transition: color var(--w-trans); }
.w-crumbs a:hover { color: var(--w-text); }
.w-crumbs__current { color: var(--w-text); }
.w-crumbs__sep { color: var(--w-border-dark); }

/* Garment-TYPE pills — port of .fs-pills */
.w-pills { display: flex; align-items: center; gap: .4rem; overflow-x: auto;
  -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: .65rem 1rem;
  border-top: 1px solid var(--w-border);
  -webkit-mask-image: linear-gradient(to right, #000 88%, transparent 100%);
  mask-image: linear-gradient(to right, #000 88%, transparent 100%); }
.w-pills::-webkit-scrollbar { display: none; }
.w-pill { display: inline-flex; align-items: center; height: 30px; padding: 0 .85rem;
  border-radius: 999px; font-size: .72rem; letter-spacing: .1em; text-transform: lowercase;
  white-space: nowrap; flex-shrink: 0; color: var(--w-muted); background: var(--w-surface);
  border: 1px solid transparent; text-decoration: none; -webkit-tap-highlight-color: transparent;
  transition: background var(--w-trans), color var(--w-trans), border-color var(--w-trans); }
.w-pill:hover { color: var(--w-text); background: var(--w-bg); border-color: var(--w-border-dark); }
.w-pill.is-active { background: var(--w-accent); color: #18120f; border-color: var(--w-accent); }
.w-pill-divider { color: var(--w-border-dark); flex-shrink: 0; padding: 0 .1rem; user-select: none; }

/* Vibe filters — exact port of the retail store's .fs-exprs / .fs-expr so
   wholesale reads the same: hand-stamped angled sayings with gold quotes and a
   wavy underline on hover, NOT pills (pills stay for the garment TYPE row). */
.w-exprs { display: flex; align-items: center; gap: 1.1rem; overflow-x: auto;
  -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 0 1rem .5rem;
  font-family: 'Special Elite', 'Courier New', monospace; }
.w-exprs::-webkit-scrollbar { display: none; }
@media (min-width: 769px) {
  .w-exprs { justify-content: center; flex-wrap: wrap; gap: .5rem 1.4rem; overflow-x: visible; } }
.w-expr { flex: 0 0 auto; display: inline-flex; align-items: center; min-height: 34px;
  padding: 2px 3px; font-size: .84rem; letter-spacing: .04em; text-transform: lowercase;
  white-space: nowrap; color: var(--w-text); text-decoration: none;
  transform: rotate(-1.4deg); -webkit-tap-highlight-color: transparent;
  transition: color .18s ease, transform .18s ease; }
.w-expr:nth-child(even) { transform: rotate(1.4deg); }
.w-expr::before { content: "\201C"; color: var(--w-accent); margin-right: 1px; }
.w-expr::after  { content: "\201D"; color: var(--w-accent); margin-left: 1px; }
@media (hover: hover) {
  .w-expr:hover { color: var(--w-accent); transform: rotate(0deg) scale(1.06);
    text-decoration: underline; text-decoration-style: wavy;
    text-decoration-color: var(--w-accent); text-underline-offset: 4px;
    text-decoration-thickness: 1px; } }
.w-expr.is-active { background: var(--w-accent); color: #18120f; border-radius: 4px;
  padding: 2px 9px; transform: rotate(-2deg); box-shadow: 1px 2px 0 rgba(24, 18, 15, .25); }
.w-expr.is-active::before, .w-expr.is-active::after { color: #18120f; }
@media (hover: hover) {
  .w-expr.is-active:hover { color: #18120f; text-decoration: none; transform: rotate(0deg); } }
@media (prefers-reduced-motion: reduce) { .w-expr, .w-expr:hover { transform: none; } }

/* ---- Wholesale (dance) navbar — dusk ---- */
.wnav {
  background: #4a4e69;
  color: #f3f0e7;
  font-family: 'Special Elite', 'Courier New', monospace;
  text-transform: lowercase;
}
.wnav__inner {
  max-width: 1100px; margin: 0 auto; padding: .7rem 1rem;
  display: flex; align-items: center; gap: .6rem 1rem; flex-wrap: wrap;
}
.wnav__brand {
  color: #f3f0e7; text-decoration: none; font-size: 1.25rem; letter-spacing: .03em;
  display: inline-flex; align-items: baseline; gap: .5rem; flex: 0 0 auto;
}
.wnav__brand:hover { color: #fff; }
.wnav__tag { font-size: .62rem; letter-spacing: .2em; color: #c8a84b; }
/* margin-left:auto groups the links + account + cart to the right, brand stays left */
.wnav__links { display: flex; align-items: center; gap: 1.1rem; flex-wrap: wrap; margin-left: auto; }

/* Account/login icon — matches the cart, shown desktop + mobile (replaces the
   text links). Dusk/gold wholesale palette; signed in reads gold ("your account"). */
.wnav__account {
  display: inline-flex;
  position: relative;
  align-items: center; justify-content: center;
  width: 40px; height: 40px;
  color: #d8d6e0; text-decoration: none;
  border: 1px solid rgba(243, 240, 231, .22);
  border-radius: 8px; flex-shrink: 0;
  transition: color .18s ease, border-color .18s ease;
}
.wnav__account:hover { color: #fff; border-color: rgba(243, 240, 231, .5); }
.wnav__account svg { width: 20px; height: 20px; fill: currentColor; display: block; }
.wnav__account.wnav__account--authed { color: #c8a84b; border-color: #c8a84b; }

/* Log-out icon button — same bordered square as .wnav__account/.wnav__cart, a
   distinct door/exit glyph (stroke). Shown desktop + mobile for signed-in users. */
.wnav__logout {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; padding: 0;
  color: #d8d6e0; background: transparent;
  border: 1px solid rgba(243, 240, 231, .22); border-radius: 8px;
  cursor: pointer; font: inherit; -webkit-appearance: none; appearance: none;
  flex-shrink: 0; transition: color .18s ease, border-color .18s ease;
}
.wnav__logout:hover { color: #fff; border-color: rgba(243, 240, 231, .5); }
.wnav__logout:focus-visible { outline: 2px solid var(--focus-ring, #f3f0e7); outline-offset: 2px; }
.wnav__logout svg { width: 18px; height: 18px; display: block; }

/* Storefront switcher button in the dusk wnav (the popover/rows are the shared
   dark styling from nav.css; only the trigger needs the wholesale palette). */
.wnav .sf-switch__btn { color: #d8d6e0; border-color: rgba(243, 240, 231, .22); }
.wnav .sf-switch__btn:hover { color: #fff; border-color: rgba(243, 240, 231, .5); }

.wnav__links a { color: #d8d6e0; text-decoration: none; font-size: .92rem; }
.wnav__links a:hover { color: #fff; }
.wnav__shop {
  background: #c8a84b; color: #18120f !important;
  padding: .4rem .9rem; border-radius: 999px; font-weight: 700;
}
.wnav__shop:hover { filter: brightness(1.06); }
/* Cart mirrors the account icon (bordered button) so the two sit together right. */
.wnav__cart {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; color: #d8d6e0; text-decoration: none;
  border: 1px solid rgba(243, 240, 231, .22); border-radius: 8px; flex-shrink: 0;
  transition: color .18s ease, border-color .18s ease;
}
.wnav__cart:hover { color: #fff; border-color: rgba(243, 240, 231, .5); }
.wnav__cart svg { width: 20px; height: 20px; fill: currentColor; display: block; }
.wnav__cart-badge {
  position: absolute; top: -7px; right: -9px;
  min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px;
  background: #c8a84b; color: #18120f; font-size: 11px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}

/* ---- wholesale mobile bottom bar ---- */
.wtabbar {
  display: none;
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 995;
  align-items: stretch;
  background: #4a4e69;
  border-top: 1px solid rgba(255,255,255,.12);
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
.wtabbar__item {
  flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 3px; min-height: 56px; padding: 8px 4px; position: relative;
  color: #b9b7c6; text-decoration: none;
  font-family: 'Special Elite', monospace; font-size: 12px; letter-spacing: .06em; text-transform: lowercase;
}
.wtabbar__item svg { width: 22px; height: 22px; fill: currentColor; }
.wtabbar__item.is-active { color: #c8a84b; }
.wtabbar__badge {
  position: absolute; top: 5px; left: 50%; transform: translateX(4px);
  min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px;
  background: #c8a84b; color: #18120f; font-size: 12px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
@media (max-width: 768px) {
  /* Matches the navbar's 768px collapse so there's no 700–768px band where
     the desktop nav is hidden AND the bottom bar is absent. */
  .wtabbar { display: flex; }
  /* keep page content + footer clear of the fixed bar */
  body.ws-page main { padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 360px) {
  /* keep the longest tab label ("past orders") on one line on tiny phones */
  .wtabbar__item { font-size: 11px; letter-spacing: 0.03em; }
}

/* ---- wholesale mobile nav ---- */
.wnav__toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: 0;
  cursor: pointer;
  padding: 6px;
}
.wnav__toggle span {
  width: 22px; height: 2px; background: #f3f0e7; border-radius: 2px;
  transition: transform .2s ease, opacity .2s ease;
}
.wnav__toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.wnav__toggle.open span:nth-child(2) { opacity: 0; }
.wnav__toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.wnav__mobile { display: none; flex-direction: column; background: #3f4360; padding: .4rem 1rem .9rem; }
.wnav__mobile.open { display: flex; }
.wnav__mobile a { color: #e7e2d6; text-decoration: none; padding: .7rem .25rem; border-bottom: 1px solid rgba(255,255,255,.08); font-size: .95rem; }
.wnav__mobile a:hover { color: #fff; }
.wnav__mobile .wnav__shop { margin-top: .7rem; border-bottom: 0; text-align: center; }

@media (max-width: 768px) {
  /* Same format as street/dance: hamburger | brand | account | [log out] | cart
     (log-out column collapses to 0 for signed-out / pending-without-logout rows) */
  .wnav__inner {
    display: grid;
    grid-template-columns: auto 1fr auto auto auto;
    gap: 8px; align-items: center; flex-wrap: nowrap;
  }
  .wnav__toggle { display: flex; }
  .wnav__links { display: none; }
  .wnav__account,
  .wnav__logout { justify-self: end; }
  .sf-switch { display: none; }   /* desktop-only; wnav mobile uses .sf-worlds in the hamburger */
  .wnav__brand {
    justify-self: center; font-size: 1.05rem; min-width: 0;
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  }
  .wnav__cart { justify-self: end; }   /* button style now lives in the base rule */
}

/* ---- Wholesale (dance) footer — dusk, matches the navbar ---- */
.wfoot {
  background: #4a4e69;
  color: #d8d6e0;
  font-family: 'Special Elite', 'Courier New', monospace;
  text-transform: lowercase;
  margin-top: 3rem;
}
.wfoot__top {
  max-width: 1100px; margin: 0 auto; padding: 2.25rem 1rem;
  display: flex; gap: 2.5rem; flex-wrap: wrap;
}
.wfoot__brand { flex: 1; min-width: 200px; }
.wfoot__wordmark { color: #f3f0e7; text-decoration: none; font-size: 1.3rem; letter-spacing: .03em; }
.wfoot__tag { color: #c8a84b; font-size: .72rem; letter-spacing: .12em; margin: .25rem 0 .75rem; }
.wfoot__contact { font-size: .85rem; line-height: 1.6; color: #d8d6e0; }
.wfoot__contact a { color: #d8d6e0; text-decoration: none; }
.wfoot__col { min-width: 150px; }
.wfoot__col h4 { color: #fff; font-size: .85rem; margin: 0 0 .6rem; text-transform: lowercase; letter-spacing: .04em; }
.wfoot__col ul { list-style: none; margin: 0; padding: 0; }
.wfoot__col li { margin-bottom: .45rem; }
.wfoot__col a { color: #d8d6e0; text-decoration: none; font-size: .85rem; }
.wfoot__col a:hover, .wfoot__contact a:hover, .wfoot__wordmark:hover { color: #fff; }
.wfoot__bottom {
  border-top: 1px solid rgba(255, 255, 255, .12);
  text-align: center; padding: 1rem; font-size: .75rem; color: #b9b7c6;
}

.ws {
  font-family: 'Special Elite', 'Courier New', monospace;
  text-transform: lowercase;
  color: #18120f;
}
/* core/base.css forces h1-h6 UPPERCASE site-wide — keep wholesale lowercase. */
.ws h1, .ws h2, .ws h3, .ws h4, .ws h5, .ws h6 {
  text-transform: lowercase;
  letter-spacing: normal;
}
/* keep typed field values legible (not force-lowercased) */
.ws input, .ws select, .ws textarea { text-transform: none; }
/* keep user-typed data legible (don't force-lowercase field contents) */
.ws input,
.ws select,
.ws textarea { text-transform: none; }

.ws-wrap { max-width: 980px; margin: 2.25rem auto 3.5rem; padding: 0 1rem; }
.ws-narrow { max-width: 620px; }

/* ---- panels / cards ---- */
.ws-panel {
  border: 1px solid #e7e1d3;
  border-radius: 16px;
  background: #ffffff;
  padding: 1.9rem 1.6rem;
  box-shadow: 0 6px 24px rgba(24, 18, 15, .05);
}
.ws-card {
  border: 1px solid #e7e1d3;
  border-radius: 14px;
  background: #fff;
  padding: 1.25rem;
}
.ws-card__icon { font-size: 1.5rem; line-height: 1; }
.ws-card__title { font-size: 1.05rem; margin: .55rem 0 .25rem; color: #18120f; }
.ws-card p { margin: 0; color: #6b655c; font-size: .9rem; line-height: 1.6; }
.ws-step-num { color: #c8a84b; font-size: 1.4rem; }

/* ---- dashboard tiles (lift + expand on hover) ---- */
.ws-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.ws-tile {
  display: block;
  position: relative;
  border: 1px solid #e3ddcf;
  border-radius: 14px;
  padding: 1.3rem;
  background: #fff;
  text-decoration: none;
  color: #18120f;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.ws-tile:hover {
  transform: translateY(-5px) scale(1.025);
  box-shadow: 0 14px 30px rgba(74, 78, 105, .18);
  border-color: #4a4e69;
  z-index: 2;
}
.ws-tile__title { font-size: 1.08rem; font-weight: 600; }
.ws-tile__sub { color: #8a8378; font-size: .82rem; margin-top: .4rem; line-height: 1.5; }
/* Primary "start here" tiles wear the gold accent */
.ws-tile--accent { border-color: #c8a84b; box-shadow: 0 4px 16px rgba(200, 168, 75, .14); }
.ws-tile--accent:hover { border-color: #c8a84b; box-shadow: 0 16px 34px rgba(200, 168, 75, .28); }
.ws-tile__badge {
  position: absolute; top: .9rem; right: .9rem;
  background: #c8a84b; color: #18120f;
  font-size: .62rem; letter-spacing: .12em; text-transform: lowercase;
  padding: .2rem .5rem; border-radius: 999px;
}
.ws-tile--soon { background: #faf8f3; color: #a59f95; cursor: default; }
.ws-tile--soon:hover { transform: none; box-shadow: none; border-color: #e3ddcf; }

/* ---- headings ---- */
.ws-form-title { font-size: 1.7rem; text-align: center; margin: 0 0 .3rem; }
.ws-form-sub { text-align: center; color: #8a8378; font-size: .92rem; margin: 0 0 1.6rem; line-height: 1.6; }
.ws-section-title { text-align: center; font-size: 1.4rem; margin: 2.75rem 0 1.25rem; }

/* ---- grids ---- */
.ws-grid { display: grid; gap: 1rem; }
.ws-grid--auto { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }

/* ---- product description + sizing accordions (order page) ---- */
.ws-prod-info { margin: .5rem 0 1.25rem; border-bottom: 1px solid #e7e1d3; }
.ws-size-head { margin: 0 0 .5rem; font-size: .9rem; color: #18120f; }
.ws-acc { border-top: 1px solid #e7e1d3; }
.ws-acc__head {
  cursor: pointer; list-style: none;
  padding: .95rem 0; font-size: .95rem; font-weight: 600; color: #18120f;
  display: flex; justify-content: space-between; align-items: center;
}
.ws-acc__head::-webkit-details-marker { display: none; }
.ws-acc__head::after { content: "+"; color: #8a8378; font-weight: 400; font-size: 1.1rem; }
.ws-acc[open] .ws-acc__head::after { content: "\2212"; }
.ws-acc__body { padding: 0 0 1.2rem; color: #6b655c; font-size: .9rem; line-height: 1.7; }
.ws-richtext p { margin: 0 0 .65rem; }
.ws-richtext ul { margin: .2rem 0 .65rem; padding-left: 1.15rem; }
.ws-richtext li { margin-bottom: .25rem; }
.ws-richtext strong { color: #18120f; }
.ws-size-table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.ws-size-table th, .ws-size-table td {
  text-align: left; padding: .45rem .5rem; border-bottom: 1px solid #efe9dc;
}
.ws-size-table th { color: #8a8378; font-weight: 600; }
.ws-size-note { margin: .65rem 0 0; font-size: .78rem; color: #a59f95; }

/* ---- collection header ---- */
.ws-collhead {
  display: flex; justify-content: space-between; align-items: flex-end;
  flex-wrap: wrap; gap: .75rem;
  border-bottom: 1px solid #e7e1d3; padding-bottom: 1.1rem; margin-bottom: .55rem;
}
.ws-collhead h1 { font-size: 1.7rem; margin: 0; }
.ws-collhead__nav { display: flex; align-items: center; gap: 1rem; font-size: .85rem; }
.ws-collhead__nav a { color: #8a8378; text-decoration: none; }
.ws-collhead__nav a:hover { color: #18120f; }
.ws-collhead__nav .is-primary { color: #18120f; font-weight: 600; }
.ws-collsub { color: #a59f95; font-size: .82rem; margin: 0 0 1.75rem; }

/* ---- wholesale product cards ---- */
.ws-prodgrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 1.25rem;
}
.ws-pcard {
  display: flex; flex-direction: column;
  border: 1px solid #e3ddcf; border-radius: 14px; overflow: hidden;
  background: #fff; text-decoration: none; color: #18120f;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.ws-pcard:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 30px rgba(74, 78, 105, .16);
  border-color: #4a4e69;
}
.ws-pcard__img {
  aspect-ratio: 4/5; background: #f6f3ec; box-sizing: border-box; padding: 8px;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.ws-pcard__img img { width: 100%; height: 100%; object-fit: contain; }
.ws-pcard__noimg { color: #c4bdb0; font-size: .78rem; }
.ws-pcard__body { padding: .95rem 1rem 1.1rem; display: flex; flex-direction: column; gap: .7rem; }
.ws-pcard__name { font-size: .95rem; font-weight: 600; line-height: 1.3; text-transform: lowercase; }
/* garment type (eyebrow) shown above the saying — used on product cards + headers */
.ws-eyebrow { display: block; font-size: .62rem; font-weight: 600; letter-spacing: .06em;
  text-transform: lowercase; color: #a89e8c; line-height: 1.2; margin-bottom: .15rem; }
/* colours-available dots on a product card */
.ws-pcard__dots { display: flex; gap: 5px; flex-wrap: wrap; margin-top: .15rem; }
.ws-dot { width: 13px; height: 13px; border-radius: 50%;
  border: 1px solid rgba(24, 18, 15, .18); flex-shrink: 0; }

/* price block — adult / youth shown side by side, equal weight */
.ws-prices { display: flex; gap: 1.5rem; align-items: flex-start; }
.ws-price { display: flex; flex-direction: column; gap: .12rem; }
.ws-price__label {
  font-size: .6rem; letter-spacing: .1em; text-transform: lowercase; color: #a59f95;
}
.ws-price__val { font-size: 1.1rem; font-weight: 700; color: #18120f; line-height: 1; }
.ws-price__retail {
  font-size: .72rem; font-weight: 400; color: #c4bdb0;
  text-decoration: line-through; margin-left: .4rem;
}
.ws-price__unit { font-size: .68rem; color: #a59f95; }

/* ---- hero ---- */
.ws-hero {
  background: #18120f;
  color: #f3f0e7;
  border-radius: 18px;
  padding: 3.25rem 1.5rem;
  text-align: center;
}
.ws-hero h1 { font-size: 2.05rem; line-height: 1.15; margin: .6rem 0 .5rem; color: #f3f0e7; }
.ws-hero p { max-width: 580px; margin: 0 auto 1.6rem; color: #e7e2d6; font-size: 1rem; line-height: 1.7; }
.ws-kicker { color: #c8a84b; letter-spacing: .22em; font-size: .72rem; }

/* ---- form ---- */
.ws-field { margin-bottom: 1rem; }
.ws-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.ws-label { display: block; font-size: .8rem; color: #6b655c; margin-bottom: .35rem; }
.ws-input {
  width: 100%;
  padding: .72rem .85rem;
  border: 1px solid #c9d6ea;
  border-radius: 10px;
  background: #eef4fc;
  color: #18120f;
  font-family: inherit;
  font-size: .95rem;
}
.ws-input:focus { outline: none; border-color: #c8a84b; box-shadow: 0 0 0 3px rgba(200, 168, 75, .18); }
.ws-checkrow { display: flex; gap: .6rem; align-items: flex-start; font-size: .9rem; color: #4a443c; margin: 1.1rem 0; }
.ws-checkrow input[type="checkbox"] {
  -webkit-appearance: none;
  appearance: none;
  width: 20px; height: 20px; margin: 1px 0 0; padding: 0;
  flex-shrink: 0;
  border: 2px solid #d8d2c4;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  position: relative;
  transition: background .15s ease, border-color .15s ease;
}
.ws-checkrow input[type="checkbox"]:hover { border-color: #c8a84b; }
.ws-checkrow input[type="checkbox"]:checked { background: #c8a84b; border-color: #c8a84b; }
.ws-checkrow input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 6px; top: 2px;
  width: 5px; height: 10px;
  border: solid #18120f;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.ws-checkrow input[type="checkbox"]:focus-visible {
  outline: none; box-shadow: 0 0 0 3px rgba(200, 168, 75, .35);
}
.ws-errors { color: #b3261e; font-size: .85rem; margin-top: .5rem; }
.ws-footnote { text-align: center; font-size: .85rem; color: #8a8378; margin-top: 1.3rem; }
.ws-footnote a, .ws a.ws-link { color: #18120f; text-decoration: underline; }

/* ---- buttons ---- */
.ws-btn {
  display: inline-block; text-decoration: none; cursor: pointer;
  font-family: inherit; font-size: 1rem; text-transform: lowercase;
  padding: .85rem 1.8rem; border-radius: 10px; border: none; letter-spacing: .02em;
}
.ws-btn--dark { background: #18120f; color: #f3f0e7; }
.ws-btn--gold { background: #c8a84b; color: #18120f; }
.ws-btn--ghost { background: transparent; color: #4a4e69; border: 1px solid #c9c4d3; }
.ws-btn--ghost:hover { border-color: #4a4e69; }
.ws-btn--block { width: 100%; text-align: center; }

/* button polish: hover lift + small / danger / disabled variants */
.ws-btn { transition: filter .15s ease, transform .15s ease, box-shadow .15s ease; }
.ws-btn:hover { filter: brightness(1.06); transform: translateY(-1px); }
.ws-btn--dark:hover, .ws-btn--gold:hover { box-shadow: 0 7px 18px rgba(24, 18, 15, .16); }
.ws-btn--sm { padding: .5rem 1.05rem; font-size: .9rem; border-radius: 8px; }
.ws-btn--danger { background: transparent; color: #b3473f; border: 1px solid #eccfcc; }
.ws-btn--danger:hover { background: #fbeded; border-color: #e0a9a4; box-shadow: none; }
.ws-btn.is-off { opacity: .45; pointer-events: none; }

/* ---- cart page ---- */
.ws-cartcard { border: 1px solid #e7e1d3; border-radius: 14px; padding: 1rem 1.15rem 1.1rem;
  margin-bottom: 1rem; background: #fff; box-shadow: 0 1px 3px rgba(24, 18, 15, .04);
  transition: box-shadow .15s ease, border-color .15s ease; }
.ws-cartcard:hover { box-shadow: 0 7px 20px rgba(24, 18, 15, .07); border-color: #ddd4c2; }
.ws-cartcard__head { display: flex; justify-content: space-between; align-items: center; gap: .7rem;
  margin-bottom: .55rem; padding-bottom: .55rem; border-bottom: 1px solid #f1ece0; }
.ws-cartcard__prod { display: flex; align-items: center; gap: .7rem; font-weight: 600;
  color: #18120f; text-decoration: none; min-width: 0; }
.ws-cartcard__prod:hover .ws-cartcard__name { text-decoration: underline; }
.ws-cartcard__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ws-cartcard__unit { font-size: .8rem; color: #8a8378; white-space: nowrap; }
.ws-cartlines { width: 100%; font-size: .88rem; border-collapse: collapse; }
.ws-cartlines td { padding: 6px 0; vertical-align: middle; }
.ws-cartlines__ea { color: #a59f95; font-size: .76rem; margin-left: .35rem; white-space: nowrap; }
.ws-cartlines__qty { width: 84px; text-align: right; }
.ws-cartlines__tot { width: 88px; text-align: right; color: #18120f; }
.ws-cartlines__sub td { padding-top: .6rem; text-align: right; color: #8a8378; font-size: .8rem;
  border-top: 1px solid #ece6d8; }
.ws-cartlines__sub td:last-child { color: #18120f; font-weight: 700; font-size: .92rem; }
.ws-qtybox { width: 66px; padding: .45rem .3rem; text-align: center; font-weight: 600; font-size: .95rem;
  color: #18120f; background: #faf8f1; border: 1px solid #e0d9ca; border-radius: 8px; -moz-appearance: textfield; }
.ws-qtybox::-webkit-outer-spin-button, .ws-qtybox::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ws-qtybox:focus { outline: none; border-color: #c8a84b; box-shadow: 0 0 0 2px rgba(200, 168, 75, .25); background: #fff; }
.ws-carttotal { display: flex; justify-content: space-between; align-items: center;
  border-top: 2px solid #ece6d8; padding-top: 1rem; margin-top: .75rem; }
.ws-carttotal__amt { font-size: 1.35rem; font-weight: 800; color: #18120f; }
.ws-cartbar { display: flex; gap: .7rem; margin-top: 1.4rem; flex-wrap: wrap; align-items: center; }
.ws-cartempty { text-align: center; color: #8a8378; padding: 3rem 1.25rem;
  border: 1px dashed #e0d9ca; border-radius: 14px; background: #fffdf8; }

/* ---- shipment tracking timeline ---- */
.ws-track { display: flex; margin: 1.5rem 0 .5rem; }
.ws-track__step { flex: 1; text-align: center; position: relative; }
.ws-track__step::before {
  content: ""; position: absolute; top: 9px; left: -50%; width: 100%; height: 2px;
  background: #ddd6c8; z-index: 0;
}
.ws-track__step:first-child::before { display: none; }
.ws-track__step.is-done::before { background: #c8a84b; }
.ws-track__dot {
  position: relative; z-index: 1; display: inline-block;
  width: 20px; height: 20px; border-radius: 50%; background: #ddd6c8;
}
.ws-track__step.is-done .ws-track__dot { background: #c8a84b; }
.ws-track__step.is-current .ws-track__dot { box-shadow: 0 0 0 4px rgba(200, 168, 75, .3); }
.ws-track__label { display: block; font-size: .72rem; margin-top: .45rem; color: #8a8378; text-transform: lowercase; }
.ws-track__step.is-done .ws-track__label { color: #18120f; }

/* ---- post-add confirmation banner ---- */
.ws-added {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  flex-wrap: wrap;
  background: #eef7ee; border: 1px solid #cfe8cf; border-radius: 12px;
  padding: .9rem 1.1rem; margin-bottom: 1.1rem;
}
.ws-added__msg { font-weight: 600; color: #2e6b34; }
.ws-added__btns { display: flex; gap: .6rem; flex-wrap: wrap; }
.ws-added__btns .ws-btn { padding: .6rem 1.1rem; font-size: .9rem; }

/* ---- product matrix (per-variant order table) ---- */
.ws-prod-head { display: flex; gap: 1rem; align-items: center; margin-bottom: .75rem; }
.ws-prod-img { width: 64px; height: 64px; object-fit: cover; border-radius: 10px; border: 1px solid #e7e1d3; }
.ws-prod-title { font-size: 1.4rem; margin: 0; text-transform: lowercase; }
.ws-prod-sub { color: #6b655c; font-size: .9rem; margin-top: .2rem; }
.ws-prod-links { display: flex; justify-content: space-between; font-size: .85rem; margin-bottom: 1rem; }
.ws-prod-links a { color: #777; text-decoration: none; }
.ws-prod-order { color: #18120f; font-weight: 700; }

.ws-table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.ws-table thead th {
  text-align: left; font-weight: 400; color: #8a8378; font-size: .76rem;
  text-transform: lowercase; letter-spacing: .04em;
  padding: 0 .5rem .6rem; border-bottom: 1px solid #ece6d8;
}
.ws-table td { padding: .6rem .5rem; border-bottom: 1px solid #f1ece0; vertical-align: middle; }
.ws-table .ws-c { text-align: center; }
.ws-table .ws-r { text-align: right; }
.ws-table tfoot td { border-bottom: none; padding-top: .9rem; }

.ws-item { display: flex; align-items: center; gap: .7rem; }
.ws-thumb {
  width: 42px; height: 42px; object-fit: cover; border-radius: 8px;
  border: 1px solid #e7e1d3; background: #f6f3ec; flex-shrink: 0;
}
.ws-item-name { font-weight: 400; }
.ws-stock { color: #8a8378; font-size: .85rem; }
.ws-qty {
  width: 72px; padding: .5rem; text-align: center;
  border: 1px solid #c9d6ea; border-radius: 8px; background: #eef4fc; color: #18120f;
  font-family: inherit; font-size: .95rem;
}
.ws-qty:focus { outline: none; border-color: #c8a84b; box-shadow: 0 0 0 3px rgba(200, 168, 75, .18); }
.ws-sub { color: #18120f; }

/* ---- checkout: radios + card field ---- */
.ws-radio { display: flex; align-items: center; gap: .6rem; padding: .55rem .2rem; font-size: .92rem; cursor: pointer; }
.ws-radio input[type="radio"] {
  -webkit-appearance: none; appearance: none;
  width: 20px; height: 20px; margin: 0; flex-shrink: 0;
  border: 2px solid #d8d2c4; border-radius: 50%; background: #fff;
  cursor: pointer; position: relative; transition: border-color .15s ease;
}
.ws-radio input[type="radio"]:hover { border-color: #c8a84b; }
.ws-radio input[type="radio"]:checked { border-color: #c8a84b; }
.ws-radio input[type="radio"]:checked::after {
  content: ""; position: absolute; left: 4px; top: 4px;
  width: 8px; height: 8px; border-radius: 50%; background: #c8a84b;
}
.ws-radio input[type="radio"]:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(200, 168, 75, .3); }
.ws-card-field { border: 1px solid #d8d2c4; border-radius: 10px; padding: .5rem .7rem; background: #fff; min-height: 48px; }

/* multi-line checkbox list (registration) */
.ws-checkboxes ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .55rem; }
.ws-checkboxes li label { display: flex; align-items: center; gap: .6rem; font-size: .92rem; cursor: pointer; }

/* inline spinner (e.g. estimating shipping) */
.ws-spinner { width: 16px; height: 16px; border: 2px solid #d8d2c4; border-top-color: #c8a84b; border-radius: 50%; display: inline-block; animation: ws-spin .7s linear infinite; }
@keyframes ws-spin { to { transform: rotate(360deg); } }

/* horizontal-scroll wrapper so data tables never break the layout */
.ws-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ================================ mobile-first ============================= */
@media (max-width: 600px) {
  .ws-wrap { padding: 0 .75rem; margin: 1.25rem auto 2.5rem; }
  .ws-panel { padding: 1.25rem 1rem; border-radius: 12px; }
  .ws-row-2 { grid-template-columns: 1fr; gap: 0; }

  .ws-form-title { font-size: 1.45rem; }
  .ws-section-title { font-size: 1.25rem; margin: 2rem 0 1rem; }
  .ws-prod-title { font-size: 1.25rem; }
  .ws-hero { padding: 2.4rem 1.1rem; }
  .ws-hero h1 { font-size: 1.7rem; }

  /* 16px form text stops iOS focus-zoom; roomier tap targets */
  .ws-input, .ws select, .ws textarea, .ws-qty { font-size: 16px; }
  .ws-input { padding: .8rem .85rem; }
  .ws-qty { width: 64px; padding: .65rem .4rem; }

  /* denser tables */
  .ws-table { font-size: .9rem; }
  .ws-table thead th { padding: 0 .35rem .5rem; }
  .ws-table td { padding: .55rem .35rem; }
  .ws-item { gap: .55rem; }
  .ws-thumb { width: 36px; height: 36px; }

  /* one product card per row + stacked prices on phones */
  .ws-prodgrid { grid-template-columns: 1fr; }
  .ws-prices { flex-direction: column; gap: .5rem; }

  /* comfortable buttons */
  .ws-btn { padding: .9rem 1.4rem; }

  /* navbar + footer */
  .wnav__inner { padding: .6rem .85rem; gap: .45rem .9rem; }
  .wnav__brand { font-size: 1.1rem; }
  .wnav__links { gap: .85rem; }
  .wnav__links a { font-size: .9rem; }
  .wfoot__top { flex-direction: column; gap: 1.5rem; padding: 1.75rem 1.1rem; }
}