:root {
  /* Kolory firmowe: grafit (jak tło logo Bonustria) + złoto. Zmiana tutaj przestawia cały TMS. */
  --tlo: #f5f4f1;
  --karta: #ffffff;
  --tekst: #262624;
  --szary: #6b6a66;
  --akcent: #8c6512;      /* ciemne złoto – przyciski, linki, zakładki (biały napis czytelny) */
  --zloto: #d4af37;       /* jasne złoto – akcenty na grafitowym tle */
  --pasek: #313131;       /* grafit – pasek menu, ten sam co tło logo */
  --blad: #b42318;
  --ramka: #e2dfd8;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: "Segoe UI", system-ui, sans-serif;
  background: var(--tlo);
  color: var(--tekst);
}
.pasek {
  display: flex; align-items: center; gap: 24px;
  padding: 10px 24px; background: var(--pasek); color: #fff; border-bottom: 3px solid var(--zloto);
}
.pasek a { color: #fff; text-decoration: none; }
.logo { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: 1.05rem; }
.logo img { height: 34px; width: auto; display: block; }
.logo span { color: var(--zloto); letter-spacing: .12em; padding-left: 8px; border-left: 1px solid #5a5a5a; }
.pasek nav a:hover { color: var(--zloto); }
.pasek nav { display: flex; gap: 16px; }
.konto { margin-left: auto; display: flex; align-items: center; gap: 16px; }
.konto form { margin: 0; }
.konto button {
  background: transparent; color: #fff; border: 1px solid #fff6;
  padding: 4px 12px; border-radius: 6px; cursor: pointer;
}
main { max-width: 1100px; margin: 32px auto; padding: 0 16px; }
.karta {
  background: var(--karta); border: 1px solid var(--ramka);
  border-radius: 10px; padding: 24px; margin-bottom: 24px;
}
.waska { max-width: 420px; margin: 48px auto; }
h1 { margin-top: 0; font-size: 1.5rem; }
label { display: block; margin-bottom: 14px; font-weight: 600; }
input[type=text], input[type=password] {
  display: block; width: 100%; margin-top: 6px; padding: 10px;
  border: 1px solid var(--ramka); border-radius: 6px; font-size: 1rem;
}
button[type=submit] {
  background: var(--akcent); color: #fff; border: 0;
  padding: 10px 18px; border-radius: 6px; font-size: 1rem; cursor: pointer;
}
.pasek button[type=submit] { background: transparent; padding: 4px 12px; font-size: .9rem; }
.blad { color: var(--blad); }
.opis { color: var(--szary); }
.komunikat { background: #f6efdc; padding: 10px 14px; border-radius: 6px; }
.kafle { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.kafel { background: var(--karta); border: 1px solid var(--ramka); border-radius: 10px; padding: 18px; }
.kafel h2 { margin: 0 0 6px; font-size: 1.1rem; }
a.kafel { color: var(--tekst); text-decoration: none; }
a.kafel:hover { border-color: var(--akcent); }
a.kafel h2 { color: var(--akcent); }
.nieaktywny { color: var(--szary); }

/* ---- komunikaty ---- */
.komunikaty { max-width: 1100px; margin: 16px auto 0; padding: 0 16px; }
.komunikat.error { background: #fdecea; color: var(--blad); }
.komunikat.success { background: #e7f6ec; color: #18794e; }
.ok { color: #18794e; }

/* ---- tabela ---- */
.tabela { width: 100%; border-collapse: collapse; font-size: .95rem; }
.tabela th, .tabela td { text-align: left; padding: 8px; border-bottom: 1px solid var(--ramka); }
.tabela th { color: var(--szary); font-weight: 600; }
.kafel.wyrozniony { border: 2px solid var(--akcent); }

/* ---- formularze ---- */
select, input[type=file], input[type=date], input[type=time], input[type=number], input[type=email], textarea {
  padding: 8px; border: 1px solid var(--ramka); border-radius: 6px; font: inherit;
}
.w-linii { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
button.drugorzedny {
  background: #fff; color: var(--tekst); border: 1px solid var(--ramka);
  padding: 10px 18px; border-radius: 6px; font-size: 1rem; cursor: pointer;
}

/* ---- ekran: PDF obok formularza ---- */
.dwie-kolumny { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 16px; }
.kolumna-pdf iframe {
  width: 100%; height: calc(100vh - 100px); position: sticky; top: 16px;
  border: 1px solid var(--ramka); border-radius: 10px; background: #fff;
}
.kolumna-formularz {
  background: var(--karta); border: 1px solid var(--ramka); border-radius: 10px; padding: 20px;
}
fieldset { border: 1px solid var(--ramka); border-radius: 8px; margin: 0 0 16px; padding: 12px 14px; }
legend { font-weight: 700; padding: 0 6px; }
.siatka { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px 14px; }
.pole label { display: block; margin-bottom: 4px; font-weight: 600; font-size: .85rem; }
.pole input:not([type=checkbox]), .pole select, .pole textarea { width: 100%; margin-top: 0; padding: 7px; }
.pole:has(textarea) { grid-column: 1 / -1; }
.pole-check { display: flex; align-items: center; gap: 8px; }
.pole-check label { margin: 0; }
.pole.uwaga input, .pole.uwaga select, .pole.uwaga textarea { background: #fff6d6; border-color: #e3b505; }
.pole-blad input, .pole-blad select, .pole-blad textarea { border-color: var(--blad); }
.pole .blad { font-size: .85rem; }
.lista-uwag { background: #fff6d6; border: 1px solid #e3b505; border-radius: 8px; padding: 10px 14px; margin-bottom: 16px; }
.lista-uwag ul { margin: 6px 0; padding-left: 20px; }
.punkt { border-top: 1px dashed var(--ramka); padding-top: 10px; margin-top: 10px; }
.punkt:first-of-type { border-top: 0; margin-top: 0; padding-top: 0; }
details summary { cursor: pointer; color: var(--akcent); margin: 8px 0; }
.przyciski { display: flex; gap: 10px; margin-top: 8px; }
.ponow { margin-top: 18px; padding-top: 12px; border-top: 1px solid var(--ramka); }
@media (max-width: 1000px) {
  .dwie-kolumny { grid-template-columns: 1fr; }
  .kolumna-pdf iframe { position: static; height: 70vh; }
}

.kolumna-pdf .mail {
  position: sticky; top: 16px; max-height: calc(100vh - 100px); overflow: auto;
  background: #fff; border: 1px solid var(--ramka); border-radius: 10px; padding: 16px;
}
.kolumna-pdf .mail h2 { margin-top: 0; font-size: 1.1rem; }
.kolumna-pdf pre { white-space: pre-wrap; font-family: inherit; font-size: .92rem; margin: 0; }

/* ================= tablica dyspozytora ================= */
.tablica { padding: 14px 18px; font-size: 13px; }
.alerty { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.alert { padding: 7px 12px; border-radius: 8px; font-weight: 600; text-decoration: none; }
.a-bl { background: #fdecea; color: var(--blad); }
.a-uw { background: #fff3d6; color: #a15c00; }
.a-in { background: #f6efdc; color: var(--akcent); }
.a-ok { background: #e6f4ea; color: #1e6b34; }
.narz { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.narz input[type=search] { width: 260px; padding: 7px 10px; border: 1px solid var(--ramka); border-radius: 6px; font: inherit; }
.narz form { margin: 0; }
.odstep { flex: 1; }
.przycisk, .przycisk-maly { background: var(--akcent); color: #fff; text-decoration: none; border-radius: 6px; font-weight: 600; }
.przycisk { padding: 8px 14px; }
.przycisk-maly { padding: 3px 9px; background: #fff; color: var(--tekst); border: 1px solid var(--ramka); }
.uklad-tablicy { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 14px; align-items: start; }
@media (max-width: 1400px) { .uklad-tablicy { grid-template-columns: 1fr; } }
.karta-t { background: var(--karta); border: 1px solid var(--ramka); border-radius: 10px; overflow-x: auto; }
.karta-t h2 { margin: 0; padding: 10px 14px; font-size: 14px; border-bottom: 1px solid var(--ramka);
  display: flex; justify-content: space-between; align-items: baseline; }
.karta-t h2 small { color: var(--szary); font-weight: 400; }
.t { width: 100%; border-collapse: collapse; }
.t th { text-align: left; color: var(--szary); font-weight: 600; font-size: 11px; padding: 6px 7px;
  background: #fafbfc; border-bottom: 1px solid var(--ramka); white-space: nowrap; }
.t td { padding: 4px 7px; border-bottom: 1px solid #eef0f3; white-space: nowrap; vertical-align: middle; }
.t td form { margin: 0; }
.t .pr { text-align: right; }
.kurs-nagl td { background: #f2f4f7; border-top: 2px solid var(--ramka); padding: 6px 8px; }
.kurs.ponad .kurs-nagl td { background: #fdecea; }
.kurs-linia { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.kurs-nazwa { font-size: 14px; }
.szary { color: var(--szary); }
.pasek-zaj { width: 110px; height: 8px; background: #e3e6eb; border-radius: 4px; overflow: hidden; display: inline-block; }
.pasek-zaj i { display: block; height: 100%; background: var(--akcent); }
.pasek-zaj i.pelny { background: #18794e; }
.wolne { color: #18794e; font-weight: 600; }
.znacznik { font-size: 10.5px; font-weight: 700; padding: 1px 6px; border-radius: 4px; }
.znacznik.pelne { background: #e7f6ec; color: #18794e; }
.znacznik.ponad { background: var(--blad); color: #fff; }
.znacznik.uw { background: #fff3d6; color: #a15c00; }
.fix { background: #fdecea; color: var(--blad); font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 4px; margin-left: 4px; }
button.maly { padding: 3px 9px; font-size: 11px; background: #fff; color: var(--tekst); border: 1px solid var(--ramka); border-radius: 5px; cursor: pointer; }
button.maly.aktywny { background: #18794e; color: #fff; border-color: #18794e; }
.maly-link { font-size: 12px; }
.kurs-linia select { padding: 3px 6px; font-size: 12px; }
select.mini, input.mini-tekst, input.mini-liczba { padding: 2px 5px; font-size: 12px; border: 1px solid transparent; border-radius: 4px; background: transparent; font-family: inherit; }
select.mini:hover, input.mini-tekst:hover, input.mini-liczba:hover,
select.mini:focus, input.mini-tekst:focus, input.mini-liczba:focus { border-color: var(--ramka); background: #fff; }
input.mini-tekst { width: 92px; }
input.mini-liczba { width: 44px; text-align: right; }
input.mini-liczba.brak { background: #fff3d6; }
input.lokalizacja { width: 82px; }
input.lokalizacja.baza, .lok.baza { background: #dbe8ff; color: #1f4fa0; font-weight: 600; }
td form:has(input.lokalizacja) { white-space: nowrap; }
.cofnij-lok { margin-left: 2px; color: var(--szary); font-size: 13px; padding: 0 3px; }
.cofnij-lok:hover { color: #c0392b; }
.lok { font-size: 12px; border-radius: 4px; padding: 1px 6px; }
.grupa td { background: #fbfbfc; color: var(--szary); font-size: 11px; font-weight: 700; }
.suma-zazn { padding: 10px 14px; background: #eef4ff; border-top: 1px solid #c9dafb; display: grid; gap: 8px; }
.suma-zazn select { max-width: 360px; }
.pusto { padding: 14px; }
.legenda { margin-top: 10px; color: var(--szary); font-size: 12px; }
.legenda .lok { padding: 1px 6px; }

select.mini { max-width: 104px; }
input.mini-tekst { width: 92px; }
.t td, .t th { padding-left: 5px; padding-right: 5px; }
.kurs-linia { gap: 8px; }

/* ---- podaj dane do zlecenia ---- */
.szukaj-duze { width: 100%; padding: 10px 12px; font-size: 1rem; border: 1px solid var(--ramka); border-radius: 8px; }
.grupa-kierowcow { margin-bottom: 22px; }
.grupa-kierowcow h2 { font-size: 1.05rem; margin: 0 0 10px; }
.grupa-kierowcow h2 small { color: var(--szary); font-weight: 400; }
.karty-kierowcow { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.karta-kierowcy { background: var(--karta); border: 1px solid var(--ramka); border-radius: 10px; padding: 12px 14px; }
.karta-kierowcy pre { margin: 0 0 10px; font-family: inherit; font-size: .9rem; white-space: pre-wrap; }
.karta-kierowcy button.kopiuj { padding: 6px 14px; }

button.zdejmij { background: transparent; border: 1px solid transparent; color: var(--szary); font-size: 13px;
  padding: 1px 6px; border-radius: 4px; cursor: pointer; }
button.zdejmij:hover { background: #fdecea; color: var(--blad); border-color: #f3c1bc; }

/* ---- moduły EXPORT / PRZERZUT / IMPORT ---- */
.moduly { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.modul { display: block; background: var(--karta); border: 2px solid var(--ramka); border-radius: 12px; padding: 22px 24px;
  color: var(--tekst); text-decoration: none; }
.modul:hover { border-color: var(--akcent); box-shadow: 0 2px 10px rgba(140, 101, 18, .14); }
.modul h2 { margin: 0 0 4px; font-size: 1.6rem; letter-spacing: .04em; color: var(--akcent); }
.modul ul { list-style: none; padding: 0; margin: 14px 0 0; display: grid; gap: 4px; }
.czerwone { color: var(--blad); }
.moduly-zakladki { display: flex; gap: 6px; align-items: center; margin-bottom: 12px; }
.moduly-zakladki a { padding: 7px 16px; border-radius: 8px; text-decoration: none; font-weight: 700; letter-spacing: .03em;
  color: var(--tekst); background: #fff; border: 1px solid var(--ramka); }
.moduly-zakladki a.aktywny { background: var(--akcent); color: #fff; border-color: var(--akcent); }
.moduly-zakladki a.wstecz { font-weight: 400; border-color: transparent; background: transparent; }

.uklad-tablicy { grid-template-columns: minmax(0, 2.15fr) minmax(0, 1fr); }
@media (max-width: 1400px) { .uklad-tablicy { grid-template-columns: 1fr; } }

/* ---- rozpiska jednolita (bez poczekalni) ---- */
.bez-auta-nagl td { background: #fff3d6 !important; border-top: 3px solid #e3b505 !important; }
.wiersz-bez-auta td { background: #fffdf5; }
.pasek-przydzialu { position: sticky; bottom: 0; z-index: 5; margin-top: 10px; display: flex; flex-wrap: wrap; gap: 10px;
  align-items: center; padding: 10px 14px; background: #eef4ff; border: 1px solid #c9dafb; border-radius: 10px;
  box-shadow: 0 -2px 8px rgba(0, 0, 0, .06); }
.pasek-przydzialu select { max-width: 380px; }

/* ---- przeciąganie wierszy ---- */
.uchwyt-kom { white-space: nowrap; }
.uchwyt { cursor: grab; color: #9aa1ac; font-size: 15px; padding: 0 4px 0 0; user-select: none; }
.uchwyt:hover { color: var(--akcent); }
tr.ciagniety td { background: #dbe8ff !important; opacity: .85; }
tbody.nad-celem .kurs-nagl td { outline: 2px dashed var(--akcent); outline-offset: -2px; }

/* ---- blokada auta ---- */
tr.odstep-kursu td { height: 14px; padding: 0 !important; background: var(--tlo) !important; border: 0 !important; }
tbody.zablokowany .kurs-nagl td { background: #e6ecf5 !important; border-left: 5px solid #2f2f2e; }
tbody.zablokowany tr.wiersz td:first-child { border-left: 5px solid #2f2f2e; }
button.maly.aktywny-blok { background: #2f2f2e; color: #fff; border-color: #2f2f2e; }
.przycisk-blokady { background: #2f2f2e !important; }
.separator { color: var(--szary); }

select.mini.jedzie { max-width: 128px; font-weight: 600; }
.brak-ep { display: inline-flex; margin-left: 4px; }

.t td.sped { white-space: nowrap; }

/* --- moduł SPEDYCJA */
.zielone { color: #1d6b41; }
select.mini.brak { background: #fff3d6; border-color: #e0b44c; }
.t tr.brak-przewoznika td:first-child { box-shadow: inset 3px 0 0 var(--blad); }
.t tfoot tr.suma td { border-top: 2px solid #c9d2de; background: #f5f7fa; }
.t td form.w-linii { gap: 4px; }
input.mini-liczba.koszt { width: 78px; }
select.mini.przewoznik { min-width: 170px; }

/* --- stan kopii zapasowych (strona startowa) */
.kopia-stan { margin: 10px 0 0; padding: 7px 12px; border-radius: 8px; font-size: 14px; }
.kopia-stan.ok { background: #dff3e6; color: #1d6b41; }
.kopia-stan.blad { background: #fdecea; color: var(--blad); font-weight: 600; }
.kopia-stan.uwaga { background: #fff3d6; color: #a15c00; font-weight: 600; }

/* --- flota w tygodniu i gotowe auta */
.flota { background: var(--karta); border: 1px solid var(--ramka); border-radius: 10px; padding: 8px 12px; margin: 0 0 12px; }
.flota-tytul { font-weight: 700; margin-bottom: 6px; }
.flota-tytul small { font-weight: 400; color: var(--szary); }
.flota-typy { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; }
.flota-typ { border: 1px solid var(--ramka); border-radius: 8px; padding: 4px 10px; background: #fff; min-width: 170px; }
.flota-typ summary { cursor: pointer; list-style: none; display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.flota-typ summary::-webkit-details-marker { display: none; }
.flota-liczba { font-weight: 700; padding: 0 7px; border-radius: 10px; }
.flota-typ.sa .flota-liczba { background: #dff3e6; color: #1d6b41; }
.flota-typ.zero .flota-liczba { background: #fff0c2; color: #8a5a00; }
.flota-typ.brak { border-color: #f3c1bc; }
.flota-typ.brak .flota-liczba { background: #fdecea; color: var(--blad); }
.flota-typ ul { margin: 6px 0 2px; padding: 0; list-style: none; font-size: 13px; }
.flota-typ li { padding: 1px 0; color: var(--szary); }
.flota-typ li .tab { display: inline-block; min-width: 78px; font-weight: 600; color: var(--tekst); }
.flota-typ li.st-wolne { color: #1d6b41; }
.flota-typ li.st-powrot { color: #1f4fa0; }
.flota-typ li.st-serwis { color: var(--blad); }
.flota-typ li.st-plan { color: #8a5a00; font-style: italic; }
.znacznik.gotowe { background: #1d6b41; color: #fff; }
tbody.gotowy .kurs-nagl td { background: #dff3e6 !important; border-left: 5px solid #1d6b41; }
tbody.gotowy tr.wiersz td:first-child { border-left: 5px solid #1d6b41; }
button.przycisk-gotowe { border-color: #1d6b41; color: #1d6b41; }
button.przycisk-gotowe.niegotowe { border-color: var(--ramka); color: var(--szary); }
.flota-wolne { color: var(--szary); font-size: 13px; }
.tab-wolna { font-weight: 600; color: #1d6b41; white-space: nowrap; }
.tab-wolna.powrot { color: #1f4fa0; }
select.dalej { font-size: 12px; color: var(--szary); }
select.dalej.ustalone { color: #1f4fa0; font-weight: 600; border-color: #cddcf6; background: #eaf1fd; }
.flota-wolne .przecinek { color: var(--szary); }
.flota-wolne .przecinek:last-child { display: none; }

/* --- postęp: SMS / odebrane / dojechało */
td.postep { white-space: nowrap; }
.chip { font-size: 11px; padding: 1px 6px; margin: 0 1px; border-radius: 10px; border: 1px solid var(--ramka); background: #fff;
  color: var(--szary); cursor: pointer; font-family: inherit; line-height: 1.5; }
.chip:hover { border-color: var(--akcent); color: var(--akcent); }
.chip.zrobione { background: #dff3e6; border-color: #b9e0c7; color: #1d6b41; font-weight: 600; }
button.przycisk-sms { border-color: #1d6b41; color: #1d6b41; font-weight: 600; }
dialog.okno { border: none; border-radius: 12px; padding: 18px 22px; width: min(640px, 94vw); box-shadow: 0 12px 40px rgba(0,0,0,.25); }
dialog.okno::backdrop { background: rgba(20, 28, 40, .45); }
dialog.okno h3 { margin: 0 0 6px; }
dialog.okno textarea { width: 100%; box-sizing: border-box; font-family: ui-monospace, Consolas, monospace; font-size: 13px; }
dialog.okno label { display: block; margin: 10px 0 0; }
.okno-przyciski { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap; }
#postep-zal { display: flex; gap: 8px; flex-wrap: wrap; margin: 6px 0; }
#postep-zal a { display: flex; flex-direction: column; align-items: center; gap: 2px; font-size: 11px; text-decoration: none;
  border: 1px solid var(--ramka); border-radius: 6px; padding: 4px; max-width: 130px; }
#postep-zal img { width: 120px; height: 90px; object-fit: cover; border-radius: 4px; }

/* --- księgowość */
.ks-tytul { margin: 4px 0 10px; font-size: 22px; }
.koszyki { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.koszyki a { padding: 7px 14px; border-radius: 8px; text-decoration: none; font-weight: 600; color: var(--tekst);
  background: #fff; border: 1px solid var(--ramka); }
.koszyki a.aktywny { background: var(--akcent); color: #fff; border-color: var(--akcent); }
.koszyki a.odstep-lewy { margin-left: 14px; }
.koszyki a.odstep-lewy + a.odstep-lewy { margin-left: 0; }
.koszyki .licznik { display: inline-block; min-width: 18px; padding: 0 6px; border-radius: 9px; background: #e8edf4;
  color: var(--tekst); font-size: 12px; text-align: center; }
.koszyki a.aktywny .licznik { background: rgba(255,255,255,.25); color: #fff; }
.ks-suma { font-size: 14px; }
.t.ks td { vertical-align: top; padding-top: 6px; padding-bottom: 6px; }
.male { font-size: 11.5px; }
.pomaranczowe { color: #b26a00; }
.t.ks tr.zmienione td { background: #fff5f4; }
.t.ks tr.zmienione-opis td { background: #fdecea; color: var(--blad); font-size: 13px; border-top: none; }
.ks-akcje { white-space: nowrap; }
button.maly.glowny { background: var(--akcent); color: #fff; border-color: var(--akcent); }
button.mini-link { background: none; border: none; color: var(--szary); cursor: pointer; padding: 0 3px; font-size: 13px; }
button.mini-link:hover { color: var(--akcent); }
dialog.okno input:not([type=checkbox]):not([type=file]) { width: 100%; box-sizing: border-box; }

/* --- kto szuka pracy dla auta */
select.szuka { font-size: 12px; color: var(--szary); }
select.szuka.ustalone { color: #6b3fa0; font-weight: 700; border-color: #dccbf0; background: #f4eefb; }
.flota-moje { font-size: 13px; margin: 0 0 6px; color: var(--szary); }
.flota-moje span { color: var(--tekst); font-weight: 600; }
.flota-moje span.moje { color: #6b3fa0; background: #f4eefb; padding: 0 4px; border-radius: 4px; }
.flota-moje span.nikt { color: var(--blad); }
.flota-moje small { font-weight: 400; }
.podzial h2 small { font-weight: 400; color: var(--szary); font-size: 13px; }
.podzial-kolumny { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.podzial-osoba { border: 1px solid var(--ramka); border-radius: 8px; padding: 8px 10px; }
.podzial-osoba.ja { border-color: #b79be0; background: #faf7fd; }
.podzial-osoba.nikt { border-color: #f3c1bc; background: #fff7f6; }
.podzial-osoba h3 { margin: 0 0 4px; font-size: 15px; }
.podzial-osoba h3 small { color: var(--szary); font-weight: 400; }
.podzial-osoba ul { list-style: none; margin: 0; padding: 0; font-size: 13px; }
.podzial-osoba li { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; padding: 2px 0; }

/* --- ADR */
.znacznik.adr { background: #f79a1e; color: #fff; }
.t.adr th, .t.adr td { white-space: nowrap; }

/* --- magazyn */
.mag-grupa { border: 1px solid var(--ramka); border-radius: 8px; margin: 8px 10px 12px; overflow: hidden; }
.mag-grupa.bez-auta { border-color: #f3c1bc; }
.mag-nagl { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; padding: 7px 10px; background: #f2f4f7; }
.mag-grupa.bez-auta .mag-nagl { background: #fff5f4; }
input.mag-uwagi { width: 120px; border-color: var(--ramka); }
.magazyn tr.dzis td { background: #fffbea; }

/* --- magazyn na telefonie: karty zamiast tabel, duże przyciski */
@media (max-width: 760px) {
  .magazyn { padding: 0 8px; }
  .magazyn .karta-t { overflow: visible; }
  .magazyn table.t, .magazyn table.t tbody, .magazyn table.t tr, .magazyn table.t td { display: block; width: auto; }
  .magazyn table.t thead { display: none; }
  .magazyn table.t tr { border: 1px solid var(--ramka); border-radius: 10px; margin: 10px 8px; padding: 8px 10px; background: #fff; }
  .magazyn table.t td { border: none; padding: 3px 0; text-align: left; font-size: 15px; }
  .magazyn table.t td[data-etykieta]:not(:empty)::before { content: attr(data-etykieta) ": "; color: var(--szary); font-size: 12px; }
  .magazyn table.t td.ks-akcje { padding-top: 8px; }
  .magazyn .mag-akcja { display: flex; gap: 8px; width: 100%; }
  .magazyn input.mag-uwagi { flex: 1; font-size: 16px; padding: 10px; }
  .magazyn .mag-akcja button.maly { font-size: 16px; padding: 10px 16px; }
  .magazyn .mag-grupa { margin: 8px 0; }
  .magazyn .narz input[type=search] { width: 100%; font-size: 16px; }
}
@media (max-width: 760px) {
  .pasek { flex-wrap: wrap; height: auto; padding: 8px 12px; gap: 6px 14px; }
  .pasek nav { display: flex; flex-wrap: wrap; gap: 4px 12px; }
  .pasek .konto { flex-wrap: wrap; gap: 4px 12px; font-size: 14px; }
}

/* --- plan załadunku */
.plan { border: 1px solid var(--ramka); border-radius: 8px; margin: 8px 10px 14px; overflow: hidden; }
.plan.gotowy { border-color: #b9e0c7; }
.plan.gotowy .mag-nagl { background: #dff3e6; }
.naczepa-wrap { display: flex; align-items: center; gap: 8px; padding: 10px 12px 4px; }
.naczepa-opis { font-size: 11px; font-weight: 700; color: var(--szary); text-align: center; line-height: 1.1; min-width: 38px; }
.naczepa-opis small { font-weight: 400; }
.naczepa { position: relative; flex: 1; height: 42px; border: 2px solid #5b6472; border-radius: 4px;
  background: repeating-linear-gradient(90deg, #f6f7f9 0, #f6f7f9 calc(100% / 33 - 1px), #e3e6eb calc(100% / 33 - 1px), #e3e6eb calc(100% / 33)); }
.naczepa .segment { position: absolute; top: 2px; bottom: 2px; border-radius: 3px; display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 700; font-size: 14px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.6); overflow: hidden; }
.kwadrat { display: inline-flex; width: 22px; height: 22px; border-radius: 4px; color: #fff; font-weight: 700; font-size: 12px;
  align-items: center; justify-content: center; }
.plan-tab td.skad.ok { color: #1d6b41; }
.plan-tab td.skad.uw { color: var(--blad); font-weight: 600; }
.t td.kontakt { white-space: nowrap; }
.pasek-pokaz { background: #f79a1e; color: #fff; text-align: center; font-weight: 700; padding: 5px 10px; font-size: 14px; }
input.mini-tekst.uwagi { width: 110px; }
input.mini-tekst.uwagi::placeholder { color: #a7adb7; }

/* --- Asystent AI – duży kafelek na środku strony startowej */
.ai-srodek { display: flex; justify-content: center; margin: 22px 0 26px; }
.kafel-ai { display: flex; align-items: center; gap: 22px; width: min(760px, 100%); padding: 30px 36px; border-radius: 16px;
  background: linear-gradient(135deg, #313131, #45413a); color: #fff; text-decoration: none; border: 2px solid var(--zloto);
  box-shadow: 0 10px 28px rgba(0, 0, 0, .22); transition: transform .12s ease, box-shadow .12s ease; }
.kafel-ai:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(140, 101, 18, .35); }
.kafel-ai .ai-tekst strong, .kafel-ai .ai-strzalka { color: var(--zloto); }
.kafel-ai .ai-ikona { font-size: 56px; line-height: 1; }
.kafel-ai .ai-tekst { display: flex; flex-direction: column; gap: 6px; flex: 1; }
.kafel-ai .ai-tekst strong { font-size: 2rem; letter-spacing: .01em; }
.kafel-ai .ai-tekst span { font-size: 1.05rem; opacity: .92; }
.kafel-ai .ai-strzalka { font-size: 2.4rem; opacity: .85; }
@media (max-width: 760px) {
  .kafel-ai { padding: 20px; gap: 14px; }
  .kafel-ai .ai-ikona { font-size: 40px; }
  .kafel-ai .ai-tekst strong { font-size: 1.5rem; }
  .kafel-ai .ai-strzalka { display: none; }
}

/* --- dokumenty firmowe */
.dodaj-dok summary { padding: 10px 14px; cursor: pointer; color: var(--akcent); }
.dok-form { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px 14px; padding: 4px 14px 14px; }
.dok-form label { display: flex; flex-direction: column; gap: 3px; font-size: 13px; }
.dok-form label.szeroko { grid-column: span 2; }
.dokumenty tr.dok-niewazny td { background: #fff5f4; }
.dokumenty tr.dok-konczy_sie td { background: #fffaf0; }
.kopia-stan a { color: inherit; }

/* --- SENT: wartości do kopiowania */
button.kopiuj-wartosc { background: #fff; color: var(--tekst); border: 1px solid var(--ramka); border-radius: 6px; padding: 4px 10px;
  font-family: ui-monospace, Consolas, monospace; font-size: 14px; cursor: pointer; }
button.kopiuj-wartosc:hover { border-color: var(--akcent); color: var(--akcent); }
button.kopiuj-wartosc.gps { font-weight: 700; }
button.kopiuj-wartosc.duzy { font-size: 16px; font-weight: 700; }
button.kopiuj-wartosc.skopiowano { background: #dff3e6; border-color: #b9e0c7; color: #1d6b41; }

/* --- formularz e-mail (potwierdzenie / zlecenie dla przewoźnika) */
.mail { max-width: 860px; }
.mail form label { display: block; margin: 0 0 10px; font-weight: 600; }
.mail form input:not([type=checkbox]), .mail form textarea { display: block; width: 100%; box-sizing: border-box; margin-top: 4px;
  font: inherit; font-weight: 400; padding: 8px 10px; border: 1px solid var(--ramka); border-radius: 6px; }
.mail form textarea { min-height: 300px; line-height: 1.45; }
.mail button[disabled] { opacity: .45; cursor: not-allowed; }

/* --- biała lista VAT (przycisk przy NIP) */
.rejestr-przycisk { white-space: nowrap; margin-left: 8px; padding: 4px 10px; border: 1px solid #8c6512; background: #fff8e6; color: #5c430c;
  border-radius: 5px; cursor: pointer; font-size: 12px; }
.rejestr-przycisk:hover { background: #f5e6bd; }
.rejestr-info { font-size: 12px; margin-top: 4px; color: #6b6f76; }
.rejestr-info.ok { color: #1d6b41; font-weight: 600; }
.rejestr-info.blad { color: #b3261e; font-weight: 600; }
.rejestr-baner { margin: 6px 0 10px; padding: 8px 12px; border-radius: 6px; background: #eef6f0; color: #1d6b41; }
.rejestr-baner.blad { background: #fdecea; color: #b3261e; }

/* --- wiarygodność kontrahentów */
.swiatlo { font-size: 12px; font-weight: 700; white-space: nowrap; padding: 1px 7px; border-radius: 10px; }
.swiatlo.ok { color: #1d6b41; background: #dff3e6; }
.swiatlo.uwaga { color: #8a5a00; background: #fff0c2; }
.swiatlo.ryzyko { color: #fff; background: #c0392b; }
.swiatlo.brak { color: #6b6f76; background: #eef0f3; font-weight: 400; }
.wiarygodnosc .alarm { border: 1px solid #f3c1bc; background: #fff5f4; padding: 8px 12px; border-radius: 8px; margin: 8px 10px; }
.sprawdz-firme { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; padding: 10px; }
.sprawdz-firme label { display: flex; flex-direction: column; font-size: 12px; color: var(--szary); }
.sprawdz-firme label.w-linii { flex-direction: row; align-items: center; gap: 6px; }
.sprawdz-firme input:not([type=checkbox]) { padding: 7px 9px; min-width: 190px; border: 1px solid var(--ramka); border-radius: 6px; }
.kpi { display: flex; flex-wrap: wrap; gap: 10px; padding: 10px; }
.kpi div { flex: 1 1 150px; background: #f6f7f9; border-radius: 8px; padding: 10px; }
.kpi strong { display: block; font-size: 20px; }
.kpi span { font-size: 12px; color: var(--szary); }
.sygnaly { list-style: none; padding: 0 12px; margin: 6px 0 12px; }
.sygnaly li { padding: 5px 8px; border-left: 4px solid #cfd3d9; margin: 4px 0; background: #fafbfc; font-size: 13px; }
.sygnaly li.ok { border-color: #2e9e5b; } .sygnaly li.uwaga { border-color: #e0a100; } .sygnaly li.ryzyko { border-color: #c0392b; background: #fff5f4; }
.sygnaly .zr { font-size: 11px; color: var(--szary); text-transform: uppercase; margin-right: 6px; }

/* --- rozpiska jak w Excelu */
.uchwyt-kom .lp { display: inline-block; min-width: 14px; font-weight: 700; color: #313131; margin-right: 3px; }
.wymiary { font-size: 11px; color: var(--szary); }
td.termin { white-space: nowrap; }

/* --- edycja towaru kliknięciem */
.towar-klik { background: none; border: none; padding: 0; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.towar-klik:hover { color: var(--akcent); text-decoration: underline dotted; }
.towar-klik .olowek { font-size: 11px; color: var(--szary); opacity: 0; }
tr:hover .towar-klik .olowek { opacity: 1; }
.siatka-okna { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; margin-bottom: 8px; }
#dlg-towar label { display: flex; flex-direction: column; font-size: 12px; color: var(--szary); }
#dlg-towar input { font-size: 14px; padding: 6px 8px; }

/* --- odebrane / dojechało: wybór dnia (7 dni wstecz + dziś) */
.dni-wstecz { display: flex; gap: 6px; flex-wrap: wrap; margin: 6px 0 2px; }
.dni-wstecz .dzien { display: flex; flex-direction: column; align-items: center; min-width: 58px; padding: 6px 8px;
  border: 1px solid var(--ramka); border-radius: 8px; background: #fff; color: inherit; cursor: pointer; font-size: 12px; }
.dni-wstecz .dzien small { font-size: 13px; font-weight: 700; }
.dni-wstecz .dzien:hover { border-color: var(--akcent); }
.dni-wstecz .dzien.dzis { background: var(--akcent); border-color: var(--akcent); color: #fff; min-width: 120px; font-weight: 700; }
.dni-wstecz .dzien.wybrany { outline: 3px solid #2e9e5b; outline-offset: 1px; }

/* --- małe okienko odebrane / dojechało */
dialog.okno.okno-male { width: min(560px, 94vw); padding: 12px 16px; }
.okno-male .okno-nagl { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.okno-male h3 { font-size: 15px; margin: 0; }
.zamknij-x { background: none; border: none; font-size: 16px; cursor: pointer; color: var(--szary); padding: 2px 6px; }
.okno-male .dni-wstecz { gap: 4px; margin: 10px 0 4px; flex-wrap: nowrap; overflow-x: auto; }
.okno-male .dni-wstecz .dzien { min-width: 52px; padding: 5px 4px; }
.okno-male .dni-wstecz .dzien.dzis { min-width: 64px; }
.okno-male .okno-przyciski { margin-top: 6px; }
.postep-zdjecia { margin: 4px 0; font-size: 13px; }
.postep-zdjecia summary { cursor: pointer; }
.postep-zdjecia input, .postep-zdjecia select { margin: 6px 6px 0 0; }

/* Księgowość – wysyłka dokumentów listem poleconym */
.pasek-wysylki { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 0 0 10px; padding: 8px 10px; background: #f7f8fa; border: 1px solid #e3e5e9; border-radius: 6px; }

/* Finanse – wypłaty kierowców */
.kierowcy-zakladki { flex-wrap: wrap; }
.finanse details.edycja > form, .finanse details.dodaj > form { margin-top: 8px; }
.formularz-wyjazdu { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: end; padding: 10px; background: #f7f8fa; border: 1px solid #e3e5e9; border-radius: 6px; }
.formularz-wyjazdu label { display: flex; flex-direction: column; font-size: 12px; color: #555; gap: 2px; }
.formularz-pozycji { margin-top: 10px; flex-wrap: wrap; }
.podsumowanie-wyplaty h2 strong { font-size: 1.25em; }
ul.dziennik { margin: 0; padding-left: 18px; }
td.zielone, .zielone { color: #1e7b34; }
/* Finanse – zestawienie jak w Excelu */
table.arkusz { width: 100%; max-width: 900px; border-collapse: collapse; background: #fff; font-size: 14px; }
table.arkusz td { border: 1px solid #e3e5e9; padding: 4px 8px; height: 26px; }
table.arkusz td.pr { text-align: right; }
table.arkusz td.znak { text-align: center; font-weight: 700; color: #1e7b34; }
table.arkusz tr.kierowca-wiersz td { background: #f7f8fa; font-weight: 700; padding-top: 8px; }
table.arkusz tr.wyplacone td { background: #f2faf4; }
table.arkusz tr.suma td { border-bottom: 2px solid #b8bcc4; }
@media print { .bez-druku, header, nav, .messages { display: none !important; } table.arkusz { font-size: 11px; } }

.kafle.kafle-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1000px) { .kafle.kafle-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .kafle.kafle-4 { grid-template-columns: 1fr; } }

table.t tr.grupa-wiersz td { background: #f2f3f5; font-weight: 700; padding-top: 10px; }
table.t tr.suma-grupy td { border-top: 1px solid #b8bcc4; font-weight: 600; background: #fafafa; }

.przycisk-maly.aktywny { background: var(--akcent); color: #fff; border-color: var(--akcent); }

table.t th.obrot, table.t td.obrot { background: #fff7e6; font-size: 1.05em; }

/* Księgowość – zbiór TMS w e-Nadawcy (listy polecone czekające na przekazanie do urzędu) */
.zbior-poczta { margin: 10px 12px; padding: 10px 12px; border: 2px solid #c8a24a; border-radius: 8px; background: #fffaf0; }
.zbior-poczta.stary { border-color: #c0392b; background: #fdf0ef; }
.zbior-poczta table.t { margin: 6px 0; }

/* Faktury */
.pasek-proby { margin: 8px 0 12px; padding: 9px 12px; border: 2px dashed #c0392b; border-radius: 8px; background: #fdf0ef; color: #7a1f16; }
.faktura-form .pola { padding: 10px 14px 14px; display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: flex-start; }
.faktura-form .pola label { display: flex; flex-direction: column; gap: 3px; font-size: 13px; color: #444; }
.faktura-form .pola label.szeroka { flex: 1 1 420px; }
.faktura-form .pola label.szeroka input, .faktura-form .pola label.szeroka textarea { width: 100%; }
.faktura-form .pola small { font-size: 11px; max-width: 260px; }
.faktura-gotowa { border: 2px solid #1e7b34; }

/* Tablica dyspozytora – mieści się na szerokość ekranu (26.10) */
table.rozpiska td { padding: 3px 4px; font-size: 12px; }
table.rozpiska th { padding: 5px 4px; }
table.rozpiska td.towar { white-space: normal; min-width: 130px; max-width: 230px; line-height: 1.25; }
table.rozpiska .mini-tekst { max-width: 110px; }
table.rozpiska .mini-tekst.uwagi { max-width: 120px; }
table.rozpiska select.mini.jedzie { max-width: 110px; }
/* nagłówek auta: przyciski zawsze w widocznej części ekranu, zawijają się do drugiej linii */
.kurs-nagl .kurs-linia { position: sticky; left: 8px; max-width: calc(100vw - 72px); row-gap: 6px; }
.kurs-nagl .kurs-linia select { max-width: 190px; }

/* Czaty z kierowcami (biuro) – układ jak WhatsApp na komputerze */
.czaty { display: flex; height: calc(100vh - 110px); margin: 10px 16px; border: 1px solid var(--ramka); border-radius: 10px; overflow: hidden; background: #fff; }
.czaty-lista { width: 340px; flex: none; border-right: 1px solid #e9edef; overflow-y: auto; background: #fff; }
.czaty-szukaj { padding: 8px 10px; background: #f0f2f5; } .czaty-szukaj input { width: 100%; box-sizing: border-box; padding: 8px 12px; border-radius: 8px; border: 0; }
.czaty-pulpit { padding: 4px 12px; font-size: 12px; }
.czaty-lista a.kier { display: flex; gap: 10px; align-items: center; padding: 9px 12px; border-bottom: 1px solid #f0f2f5; color: inherit; text-decoration: none; }
.czaty-lista a.kier:hover { background: #f5f6f6; } .czaty-lista a.kier.wybrany { background: #f0f2f5; }
.czaty-lista .awatar { width: 42px; height: 42px; border-radius: 50%; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; flex: none; }
.czaty-lista .srodek { flex: 1; min-width: 0; display: flex; flex-direction: column; } .czaty-lista .srodek small { color: #667781; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.czaty-lista .prawo { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; } .czaty-lista .prawo small { color: #667781; font-size: 11px; }
.licznik { background: #25d366; color: #fff; border-radius: 10px; font-size: 11px; padding: 1px 7px; font-weight: 700; }
.czaty-okno { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.czaty-okno .cz-pole { flex: 1; }
.czaty-nagl { display: flex; align-items: center; gap: 10px; padding: 8px 14px; background: #f0f2f5; border-bottom: 1px solid #e9edef; flex-wrap: wrap; }
.czaty-nagl .kto { flex: 1; min-width: 200px; display: flex; flex-direction: column; } .czaty-nagl .kto small { color: #667781; }
.zaproszenie { padding: 10px 14px; background: #fff8e1; border-bottom: 1px solid #f0d58a; }
.zaproszenie textarea { width: 100%; box-sizing: border-box; margin: 6px 0; font-family: inherit; }
.czaty-pusto { flex: 1; display: flex; align-items: center; justify-content: center; text-align: center; background: #f0f2f5; font-size: 15px; line-height: 1.6; }
.czaty-pusto div { max-width: 380px; } .czaty-pusto div::first-line { font-size: 40px; }
.nav-licznik { background: #25d366; color: #fff; border-radius: 10px; font-size: 11px; padding: 0 6px; margin-left: 3px; font-weight: 700; }
a.czat-auta { text-decoration: none; font-size: 15px; } a.czat-auta .licznik { font-size: 10px; padding: 0 5px; }
button.mini-link.czerwony { color: #b03a2e; } button.mini-link.czerwony:hover { color: #e74c3c; }
.faktura-form .kurs-wybor { flex: 1 1 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 8px 10px; background: #f7f4ec; border-radius: 8px; }
.faktura-form .kurs-wybor label { flex-direction: row; align-items: center; gap: 5px; }
.faktura-form .kurs-wybor .szary { flex-basis: 100%; }
.faktura-form .konta-wybor { flex: 1 1 100%; display: flex; flex-direction: column; gap: 4px; padding: 8px 10px; background: #f7f4ec; border-radius: 8px; }
.faktura-form .konta-wybor label { flex-direction: row; align-items: center; gap: 6px; }
.koszyki.rodzaj-dok { align-items: center; }
.koszyki.rodzaj-dok > strong { margin-right: 4px; }
.qr-2fa { text-align: center; margin: 10px 0; }
.qr-2fa svg { width: 220px; height: 220px; background: #fff; padding: 8px; border-radius: 8px; }
.kody-zapasowe { columns: 2; font-size: 1.1rem; }
.kody-zapasowe code { letter-spacing: 1px; }
@media print { .naglowek, nav, .konto, button, .przycisk { display: none !important; } }
.chip.sent-blad { background: #fde8e8; border-color: #e5a3a3; color: #b42318; }
.lista-sent { margin: 4px 0 10px 18px; line-height: 1.7; }
.przycisk-maly.czerwony-link { background: #fde8e8; border-color: #e5a3a3; color: #b42318; }