/* public/css/sceny/windykacja.css — scena „Tysiąc spraw w jeden poranek.” (/windykacja, sekcja #tysiac-spraw, spec §7.8).
   HTML+CSS = stan końcowy (scena 6: raport dla wierzyciela, kafle spraw w torach po nakazach); oś z js/sceny/windykacja.js
   tylko do niego dochodzi. Dwa układy: plac 4:3 (tory po lewej, karta sceny po prawej) i ≤ 720 px 4:5 (tory u góry,
   karta pod nimi). Rozmiary w cqi (plac ma container-type), czcionki z dolnym progiem w px. Ruch tylko transform/opacity/filter. */

.sc-windykacja { --wk-t: 3.5cqi; --wk-g: 0.85cqi; --wk-pas: 1.4cqi; }

/* ——— nagłówek: źródło paczki i licznik spraw ——— */
.sc-windykacja-naglowek { left: 4cqi; right: 4cqi; top: 3.6cqi; z-index: 3; display: flex; justify-content: space-between; align-items: flex-start; gap: 3cqi; }
.sc-windykacja-zrodlo { display: grid; justify-items: start; gap: 0.5cqi; min-width: 0; }
.sc-windykacja-zrodlo .sc-tytul { margin-top: 0.4cqi; }
.sc-windykacja-import { position: relative; }
.sc-windykacja-impuls { position: absolute; inset: -1px; border-radius: inherit; border: 2px solid var(--accent-l); opacity: 0; pointer-events: none; }
.sc-windykacja-suma { display: grid; justify-items: end; gap: 0.6cqi; text-align: right; }

/* ——— liczydło: okienko na cyfrę, taśma cyfr (u góry wartość końcowa) ——— */
.sc-windykacja-liczydlo { display: inline-flex; font-variant-numeric: tabular-nums; }
.sc-windykacja-cyfra { display: inline-block; height: 1.1em; line-height: 1.1; overflow: hidden; vertical-align: top; text-align: center; }
.sc-windykacja-tasma { display: block; }
.sc-windykacja-odstep { display: inline-block; width: 0.22em; }

/* ——— tory: EPU (6 × 8; ≤ 720 px 8 × 6) po lewej, tryb zwykły i „do decyzji” w prawej kolumnie ——— */
.sc-windykacja-tory {
  left: 4cqi; top: 17cqi; z-index: 2; display: grid; grid-template-columns: auto auto; grid-template-rows: auto 1fr; align-items: start;
  column-gap: 2.2cqi; row-gap: 2.2cqi;
}
.sc-windykacja-pas { position: relative; padding: var(--wk-pas); border-radius: 1.6cqi; }
.sc-windykacja-pas-epu { grid-row: span 2; }
.sc-windykacja-pas-tlo { position: absolute; inset: 0; border-radius: inherit; background: var(--n-szklo); box-shadow: inset 0 0 0 1px var(--n-brzeg); }
.sc-windykacja-pas-gl { position: relative; margin: 0 0 1.2cqi; display: grid; gap: 0.4cqi; }
.sc-windykacja-pas-liczba { font-family: var(--fd); font-weight: 600; font-size: max(16px, 3cqi); line-height: 1; color: #fff; }
.sc-windykacja-pas-nazwa { font-size: max(12px, 1.55cqi); line-height: 1.2; color: var(--n-szary); }
.sc-windykacja-pas-epu .sc-windykacja-pas-nazwa { color: var(--accent-l); }
.sc-windykacja-pas-decyzja .sc-windykacja-pas-nazwa { color: var(--n-uwaga); max-width: 12em; }
.sc-windykacja-siatka { position: relative; display: grid; grid-template-columns: repeat(6, var(--wk-t)); gap: var(--wk-g); }
.sc-windykacja-pas-zwykly .sc-windykacja-siatka { grid-template-columns: repeat(5, var(--wk-t)); }
.sc-windykacja-pas-decyzja .sc-windykacja-siatka { grid-template-columns: repeat(3, var(--wk-t)); }

/* kafel = ok. 17 spraw; warstwy (tor → pozew → nakaz) leżą jedna na drugiej, oś odsłania je przezroczystością */
.sc-windykacja-kafel {
  position: relative; display: block; width: var(--wk-t); height: var(--wk-t); border-radius: 0.7cqi;
  background: var(--n-szklo2); box-shadow: inset 0 0 0 1px var(--n-brzeg);
}
.sc-windykacja-kafel > i { position: absolute; inset: 0; border-radius: inherit; }
.sc-windykacja-pas-epu .sc-windykacja-k-tor { background: rgba(244, 122, 32, 0.4); }
.sc-windykacja-pas-zwykly .sc-windykacja-k-tor { background: rgba(200, 210, 228, 0.62); }
.sc-windykacja-pas-decyzja .sc-windykacja-k-tor { background: radial-gradient(circle, var(--n-uwaga) 0 26%, transparent 29%); box-shadow: inset 0 0 0 2px var(--n-uwaga); }
.sc-windykacja-k-pozew {
  background:
    linear-gradient(rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.85)) 50% 33% / 56% 13% no-repeat,
    linear-gradient(rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.85)) 50% 64% / 56% 13% no-repeat,
    var(--accent);
}
.sc-windykacja-k-nakaz { background: linear-gradient(155deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0) 60%), var(--n-ok); box-shadow: 0 0 1.1cqi rgba(74, 222, 128, 0.5); }
.sc-windykacja-kafel > .sc-windykacja-cel { inset: -40%; border-radius: 1.1cqi; border: 2px solid #fff; box-shadow: 0 0 1.6cqi var(--n-blask); opacity: 0; }
.sc-windykacja-kafel > .sc-windykacja-puls { inset: -25%; border-radius: 1.1cqi; border: 2px solid var(--accent-l); opacity: 0; }
.sc-windykacja-fala-okno { position: absolute; inset: -0.4cqi; overflow: hidden; pointer-events: none; border-radius: 0.8cqi; }
.sc-windykacja-fala {
  position: absolute; top: 0; bottom: 0; left: 0; width: 40%; opacity: 0;
  background: linear-gradient(90deg, rgba(74, 222, 128, 0), rgba(74, 222, 128, 0.42) 50%, rgba(74, 222, 128, 0));
}

/* ——— karty scen (po prawej; ≤ 720 px pod torami): jedna komórka siatki, widać jedną naraz ——— */
.sc-windykacja-panel { left: 61.5cqi; right: 4cqi; top: 17cqi; bottom: 4cqi; z-index: 2; display: grid; }
.sc-windykacja-panel > * { grid-area: 1 / 1; align-self: start; min-width: 0; }
.sc-windykacja-karta { position: relative; display: grid; justify-items: start; gap: 1.2cqi; opacity: 0; visibility: hidden; }
.sc-windykacja-karta .sc-tytul { margin-top: 0; }
.sc-windykacja-kanaly { display: flex; gap: 1cqi; }
.sc-windykacja-pasek { position: relative; display: block; justify-self: stretch; height: 0.9cqi; min-height: 4px; border-radius: 1cqi; background: var(--n-szklo2); overflow: hidden; }
.sc-windykacja-pasek i { position: absolute; inset: 0; background: var(--accent); transform-origin: left center; }
.sc-windykacja-pasek-ok i { background: var(--n-ok); transform: scaleX(0.83); }
.sc-windykacja-przypis { font-size: max(12px, 1.5cqi); color: var(--n-szary); }

.sc-windykacja-legenda { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.1cqi; }
.sc-windykacja-legenda li { display: flex; align-items: center; gap: 1.2cqi; font-size: max(12px, 1.6cqi); line-height: 1.25; }
.sc-windykacja-legenda i { flex: none; width: 2.4cqi; height: 2.4cqi; min-width: 10px; min-height: 10px; border-radius: 0.6cqi; }
.sc-windykacja-wz-epu { background: rgba(244, 122, 32, 0.55); }
.sc-windykacja-wz-zwykly { background: rgba(200, 210, 228, 0.62); }
.sc-windykacja-wz-decyzja { background: radial-gradient(circle, var(--n-uwaga) 0 26%, transparent 29%); box-shadow: inset 0 0 0 2px var(--n-uwaga); }

/* stos pozwów: trzy arkusze pod spodem, na wierzchu pozew z sygnaturą */
.sc-windykacja-stos { position: relative; display: block; justify-self: stretch; height: 15cqi; min-height: 74px; margin: 0.8cqi 0 0.6cqi; }
.sc-windykacja-arkusz { position: absolute; left: 6%; right: 6%; top: 0; bottom: 0; border-radius: 1cqi; background: #d9dde5; box-shadow: 0 0.8cqi 2cqi rgba(0, 0, 0, 0.35); }
.sc-windykacja-arkusz:nth-child(1) { rotate: -5deg; background: #b9bfca; }
.sc-windykacja-arkusz:nth-child(2) { rotate: 3.5deg; background: #c9ced8; }
.sc-windykacja-arkusz:nth-child(3) { rotate: -1.5deg; }
.sc-windykacja-arkusz-gora {
  left: 0; right: 0; background: var(--n-tekst); color: var(--n-tlo); padding: 1.6cqi 1.8cqi; display: grid; align-content: start; gap: 0.5cqi;
  font-size: max(12px, 1.5cqi); line-height: 1.25;
}
.sc-windykacja-arkusz-gora .sc-mono { color: var(--accent-x, #a8500b); }
.sc-windykacja-sygn { font-family: var(--fd); font-weight: 600; font-size: max(14px, 2.1cqi); }
.sc-windykacja-wynik { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0.6cqi 1.4cqi; }
.sc-windykacja-opis { font-size: max(12px, 1.7cqi); color: var(--n-tekst); }

/* oś statusów jednej sprawy: pionowa w karcie po prawej, pozioma ≤ 720 px */
.sc-windykacja-strony { font-size: max(12px, 1.55cqi); color: var(--n-szary); margin-top: -0.6cqi; }
.sc-windykacja-os { list-style: none; margin: 0.6cqi 0 0; padding: 0; display: grid; gap: 2.2cqi; justify-self: stretch; }
.sc-windykacja-os li { position: relative; padding-left: 3.8cqi; display: grid; gap: 0.3cqi; }
.sc-windykacja-os b { font-weight: 600; font-size: max(12px, 1.6cqi); line-height: 1.2; color: var(--n-tekst); }
.sc-windykacja-os li:last-child b { color: var(--accent-l); }
.sc-windykacja-os span { font-family: var(--fm); font-size: max(10px, 1.35cqi); letter-spacing: 0.06em; color: var(--n-szary); }
.sc-windykacja-wezel {
  position: absolute; left: 0; top: 0.1cqi; width: 2cqi; height: 2cqi; min-width: 9px; min-height: 9px; border-radius: 50%;
  background: var(--accent); box-shadow: 0 0 0 0.5cqi rgba(244, 122, 32, 0.25);
}
.sc-windykacja-os li:last-child .sc-windykacja-wezel { background: var(--accent-l); box-shadow: 0 0 1.4cqi var(--n-blask); }
.sc-windykacja-odcinek { position: absolute; left: calc(max(1cqi, 4.5px) - 1px); top: 2.6cqi; bottom: -2cqi; width: 2px; background: var(--accent); opacity: 0.7; transform-origin: center top; }

/* raport dla wierzyciela: stan końcowy sceny (widoczny bez JS) */
.sc-windykacja-raport { position: relative; display: grid; gap: 1.4cqi; }
.sc-windykacja-kafle { display: grid; gap: 1.1cqi; }
.sc-windykacja-rk { display: grid; grid-template-columns: 9.5cqi minmax(0, 1fr); align-items: center; column-gap: 1.6cqi; padding: 1.5cqi 2cqi; }
.sc-windykacja-rk > span:last-child { font-size: max(12px, 1.6cqi); line-height: 1.2; color: var(--n-tekst); }
.sc-windykacja-rk .sc-liczba { font-size: max(20px, 3.8cqi); }
.sc-windykacja-rk-akcent { border-color: var(--accent); }
.sc-windykacja-rk-akcent .sc-liczba { color: var(--accent-l); }

/* ——— telefon: plac 4:5, tory u góry na całą szerokość, karta sceny pod nimi ——— */
@media (max-width: 720px) {
  .sc-windykacja { --wk-t: 4.9cqi; --wk-g: 1.15cqi; --wk-pas: 2.4cqi; }
  .sc-windykacja-naglowek { left: 5cqi; right: 5cqi; top: 4.6cqi; }
  .sc-windykacja-tory { left: 5cqi; right: 5cqi; top: 23cqi; column-gap: 2.4cqi; row-gap: 2.4cqi; grid-template-columns: auto minmax(0, 1fr); }
  .sc-windykacja-pas { border-radius: 2.6cqi; }
  .sc-windykacja-pas-epu .sc-windykacja-siatka { grid-template-columns: repeat(8, var(--wk-t)); }
  .sc-windykacja-kafel { border-radius: 1.1cqi; }
  .sc-windykacja-pas-gl { margin-bottom: 1.8cqi; }
  .sc-windykacja-panel { left: 5cqi; right: 5cqi; top: 82cqi; bottom: 4.6cqi; }
  .sc-windykacja-karta { gap: 1.6cqi; }
  .sc-windykacja-k3 { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: center; column-gap: 3cqi; }
  .sc-windykacja-stos { height: 25cqi; margin: 0; }
  .sc-windykacja-arkusz-gora { padding: 2.2cqi 2.4cqi; }
  .sc-windykacja-os { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2.4cqi; margin-top: 0.4cqi; }
  .sc-windykacja-os li { padding: 4.6cqi 0 0; }
  .sc-windykacja-wezel { width: 3cqi; height: 3cqi; top: 0; }
  .sc-windykacja-odcinek { left: 3.8cqi; right: -1.8cqi; top: calc(1.5cqi - 1px); bottom: auto; width: auto; height: 2px; transform-origin: left center; }
  .sc-windykacja-kafle { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.8cqi; }
  .sc-windykacja-rk { grid-template-columns: auto minmax(0, 1fr); column-gap: 2.4cqi; padding: 2cqi 2.6cqi; }
  .sc-windykacja-rk .sc-liczba { font-size: max(20px, 6.4cqi); }
}