/**
 * cart-summary.css — podsumowanie koszyka (prawa kolumna): składniki sumy,
 * „Razem", zapowiedź akcyzy, przyciski, ramka pomocy.
 *
 * Wymaga tokens.css i base.css. Prefiks .dc-cart-summary__; .cart_totals
 * (kotwica cart.js) nie niesie stylu poza układem kolumny.
 *
 * MAKIETA MÓWI CO I GDZIE, PROJEKT MÓWI JAK:
 *   panel        rgba(255,255,255,.56) + blur(24) -> --dc-surface-glass-soft
 *                + --dc-blur-lg, r28, cień 0 16 48 .1 -> --dc-shadow-xl
 *   nadtytuł     eyebrow sekcji z C.8 (12 / 600 / --dc-tracking-widest)
 *   wiersze      etykieta 14,5 -> --dc-text-md, wartość 15,5 / 700
 *                wystawowym -> --dc-text-lg, kreska --dc-border-line
 *   suma         32 px / 800 -> --dc-numeral-sm (30, liczebnik dekoracyjny —
 *                to liczba, nie nagłówek), kreska nad sumą --dc-border-thick
 *   przyciski    ranga 1 z poświatą (jedyna w kolumnie) i ranga 2 pod nią,
 *                Inter 700 / 600 (makieta: PJS) — C.1
 *   ramki notek  szkło / złoto a10 z drabinki, r12, ikona w kolorze stanu
 *   ramka pomocy szkło .42 -> --dc-surface-glass-soft, r22, studzienka C.8
 */

/* ==========================================================================
   1. KOLUMNA I PANEL
   ========================================================================== */

.dc-cart-summary {
  display: flex;
  flex-direction: column;
  gap: var(--dc-space-16);
}

.dc-cart-summary__panel {
  padding: var(--dc-space-28);
  border: var(--dc-border) solid var(--dc-border-subtle);
  border-radius: var(--dc-radius-28);
  background-color: var(--dc-surface-glass-soft);
  -webkit-backdrop-filter: var(--dc-blur-lg);
  backdrop-filter: var(--dc-blur-lg);
  box-shadow: var(--dc-shadow-xl), var(--dc-shadow-inset-top);
}

/* h2 jako nadtytuł: to nagłówek kolumny (czytnik: „Podsumowanie"),
   a wygląda jak eyebrow — pismo z C.8 nadpisuje krój nagłówkowy z base.css. */
.dc-cart-summary__eyebrow {
  margin-block-end: var(--dc-space-20);
  font-family: var(--dc-font-body);
  font-size: var(--dc-text-sm);
  font-weight: var(--dc-weight-medium);
  line-height: var(--dc-leading-normal);
  letter-spacing: var(--dc-tracking-widest);
  text-transform: uppercase;
  color: var(--dc-accent-strong);
}

/* ==========================================================================
   2. WIERSZE SUMY
   Tabela dwukolumnowa: <tr> jako flex etykieta–wartość (semantyka tabeli
   zostaje, jak w reguły 19), kreska pod każdym wierszem poza ostatnim.
   ========================================================================== */

.dc-cart-summary__table {
  display: block;
  width: 100%;
}

.dc-cart-summary__table > tbody {
  display: block;
}

.dc-cart-summary__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--dc-space-12);
  padding-block: var(--dc-space-10);
  border-block-end: var(--dc-border) solid var(--dc-border-line);
}

.dc-cart-summary__row--last {
  border-block-end: 0;
}

.dc-cart-summary__label {
  padding: 0;
  font-size: var(--dc-text-md);
  font-weight: 400;
  text-align: left;
  color: var(--dc-text-muted);
}

.dc-cart-summary__sub {
  display: block;
  font-size: var(--dc-text-xs);
  color: var(--dc-text-subtle);
}

.dc-cart-summary__value {
  display: flex;
  align-items: baseline;
  gap: var(--dc-space-8);
  padding: 0;
  font-family: var(--dc-font-display);
  font-size: var(--dc-text-lg);
  font-weight: var(--dc-weight-bold);
  font-variant-numeric: tabular-nums;
  text-align: right;
  white-space: nowrap;
  color: var(--dc-text);
}

.dc-cart-summary__value--discount,
.dc-cart-summary__free {
  color: var(--dc-success);
}

/* Odnośnik „[Usuń]" kuponu z WooCommerce — drobny, w kolorze tekstu. */
.dc-cart-summary__value .woocommerce-remove-coupon {
  font-family: var(--dc-font-body);
  font-size: var(--dc-text-sm);
  font-weight: var(--dc-weight-medium);
  color: var(--dc-text-subtle);
  text-decoration: none;
  transition: color var(--dc-duration-base) var(--dc-ease);
}

.dc-cart-summary__value .woocommerce-remove-coupon:hover {
  color: var(--dc-danger);
}

/* Przekreślona stawka kuriera przy darmowej dostawie. */
.dc-cart-summary__was {
  font-family: var(--dc-font-body);
  font-size: var(--dc-text-sm);
  font-weight: 400;
  color: var(--dc-text-subtle);
}

/* ==========================================================================
   3. NOTKI, SUMA, PRZYCISKI
   ========================================================================== */

.dc-cart-summary__note {
  display: flex;
  align-items: flex-start;
  gap: var(--dc-space-8);
  padding: var(--dc-space-12) var(--dc-space-14);
  border: var(--dc-border) solid var(--dc-border-accent);
  border-radius: var(--dc-radius-12);
  background-color: var(--dc-accent-a10);
  font-size: var(--dc-text-sm);
  line-height: var(--dc-leading-normal);
  color: var(--dc-text-muted);
}

.dc-cart-summary__note .dc-icon {
  flex: none;
  margin-block-start: var(--dc-space-2);
  color: var(--dc-accent-strong);
}

.dc-cart-summary__note--lift {
  margin-block: var(--dc-space-6) var(--dc-space-18);
}

.dc-cart-summary__note--excise {
  margin-block: var(--dc-space-16) var(--dc-space-18);
  border-color: var(--dc-border-subtle);
  background-color: var(--dc-surface-glass);
}

.dc-cart-summary__note--excise .dc-icon {
  color: var(--dc-text-subtle);
}

.dc-cart-summary__note-link {
  font-weight: var(--dc-weight-medium);
  color: var(--dc-accent-strong);
  text-decoration: none;
  transition: color var(--dc-duration-base) var(--dc-ease);
}

.dc-cart-summary__note-link:hover {
  color: var(--dc-text);
}

.dc-cart-summary__total {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--dc-space-12);
  padding-block: var(--dc-space-18) var(--dc-space-6);
  border-block-start: var(--dc-border-thick) solid var(--dc-border-line);
}

.dc-cart-summary__total-label {
  font-family: var(--dc-font-display);
  font-size: var(--dc-text-2xl);
  font-weight: var(--dc-weight-bold);
}

.dc-cart-summary__total-value {
  text-align: right;
}

.dc-cart-summary__amount {
  display: block;
  font-family: var(--dc-font-display);
  font-size: var(--dc-numeral-sm);
  font-weight: var(--dc-weight-black);
  line-height: var(--dc-leading-none);
  letter-spacing: var(--dc-tracking-tighter);
  font-variant-numeric: tabular-nums;
}

.dc-cart-summary__amount-note {
  display: block;
  margin-block-start: var(--dc-space-4);
  font-size: var(--dc-text-sm);
  color: var(--dc-text-subtle);
}

.dc-cart-summary__actions {
  display: flex;
  flex-direction: column;
  gap: var(--dc-space-10);
  margin-block-start: var(--dc-space-18);
}

/* Ranga 1 — jedyna akcja „naprzód" i jedyna poświata w kolumnie (C.4).
   Wysokość: 18 + 18 + wiersz 15 = 51 px (makieta 52). */
.dc-cart-summary__checkout {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--dc-space-8);
  padding: var(--dc-space-18) var(--dc-space-24);
  border: var(--dc-border) solid var(--dc-accent-a50);
  border-radius: var(--dc-radius-16);
  background-image: var(--dc-gradient-cta);
  box-shadow: var(--dc-shadow-accent), var(--dc-shadow-inset-top);
  color: var(--dc-on-accent);
  font-size: var(--dc-text-lg);
  font-weight: var(--dc-weight-bold);
  line-height: var(--dc-leading-none);
  text-decoration: none;
  transition:
    background-color var(--dc-duration-base) var(--dc-ease),
    color var(--dc-duration-base) var(--dc-ease),
    box-shadow var(--dc-duration-base) var(--dc-ease),
    transform var(--dc-duration-fast) var(--dc-ease-out);
}

.dc-cart-summary__checkout:hover {
  background-color: var(--dc-accent-a50);
  color: var(--dc-on-accent);
}

.dc-cart-summary__checkout:active {
  transform: scale(0.97);
  box-shadow: var(--dc-shadow-accent), var(--dc-shadow-inset-press);
}

.dc-cart-summary__checkout:focus-visible {
  border-radius: var(--dc-radius-16);
}

.dc-cart-summary__checkout .dc-icon {
  flex: none;
  color: var(--dc-on-accent);
}

/* Ranga 2 pod główną. */
.dc-cart-summary__continue {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--dc-space-14) var(--dc-space-24);
  border: var(--dc-border) solid var(--dc-border-line);
  border-radius: var(--dc-radius-16);
  background-color: var(--dc-surface-glass);
  color: var(--dc-text);
  font-size: var(--dc-text-md);
  font-weight: var(--dc-weight-medium);
  line-height: var(--dc-leading-none);
  text-decoration: none;
  transition:
    background-color var(--dc-duration-base) var(--dc-ease),
    border-color var(--dc-duration-base) var(--dc-ease),
    color var(--dc-duration-base) var(--dc-ease),
    box-shadow var(--dc-duration-base) var(--dc-ease),
    transform var(--dc-duration-fast) var(--dc-ease-out);
}

.dc-cart-summary__continue:hover {
  border-color: var(--dc-accent-a50);
  background-color: var(--dc-surface);
  color: var(--dc-text);
}

.dc-cart-summary__continue:active {
  transform: scale(0.97);
  box-shadow: var(--dc-shadow-inset-press);
}

.dc-cart-summary__continue:focus-visible {
  border-radius: var(--dc-radius-16);
}

.dc-cart-summary__secure {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--dc-space-8);
  margin-block-start: var(--dc-space-16);
  font-size: var(--dc-text-sm);
  text-align: center;
  color: var(--dc-text-subtle);
}

.dc-cart-summary__secure .dc-icon {
  flex: none;
  color: var(--dc-accent);
}

/* ==========================================================================
   4. RAMKA POMOCY
   ========================================================================== */

.dc-cart-summary__help {
  display: flex;
  align-items: flex-start;
  gap: var(--dc-space-10);
  padding: var(--dc-space-18) var(--dc-space-20);
  border: var(--dc-border) solid var(--dc-border-subtle);
  border-radius: var(--dc-radius-22);
  background-color: var(--dc-surface-glass-soft);
}

.dc-cart-summary__help-icon {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--dc-space-40);
  height: var(--dc-space-40);
  border: var(--dc-border) solid var(--dc-border-accent);
  border-radius: var(--dc-radius-12);
  background-color: var(--dc-accent-a15);
  color: var(--dc-accent-strong);
}

.dc-cart-summary__help-title {
  font-family: var(--dc-font-display);
  font-size: var(--dc-text-md);
  font-weight: var(--dc-weight-bold);
  line-height: var(--dc-leading-tight);
}

.dc-cart-summary__help-note {
  margin-block-start: var(--dc-space-4);
  font-size: var(--dc-text-sm);
  line-height: var(--dc-leading-normal);
  color: var(--dc-text-subtle);
}

.dc-cart-summary__help-link {
  font-weight: var(--dc-weight-bold);
  color: var(--dc-text);
  text-decoration: none;
  transition: color var(--dc-duration-base) var(--dc-ease);
}

.dc-cart-summary__help-link:hover {
  color: var(--dc-accent-strong);
}
