/* wpins/terminy — sekcja „Terminy” (oś czasu + wypłaty + informacje). Tokeny marki, radius 0, WCAG.
   Statyczna (render.php, bez JS). Front + edytor. UNLAYERED (bije prozowe h2/h3/p z @layer components). */

.wpins-terminy { font-family: var(--font-wpins-ui); color: var(--color-wpins-text); }
.wpins-terminy * { box-sizing: border-box; }

/* Nagłówek sekcji (etykieta + nagłówek z kreską + intro) — spójny z kreatorem. */
.wpins-terminy__head { margin-bottom: 26px; }
.wpins-terminy__eyebrow {
  display: block;
  font-family: var(--font-wpins-ui);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-wpins-accent-text);
}
.wpins-terminy__heading {
  display: inline-block;
  font-family: var(--font-wpins-heading);
  font-weight: 800;
  line-height: 1.05;
  font-size: clamp(28px, 3.6vw, 40px);
  color: var(--color-wpins-heading);
  border-bottom: 2px solid var(--color-wpins-accent);
  padding-bottom: 7px;
  margin: 6px 0 0;
}
.wpins-terminy__intro { color: var(--color-wpins-text-muted); margin: 14px 0 0; }

/* Dwie kolumny: oś czasu + prawa szpalta. */
.wpins-terminy__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 26px; }

/* Oś czasu */
.wpins-terminy__rail { border-left: 2px solid var(--color-wpins-border); padding-left: 24px; margin-left: 6px; }
.wpins-terminy__ev { position: relative; padding-bottom: 26px; }
.wpins-terminy__ev:last-child { padding-bottom: 0; }
.wpins-terminy__ev::before {
  content: "";
  position: absolute;
  left: -31px;
  top: 6px;
  width: 12px;
  height: 12px;
  background: var(--color-wpins-canvas);
  border: 2px solid var(--color-wpins-accent);
}
.wpins-terminy__ev-date {
  font-family: var(--font-wpins-ui);
  font-size: 13px;
  font-weight: 700;
  color: var(--color-wpins-accent-text);
  display: block;
  font-variant-numeric: tabular-nums;
}
.wpins-terminy__ev-title {
  display: block;
  font-family: var(--font-wpins-heading);
  font-size: 18px;
  font-weight: 700;
  margin: 3px 0;
  color: var(--color-wpins-heading);
}
.wpins-terminy__ev-desc { margin: 0; font-size: 15px; color: var(--color-wpins-text-muted); }

/* Prawa szpalta: podnagłówki + notki + daty wypłat */
.wpins-terminy__subhead {
  font-family: var(--font-wpins-heading);
  font-weight: 700;
  font-size: 20px;
  line-height: 1.15;
  color: var(--color-wpins-heading);
  margin: 0 0 4px;
}
.wpins-terminy__subhead + .wpins-terminy__note { margin-top: 0; }
.wpins-terminy__side > .wpins-terminy__subhead:not(:first-child) { margin-top: 26px; }
.wpins-terminy__note { font-size: 14.5px; color: var(--color-wpins-text-muted); margin: 0 0 4px; }
.wpins-terminy__paydates { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.wpins-terminy__paydate {
  font-family: var(--font-wpins-ui);
  font-size: 13px;
  padding: 6px 11px;
  background: var(--color-wpins-alt);
  color: var(--color-wpins-text);
  border: 1px solid var(--color-wpins-border);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* ── Edytor: proste karty zdarzeń/informacji (inline + reorder ↑↓, usuń) ── */
.wpins-terminy-edit__head { margin-bottom: 12px; }
.wpins-terminy-edit__label {
  font-family: var(--font-wpins-ui);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-wpins-text-muted);
  margin: 18px 0 8px;
}
.wpins-terminy-edit__card {
  border: 1px solid var(--color-wpins-border);
  border-left: 3px solid var(--color-wpins-accent);
  padding: 10px 12px 4px;
  margin: 0 0 10px;
  background: var(--color-wpins-canvas);
}
.wpins-terminy-edit__bar { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.wpins-terminy-edit__bar strong { font-family: var(--font-wpins-heading); font-weight: 700; font-size: 14px; color: var(--color-wpins-heading); }
.wpins-terminy-edit__tools { display: inline-flex; gap: 2px; flex: 0 0 auto; }
.wpins-terminy-edit__tbtn.wpins-terminy-edit__tbtn { min-width: 30px; justify-content: center; }
.wpins-terminy-edit__add { margin: 2px 0 8px; }
