/* =====================================================================
   WooCommerce ↔ JOLTKEYS — integrates WC pages with the v3 design.
   Reuses .card / .badge / .price / .btn from styles.css + v3.css.
   ===================================================================== */

.woo { padding: clamp(28px, 5vw, 72px) 0 var(--space-9); min-height: 60vh; }

/* ---- breadcrumb + archive title ---- */
.woocommerce-breadcrumb {
  font-family: var(--font-mono); font-size: var(--fs-small); color: var(--text-muted);
  text-transform: uppercase; letter-spacing: .05em; margin-bottom: var(--space-5);
}
.woocommerce-breadcrumb a { color: var(--text-muted); text-decoration: none; }
.woocommerce-breadcrumb a:hover { color: var(--acid); }
.woocommerce-products-header { margin-bottom: var(--space-5); }
.woocommerce-products-header__title,
.woo .page-title {
  font-family: var(--font-display); font-weight: 700; text-transform: uppercase;
  font-size: var(--fs-h1); line-height: 1; margin: 0;
}

/* ---- result count + ordering toolbar ---- */
.woocommerce-result-count {
  font-family: var(--font-mono); font-size: var(--fs-small); color: var(--text-muted); margin: 0 0 var(--space-4);
}
.woocommerce-ordering { margin: 0 0 var(--space-5); }
.woocommerce-ordering select {
  font-family: var(--font-mono); background: var(--surface-2); color: var(--text);
  border: var(--bd); padding: 10px 14px; cursor: pointer;
}

/* ---- product grid (reuse .card from v3) ---- */
.woocommerce ul.products {
  list-style: none; margin: 0 0 var(--space-7); padding: 0;
  display: grid; gap: 14px;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}
.woocommerce ul.products li.product {
  width: auto !important; margin: 0 !important; float: none !important; padding: 0; clear: none !important;
}
/* WC clearfix pseudo-elements become stray grid items (empty leading cell) — kill them */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce ul.products li.product::before,
.woocommerce ul.products li.product::after { display: none !important; }

/* keep interactive controls above the stretched card link */
.card__media { position: relative; }
.card__link { z-index: 1; }
.card__media .card__bar,
.card__wish { position: relative; z-index: 3; }

/* long imported titles → clamp to two lines */
.card__title {
  display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; min-height: 2.6em;
}

/* WC price markup → JOLTKEYS look */
.card .price {
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
  font-family: var(--font-mono); margin-top: var(--space-2);
}
.card .price del { color: var(--text-dim); text-decoration: line-through; font-size: .85em; opacity: .8; }
.card .price ins { text-decoration: none; }
.card .price ins .amount,
.card .price > .amount { color: var(--acid); font-weight: 700; }

/* loop add-to-cart inside the card bar */
.card__bar a.button,
.card__bar .button.add_to_cart_button {
  display: inline-flex; align-items: center; gap: 6px; width: 100%; justify-content: center;
  font-family: var(--font-display); text-transform: uppercase; letter-spacing: .03em; font-weight: 700;
  background: var(--acid); color: var(--ink); border: var(--bd-strong); padding: 10px 14px; cursor: pointer;
}
.card__bar a.button:hover { background: var(--acid); box-shadow: 0 0 22px -2px rgba(198, 255, 58, .55); }
.card__bar a.added { background: var(--success); }
.card__bar a.added_to_cart { display: none !important; } /* hide the extra "View cart" link inside cards */

/* ---- pagination (shop + blog) ---- */
.woocommerce-pagination { margin-top: var(--space-7); }
.woocommerce-pagination ul { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; border: 0; }
.woocommerce-pagination ul li { margin: 0; border: 0; }
.woocommerce-pagination ul { gap: 10px; }
.woocommerce-pagination a.page-numbers,
.woocommerce-pagination span.page-numbers {
  display: inline-flex; align-items: center; justify-content: center; min-width: 48px; height: 48px; padding: 0 16px;
  border: var(--bd); background: var(--surface-1); color: var(--text-muted);
  font-family: var(--font-mono); font-weight: 700; font-size: .95rem; text-decoration: none;
  transition: border-color .18s var(--ease-out), color .18s var(--ease-out), background .18s var(--ease-out);
}
.woocommerce-pagination span.page-numbers.dots { border-color: transparent; background: transparent; color: var(--text-dim); min-width: 20px; padding: 0 2px; }
.woocommerce-pagination a.next, .woocommerce-pagination a.prev { color: var(--text); }
.woocommerce-pagination span.current { background: var(--acid) !important; color: var(--ink) !important; border-color: var(--acid) !important; }
.woocommerce-pagination a.page-numbers:hover { border-color: var(--acid); color: var(--acid); background: var(--surface-2); }

/* ---- WC notices ---- */
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews {
  border: var(--bd); background: var(--surface-2); color: var(--text);
  padding: 14px 18px; list-style: none; font-family: var(--font-body); margin: 0 0 var(--space-5);
}
.woocommerce-message { border-color: var(--acid); }
.woocommerce-error { border-color: var(--danger); }
.woocommerce-message a.button, .woocommerce-info a.button {
  background: var(--acid); color: var(--ink); border: var(--bd-strong); padding: 6px 12px; margin-left: 10px;
  text-transform: uppercase; font-family: var(--font-display); font-weight: 700;
}

/* ===================================================================
   SINGLE PRODUCT
   =================================================================== */
/* Single product — 2 columns: grid gallery (click to enlarge) + summary */
.woo div.product { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(28px, 3.5vw, 56px); align-items: start; position: relative; }
@media (max-width: 880px) { .woo div.product { grid-template-columns: 1fr; } }
.woo div.product .summary, .woo div.product .entry-summary { float: none !important; width: 100% !important; max-width: none !important; margin: 0 !important; }
/* WC also floats the gallery at 48% — neutralise so our grid column owns the width */
.woo div.product .woocommerce-product-gallery, .woo div.product .images { float: none !important; width: 100% !important; }

/* Sale badge — brutalist lime, on-brand (overrides WC's round bubble) */
.woocommerce span.onsale {
  position: absolute; top: 12px; left: 12px; z-index: 6;
  min-width: 0; min-height: 0; width: auto; height: auto; line-height: 1; margin: 0;
  padding: 7px 12px; border-radius: 0; border: var(--bd-strong);
  background: var(--acid); color: var(--ink); box-shadow: var(--shadow-hard);
  font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; font-size: .8rem;
}

/* grid gallery */
.jk-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.jk-gallery__item { margin: 0; padding: 0; border: var(--bd); background: var(--surface-1); cursor: zoom-in; overflow: hidden; position: relative; aspect-ratio: 1 / 1; }
.jk-gallery__item.is-main { grid-column: 1 / -1; aspect-ratio: 16 / 10; }
.jk-gallery__item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform var(--dur-std) var(--ease-out); }
.jk-gallery__item:hover img { transform: scale(1.05); }
.jk-gallery__item::after { content: "\2922"; position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; display: grid; place-items: center; background: rgba(10,10,15,.72); color: var(--acid); font-size: 15px; opacity: 0; transition: opacity var(--dur-micro); }
.jk-gallery__item:hover::after { opacity: 1; }

/* lightbox */
.jk-lightbox { position: fixed; inset: 0; z-index: 200; display: none; align-items: center; justify-content: center; background: rgba(5,5,8,.93); padding: 40px; }
.jk-lightbox.is-open { display: flex; }
.jk-lightbox img { max-width: 92vw; max-height: 86vh; border: var(--bd); box-shadow: var(--shadow-hard); }
.jk-lightbox__close { position: absolute; top: 20px; right: 26px; width: 48px; height: 48px; border: 0; background: var(--acid); color: var(--ink); font-family: var(--font-display); font-size: 26px; line-height: 1; cursor: pointer; }

.woocommerce-product-gallery { width: 100% !important; float: none !important; margin: 0 !important; border: var(--bd); background: var(--surface-1); position: relative; }
.woocommerce-product-gallery img { display: block; width: 100%; height: auto; }
.woocommerce-product-gallery__trigger { display: none; }
.flex-control-thumbs { display: flex; gap: 8px; list-style: none; padding: 8px; margin: 0; }
.flex-control-thumbs li { width: 64px; cursor: pointer; }

.woo div.product .summary, .woo div.product .entry-summary { margin: 0; }
.pdp-plat { display: inline-flex; margin: 0 0 12px; }
.woo .product_title { font-family: var(--font-display); font-weight: 700; text-transform: uppercase; font-size: var(--fs-h2); line-height: 1.04; margin: 0 0 14px; }
.woo div.product p.price, .woo div.product span.price { font-family: var(--font-mono); font-size: 1.9rem; margin: 0 0 18px; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.woo div.product .price del { color: var(--text-dim); font-size: .6em; }
.woo div.product .price ins { text-decoration: none; }
.woo div.product .price .amount { color: var(--acid); font-weight: 700; }
.woocommerce-product-details__short-description { color: var(--text-muted); line-height: 1.6; margin: 0 0 20px; max-width: 56ch; }

.woo form.cart { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin: 0 0 20px; }
.woo form.cart .quantity input { width: 72px; height: 52px; text-align: center; background: var(--surface-2); color: var(--text); border: var(--bd); font-family: var(--font-mono); }
.woo .single_add_to_cart_button.button {
  flex: 1; min-width: 220px; height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  background: var(--acid); color: var(--ink); border: var(--bd-strong); box-shadow: var(--shadow-hard);
  font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; font-size: 1.05rem;
  cursor: pointer; transition: box-shadow var(--dur-std) var(--ease-out), filter var(--dur-std) var(--ease-out);
}
/* calm "light up" (lime glow) on hover lives in the global .button.alt:hover rule below; press feedback here */
.woo .single_add_to_cart_button.button:active { filter: brightness(.96); }

/* stock — live status indicator (glowing dot + mono label) */
.woo p.stock { font-family: var(--font-mono); font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted); display: inline-flex; align-items: center; gap: 9px; margin: 2px 0 18px; padding: 0; }
.woo p.stock::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 8px var(--acid); flex: none; }
.woo p.stock.out-of-stock { color: #ff6b6b; }
.woo p.stock.out-of-stock::before { background: #ff6b6b; box-shadow: 0 0 8px #ff6b6b; }
@media (prefers-reduced-motion: no-preference) {
  .woo p.stock.in-stock::before { animation: jk-stock-pulse 2.2s ease-in-out infinite; }
}
@keyframes jk-stock-pulse { 0%, 100% { box-shadow: 0 0 5px var(--acid); opacity: 1; } 50% { box-shadow: 0 0 13px var(--acid); opacity: .65; } }

.pdp-trust { list-style: none; margin: 24px 0 0; padding: 20px 0 0; border-top: var(--bd); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 24px; }
@media (max-width: 480px) { .pdp-trust { grid-template-columns: 1fr; } }
.pdp-trust li { display: flex; gap: 10px; align-items: center; }
.pdp-trust .icon { width: 22px; height: 22px; color: var(--acid); flex: none; }
.pdp-trust b { display: block; font-size: .95rem; }
.pdp-trust span { color: var(--text-muted); font-size: .8rem; }

/* tabs — clean underline bar */
.woocommerce-tabs { margin-top: clamp(44px, 5vw, 76px); grid-column: 1 / -1; }
.woocommerce div.product .woocommerce-tabs ul.tabs { list-style: none; display: flex; flex-wrap: wrap; gap: clamp(20px, 3vw, 40px); padding: 0; margin: 0; border-bottom: var(--bd); }
.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after { display: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; border-radius: 0 !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none !important; border: 0 !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  display: inline-block; padding: 0 0 14px; text-decoration: none;
  color: var(--text-muted); font-family: var(--font-display); text-transform: uppercase; font-size: 1rem; letter-spacing: .03em;
  border-bottom: 2px solid transparent; margin-bottom: -1px; transition: color var(--dur-micro), border-color var(--dur-micro);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover { color: var(--text); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--acid); border-bottom-color: var(--acid); }
.woocommerce-tabs .woocommerce-Tabs-panel { padding: clamp(24px, 3vw, 36px) 0 0; }
.woocommerce-tabs .woocommerce-Tabs-panel h2 { font-family: var(--font-display); text-transform: uppercase; margin: 0 0 16px; font-size: var(--fs-h3); color: var(--acid); }
/* drop the panel heading that just repeats the tab label */
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel > h2:first-child { display: none; }
.woocommerce-tabs .woocommerce-Tabs-panel p, .woocommerce-tabs .woocommerce-Tabs-panel li { color: var(--text-muted); line-height: 1.8; max-width: 80ch; }
.woocommerce-Tabs-panel p, .woocommerce-Tabs-panel li { color: var(--text-muted); line-height: 1.7; }
.shop_attributes { width: 100%; border-collapse: collapse; }
.shop_attributes th, .shop_attributes td { border: var(--bd); padding: 10px 14px; text-align: left; }
.shop_attributes th { font-family: var(--font-mono); color: var(--text); width: 30%; }

/* related / upsells reuse the .card grid above */
.related.products, .upsells.products { margin-top: clamp(40px, 6vw, 80px); grid-column: 1 / -1; }
.related.products > h2, .upsells.products > h2 { font-family: var(--font-display); text-transform: uppercase; font-size: var(--fs-h2); margin: 0 0 24px; }
.related.products ul.products, .upsells.products ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1024px) { .related.products ul.products, .upsells.products ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .related.products ul.products, .upsells.products ul.products { grid-template-columns: 1fr; } }

/* Product meta (categories / tags) — tidy, on their own lines */
.product_meta { margin-top: var(--space-5); padding-top: var(--space-4); border-top: var(--bd); font-family: var(--font-mono); font-size: .82rem; color: var(--text-muted); }
.product_meta > span { display: block; margin-bottom: 6px; }
.product_meta a { color: var(--text-muted); text-decoration: none; }
.product_meta a:hover { color: var(--acid); }

/* ===================================================================
   CART — items left, sticky totals right
   =================================================================== */
.woocommerce-cart .woocommerce { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 380px); gap: 24px 44px; align-items: start; }
.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
.woocommerce-cart form.woocommerce-cart-form { grid-column: 1; }
.woocommerce-cart .cart-collaterals { grid-column: 2; width: 100%; max-width: none; margin: 0; float: none; position: sticky; top: 100px; }
.woocommerce-cart .cart-collaterals .cross-sells { display: none; }
@media (max-width: 900px) { .woocommerce-cart .woocommerce { grid-template-columns: 1fr; } .woocommerce-cart .cart-collaterals { position: static; } }

.woocommerce-cart-form table.cart { width: 100%; border-collapse: collapse; border: var(--bd); }
.woocommerce-cart-form table.cart thead th { font-family: var(--font-display); text-transform: uppercase; letter-spacing: .03em; text-align: left; padding: 14px 16px; border-bottom: var(--bd); font-size: .8rem; color: var(--text-muted); background: var(--surface-1); }
.woocommerce-cart-form table.cart td { padding: 16px; border-bottom: var(--bd); vertical-align: middle; }
.woocommerce-cart-form table.cart tr:last-child td { border-bottom: 0; }
.woocommerce-cart-form .product-thumbnail img { width: 54px; height: auto; border: var(--bd); display: block; }
.woocommerce-cart-form .product-name a { color: var(--text); text-decoration: none; font-weight: 600; }
.woocommerce-cart-form .product-name a:hover { color: var(--acid); }
.woocommerce-cart-form td.product-price, .woocommerce-cart-form td.product-subtotal { font-family: var(--font-mono); }
.woocommerce-cart-form td.product-subtotal { color: var(--acid); font-weight: 700; }
.woocommerce .cart .quantity input { width: 60px; height: 44px; background: var(--surface-2); color: var(--text); border: var(--bd); text-align: center; font-family: var(--font-mono); }
.woocommerce-cart-form td.product-remove a.remove { color: var(--text-muted) !important; font-size: 20px; font-weight: 400; }
.woocommerce-cart-form td.product-remove a.remove:hover { color: var(--danger) !important; background: transparent !important; }
.woocommerce-cart-form .actions { padding: 16px; display: flex; gap: 12px; flex-wrap: wrap; align-items: center; justify-content: space-between; border-top: var(--bd); }
.woocommerce-cart-form .actions .coupon { display: flex; gap: 10px; align-items: center; }
.woocommerce-cart-form .actions .coupon #coupon_code { width: 160px; height: 46px; background: var(--surface-2); color: var(--text); border: var(--bd); padding: 0 12px; }

.cart_totals { border: var(--bd); padding: 26px; background: var(--surface-1); }
.cart_totals h2 { font-family: var(--font-display); text-transform: uppercase; margin: 0 0 18px; font-size: 1.35rem; letter-spacing: .02em; }
.cart_totals table { width: 100%; border-collapse: collapse; }
.cart_totals th { padding: 12px 0; border-bottom: var(--bd); text-align: left; font-weight: 600; }
.cart_totals td { padding: 12px 0; border-bottom: var(--bd); text-align: right; font-family: var(--font-mono); }
.cart_totals tr.order-total th, .cart_totals tr.order-total td { border-bottom: 0; }
.cart_totals tr.order-total .amount { color: var(--acid); font-size: 1.25rem; font-weight: 700; }
.wc-proceed-to-checkout { padding: 0; }
.wc-proceed-to-checkout a.checkout-button {
  display: block; text-align: center; white-space: nowrap; background: var(--acid); color: var(--ink); border: var(--bd-strong); box-shadow: var(--shadow-hard);
  font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: .03em; padding: 16px; margin-top: 18px; font-size: 1rem;
}
.woocommerce button.button, .woocommerce a.button, .woocommerce input.button {
  font-family: var(--font-display); text-transform: uppercase; font-weight: 700;
  background: var(--surface-2); color: var(--text); border: var(--bd); padding: 12px 18px; cursor: pointer;
}
.woocommerce .button.alt, .woocommerce button.button.alt { background: var(--acid); color: var(--ink); border: var(--bd-strong); }

/* ===================================================================
   CHECKOUT — details left (stacked), order review right (sticky)
   =================================================================== */
.woocommerce-checkout form.checkout { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 0 44px; align-items: start; }
.woocommerce-checkout form.checkout > #customer_details { grid-column: 1; grid-row: 1 / 3; }
.woocommerce-checkout form.checkout > #order_review_heading { grid-column: 2; grid-row: 1; align-self: start; margin: 0 0 16px; }
.woocommerce-checkout form.checkout > #order_review { grid-column: 2; grid-row: 2; align-self: start; position: sticky; top: 100px; }
@media (max-width: 900px) {
  .woocommerce-checkout form.checkout { grid-template-columns: 1fr; }
  .woocommerce-checkout form.checkout > #customer_details,
  .woocommerce-checkout form.checkout > #order_review_heading,
  .woocommerce-checkout form.checkout > #order_review { grid-column: 1; grid-row: auto; position: static; margin-top: 24px; }
}
/* stack billing + additional in the left column, full width */
.woocommerce-checkout #customer_details .col2-set { display: block; width: 100%; }
.woocommerce-checkout #customer_details .col-1, .woocommerce-checkout #customer_details .col-2 { width: 100%; max-width: none; float: none; }
.woocommerce-checkout #customer_details .col-2 { margin-top: 28px; }
/* first/last name side by side, the rest full width */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row-wide,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .notes { grid-column: 1 / -1; }
.woocommerce-checkout h3 { font-family: var(--font-display); text-transform: uppercase; margin: 0 0 16px; }
.woocommerce-checkout .form-row { margin: 0 0 16px; }
.woocommerce-checkout .form-row label { display: block; font-size: .85rem; color: var(--text-muted); margin-bottom: 6px; }
.woocommerce-checkout .input-text, .woocommerce-checkout textarea, .woocommerce-checkout select,
.woocommerce form .form-row input.input-text, .select2-container--default .select2-selection--single {
  width: 100%; background: var(--surface-2); color: var(--text); border: var(--bd); padding: 12px 14px; font-family: var(--font-body); min-height: 48px;
}
.woocommerce-checkout #order_review { border: var(--bd); background: var(--surface-1); padding: 24px; }
.woocommerce-checkout #order_review .shop_table { border: 0; margin: 0; }
.woocommerce-checkout #order_review .shop_table th, .woocommerce-checkout #order_review .shop_table td { padding: 10px 0; border-bottom: var(--bd); }
.woocommerce-checkout #order_review .cart_item td, .woocommerce-checkout #order_review .order-total td { font-family: var(--font-mono); text-align: right; }
.woocommerce-checkout #order_review .order-total .amount { color: var(--acid); font-weight: 700; font-size: 1.2rem; }
.woocommerce-checkout #payment { background: transparent; border: 0; border-top: var(--bd); padding: 18px 0 0; margin-top: 10px; }
.woocommerce-checkout #payment ul.payment_methods { list-style: none; margin: 0; padding: 0 0 16px; }
.woocommerce-checkout #payment div.payment_box { background: var(--surface-2); color: var(--text-muted); border: var(--bd); padding: 12px 14px; font-size: .85rem; }
.woocommerce-checkout #place_order {
  width: 100%; background: var(--acid); color: var(--ink); border: var(--bd-strong); box-shadow: var(--shadow-hard);
  font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: .03em; padding: 16px; font-size: 1.05rem; cursor: pointer; white-space: nowrap;
}
.woocommerce table.shop_table { width: 100%; border: var(--bd); border-collapse: collapse; }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { padding: 12px; border-bottom: var(--bd); text-align: left; }
.woocommerce table.shop_table tfoot th, .woocommerce table.shop_table tfoot td { font-family: var(--font-mono); }

/* ===================================================================
   MY ACCOUNT
   =================================================================== */
/* logged-in dashboard: sidebar nav + content */
.woocommerce-account.logged-in .woocommerce { display: grid; grid-template-columns: 240px 1fr; gap: 36px; align-items: start; }
@media (max-width: 720px) { .woocommerce-account.logged-in .woocommerce { grid-template-columns: 1fr; } }
/* logged-out login/register screen: centered, contained */
.woocommerce-account:not(.logged-in) .woocommerce { max-width: 920px; margin-inline: auto; }
.woocommerce-account:not(.logged-in) .woocommerce > h2:first-child { text-align: center; }
.woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; margin: 0; border: var(--bd); }
.woocommerce-MyAccount-navigation li a { display: block; padding: 13px 16px; border-bottom: var(--bd); color: var(--text); text-decoration: none; font-family: var(--font-display); text-transform: uppercase; font-size: .9rem; transition: background .15s, color .15s; }
.woocommerce-MyAccount-navigation li:last-child a { border-bottom: 0; }
.woocommerce-MyAccount-navigation li a:hover { color: var(--acid); }
.woocommerce-MyAccount-navigation li.is-active a { background: var(--acid); color: var(--ink); }
.woocommerce-MyAccount-content { min-width: 0; }

/* login / register screen: centered auth cards */
.woocommerce-account #customer_login { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; gap: 28px; }
.woocommerce-account #customer_login > .u-column1, .woocommerce-account #customer_login > .u-column2,
.woocommerce-account #customer_login > .col-1, .woocommerce-account #customer_login > .col-2 { flex: 1 1 380px; max-width: 440px; }
.woocommerce-account #customer_login h2 { font-family: var(--font-display); text-transform: uppercase; margin: 0 0 16px; font-size: 1.5rem; }
.woocommerce-form-login, .woocommerce-form-register { border: var(--bd); padding: 28px; background: var(--surface-1); max-width: none; width: 100%; }
.woocommerce-account .woocommerce-form-row label, .woocommerce-account form .form-row label { display: block; font-size: .85rem; color: var(--text-muted); margin-bottom: 6px; }
.woocommerce-account input.input-text,
.woocommerce-account input[type="text"], .woocommerce-account input[type="email"], .woocommerce-account input[type="password"] {
  width: 100%; background: var(--surface-2); color: var(--text); border: var(--bd); padding: 12px 14px; min-height: 48px;
}
.woocommerce-form-login button[type="submit"], .woocommerce-form-register button[type="submit"],
.woocommerce-ResetPassword button[type="submit"], .woocommerce-EditAccountForm button[type="submit"], .woocommerce-address-fields button[type="submit"] {
  background: var(--acid) !important; color: var(--ink) !important; border: var(--bd-strong) !important; box-shadow: var(--shadow-hard);
  font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: .03em; padding: 14px 26px !important; cursor: pointer;
}

/* ===================================================================
   SHOP FILTER BAR
   =================================================================== */
.shopfilter { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; justify-content: space-between; margin: 0 0 var(--space-5); padding: 0 0 var(--space-4); border-bottom: 1px solid var(--border); }
.shopfilter__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.shopfilter__chip { padding: 8px 16px; border: var(--bd); color: var(--text); text-decoration: none; font-family: var(--font-display); text-transform: uppercase; font-size: .85rem; background: var(--surface-1); transition: color var(--dur-micro), border-color var(--dur-micro); }
.shopfilter__chip:hover { border-color: var(--acid); color: var(--acid); }
.shopfilter__chip.is-active { background: var(--acid); color: var(--ink); border-color: var(--acid); }
.shopfilter__genre select { font-family: var(--font-mono); background: var(--surface-2); color: var(--text); border: var(--bd); padding: 10px 14px; cursor: pointer; }

/* WooCommerce core CSS resets img height on WC pages — keep the brand lockups correctly sized */
.logo__lockup { height: 36px !important; width: auto !important; }
.footer__lockup { height: 48px !important; width: auto !important; }
.preloader__lockup { height: 60px !important; width: auto !important; }
@media (max-width: 640px) { .logo__lockup { height: 28px !important; } }

/* Force brand acid-lime on WC primary ("alt") buttons over WC core's default colour (no purple). */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #place_order,
.wc-proceed-to-checkout a.checkout-button {
  background: var(--acid) !important;
  color: var(--ink) !important;
  border: var(--bd-strong) !important;
  box-shadow: var(--shadow-hard);
  font-family: var(--font-display); text-transform: uppercase; font-weight: 700; letter-spacing: .03em;
  transition: box-shadow var(--dur-std) var(--ease-out);
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #place_order:hover,
.wc-proceed-to-checkout a.checkout-button:hover { background: var(--acid) !important; box-shadow: var(--shadow-hard), 0 0 32px 0 rgba(198, 255, 58, .65) !important; }

/* ===================================================================
   UNIFIED BUTTONS — one interaction site-wide, never jumps.
   Primary = lime + hard shadow at rest, lime neon glow on hover.
   Ghost   = outline that fills lime on hover. No translate, ever.
   =================================================================== */
.btn,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit {
  transition: box-shadow .22s var(--ease-out), filter .22s var(--ease-out), background .2s, color .2s, border-color .2s !important;
}
/* kill every translate-on-hover jump on buttons */
.btn:hover, .btn--primary:hover, .btn--ghost:hover, .cta-band .btn--primary:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover { transform: none !important; }
.btn:active, .btn--primary:active, .btn--ghost:active, .cta-band .btn--primary:active,
.woocommerce a.button:active, .woocommerce button.button:active, .woocommerce input.button:active { transform: none !important; filter: brightness(.94); }

/* primary lime buttons */
.btn--primary { background: var(--acid); color: var(--ink); border: var(--bd-strong); box-shadow: var(--shadow-hard); }
.btn--primary:hover { background: var(--acid); color: var(--ink); box-shadow: var(--shadow-hard), 0 0 32px 0 rgba(198, 255, 58, .6); }

/* ghost buttons */
.btn--ghost { box-shadow: var(--shadow-hard); }
.btn--ghost:hover { background: var(--acid); color: var(--ink); border-color: #000; box-shadow: var(--shadow-hard), 0 0 28px 0 rgba(198, 255, 58, .5); }

/* cta-band primary (ink button on a dark band) — keep dark, add a lime halo */
.cta-band .btn--primary { background: var(--ink); color: var(--acid); border-color: var(--ink); box-shadow: var(--shadow-hard); }
.cta-band .btn--primary:hover { box-shadow: var(--shadow-hard), 0 0 30px 0 rgba(198, 255, 58, .4); }

/* secondary WC buttons (update basket / apply coupon): subtle lime glow, no jump */
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover { border-color: var(--acid); color: var(--acid); box-shadow: 0 0 22px -4px rgba(198, 255, 58, .4); }

/* Cart / checkout / account render through index.php's .prose wrapper (max-width 72ch).
   Free them so our full-width 2-column layouts get the whole container. */
.woocommerce-cart .prose, .woocommerce-checkout .prose, .woocommerce-account .prose { max-width: none; }
.woocommerce-cart .prose > * + *, .woocommerce-checkout .prose > * + *, .woocommerce-account .prose > * + * { margin-top: 0; }

/* WC default floats .cart_totals at 48% — make it fill our sticky sidebar column. */
.woocommerce-cart .cart-collaterals .cart_totals { width: 100% !important; float: none !important; }

/* ===================================================================
   WC pages — tablet / mobile refinements
   =================================================================== */
@media (max-width: 600px) {
  /* cart: stack the table rows into readable cards */
  .woocommerce-cart-form table.cart thead { display: none; }
  .woocommerce-cart-form table.cart tr { display: block; position: relative; border-bottom: var(--bd); padding: 14px 0; }
  .woocommerce-cart-form table.cart tr:last-child td { border: 0; }
  .woocommerce-cart-form table.cart td { display: block; border: 0; padding: 4px 14px; text-align: left; }
  .woocommerce-cart-form td.product-remove { position: absolute; top: 12px; right: 10px; padding: 0; }
  .woocommerce-cart-form td.product-thumbnail { display: inline-block; vertical-align: middle; padding-right: 0; }
  .woocommerce-cart-form td.product-name { display: inline-block; vertical-align: middle; }
  .woocommerce-cart-form td.product-price::before { content: "Price "; color: var(--text-muted); }
  .woocommerce-cart-form td.product-subtotal::before { content: "Subtotal "; color: var(--text-muted); }
  .woocommerce-cart-form .actions { flex-direction: column; align-items: stretch; }
  .woocommerce-cart-form .actions .coupon { width: 100%; }
  .woocommerce-cart-form .actions .coupon #coupon_code { flex: 1; width: auto; }
}
@media (max-width: 480px) {
  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper { grid-template-columns: 1fr; }
}

/* ===================================================================
   ACCOUNT DASHBOARD — robust 2-col + kill the .prose list bleed
   (index.php wraps WC pages in .prose, whose ul/li::before styled the nav)
   =================================================================== */
.woocommerce-account .prose ul { display: block; gap: 0; margin: 0; }
.woocommerce-account .prose li { padding-left: 0; }
.woocommerce-account .prose li::before { content: none; display: none; }
.woocommerce-account.logged-in .woocommerce { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 40px; align-items: start; }
.woocommerce-account.logged-in .woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
.woocommerce-account.logged-in .woocommerce-MyAccount-navigation { grid-column: 1; }
.woocommerce-account.logged-in .woocommerce-MyAccount-content { grid-column: 2; min-width: 0; }
@media (max-width: 720px) {
  .woocommerce-account.logged-in .woocommerce { grid-template-columns: 1fr; }
  .woocommerce-account.logged-in .woocommerce-MyAccount-navigation,
  .woocommerce-account.logged-in .woocommerce-MyAccount-content { grid-column: 1; }
}
.woocommerce-MyAccount-content h2, .woocommerce-MyAccount-content h3 { font-family: var(--font-display); text-transform: uppercase; margin: 0 0 14px; }
.woocommerce-MyAccount-content p { color: var(--text-muted); }
.woocommerce-MyAccount-content a { color: var(--acid); }
.woocommerce-MyAccount-content .woocommerce-Button, .woocommerce-MyAccount-content .button { display: inline-flex; }

/* ===================================================================
   CART — tighten the remove/thumbnail columns so rows read cleanly
   =================================================================== */
.woocommerce-cart-form td.product-remove { width: 42px; text-align: center; padding-left: 8px; padding-right: 8px; }
.woocommerce-cart-form td.product-thumbnail { width: 76px; }
.woocommerce-cart-form .product-thumbnail img { width: 58px; height: 58px; object-fit: cover; border: var(--bd); display: block; background: var(--surface-2); }
.woocommerce-cart-form td.product-name { padding-left: 4px; }

/* Logo PNGs ship with a solid black backplate — screen-blend it out on the dark UI. */
.logo__lockup, .footer__lockup, .preloader__lockup { mix-blend-mode: screen; }