/*
 * Silent Heroes — Checkout (Kasa)
 * Used by template-parts/checkout-demo.php and woocommerce/checkout/*.
 */

.sh-checkout-page {
  background: var(--sh-offwhite);
  min-height: 70vh;
  padding: 32px 0 80px;
}
.sh-checkout-inner {
  max-width: 1140px;
  margin-inline: auto;
  padding: 0 var(--sh-gutter);
}

/* Header */
.sh-checkout-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  margin-bottom: 28px;
}
.sh-checkout-title {
  font-family: 'Poppins', sans-serif;
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--sh-black);
  margin: 0;
}

/* Stepper */
.sh-checkout-stepper {
  display: flex;
  align-items: center;
  gap: 14px;
}
.sh-checkout-step {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Poppins', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: var(--sh-muted);
}
.sh-checkout-step .num {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--sh-border);
  color: var(--sh-white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
}
.sh-checkout-step.is-active { color: var(--sh-black); font-weight: 700; }
.sh-checkout-step.is-active .num { background: var(--sh-red); }
.sh-checkout-step-sep {
  width: 32px;
  height: 1px;
  background: var(--sh-border);
}

/* Layout */
.sh-checkout-grid {
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: 24px;
  align-items: start;
}

/* ===== FORM CARD ===== */
.sh-checkout-card {
  background: var(--sh-white);
  border: 1px solid var(--sh-border);
  border-radius: 10px;
  padding: 28px 32px;
}
.sh-checkout-card-title {
  font-family: 'Poppins', sans-serif;
  font-size: 17px;
  font-weight: 700;
  color: var(--sh-black);
  margin: 0 0 22px;
}
.sh-checkout-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px 16px;
}
.sh-checkout-field { display: flex; flex-direction: column; }
.sh-checkout-field.is-full { grid-column: 1 / -1; }
.sh-checkout-field.is-third { grid-column: span 1; max-width: 180px; }
.sh-checkout-field label {
  font-family: 'Poppins', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--sh-black);
  margin-bottom: 6px;
}
.sh-checkout-field input,
.sh-checkout-field select {
  padding: 11px 14px;
  border: 1px solid var(--sh-border);
  border-radius: 6px;
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  color: var(--sh-black);
  background: var(--sh-white);
  transition: border-color .15s, box-shadow .15s;
}
.sh-checkout-field input::placeholder { color: var(--sh-muted); }
.sh-checkout-field input:focus,
.sh-checkout-field select:focus {
  outline: 0;
  border-color: var(--sh-red);
  box-shadow: 0 0 0 3px rgba(204, 27, 27, 0.08);
}

/* Postcode + city in 1 row */
.sh-checkout-row-postcode {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 16px;
}

/* Submit */
.sh-checkout-submit {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 14px 20px;
  background: var(--sh-red);
  color: var(--sh-white);
  border: 0;
  border-radius: 6px;
  font-family: 'Poppins', sans-serif;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  margin-top: 6px;
  transition: filter .15s;
}
.sh-checkout-submit:hover { filter: brightness(0.92); }
.sh-checkout-submit svg {
  width: 16px; height: 16px;
  stroke: currentColor; stroke-width: 2.5; fill: none;
  stroke-linecap: round; stroke-linejoin: round;
}

/* Step 1 done state */
.sh-checkout-step.is-done { color: var(--sh-black); }
.sh-checkout-step.is-done .num {
  background: var(--sh-success, #27ae60);
  color: var(--sh-white);
}
.sh-checkout-step.is-done .num svg {
  width: 14px; height: 14px;
  stroke: currentColor; stroke-width: 3; fill: none;
  stroke-linecap: round; stroke-linejoin: round;
}

/* ===== RADIO CARDS (delivery / payment) ===== */
.sh-checkout-options {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 22px;
}
.sh-checkout-option {
  display: grid;
  grid-template-columns: 24px 1fr auto;
  gap: 16px;
  align-items: center;
  padding: 18px 22px;
  background: var(--sh-white);
  border: 1px solid var(--sh-border);
  border-radius: 8px;
  cursor: pointer;
  transition: all .15s;
}
.sh-checkout-option:hover { border-color: var(--sh-ink); }
.sh-checkout-option input[type="radio"] {
  appearance: none;
  width: 20px;
  height: 20px;
  border: 2px solid var(--sh-border);
  border-radius: 50%;
  margin: 0;
  cursor: pointer;
  position: relative;
  transition: border-color .15s;
}
.sh-checkout-option input[type="radio"]:checked {
  border-color: var(--sh-red);
}
.sh-checkout-option input[type="radio"]:checked::after {
  content: "";
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 10px; height: 10px;
  background: var(--sh-red);
  border-radius: 50%;
}
.sh-checkout-option:has(input:checked),
.sh-checkout-option.is-active {
  border-color: var(--sh-red);
  background: var(--sh-white, #fff);
}
.sh-checkout-option-info { min-width: 0; }
.sh-checkout-option-name {
  font-family: 'Poppins', sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: var(--sh-black);
  margin: 0 0 2px;
}
.sh-checkout-option-desc {
  font-size: 13px;
  color: var(--sh-muted);
  margin: 0;
}
.sh-checkout-option-price {
  font-family: 'Poppins', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--sh-success, #27ae60);
}

/* Lock icon on the right of radio cards (payment) */
.sh-checkout-option-lock {
  width: 16px; height: 16px;
  stroke: var(--sh-muted); stroke-width: 1.8; fill: none;
  stroke-linecap: round; stroke-linejoin: round;
}

/* ===== PAYMENT DETAILS BOX (card form under active radio) ===== */
.sh-checkout-payment-details {
  background: var(--sh-offwhite);
  border: 1px solid var(--sh-border);
  border-radius: 8px;
  padding: 18px 20px;
  margin-bottom: 22px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 16px;
}
.sh-checkout-payment-details .sh-checkout-field input {
  background: var(--sh-white);
}
.sh-checkout-payment-details .is-full { grid-column: 1 / -1; }

/* SSL note under submit */
.sh-checkout-ssl-note {
  text-align: center;
  font-size: 12px;
  color: var(--sh-muted);
  margin: 12px 0 0;
}

/* Step pane (multi-step) */
.sh-checkout-step-pane[hidden] { display: none !important; }

/* Action row: Back + Next */
.sh-checkout-actions {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: stretch;
  margin-top: 22px;
}
.sh-checkout-actions--single { grid-template-columns: 1fr; }
.sh-checkout-actions--just-back { grid-template-columns: auto; justify-content: start; }
.sh-checkout-back {
  padding: 13px 22px;
  background: var(--sh-white);
  color: var(--sh-black);
  border: 1px solid var(--sh-border);
  border-radius: 6px;
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all .15s;
}
.sh-checkout-back:hover {
  background: var(--sh-offwhite);
  border-color: var(--sh-ink);
}
.sh-checkout-actions .sh-checkout-submit {
  margin-top: 0;
  grid-column: auto; /* override default 1/-1 — w action row mamy: Wstecz + Dalej w jednej linii */
}

/* Ukryj pole "Województwo / Region" — niepotrzebne przy polskich adresach. */
#billing_state_field,
#shipping_state_field,
.woocommerce-billing-fields #billing_state_field,
.woocommerce-shipping-fields #shipping_state_field {
  display: none !important;
}

/* ===== ORDER SUMMARY ===== */
.sh-checkout-summary {
  background: var(--sh-white);
  border: 1px solid var(--sh-border);
  border-radius: 10px;
  padding: 22px 24px;
  position: sticky;
  top: 130px;
}
.sh-checkout-summary-title {
  font-family: 'Poppins', sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: var(--sh-black);
  margin: 0 0 18px;
}
.sh-checkout-summary-items {
  list-style: none;
  margin: 0 0 18px;
  padding: 0 0 16px;
  border-bottom: 1px solid var(--sh-border);
}
.sh-checkout-summary-items li {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 8px 0;
}
.sh-checkout-summary-items img {
  width: 44px;
  height: 44px;
  border-radius: 6px;
  object-fit: cover;
  background: var(--sh-offwhite);
}
.sh-checkout-summary-items .name {
  font-family: 'Poppins', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--sh-black);
  line-height: 1.3;
}
.sh-checkout-summary-items .price {
  font-family: 'Poppins', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--sh-black);
  white-space: nowrap;
}
.sh-checkout-summary-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 0;
  font-size: 13px;
  color: var(--sh-ink);
}
.sh-checkout-summary-row .value {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  color: var(--sh-black);
}
.sh-checkout-summary-row.is-free .value {
  color: var(--sh-success, #27ae60);
  font-weight: 700;
  letter-spacing: 0.04em;
}
.sh-checkout-summary-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding-top: 12px;
  margin-top: 8px;
  border-top: 1px solid var(--sh-border);
}
.sh-checkout-summary-total .label {
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--sh-black);
}
.sh-checkout-summary-total .value {
  font-family: 'Poppins', sans-serif;
  font-size: 18px;
  font-weight: 800;
  color: var(--sh-black);
}

/* ===== RESPONSIVE ===== */
@media (max-width: 900px) {
  .sh-checkout-grid { grid-template-columns: 1fr; }
  .sh-checkout-summary { position: static; }
}
@media (max-width: 600px) {
  .sh-checkout-header { flex-direction: column; align-items: flex-start; }
  .sh-checkout-title { font-size: 24px; }
  .sh-checkout-stepper { flex-wrap: wrap; gap: 8px; }
  .sh-checkout-step-sep { display: none; }
  .sh-checkout-form { grid-template-columns: 1fr; }
  .sh-checkout-row-postcode { grid-template-columns: 1fr 1fr; }
  .sh-checkout-card { padding: 22px 18px; }
}

/* ========== THANK-YOU / ORDER-RECEIVED (układ Lovable) ========== */
.sh-thankyou { max-width: var(--sh-container, 1200px); margin: 0 auto; padding: 40px 24px 80px; }
/* Ciemna belka hero */
.sh-ty-hero {
  background: radial-gradient(130% 150% at 0% 0%, #18201c 0%, #0f1011 55%, #0b0b0c 100%);
  border-radius: var(--sh-radius-lg, 12px);
  padding: 36px 40px 30px; margin: 0 0 28px; color: #fff;
}
.sh-ty-hero-row { display: flex; align-items: center; gap: 22px; margin-bottom: 26px; }
.sh-ty-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 56px; height: 56px; border-radius: 9999px;
  background: var(--sh-red, #CC1B1B); color: #fff; flex-shrink: 0;
  box-shadow: 0 8px 24px rgba(204, 27, 27, 0.35);
}
.sh-ty-badge svg { width: 28px; height: 28px; }
.sh-ty-hero-text { flex: 1; min-width: 0; }
.sh-ty-kicker { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--sh-red, #CC1B1B); margin-bottom: 6px; }
.sh-ty-title {
  font-size: var(--sh-fs-3xl, 2.25rem); font-weight: var(--sh-fw-bold, 700);
  letter-spacing: -0.02em; margin: 0 0 8px; color: #fff; line-height: 1.1;
}
.sh-ty-sub { font-size: var(--sh-fs-md, 1.125rem); color: rgba(255, 255, 255, 0.7); margin: 0; line-height: 1.6; max-width: 700px; }
.sh-ty-sub strong { color: #fff; }
.sh-ty-finish { margin-top: 18px; }
/* Stan „potwierdzamy płatność" (np. BLIK asynchroniczny) — w ciemnej belce */
.sh-ty-confirming { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 18px; color: rgba(255, 255, 255, 0.85); font-size: 0.98rem; }
.sh-ty-spinner { width: 18px; height: 18px; border: 2px solid rgba(255, 255, 255, 0.3); border-top-color: var(--sh-red, #CC1B1B); border-radius: 50%; display: inline-block; flex-shrink: 0; animation: sh-ty-spin 0.8s linear infinite; }
@keyframes sh-ty-spin { to { transform: rotate(360deg); } }
.sh-ty-pay-fallback { margin-left: 4px; }

/* Karta kluczowa wewnątrz ciemnej belki */
.sh-ty-keycard {
  display: grid; grid-template-columns: repeat(4, 1fr);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--sh-radius-md, 8px); overflow: hidden;
}
.sh-ty-kc-item { padding: 16px 18px; border-right: 1px solid rgba(255, 255, 255, 0.1); display: flex; flex-direction: column; gap: 6px; }
.sh-ty-kc-item:last-child { border-right: 0; }
.sh-ty-kc-label { display: flex; align-items: center; gap: 6px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: rgba(255, 255, 255, 0.5); font-weight: 600; }
.sh-ty-kc-label svg { width: 12px; height: 12px; color: var(--sh-red, #CC1B1B); flex-shrink: 0; }
.sh-ty-kc-value { font-size: var(--sh-fs-md, 1.125rem); font-weight: var(--sh-fw-bold, 700); color: #fff; }
.sh-ty-kc-total .sh-ty-kc-value { color: var(--sh-red, #CC1B1B); }

/* Dwukolumnowy układ: pozycje (lewa) + dostawa/adresy (prawa) */
.sh-ty-order { display: grid; grid-template-columns: 1fr 360px; gap: 24px; align-items: start; }
.sh-ty-card { background: #fff; border: 1px solid var(--sh-border, #E0DDD8); border-radius: var(--sh-radius-md, 8px); }
.sh-ty-items { overflow: hidden; }
.sh-ty-card-head { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; background: var(--sh-offwhite-2, #EEEBE3); border-bottom: 1px solid var(--sh-border, #E0DDD8); }
.sh-ty-card-title { display: flex; align-items: center; gap: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; font-size: 13px; color: var(--sh-black, #111); }
.sh-ty-card-title svg { width: 18px; height: 18px; color: var(--sh-red, #CC1B1B); }
.sh-ty-card-meta { font-size: 12px; color: var(--sh-muted, #666); }

.sh-ty-item { display: grid; grid-template-columns: 64px 1fr auto; gap: 16px; padding: 18px 22px; border-bottom: 1px solid var(--sh-border-soft, #EDEBE4); align-items: start; }
.sh-ty-item:last-of-type { border-bottom: 0; }
.sh-ty-thumb { position: relative; width: 64px; height: 64px; border-radius: 8px; background: #fff; border: 1px solid var(--sh-border, #E0DDD8); flex-shrink: 0; }
.sh-ty-thumb img { width: 100%; height: 100%; object-fit: contain; border-radius: 8px; }
.sh-ty-qty { position: absolute; top: -8px; left: -8px; background: var(--sh-black, #111); color: #fff; font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 9999px; }
.sh-ty-item-name { font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.02em; margin: 0 0 4px; color: var(--sh-black, #111); }
.sh-ty-item-desc { font-size: 13px; color: var(--sh-muted, #666); margin: 0; line-height: 1.4; }
.sh-ty-pill { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; padding: 3px 10px; background: #fdecef; color: var(--sh-red, #CC1B1B); border-radius: 9999px; font-size: 12px; font-weight: 600; }
.sh-ty-bundle { margin-top: 10px; padding: 12px 14px; border-left: 3px solid var(--sh-red, #CC1B1B); background: var(--sh-offwhite-2, #EEEBE3); border-radius: 0 6px 6px 0; }
.sh-ty-bundle-title { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--sh-ink, #333); }
.sh-ty-bundle ul { list-style: none; margin: 8px 0 0; padding: 0; }
.sh-ty-bundle li { font-size: 12.5px; color: var(--sh-muted, #666); padding-left: 16px; position: relative; line-height: 1.6; }
.sh-ty-bundle li::before { content: '›'; position: absolute; left: 0; color: var(--sh-red, #CC1B1B); font-weight: 700; }
.sh-ty-item-price { font-size: 15px; font-weight: 700; color: var(--sh-black, #111); white-space: nowrap; }

.sh-ty-totals { padding: 16px 22px; background: var(--sh-offwhite-2, #EEEBE3); }
.sh-ty-total-row { display: flex; justify-content: space-between; font-size: 14px; color: var(--sh-ink, #333); padding: 4px 0; }
.sh-ty-total-row .label { color: var(--sh-muted, #666); }
.sh-ty-total-grand { margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--sh-border, #E0DDD8); font-size: 18px; font-weight: 700; color: var(--sh-black, #111); }
.sh-ty-total-grand .value { color: var(--sh-red, #CC1B1B); }

.sh-ty-sidebar { display: flex; flex-direction: column; gap: 16px; }
.sh-ty-side-card { padding: 20px 22px; }
.sh-ty-side-head { display: flex; align-items: center; gap: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; font-size: 13px; color: var(--sh-black, #111); margin-bottom: 12px; }
.sh-ty-side-head svg { width: 18px; height: 18px; color: var(--sh-red, #CC1B1B); }
.sh-ty-side-strong { font-weight: 700; color: var(--sh-black, #111); margin: 0 0 6px; }
.sh-ty-side-addr { font-size: 14px; color: var(--sh-muted, #666); line-height: 1.5; margin: 0 0 10px; }
.sh-ty-side-addr:last-child { margin-bottom: 0; }
.sh-ty-side-note { font-size: 13px; color: var(--sh-muted, #666); margin: 10px 0 0; padding-top: 10px; border-top: 1px solid var(--sh-border-soft, #EDEBE4); }
.sh-ty-side-note strong, .sh-ty-side-addr strong { color: var(--sh-black, #111); }
.sh-ty-side-contact { font-size: 14px; color: var(--sh-ink, #333); margin: 4px 0 0; }
.sh-ty-side-muted { background: var(--sh-offwhite-2, #EEEBE3); border-color: transparent; }

@media (max-width: 900px) {
  .sh-ty-order { grid-template-columns: 1fr; }
}

/* Podgląd zamówienia w „Moje konto" — jedna kolumna (obszar konta jest węższy
   przez własną nawigację, więc układ 1fr+360px się ściska). Pozycje na całą
   szerokość, karty adresowe poniżej w siatce auto-fit. */
.sh-vieworder { padding-top: 0; }
.sh-vieworder .sh-ty-order { grid-template-columns: 1fr; }
.sh-vieworder .sh-ty-sidebar { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.sh-vieworder .sh-ty-sidebar > .sh-ty-side-card:first-child { grid-column: 1 / -1; }
/* Nadpisanie reguł „Moje konto" (.sh-account-main h1/h3 → ciemny 18px) — w belce
   hero tytuł ma być biały, a nazwy pozycji jak na stronie „dziękujemy". */
.sh-vieworder .sh-ty-hero .sh-ty-title { color: #fff; font-size: var(--sh-fs-3xl, 2.25rem); font-weight: 500; letter-spacing: -0.02em; margin: 0 0 8px; }
.sh-vieworder .sh-ty-hero .sh-ty-sub { color: rgba(255, 255, 255, 0.7); }
.sh-vieworder .sh-ty-hero .sh-ty-sub strong { color: #fff; }
.sh-vieworder .sh-ty-items .sh-ty-item-name { color: var(--sh-black, #111); font-size: 13px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.02em; margin: 0 0 4px; }
/* Szczegóły zamówienia w „Moje konto" — fonty o 1px mniejsze niż na stronie „dziękujemy". */
.sh-vieworder .sh-ty-order .sh-ty-card-title { font-size: 12px; }
.sh-vieworder .sh-ty-order .sh-ty-card-meta { font-size: 11px; }
.sh-vieworder .sh-ty-order .sh-ty-item-desc { font-size: 12px; }
.sh-vieworder .sh-ty-order .sh-ty-pill { font-size: 11px; }
.sh-vieworder .sh-ty-order .sh-ty-bundle-title { font-size: 10px; }
.sh-vieworder .sh-ty-order .sh-ty-bundle li { font-size: 11.5px; }
.sh-vieworder .sh-ty-order .sh-ty-item-price { font-size: 14px; }
.sh-vieworder .sh-ty-order .sh-ty-qty { font-size: 10px; }
.sh-vieworder .sh-ty-order .sh-ty-total-row { font-size: 13px; }
.sh-vieworder .sh-ty-order .sh-ty-total-grand { font-size: 17px; }
.sh-vieworder .sh-ty-order .sh-ty-side-head { font-size: 12px; }
.sh-vieworder .sh-ty-order .sh-ty-side-strong { font-size: 13px; }
.sh-vieworder .sh-ty-order .sh-ty-side-addr { font-size: 13px; }
.sh-vieworder .sh-ty-order .sh-ty-side-note { font-size: 12px; }
.sh-vieworder .sh-ty-order .sh-ty-side-contact { font-size: 13px; }
@media (max-width: 768px) {
  /* Padding 0 na całym wrapperze widoku zamówienia / podziękowania na mobile. */
  body.woocommerce-order .sh-thankyou,
  body.woocommerce-order .sh-vieworder,
  .sh-thankyou,
  .sh-vieworder { padding: 0 !important; }
  .sh-ty-hero { padding: 26px 20px 22px; }
  .sh-ty-hero-row { gap: 16px; }
  .sh-ty-title { font-size: var(--sh-fs-2xl, 1.75rem); }
  .sh-ty-keycard { grid-template-columns: 1fr 1fr; }
  .sh-ty-kc-item:nth-child(2n) { border-right: 0; }
  .sh-ty-kc-item:nth-child(-n+2) { border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
  /* Ukryj okrągłą badge statusu (X / ✓ / zegar) na widoku zamówienia mobile. */
  .sh-vieworder .sh-ty-badge,
  .sh-thankyou .sh-ty-badge { display: none !important; }
  /* Mobile: zmniejsz font wartości w karcie kluczowej (#numer, data, płatność…). */
  .sh-ty-kc-value { font-size: 14px !important; }
}

/* Mniej bolda — cieńsze napisy (baza ~400) na całej stronie podziękowania */
.sh-thankyou .sh-ty-kc-value,
.sh-thankyou .sh-ty-kc-label,
.sh-thankyou .sh-ty-item-price,
.sh-thankyou .sh-ty-side-strong,
.sh-thankyou .sh-ty-pill,
.sh-thankyou .sh-ty-card-meta,
.sh-thankyou .sh-ty-total-row,
.sh-thankyou .sh-ty-total-row .label,
.sh-thankyou .sh-ty-total-row .value { font-weight: 400; }
.sh-thankyou .sh-ty-title,
.sh-thankyou .sh-ty-kicker,
.sh-thankyou .sh-ty-card-title,
.sh-thankyou .sh-ty-side-head,
.sh-thankyou .sh-ty-item-name,
.sh-thankyou .sh-ty-bundle-title,
.sh-thankyou .sh-ty-total-grand,
.sh-thankyou .sh-ty-total-grand .value { font-weight: 500; }
.sh-thankyou .sh-ty-qty { font-weight: 600; }
/* Nazwa pozycji na stronie „dziękujemy" — mniejsza, lżejsza. */
.sh-thankyou .sh-ty-item-name { font-size: 15px; font-weight: 500; }

/* Białe tło CAŁEJ strony „dziękujemy" — ciemna pozostaje tylko belka hero.
   :has() łapie wrapper zawierający .sh-thankyou (niezależnie od klasy body). */
.sh-wc-main:has(.sh-thankyou),
.site-main:has(.sh-thankyou),
#primary:has(.sh-thankyou),
body.woocommerce-order-received .sh-wc-main,
body.woocommerce-order-received .site-main { background: #fff !important; }
/* Beżowe akcenty kart → białe (struktura na obramowaniach) */
.sh-thankyou .sh-ty-card-head { background: #fff; }
.sh-thankyou .sh-ty-totals { background: #fff; border-top: 1px solid var(--sh-border, #E0DDD8); }
.sh-thankyou .sh-ty-side-muted { background: #fff; border-color: var(--sh-border, #E0DDD8); }
.sh-thankyou .sh-ty-bundle { background: #fff; }

/* =========================================================================
   BLOCK CHECKOUT (Gutenberg) — stylowanie pod markę Silent Heroes.
   Kasa migrowana z klasycznej na blok WooCommerce; tu nadajemy markę.
   ========================================================================= */
.wc-block-checkout {
  font-family: 'Poppins', sans-serif;
  max-width: 1180px;
  margin: 0 auto;
  padding: 40px 24px 80px;
  box-sizing: border-box;
}
@media (max-width: 900px) {
  .wc-block-checkout { padding: 24px 16px 60px; }
}

/* Lewa kolumna = przezroczysty kontener; KAŻDA sekcja to osobna biała karta (makieta).
   Prawa kolumna (podsumowanie) = jedna ciemna karta. */
.wc-block-checkout .wc-block-checkout__main {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  box-sizing: border-box;
}
/* Każdy krok kasy w osobnej białej karcie (jak makieta: #E7E6E4, radius 6px, padding 24px) */
.wc-block-checkout .wc-block-checkout__main .wc-block-components-checkout-step {
  background: var(--sh-white, #fff) !important;
  border: 1px solid #E7E6E4 !important;
  border-radius: 6px !important;
  padding: 24px !important;
  margin: 0 0 16px !important;
  box-sizing: border-box;
}
.wc-block-checkout .wc-block-checkout__sidebar {
  background: var(--sh-white, #fff) !important;
  border: 1px solid #E7E6E4 !important;
  border-radius: 6px !important;
  padding: 24px !important;
  box-sizing: border-box;
  align-self: flex-start;
}
/* Prawa kolumna „float" — sticky, towarzyszy przy scrollu (jak w makiecie).
   KLUCZOWE: motyw ma na <body> `overflow-x: hidden`, co tworzy kontener scrolla
   i ZABIJA position:sticky. Zamieniamy na `overflow-x: clip` (blokuje poziomy
   scroll, ale NIE tworzy kontenera scrolla → sticky działa). Tylko na kasie. */
body.woocommerce-checkout { overflow-x: clip !important; }
@media (min-width: 901px) {
  .wc-block-checkout .wc-block-checkout__sidebar { position: sticky; top: 100px; }
}

/* === JASNA karta podsumowania (jak w koszyku: białe tło, ciemny tekst) === */
/* Tytuł i teksty — ciemne (domyślne); etykiety sum przygaszone jak w koszyku. */
.wc-block-checkout .wc-block-checkout__sidebar .wc-block-components-checkout-order-summary__title,
.wc-block-checkout .wc-block-checkout__sidebar .wc-block-components-product-name { color: var(--sh-black, #111) !important; }
.wc-block-checkout .wc-block-checkout__sidebar .wc-block-components-totals-item__label { color: var(--sh-muted, #666) !important; }
.wc-block-checkout .wc-block-checkout__sidebar .wc-block-components-totals-item__value { color: var(--sh-black, #111) !important; }
/* cena pozycji produktu — czerwień marki (akcent, jak na karcie produktu) */
.wc-block-checkout .wc-block-checkout__sidebar .wc-block-components-order-summary-item__total-price { color: var(--sh-red, #CC1B1B) !important; font-weight: 700; }
/* separatory — jasne, jak w koszyku */
.wc-block-checkout .wc-block-checkout__sidebar hr,
.wc-block-checkout .wc-block-checkout__sidebar .wc-block-components-totals-item,
.wc-block-checkout .wc-block-checkout__sidebar .wc-block-components-order-summary,
.wc-block-checkout .wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-totals-block,
.wc-block-checkout .wc-block-checkout__sidebar .wc-block-components-totals-wrapper { border-color: var(--sh-border, #E0DDD8) !important; }
/* USUŃ podwójną ramkę: WC owija podsumowanie własnym borderem wewnątrz naszej karty.
   Nasza karta sidebara już daje ramkę → wewnętrzny border zdejmujemy. */
.wc-block-checkout .wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-block {
  border: 0 !important;
  padding: 0 !important;
}
/* Odstęp między kolumnami (formularz | podsumowanie) — jak w koszyku.
   WC używał paddingu kolumn jako rynny; nadpisaliśmy go paddingiem karty, więc
   wymuszamy gap + sztywne szerokości (bez zawijania sidebara na desktopie). */
@media (min-width: 901px) {
  .wc-block-checkout .wc-block-components-sidebar-layout {
    flex-wrap: nowrap;
    gap: 28px;
    align-items: flex-start;
  }
  .wc-block-checkout .wc-block-checkout__main { flex: 1 1 auto; min-width: 0; }
  .wc-block-checkout .wc-block-checkout__sidebar { flex: 0 0 360px; max-width: 360px; margin: 0 !important; }
}
@media (max-width: 900px) {
  .wc-block-checkout .wc-block-checkout__main,
  .wc-block-checkout .wc-block-checkout__sidebar { padding: 18px 16px !important; }
}
/* Mobile: zwęź zewnętrzne paddingi, żeby karty były szerokie z minimalnym marginem
   po bokach. Step (Dane kontaktowe, Adres dostawy itp.) i trust card – jednolita
   szerokość. */
@media (max-width: 600px) {
  /* TYLKO root checkout block ma padding (selektor .wp-block-woocommerce-checkout
     żeby nie matchował też dziecka .wc-block-components-sidebar-layout) */
  .wp-block-woocommerce-checkout.wc-block-checkout { padding: 16px 8px 48px !important; }
  /* Wyzeruj padding na dziecku — inaczej kumuluje się 8+8=16px po każdej stronie */
  .wc-block-checkout .wc-block-components-sidebar-layout.wc-block-checkout { padding: 0 !important; }
  /* Main bez paddingu — step (Dane kontaktowe itp.) jest sam ramą-karta szerokości 100%.
     Sidebar zostaje z paddingiem i border = jego własna karta. */
  .wc-block-checkout .wc-block-checkout__main { padding: 0 !important; }
  .wc-block-checkout .wc-block-checkout__sidebar { padding: 16px 14px !important; }
  /* Step jako widzialna karta — musi mieć WYŻSZĄ specyficzność niż stara reguła z 24px
     padding (selektor .wc-block-checkout .wc-block-checkout__main .wc-block-components-checkout-step). */
  .wc-block-checkout .wc-block-checkout__main .wc-block-components-checkout-step { padding: 16px 14px !important; margin: 0 0 12px !important; }
  /* Trust/USP strip (30 dni zwrot / SSL / Wysyłka) — taka sama szerokość jak step */
  .wc-block-checkout .sh-co-trustlist,
  .wc-block-checkout .sh-co-trustlist-wrap { width: 100% !important; max-width: none !important; margin: 0 !important; }
}

/* Ukryj linię Subtotal — duplikuje Łącznie (Total wartość = Subtotal gdy nie
   ma dodatkowych opłat). User nie potrzebuje obu linii. */
.wc-block-checkout .wp-block-woocommerce-checkout-order-summary-subtotal-block,
.wc-block-checkout .wc-block-components-totals-item.wc-block-components-totals-subtotal,
.wc-block-cart .wp-block-woocommerce-cart-order-summary-subtotal-block { display: none !important; }

/* Ukryj ikonę (chevron rozwijany) obok "Podsumowanie zamówienia" — zbędna. */
.wc-block-checkout .wc-block-components-checkout-order-summary__title-icon,
.wc-block-cart .wc-block-components-checkout-order-summary__title-icon { display: none !important; }
/* Ukryj kwotę 178,98 zł obok "Podsumowanie zamówienia" — jest jeszcze raz niżej
   w "Łącznie", więc duplikacja. */
.wc-block-checkout .wc-block-components-checkout-order-summary__title-price,
.wc-block-cart .wc-block-components-checkout-order-summary__title-price { display: none !important; }
/* Ukryj per-unit price (29,99 zł pod nazwą produktu) — zduplikowane z total-price obok nazwy. */
.wc-block-checkout .wc-block-components-order-summary-item__individual-prices,
.wc-block-cart .wc-block-components-order-summary-item__individual-prices,
.wc-block-checkout .wc-block-cart-item__prices,
.wc-block-cart .wc-block-cart-item__prices { display: none !important; }
/* Tekst nagłówka — pełna szerokość, wyśrodkowany, bez kursora button (chevron + cena ukryte) */
.wc-block-checkout .wc-block-components-checkout-order-summary__title-text,
.wc-block-cart .wc-block-components-checkout-order-summary__title-text {
  flex: 1 1 100% !important;
  width: 100% !important;
  text-align: center !important;
  color: #fff !important;
}
.wc-block-checkout .wc-block-components-checkout-order-summary__title,
.wc-block-cart .wc-block-components-checkout-order-summary__title {
  cursor: default !important;
  justify-content: center !important;
  background: var(--sh-black, #111) !important;
  color: #fff !important;
  padding: 14px 16px !important;
  margin: -16px -14px 12px !important; /* wypełnij całą szerokość karty (cofnij padding sidebar) */
  border-radius: 6px 6px 0 0 !important;
}

/* Pusty wrapper totals-block — zostaje tylko border-top z WC core, bez kontentu.
   Usuwamy w całości (display:none). */
.wc-block-checkout .wp-block-woocommerce-checkout-order-summary-totals-block:empty,
.wc-block-cart .wp-block-woocommerce-cart-order-summary-totals-block:empty,
.wc-block-checkout .wp-block-woocommerce-checkout-order-summary-totals-block,
.wc-block-cart .wp-block-woocommerce-cart-order-summary-totals-block {
  border: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* Hide div totals-block — pusty wrapper (zostają wewn. .wc-block-components-totals-item
   bezpośrednio jako siblingi, ten wrapper nie nosi nic). */
.wc-block-checkout .wp-block-woocommerce-checkout-order-summary-totals-block,
.wc-block-cart .wp-block-woocommerce-cart-order-summary-totals-block { display: none !important; }

/* Border-top/bottom nad "Podsumowanie zamówienia" — WC core daje 1px solid
   color-mix(currentColor 20%) z @container query (max-width: 699px). Usuwamy. */
.wc-block-checkout .wp-block-woocommerce-checkout-order-summary-block,
.wc-block-checkout .wc-block-components-checkout-order-summary__title,
.wc-block-cart .wp-block-woocommerce-cart-order-summary-block,
.wc-block-cart .wc-block-components-checkout-order-summary__title,
.wc-block-components-checkout-order-summary__title {
  border: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
}

/* Inline hint pod polem (rejestracja, faktura) — zielony, dyskretny */
.sh-checkout-hint {
  margin: 8px 0 0 !important;
  padding: 8px 12px;
  background: #ECF7EC;
  border-left: 3px solid #2D8B2D;
  border-radius: 4px;
  font-family: 'Poppins', sans-serif !important;
  font-size: 12.5px !important;
  line-height: 1.45;
  color: #1F5F1F;
}

/* Nagłówki sekcji (Dane kontaktowe, Adres, Opcje płatności, Dodatkowe info) */
.wc-block-checkout .wc-block-components-title,
.wc-block-checkout .wc-block-components-checkout-step__title {
  font-family: 'Poppins', sans-serif !important;
  color: var(--sh-black, #111);
  font-weight: 600;
  letter-spacing: -0.01em;
}

/* Numerki sekcji 01–04 na kartach (jak makieta) — liczniki CSS */
.wc-block-checkout .wc-block-checkout__main { counter-reset: sh-step; }
.wc-block-checkout .wc-block-checkout__main .wc-block-components-checkout-step__title {
  display: flex !important;
  align-items: center;
  gap: 12px;
}
.wc-block-checkout .wc-block-checkout__main .wc-block-components-checkout-step__title::before {
  counter-increment: sh-step;
  content: counter(sh-step, decimal-leading-zero);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: #fdecef;
  color: var(--sh-red, #CC1B1B);
  border-radius: 7px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  flex-shrink: 0;
}

/* Wrapper heading: h2 + opcjonalny link „Zaloguj się" (heading-content).
   WC daje heading-content jako span position:absolute → na mobile nakłada się
   na h2. Wymuszamy normalny flow: flex z wrap, link idzie pod h2 na mobile
   gdy zabraknie miejsca, a na desktop płynie po prawej. */
.wc-block-checkout .wc-block-components-checkout-step__heading {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
  position: static !important;
  margin: 0 0 12px !important;
}
.wc-block-checkout .wc-block-components-checkout-step__heading .wc-block-components-checkout-step__title {
  margin: 0 !important;
  flex: 1 1 auto;
  min-width: 0;
}
.wc-block-checkout .wc-block-components-checkout-step__heading-content {
  position: static !important;
  inset: auto !important;
  margin: 0 !important;
  display: inline-flex;
  align-items: center;
  font-size: 13px;
  flex-shrink: 0;
  line-height: 1.4;
  min-height: 24px;
}
.wc-block-checkout .wc-block-checkout__login-prompt {
  color: var(--sh-red, #CC1B1B);
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  margin: 0 !important; /* WC Blocks daje margin-top:-24px (legacy absolute layout) → resetujemy */
}
.wc-block-checkout .wc-block-checkout__login-prompt:hover { text-decoration: underline; }

@media (max-width: 600px) {
  .wc-block-checkout .wc-block-components-checkout-step__heading {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
  .wc-block-checkout .wc-block-components-checkout-step__heading .wc-block-components-checkout-step__title {
    flex: 0 0 auto;
  }
  .wc-block-checkout .wc-block-components-checkout-step__heading-content {
    display: block;
    padding-left: 40px; /* wyrównanie pod numerek 01/02/... */
    line-height: 1.4;
    min-height: 0;
  }
}

/* Radio + checkbox — akcent marki (metody płatności, zgody) */
.wc-block-checkout input[type="radio"],
.wc-block-checkout input[type="checkbox"] { accent-color: var(--sh-red, #CC1B1B); }

/* Pola tekstowe — czerwień marki TYLKO na focus (NIE na .is-active, bo w WC
   „is-active" = pole wypełnione, a nie aktywne — przez to wszystkie wypełnione
   pola miały czerwoną ramkę). */
.wc-block-checkout .wc-block-components-text-input input:focus,
.wc-block-checkout .wc-block-components-combobox input:focus {
  border-color: var(--sh-red, #CC1B1B) !important;
  box-shadow: 0 0 0 1px var(--sh-red, #CC1B1B);
}
.wc-block-checkout .wc-block-components-text-input input:focus + label {
  color: var(--sh-red, #CC1B1B);
}

/* Wybrana metoda płatności — czerwona ramka marki (makieta). Wymuszamy szerokość+styl,
   bo WC daje border-width:0 i sama zmiana koloru nic nie pokazuje. */
.wc-block-checkout .wc-block-components-radio-control__option-checked,
.wc-block-checkout .wc-block-components-radio-control-accordion-option--checked-option {
  border: 1px solid var(--sh-red, #CC1B1B) !important;
  background: var(--sh-white, #fff) !important;
  box-shadow: none !important; /* WC dokładał własny ring → podwójna ramka; zostaje tylko border */
}

/* Linki (Edytuj/Zmień/regulamin) — czerwień marki */
.wc-block-checkout a:not(.wc-block-components-button) { color: var(--sh-red, #CC1B1B); }

/* =====================================================================
   UJEDNOLICONY STYL PRZYCISKÓW CHECKOUT (.sh-addr-save, place order,
   shipping method picker "Wybierz punkt odbioru", coupon "Zastosuj")
   ===================================================================== */
/* SAM button — czerwone tło, padding, radius, border. */
.wc-block-checkout button.wc-block-components-button.contained,
.wc-block-checkout button.wc-block-components-button.wp-element-button,
.wc-block-checkout button.wc-block-components-checkout-place-order-button,
.wc-block-checkout .wc-block-components-totals-coupon__button,
.wc-block-checkout button.sh-addr-save,
.wc-block-cart button.wc-block-components-button.contained,
.wc-block-cart .wc-block-components-totals-coupon__button {
  background-color: var(--sh-red, #CC1B1B) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 6px !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  padding: 12px 22px !important;
  min-height: 44px !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
  transition: background-color .15s ease;
}
/* INNER span tekstu — tylko font/color, BEZ tła/paddingu/radius (inaczej button-w-buttonie). */
.wc-block-checkout button.wc-block-components-button .wc-block-components-button__text,
.wc-block-checkout button.wc-block-components-checkout-place-order-button .wc-block-components-button__text,
.wc-block-checkout .wc-block-components-totals-coupon__button .wc-block-components-button__text,
.wc-block-cart button.wc-block-components-button .wc-block-components-button__text,
.wc-block-cart .wc-block-components-totals-coupon__button .wc-block-components-button__text {
  background: transparent !important;
  background-color: transparent !important;
  color: #fff !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1.2 !important;
  min-height: 0 !important;
  box-shadow: none !important;
}
.wc-block-checkout button.wc-block-components-button.contained:hover:not(:disabled),
.wc-block-checkout button.wc-block-components-checkout-place-order-button:hover:not(:disabled),
.wc-block-checkout .wc-block-components-totals-coupon__button:hover:not(:disabled),
.wc-block-checkout button.sh-addr-save:hover:not(:disabled),
.wc-block-cart button.wc-block-components-button.contained:hover:not(:disabled),
.wc-block-cart .wc-block-components-totals-coupon__button:hover:not(:disabled) {
  background-color: var(--sh-red-dark, #b01717) !important;
}
.wc-block-checkout button.wc-block-components-button:disabled,
.wc-block-checkout button.sh-addr-save:disabled,
.wc-block-cart button.wc-block-components-button:disabled {
  background-color: #E89E9E !important;
  cursor: not-allowed !important;
}
/* Place Order — ikonka kłódki (zachowana) */
.wc-block-checkout .wc-block-components-checkout-place-order-button::after {
  content: "\00a0\01F512";
  font-size: 0.85em;
}

/* Podsumowanie — kwota „Łącznie" w kolorze marki */
.wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-checkout-order-summary__title { color: var(--sh-black, #111); }
/* „Łącznie" — czarne i pogrubione jak w koszyku (nie czerwone) */
.wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value { color: var(--sh-black, #111) !important; font-weight: 800 !important; }

/* Spinner/akcenty ładowania w kolorze marki */
.wc-block-checkout .wc-block-components-spinner::after { border-top-color: var(--sh-red, #CC1B1B) !important; }

/* Spójność z koszykiem: rozmiary pól/etykiet (koszyk = 13px, radius 6px) */
.wc-block-checkout .wc-block-components-text-input input,
.wc-block-checkout .wc-block-components-text-input textarea,
.wc-block-checkout .wc-block-components-textarea textarea,
.wc-block-checkout .wc-block-components-combobox input,
.wc-block-checkout .wc-block-components-combobox-control input {
  font-size: 13px !important;
  border-radius: 6px !important;
}
.wc-block-checkout .wc-block-components-text-input label,
.wc-block-checkout .wc-block-components-combobox label { font-size: 13px !important; }
.wc-block-checkout .wc-block-components-checkbox__label,
.wc-block-checkout .wc-block-components-radio-control__label,
.wc-block-checkout .wc-block-components-radio-control__option-layout,
.wc-block-checkout .wc-block-components-totals-item,
.wc-block-checkout .wc-block-components-address-card { font-size: 14px !important; }

/* ===========================================================================
   Ujednolicenie z koszykiem (.sh-cart):
   Wszystkie typografia w order summary sidebarze checkout odzwierciedla koszyk.
   =========================================================================== */
/* Nazwa produktu: 16px / 700 (jak .sh-cart-name h3) */
.wc-block-checkout .wc-block-components-order-summary-item .wc-block-components-product-name,
.wc-block-checkout .wc-block-components-product-name a.sh-summary-name-link {
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}
/* Cena pozycji produktu: 17px / 700 (jak .sh-cart-price p) */
.wc-block-checkout .wc-block-components-order-summary-item__total-price,
.wc-block-checkout .wc-block-components-order-summary-item__total-price .wc-block-formatted-money-amount {
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}
/* Atrybuty wariantu (gramatura, smak) — czytelnie, jak .sh-cart-stock */
.wc-block-checkout .wc-block-components-product-details__name,
.wc-block-checkout .wc-block-components-product-details__value {
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
}
/* Opis (Mentalny podręcznik kandydata.) — drobny ale czytelny */
.wc-block-checkout .wc-block-components-product-metadata p {
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
}
/* Linie totals (Kwota, Dostawa): label 14/400, value 14/600 (jak koszyk) */
.wc-block-checkout .wc-block-components-totals-item:not(.wc-block-components-totals-footer-item) .wc-block-components-totals-item__label {
  font-size: 14px !important;
  font-weight: 400 !important;
}
.wc-block-checkout .wc-block-components-totals-item:not(.wc-block-components-totals-footer-item) .wc-block-components-totals-item__value {
  font-size: 14px !important;
  font-weight: 600 !important;
}
/* Total footer „Łącznie": label 16/700, value 17/700 (jak koszyk) */
.wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}
.wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value .wc-block-formatted-money-amount {
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}
/* Opis VAT pod Łącznie — drobny */
.wc-block-checkout .wc-block-components-totals-item__description,
.wc-block-checkout .wc-block-components-totals-footer-item-tax-value {
  font-size: 12px !important;
  font-weight: 400 !important;
}

/* Bug #1 (adres „Edytuj" nie zwija formularza): na tej instalacji blok WC pokazuje
   JEDNOCZEŚNIE kartę adresu (z „Edytuj") i pełny formularz, a natywne zwijanie nie działa
   (oba zostają widoczne, „Edytuj" nic nie robi). Robimy własną harmonijkę sterowaną klasą
   `sh-shipaddr-editing` na <body> (klasa na body jest odporna na re-render Reacta):
   - domyślnie (wracający klient z KARTĄ, brak edycji) → chowamy formularz, widać kartę = stan „zapisany",
   - edycja (po „Edytuj") → chowamy kartę, widać formularz + przycisk „Zapisz adres" (patrz mu-plugin sh-checkout-address-edit),
   - nowy klient (brak karty) → :has() nie łapie, formularz widać normalnie.
   Logikę JS (klasa na body, przycisk, walidacja, aktualizacja karty) dowozi mu-plugin. */
/* ADRES — 100% NATYWNY WooCommerce, ZERO naszych reguł chowających kartę/formularz.
   WAŻNE (czemu nie kombinujemy): formularz adresu jest ZAWSZE w DOM — WC zwija go dla adresu
   potwierdzonego przez RODZICA (height:0 + overflow:hidden + visibility:hidden) i pokazuje kartę.
   Każda nasza reguła `:has(.address-form)` łapała więc zawsze i chowała kartę, a `display:flex`
   na formularzu nie nadpisywał zwinięcia rodzica → sekcja wychodziła pusta. Dlatego NIC tu nie
   ruszamy: WC sam pokazuje kartę (potwierdzony, z „Edytuj") albo formularz (edycja). Harmonijka
   JS (sh-checkout-address-edit) pozostaje WYŁĄCZONA. */

/* Przycisk „Zapisz adres" (dorzucany JS-em na końcu formularza adresu) + potwierdzenie. */
/* Wrapper akcji adresu — własny pełny wiersz w flex-wrap formularza WC (żeby przycisk i
   komunikat nie wciskały się w rząd z polem). */
.sh-addr-actions { flex: 1 0 100%; width: 100%; margin-top: 14px; }
.sh-addr-save { display: inline-flex; align-items: center; gap: 8px; background: var(--sh-red, #CC1B1B); color: #fff; border: 0; border-radius: 8px; padding: 10px 18px; font: 600 14px/1 'Poppins', sans-serif; cursor: pointer; }
.sh-addr-save:hover { background: #b01616; }
.sh-addr-saved-msg { margin-top: 10px; color: #0a6a4a; font: 600 13px/1.4 'Poppins', sans-serif; }

/* Płatność za pobraniem (COD) — chowamy nieaktualne banery płatności (np. Stripe „Dane płatności
   są niekompletne"). Klasę sh-cod-payment na <body> ustawia JS (sh-stripe-pl-strings) gdy wybrane
   jest COD. NIE usuwamy węzłów Reacta — tylko chowamy CSS-em (bezpieczne). */
body.sh-cod-payment .wc-block-checkout__payment-method .wc-block-components-notice-banner { display: none !important; }

/* Przycisk zamknięcia (X) powiadomień na kasie/koszyku — UKRYTY. Renderował się jako czerwony
   kwadrat 44×44, bo ma klasy .wc-block-components-button.wp-element-button i łapał go ogólny
   styl czerwonych CTA (red bg + min-height:44px + radius). Komunikaty błędów i tak znikają po
   poprawieniu danych, więc dismiss jest zbędny. */
.wc-block-checkout .wc-block-components-notice-banner__dismiss,
.wc-block-cart .wc-block-components-notice-banner__dismiss {
  display: none !important;
}

/* Tytuł podsumowania jak w koszyku (16px/700) */
.wc-block-checkout .wc-block-components-checkout-order-summary__title { font-size: 16px !important; font-weight: 700 !important; }

/* Podsumowanie — pozycje (ujednolicone z .sh-cart): 16/700 jak h3 nazwy w koszyku */
.wc-block-checkout .wc-block-components-order-summary-item .wc-block-components-product-name {
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}
.wc-block-checkout .wc-block-components-product-metadata__description { display: none !important; }
.wc-block-checkout .wc-block-components-order-summary-item { padding: 12px 0 !important; }
.wc-block-checkout .wc-block-components-order-summary-item__image img {
  width: 52px !important;
  height: auto !important;
  border-radius: 6px;
}
/* Klikalne zdjęcie produktu w order-summary (sh-summary-img-link dodawany przez JS). */
.wc-block-checkout .wc-block-components-order-summary-item__image a.sh-summary-img-link {
  display: block;
  position: relative;
  width: 52px;
  height: 52px;
  border-radius: 6px;
  /* overflow: visible — żeby badge (quantity) widoczna była poza obrazkiem.
     Rounded corners obrazka utrzymuje border-radius na samej img poniżej. */
  overflow: visible;
  transition: transform .15s ease, box-shadow .15s ease;
  flex-shrink: 0;
}
.wc-block-checkout .wc-block-components-order-summary-item__image a.sh-summary-img-link:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(17,17,17,.12);
}
.wc-block-checkout .wc-block-components-order-summary-item__image a.sh-summary-img-link img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  border-radius: 6px;
}
/* Quantity badge w środku linku — pozostaje na swoim miejscu nad obrazkiem */
.wc-block-checkout .wc-block-components-order-summary-item__image a.sh-summary-img-link .wc-block-components-order-summary-item__quantity {
  z-index: 2;
}
/* Klikalna nazwa produktu (h3 → wrap w link via JS) */
.wc-block-checkout .wc-block-components-product-name a.sh-summary-name-link {
  color: inherit;
  text-decoration: none;
  transition: color .15s ease;
}
.wc-block-checkout .wc-block-components-product-name a.sh-summary-name-link:hover {
  color: var(--sh-red, #CC1B1B);
}
.wc-block-checkout .wc-block-components-order-summary-item__total-price { font-size: 17px !important; font-weight: 700 !important; }
.wc-block-checkout .wc-block-components-order-summary-item__quantity { font-size: 11px !important; }

/* =========================================================================
   CHROME blokowej kasy (mu-plugin sh-block-checkout-chrome): hero + stepper + trust
   ========================================================================= */

/* --- Ciemny hero nad kasą (pełna szerokość, treść wyśrodkowana — jak makieta) --- */
.sh-co-hero {
  background: radial-gradient(130% 150% at 0% 0%, #18201c 0%, #0f1011 55%, #0b0b0c 100%);
  color: #fff;
  margin: 0;
  padding: 40px 0 36px;
}
.sh-co-hero__inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 24px;
  box-sizing: border-box;
}
.sh-co-hero__back {
  display: block;
  width: fit-content;
  font-size: 13px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.7) !important;
  text-decoration: none;
  margin-bottom: 20px;
}
.sh-co-hero__back:hover { color: #fff !important; }
.sh-co-hero__kicker {
  display: inline-block;
  font-family: 'Poppins', sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--sh-red, #CC1B1B);
  margin-bottom: 8px;
}
.sh-co-hero__title {
  font-family: 'Poppins', sans-serif;
  font-size: var(--sh-fs-3xl, 2.25rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
  margin: 0 0 10px;
  color: #fff;
}
.sh-co-hero__sub {
  font-size: var(--sh-fs-md, 1.125rem);
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.7);
  margin: 0 0 24px;
  max-width: 620px;
}
.sh-co-hero__sub strong { color: #fff; }

/* --- Pasek postępu KOSZYK ✓ → PŁATNOŚĆ → POTWIERDZENIE --- */
.sh-co-steps {
  display: flex;
  align-items: center;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  flex-wrap: wrap;
}
.sh-co-step {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'Poppins', sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.45);
}
.sh-co-step:not(:last-child)::after {
  content: "";
  width: 28px;
  height: 2px;
  margin: 0 14px;
  background: rgba(255, 255, 255, 0.18);
  border-radius: 2px;
}
.sh-co-step__dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.6);
  font-size: 12px;
  font-weight: 700;
}
.sh-co-step.is-done { color: rgba(255, 255, 255, 0.8); }
.sh-co-step.is-done .sh-co-step__dot { background: #1f7a4d; color: #fff; }
.sh-co-step.is-active { color: #fff; }
.sh-co-step.is-active .sh-co-step__dot { background: var(--sh-red, #CC1B1B); color: #fff; }

@media (max-width: 600px) {
  .sh-co-hero { padding: 26px 0 24px; }
  .sh-co-hero__title { font-size: 1.5rem; }
  .sh-co-hero__sub { font-size: 0.95rem; }
  .sh-co-step__label { display: none; }
  .sh-co-step:not(:last-child)::after { width: 18px; margin: 0 8px; }
}

/* --- Karta zaufania w prawej kolumnie (1:1 jak koszyk: plakietki + lista atutów) ---
   Renderowana po bloku, przenoszona JS-em do sidebara. Domyślnie ukryta (brak migania
   na dole); widoczna dopiero gdy znajdzie się w prawej kolumnie — bez własnej ramki,
   oddzielona linią od podsumowania (jak trust w koszyku). */
.sh-co-aside { box-sizing: border-box; }
.sh-co-aside__card { display: none; }
.wc-block-checkout .wc-block-checkout__sidebar .sh-co-aside__card {
  display: block;
  width: auto;
  background: transparent;
  border: 0;
  border-top: 1px solid var(--sh-border, #E0DDD8);
  border-radius: 0;
  padding: 18px 0 0;
  margin-top: 18px;
  box-sizing: border-box;
}
/* Plakietki płatności (VISA · MC · BLIK · Stripe) — jak w koszyku */
.sh-co-pay {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-bottom: 16px;
}
.sh-co-pay__b {
  padding: 4px 10px;
  border: 1px solid var(--sh-border, #E0DDD8);
  border-radius: 4px;
  font-family: 'Poppins', sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--sh-muted, #666);
  background: var(--sh-white, #fff);
}
/* Lista atutów — jak .sh-cart-trust */
.sh-co-trustlist { list-style: none; margin: 0; padding: 0; }
.sh-co-trustlist li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
  font-size: 13px;
  color: var(--sh-ink, #333);
}
.sh-co-trustlist svg {
  width: 16px; height: 16px;
  stroke: var(--sh-muted, #666); stroke-width: 1.8; fill: none;
  stroke-linecap: round; stroke-linejoin: round;
  flex-shrink: 0;
}

/* Przycisk „Wybierz punkt odbioru" (Furgonetka) — czerwony jak nasze CTA (był ciemny) */
.wc-block-checkout .furgonetka-wc-blocks-pickup-point-block-container .wc-block-components-button.contained,
.wc-block-checkout .furgonetka-wc-blocks-pickup-point-block-container button.wc-block-components-button.contained {
  background-color: var(--sh-red, #CC1B1B) !important;
  color: #fff !important;
  border-radius: 6px !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 600 !important;
}
.wc-block-checkout .furgonetka-wc-blocks-pickup-point-block-container .wc-block-components-button.contained:hover {
  background-color: #b01717 !important;
}

/* Odstęp nad treścią wybranej metody płatności (np. pole „Kod BLIK") */
.wc-block-checkout .wc-block-components-radio-control-accordion-content { margin-top: 10px !important; }

/* P24 BLIK level 0 (kod w kasie): opis + pole „Kod BLIK" + checkbox zgody renderują się
   w .p24-payment-container z zerowymi marginesami → wszystko się zlewa. Flex column + gap
   rozdziela też goły węzeł tekstowy z opisem (staje się anonimowym flex-itemem). */
.wc-block-checkout .p24-payment-container {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 10px 2px 4px;
}
.wc-block-checkout .p24-payment-container .p24-blik-code-input { margin: 0; }
.wc-block-checkout .p24-payment-container .p24-checkbox { margin: 0; line-height: 1.5; }

/* „Dodaj kupony" — przenosimy na sam dół podsumowania (domyślnie blok renderuje go
   między rabatem a dostawą; markup tego nie zmienia, więc robimy to flexem + order). */
.wc-block-checkout .wc-block-components-checkout-order-summary__content {
  display: flex;
  flex-direction: column;
}
.wc-block-checkout .wc-block-components-checkout-order-summary__content > .wp-block-woocommerce-checkout-order-summary-coupon-form-block {
  order: 99;
  margin-top: 8px;
}

/* Zgody: linki regulamin/polityka (czerwień marki) + znacznik „(wymagane)" */
.wc-block-checkout .sh-consent-link { color: var(--sh-red, #CC1B1B); text-decoration: underline; }
.wc-block-checkout .sh-consent-link:hover { color: #b01717; }
.wc-block-checkout .sh-req { color: var(--sh-red, #CC1B1B); font-weight: 600; font-size: 0.92em; white-space: nowrap; }

/* Błąd zgody na treści cyfrowe — POD checkboxem (zamiast górnego banera). Patrz mu-plugin
   sh-block-checkout-consents: relocateWaiverError() usuwa górny baner i wstawia ten komunikat. */
.wc-block-checkout .sh-waiver-err { margin: 6px 0 0; color: var(--sh-red, #CC1B1B); font: 600 13px/1.4 'Poppins', sans-serif; }
.wc-block-checkout .sh-waiver-box-err .wc-block-components-checkbox__input,
.wc-block-checkout .sh-waiver-box-err input[type="checkbox"] { outline: 2px solid var(--sh-red, #CC1B1B); outline-offset: 2px; }

/* Faktura B2B: pola NIP + nazwa firmy renderują się NATYWNIE w sekcji „Dodatkowe informacje
   o zamówieniu" (mu-plugin sh-block-checkout-invoice). Przełącznik „Chcę fakturę"
   (sh-checkout-invoice-toggle) i jego ukrywanie pól CSS-em USUNIĘTE 2026-07-01 (audyt kasy —
   DOM-hack przenoszący pola walczył z Reactem, powodował znikające sekcje). */

/* Mobile: WC renderuje DRUGIE podsumowanie jako „fill" w obszarze akcji (przy przycisku
   „Kupuję") obok sidebara → dublet (podsumowanie na początku i końcu). Ukrywamy fill —
   zostaje jedno podsumowanie (sidebar na górze). */
@media (max-width: 900px) {
  .wc-block-checkout .checkout-order-summary-block-fill-wrapper,
  .wc-block-checkout .wc-block-checkout__actions .wp-block-woocommerce-checkout-order-summary-block { display: none !important; }
}