/* Shopify cart -- only linked when builder/shop.json has "live": true, so
   the site is untouched while the shop is off. Black panel, white type:
   the same identity as the header. */

/* ---- header cart button ---- */
.cart-toggle {
  position: relative; background: none; border: 0; padding: 2px;
  color: var(--header-txt); cursor: pointer; line-height: 0;
  transition: var(--header-trans);
  justify-self: end; grid-row: 1;
}
.cart-toggle:hover { color: var(--header-txt-hover); }
.cart-toggle svg { width: 24px; height: 24px; display: block; }
.cart-count {
  position: absolute; top: -4px; right: -8px;
  min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px;
  background: #fff; color: #000; font: 600 .66rem/17px var(--body);
  text-align: center;
}
@media (min-width: 751px) {
  .site-header .cart-toggle { grid-column: 3; }
}
@media (max-width: 750px) {
  .site-header .bar.has-cart { grid-template-columns: 1fr auto auto; column-gap: 1.1rem; }
  .site-header .bar.has-cart .cart-toggle { grid-column: 2; }
  .site-header .bar.has-cart .nav-toggle { grid-column: 3; }
  .cart-toggle svg { width: 22px; height: 22px; }
}

/* ---- drawer ---- */
.cart-backdrop {
  position: fixed; inset: 0; z-index: 200; background: rgba(0,0,0,.45);
  opacity: 0; pointer-events: none; transition: opacity .25s;
}
.cart-backdrop.open { opacity: 1; pointer-events: auto; }
.cart-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 210;
  width: min(420px, 100vw); display: flex; flex-direction: column;
  background: #000; color: #fff;
  transform: translateX(100%); transition: transform .3s ease;
  font-family: var(--body);
}
.cart-drawer.open { transform: none; }
.cart-drawer.busy { opacity: .7; pointer-events: none; }
html.cart-open, html.cart-open body { overflow: hidden; }
.cart-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.4rem 1.6rem; border-bottom: 1px solid rgba(255,255,255,.3);
}
.cart-head h2 { font-size: 1.6rem; margin: 0; color: #fff; }
.cart-close {
  background: none; border: 0; color: #fff; font-size: 2rem; line-height: 1;
  cursor: pointer; padding: 0 .2rem;
}
.cart-lines { list-style: none; margin: 0; padding: 0 1.6rem; overflow-y: auto; flex: 1; }
.cart-empty { padding: 2rem 0; color: #b8becb; }
.cart-line {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: 1.2rem 0; border-bottom: 1px solid rgba(255,255,255,.18);
}
.cart-title { color: #fff; text-decoration: none; font-size: 1rem; }
.cart-title:hover { color: #b8becb; }
.cart-variant { font-size: .8rem; color: #b8becb; margin-top: .2rem; }
.cart-qty { display: flex; align-items: center; gap: .7rem; margin-top: .6rem; }
.cart-qty button {
  width: 26px; height: 26px; border: 1px solid #fff; background: none;
  color: #fff; cursor: pointer; line-height: 1;
}
.cart-qty button:hover { background: #fff; color: #000; }
.cart-line-price { white-space: nowrap; }
.cart-foot { padding: 1.4rem 1.6rem 1.8rem; border-top: 1px solid rgba(255,255,255,.3); }
.cart-subtotal { font-size: 1.05rem; margin: 0; }
.cart-note { font-size: .78rem; color: #b8becb; margin: .5rem 0 0; }
.cart-drawer .cart-checkout {
  display: block; text-align: center; margin-top: 1.2rem;
  background: #fff; color: #000; border-color: #fff;
}
.cart-drawer .cart-checkout:hover { background: #000; color: #fff; }

/* ---- product page buy box ---- */
.shop-buy [data-shop-add][disabled] { opacity: .45; cursor: default; }
.shop-buy [data-shop-add][disabled]:hover { background: var(--ink); color: var(--paper); }
.shop-buy:not(.shop-ready) [data-shop-add] { visibility: hidden; }
.shop-buy .shop-fallback { display: none; }
.shop-buy.shop-missing .shop-fallback { display: inline-block; }
.shop-buy.shop-missing [data-shop-add],
.shop-buy.shop-missing .shop-secure { display: none; }
.shop-buy [data-shop-status]:empty { display: none; }
.shop-buy .variant-grid + .variant-grid { margin-top: .7rem; }
/* Edition groups (build.py option_groups): heading, its buttons, its note. */
.shop-buy .option-group .variant-grid { margin-top: .6rem; }
.shop-buy .option-group .variant-grid:empty { display: none; }
.shop-buy .option-group .buy-note { margin-top: .8rem; }
.shop-buy:not(.shop-ready) .option-group > .variant-label { display: none; }
.shop-buy [data-shop-price]:empty { display: none; }

.shop-addon { display: flex; align-items: center; gap: .55rem; margin: .9rem 0 0;
  font-size: .95rem; cursor: pointer; }
.shop-addon[hidden] { display: none; }
.shop-addon input { width: 1.05rem; height: 1.05rem; accent-color: #fff; }

/* ---- cards ---- */
.card.is-sold .frame img { opacity: .55; }
.sold-label {
  font-family: var(--body); font-size: .72rem; letter-spacing: .18em;
  text-transform: uppercase;
}

@media (prefers-reduced-motion: reduce) {
  .cart-drawer, .cart-backdrop { transition: none; }
}