/* SBC storefront UI — structural CSS with token fallbacks.
   The finish (colour, type) comes from the child theme's .sbc-* classes;
   these rules only guarantee layout if the theme is ever swapped. */

.sbc-ladder{
  border:1px solid var(--sbc-line,#d9d5c9);
  font-family:var(--sbc-font-mono,ui-monospace,monospace);
  font-size:.78rem;
  margin:.9rem 0 .4rem;
}
.sbc-ladder__row{
  display:flex;justify-content:space-between;gap:1em;
  padding:9px 13px;border-bottom:1px solid var(--sbc-line,#d9d5c9);
}
.sbc-ladder__row:last-child{border-bottom:0}
.sbc-ladder__row>span:first-child{
  color:var(--sbc-stone,#86847a);letter-spacing:.06em;text-transform:uppercase;
}
.sbc-ladder__row>span:last-child{color:var(--sbc-ink,#262523)}
.sbc-ladder__row--active{background:var(--sbc-paper-2,#ece9df)}
.sbc-ladder__row--active>span:last-child{color:var(--sbc-olive-ink,#3f4838)}
.sbc-ladder__note{
  font-size:.72rem;color:var(--sbc-stone,#86847a);margin:.3rem 0 1rem;
}

.sbc-packline{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:.4em 1.2em;
  margin-top:.7rem;padding-top:.7rem;border-top:1px solid var(--sbc-line,#d9d5c9);
  font-family:var(--sbc-font-mono,ui-monospace,monospace);font-size:.82rem;
}
.sbc-packline__hint{color:var(--sbc-stone,#86847a)}
.sbc-packline__total{color:var(--sbc-ink,#262523);font-weight:500}
.sbc-packline__total:empty{display:none}

/* diameter as segmented buttons */
.sbc-seg{display:flex;border:1px solid var(--sbc-line,#d9d5c9);max-width:22rem}
.sbc-seg button{
  flex:1;background:transparent;border:0;
  border-right:1px solid var(--sbc-line,#d9d5c9);
  padding:11px 6px;cursor:pointer;
  font-family:var(--sbc-font-mono,ui-monospace,monospace);font-size:.82rem;
  color:var(--sbc-ink-soft,#4c4a44);
}
.sbc-seg button:last-child{border-right:0}
.sbc-seg button[aria-pressed="true"]{
  background:var(--sbc-ink,#262523);color:var(--sbc-paper,#f4f2ec);
}

/* sticky add-to-cart bar (small screens) */
.sbc-sticky{
  position:fixed;left:0;right:0;bottom:0;z-index:120;
  display:none;align-items:center;gap:12px;
  padding:10px 14px;
  background:var(--sbc-paper,#f4f2ec);
  border-top:1px solid var(--sbc-line,#d9d5c9);
  box-shadow:0 -6px 20px rgba(0,0,0,.06);
}
.sbc-sticky[hidden]{display:none}
.sbc-sticky__name{
  font-family:var(--sbc-font-display,"Arial Narrow",sans-serif);
  text-transform:uppercase;letter-spacing:.03em;font-size:.92rem;
  color:var(--sbc-ink,#262523);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0;
}
.sbc-sticky__total{font-size:.82rem;color:var(--sbc-ink,#262523);white-space:nowrap}
.sbc-sticky__btn{
  border:1px solid var(--sbc-olive,#586451);background:var(--sbc-olive,#586451);color:#f4f2ec;
  border-radius:0;padding:12px 20px;cursor:pointer;white-space:nowrap;
  font-family:var(--sbc-font-mono,ui-monospace,monospace);
  font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
}
@media (max-width:768px){
  .sbc-sticky:not([hidden]){display:flex}
}

/* family navigation above the shop grid */
.sbc-familynav{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--sbc-line,#d9d5c9);border:1px solid var(--sbc-line,#d9d5c9);
  margin:0 0 2rem;
}
.sbc-family{
  background:var(--sbc-paper,#f4f2ec);text-decoration:none;display:block;
}
.sbc-family:hover{background:var(--sbc-paper-2,#ece9df)}
.sbc-family__media{
  display:block;aspect-ratio:1/1;border-bottom:1px solid var(--sbc-line,#d9d5c9);background:#fff;
}
.sbc-family__media img{width:100%;height:100%;object-fit:contain;display:block}
.sbc-family__name{
  display:block;padding:13px 15px;
  font-family:var(--sbc-font-display,"Arial Narrow",sans-serif);
  text-transform:uppercase;letter-spacing:.04em;font-size:1rem;
  color:var(--sbc-ink,#262523);
}
@media (max-width:720px){.sbc-familynav{grid-template-columns:1fr 1fr}}
@media (max-width:430px){.sbc-familynav{grid-template-columns:1fr}}

/* cross-sell */
.sbc-crosssell{margin:2.5rem 0}
.sbc-crosssell>h2{
  font-family:var(--sbc-font-display,"Arial Narrow",sans-serif);
  text-transform:uppercase;letter-spacing:.03em;color:var(--sbc-ink,#262523);
  font-size:clamp(1.4rem,3vw,2rem);margin:0 0 1.2rem;
}
.sbc-crosssell__grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:24px;
}
.sbc-crosssell .sbc-card{display:flex;flex-direction:column;gap:9px;text-decoration:none}
.sbc-crosssell .sbc-card__media{
  aspect-ratio:1/1;border:1px solid var(--sbc-line,#d9d5c9);background:#fff;display:block;
}
.sbc-crosssell .sbc-card__media img{width:100%;height:100%;object-fit:contain}
.sbc-crosssell .sbc-card__cat{
  font-family:var(--sbc-font-mono,ui-monospace,monospace);font-size:.62rem;
  letter-spacing:.13em;text-transform:uppercase;color:var(--sbc-stone,#86847a);
}
.sbc-crosssell .sbc-card__title{
  font-family:var(--sbc-font-display,"Arial Narrow",sans-serif);
  text-transform:uppercase;letter-spacing:.04em;color:var(--sbc-ink,#262523);font-size:1rem;
}
.sbc-crosssell .sbc-card__price{
  font-family:var(--sbc-font-mono,ui-monospace,monospace);font-size:.82rem;color:var(--sbc-ink,#262523);
}
@media (max-width:900px){.sbc-crosssell__grid{grid-template-columns:1fr 1fr}}
@media (max-width:430px){.sbc-crosssell__grid{grid-template-columns:1fr}}