/* Phox Woo Builder: styles shared by the Cart group (Cart Builder, the Cart
   Item parts and the totals/actions parts). Everything here sits at low
   specificity (:where) or on classes that only these parts print, so each
   element's default.css and Design controls (css.twig) always win.

   The parts work in three containers (Cart Builder, Checkout Builder, Mini
   Cart). Their fields and buttons therefore read a short chain of variables:
   the Checkout Builder's own --pwb-co-* value first (it is always set inside
   a checkout), then the neutral --pwb-field-* / --pwb-btn-* values Cart
   Builder sets, then the global tokens from pwb-base.css. */

/* ---- Field + button look, resolved once per part ---- */
:where(.pwb-cart-coupon, .pwb-cart-shipping, .pwb-cart-totals, .pwb-cart-item-qty, .pwb-cart-checkout, .pwb-cart-empty, .pwb-cart-notices) {
  --pwb-f-h: var(--pwb-co-input-h, var(--pwb-field-h, var(--pwb-input-h)));
  --pwb-f-r: var(--pwb-co-input-radius, var(--pwb-field-radius, var(--pwb-radius)));
  --pwb-f-bg: var(--pwb-co-input-bg, var(--pwb-field-bg, var(--pwb-surface)));
  --pwb-f-color: var(--pwb-co-input-color, var(--pwb-field-color, var(--pwb-text)));
  --pwb-f-border: var(--pwb-co-input-border, var(--pwb-field-border, var(--pwb-input-border)));
  --pwb-f-focus: var(--pwb-co-focus, var(--pwb-field-focus, var(--pwb-primary)));
  --pwb-b-h: var(--pwb-co-btn-h, var(--pwb-btn-h, var(--pwb-input-h)));
  --pwb-b-r: var(--pwb-co-btn-radius, var(--pwb-btn-radius, var(--pwb-radius)));
}

/* Elements we show and hide with the hidden attribute keep working even
   though their own rules set display. */
.pwb-cart-msg[hidden],
.pwb-cart-coupon__panel[hidden],
.pwb-cart-shipping__calc-panel[hidden] { display: none !important; }

/* ---- Inline message (quantity limit, coupon result, calculator result) ---- */
:where(.pwb-cart-msg) {
  margin-top: 8px;
  padding: 8px 12px;
  border: 1px solid var(--pwb-border);
  border-radius: var(--pwb-radius);
  background: var(--pwb-surface-2);
  color: var(--pwb-text);
  font-size: var(--pwb-font-sm);
  line-height: 1.4;
  text-align: left;
}
:where(.pwb-cart-msg--error) {
  border-color: color-mix(in srgb, var(--pwb-error) 35%, transparent);
  background: color-mix(in srgb, var(--pwb-error) 8%, var(--pwb-surface));
  color: var(--pwb-error);
}
:where(.pwb-cart-msg--success) {
  border-color: color-mix(in srgb, var(--pwb-success) 35%, transparent);
  background: color-mix(in srgb, var(--pwb-success) 8%, var(--pwb-surface));
  color: var(--pwb-success);
}

/* ---- Busy state set by pwb-cart.js while a request runs ---- */
:where([data-pwb-qty], [data-pwb-coupon], [data-pwb-shipping], [data-pwb-calc]).is-loading {
  opacity: .55;
  pointer-events: none;
  transition: opacity var(--pwb-transition);
}

/* ---- Small shared pieces ---- */
.pwb-glyph { display: block; flex: 0 0 auto; width: 1em; height: 1em; }
:where(.pwb-field) { display: block; margin: 0 0 12px; }
:where(.pwb-field__label) { display: block; margin: 0 0 4px; color: var(--pwb-text-2); font-size: var(--pwb-font-sm); font-weight: 500; }
:where(.pwb-field) :where(select, input[type="text"]) {
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: var(--pwb-f-h, var(--pwb-input-h));
  padding: 0 12px;
  border: 1px solid var(--pwb-f-border, var(--pwb-input-border));
  border-radius: var(--pwb-f-r, var(--pwb-radius));
  background-color: var(--pwb-f-bg, var(--pwb-surface));
  color: var(--pwb-f-color, var(--pwb-text));
  font: inherit;
  font-size: var(--pwb-font);
  box-sizing: border-box;
}
:where(.pwb-field) :where(select, input[type="text"]):focus {
  outline: none;
  border-color: var(--pwb-f-focus, var(--pwb-primary));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--pwb-f-focus, var(--pwb-primary)) 15%, transparent);
}

/* Remove-coupon "x" (in the Discounts rows and the Applied Coupons chips) */
:where(.pwb-cart-coupon-x) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin: 0 0 0 6px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--pwb-muted);
  font-size: 12px;
  line-height: 1;
  vertical-align: middle;
  cursor: pointer;
  transition: background-color var(--pwb-transition), color var(--pwb-transition);
}
:where(.pwb-cart-coupon-x):where(:hover, :focus-visible) {
  background: var(--pwb-surface-2);
  color: var(--pwb-text);
}
.pwb-cart-coupon-x .pwb-glyph { width: 12px; height: 12px; }

/* ---- Totals rows (Subtotal, Discounts, Fees, Taxes, Total, and Cart Totals) ---- */
.pwb-cart-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  padding: var(--pwb-cart-row-py, 6px) 0;
  font-size: var(--pwb-font);
  line-height: 1.4;
  color: inherit;
}
.pwb-cart-row__label { min-width: 0; color: var(--pwb-soft); }
.pwb-cart-row__value { min-width: 0; margin-left: auto; font-weight: 600; text-align: right; color: inherit; }
.pwb-cart-row__value strong { font-weight: inherit; }
.pwb-cart-row__value .includes_tax,
.pwb-cart-row__value small { display: block; margin-top: 2px; font-size: var(--pwb-font-sm); font-weight: 400; line-height: 1.35; color: var(--pwb-muted); }
.pwb-cart-row--discount .pwb-cart-row__value { color: var(--pwb-success); }
.pwb-cart-row__label small { font-size: var(--pwb-font-sm); color: var(--pwb-muted); }

/* The total row: a rule above it, larger figure. */
.pwb-cart-total__row {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid var(--pwb-border);
}
.pwb-cart-total__row .pwb-cart-row__label { color: inherit; font-weight: 600; }
.pwb-cart-total__row .pwb-cart-row__value { font-size: 1.35em; font-weight: 700; line-height: 1.2; }
.pwb-cart-total--no-note .includes_tax { display: none; }

/* ---- Shipping block (Cart Shipping and the shipping row of Cart Totals) ---- */
.pwb-cart-shipping__block { width: 100%; min-width: 0; }
.pwb-cart-shipping__package { min-width: 0; }
.pwb-cart-shipping__package + .pwb-cart-shipping__package { margin-top: 8px; }
.pwb-cart-shipping__head { padding-bottom: 2px; }
.pwb-cart-shipping__head .pwb-cart-row__label { color: inherit; font-weight: 600; }
.pwb-cart-shipping__contents,
.pwb-cart-shipping__note,
.pwb-cart-shipping__dest { margin: 0 0 8px; font-size: var(--pwb-font-sm); line-height: 1.45; color: var(--pwb-text-2); }
.pwb-cart-shipping__dest { margin: 8px 0 0; }
.pwb-cart-shipping__methods { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pwb-cart-shipping__method {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 10px 14px;
  border: 1px solid var(--pwb-co-opt-border, var(--pwb-border));
  border-radius: var(--pwb-co-opt-radius, var(--pwb-radius));
  background: var(--pwb-surface);
  transition: border-color var(--pwb-transition), background-color var(--pwb-transition);
}
.pwb-cart-shipping__method:has(input:checked) {
  border-color: var(--pwb-co-opt-active-border, var(--pwb-primary));
  background: var(--pwb-co-opt-active-bg, color-mix(in srgb, var(--pwb-primary) 5%, var(--pwb-surface)));
}
.pwb-cart-shipping__method input[type="radio"] { flex: 0 0 auto; margin: 0; accent-color: var(--pwb-co-accent, var(--pwb-primary)); }
.pwb-cart-shipping__method input[type="hidden"] { display: none; }
.pwb-cart-shipping__label { flex: 1 1 auto; min-width: 0; margin: 0; font-size: var(--pwb-font); line-height: 1.35; color: var(--pwb-text); cursor: pointer; }
.pwb-cart-shipping__label .woocommerce-Price-amount { font-weight: 600; }
.pwb-cart-shipping__methods--single .pwb-cart-shipping__method { cursor: default; }
.pwb-cart-shipping__methods--single .pwb-cart-shipping__label { cursor: default; }

/* Side by side: the heading left, the methods right. */
@container (min-width: 380px) {
  .pwb-cart-shipping--side .pwb-cart-shipping__package { display: grid; grid-template-columns: minmax(0, auto) minmax(0, 1fr); column-gap: 16px; align-items: start; }
  .pwb-cart-shipping--side .pwb-cart-shipping__head { padding-bottom: 0; }
  .pwb-cart-shipping--side .pwb-cart-shipping__package > :not(.pwb-cart-shipping__head) { grid-column: 2; }
  .pwb-cart-shipping--side .pwb-cart-shipping__package > .pwb-cart-shipping__head { grid-column: 1; grid-row: 1; }
}

/* Shipping calculator */
.pwb-cart-shipping__calc { margin-top: 10px; }
.pwb-cart-shipping__calc-toggle {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  font-size: var(--pwb-font-sm);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.pwb-cart-shipping__calc-toggle:where(:hover, :focus-visible) { color: inherit; text-decoration-thickness: 2px; }
.pwb-cart-shipping__calc-panel { margin-top: 12px; }
.pwb-cart-shipping__calc-apply {
  min-height: var(--pwb-b-h, var(--pwb-input-h));
  border-radius: var(--pwb-b-r, var(--pwb-radius));
}

/* Express checkout buttons printed by payment plugins inside live parts */
.pwb-cart-checkout__express { margin-top: 12px; }

@media (prefers-reduced-motion: reduce) {
  .pwb-cart-msg, .pwb-cart-coupon-x, .pwb-cart-shipping__method { transition: none; }
}
