/* loty.css — strona „Loty” sezonu (Z137 E12-B4, makieta docs/obsidian/08-Wiedza/mockupy/strony-pzhgp/e12/loty.html).
   Ładowana przez MetaStrony stron Loty / Plan lotów, PO public.css. Tokeny (--panel, --line, --acc…) z jednostki/skórki;
   żadnych kolorów na sztywno. Wiersz ma dwa układy wybierane SZEROKOŚCIĄ KOLUMNY (container query), nie ekranu:
   szeroki (Nr | Miejsce | Data | km | Kat. | Listy | ›) i zwarty (telefon, wąska kolumna: dwa piętra w wierszu). */

/* ============ szukajka: ~340 px na komputerze (W157), nie na całą szerokość ============ */
.lt-szuk .listbar { margin: 4px 0 14px; gap: 8px; }
.lt-szuk .listbar .search { flex: 0 1 340px; min-width: 0; }
.lt-szuk .listbar .search input { min-height: 40px; font-size: .95rem; min-width: 0; text-overflow: ellipsis; }
.lt-szuk .listbar .chip-toggle { min-height: 40px; }
@media (max-width: 599px) {
    .lt-szuk .listbar .search { flex: 1 1 100%; }
    .lt-szuk .listbar .chip-toggle { flex: 1 1 100%; justify-content: center; }
}

/* ============ kolumny: dorosłe i młode obok siebie (D17) ============ */
.lt-siatka { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; align-items: start; }
.lt-jedna .lt-siatka { grid-template-columns: minmax(0, 760px); }
.lt-kol { container: ltk / inline-size; min-width: 0; }
.lt-h { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 8px; margin: 0 0 6px; font-size: 1.1rem; }
.lt-h span { font-size: .85rem; font-weight: 500; color: var(--dim); }
.lt-lista { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }

/* przełącznik telefonu: tylko wąski ekran */
.lt-tel { display: none; }
.lt-cnt { font-weight: 500; font-size: .85rem; color: var(--dim); margin-left: 4px; }
.lt-tel .seg-btn[aria-selected="true"] .lt-cnt { color: var(--text); }
@media (max-width: 899px) {
    .lt-siatka { grid-template-columns: minmax(0, 1fr); }
    .lt-tel { display: block; margin-bottom: 10px; }
    .lt-tel .seg { margin-top: 0; }
    .lt-tel .seg-btn { min-width: 0; flex: 1 1 0; }
    .lt-tel { max-width: 100%; }
    .lt-tel .seg { display: flex; }
    .lt-kolumny[data-tel="d"] .lt-kol[data-kol="m"], .lt-kolumny[data-tel="m"] .lt-kol[data-kol="d"] { display: none; }
    /* tytuł kolumny powtarza przełącznik — na telefonie tylko podsumowanie */
    .lt-kolumny:not(.lt-jedna) .lt-h { font-size: .9rem; }
}

/* ============ wiersz: układ szeroki ============ */
.lt { display: grid; grid-template-columns: 28px minmax(0, 1fr) 42px 80px 40px 96px 14px; gap: 8px; align-items: center;
      padding: 8px 12px; border-top: 1px solid var(--line); font-size: .95rem; color: var(--text); min-height: 44px; }
.lt-lista > .lt:first-child { border-top: 0; }
.lt .nr { font-weight: 800; text-align: right; font-variant-numeric: tabular-nums; }
.lt .msc { min-width: 0; font-weight: 700; overflow-wrap: anywhere; }
.lt .d, .lt .km, .lt .kat { color: var(--dim); font-variant-numeric: tabular-nums; }
.lt .km { text-align: right; white-space: nowrap; }
.lt .ls { font-size: .85rem; color: var(--dim); text-align: right; line-height: 1.2; }
.lt .ch { font-size: 1.35rem; line-height: 1; color: var(--acc); }
.lt .uw { display: block; font-weight: 500; font-size: .82rem; color: var(--dim); }
.lt .meta-tel { display: none; color: var(--dim); font-weight: 500; font-size: .85rem; margin-left: .3em; }
.lt .tag { font-size: .75rem; font-weight: 700; border-radius: 6px; padding: 1px 6px; margin-left: 6px; background: var(--panel-2); color: var(--dim); }
.lt .pliki { grid-column: 2 / -1; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: .88rem; color: var(--dim); }
.lt .pliki a { color: var(--acc); min-height: 32px; display: inline-flex; align-items: center; }

/* klikalny: kolor akcentu, strzałka, podświetlenie pod myszką */
.lt.kl .nr, .lt.kl .msc, .lt.kl .msc a { color: var(--acc); }
a.lt.kl:hover, .lt.kl:hover { background: var(--acc-tint); text-decoration: none; }
a.lt.kl:hover .msc { text-decoration: underline; }
a.lt.kl:focus-visible { outline-offset: -3px; }
.lt.kl .ls { color: var(--text); }

/* nieklikalny: szary wiersz, bez strzałki, z opisem */
.lt.nie { background: color-mix(in srgb, var(--panel-2) 50%, var(--panel)); color: var(--dim); }
.lt.nie .nr, .lt.nie .msc { color: var(--dim); font-weight: 600; }
.lt.nie .ls { font-style: italic; }
.lt.odw .msc { text-decoration: line-through; }

/* wyróżniony: najbliższy / dzisiejszy / trwający */
.lt.wyr { background: var(--acc-tint); box-shadow: inset 3px 0 0 var(--acc); }
.lt.wyr .ls { color: var(--acc); font-weight: 700; font-style: normal; }
.lt.live .ls::before { content: "● "; }

/* ============ wiersz: układ zwarty (wąska kolumna: telefon albo dwie kolumny na ~900 px) ============ */
@container ltk (max-width: 519px) {
    .lt { grid-template-columns: 28px minmax(0, 1fr) auto 14px; row-gap: 0; }
    .lt .d, .lt .kat { display: none; }
    .lt .km { grid-column: 3; }
    .lt .ls { grid-column: 2 / 4; grid-row: 2; text-align: left; }
    .lt .ch { grid-row: 1 / 3; grid-column: 4; }
    .lt .meta-tel { display: inline; }
    .lt .pliki { grid-column: 2 / -1; grid-row: 3; }
}

html[data-szablon="horyzont"] .lt-lista { border-radius: var(--r-lg, 12px); }