/* =====================================================================
   WSPÓLNY WYGLĄD WIDOKÓW (wyszukiwanie i wyniki: naprawy, klienci, firmy,
   samochody, ubezpieczalnie) – ten sam styl co karta naprawy i zestawienie.
   Wszystko zamknięte w .widok, żeby nie zmieniać reszty programu.
   ===================================================================== */
.widok {
    --btn-kolor: #2f6db5;
    --btn-kolor-hover: #255a96;
    --tekst: #222;
    --tekst-szary: #6a737d;
    --naglowek: #1f3b57;
    --ramka: #e1e4e8;
    --ramka-jasna: #eef0f2;
    font-size: 13px;
    line-height: 1.4;
    color: var(--tekst);
    max-width: 100%;
    clear: both;
}
.widok *, .widok *::before, .widok *::after { box-sizing: border-box; }

/* ---------- karta ---------- */
.widok .karta {
    background: #fff;
    border: 1px solid var(--ramka);
    border-radius: 8px;
    padding: 10px 12px;
    margin: 0 0 10px;
    box-shadow: 0 1px 2px rgba(0,0,0,.05);
}
.widok .karta > h2 {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    float: none;
    margin: 0 0 8px;
    padding: 0 0 6px;
    border-bottom: 1px solid var(--ramka-jasna);
    font-size: 14px;
    font-weight: 600;
    color: var(--naglowek);
}
.widok .karta > h2 > i { color: #5b7da3; font-size: 13px; }
.widok .karta > h2 .h2-prawa { margin-left: auto; display: inline-flex; gap: 6px; align-items: center; font-weight: normal; }
.widok .licznik {
    min-width: 22px; text-align: center; padding: 1px 8px; border-radius: 10px;
    background: var(--btn-kolor); color: #fff; font-size: 11px; font-weight: 600;
}

/* ---------- reset globalnego "a { height:20px; border:1px solid #ccc }" z main.css ---------- */
.widok a { height: auto; width: auto; margin: 0; border: 0; border-radius: 0; }
.widok .link { color: var(--btn-kolor); font-weight: 600; text-decoration: none; }
.widok .link:hover { text-decoration: underline; }

/* ---------- przyciski ---------- */
.widok .btn,
.widok button,
.widok input[type=submit] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: auto;
    margin: 0;
    padding: 4px 10px;
    font: inherit;
    font-size: 12px;
    line-height: 1.3;
    color: #fff;
    background: var(--btn-kolor);
    border: 1px solid var(--btn-kolor);
    border-radius: 5px;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}
.widok .btn:hover,
.widok button:hover,
.widok input[type=submit]:hover {
    background: var(--btn-kolor-hover);
    border-color: var(--btn-kolor-hover);
    color: #fff;
    text-decoration: none;
}
.widok .btn-obrys { background: #fff; color: var(--btn-kolor); }
.widok .btn-obrys:hover { background: #eef4fb; color: var(--btn-kolor-hover); }
.widok .btn-usun { background: #fff; color: #c62828; border-color: #e3a0a0; }
.widok .btn-usun:hover { background: #c62828; border-color: #c62828; color: #fff; }
.widok .btn-maly { padding: 2px 8px; font-size: 11px; }

/* ---------- formularz wyszukiwania ---------- */
.widok .szukaj-form {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 8px 12px;
    align-items: end;
    margin: 0;
}
.widok .szukaj-form .pole { display: flex; flex-direction: column; align-items: stretch; gap: 3px; min-width: 0; margin: 0; padding: 0; }
.widok .szukaj-form label {
    color: var(--tekst-szary);
    font-weight: 600;
    font-size: 12px;
    margin: 0;
}
.widok .szukaj-form .przyciski { display: flex; gap: 6px; align-items: end; }
.widok input[type=text],
.widok select {
    width: 100%;
    min-width: 0;
    height: auto;
    margin: 0;
    font: inherit;
    font-size: 12px;
    padding: 5px 8px;
    border: 1px solid var(--btn-kolor);
    border-radius: 5px;
    background: #fff;
    color: var(--tekst);
}
.widok input[type=text]:focus,
.widok select:focus { outline: 2px solid rgba(47,109,181,.25); }

/* ---------- tabela wyników ---------- */
.widok .tabela-wrap { width: 100%; overflow-x: auto; }
.widok table.tabela {
    display: table;
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    margin: 0;
}
.widok table.tabela th {
    background: #f6f8fa;
    color: #57606a;
    font-weight: 600;
    text-align: left;
    padding: 6px 8px;
    white-space: nowrap;
    border-bottom: 1px solid var(--ramka);
}
.widok table.tabela td {
    padding: 6px 8px;
    border-bottom: 1px solid var(--ramka-jasna);
    vertical-align: middle;
}
.widok table.tabela tr:hover td { background: #fafbfc; }
.widok table.tabela td.akcje { text-align: right; white-space: nowrap; }
.widok table.tabela td.akcje .btn + .btn { margin-left: 4px; }
.widok table.tabela .srodek { text-align: center; }
.widok .szary { color: var(--tekst-szary); }
.widok .mono { font-family: Consolas, "Courier New", monospace; letter-spacing: .3px; }

/* ---------- tablica rejestracyjna + kopiowanie ---------- */
.widok .tablica-mini {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: Consolas, "Courier New", monospace;
    font-weight: 700;
    font-size: 12px;
    padding: 0 5px;
    border: 1px solid #222;
    border-left: 6px solid #003399;
    border-radius: 3px;
    background: #fff;
    white-space: nowrap;
}
.widok .kopiuj {
    cursor: pointer;
    background: none;
    border: 0;
    padding: 0 2px;
    font-size: 12px;
    color: var(--tekst-szary);
}
.widok .kopiuj:hover { background: none; color: var(--btn-kolor); border: 0; }

/* ---------- etapy naprawy (oględziny, wycena, kosztorys, akceptacja, FV) ---------- */
.widok .etap {
    display: inline-block;
    min-width: 72px;
    padding: 1px 6px;
    border-radius: 10px;
    font-size: 11px;
    text-align: center;
    white-space: nowrap;
}
.widok .etap.ok   { background: #e7f4ea; color: #2e7d32; }
.widok .etap.brak { background: #fbeaea; color: #c62828; }

/* ---------- właściciele ---------- */
.widok .wlasciciel {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: none;
    border: 0;
    padding: 0;
    color: var(--btn-kolor);
    font-size: 12px;
    cursor: pointer;
    text-align: left;
    white-space: normal;
}
.widok .wlasciciel:hover { background: none; color: var(--btn-kolor-hover); text-decoration: underline; border: 0; }
.widok .wlasciciel i { font-size: 10px; color: #5b7da3; }

/* ---------- pusto ---------- */
.widok .pusto {
    padding: 14px;
    text-align: center;
    color: var(--tekst-szary);
    font-style: italic;
}

/* ---------- okno z danymi kontaktowymi ---------- */
.widok-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,.45);
    font-size: 13px;
}
.widok-modal.otwarte { display: flex; }
.widok-modal .okno {
    width: 440px;
    max-width: 94vw;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0,0,0,.2);
    overflow: hidden;
}
.widok-modal .okno-naglowek {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    border-bottom: 1px solid #eef0f2;
    font-weight: 600;
    color: #1f3b57;
}
.widok-modal .okno-zamknij {
    background: none; border: 0; font-size: 18px; line-height: 1; cursor: pointer; color: #6a737d;
}
.widok-modal .okno-tresc { padding: 10px 14px 14px; }
.widok-modal .kontakt-grupa { margin-bottom: 10px; }
.widok-modal .kontakt-grupa h4 { margin: 0 0 4px; font-size: 12px; color: #6a737d; }
.widok-modal .kontakt-wiersz {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    padding: 5px 8px; margin-bottom: 4px; background: #f6f8fa; border-radius: 6px;
    word-break: break-word;
}
.widok-modal .kontakt-wiersz a {
    flex: 0 0 auto;
    height: auto; margin: 0; border: 0;
    padding: 3px 8px; border-radius: 5px; font-size: 11px;
    background: #2f6db5; color: #fff; text-decoration: none; white-space: nowrap;
}
.widok-modal .kontakt-wiersz a:hover { background: #255a96; }

/* main.css centruje tekst w komórkach i etykietach – w widokach wyrównujemy do lewej */
.widok table.tabela th,
.widok table.tabela td,
.widok .szukaj-form label { text-align: left; }
.widok table.tabela .srodek { text-align: center; }
.widok table.tabela td.akcje { text-align: right; }
.widok a.szary { text-decoration: none; }
.widok a.szary:hover { color: var(--btn-kolor); text-decoration: underline; }
.widok, .widok-modal { text-align: left; }
.widok .szukaj-form label { margin: 0; }

/* ---------- rozliczenia ---------- */
.widok .podsumowanie { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.widok .kafel {
    display: flex; flex-direction: column; gap: 2px; min-width: 180px;
    padding: 8px 12px; border-radius: 6px; background: #f6f8fa; border-left: 4px solid var(--btn-kolor);
}
.widok .kafel span { font-size: 11px; color: var(--tekst-szary); }
.widok .kafel b { font-size: 16px; color: var(--naglowek); }
.widok .kafel-zielony { border-left-color: #2e7d32; }
.widok .kafel-zielony b { color: #2e7d32; }
.widok .kafel-czerwony { border-left-color: #c62828; }
.widok .kafel-czerwony b { color: #c62828; }
.widok table.tabela .prawo { text-align: right; white-space: nowrap; }
.widok .kwota-zalegla { color: #c62828; }
.widok .wplata-form { display: flex; gap: 6px; align-items: center; margin: 0; width: auto; }
.widok .wplata-form input[type=text] { width: 110px; }


/* =====================================================================
   STARE STRONY (formularze dodawania/edycji, karty klienta/firmy/samochodu,
   dołączanie plików itd.) – MasterTemplate owija je w .widok-strona.
   :where() daje regułom minimalną wagę: nadpisują ogólne reguły z main.css
   (bo ten plik ładuje się później), ale nie psują stylów wbudowanych
   w poszczególne widoki ani nowych kart (.widok, .karta).
   ===================================================================== */
.widok-strona {
    --btn-kolor: #2f6db5;
    --btn-kolor-hover: #255a96;
    font-size: 13px;
    line-height: 1.4;
    color: #222;
    text-align: left;
}
.widok-strona::after { content: ""; display: block; clear: both; }

/* nagłówki */
:where(.widok-strona) h1 {
    display: block;
    clear: both;
    margin: 0 0 10px;
    padding: 10px 12px;
    font-size: 15px;
    font-weight: 600;
    color: #1f3b57;
    background: #fff;
    border: 1px solid #e1e4e8;
    border-left: 4px solid var(--btn-kolor);
    border-radius: 8px;
}
:where(.widok-strona) h2 {
    display: block;
    float: none;
    margin: 0 0 8px;
    padding: 0 0 6px;
    font-size: 14px;
    font-weight: 600;
    color: #1f3b57;
    border-bottom: 1px solid #eef0f2;
}
:where(.widok-strona) h3 { font-size: 13px; color: #1f3b57; margin: 8px 0 6px; }

/* globalne "a { height:20px; border:1px solid #ccc }" z main.css */
:where(.widok-strona) a { height: auto; border: 0; margin-right: 0; border-radius: 0; color: var(--btn-kolor); }

/* karty: ramka formularza, sekcje danych, elementy listy */
:where(.widok-strona) .form_wrapper,
:where(.widok-strona) .info_sekcja,
:where(.widok-strona) .info_sekcja_pelna,
:where(.widok-strona) .info_blok,
:where(.widok-strona) .info_group,
:where(.widok-strona) .element_listy {
    background: #fff;
    border: 1px solid #e1e4e8;
    border-radius: 8px;
    padding: 10px 12px;
    box-shadow: 0 1px 2px rgba(0,0,0,.05);
    color: #222;
    box-sizing: border-box;
}
:where(.widok-strona) .form_wrapper { float: none; width: 100%; margin: 0 0 10px; }
:where(.widok-strona) .info_sekcja,
:where(.widok-strona) .info_sekcja_pelna {
    float: left;
    width: 340px;
    max-width: 100%;
    min-height: 0;
    margin: 0 10px 10px 0;
}
:where(.widok-strona) .element_listy { float: left; min-width: 220px; margin: 0 10px 10px 0; }
:where(.widok-strona) .opis_sekcji br { display: none; }
:where(.widok-strona) .info_dodaj { float: right; height: auto; margin: 0 0 4px 8px; background: none; }

/* wiersze etykieta / wartość */
:where(.widok-strona) .wiersz,
:where(.widok-strona) .wiersz_dokumentu,
:where(.widok-strona) .wiersz_n {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 8px;
    margin: 0;
    padding: 5px 0;
    background: none;
    border: 0;
    border-bottom: 1px dashed #eef0f2;
    border-radius: 0;
}
:where(.widok-strona) .wiersz:last-child { border-bottom: 0; }
:where(.widok-strona) .wiersz > h2 { flex-basis: 100%; border: 0; padding: 0; margin: 0; font-size: 12px; color: #6a737d; }
:where(.widok-strona) .etykieta {
    width: 130px;
    margin: 0;
    padding: 0;
    font-size: 12px;
    font-weight: 600;
    color: #6a737d;
}
:where(.widok-strona) .dane {
    display: inline;
    flex: 1 1 auto;
    width: auto;
    margin: 0;
    min-width: 0;
    word-break: break-word;
}
:where(.widok-strona) .opcje,
:where(.widok-strona) .opcja { display: inline-flex; gap: 4px; align-items: center; }
:where(.widok-strona) .opcje a,
:where(.widok-strona) .opcja a { display: inline-flex; }

/* proste formularze: etykieta + pole jedno pod drugim -> dwie kolumny */
:where(.widok-strona) form:has(> label) {
    display: grid;
    grid-template-columns: minmax(130px, 200px) minmax(0, 420px);
    gap: 6px 12px;
    align-items: center;
    width: 100%;
    margin: 0;
}
:where(.widok-strona) form:has(> label):not(:where(.form_wrapper, .info_sekcja, .karta) form) {
    background: #fff;
    border: 1px solid #e1e4e8;
    border-radius: 8px;
    padding: 12px;
    box-shadow: 0 1px 2px rgba(0,0,0,.05);
    margin-bottom: 10px;
    box-sizing: border-box;
}
:where(.widok-strona) form:has(> label) > label { grid-column: 1; }
:where(.widok-strona) form:has(> label) > :not(label):not([type=hidden]) { grid-column: 2; }
:where(.widok-strona) form:has(> label) > input[type=submit],
:where(.widok-strona) form:has(> label) > button { justify-self: start; }
:where(.widok-strona) form:has(> label) > fieldset { grid-column: 1 / -1; }

:where(.widok-strona) label {
    display: block;
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    color: #6a737d;
}
:where(.widok-strona) fieldset { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }

/* pola */
:where(.widok-strona) .inputbox,
:where(.widok-strona) .input,
:where(.widok-strona) .selectbox,
:where(.widok-strona) select,
:where(.widok-strona) textarea,
:where(.widok-strona) input[type=text],
:where(.widok-strona) input[type=password],
:where(.widok-strona) input[type=email],
:where(.widok-strona) input[type=number],
:where(.widok-strona) input[type=date],
:where(.widok-strona) input[type=tel],
:where(.widok-strona) input:not([type]) {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 30px;
    margin: 0;
    padding: 5px 8px;
    font: inherit;
    font-size: 12px;
    color: #222;
    background: #fff;
    border: 1px solid var(--btn-kolor);
    border-radius: 5px;
    box-shadow: none;
}
:where(.widok-strona) select.inputbox,
:where(.widok-strona) select.selectbox { width: 100%; }
:where(.widok-strona) textarea { min-height: 80px; resize: vertical; }
:where(.widok-strona) input[type=file] { font-size: 12px; border: 1px dashed var(--btn-kolor); border-radius: 5px; padding: 6px; background: #f6f8fa; width: 100%; box-sizing: border-box; }
:where(.widok-strona) .inputbox:focus,
:where(.widok-strona) .input:focus,
:where(.widok-strona) select:focus,
:where(.widok-strona) textarea:focus,
:where(.widok-strona) input:focus { outline: 2px solid rgba(47,109,181,.25); outline-offset: 0; }

/* przyciski – jedna barwa (bez gradientów i podskakiwania z main.css) */
:where(.widok-strona) button,
:where(.widok-strona) input[type=submit],
:where(.widok-strona) .opcje button,
:where(.widok-strona) .opcje button:hover {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    width: auto;
    height: auto;
    margin: 0;
    padding: 5px 12px;
    font: inherit;
    font-size: 12px;
    font-weight: normal;
    line-height: 1.3;
    color: #fff;
    background: var(--btn-kolor);
    border: 1px solid var(--btn-kolor);
    border-radius: 5px;
    transform: none;
    cursor: pointer;
    white-space: nowrap;
    text-decoration: none;
    filter: none;
}
:where(.widok-strona) button:hover,
:where(.widok-strona) input[type=submit]:hover,
:where(.widok-strona) .opcje button:hover {
    background: var(--btn-kolor-hover);
    border-color: var(--btn-kolor-hover);
    transform: none;
}
:where(.widok-strona) button:disabled,
:where(.widok-strona) button:disabled:hover {
    background: #e9ecef;
    border-color: #ced4da;
    color: #8a939c;
    cursor: not-allowed;
}

/* tabele bez własnej klasy */
:where(.widok-strona) table {
    border-collapse: collapse;
    width: 100%;
    font-size: 12px;
    background: #fff;
    margin: 0 0 10px;
}
:where(.widok-strona) th {
    background: #f6f8fa;
    color: #57606a;
    font-weight: 600;
    text-align: left;
    padding: 6px 8px;
    border: 0;
    border-bottom: 1px solid #e1e4e8;
}
:where(.widok-strona) td {
    padding: 6px 8px;
    border: 0;
    border-bottom: 1px solid #eef0f2;
    text-align: left;
    vertical-align: middle;
}

/* komunikaty */
:where(.widok-strona) .error,
:where(.widok-strona) .info {
    float: none;
    width: auto;
    margin: 0 0 10px;
    padding: 8px 12px;
    border-radius: 6px;
    text-align: left;
    font-size: 13px;
}
:where(.widok-strona) .error { background: #fbeaea; border: 1px solid #f1c0c0; color: #8e1c1c; }
:where(.widok-strona) .info  { background: #e7f4ea; border: 1px solid #b9dfc1; color: #1e5e24; }

@media (max-width: 700px) {
    :where(.widok-strona) form:has(> label) { grid-template-columns: 1fr; }
    :where(.widok-strona) form:has(> label) > * { grid-column: 1 !important; }
    :where(.widok-strona) .info_sekcja,
    :where(.widok-strona) .info_sekcja_pelna,
    :where(.widok-strona) .element_listy { float: none; width: 100%; margin-right: 0; }
}

/* przyciski usuwania na starych stronach – czerwony obrys, żeby nie klikać ich przypadkiem */
:where(.widok-strona) a[href*="sun"] > button,
:where(.widok-strona) a[href*="sun"] > button:hover {
    background: #fff;
    color: #c62828;
    border-color: #e3a0a0;
}
:where(.widok-strona) a[href*="sun"] > button:hover { background: #c62828; color: #fff; border-color: #c62828; }
:where(.widok-strona) a:has(> button) { text-decoration: none; }

/* ===== KALENDARZYK (jQuery UI datepicker) – wygląd spójny z resztą programu ===== */
.ui-datepicker {
    display: none;
    z-index: 10001 !important;
    width: 250px;
    padding: 8px;
    font-family: inherit;
    font-size: 12px;
    background: #fff;
    border: 1px solid #e1e4e8;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,.15);
}
.ui-datepicker.ui-widget.ui-widget-content.ui-helper-clearfix.ui-corner-all { background: #fff; padding: 8px; }
.ui-datepicker .ui-datepicker-header {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    margin-bottom: 6px;
    background: none;
    border: 0;
}
.ui-datepicker .ui-datepicker-title { margin: 0; font-weight: 600; color: #1f3b57; font-size: 13px; }
.ui-datepicker .ui-datepicker-title select { font-size: 12px; padding: 2px 4px; border: 1px solid #2f6db5; border-radius: 4px; }
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    position: absolute;
    top: 2px;
    width: 26px;
    height: 26px;
    border-radius: 5px;
    cursor: pointer;
    text-decoration: none;
    overflow: hidden;
    color: transparent;
}
.ui-datepicker .ui-datepicker-prev { left: 0; }
.ui-datepicker .ui-datepicker-next { right: 0; }
.ui-datepicker .ui-datepicker-prev::before,
.ui-datepicker .ui-datepicker-next::before {
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px; font-weight: 700; color: #2f6db5;
}
.ui-datepicker .ui-datepicker-prev::before { content: "‹"; }
.ui-datepicker .ui-datepicker-next::before { content: "›"; }
.ui-datepicker .ui-datepicker-prev:hover,
.ui-datepicker .ui-datepicker-next:hover { background: #eef4fb; }
.ui-datepicker .ui-icon { display: none; }
.ui-datepicker table.ui-datepicker-calendar {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
    font-size: 12px;
    background: none;
}
.ui-datepicker .ui-datepicker-calendar th {
    padding: 4px 0;
    text-align: center;
    color: #6a737d;
    font-weight: 600;
    background: none;
    border: 0;
}
.ui-datepicker .ui-datepicker-calendar th span { font-size: 11px; }
.ui-datepicker .ui-datepicker-calendar td { padding: 1px; border: 0; text-align: center; background: none; }
.ui-datepicker .ui-datepicker-calendar td a,
.ui-datepicker .ui-datepicker-calendar td span {
    display: block;
    height: auto;
    margin: 0;
    padding: 5px 0;
    border: 0;
    border-radius: 5px;
    text-align: center;
    text-decoration: none;
    color: #222;
    background: none;
    font-weight: normal;
}
.ui-datepicker .ui-datepicker-calendar td a:hover { background: #eef4fb; color: #255a96; }
.ui-datepicker .ui-datepicker-calendar td.ui-datepicker-week-end a { color: #c62828; }
.ui-datepicker .ui-datepicker-calendar td.ui-datepicker-today a { border: 1px solid #2f6db5; font-weight: 600; }
.ui-datepicker .ui-datepicker-calendar td a.ui-state-active { background: #2f6db5; color: #fff; }
.ui-datepicker .ui-datepicker-calendar td.ui-datepicker-other-month a,
.ui-datepicker .ui-datepicker-calendar td.ui-state-disabled span { color: #c0c6cc; }
.ui-datepicker .ui-datepicker-buttonpane {
    display: flex;
    justify-content: space-between;
    gap: 6px;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid #eef0f2;
    background: none;
}
.ui-datepicker .ui-datepicker-buttonpane button {
    height: auto;
    margin: 0;
    padding: 4px 10px;
    font: inherit;
    font-size: 12px;
    color: #2f6db5;
    background: #fff;
    border: 1px solid #2f6db5;
    border-radius: 5px;
    cursor: pointer;
}
.ui-datepicker .ui-datepicker-buttonpane button:hover { background: #2f6db5; color: #fff; }
/* część z godziną (dodatek timepicker) */
.ui-datepicker .ui-timepicker-div { margin-top: 6px; padding-top: 6px; border-top: 1px solid #eef0f2; }
.ui-datepicker .ui-timepicker-div dl { margin: 0; display: grid; grid-template-columns: 70px 1fr; gap: 4px 6px; align-items: center; }
.ui-datepicker .ui-timepicker-div dt { color: #6a737d; font-weight: 600; margin: 0; }
.ui-datepicker .ui-timepicker-div dd { margin: 0; }
.ui-datepicker .ui-timepicker-div select { font-size: 12px; padding: 2px 4px; border: 1px solid #2f6db5; border-radius: 4px; }
/* main.css: "table { display:block }" na węższych ekranach i paski w wierszach – w kalendarzu wyłączamy */
.ui-datepicker table.ui-datepicker-calendar { display: table !important; table-layout: fixed; }
.ui-datepicker table.ui-datepicker-calendar tr,
.ui-datepicker table.ui-datepicker-calendar tr:nth-child(n) { background: none !important; }
.ui-datepicker .ui-datepicker-title select,
.ui-datepicker .ui-timepicker-div select { color: #222; background: #fff; }
.ui-datepicker .ui-timepicker-div dd.ui_tpicker_time { font-weight: 600; color: #1f3b57; }
.ui-datepicker .ui-timepicker-div .ui_tpicker_time_input { border: 0; padding: 0; font: inherit; font-weight: 600; color: #1f3b57; background: none; }

/* ===== KOMUNIKATY (RuntimeInfo: .info = powodzenie, .error = błąd) – na każdej stronie =====
   main.css ustawia im float:left i width:100% + padding, przez co komunikat wychodził poza
   ekran i rozsuwał/zasłaniał elementy pod menu (np. pasek akcji w karcie naprawy). */
body .info,
body .error {
    float: none;
    clear: both;
    display: flex;
    align-items: center;
    gap: 8px;
    box-sizing: border-box;
    width: auto;
    max-width: 100%;
    margin: 0 0 10px;
    padding: 8px 12px;
    border-radius: 6px;
    text-align: left;
    font-size: 13px;
    line-height: 1.4;
}
body .info  { background: #e7f4ea; border: 1px solid #b9dfc1; color: #1e5e24; }
body .error { background: #fbeaea; border: 1px solid #f1c0c0; color: #8e1c1c; }
body .info::before  { content: "✔"; font-weight: 700; }
body .error::before { content: "!"; display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 50%; background: #c62828; color: #fff; font-size: 12px; font-weight: 700; flex: 0 0 auto; }