/* Wygenerowane przez tools/wytnij-css.py z prototypu — nie edytuj recznie. */

/* ——— strona koszyka (12.08) ———
   Zrodlem prawdy jest ten sam localStorage co szuflada w naglowku ('in-koszyk'),
   wiec licznik przy torbie i ta strona nie moga sie rozjechac. Po podpieciu API
   sklepu podmien czytaj()/zapisz() tu i w szufladzie naraz. */
/* .in-article zwezalo tresc do 832px (szerokosc pod czytany tekst) — koszyk
   potrzebuje pelnej siatki, wiec siedzi w zwyklej .in-sec z wlasnym limitem */
#koszyk .in-wrap { max-width: 1120px; margin-inline: auto; }
/* strona ma wlasne reguly display, wiec atrybut hidden trzeba wymusic */
.in-koszyk[hidden], .in-koszyk-pusty[hidden] { display: none !important; }
.in-koszyk { display: grid; grid-template-columns: 1fr 340px; gap: 32px; align-items: start; }
.in-koszyk-lista { display: grid; gap: 14px; }
.in-koszyk-it { display: grid; grid-template-columns: 84px 1fr auto auto; gap: 16px; align-items: center;
  padding: 16px; border: 1px solid var(--brand-100, #E7E4EF); border-radius: 18px; background: var(--in-surface, #fff); }
.in-koszyk-it img { width: 84px; height: 84px; object-fit: cover; border-radius: 12px; display: block; }
.in-koszyk-it > span.ph { width: 84px; height: 84px; border-radius: 12px; background: var(--brand-50, #F2F0F7); display: block; }
.in-koszyk-it-t { font-weight: 600; color: var(--color-text, #241E2E); text-decoration: none; display: block; margin-bottom: 4px; }
.in-koszyk-it-t:hover { text-decoration: underline; }
.in-koszyk-it-m { font-size: 14px; color: var(--color-text-muted, #6B6478); }
.in-koszyk-qty { display: inline-flex; align-items: center; gap: 2px; border: 1px solid var(--brand-100, #E7E4EF); border-radius: 999px; padding: 2px; }
.in-koszyk-qty button { width: 30px; height: 30px; border: 0; background: none; border-radius: 999px; cursor: pointer;
  font-size: 17px; line-height: 1; color: var(--color-text, #241E2E); }
.in-koszyk-qty button:hover { background: var(--brand-50, #F2F0F7); }
.in-koszyk-qty span { min-width: 26px; text-align: center; font-variant-numeric: tabular-nums; font-weight: 600; }
.in-koszyk-it-p { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.in-koszyk-rm { border: 0; background: none; cursor: pointer; color: var(--color-text-muted, #6B6478); padding: 6px; border-radius: 8px; }
.in-koszyk-rm:hover { color: #B3261E; background: #FDEDEC; }
.in-koszyk-rm svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.in-koszyk-sum { position: sticky; top: 110px; padding: 24px; border-radius: 20px;
  background: var(--brand-50, #F2F0F7); border: 1px solid var(--brand-100, #E7E4EF); display: grid; gap: 12px; }
.in-koszyk-sum-r { display: flex; justify-content: space-between; align-items: baseline; font-size: 18px; }
.in-koszyk-sum-r strong { font-size: 24px; font-variant-numeric: tabular-nums; }
.in-koszyk-note { font-size: 13px; color: var(--color-text-muted, #6B6478); margin: 0; }
.in-koszyk-cta, .in-koszyk-back { justify-content: center; text-align: center; }
.in-koszyk-pusty { padding: 8px 0 24px; display: grid; gap: 10px; justify-items: start; }
@media (max-width: 860px) {
  .in-koszyk { grid-template-columns: 1fr; }
  .in-koszyk-sum { position: static; }
  .in-koszyk-it { grid-template-columns: 64px 1fr auto; grid-template-areas: "img tyt rm" "img qty cena"; row-gap: 10px; }
  .in-koszyk-it img, .in-koszyk-it > span.ph { grid-area: img; width: 64px; height: 64px; }
  .in-koszyk-it > div:not(.in-koszyk-qty) { grid-area: tyt; }
  .in-koszyk-qty { grid-area: qty; }
  .in-koszyk-it-p { grid-area: cena; text-align: right; }
  .in-koszyk-rm { grid-area: rm; align-self: start; }
}