/* ============================================================================
   12e-kartoteki-transport-zakladki.css — kartoteka „Transport” w czterech zakładkach (18.10.2026, wzór: PROJEKT-OKIEN/artefakt/Kartoteki.html:
   .kr-segt, .kr-segp, .kr-hint, .kr-ftab). Zastępuje dawny pas „Transport i montaż” (.kr-pow).
   ----------------------------------------------------------------------------
   1. pasek zakładek nad listą: Kołowy · Morski · Samolotowy · Door to door (+ podzakładki Stawki port – port / Kontenery po prawej),
   2. tabele: lotnicza i stawki,
   3. okno pozycji: sekcja „Stawki morskie” kontenera i panel „Ograniczenia lotnicze”.
   Komputer i tablet tutaj; telefon: css/9-telefon/22-kartoteki-transport-zakladki.css (tylko :root[data-ui="mobile"]). Tokeny jak w całym programie.
   ============================================================================ */

/* === 1. PASEK ZAKŁADEK ========================================================================================== */
.kr-trz { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-2) var(--s-3); margin-bottom: var(--s-3); }
.kr-trz-zakl, .kr-trz-pod { gap: 3px; min-width: 0; padding: 3px; overflow-x: auto; border: 0; border-radius: var(--r); background: var(--surface-3); }
.kr-trz-zakl button, .kr-trz-pod button { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: var(--s-2); border: 0; border-radius: var(--r-sm); background: transparent; color: var(--text-muted); font-weight: var(--w-bold); white-space: nowrap; }
.kr-trz-zakl button:hover, .kr-trz-pod button:hover { background: color-mix(in srgb, var(--text) 6%, transparent); }
.kr-trz-zakl button.active, .kr-trz-pod button.active { background: var(--surface); box-shadow: 0 1px 2px color-mix(in srgb, var(--text) 10%, transparent); color: var(--text); }
.kr-trz-pod small { display: inline-block; min-width: var(--s-4); padding: 0 6px; border-radius: var(--r-pill); background: var(--surface); color: var(--text-muted); font-size: var(--t-xs); font-weight: var(--w-bold); line-height: var(--s-4); text-align: center; }
.kr-trz-pod button.active small { background: var(--accent); color: var(--on-accent); }
.kr-trz-hint { color: var(--text-muted); font-size: var(--t-sm); }
.kr-trz-hint b { color: var(--text); font-weight: var(--w-bold); }

/* === 2. TABELE ================================================================================================== */
.transport-air-table td .tiny { display: block; }
:root:not([data-ui="mobile"]) .transport-air-table { min-width: 1180px; }   /* dziesięć kolumn: na tablecie lista przewija się w bok, zamiast zgniatać nazwę jednostki */
:root:not([data-ui="mobile"]) .transport-air-table :is(th, td):first-child { min-width: 240px; }
.sea-rate-table .tiny { display: block; }
.kr-nw { white-space: nowrap; }
.sea-rate-parametry output { display: block; min-height: var(--h-control); padding: var(--s-2) 0; font-weight: var(--w-bold); }   /* Okno stawki: parametry kontenera tylko do odczytu */

/* === 3. OKNO POZYCJI: sekcja „Stawki morskie” ================================================================== */
.transport-stawki-przewijak { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r); }
.transport-stawki-tabela { width: 100%; min-width: 520px; }
.transport-stawki-tabela td .tiny { display: block; }
.transport-stawki-stopka { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-2) var(--s-3); margin-top: var(--s-2); }
.transport-stawki-stopka .tiny { color: var(--text-muted); }