/* Branding MyCar (skill tekom-mycar-design): Open Sans, brand #2D78FF, rail #2D3746, tło #F4F5F7, 4px promienie, border-first. */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&display=swap');
:root {
  --mc-brand:#2D78FF; --mc-brand-hover:#1C65E8; --mc-brand-soft:rgba(45,120,255,.1);
  --mc-surface-app:#F4F5F7; --mc-surface-card:#FFFFFF; --mc-surface-dark:#2D3746; --mc-surface-dark-hover:rgba(255,255,255,.05);
  --mc-border:#E1E3E8; --mc-border-strong:#CBD5E1;
  --mc-text:#000; --mc-text-secondary:#969696; --mc-text-inverse:#fff;
  --mc-success:#54C732; --mc-success-soft:rgba(84,199,50,.12); --mc-warning:#F5BE23; --mc-warning-soft:rgba(245,190,35,.15);
  --mc-error:#FF0032; --mc-error-soft:rgba(255,0,50,.1);
  --mc-radius:4px; --mc-radius-lg:8px; --mc-radius-pill:32px;
  --mc-font:"Open Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --mc-shadow-pop:0 10px 20px rgba(0,0,0,.1);
  --rail:56px; --rail-open:212px; --topbar:48px;
}
* { box-sizing:border-box; }
html, body { height:100%; }
body { margin:0; font:13px/18px var(--mc-font); color:var(--mc-text); background:var(--mc-surface-app); }
button, input, select { font:inherit; }
[hidden] { display:none !important; }
svg.ik { width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex:none; }

/* ---- szkielet: rail + top bar + treść ---- */
.rail { position:fixed; left:0; top:0; bottom:0; width:var(--rail); background:var(--mc-surface-dark); color:#fff; display:flex; flex-direction:column; z-index:1200;   /* nad mapą Leaflet (kontrolki 1000) */ transition:width .15s ease; overflow:hidden; }
.rail.otwarty { width:var(--rail-open); box-shadow:var(--mc-shadow-pop); }
.rail .logo { height:var(--topbar); display:flex; align-items:center; padding:0 12px; gap:10px; cursor:pointer; border-bottom:1px solid rgba(255,255,255,.08); }
.rail .logo svg { width:32px; height:32px; color:#fff; flex:none; }
.rail .logo b { font-weight:600; font-size:15px; white-space:nowrap; opacity:0; transition:opacity .15s; }
.rail.otwarty .logo b { opacity:1; }
.rail nav { display:flex; flex-direction:column; padding:8px 0; gap:2px; }
.rail nav a { display:flex; align-items:center; gap:14px; height:44px; padding:0 18px; color:#fff; opacity:.7; text-decoration:none; white-space:nowrap; border-left:3px solid transparent; }
.rail nav a:hover { background:var(--mc-surface-dark-hover); opacity:1; }
.rail nav a.aktywny { opacity:1; border-left-color:var(--mc-brand); background:rgba(45,120,255,.18); }
.rail nav a span { opacity:0; transition:opacity .15s; }
.rail.otwarty nav a span { opacity:1; }
.rail .dol { margin-top:auto; padding:10px 0; font-size:10px; color:rgba(255,255,255,.5); white-space:nowrap; text-align:center; }
.rail .dol span { display:none; }
.rail.otwarty .dol { text-align:left; padding-left:18px; font-size:11px; }
.rail.otwarty .dol span { display:inline; }
.topbar { position:fixed; top:0; right:0; left:var(--rail); height:var(--topbar); background:var(--mc-surface-card); border-bottom:1px solid var(--mc-border); display:flex; align-items:center; padding:0 20px; gap:12px; z-index:1100; transition:left .15s ease; }
body.rail-otwarty .topbar { left:var(--rail-open); }
.topbar .tytul { font-weight:600; font-size:14px; }
.topbar .prawa { margin-left:auto; display:flex; align-items:center; gap:14px; }
.chip-konto { display:flex; align-items:center; gap:8px; }
.chip-konto .inicjal { width:28px; height:28px; border-radius:50%; background:var(--mc-brand-soft); color:var(--mc-brand); display:flex; align-items:center; justify-content:center; font-weight:600; font-size:12px; }
.chip-konto .email { font-size:12px; }
.btn-tekst { border:0; background:none; color:var(--mc-brand); cursor:pointer; display:flex; align-items:center; gap:6px; padding:6px 8px; border-radius:var(--mc-radius); }
.btn-tekst:hover { background:var(--mc-brand-soft); }
.btn-tekst svg.ik { width:16px; height:16px; }
.tresc { margin-left:var(--rail); padding:calc(var(--topbar) + 12px) 16px 40px; transition:margin-left .15s ease; }
body.rail-otwarty .tresc { margin-left:var(--rail-open); }
.widok[hidden] { display:none; }

/* ---- elementy ---- */
h1.naglowek-strony { font-size:20px; line-height:24px; font-weight:600; margin:0 0 12px; }
.pasek-narzedzi { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:12px; }
.btn { height:32px; padding:0 14px; border-radius:var(--mc-radius); border:1px solid var(--mc-border); background:#fff; cursor:pointer; display:inline-flex; align-items:center; gap:6px; }
.btn:hover { background:var(--mc-brand-soft); border-color:var(--mc-brand); }
.btn.glowny { background:var(--mc-brand); border-color:var(--mc-brand); color:#fff; font-weight:600; }
.btn.glowny:hover { background:var(--mc-brand-hover); }
.btn.ikona { width:32px; padding:0; justify-content:center; }
.btn svg.ik { width:16px; height:16px; }
select.pole, input.pole { height:32px; border:1px solid var(--mc-border); border-radius:var(--mc-radius); background:#fff; padding:0 8px; }
select.pole:focus, input.pole:focus { outline:none; box-shadow:inset 0 0 0 2px var(--mc-brand); }
.przelacznik { display:flex; align-items:center; gap:6px; font-size:12px; cursor:pointer; }
.kafelki { display:flex; flex-wrap:wrap; gap:8px; margin-left:8px; }
.kafelek { background:#fff; border:1px solid var(--mc-border); border-radius:var(--mc-radius); padding:4px 10px; min-width:auto; height:32px; cursor:pointer; user-select:none; display:flex; align-items:baseline; gap:8px; }
.kafelek:hover { border-color:var(--mc-brand); }
/* kafelki informacyjne (nieklikalne) różnią się od filtrów: bez ramki i bez kursora (Karol 15.09: „filtr zlewa się z kafelkami, które nie są klikalne") */
.kafelek.info { cursor:default; border-color:transparent; background:transparent; padding-left:4px; padding-right:4px; }
.kafelek.info:hover { border-color:transparent; }
.filtry-pasek { margin-top:-4px; }
.filtry-etykieta { font-size:11px; font-weight:600; color:var(--mc-text-secondary); }
.filtry { display:flex; flex-wrap:wrap; gap:6px; }
.filtry .filtr { display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 10px; border:1px solid var(--mc-border); border-radius:var(--mc-radius-pill); background:#fff; cursor:pointer; font:600 11px var(--mc-font); color:var(--mc-text-secondary); }
.filtry .filtr svg.ik { width:12px; height:12px; }
.filtry .filtr b { font-size:12px; color:var(--mc-text); }
.filtry .filtr.alarm b { color:var(--mc-error); }
.filtry .filtr:hover { border-color:var(--mc-brand); }
.filtry .filtr[aria-pressed="true"] { border-color:var(--mc-brand); background:var(--mc-brand-soft); color:var(--mc-brand); box-shadow:inset 0 0 0 1px var(--mc-brand); }
.kafelek.aktywny { border-color:var(--mc-brand); box-shadow:inset 0 0 0 1px var(--mc-brand); background:var(--mc-brand-soft); }
.kafelek small { color:var(--mc-text-secondary); font-size:11px; }
.kafelek small.opis { display:none; }
.kafelek b { font-size:18px; line-height:22px; font-weight:600; }
.kafelek.alarm b { color:var(--mc-error); } .kafelek.ostrz b { color:#b88a00; } .kafelek.ok b { color:#3a9a20; }
.karta { background:#fff; border:1px solid var(--mc-border); border-radius:var(--mc-radius-lg); }
.tabela { width:100%; border-collapse:collapse; table-layout:auto; }
.tabela td.pojazd .rej { font-weight:600; }
.tabela td.pojazd .model { color:var(--mc-text-secondary); margin-left:6px; }
.pole.szukaj { width:220px; }
.tresc { --fs-tab:12.5px; --lh-tab:18px; --pad-tab:9px; }                    /* 100 % — większa czcionka i oddech (Karol) */
.tresc[data-rozmiar="2"] { --fs-tab:13.75px; --lh-tab:19px; --pad-tab:10px; } /* 110 % */
.tresc[data-rozmiar="3"] { --fs-tab:15.6px; --lh-tab:22px; --pad-tab:12px; }  /* 125 % */
.tabela th, .tabela td { padding:var(--pad-tab) 6px; border-bottom:1px solid var(--mc-border); text-align:left; white-space:nowrap; font-size:var(--fs-tab); line-height:var(--lh-tab); color:#1f2733; }
.tabela th { background:#fff; font-weight:600; color:#5a6472; white-space:normal; line-height:13px; vertical-align:bottom; position:sticky; top:var(--topbar); z-index:5; box-shadow:0 1px 0 var(--mc-border); cursor:pointer; user-select:none; }
.tabela th:hover { color:var(--mc-brand); }
.tabela th .strzalka { display:inline-block; width:10px; color:var(--mc-brand); }
.tabela th.prawa, .tabela td.num { text-align:right; font-variant-numeric:tabular-nums; }
.tabela th.waska { max-width:58px; }
.tabela td.komora { max-width:66px; white-space:normal; line-height:1.25; }
.tabela th.srodek, .tabela td.srodek { text-align:center; font-variant-numeric:tabular-nums; }
.tabela th.bez-sortu { cursor:default; }
.tabela tbody tr:nth-child(even of .wiersz) { background:#f5f8fc; }
.tabela tr.wiersz { cursor:pointer; scroll-margin-top:calc(var(--topbar) + 44px); }   /* miejsce na przyklejony nagłówek */
.tabela tr.wiersz:hover { background:var(--mc-brand-soft); }
.tabela tr.wiersz.otwarty { background:var(--mc-brand-soft); }
.tabela td.rej { font-weight:600; }
.tabela td.chevron { width:28px; color:#8a93a1; padding-right:0; }
.tabela td.chevron svg.ik { width:14px; height:14px; vertical-align:middle; }
.tabela td.tekst-drugi { color:#5a6472; }
.tag { display:inline-block; padding:1px 8px; border-radius:var(--mc-radius-pill); font-size:var(--fs-tab, 11px); line-height:var(--lh-tab, 15px); font-weight:600; }
.tag.ok { background:var(--mc-success-soft); color:#2f8a16; } .tag.przekroczenie { background:var(--mc-error-soft); color:var(--mc-error); }
.tag.ostrzezenie { background:var(--mc-warning-soft); color:#9a7400; } .tag.wolne, .tag.nie_wyjechal, .tag.brak_danych, .tag.nieoceniony { background:#eef0f3; color:#666; }
.komora { font-variant-numeric:tabular-nums; } .komora .tryb { color:var(--mc-text-secondary); }
.komora.przekroczenie { color:var(--mc-error); font-weight:600; } .komora.ostrzezenie { color:#9a7400; }
.szczegoly td { padding:8px 8px 12px 8px; background:#fff; white-space:normal; max-width:0; }   /* max-width:0 — panel nie rozpycha tabeli nadrzędnej (przewijanie w bok, Karol) */
.panel { background:var(--mc-surface-app); border-radius:var(--mc-radius); padding:12px; display:grid; grid-template-columns:minmax(0, 1fr); gap:10px; min-width:0; overflow-x:hidden; }   /* minmax(0,1fr): dzieci nie rosną ponad panel */
.panel .przewijane { overflow-x:auto; }
.panel-naglowek { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:6px 12px; }
.panel-naglowek p { margin:0; flex:1 1 320px; font-size:var(--fs-tab); line-height:var(--lh-tab); }
.panel-naglowek .przyciski { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.segment { display:inline-flex; border:1px solid var(--mc-border); border-radius:var(--mc-radius); background:#fff; overflow:hidden; }
.segment button { border:0; background:transparent; padding:6px 12px; display:inline-flex; align-items:center; gap:6px; cursor:pointer; font-weight:600; font-size:11px; color:var(--mc-text-secondary); }
.segment button + button { border-left:1px solid var(--mc-border); }
.segment button[aria-pressed="true"] { color:var(--mc-brand); box-shadow:inset 0 -2px 0 var(--mc-brand); background:var(--mc-brand-soft); }
.segment button svg.ik { width:14px; height:14px; }
.btn.maly { height:28px; padding:0 10px; font-size:11px; font-weight:600; color:var(--mc-text-secondary); }
.btn.maly svg.ik { width:14px; height:14px; }
.wykres-tytul { font-weight:600; margin:2px 0 0; display:flex; gap:12px; align-items:baseline; font-size:12px; }
.wykres-tytul small { color:var(--mc-text-secondary); font-weight:400; }
.wykres { width:100%; height:clamp(240px, 32vh, 440px); background:#fff; border:1px solid var(--mc-border); border-radius:var(--mc-radius); overflow:hidden; }
.wykres.z-suwakiem { height:clamp(400px, 54vh, 720px); }   /* jeden wykres w panelu — większy (Karol) */
.zakres-przyciski { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.zakres-przyciski .etykieta { font-size:11px; color:var(--mc-text-secondary); }
.alarmy-lista a { color:var(--mc-error); text-decoration:none; font-weight:700; }
.alarmy-lista a:hover { text-decoration:underline; }
.legenda { color:var(--mc-text-secondary); font-size:11px; margin:2px 20px 0 48px; }
.alarmy-lista { margin:6px 0 2px; padding:0; list-style:none; display:grid; gap:4px; }
.alarmy-lista li { display:flex; align-items:center; gap:8px; flex-wrap:wrap; min-width:0; background:var(--mc-error-soft); border:1px solid rgba(255,0,50,.25); border-left:4px solid var(--mc-error); border-radius:var(--mc-radius); padding:6px 10px; font-size:calc(var(--fs-tab) + 1px); line-height:var(--lh-tab); color:#7a0018; }
.alarmy-lista li { cursor:pointer; }
.alarmy-lista li:hover { background:rgba(255,0,50,.16); }
.alarmy-lista li svg.ik { width:16px; height:16px; color:var(--mc-error); }
.alarmy-lista li > span:not(.numer):not(.przybliz) { flex:1 1 300px; min-width:0; }
.alarmy-lista li .przybliz { margin-left:auto; display:inline-flex; align-items:center; gap:4px; color:var(--mc-brand); font-weight:600; white-space:nowrap; border:1px solid var(--mc-brand); border-radius:var(--mc-radius); padding:3px 8px; background:#fff; }
.alarmy-lista li .przybliz svg.ik { color:var(--mc-brand); width:14px; height:14px; }
.alarmy-lista li b { color:var(--mc-error); }
.ladowanie { color:var(--mc-text-secondary); padding:10px 12px; display:flex; align-items:center; gap:10px; font-size:12px; }
.postep { height:4px; background:var(--mc-border); border-radius:2px; overflow:hidden; flex:1; max-width:260px; }
.postep i { display:block; height:100%; background:var(--mc-brand); transition:width .2s; }
.komunikat-blad { background:var(--mc-error-soft); color:#b00020; border:1px solid rgba(255,0,50,.3); border-radius:var(--mc-radius); padding:8px 12px; margin:8px 0; font-size:12px; }
.w-przygotowaniu { color:var(--mc-text-secondary); padding:24px; text-align:center; }

/* ---- logowanie ---- */
body.logowanie { display:flex; flex-direction:column; min-height:100vh; }
.log-srodek { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:40px 16px; }
.log-logo { width:40px; height:40px; color:var(--mc-text); margin-bottom:10px; }
.log-logo svg { width:40px; height:40px; }
.log-srodek h1 { font-size:20px; line-height:24px; font-weight:600; margin:0 0 28px; }
.log-form { width:100%; max-width:300px; display:flex; flex-direction:column; gap:14px; }
.pole-z-etykieta { position:relative; border:1px solid var(--mc-border); border-radius:var(--mc-radius); background:#fff; padding:6px 10px 6px; }
.pole-z-etykieta:focus-within { box-shadow:inset 0 0 0 2px var(--mc-brand); border-color:var(--mc-brand); background:#F5F9FF; }
.pole-z-etykieta label { display:block; font-size:10px; color:var(--mc-brand); line-height:12px; }
.pole-z-etykieta input { width:100%; border:0; background:transparent; padding:2px 0; font-size:13px; }
.pole-z-etykieta input:focus { outline:none; }
.pole-z-etykieta .pokaz { position:absolute; right:10px; top:14px; border:0; background:none; color:var(--mc-brand); font-size:11px; letter-spacing:.06em; cursor:pointer; }
.log-opcje { display:flex; justify-content:space-between; align-items:center; font-size:12px; }
.log-opcje a { color:var(--mc-brand); text-decoration:none; }
.log-form .btn.glowny { height:48px; justify-content:center; font-size:14px; }
.log-form .btn.glowny[disabled] { background:#EEF0F3; border-color:#EEF0F3; color:#9aa0a8; cursor:default; }
.log-stopka { display:flex; justify-content:space-between; align-items:center; padding:12px 24px; font-size:11px; color:var(--mc-text-secondary); }
.log-jezyk { border:1px solid var(--mc-border); border-radius:var(--mc-radius-pill); padding:6px 16px; background:#fff; }
.log-belka { background:#2D3746; height:64px; display:flex; align-items:center; justify-content:center; color:#fff; font-size:16px; font-weight:600; }
.log-blad { display:none; }
.log-blad.widoczny { display:block; }

/* sterowanie czcionką (obok maila) */
.segment.powiekszenie button { padding:5px 9px; }

/* panel powiększony na cały ekran (Karol 14.09) */
.nakladka { position:fixed; top:var(--topbar); right:0; bottom:0; left:var(--rail); z-index:1050; background:var(--mc-surface-app); overflow:auto; padding:12px 16px; transition:left .15s ease; }   /* w obszarze treści: pod belką, na prawo od raila */
body.rail-otwarty .nakladka { left:var(--rail-open); }
.nakladka .panel { min-height:calc(100vh - var(--topbar) - 24px); }
.nakladka [data-rola="trasa"] { order:-1; }      /* mapa u góry, wykres pod nią — zawsze w tej kolejności */
.nakladka .panel-naglowek { order:-3; position:sticky; top:-12px; z-index:5; background:var(--mc-surface-app); padding:8px 0; margin:-12px 0 0; }
.nakladka .panel-naglowek .przyciski { flex-shrink:0; }
.nakladka .mapa { height:calc((100vh - var(--topbar) - 150px) * 0.66); min-height:260px; }   /* duży widok: 66 % mapa, reszta wykres (Karol) */
.nakladka .wykres { height:calc((100vh - var(--topbar) - 150px) * 0.34); min-height:200px; }
.nakladka .wykres.z-suwakiem { height:calc((100vh - var(--topbar) - 150px) * 0.34); min-height:200px; }
.nakladka .wykres.mini { display:none; }        /* w dużym widoku są pełne wykresy */
.nakladka .wykres-tytul { margin:0; }
.nakladka .legenda { display:none; }
.btn.maly.marka { color:var(--mc-brand); border-color:var(--mc-brand); }

/* wybór nocy: kalendarz (data wieczoru) + etykieta „noc 13/14.09 (nd→pon)" */
.wybor-nocy { display:inline-flex; align-items:center; gap:8px; }
.wybor-nocy input[type="date"] { width:150px; }
.noc-etykieta { font-weight:600; white-space:nowrap; }

.alarmy-lista li .numer { display:inline-flex; width:20px; height:20px; border-radius:50%; background:var(--mc-error); color:#fff; align-items:center; justify-content:center; font-weight:700; font-size:11px; flex:none; }

/* mapa trasy */
.mapa { width:100%; height:clamp(320px, 46vh, 640px); border:1px solid var(--mc-border); border-radius:var(--mc-radius); background:#e9ecef; }
.mapa-opis { font-size:11px; color:var(--mc-text-secondary); margin-bottom:6px; }
.mapa-opis i.kolor { display:inline-block; width:14px; height:4px; vertical-align:middle; border-radius:2px; margin:0 2px 0 6px; }
.mapa-opis i.kolor.ok { background:#16a34a; } .mapa-opis i.kolor.poza { background:#ff0032; } .mapa-opis i.kolor.brak { background:#8a93a1; }
.wykres.mini { height:150px; margin-top:6px; }
.leaflet-container { font:11px/15px var(--mc-font); }
.warstwy.segment { margin:10px; box-shadow:var(--mc-shadow-pop); }
.pkt { border-radius:50%; background:#fff; border:3px solid #8a93a1; width:24px; height:24px; box-sizing:border-box; display:flex; align-items:center; justify-content:center; font:600 11px/1 var(--mc-font); color:#1f2733; box-shadow:0 1px 3px rgba(0,0,0,.3); }
.pkt.ok { border-color:#16a34a; } .pkt.poza { border-color:#ff0032; } .pkt.brak { border-color:#8a93a1; }
.pkt.baza { background:#2d3746; border-color:#fff; color:#fff; width:28px; height:28px; }
.leaflet-popup-content { font:12px/17px var(--mc-font); margin:10px 12px; }
.link-zewn { color:var(--mc-brand); text-decoration:none; display:inline-flex; align-items:center; gap:4px; font-weight:600; margin-top:4px; }
.link-zewn svg.ik { width:13px; height:13px; }
.tabela.dostawy td, .tabela.dostawy th { white-space:nowrap; }
.tabela.dostawy th { position:static; }

/* popover progów (górna belka) */
.ustawienia-karta { padding:16px 20px; }
.ustawienia-karta { max-width:760px; }
.ustawienia-kolumny { display:grid; grid-template-columns:1fr; gap:12px; }
.ustawienia-kolumny fieldset { display:grid; grid-template-columns:1fr; gap:8px; }
.ustawienia-kolumny label { display:flex; flex-wrap:wrap; align-items:center; gap:6px; justify-content:space-between; }
.ustawienia-kolumny label > span.pole-grupa { display:inline-flex; align-items:center; gap:6px; }
.ustawienia-kolumny fieldset { margin:0; }
.popover-tytul { font-weight:600; font-size:16px; margin-bottom:12px; display:flex; flex-wrap:wrap; gap:6px 14px; align-items:baseline; }
.progi-form fieldset { border:1px solid var(--mc-border); border-radius:var(--mc-radius); padding:8px 10px; margin:0 0 8px; display:flex; flex-wrap:wrap; gap:8px 14px; align-items:center; }
.progi-form legend { font-size:11px; color:var(--mc-text-secondary); padding:0 4px; }
.progi-form label { font-size:12px; display:inline-flex; align-items:center; gap:4px; flex-wrap:wrap; }
.progi-form small { font-size:11px; color:var(--mc-text-secondary); flex-basis:100%; }
.pole.waskie { width:64px; height:28px; padding:0 6px; text-align:right; }
.popover-przyciski { display:flex; gap:8px; align-items:center; margin-top:12px; }
.btn.glowny.maly { color:#fff; }
.popover-info { display:block; margin-top:8px; font-size:11px; color:var(--mc-text-secondary); }

/* żetony alarmów w wierszu zakresu */
.zetony { display:inline-flex; flex-wrap:wrap; align-items:center; gap:6px; }
.zeton { display:inline-flex; align-items:center; gap:6px; border:1px solid rgba(255,0,50,.35); background:var(--mc-error-soft); color:#7a0018; border-radius:var(--mc-radius-pill); padding:3px 10px 3px 4px; font-size:11px; font-weight:600; cursor:pointer; }
.zeton:hover { background:rgba(255,0,50,.18); border-color:var(--mc-error); }
.zeton .numer { display:inline-flex; width:18px; height:18px; border-radius:50%; background:var(--mc-error); color:#fff; align-items:center; justify-content:center; font-size:11px; }
.zeton svg.ik { width:13px; height:13px; color:var(--mc-error); }

/* odwiedziny: panel pod wierszem w Dostawach */
.punkt-trasy span { display:flex; width:12px; height:12px; align-items:center; justify-content:center; border-radius:50%; background:#fff; color:#2d3746; box-shadow:0 0 0 1.5px #2d3746; cursor:pointer; }
.punkt-trasy span svg { width:9px; height:9px; stroke-width:3.5; }
.strzalka-trasy span { display:flex; width:14px; height:14px; align-items:center; justify-content:center; border-radius:50%; background:#fff; color:#2d3746; box-shadow:0 0 0 1px rgba(45,55,70,.35); }
.strzalka-trasy span svg { width:11px; height:11px; stroke-width:3; }
.etykieta-mapy span { display:inline-block; white-space:nowrap; padding:2px 8px; border-radius:var(--mc-radius-pill); font:600 11px/15px var(--mc-font); color:#fff; box-shadow:0 1px 3px rgba(0,0,0,.35); }
.etykieta-mapy.wjazd span { background:var(--mc-brand); }
.etykieta-mapy.wyjazd span { background:#2d3746; }
.odw-panel { display:grid; grid-template-columns:minmax(0, 1.1fr) minmax(0, 1fr); gap:10px; }
.odw-panel .mapa { height:clamp(364px, 52vh, 624px); }   /* +30 % (Karol) */
.odw-panel .wykres { height:clamp(364px, 52vh, 624px); }
@media (max-width: 1100px) { .odw-panel { grid-template-columns:1fr; } }

/* Dostawy: tabela nie rozciąga się na całą szerokość — kolumny trzymają się lewej (Karol) */
#dTabela { width:100%; }
#dTabela th:not(.wypelniacz), #dTabela td:not(.wypelniacz) { width:1%; white-space:nowrap; padding-left:10px; padding-right:10px; }
#dTabela th { white-space:normal; }
#dTabela td.tekst-drugi { max-width:240px; overflow:hidden; text-overflow:ellipsis; }   /* kolumny zwarte przy lewej, reszta w wypełniaczu */
#dTabela th.waska { max-width:none; }

.komunikat-info { background:var(--mc-brand-soft); color:#1c4f9c; border:1px solid rgba(45,120,255,.3); border-radius:var(--mc-radius); padding:8px 12px; margin:8px 0; font-size:12px; }

.pusty-stan { display:flex; flex-direction:column; align-items:center; gap:8px; padding:36px 16px; color:var(--mc-text-secondary); text-align:center; }
.pusty-stan b { color:var(--mc-text); font-size:14px; }

/* nagłówek panelu w jednej linii: pojazd · noc | zakres + żetony | wykres/trasa/powiększ/zamknij (Karol: szanujemy miejsce) */
/* cały nagłówek panelu w jednym wierszu: pojazd · noc | Wykres Trasa Powiększ Zamknij | Zakres | Przekroczenia (Karol) */
.panel-naglowek.jeden-wiersz { align-items:center; gap:6px 10px; flex-wrap:wrap; }
.panel-naglowek.jeden-wiersz p { flex:0 0 auto; white-space:nowrap; }
.panel-naglowek.jeden-wiersz .przyciski { order:0; }
.panel-naglowek.jeden-wiersz .zakres-przyciski { flex:1 1 auto; min-width:0; }
.nakladka .panel-naglowek.jeden-wiersz { order:-3; }
.zakres-przyciski.zwarte { gap:6px 8px; }
.zakres-przyciski.zwarte .segment button { padding:4px 9px; font-size:10.5px; }
.zakres-przyciski.zwarte .zeton { font-size:10.5px; padding:2px 8px 2px 3px; }
.zakres-przyciski.zwarte .zeton .numer { width:16px; height:16px; font-size:10px; }
.zakres-przyciski.zwarte .btn.maly { height:24px; font-size:10.5px; }

#aTabela td:nth-child(9), #aTabela td:nth-child(10) { white-space:normal; max-width:230px; }
/* stronicowanie: przyklejone do dołu ekranu (Karol: „paginacja widoczna, zablokowana na dole") */
.stronicowanie { position:sticky; bottom:0; z-index:5; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px; padding:6px 12px; background:#fff; border-top:1px solid var(--mc-border); border-radius:0 0 var(--mc-radius-lg) var(--mc-radius-lg); font-size:11px; color:var(--mc-text-secondary); box-shadow:0 -2px 6px rgba(0,0,0,.05); }
.stronicowanie .segment button { padding:4px 9px; }
.stronicowanie .strony { display:inline-flex; align-items:center; gap:4px; justify-self:center; }   /* strony na środku, jak w typowych tabelach */
.stronicowanie .segment { justify-self:end; }
.stronicowanie .strony b { color:var(--mc-text); min-width:64px; text-align:center; }
.eksporty { margin-left:auto; display:inline-flex; gap:4px; }
.btn.eksport { color:var(--mc-brand); border-color:var(--mc-brand); font-weight:600; padding:0 8px; }
.btn.eksport[disabled] { opacity:.6; cursor:wait; }

.przelacznik.ogolna { font-size:11px; color:var(--mc-text-secondary); white-space:nowrap; }