/* Terminy — K14, task03.21 (styl per komponent — docs/podejscie-css.md). Punkt wyjścia: makieta K14
   (task01.31) — FeuerDS „Terminy" 7:6686 (desktop, 4 terminy), „Terminy mobile" 7:6628.
   Liczba kart = klasa kolumny siatki na karcie (2 → kol-6, 3 → kol-4, 4 → kol-3, 6 → kol-2).
   Tło białe, bez dolnej linii. Tablet (640–1023) bez projektu — układ mobile.
   Wartości px z Figmy zapisane w rem (baza 16). */

.terminy {
  max-width: 90rem;                       /* stop skali z task01.06 — jak inne sekcje */
  margin-inline: auto;
  padding-block: var(--odstep-8);         /* 64/64 (ramka mobile dół 68 — kanon 64) */
}

/* ---- Nagłówek: H2 + lead ---- */

.terminy-tytul {
  margin: 0;
  font-size: var(--tekst-32);             /* H2 32/44.8 ExtraBold */
  line-height: var(--interlinia-32);
  font-weight: var(--waga-najgrubsza);
}

.terminy-lead { margin: var(--odstep-3) 0 0; }   /* 24 pod H2; 16/22.4 z body */

/* ---- Karty ---- */

/* Desktop: karta to podsiatka 4 wierszy (data / etykieta / opis / linia + link) w wierszach
   siatki nadrzędnej — wiersz opisu ma jedną wysokość w całym rzędzie, więc linie leżą
   w jednej linii także przy opisach różnej długości. */
.terminy-pozycje {
  margin: var(--odstep-4) 0 0;            /* 32 pod leadem */
  padding: 0;
  list-style: none;
  row-gap: 0;                             /* odstępy wewnątrz karty ustawia sama karta */
}

.terminy-pozycja {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 4;
  row-gap: 0;
}

/* Data: pole 48 — dzień 32 Regular czerwony, pod nim miesiąc w mianowniku + rok 16 Regular
   (w Figmie jedno pole z interlinią 8 — położenie glifów odwzorowane po renderze, task01.31). */
.terminy-data {
  display: flex;
  flex-direction: column;
  height: 3rem;
  align-self: start;
}

.terminy-dzien {
  font-size: var(--tekst-32);
  line-height: 1.125rem;                  /* 18 — glify wystają z linii jak w renderze */
  font-weight: var(--waga-zwykla);
  color: var(--kolor-marki);
}

.terminy-miesiac {
  margin-top: 1.125rem;                   /* 18 — pole 48 przepełnione o 4 jak w renderze */
  font-size: var(--tekst-16);
  line-height: 1rem;
}

.terminy-etykieta {
  margin: var(--odstep-2) 0 0;            /* 16 pod polem daty */
  font-size: var(--tekst-20);             /* 20/28 Bold — kanon H4 */
  line-height: var(--interlinia-20);
  font-weight: var(--waga-gruba);
}

.terminy-opis { margin: var(--odstep-2) 0 0; }   /* 16 pod etykietą; 16/22.4 z body */

/* Linia 1 px (--kolor-linii) 16 pod opisem, link akcji A43 „Zamów" 16 pod linią. */
.terminy-akcja {
  margin: var(--odstep-2) 0 0;
  padding-top: var(--odstep-2);
  border-top: 1px solid var(--kolor-linii);
  align-self: start;
}

/* Stan pusty (bieżące szkolenie bez terminów): przycisk A41 32 pod leadem, w miejscu rzędu kart. */
.terminy-pusty-akcja { margin: var(--odstep-4) 0 0; }

/* Edytor: komunikat w miejscu kart, gdy brak aktualnych terminów (na froncie blok się nie renderuje). */
.terminy-brak {
  margin: var(--odstep-4) 0 0;
  padding: var(--odstep-3);
  background: var(--kolor-tla-wyroznionego);
  color: var(--kolor-marki);
  font-size: var(--tekst-14);
  line-height: var(--interlinia-14);
  font-weight: var(--waga-gruba);
}

/* ---- Tablet i mobile: jedna kolumna (ramka 7:6628) ---- */

@media (max-width: 1023px) {
  .terminy-tytul {
    font-size: var(--tekst-28);           /* 28/39.2 ExtraBold */
    line-height: var(--interlinia-28);
  }

  .terminy-pozycje { row-gap: var(--odstep-4); }   /* karty jedna pod drugą co 32 */

  /* Bez podsiatki — nie ma rzędu do wyrównania. Dwie klasy: `.kol-N` siatki motywu (siatka.css, ładowana
     później) ma tę samą specyficzność i na tablecie przywracała rząd kart. */
  .terminy-pozycje > .terminy-pozycja {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
  }

  .terminy-data,
  .terminy-akcja { align-self: stretch; } /* w kolumnie flex „start" zwęża pole — linia na całą szerokość */

  .terminy-pusty-akcja .przycisk { width: 100%; }   /* przycisk stanu pustego na całą szerokość (decyzja 2026-09-26) */
}
