/**
 * Storefront skin — brand tokens for the purchase funnel.
 *
 * Companion to account-skin.css: retints the cart and checkout pages
 * in the site's established palette and type (dark teal / brick red /
 * warm off-white / beige, Sentient headings over Satoshi) without
 * touching layout mechanics. Colors are consumed from the RGB
 * triplets typography.css defines on :root, so this file adds no
 * parallel palette.
 *
 * Scoped under body.lc-shop-skin, added by inc/woocommerce.php on
 * cart and checkout (which includes the order-received page, so the
 * shared order-summary components stay consistent there too).
 *
 * Specificity notes: woocommerce.css scopes most rules with
 * body.woocommerce-cart / body.woocommerce-checkout, and #payment /
 * #place_order carry IDs — selectors here chain the skin class onto
 * those same anchors to stay one class ahead, and repeat !important
 * only where the base rule forces it.
 *
 * Remove the preview: delete this file + the shop-skin block in
 * inc/woocommerce.php.
 */

body.lc-shop-skin {
  --lcs-ground: rgb(var(--textLight, 255, 250, 241));       /* #fffaf1 */
  --lcs-ink: rgb(var(--textDark, 78, 76, 74));              /* #4e4c4a */
  --lcs-teal: rgb(var(--dark-teal, 32, 59, 68));            /* #203b44 */
  --lcs-red: rgb(var(--red, 149, 49, 18));                  /* #953112 */
  --lcs-orange: rgb(var(--orange, 194, 110, 53));           /* #c26e35 */
  --lcs-beige: rgb(var(--beige, 218, 199, 171));            /* #dac7ab */
  --lcs-sage: rgb(var(--textBeige, 213, 219, 201));         /* #d5dbc9 */

  --lcs-surface: color-mix(in srgb, var(--lcs-beige) 32%, #fff);
  --lcs-divider: color-mix(in srgb, var(--lcs-ink) 16%, transparent);
  --lcs-muted: color-mix(in srgb, var(--lcs-ink) 60%, transparent);

  --lcs-font-heading: "Sentient-Variable", Georgia, serif;
  --lcs-font-body: "Satoshi-Variable", "Helvetica Neue", Helvetica, Arial, sans-serif;

  --lcs-radius-md: 12px;
  --lcs-radius-lg: 20px;

  --lcs-shadow-sm: 0 1px 2px color-mix(in srgb, var(--lcs-teal) 12%, transparent);
  --lcs-shadow-md: 0 3px 10px color-mix(in srgb, var(--lcs-teal) 14%, transparent);

  background: var(--lcs-ground);
  color: var(--lcs-ink);
}

body.lc-shop-skin ::selection {
  background: color-mix(in srgb, var(--lcs-red) 25%, transparent);
}
body.lc-shop-skin :focus-visible {
  outline: 2px solid var(--lcs-red);
  outline-offset: 2px;
}

/* ── Shared: card shell (billing / order summary / payment) ─────────── */

.lc-shop-skin .lc-co-card {
  border: 1px solid color-mix(in srgb, var(--lcs-beige) 55%, transparent);
  border-radius: var(--lcs-radius-lg);
  box-shadow: var(--lcs-shadow-sm);
}
.lc-shop-skin .lc-co-card__header {
  border-bottom-color: color-mix(in srgb, var(--lcs-beige) 45%, transparent);
}
.lc-shop-skin .lc-co-card__header h3 {
  font-family: var(--lcs-font-heading);
  font-weight: 600;
  color: var(--lcs-teal);
}
/* The summary + payment cards are merged into one stack inside
   #order_review (base rules zero their radii with the ID). Keep the
   seam but round the stack's outer corners to match the new radius. */
body.lc-shop-skin #order_review .lc-co-card--summary {
  border-radius: var(--lcs-radius-lg) var(--lcs-radius-lg) 0 0;
}
body.lc-shop-skin #order_review .lc-co-card--payment {
  border-radius: 0 0 var(--lcs-radius-lg) var(--lcs-radius-lg);
}

/* ── Shared: back-to-shop link ──────────────────────────────────────── */

.lc-shop-skin .lacanche-back-to-shop {
  font-family: var(--lcs-font-body);
  font-weight: 500;
  color: var(--lcs-red);
  text-decoration: none;
}
.lc-shop-skin .lacanche-back-to-shop:hover {
  color: color-mix(in srgb, var(--lcs-red) 82%, #000);
}

/* ════════════════════════════════════════════════════════════════════
   Cart
   ════════════════════════════════════════════════════════════════════ */

body.lc-shop-skin.woocommerce-cart .shop_table.cart {
  border-color: color-mix(in srgb, var(--lcs-beige) 55%, transparent);
  border-radius: var(--lcs-radius-lg);
  box-shadow: var(--lcs-shadow-sm);
}
/* Solid teal 'Calibri' header strip → quiet muted header like the
   account orders list. */
body.lc-shop-skin.woocommerce-cart .shop_table.cart thead tr {
  background: transparent;
}
body.lc-shop-skin.woocommerce-cart .shop_table.cart thead th {
  font-family: var(--lcs-font-body);
  font-weight: 500;
  color: var(--lcs-muted);
  border-bottom: 1px solid var(--lcs-divider);
}
body.lc-shop-skin.woocommerce-cart .shop_table.cart td {
  border-color: color-mix(in srgb, var(--lcs-ink) 8%, transparent);
}
body.lc-shop-skin.woocommerce-cart .shop_table.cart .product-name,
body.lc-shop-skin.woocommerce-cart .shop_table.cart .product-name a {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
  text-decoration: none;
}
body.lc-shop-skin.woocommerce-cart .shop_table.cart .product-price,
body.lc-shop-skin.woocommerce-cart .shop_table.cart .product-subtotal {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
}
/* WC core pins a.remove colors with !important (red at rest, white on
   hover) — repeat it so the glyph matches the skin: muted at rest,
   white on a solid red fill on hover. */
body.lc-shop-skin.woocommerce-cart .shop_table.cart a.remove {
  border-color: var(--lcs-divider);
  color: var(--lcs-muted) !important;
  background: transparent;
  text-decoration: none;
}
body.lc-shop-skin.woocommerce-cart .shop_table.cart a.remove:hover {
  border-color: var(--lcs-red);
  background: var(--lcs-red);
  color: #fff !important;
}
body.lc-shop-skin.woocommerce-cart .shop_table.cart .product-quantity input.qty {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
  border-color: var(--lcs-divider);
}
.lc-shop-skin .lacanche-qty-btn {
  color: var(--lcs-teal);
}

/* Free shipping progress bar */
body.lc-shop-skin.woocommerce-cart .lacanche-free-ship {
  border-color: color-mix(in srgb, var(--lcs-beige) 55%, transparent);
  border-radius: var(--lcs-radius-lg);
  box-shadow: var(--lcs-shadow-sm);
}
body.lc-shop-skin.woocommerce-cart .lacanche-free-ship__msg {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
body.lc-shop-skin.woocommerce-cart .lacanche-free-ship__msg strong,
body.lc-shop-skin.woocommerce-cart .lacanche-free-ship__msg .woocommerce-Price-amount.amount {
  color: var(--lcs-teal);
}
body.lc-shop-skin.woocommerce-cart .lacanche-free-ship__icon {
  color: var(--lcs-red);
}
body.lc-shop-skin.woocommerce-cart .lacanche-free-ship__track {
  background: color-mix(in srgb, var(--lcs-beige) 55%, transparent);
}
body.lc-shop-skin.woocommerce-cart .lacanche-free-ship__fill {
  background: var(--lcs-red);
}
body.lc-shop-skin.woocommerce-cart .lacanche-free-ship--unlocked .lacanche-free-ship__msg {
  color: var(--lcs-teal);
}
body.lc-shop-skin.woocommerce-cart .lacanche-free-ship--unlocked .lacanche-free-ship__fill {
  background: green;
}

/* Cart totals box */
body.lc-shop-skin.woocommerce-cart .cart_totals {
  border-color: color-mix(in srgb, var(--lcs-beige) 55%, transparent);
  border-radius: var(--lcs-radius-lg);
  box-shadow: var(--lcs-shadow-sm);
}
body.lc-shop-skin.woocommerce-cart .cart_totals h2 {
  font-family: var(--lcs-font-heading);
  font-weight: 600;
  color: var(--lcs-teal);
}
body.lc-shop-skin.woocommerce-cart .cart_totals th {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
body.lc-shop-skin.woocommerce-cart .cart_totals td {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
}
body.lc-shop-skin.woocommerce-cart .cart_totals .order-total th,
body.lc-shop-skin.woocommerce-cart .cart_totals .order-total td {
  font-family: var(--lcs-font-heading);
  color: var(--lcs-teal);
}

/* Shipping methods list — typography.css's `.public li` gives these
   Satoshi at 1.125rem with 1.5rem bottom margins; pull them back into
   the totals box's scale. */
.lc-shop-skin ul.woocommerce-shipping-methods {
  margin: 0;
  padding: 0;
}
.lc-shop-skin ul.woocommerce-shipping-methods li {
  list-style: none;
  margin: 0 0 6px;
  font-family: var(--lcs-font-body);
  font-size: 14px;
  color: var(--lcs-ink);
}
.lc-shop-skin .woocommerce-shipping-methods input.shipping_method {
  accent-color: var(--lcs-red);
}
.lc-shop-skin .woocommerce-shipping-destination {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}

/* Coupon */
.lc-shop-skin .lacanche-cart-coupon__toggle {
  font-family: var(--lcs-font-body);
  color: var(--lcs-teal);
}
.lc-shop-skin .lacanche-cart-coupon__input {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
  border-color: var(--lcs-divider);
  border-radius: var(--lcs-radius-md);
}
.lc-shop-skin .lacanche-cart-coupon__input:focus {
  border-color: var(--lcs-teal);
}
.lc-shop-skin .lacanche-cart-coupon__apply {
  font-family: var(--lcs-font-body);
  font-weight: 500;
  color: var(--lcs-teal);
  border: 1px solid var(--lcs-divider);
  border-radius: 999px;
  background: transparent;
}
.lc-shop-skin .lacanche-cart-coupon__apply:hover {
  background: color-mix(in srgb, var(--lcs-teal) 8%, transparent);
  border-color: color-mix(in srgb, var(--lcs-teal) 35%, transparent);
  color: var(--lcs-teal);
}

/* Proceed to checkout — brand red pill. `.public a` underlines and
   recolors bare anchors, so state both explicitly. */
body.lc-shop-skin.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  font-family: var(--lcs-font-body);
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: none;
  text-decoration: none;
  background: var(--lcs-red);
  color: var(--lcs-ground);
  border-radius: 999px;
}
body.lc-shop-skin.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
  background: color-mix(in srgb, var(--lcs-red) 82%, #000);
  color: var(--lcs-ground);
}

/* Empty cart */
.lc-shop-skin .lacanche-cart-empty {
  border-radius: var(--lcs-radius-lg);
}
.lc-shop-skin .lacanche-cart-empty__heading {
  font-family: var(--lcs-font-heading);
  font-weight: 600;
  color: var(--lcs-teal);
}
.lc-shop-skin .lacanche-cart-empty__sub {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
/* Base rule pins color/text-decoration with !important. */
.lc-shop-skin .lacanche-cart-empty__cta {
  font-family: var(--lcs-font-body);
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: none;
  background: var(--lcs-red);
  color: var(--lcs-ground) !important;
  text-decoration: none !important;
  border-radius: 999px;
}
.lc-shop-skin .lacanche-cart-empty__cta:hover {
  background: color-mix(in srgb, var(--lcs-red) 82%, #000);
}

/* Mobile sticky cart bar — button is already token-red; align type. */
.lc-shop-skin .lacanche-cart-checkout-bar__label {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
.lc-shop-skin .lacanche-cart-checkout-bar__total {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
}
.lc-shop-skin .lacanche-cart-checkout-bar a.lacanche-cart-checkout-bar__btn {
  font-family: var(--lcs-font-body);
  font-weight: 500;
}

/* Mobile stacked cart rows: retint the 'Calibri' cell labels. */
@media (max-width: 768px) {
  body.lc-shop-skin.woocommerce-cart .shop_table.cart td::before {
    font-family: var(--lcs-font-body);
    color: var(--lcs-muted);
  }
  body.lc-shop-skin.woocommerce-cart .shop_table.cart tr.cart_item {
    border-color: color-mix(in srgb, var(--lcs-beige) 55%, transparent);
    border-radius: var(--lcs-radius-md);
  }
}

/* ════════════════════════════════════════════════════════════════════
   Checkout
   ════════════════════════════════════════════════════════════════════ */

/* Address summary (Card 1) */
.lc-shop-skin .lc-addr-section__title {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
.lc-shop-skin .lc-addr-section__header {
  border-bottom-color: color-mix(in srgb, var(--lcs-beige) 45%, transparent);
}
.lc-shop-skin .lc-addr-summary__name {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
}
.lc-shop-skin .lc-addr-summary__line {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
.lc-shop-skin .lc-addr-section__none {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted) !important;
}
/* Edit trigger — base pins color/decoration/line-height with !important. */
.lc-shop-skin .lc-billing-edit-trigger {
  font-family: var(--lcs-font-body);
  border: 1px solid var(--lcs-divider);
  border-radius: 999px;
  color: var(--lcs-teal) !important;
}
.lc-shop-skin .lc-billing-edit-trigger:hover {
  border-color: color-mix(in srgb, var(--lcs-red) 40%, transparent);
  background: color-mix(in srgb, var(--lcs-red) 8%, transparent);
  color: var(--lcs-red) !important;
}
.lc-shop-skin .lc-addr-toggle {
  border-top-color: color-mix(in srgb, var(--lcs-beige) 45%, transparent);
}
.lc-shop-skin .lc-addr-toggle__text {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
.lc-shop-skin .lc-addr-toggle input {
  accent-color: var(--lcs-red);
}

/* Order notes */
.lc-shop-skin .lc-order-notes textarea {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
  border-color: var(--lcs-divider);
  border-radius: var(--lcs-radius-md);
}
.lc-shop-skin .lc-order-notes textarea:focus {
  border-color: var(--lcs-teal);
}
.lc-shop-skin .lc-order-notes textarea::placeholder {
  color: var(--lcs-muted);
}
.lc-shop-skin .lc-order-notes label {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
}

/* Modals (billing / shipping / account) */
.lc-shop-skin .lc-billing-modal__dialog {
  border-radius: var(--lcs-radius-lg);
}
.lc-shop-skin .lc-billing-modal__head {
  border-bottom-color: color-mix(in srgb, var(--lcs-beige) 45%, transparent);
}
.lc-shop-skin .lc-billing-modal__head h2 {
  font-family: var(--lcs-font-heading);
  font-weight: 600;
  color: var(--lcs-teal);
}
.lc-shop-skin .lc-billing-modal__close {
  color: var(--lcs-muted);
}
.lc-shop-skin .lc-billing-modal__close:hover {
  background: color-mix(in srgb, var(--lcs-teal) 8%, transparent);
  color: var(--lcs-teal);
}
.lc-shop-skin .lc-billing-modal__footer {
  border-top-color: color-mix(in srgb, var(--lcs-beige) 45%, transparent);
}
.lc-shop-skin .lc-billing-modal__save {
  font-family: var(--lcs-font-body);
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: none;
  background: var(--lcs-red);
  color: var(--lcs-ground);
  border-radius: 999px;
}
.lc-shop-skin .lc-billing-modal__save:hover {
  background: color-mix(in srgb, var(--lcs-red) 82%, #000);
}
.lc-shop-skin .lc-account-modal-error {
  font-family: var(--lcs-font-body);
  color: var(--lcs-red);
}
/* Show/hide password toggle — icon is a currentColor mask, so tint via color */
.lc-shop-skin .lc-billing-modal .show-password-input {
  color: var(--lcs-muted);
}
.lc-shop-skin .lc-billing-modal .show-password-input:hover {
  color: var(--lcs-teal);
  background: color-mix(in srgb, var(--lcs-teal) 8%, transparent);
}
/* Create account (guest checkout) — outlined pill, sibling of the Edit trigger */
.lc-shop-skin .lc-create-account-btn {
  font-family: var(--lcs-font-body);
  font-weight: 500;
  letter-spacing: 0.02em;
  border: 1px solid var(--lcs-divider);
  border-radius: 999px;
  background: transparent;
  color: var(--lcs-teal);
}
.lc-shop-skin .lc-create-account-btn:hover {
  border-color: color-mix(in srgb, var(--lcs-red) 40%, transparent);
  background: color-mix(in srgb, var(--lcs-red) 8%, transparent);
  color: var(--lcs-red);
}

/* Form fields */
body.lc-shop-skin.woocommerce-checkout .form-row label {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
}
body.lc-shop-skin.woocommerce-checkout .form-row .required {
  color: var(--lcs-red);
}
body.lc-shop-skin.woocommerce-checkout .form-row input.input-text,
body.lc-shop-skin.woocommerce-checkout .form-row textarea {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
  border-color: var(--lcs-divider);
  border-radius: var(--lcs-radius-md);
}
body.lc-shop-skin.woocommerce-checkout .form-row input.input-text:focus,
body.lc-shop-skin.woocommerce-checkout .form-row textarea:focus {
  border-color: var(--lcs-teal);
}
/* Select2 + native selects — base forces these with !important. */
body.lc-shop-skin.woocommerce-checkout .select2-container--default .select2-selection--single,
body.lc-shop-skin.woocommerce-checkout .form-row select {
  font-family: var(--lcs-font-body);
  border: 1px solid var(--lcs-divider) !important;
  border-radius: var(--lcs-radius-md) !important;
}
body.lc-shop-skin.woocommerce-checkout .select2-container--default.select2-container--focus .select2-selection--single,
body.lc-shop-skin.woocommerce-checkout .select2-container--default.select2-container--open .select2-selection--single,
body.lc-shop-skin.woocommerce-checkout .form-row select:focus {
  border-color: var(--lcs-teal) !important;
}
/* Single allowed country: core renders it as bold text; match the 44px
   checkout inputs and show it as a read-only field. */
body.lc-shop-skin.woocommerce-checkout .form-row select.country_to_state--single {
  width: 100%;
  height: 44px;
  padding: 0 16px;
  font-weight: 400;
  background: var(--lcs-surface);
  cursor: default;
}
body.lc-shop-skin.woocommerce-checkout h3#ship-to-different-address {
  font-family: var(--lcs-font-heading);
  font-weight: 600;
  color: var(--lcs-teal);
}
body.lc-shop-skin.woocommerce-checkout #ship-to-different-address-checkbox {
  accent-color: var(--lcs-red);
}

/* Order summary items (shared with account view-order) */
.lc-shop-skin .lc-osi-header {
  background: color-mix(in srgb, var(--lcs-beige) 18%, #fff);
  border-bottom-color: color-mix(in srgb, var(--lcs-beige) 45%, transparent);
}
.lc-shop-skin .lc-osi-header > span {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
.lc-shop-skin .lc-osi-row {
  border-bottom-color: color-mix(in srgb, var(--lcs-ink) 8%, transparent);
}
.lc-shop-skin .lc-osi__thumb img {
  border-radius: 8px;
}
.lc-shop-skin .lc-osi__name {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
}
.lc-shop-skin .lc-osi__name .variation {
  color: var(--lcs-muted);
}
.lc-shop-skin .lc-osi__qty,
.lc-shop-skin .lc-osi__price,
.lc-shop-skin .lc-osi__total {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
}
.lc-shop-skin .lc-osi__qty {
  color: var(--lcs-muted);
}
.lc-shop-skin .lc-order-summary__total-row {
  font-family: var(--lcs-font-body);
  border-bottom-color: color-mix(in srgb, var(--lcs-ink) 8%, transparent);
}
.lc-shop-skin .lc-order-summary__total-label {
  color: var(--lcs-muted);
}
.lc-shop-skin .lc-order-summary__total-value {
  color: var(--lcs-ink);
}
.lc-shop-skin .lc-order-summary__total-row--order-total {
  border-top-color: color-mix(in srgb, var(--lcs-beige) 70%, var(--lcs-ink));
}
.lc-shop-skin .lc-order-summary__total-row--order-total .lc-order-summary__total-label,
.lc-shop-skin .lc-order-summary__total-row--order-total .lc-order-summary__total-value {
  font-family: var(--lcs-font-heading);
  color: var(--lcs-teal);
}
@media (max-width: 768px) {
  .lc-shop-skin .lc-osi__qty::before,
  .lc-shop-skin .lc-osi__price::before,
  .lc-shop-skin .lc-osi__total::before {
    font-family: var(--lcs-font-body);
    color: var(--lcs-muted);
  }
  .lc-shop-skin .lc-osi__qty,
  .lc-shop-skin .lc-osi__price,
  .lc-shop-skin .lc-osi__total {
    border-top-color: color-mix(in srgb, var(--lcs-ink) 8%, transparent);
  }
}

/* Payment methods (#payment carries an ID + !important base rules) */
body.lc-shop-skin #payment .payment_methods > li {
  border-bottom: 1px solid color-mix(in srgb, var(--lcs-beige) 45%, transparent) !important;
}
body.lc-shop-skin.woocommerce-checkout #payment .payment_methods li.payment_method label,
body.lc-shop-skin.woocommerce-checkout #payment .payment_methods li.wc_payment_method label {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
}
body.lc-shop-skin #payment .payment_methods input.input-radio {
  accent-color: var(--lcs-red);
}
body.lc-shop-skin #payment .payment_box {
  background: var(--lcs-ground) !important;
  border-color: color-mix(in srgb, var(--lcs-beige) 55%, transparent);
  border-radius: var(--lcs-radius-md);
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}

/* Saved payment method chips (Stripe tokens) */
.lc-shop-skin li.woocommerce-SavedPaymentMethods-token,
.lc-shop-skin li.woocommerce-SavedPaymentMethods-new {
  border-color: var(--lcs-divider);
  border-radius: var(--lcs-radius-md);
}
.lc-shop-skin li.woocommerce-SavedPaymentMethods-token:hover,
.lc-shop-skin li.woocommerce-SavedPaymentMethods-new:hover {
  border-color: color-mix(in srgb, var(--lcs-teal) 35%, transparent);
  background: color-mix(in srgb, var(--lcs-teal) 4%, #fff);
}
.lc-shop-skin li.woocommerce-SavedPaymentMethods-token:has(input:checked),
.lc-shop-skin li.woocommerce-SavedPaymentMethods-new:has(input:checked) {
  border-color: var(--lcs-red);
  background: color-mix(in srgb, var(--lcs-red) 5%, #fff);
}
.lc-shop-skin li.woocommerce-SavedPaymentMethods-token label,
.lc-shop-skin li.woocommerce-SavedPaymentMethods-new label {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
}
.lc-shop-skin li.woocommerce-SavedPaymentMethods-new label {
  color: var(--lcs-muted);
}
.lc-shop-skin li.woocommerce-SavedPaymentMethods-token label::before,
.lc-shop-skin li.woocommerce-SavedPaymentMethods-new label::before {
  border-color: var(--lcs-divider);
}
.lc-shop-skin li.woocommerce-SavedPaymentMethods-token:has(input:checked) label::before,
.lc-shop-skin li.woocommerce-SavedPaymentMethods-new:has(input:checked) label::before {
  border-color: var(--lcs-red);
  background: radial-gradient(circle, var(--lcs-red) 40%, transparent 42%);
}
.lc-shop-skin li.woocommerce-SavedPaymentMethods-new:has(input:checked) label {
  color: var(--lcs-red);
}
/* Multi-gateway label + Stripe card-entry fieldset */
body.lc-shop-skin #payment .payment_methods li.wc_payment_method:not(:only-child) > label {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
body.lc-shop-skin #wc-stripe-upe-form.wc-upe-form {
  border-color: var(--lcs-divider);
}

/* Place order — base is body.woocommerce-checkout #place_order (1,1,1)
   with a 4px radius; the extra class here wins. */
body.lc-shop-skin.woocommerce-checkout #place_order {
  font-family: var(--lcs-font-body);
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: none;
  background: var(--lcs-red);
  color: var(--lcs-ground);
  border-radius: 999px;
}
body.lc-shop-skin.woocommerce-checkout #place_order:hover {
  background: color-mix(in srgb, var(--lcs-red) 82%, #000);
}

/* Validation feedback — base uses !important. */
body.lc-shop-skin.woocommerce-checkout .form-row.woocommerce-invalid input.input-text {
  border-color: var(--lcs-red) !important;
}

/* ════════════════════════════════════════════════════════════════════
   Catalogue (shop tabs, product cards, filter drawer)
   Most interactive states are already token-red; this retints the
   Inter type, gray borders, and the few off-brand accents.
   ════════════════════════════════════════════════════════════════════ */

/* Tab bar */
.lc-shop-skin .woo-tabs__bar {
  border-bottom-color: color-mix(in srgb, var(--lcs-beige) 70%, var(--lcs-ink));
}
.lc-shop-skin .woo-tabs__tab {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
.lc-shop-skin .woo-tabs__tab:hover {
  color: var(--lcs-ink);
}
.lc-shop-skin .woo-tabs__tab--active {
  color: var(--lcs-teal);
}
.lc-shop-skin .woo-tabs__scroll-btn {
  color: var(--lcs-teal);
}
.lc-shop-skin .woo-tabs__sub-bar {
  border-bottom-color: color-mix(in srgb, var(--lcs-beige) 45%, transparent);
}
.lc-shop-skin .woo-tabs__sub-btn {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
.lc-shop-skin .woo-tabs__sub-btn:hover {
  color: var(--lcs-ink);
}
.lc-shop-skin .woo-tabs__empty {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
/* Cart count bubble — gold → brand red. */
.lc-shop-skin .shop__cart-count {
  background: var(--lcs-red);
  color: var(--lcs-ground);
}

/* Product cards */
.lc-shop-skin .lacanche-card__price {
  color: var(--lcs-teal);
  font-weight: 500;
}
.lc-shop-skin .lacanche-card__brand {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
/* Hover glow was gold-tinted; use the teal shadow token family. */
.lc-shop-skin .product.lacanche-product-card.type-product:hover {
  box-shadow: var(--lcs-shadow-md);
}
/* Stock WC sale badge (unstyled by the theme). */
body.lc-shop-skin span.onsale {
  background: var(--lcs-red);
  color: var(--lcs-ground);
  font-family: var(--lcs-font-body);
  font-weight: 500;
  border-radius: 999px;
}

/* Shop-tab pagination — square 3px buttons → hairline pills, active
   page filled brand red (base --active uses the literal hex). */
.lc-shop-skin .woo-tabs__page-btn {
  font-family: var(--lcs-font-body);
  font-weight: 500;
  color: var(--lcs-teal);
  border: 1px solid var(--lcs-divider);
  border-radius: 999px;
  background: transparent;
}
.lc-shop-skin .woo-tabs__page-btn:hover {
  background: color-mix(in srgb, var(--lcs-teal) 8%, transparent);
  border-color: color-mix(in srgb, var(--lcs-teal) 35%, transparent);
  color: var(--lcs-teal);
}
.lc-shop-skin .woo-tabs__page-btn--active,
.lc-shop-skin .woo-tabs__page-btn--active:hover {
  background: var(--lcs-red);
  border-color: var(--lcs-red);
  color: var(--lcs-ground);
}

/* Mobile filter trigger + drawer */
.lc-shop-skin .woo-tabs__mobile-trigger-bar {
  border-bottom-color: color-mix(in srgb, var(--lcs-beige) 70%, var(--lcs-ink));
}
.lc-shop-skin .woo-tabs__mobile-trigger {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
}
.lc-shop-skin .woo-filter-drawer__head {
  border-bottom-color: color-mix(in srgb, var(--lcs-beige) 45%, transparent);
}
.lc-shop-skin .woo-filter-drawer__title {
  font-family: var(--lcs-font-heading);
  font-weight: 600;
  color: var(--lcs-teal);
}
.lc-shop-skin .woo-filter-drawer__close {
  color: var(--lcs-muted);
}
.lc-shop-skin .woo-filter-drawer__close:hover {
  background: color-mix(in srgb, var(--lcs-teal) 8%, transparent);
  color: var(--lcs-teal);
}
.lc-shop-skin .woo-filter-drawer__panel {
  border-radius: var(--lcs-radius-lg) 0 0 var(--lcs-radius-lg);
}
.lc-shop-skin .woo-filter-drawer__item {
  border-bottom-color: color-mix(in srgb, var(--lcs-ink) 8%, transparent);
}
.lc-shop-skin .woo-filter-drawer__cat {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
}
.lc-shop-skin .woo-filter-drawer__cat:hover {
  background: color-mix(in srgb, var(--lcs-beige) 20%, transparent);
}
.lc-shop-skin .woo-filter-drawer__sub {
  background: var(--lcs-surface);
  border-top-color: color-mix(in srgb, var(--lcs-ink) 8%, transparent);
}
.lc-shop-skin .woo-filter-drawer__sub-btn {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
.lc-shop-skin .woo-filter-drawer__sub-btn:hover {
  background: color-mix(in srgb, var(--lcs-teal) 8%, transparent);
  color: var(--lcs-ink);
}

/* Mobile sticky cart bar (catalogue + product pages) */
.lc-shop-skin .lacanche-mobile-cart-bar {
  border-top-color: color-mix(in srgb, var(--lcs-beige) 55%, transparent);
}
.lc-shop-skin .lacanche-mobile-cart-bar__count {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
.lc-shop-skin .lacanche-mobile-cart-bar__total {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
}
.lc-shop-skin .lacanche-mobile-cart-bar a.lacanche-mobile-cart-bar__btn {
  font-family: var(--lcs-font-body);
  font-weight: 500;
}

/* Taxonomy archives (category/tag) use the stock WC toolbar +
   pagination the custom shop tabs replace on /shop. */
body.lc-shop-skin .woocommerce-result-count {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
body.lc-shop-skin .woocommerce-ordering select.orderby {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
  background: #fff;
  border: 1px solid var(--lcs-divider);
  border-radius: 999px;
  padding: 8px 14px;
}
body.lc-shop-skin nav.woocommerce-pagination ul.page-numbers {
  border: none;
}
body.lc-shop-skin nav.woocommerce-pagination ul.page-numbers li {
  list-style: none;
  margin: 0 4px;
  border: none;
}
body.lc-shop-skin nav.woocommerce-pagination ul.page-numbers li a,
body.lc-shop-skin nav.woocommerce-pagination ul.page-numbers li span {
  font-family: var(--lcs-font-body);
  font-weight: 500;
  color: var(--lcs-teal);
  border: 1px solid var(--lcs-divider);
  border-radius: 999px;
  text-decoration: none;
}
body.lc-shop-skin nav.woocommerce-pagination ul.page-numbers li a:hover {
  background: color-mix(in srgb, var(--lcs-teal) 8%, transparent);
  color: var(--lcs-teal);
}
body.lc-shop-skin nav.woocommerce-pagination ul.page-numbers li span.current {
  background: var(--lcs-red);
  border-color: var(--lcs-red);
  color: var(--lcs-ground);
}

/* ════════════════════════════════════════════════════════════════════
   Single product
   The summary controls (variation pills, qty stepper, add-to-cart)
   are already token-driven — this covers the stock-WC leftovers.
   ════════════════════════════════════════════════════════════════════ */

/* WC core paints price + stock in its own green. */
body.lc-shop-skin div.product p.price,
body.lc-shop-skin div.product span.price {
  color: var(--lcs-teal);
  font-weight: 500;
}
body.lc-shop-skin div.product .stock.in-stock {
  color: color-mix(in srgb, var(--lcs-teal) 85%, #000);
}
body.lc-shop-skin div.product .stock.out-of-stock {
  color: var(--lcs-red);
}

/* Product tabs (Description / Reviews) — stock WC chrome. */
body.lc-shop-skin div.product .woocommerce-tabs ul.tabs {
  border-bottom-color: color-mix(in srgb, var(--lcs-beige) 70%, var(--lcs-ink));
}
body.lc-shop-skin div.product .woocommerce-tabs ul.tabs li {
  background: transparent;
  border-color: color-mix(in srgb, var(--lcs-beige) 55%, transparent);
}
body.lc-shop-skin div.product .woocommerce-tabs ul.tabs li a {
  font-family: var(--lcs-font-body);
  font-weight: 500;
  color: var(--lcs-muted);
}
body.lc-shop-skin div.product .woocommerce-tabs ul.tabs li.active {
  background: #fff;
}
body.lc-shop-skin div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--lcs-teal);
}
/* Panel headings ("Description") inherit .public h2's 3.75rem display
   scale — pin them to a section scale. */
body.lc-shop-skin div.product .woocommerce-Tabs-panel > h2 {
  font-family: var(--lcs-font-heading);
  font-weight: 600;
  font-size: 1.5rem;
  color: var(--lcs-teal);
  margin: 0 0 16px;
}

/* Warranty modal content (shell is skinned with the other modals above). */
body.lc-shop-skin .lc-warranty-modal__content {
  font-family: var(--lcs-font-body);
  color: var(--lcs-ink);
}
body.lc-shop-skin .lc-warranty-modal__content h2,
body.lc-shop-skin .lc-warranty-modal__content h3,
body.lc-shop-skin .lc-warranty-modal__content h4 {
  color: var(--lcs-teal);
}
body.lc-shop-skin .lc-warranty-modal__content a {
  color: var(--lcs-red);
  text-decoration: underline;
}

/* Warranty note under Add to Cart. */
body.lc-shop-skin .lacanche-warranty-note {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
body.lc-shop-skin .lacanche-warranty-note svg {
  color: var(--lcs-teal);
}
body.lc-shop-skin .lacanche-warranty-note__link {
  color: var(--lcs-teal);
}
body.lc-shop-skin .lacanche-warranty-note__link:hover {
  color: var(--lcs-red);
}

/* ════════════════════════════════════════════════════════════════════
   Thank you / order received
   ════════════════════════════════════════════════════════════════════ */

.lc-shop-skin .lacanche-thankyou__icon {
  color: var(--lcs-teal);
}
/* typography.css's `.public h2` (0,1,1) blows this up to display size
   (3rem+); pin it back to a hero scale that fits the card. */
.lc-shop-skin .lacanche-thankyou__heading {
  font-family: var(--lcs-font-heading);
  font-weight: 600;
  font-size: 2.25rem;
  line-height: 1.2;
  color: var(--lcs-teal);
  margin: 0 0 16px;
}
.lc-shop-skin .lacanche-thankyou__sub {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
.lc-shop-skin .lacanche-thankyou__details-btn {
  font-family: var(--lcs-font-body);
  font-weight: 500;
  letter-spacing: 0.02em;
  background: var(--lcs-teal);
  color: var(--lcs-ground);
  border-radius: 999px;
}
.lc-shop-skin .lacanche-thankyou__details-btn:hover {
  background: color-mix(in srgb, var(--lcs-teal) 82%, #000);
}
/* `.public a` underlines/recolors bare anchors — the a. prefix plus the
   skin class outranks it. */
.lc-shop-skin a.lacanche-thankyou__shop-btn {
  font-family: var(--lcs-font-body);
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--lcs-teal);
  text-decoration: none;
  border: 1px solid var(--lcs-divider);
  border-radius: 999px;
  background: transparent;
}
.lc-shop-skin a.lacanche-thankyou__shop-btn:hover {
  background: color-mix(in srgb, var(--lcs-teal) 8%, transparent);
  border-color: color-mix(in srgb, var(--lcs-teal) 35%, transparent);
  color: var(--lcs-teal);
}

/* Order details panel (revealed by the toggle) */
.lc-shop-skin .lacanche-thankyou__order-details table.woocommerce-table {
  font-family: var(--lcs-font-body);
}
.lc-shop-skin .lacanche-thankyou__order-details table.woocommerce-table thead th {
  background: transparent;
  color: var(--lcs-muted);
  font-weight: 500;
  border-bottom: 1px solid var(--lcs-divider);
}
.lc-shop-skin .lacanche-thankyou__order-details table.woocommerce-table th,
.lc-shop-skin .lacanche-thankyou__order-details table.woocommerce-table td {
  border-bottom-color: color-mix(in srgb, var(--lcs-ink) 8%, transparent);
}
.lc-shop-skin .lacanche-thankyou__order-details table.woocommerce-table tfoot tr:last-child td,
.lc-shop-skin .lacanche-thankyou__order-details table.woocommerce-table tfoot tr:last-child th {
  font-family: var(--lcs-font-heading);
  color: var(--lcs-teal);
}
/* Address cards — base paints them in the page-ground color
   (#FFFAF1), which reads as transparent; lift them onto white like
   every other surface. */
.lc-shop-skin .lacanche-thankyou__order-details .woocommerce-column--billing-address,
.lc-shop-skin .lacanche-thankyou__order-details .woocommerce-column--shipping-address,
.lc-shop-skin .lacanche-thankyou__order-details .woocommerce-customer-details > h2,
.lc-shop-skin .lacanche-thankyou__order-details .woocommerce-customer-details > address {
  background: #fff;
  border-color: color-mix(in srgb, var(--lcs-beige) 55%, transparent);
  border-radius: var(--lcs-radius-lg);
  box-shadow: var(--lcs-shadow-sm);
}
.lc-shop-skin .lacanche-thankyou__order-details .woocommerce-column__title {
  font-family: var(--lcs-font-heading);
  font-weight: 600;
  color: var(--lcs-teal);
  border-bottom-color: color-mix(in srgb, var(--lcs-beige) 45%, transparent);
}
.lc-shop-skin .lacanche-thankyou__order-details address {
  font-family: var(--lcs-font-body);
  color: var(--lcs-muted);
}
/* WC core draws its own bordered box around address elements inside
   .woocommerce-customer-details — inside the column cards the card
   already provides the chrome. (Scoped to the columns: in the
   billing-only fallback the bare > address IS the card.) */
.lc-shop-skin .lacanche-thankyou__order-details .woocommerce-column--billing-address address,
.lc-shop-skin .lacanche-thankyou__order-details .woocommerce-column--shipping-address address {
  border: none;
  padding: 0;
  margin: 0;
}

/* ── Notices — toasts AND inline prompts (checkout login/coupon, payment,
   AJAX validation errors). Base woocommerce.css handles layout/reset;
   this only retints. ────────────────────────────────────────────────── */

body.lc-shop-skin .woocommerce-message,
body.lc-shop-skin .woocommerce-error,
body.lc-shop-skin .woocommerce-info {
  font-family: var(--lcs-font-body);
  border-radius: var(--lcs-radius-md);
}
body.lc-shop-skin .woocommerce-message {
  background: color-mix(in srgb, var(--lcs-sage) 40%, #fff);
  border-left-color: color-mix(in srgb, var(--lcs-teal) 85%, #000);
  color: color-mix(in srgb, var(--lcs-teal) 85%, #000);
}
body.lc-shop-skin .woocommerce-error {
  background: color-mix(in srgb, var(--lcs-red) 8%, #fff);
  border-left-color: var(--lcs-red);
  color: var(--lcs-red);
}
body.lc-shop-skin .woocommerce-info {
  background: var(--lcs-surface);
  border-left-color: var(--lcs-orange);
  color: var(--lcs-ink);
}
/* Inline text links inside notices */
body.lc-shop-skin .woocommerce-message a:not(.button),
body.lc-shop-skin .woocommerce-error a:not(.button),
body.lc-shop-skin .woocommerce-info a:not(.button) {
  color: var(--lcs-red);
}
body.lc-shop-skin .woocommerce-message a:not(.button):hover,
body.lc-shop-skin .woocommerce-error a:not(.button):hover,
body.lc-shop-skin .woocommerce-info a:not(.button):hover {
  color: color-mix(in srgb, var(--lcs-red) 82%, #000);
}
/* Action buttons ("View cart", "Browse products") */
body.lc-shop-skin .woocommerce-message .button,
body.lc-shop-skin .woocommerce-error .button,
body.lc-shop-skin .woocommerce-info .button {
  font-family: var(--lcs-font-body);
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: none;
  background: var(--lcs-red);
  color: var(--lcs-ground);
  border-radius: 999px;
}
body.lc-shop-skin .woocommerce-message .button:hover,
body.lc-shop-skin .woocommerce-error .button:hover,
body.lc-shop-skin .woocommerce-info .button:hover {
  background: color-mix(in srgb, var(--lcs-red) 82%, #000);
}