/* ═══════════════════════════════════════════════════════════════════════
   TERMINARZ — dodatek Estelio+ (2026-10-12). Wszystko pod .trm, żeby nie
   dotykać stylów reszty aplikacji. Paleta z projektu graficznego (plansza 02).
   ═══════════════════════════════════════════════════════════════════════ */
.trm { --t-bg:#F8F4EF; --t-sur:#FFFFFF; --t-ink:#302720; --t-mut:#675B57; --t-acc:#8D2947; --t-acc2:#F5E5E8; --t-line:#E6DBD5; --t-gold:#BD9560;
       --t-ok-fg:#245846; --t-ok-bg:#EAF4EE; --t-warn-fg:#78520E; --t-warn-bg:#FFF3D8; --t-bad-fg:#92253A; --t-bad-bg:#FBE9EC; --t-info-fg:#31576F; --t-info-bg:#EAF1F7;
       --t-r:12px; --t-rs:8px; --t-sh:0 14px 44px rgba(48,39,32,.11), 0 3px 12px rgba(48,39,32,.04);
       font-family:'DM Sans', 'Poppins', system-ui, sans-serif; color:var(--t-ink); font-size:14px; line-height:1.4; background:var(--t-bg); border-radius:18px; padding:16px; min-height:70vh; }
body.dark-mode .trm { --t-bg:#1f1b19; --t-sur:#2a2422; --t-ink:#f3ece6; --t-mut:#bfb2a9; --t-acc2:#4a2a35; --t-line:#4a403a; --t-ok-bg:#1f3a2d; --t-ok-fg:#bfe6cf; --t-warn-bg:#4a3a14; --t-warn-fg:#ffe1a1; --t-bad-bg:#4a2028; --t-bad-fg:#ffc1cc; --t-info-bg:#1f3242; --t-info-fg:#bcd8ec; }
.trm *, .trm *::before, .trm *::after { box-sizing:border-box; }
.trm h1, .trm h2, .trm h3, .trm h4 { margin:0; font-weight:600; color:var(--t-ink); }
.trm button { font-family:inherit; cursor:pointer; }
.trm input, .trm select, .trm textarea { font-family:inherit; font-size:14px; color:var(--t-ink); background:var(--t-sur); border:1px solid var(--t-line); border-radius:var(--t-rs); padding:9px 11px; min-height:44px; width:100%; }
.trm input:focus, .trm select:focus, .trm textarea:focus { outline:none; border-color:var(--t-acc); box-shadow:0 0 0 3px rgba(141,41,71,.12); }
.trm label { display:block; font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--t-mut); margin:0 0 5px; }
.trm .muted { color:var(--t-mut); }
.trm .small { font-size:12px; }
.trm code { font-family:Consolas, monospace; font-size:12px; background:var(--t-acc2); padding:1px 5px; border-radius:4px; }

/* ── nagłówek ── */
.trm-top { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.trm-top h1 { font-family:'Cormorant Garamond', serif; font-size:30px; font-weight:600; line-height:1; }
.trm-top .trm-sub { font-size:12px; color:var(--t-mut); margin-top:4px; }
.trm-nav { display:flex; align-items:center; gap:6px; }
.trm-nav input[type=date] { width:auto; min-height:40px; }
.trm-views { display:flex; gap:4px; background:var(--t-sur); border:1px solid var(--t-line); border-radius:999px; padding:4px; }
.trm-views button { border:none; background:transparent; color:var(--t-mut); padding:7px 14px; border-radius:999px; font-weight:500; font-size:13px; }
.trm-views button.on { background:var(--t-acc); color:#fff; }
.trm-spacer { flex:1; }
.trm-btn { border:1px solid var(--t-line); background:var(--t-sur); color:var(--t-ink); padding:9px 14px; border-radius:var(--t-rs); font-weight:500; font-size:13px; min-height:40px; white-space:nowrap; transition:all .15s; }
.trm-btn:hover { border-color:var(--t-acc); color:var(--t-acc); }
.trm-btn.primary { background:var(--t-acc); border-color:var(--t-acc); color:#fff; min-height:44px; font-weight:600; }
.trm-btn.primary:hover { filter:brightness(.92); color:#fff; }
.trm-btn.danger { color:var(--t-bad-fg); border-color:#e3b3bd; background:var(--t-bad-bg); }
.trm-btn.ok { color:var(--t-ok-fg); border-color:#a9d0b9; background:var(--t-ok-bg); }
.trm-btn.sm { padding:6px 10px; min-height:32px; font-size:12px; }
.trm-btn:disabled { opacity:.5; cursor:not-allowed; }
.trm-btn.link { border:none; background:none; color:var(--t-acc); padding:4px 6px; min-height:0; }
.trm-counters { display:flex; gap:14px; font-size:13px; color:var(--t-mut); flex-wrap:wrap; margin:-6px 0 10px; }
.trm-counters b { color:var(--t-ink); }

/* ── układ ── */
.trm-body { display:grid; grid-template-columns:1fr; gap:14px; align-items:start; }
.trm-body.z-panelem { grid-template-columns:minmax(0,1fr) 520px; }
.trm-main { min-width:0; }
.trm-panel { background:var(--t-sur); border:1px solid var(--t-line); border-radius:var(--t-r); box-shadow:var(--t-sh); padding:18px; position:sticky; top:12px; max-height:calc(100vh - 40px); overflow:auto; }
.trm-panel-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:12px; }
.trm-panel-head h2 { font-size:24px; line-height:1.15; }
.trm-panel-head .trm-numer { font-size:12px; color:var(--t-mut); font-weight:500; margin-top:3px; }
.trm-x { border:none; background:var(--t-bg); width:40px; height:40px; min-width:40px; flex:0 0 auto; border-radius:50%; font-size:16px; color:var(--t-mut); display:inline-grid; place-items:center; padding:0; }
.trm-x:hover { background:var(--t-acc2); color:var(--t-acc); }
.trm-field { margin-bottom:12px; }
.trm-row { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.trm-row > * { flex:1; min-width:0; }
.trm-row .fix { flex:0 0 auto; }
/* kontrolki o stałym rozmiarze nigdy nie rozciągają się w .trm-row (raport T07: owalny ✕, rozciągnięty przełącznik) */
.trm-row > .trm-x, .trm-row > .trm-switch, .trm-row > .trm-awatar, .trm-row > .trm-pill, .trm-row > .trm-segment { flex:0 0 auto; }
.trm-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.trm-card { background:var(--t-sur); border:1px solid var(--t-line); border-radius:var(--t-r); padding:16px; }
.trm-card + .trm-card { margin-top:12px; }
.trm-card h3 { font-size:15px; margin-bottom:10px; }
.trm-note { border-radius:var(--t-rs); padding:10px 12px; font-size:13px; line-height:1.5; border:1px solid transparent; margin:8px 0; }
.trm-note.ok { background:var(--t-ok-bg); color:var(--t-ok-fg); border-color:#bfdcc9; }
.trm-note.warn { background:var(--t-warn-bg); color:var(--t-warn-fg); border-color:#ecd59a; }
.trm-note.bad { background:var(--t-bad-bg); color:var(--t-bad-fg); border-color:#eab8c3; }
.trm-note.info { background:var(--t-info-bg); color:var(--t-info-fg); border-color:#bfd3e4; }
.trm-pill { display:inline-flex; align-items:center; gap:4px; border-radius:999px; padding:3px 10px; font-size:11.5px; font-weight:600; white-space:nowrap; }
.trm-pill.ok { background:var(--t-ok-bg); color:var(--t-ok-fg); } .trm-pill.warn { background:var(--t-warn-bg); color:var(--t-warn-fg); }
.trm-pill.bad { background:var(--t-bad-bg); color:var(--t-bad-fg); } .trm-pill.info { background:var(--t-info-bg); color:var(--t-info-fg); } .trm-pill.neu { background:var(--t-acc2); color:var(--t-acc); }
.trm-empty { text-align:center; padding:40px 16px; color:var(--t-mut); }
.trm-empty .big { font-size:34px; margin-bottom:8px; }
.trm-table { width:100%; border-collapse:collapse; font-size:13px; }
.trm-table th { text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--t-mut); padding:8px 10px; border-bottom:1px solid var(--t-line); }
.trm-table td { padding:9px 10px; border-bottom:1px solid var(--t-line); vertical-align:middle; }
.trm-table tr:last-child td { border-bottom:none; }
.trm-table input, .trm-table select { min-height:34px; padding:5px 8px; font-size:13px; }
.trm-chips { display:flex; flex-wrap:wrap; gap:6px; }
.trm-chip { border:1px solid var(--t-line); background:var(--t-sur); border-radius:999px; padding:5px 11px; font-size:12.5px; color:var(--t-mut); }
.trm-chip.on { background:var(--t-acc2); border-color:var(--t-acc); color:var(--t-acc); font-weight:600; }

/* ── siatka dnia / tygodnia ── */
.trm-grid { background:var(--t-sur); border:1px solid var(--t-line); border-radius:var(--t-r); overflow:auto; position:relative; max-height:calc(100vh - 170px); }
.trm-grid-inner { display:grid; min-width:max-content; }
.trm-col-h { position:sticky; top:0; z-index:5; background:var(--t-sur); border-bottom:1px solid var(--t-line); border-left:1px solid var(--t-line); padding:10px 15px; min-width:180px; display:flex; align-items:center; gap:12px; }
.trm-col-h.hours { border-left:none; position:sticky; left:0; z-index:7; min-width:58px; }
.trm-col-h .name { font-weight:600; font-size:14px; }
.trm-col-h .hrs { font-size:11.5px; color:var(--t-mut); margin-top:2px; }
.trm-hours { position:sticky; left:0; z-index:4; background:var(--t-sur); border-right:1px solid var(--t-line); min-width:58px; }
.trm-hour { position:absolute; left:0; right:0; font-size:11px; color:var(--t-mut); text-align:right; padding-right:8px; transform:translateY(-6px); }
.trm-col { position:relative; border-right:1px solid var(--t-line); min-width:180px; background:repeating-linear-gradient(135deg, transparent 0 6px, rgba(48,39,32,.045) 6px 7px); }
.trm-col:last-child { border-right:none; }
.trm-col .dost { position:absolute; left:0; right:0; background:var(--t-sur); }
.trm-col .blok { position:absolute; left:3px; right:3px; border-radius:6px; background:repeating-linear-gradient(135deg, var(--t-bg) 0 8px, #efe6dd 8px 10px); border:1px dashed var(--t-line); color:var(--t-mut); font-size:11px; padding:4px 6px; overflow:hidden; }
.trm-col .hline { position:absolute; left:0; right:0; border-top:1px solid var(--t-line); opacity:.6; pointer-events:none; }
.trm-col .hline.half { border-top-style:dotted; opacity:.4; }
.trm-col .teraz { position:absolute; left:0; right:0; border-top:2px solid var(--t-acc); z-index:3; pointer-events:none; }
.trm-col .teraz::before { content:''; position:absolute; left:-4px; top:-5px; width:8px; height:8px; border-radius:50%; background:var(--t-acc); }
.trm-karta { position:absolute; left:5px; right:5px; width:calc(100% - 10px); border-radius:7px; border:1px solid rgba(48,39,32,.12); border-left:5px solid var(--kat, var(--t-gold)); background:var(--tlo, #fff); padding:5px 11px; overflow:hidden; cursor:pointer; z-index:2; font-size:12px; line-height:1.25; transition:box-shadow .13s, filter .13s; touch-action:pan-y; }
.trm-karta:hover, .trm-karta:focus-visible { box-shadow:0 4px 12px rgba(48,39,32,.1); filter:brightness(.99); z-index:4; }
.trm-karta .g { font-weight:600; font-size:11.5px; }
.trm-karta .k { font-weight:600; font-size:13.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.trm-karta .u { color:var(--t-mut); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:11.5px; }
.trm-karta .zn { display:flex; gap:4px; margin-top:3px; flex-wrap:wrap; }
.trm-karta .zn span { font-size:10px; font-weight:600; border-radius:999px; padding:1px 6px; background:var(--t-acc2); color:var(--t-acc); }
.trm-karta.anul { opacity:.45; border-style:dashed; background:var(--t-bg); }
.trm-karta.wyk { border-color:#bfdcc9; }
.trm-karta.wyk .zn .st { background:var(--t-ok-bg); color:var(--t-ok-fg); }
.trm-karta.nieob .zn .st { background:var(--t-bad-bg); color:var(--t-bad-fg); }
.trm-karta.akt { outline:2px solid var(--t-acc); }
.trm-karta.bufor { background:repeating-linear-gradient(135deg, #f6efe8 0 5px, #ede3d8 5px 6px); border:1px dashed var(--t-line); border-left:4px solid transparent; cursor:default; color:var(--t-mut); font-size:10.5px; z-index:1; }
.trm-karta.przeciagalna { cursor:grab; }
.trm-karta.przeciagalna:active { cursor:grabbing; }
.trm-karta.przeciagana { opacity:.28; }
/* D01: karta 20–39 min = 2 linie: „09:00–09:30 · Klientka” (niełamany zakres, skrót poziomy) + usługa; <20 min = 1 linia; nic nie jest ucinane pionowo */
.trm-karta.krotka { padding:4px 9px 3px; line-height:1.2; }
.trm-karta.krotka .l1 { display:flex; align-items:baseline; gap:0; white-space:nowrap; overflow:hidden; }
.trm-karta.krotka .l1 .g { flex:0 0 auto; white-space:nowrap; font-size:11.5px; }
.trm-karta.krotka .l1 .sep { flex:0 0 auto; color:var(--t-mut); margin:0 4px; } /* odstęp wokół kropki — w flexie białe znaki w spanie są ucinane */
.trm-karta.krotka .l1 .k { flex:0 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; font-size:12.5px; }
.trm-karta.krotka .u { display:block; font-size:11px; line-height:1.2; }
.trm-karta.krotka .zn { display:none; }
.trm-karta.mini { padding:2px 8px; line-height:1.15; }
.trm-karta.mini .l1 .k { font-size:11.5px; }
.trm-confirm-move .trm-cm-wiersz { display:flex; gap:8px; font-size:13px; margin:3px 0; }
.trm-confirm-move .trm-cm-wiersz .e { color:var(--t-mut); min-width:76px; }
.trm-confirm-move .trm-cm-wiersz .nowy { color:var(--t-acc); font-weight:600; }
.trm-col.drag-nad { background-color:var(--t-acc2); outline:2px dashed var(--t-acc); outline-offset:-2px; }
.trm.przeciaganie { user-select:none; }
.trm.przeciaganie .trm-karta { cursor:grabbing; }

/* ── awatar kolumny (nagłówek siatki Dzień) — 4 warianty kolorów jak w projekcie ── */
.trm-awatar { width:43px; height:43px; border-radius:50%; background:#f9d9e4; color:#a12c55; display:inline-flex; align-items:center; justify-content:center; font-size:20px; font-weight:700; flex-shrink:0; }
.trm-awatar.mint { background:#ddf3eb; color:#258d76; }
.trm-awatar.gold { background:#fff0cb; color:#b38726; }
.trm-awatar.blue { background:#dcecff; color:#36648a; }
.trm-awatar.sm { width:26px; height:26px; font-size:12px; }

/* ── chmurka: krótki podgląd wizyty po najechaniu/kliknięciu karty (bez otwierania pełnego panelu) ── */
.trm-bubble-layer { position:fixed; inset:0; z-index:9400; pointer-events:none; }
.trm-bubble { position:absolute; width:380px; max-width:calc(100vw - 24px); background:var(--t-sur); border:1px solid var(--t-line); box-shadow:var(--t-sh); border-radius:16px; padding:22px; pointer-events:auto; animation:trm-wjazd .15s ease; }
.trm-bubble h4 { margin:2px 0 2px; font-size:23px; font-family:inherit; }
.trm-bubble h4::before { content:none; }
.trm-bubble .trm-x { width:36px; height:36px; min-width:36px; font-size:14px; }
.trm-bubble-poz { display:grid; grid-template-columns:92px 1fr; gap:4px 10px; padding:8px 0; border-top:1px solid var(--t-line); font-size:13px; }
.trm-bubble-poz:first-of-type { border-top:none; }
.trm-bubble-poz .g { font-weight:600; }
.trm-bubble-poz .m { color:var(--t-mut); font-size:12px; grid-column:2; }
.trm-bubble-rozl { display:flex; align-items:center; gap:8px; margin-top:10px; font-size:12.5px; color:var(--t-mut); }
/* R01: akcja główna na pełnej szerokości, pod nią działania drugorzędne (makieta 02-podglad-wizyty) */
.trm-bubble-foot { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:16px; }
.trm-bubble-foot .trm-btn { min-width:0; white-space:normal; line-height:1.25; }
.trm-bubble-foot .trm-btn.glowna { grid-column:1 / -1; min-height:44px; font-size:14px; }
.trm-bubble-foot .trm-btn.link { text-decoration:underline; text-underline-offset:3px; }
/* R02: drugi przedział godzin — widoczny tylko po rozwinięciu lub gdy jest w danych */
.trm-dz-b { display:inline-flex; align-items:center; gap:6px; }
.trm-dz-b[hidden] { display:none; }
/* R03: jedna karta wyniku w kroku „Termin” */
.trm-wynik-termin { border:1px solid var(--t-line); border-radius:12px; padding:14px 16px; background:var(--t-sur); margin:8px 0; }
.trm-wynik-termin.ok { border-color:#bfdcc9; background:#f4faf6; }
.trm-wynik-termin.zajety { border-color:#eab8c3; background:#fdf5f6; }
.trm-wynik-termin.blad { border-color:#ecd59a; background:#fffaf0; }
.trm-wynik-termin .godz { font-size:26px; font-weight:700; letter-spacing:-.3px; line-height:1.1; }
.trm-wynik-termin .st { font-size:13px; font-weight:600; margin-top:2px; }
.trm-wynik-termin.ok .st { color:var(--t-ok-fg); } .trm-wynik-termin.zajety .st { color:var(--t-bad-fg); } .trm-wynik-termin.blad .st { color:var(--t-warn-fg); }
.trm-wynik-termin .seg { display:grid; grid-template-columns:92px 1fr; gap:3px 10px; font-size:14px; margin-top:10px; }
.trm-wynik-termin .seg .m { grid-column:2; color:var(--t-mut); font-size:13px; }
.trm-propozycja { position:absolute; left:5px; right:5px; border:2px dashed #558cff; background:#eaf2ffdb; border-radius:8px; padding:6px 10px; z-index:6; pointer-events:none; font-size:12px; overflow:hidden; color:#243b6b; }
.trm-propozycja b { display:block; }
/* R04: tryb Ustawień — osobne wejście, bez nawigacji po dniach */
.trm-top2 { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:-6px 0 12px; }
.trm-top2 .trm-btn.ust { display:inline-flex; align-items:center; gap:6px; }
.trm-top2 .trm-btn.ust.on { background:var(--t-acc2); border-color:var(--t-acc); color:var(--t-acc); }
.trm-ust-naglowek { display:none; align-items:center; gap:14px; flex-wrap:wrap; margin:0 0 6px; }
.trm-ust-naglowek h2 { font-size:22px; }
.trm.tryb-ustawienia .trm-nav, .trm.tryb-ustawienia .trm-views, .trm.tryb-ustawienia .trm-counters, .trm.tryb-ustawienia .trm-filtry, .trm.tryb-ustawienia .trm-szukaj { display:none; }
.trm.tryb-ustawienia .trm-ust-naglowek { display:flex; }
@media (max-width: 1100px) { .trm-top .trm-szukaj { order:9; flex:1 1 100%; max-width:none; } }
/* T02/T03: zakupy klientki w kroku „Zabieg” */
.trm-zakup { border:1px solid var(--t-line); border-radius:11px; padding:12px 14px; background:var(--t-sur); margin-bottom:8px; }
.trm-zakup.wygasly, .trm-zakup.zamkniety { opacity:.7; background:var(--t-bg); }
.trm-zakup .n { font-weight:600; font-size:14px; }
.trm-zakup .m { color:var(--t-mut); font-size:12.5px; }
.trm-zakup-skl { display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:8px 0 0; }
.trm-zakup-skl .saldo { display:inline-flex; gap:6px; font-size:12px; }
.trm-zakup-skl .saldo span { background:var(--t-bg); border-radius:999px; padding:3px 9px; }
.trm-zakup-skl .saldo span.wolne { background:var(--t-ok-bg); color:var(--t-ok-fg); font-weight:600; }
.trm-zakup-skl .saldo span.zero { background:var(--t-bad-bg); color:var(--t-bad-fg); font-weight:600; }
.trm-pill.pakiet { background:#e5efff; color:#3763a0; }
.trm-obsada .kom.wyjatek { outline:2px dashed var(--t-acc); outline-offset:-2px; }
.trm-obsada .kom.akt { box-shadow:0 0 0 2px var(--t-acc); }
.trm-dzien-edytor .trm-stopka { margin-top:10px; }
.trm-obsada .kom small { display:block; font-size:10.5px; }
.trm-oferty { width:100%; border-collapse:collapse; font-size:13px; }
.trm-oferty th { text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--t-mut); padding:8px 6px; border-bottom:1px solid var(--t-line); }
.trm-oferty td { padding:7px 6px; border-bottom:1px solid var(--t-line); vertical-align:middle; }
.trm-oferty select, .trm-oferty input { min-height:34px; padding:4px 8px; font-size:13px; }
.trm-oferty input.j { width:64px; }
@keyframes trm-wjazd { from { opacity:0; transform:translateY(3px); } to { opacity:1; transform:translateY(0); } }

/* ── przeciąganie: pole docelowe na żywo + dymek przy kursorze ── */
.trm-draft-slot { position:absolute; left:5px; right:5px; border:1.5px dashed #558cff; background:#eaf2ffdb; border-radius:8px; padding:6px 10px; z-index:6; pointer-events:none; font-size:12px; overflow:hidden; color:#2f4a86; font-weight:600; }
.trm-draft-slot.zle { border-color:#bc4056; background:#fbe9eece; color:#8a2d43; }
.trm-drag-tip { position:fixed; z-index:9500; background:#2f3141; color:#fff; padding:9px 14px; border-radius:9px; box-shadow:var(--t-sh); font-size:13px; pointer-events:none; max-width:310px; line-height:1.4; }
.trm-drag-tip.zle { background:#9a3148; }

/* ── mini potwierdzenie przeniesienia (po puszczeniu karty) ── */
.trm-confirm-move { position:absolute; width:320px; max-width:calc(100vw - 24px); background:var(--t-sur); border:1px solid var(--t-line); box-shadow:var(--t-sh); border-radius:14px; padding:16px; pointer-events:auto; animation:trm-wjazd .14s ease; }
.trm-legenda { display:flex; gap:14px; flex-wrap:wrap; font-size:12px; color:var(--t-mut); margin-top:8px; }
.trm-legenda span::before { content:''; display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:5px; vertical-align:-1px; background:var(--c); }
.trm-week-h { display:grid; grid-template-columns:58px repeat(7, minmax(150px,1fr)); }

/* ── agenda ── */
.trm-agenda-dzien { margin-bottom:14px; }
.trm-agenda-dzien h3 { font-size:14px; color:var(--t-mut); font-weight:600; margin:0 0 6px; padding-bottom:4px; border-bottom:1px solid var(--t-line); }
.trm-ag-head { display:grid; grid-template-columns:90px 1fr 150px 230px 120px; gap:10px; padding:0 12px 7px; font-size:11.5px; font-weight:700; color:var(--t-mut); text-transform:uppercase; letter-spacing:.3px; }
.trm-ag-row { display:grid; grid-template-columns:90px 1fr 150px 230px 120px; gap:10px; align-items:center; background:var(--t-sur); border:1px solid var(--t-line); border-left:4px solid var(--kat, var(--t-gold)); border-radius:var(--t-rs); padding:9px 12px; margin-bottom:6px; cursor:pointer; }
.trm-ag-row:hover { border-color:var(--t-acc); }
.trm-ag-row .t { font-weight:600; }
.trm-ag-row .k { font-weight:600; }
.trm-ag-row .u { color:var(--t-mut); font-size:12.5px; }
.trm-ag-prac { display:flex; align-items:center; gap:7px; font-size:13px; min-width:0; }
.trm-ag-prac span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.trm-ag-status { display:flex; gap:5px; flex-wrap:wrap; }
.trm-ag-rozl { display:flex; }

/* ── szczegóły wizyty ── */
.trm-poz { border:1px solid var(--t-line); border-radius:11px; padding:12px 14px; margin-bottom:10px; background:var(--t-sur); }
.trm-poz .n { font-weight:600; }
.trm-poz .m { font-size:12.5px; color:var(--t-mut); margin-top:2px; }
.trm-poz .a { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.trm-hist { font-size:12px; color:var(--t-mut); border-left:2px solid var(--t-line); padding-left:10px; margin-top:6px; }
.trm-hist div { margin-bottom:4px; }
.trm-kwota { display:flex; justify-content:space-between; font-size:13px; padding:4px 0; border-bottom:1px dashed var(--t-line); }
.trm-kwota.suma { font-weight:700; border-bottom:none; }
.trm-alt { display:flex; align-items:center; justify-content:space-between; gap:10px; border:1px solid var(--t-line); border-radius:var(--t-rs); padding:8px 10px; margin-top:6px; background:var(--t-sur); }
.trm-alt .d { font-size:12px; color:var(--t-mut); }
.trm-wyniki-klient { border:1px solid var(--t-line); border-radius:var(--t-rs); background:var(--t-sur); max-height:200px; overflow:auto; margin-top:4px; }
.trm-wyniki-klient div { padding:8px 10px; cursor:pointer; border-bottom:1px solid var(--t-line); font-size:13px; }
.trm-wyniki-klient div:hover { background:var(--t-acc2); }
.trm-wyniki-klient .m { font-size:11.5px; color:var(--t-mut); }
.trm-usl-lista { max-height:220px; overflow:auto; border:1px solid var(--t-line); border-radius:var(--t-rs); background:var(--t-sur); }
.trm-usl-lista div { padding:7px 10px; border-bottom:1px solid var(--t-line); cursor:pointer; font-size:13px; display:flex; justify-content:space-between; gap:8px; }
.trm-usl-lista div:hover { background:var(--t-acc2); }
.trm-usl-lista div.off { opacity:.5; cursor:not-allowed; }
.trm-wybrana { border:1px solid var(--t-line); border-radius:var(--t-rs); padding:8px 10px; margin-top:6px; background:var(--t-bg); }
.trm-wybrana .r { display:grid; grid-template-columns:1fr 110px 32px; gap:6px; align-items:center; margin-top:6px; }

/* ── kreator "Nowa wizyta" (przycisk w nagłówku): wskaźnik kroków + karty klientki/usługi ── */
.trm-kroki { display:flex; justify-content:space-between; margin:20px 0 6px; position:relative; }
.trm-kroki::before { content:''; height:1px; background:#e8c9d5; position:absolute; left:30px; right:30px; top:18px; }
.trm-krok-el { text-align:center; position:relative; width:33%; color:var(--t-mut); font-size:12.5px; }
.trm-krok-el b { width:36px; height:36px; border-radius:50%; display:grid; place-items:center; margin:0 auto 6px; background:#eeeae7; color:#7c7780; outline:8px solid var(--t-sur); font-weight:700; font-size:14px; }
.trm-krok-el.aktywny { color:var(--t-acc); font-weight:600; }
.trm-krok-el.aktywny b { color:#fff; background:var(--t-acc); }
.trm-klient-karta { display:flex; align-items:center; gap:12px; border:1px solid var(--t-line); background:var(--t-sur); border-radius:11px; padding:13px 14px; width:100%; text-align:left; color:var(--t-ink); margin-bottom:8px; cursor:pointer; }
.trm-klient-karta:hover { border-color:#bf7c95; background:#fffafb; }
.trm-usl-karta { display:flex; gap:12px; align-items:center; justify-content:space-between; padding:13px 14px; border:1px solid var(--t-line); border-radius:11px; margin-top:8px; cursor:pointer; background:var(--t-sur); }
.trm-usl-karta:hover { border-color:var(--t-acc); background:#fffafd; }
.trm-usl-karta.off { opacity:.5; cursor:not-allowed; }
.trm-sloty { display:flex; gap:8px; flex-wrap:wrap; }
.trm-sloty button { border:1px solid #cfa4b3; background:#fff; border-radius:8px; padding:9px 17px; min-height:40px; font-size:13px; }
.trm-sloty button.selected { color:#fff; background:var(--t-acc); border-color:var(--t-acc); }
.trm-rozlicz-bar { position:fixed; left:50%; transform:translateX(-50%); bottom:18px; z-index:9000; background:#302720; color:#fff; border-radius:999px; padding:10px 16px; display:flex; gap:10px; align-items:center; box-shadow:0 10px 30px rgba(0,0,0,.25); font-size:13px; max-width:calc(100vw - 32px); }
.trm-rozlicz-bar button { border:none; border-radius:999px; padding:7px 12px; background:#8D2947; color:#fff; font-weight:600; }
.trm-rozlicz-bar button.sec { background:transparent; border:1px solid rgba(255,255,255,.4); }
.trm-segment { display:inline-flex; padding:3px; border:1px solid var(--t-line); border-radius:30px; background:var(--t-sur); }
.trm-segment button { background:none; border:0; border-radius:26px; min-height:34px; padding:7px 18px; color:var(--t-mut); font-size:13px; }
.trm-segment button.active { background:var(--t-acc); color:#fff; }
.trm-switch { position:relative; display:inline-block; width:42px; height:24px; flex-shrink:0; }
.trm-switch input { opacity:0; width:0; height:0; position:absolute; }
.trm-switch span { position:absolute; inset:0; background:#d9d2cb; border-radius:999px; transition:background .15s; cursor:pointer; }
.trm-switch span::before { content:''; position:absolute; width:18px; height:18px; left:3px; top:3px; background:#fff; border-radius:50%; transition:transform .15s; box-shadow:0 1px 2px rgba(0,0,0,.2); }
.trm-switch input:checked + span { background:var(--t-acc); }
.trm-switch input:checked + span::before { transform:translateX(18px); }
.trm-dzien-wiersz { display:flex; align-items:center; gap:14px; padding:10px 0; border-bottom:1px solid var(--t-line); }
.trm-dzien-wiersz:last-of-type { border-bottom:none; }
.trm-dzien-nazwa { width:100px; font-weight:600; font-size:13.5px; flex-shrink:0; }
.trm-dz-godz { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.trm-dz-godz input[type=time] { width:100px; min-height:38px; padding:5px 8px; }
.trm-zasob-karta { display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid var(--t-line); }
.trm-zasob-karta:last-child { border-bottom:none; }
.trm-zasob-ikona { width:40px; height:40px; border-radius:10px; background:var(--t-acc2); display:flex; align-items:center; justify-content:center; font-size:18px; flex-shrink:0; }
.trm-zasob-info { flex:1; min-width:0; }
.trm-usl-wiersz { display:flex; align-items:center; gap:10px; padding:10px; border-radius:var(--t-rs); cursor:pointer; border:1px solid transparent; }
.trm-usl-wiersz:hover { background:var(--t-bg); }
.trm-usl-wiersz.wybrana { background:var(--t-acc2); border-color:var(--t-acc); }
.trm-usl-kropka { width:12px; height:12px; border-radius:50%; flex-shrink:0; }
.trm-usl-strzalka { margin-left:auto; color:var(--t-mut); }

/* ── ustawienia ── */
.trm-tabs { display:flex; gap:4px; border-bottom:1px solid var(--t-line); margin-bottom:14px; flex-wrap:wrap; }
.trm-tabs button { border:none; background:none; padding:10px 12px; color:var(--t-mut); font-weight:500; border-bottom:3px solid transparent; margin-bottom:-1px; min-height:40px; }
.trm-tabs button.on, .trm-tabs button.aktywny { color:var(--t-acc); border-bottom-color:var(--t-acc); font-weight:700; }

/* ── centrum powiadomień (Sprawy) ── */
.trm-dzwonek { position:relative; font-size:16px; padding:9px 12px; }
.trm-dzwonek-licz { position:absolute; top:-6px; right:-6px; background:var(--t-warn-fg); color:#fff; border-radius:999px; min-width:18px; height:18px; font-size:10.5px; font-weight:700; display:flex; align-items:center; justify-content:center; padding:0 4px; }
.trm-dzwonek-licz.pilne { background:var(--t-bad-fg); }
.trm-tabs.sm button { padding:7px 10px; font-size:12px; }
.trm-sprawy-lista { display:flex; flex-direction:column; gap:8px; }
.trm-sprawa-karta { border:1px solid var(--t-line); border-left:3px solid var(--t-line); border-radius:var(--t-rs); padding:10px 12px; background:var(--t-sur); cursor:pointer; transition:border-color .15s; }
.trm-sprawa-karta:hover { border-color:var(--t-acc); }
.trm-sprawa-karta.bad { border-left-color:var(--t-bad-fg); }
.trm-sprawa-karta.warn { border-left-color:var(--t-warn-fg); }
.trm-sprawa-karta.neu { border-left-color:var(--t-line); }
.trm-sprawa-karta.nieprz { background:#fffaf5; }
.trm-sprawa-gora { display:flex; align-items:center; gap:6px; margin-bottom:5px; }
.trm-kropka { width:7px; height:7px; border-radius:50%; background:var(--t-acc); flex:0 0 auto; }
.trm-sprawa-tytul { font-weight:600; font-size:13.5px; }
.trm-sprawa-opis { margin-top:3px; line-height:1.4; }
.trm-sprawa-dol { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:9px; }
.trm-sprawa-prowadzi { display:flex; align-items:center; gap:7px; }
.trm-sprawa-naglowek { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.trm-dotknieta { display:flex; align-items:center; justify-content:space-between; gap:10px; border:1px solid var(--t-line); border-radius:var(--t-rs); padding:8px 10px; margin-top:6px; background:var(--t-bg); font-size:12.5px; }
.trm-dotknieta.ok { opacity:.6; }
.trm-przedpo { display:grid; grid-template-columns:1fr auto 1fr; gap:8px; align-items:center; text-align:center; background:var(--t-bg); border-radius:var(--t-rs); padding:10px; font-size:13px; }
.trm-dziennik-wpis { font-size:12.5px; color:var(--t-mut); border-left:2px solid var(--t-line); padding-left:10px; margin-bottom:7px; }
.trm-dziennik-wpis b { color:var(--t-ink); }

/* ── raport naprawczy 2026-10-15: komponenty kroku 3, akcji głównej, obsady, wyszukiwarki ── */
.trm-szukaj { position:relative; flex:1 1 180px; min-width:180px; max-width:280px; }
.trm-szukaj input { padding-left:34px; min-height:40px; }
.trm-szukaj::before { content:'⌕'; position:absolute; left:12px; top:50%; transform:translateY(-55%); color:var(--t-mut); font-size:18px; pointer-events:none; }
.trm-szukaj-wyniki { position:absolute; top:calc(100% + 4px); left:0; right:0; z-index:9300; background:var(--t-sur); border:1px solid var(--t-line); border-radius:var(--t-rs); box-shadow:var(--t-sh); max-height:320px; overflow:auto; }
.trm-szukaj-wyniki div { padding:9px 12px; border-bottom:1px solid var(--t-line); cursor:pointer; font-size:13px; }
.trm-szukaj-wyniki div:hover { background:var(--t-acc2); }
.trm-szukaj-wyniki .m { color:var(--t-mut); font-size:12px; }
.trm-filtry { display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin:-4px 0 10px; }
.trm-filtry .trm-chip { display:inline-flex; align-items:center; gap:6px; cursor:pointer; }
.trm-podsum { display:flex; align-items:center; justify-content:space-between; gap:10px; border:1px solid var(--t-line); border-radius:11px; padding:11px 13px; background:var(--t-bg); margin-bottom:8px; }
.trm-podsum .t { font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--t-mut); font-weight:600; }
.trm-podsum .v { font-weight:600; font-size:14px; }
.trm-podsum .m { color:var(--t-mut); font-size:12.5px; }
.trm-stopka { position:sticky; bottom:-18px; margin:14px -18px -18px; padding:12px 18px; background:var(--t-sur); border-top:1px solid var(--t-line); display:flex; gap:8px; align-items:center; }
.trm-stopka .trm-btn.primary { flex:1; }
.trm-card .trm-stopka { position:static; margin:14px -16px -16px; padding:12px 16px; border-radius:0 0 var(--t-r) var(--t-r); }
.trm-card .trm-stopka .trm-btn.primary { flex:0 0 auto; min-width:200px; }
.trm-dostep { display:flex; align-items:center; gap:8px; font-size:13px; padding:9px 12px; border-radius:var(--t-rs); border:1px solid transparent; margin:6px 0; }
.trm-dostep.czekam { background:var(--t-bg); color:var(--t-mut); }
.trm-dostep.ok { background:var(--t-ok-bg); color:var(--t-ok-fg); border-color:#bfdcc9; }
.trm-dostep.zajety { background:var(--t-bad-bg); color:var(--t-bad-fg); border-color:#eab8c3; }
.trm-dostep.blad { background:var(--t-warn-bg); color:var(--t-warn-fg); border-color:#ecd59a; }
.trm-akcja-glowna { margin-top:12px; }
.trm-akcja-glowna .trm-btn.primary { width:100%; min-height:48px; font-size:14px; }
.trm-wiecej { margin-top:8px; }
.trm-wiecej summary { cursor:pointer; color:var(--t-acc); font-size:13px; font-weight:600; list-style:none; padding:6px 0; }
.trm-wiecej summary::-webkit-details-marker { display:none; }
.trm-wiecej summary::before { content:'▸ '; }
.trm-wiecej[open] summary::before { content:'▾ '; }
.trm-wiecej .trm-row { margin-top:6px; }
.trm-status-glowny { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:10px; }
.trm-status-glowny .trm-pill { font-size:12.5px; padding:5px 12px; }
.trm-status-glowny .pomoc { color:var(--t-mut); font-size:12px; }
.trm-poz .n { font-size:14px; }
.trm-obsada { width:100%; border-collapse:collapse; font-size:12.5px; }
.trm-obsada th { text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--t-mut); padding:8px 6px; border-bottom:1px solid var(--t-line); }
.trm-obsada th.dzis { color:var(--t-acc); }
.trm-obsada td { padding:6px; border-bottom:1px solid var(--t-line); vertical-align:top; }
.trm-obsada td.os { font-weight:600; white-space:nowrap; }
.trm-obsada .kom { display:block; border-radius:8px; padding:6px 8px; background:var(--t-ok-bg); color:var(--t-ok-fg); cursor:pointer; min-height:34px; line-height:1.3; }
.trm-obsada .kom.wolne { background:var(--t-bg); color:var(--t-mut); }
.trm-obsada .kom.blok { background:var(--t-warn-bg); color:var(--t-warn-fg); }
.trm-obsada .kom:hover { outline:2px solid var(--t-acc); }
.trm-radio { display:flex; gap:14px; flex-wrap:wrap; margin:4px 0 8px; }
.trm-radio label { display:inline-flex; align-items:center; gap:6px; text-transform:none; letter-spacing:0; font-size:13px; font-weight:500; color:var(--t-ink); cursor:pointer; margin:0; }
.trm-radio input { width:auto; min-height:0; accent-color:var(--t-acc); }
.trm-pomoc { font-size:12px; color:var(--t-mut); margin-top:4px; }
details.trm-pomoc-wiecej summary { cursor:pointer; color:var(--t-acc); font-size:12.5px; }

/* ── telefon ── */
@media (max-width: 760px) {
  .trm { padding:10px; border-radius:12px; }
  .trm-top h1 { font-size:24px; }
  .trm-body.z-panelem { grid-template-columns:1fr; }
  .trm-panel { position:fixed; inset:0; z-index:9500; max-height:none; border-radius:0; overflow:auto; }
  .trm-grid2 { grid-template-columns:1fr; }
  .trm-ag-head { display:none; }
  .trm-ag-row { grid-template-columns:80px 1fr; }
  .trm-ag-row > :nth-child(3), .trm-ag-row > :nth-child(4), .trm-ag-row > :nth-child(5) { grid-column:1 / -1; }
}

/* A26: na wąskim ekranie każda kontrolka w panelu jest celem dotykowym (min 44 px), także małe przyciski i linki */
@media (max-width: 760px) {
  .trm-panel .trm-btn.sm, .trm-panel .trm-btn.link, .trm-panel .trm-sloty button { min-height:44px; padding-top:10px; padding-bottom:10px; }
}

/* A26 / 200 %: przy niskim oknie (np. zoom 200 % na laptopie) panel boczny zaczynałby się pod dolną krawędzią ekranu —
   wtedy, tak jak na telefonie, staje się nakładką z własnym przewijaniem i stopką „Umów wizytę” zawsze na dole */
@media (max-height: 640px) {
  .trm-body.z-panelem { grid-template-columns:1fr; }
  .trm-panel { position:fixed; inset:0; z-index:9500; max-height:none; border-radius:0; overflow:auto; }
}

/* D02: gdy sekcja terminarza jest aktywna, pływający widget pomocy i toasty hosta nie stoją w rogu, w którym leży stopka panelu
   (przesunięcie tylko na czas terminarza; poza nim host bez zmian). Sidebar hosta ma 260 px — stąd 284 px od lewej. */
/* E01: gdy panel terminarza jest otwarty, pływający widget pomocy znika (pomoc = przycisk „?” w nagłówku panelu, który go przywołuje);
   po zamknięciu panelu wraca na swoje miejsce. Toasty w czasie pracy w terminarzu lądują u góry na środku — osobny obszar, nie róg stopki. */
body.trm-panel-otwarty #est-help-widget { display:none !important; }
body.trm-panel-otwarty.trm-pomoc-otwarta #est-help-widget { display:block !important; }
body.trm-aktywny #boczki-toasts { top:16px !important; bottom:auto !important; right:auto !important; left:50% !important; transform:translateX(-50%); flex-direction:column; align-items:center; }
.trm-panel-head .trm-pomoc-btn { font-weight:700; }
/* D03: neutralna karta przed wyborem godziny */
.trm-wynik-termin.neutralna { background:var(--t-bg); border:1px dashed var(--t-line); }
.trm-wynik-termin.neutralna .godz { font-size:20px; }
/* D04: wiersz „o jakiej wizycie mowa” na karcie sprawy; karta reaguje na fokus z klawiatury */
.trm-sprawa-wizyta { margin:2px 0 4px; font-weight:600; }
.trm-sprawa-karta:focus-visible { outline:2px solid var(--t-acc); outline-offset:2px; }

/* E04: odświeżanie tego samego dnia bez pustej siatki — delikatne wyszarzenie i oznaczenie zmienianej karty */
.trm-main.trm-odswiezanie, #trm-main.trm-odswiezanie { opacity:.85; transition:opacity .15s; }
.trm-karta.zapis { opacity:.55; outline:2px dashed var(--t-acc); }
.trm-karta.zapis::after { content:"⏳ zapisujemy…"; position:absolute; right:6px; top:4px; font-size:10.5px; color:var(--t-acc); }

/* ── ZK-03: Pakiety i zakupy — skład ofert, przygotowanie, stan pakietów, istniejące wizyty, gotowość (style ograniczone do .trm) ── */
.trm .pz-seg { flex-wrap:wrap; }
.trm .pz-seg button { min-height:32px; padding:6px 12px; }
.trm .pz-tabela th { text-align:left; font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--t-mut); padding:6px 8px; border-bottom:1px solid var(--t-line); }
.trm .pz-tabela td { padding:8px; border-bottom:1px solid var(--t-line); vertical-align:top; }
.trm .pz-tabela tr.pz-edytowany td { background:var(--t-acc2); }
.trm .pz-tabela tr.pz-pominiete td { opacity:.7; }
.trm .pz-tabela tr.pz-zmienione td { background:var(--t-bad-bg); }
.trm .pz-tabela input[type=checkbox] { width:18px; height:18px; min-height:0; padding:0; }
.trm .pz-edytor { background:var(--t-bg); border:1px solid var(--t-line); border-radius:var(--t-rs); padding:10px 12px; }
.trm .pz-sklad-naglowek { margin:4px 0 6px; }
.trm .pz-sklad-wiersz { gap:6px; flex-wrap:wrap; margin-bottom:6px; align-items:center; }
.trm .pz-sklad-wiersz input[type=number] { min-height:36px; padding:6px 8px; }
.trm .pz-stan-wiersz { border-top:1px solid var(--t-line); padding:10px 0 6px; }
.trm .pz-stan-wiersz.zwer { opacity:.85; }
.trm .pz-stan-wiersz input[type=number] { min-height:38px; }
.trm .pz-kafle { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:8px; }
.trm .pz-kafel { background:var(--t-sur); border:1px solid var(--t-line); border-radius:var(--t-rs); padding:10px 12px; }
.trm .pz-kafel .v { font-size:22px; font-weight:600; line-height:1.1; }
.trm .pz-kafel .t { font-size:12px; color:var(--t-mut); margin-top:2px; }
.trm .pz-kafel.ok .v { color:var(--t-ok-fg); } .trm .pz-kafel.warn .v { color:var(--t-warn-fg); } .trm .pz-kafel.bad .v { color:var(--t-bad-fg); }
.trm .trm-note.ok { background:var(--t-ok-bg); color:var(--t-ok-fg); }
@media (max-width: 900px) { .trm .pz-grid { grid-template-columns:1fr; } }
@media (max-width: 640px) {
  .trm .pz-tabela, .trm .pz-tabela thead, .trm .pz-tabela tbody, .trm .pz-tabela tr, .trm .pz-tabela td { display:block; width:100%; }
  .trm .pz-tabela thead { display:none; }
  .trm .pz-tabela tr { border:1px solid var(--t-line); border-radius:var(--t-rs); margin-bottom:8px; background:var(--t-sur); }
  .trm .pz-tabela td { border:0; padding:6px 10px; }
  .trm .pz-tabela td:first-child { padding-top:10px; }
  .trm .pz-sklad-wiersz > * { flex:1 1 100% !important; min-width:0 !important; }
  .trm .pz-stan-wiersz .trm-row > div { flex:1 1 46%; }
  .trm .pz-stan-wiersz input[type=number] { width:100% !important; }
}

/* Z8 (18.10.2026): zabieg z pakietu po terminie ważności — wolno umówić, ale musi być widoczne. */
.trm-zakup-skl + .trm-note.po-terminie { margin: -2px 0 8px; padding: 6px 10px; line-height: 1.35; }
.trm-zakup.wygasly { opacity: 1; } /* wcześniej wygasły zakup był wyszarzany jako niedostępny */
.trm-zakup.wygasly .n::after { content: ' · po terminie'; color: var(--trm-warn, #a15c00); font-weight: 600; font-size: .85em; }

/* ─── HISTORIA (19.10.2026) ───────────────────────────────────────────────────────────────────
   Dwa widoki na tych samych danych: historia klientki i historia osoby z zespołu. Układ trzyma
   się konwencji modułu: karty na powierzchni --t-sur, odstępy przez --t-r, kolory statusów jak
   na kartach wizyt (zielony wykonane, bursztyn odwołane, czerwony nieobecności). */
.trm-historia { display:flex; flex-direction:column; gap:14px; }
.trm-hist-pasek { display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; }
.trm-hist-daty { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.trm-hist-daty label { margin:0; font-size:12px; color:var(--t-mut); }
.trm-hist-daty input[type=date] { width:auto; min-width:150px; }
.trm-hist-szybkie { display:inline-flex; gap:2px; }

.trm-hist-wyniki { display:flex; flex-direction:column; gap:6px; margin-top:8px; }

.trm-hist-kafelki { display:flex; flex-wrap:wrap; gap:10px; }
.trm-hist-kafel { flex:1 1 130px; background:var(--t-sur); border:1px solid var(--t-line); border-radius:var(--t-r); padding:14px 16px; }
.trm-hist-kafel .w { font-size:20px; font-weight:700; color:var(--t-txt); line-height:1.2; }
.trm-hist-kafel .e { font-size:11.5px; color:var(--t-mut); margin-top:4px; }

.trm-hist-listy { display:flex; flex-wrap:wrap; gap:14px; }
.trm-hist-listy > div { flex:1 1 260px; background:var(--t-sur); border:1px solid var(--t-line); border-radius:var(--t-r); padding:14px 16px; }
.trm-hist-listy .mini { font-size:11px; text-transform:uppercase; letter-spacing:.5px; color:var(--t-mut); margin-bottom:8px; }
.trm-hist-listy .poz { display:flex; justify-content:space-between; gap:10px; font-size:13.5px; padding:4px 0; border-bottom:1px solid var(--t-line); }
.trm-hist-listy .poz:last-child { border-bottom:0; }

.trm-hist-os { display:flex; flex-direction:column; gap:10px; }
.trm-hist-wizyta { background:var(--t-sur); border:1px solid var(--t-line); border-left:4px solid var(--t-line); border-radius:var(--t-r); padding:12px 14px; cursor:pointer; transition:.15s; }
.trm-hist-wizyta:hover { box-shadow:0 4px 14px rgba(26,14,26,.07); }
.trm-hist-wizyta.wykonana { border-left-color:#15803d; }
.trm-hist-wizyta.planowana { border-left-color:#9aa5b1; }
.trm-hist-wizyta.odwolana { border-left-color:#b45309; opacity:.82; }
.trm-hist-wizyta.nieobecna { border-left-color:#b91c1c; }
.trm-hist-wizyta .glowa { display:flex; justify-content:space-between; gap:10px; margin-bottom:8px; }
.trm-hist-wizyta .uwaga { font-size:12.5px; color:#8a5a00; margin-top:6px; }
.trm-hist-wizyta.nieobecna .uwaga { color:#9b1c1c; }
.trm-hist-wizyta .notatka { font-size:12.5px; color:var(--t-mut); margin-top:6px; font-style:italic; }

.trm-hist-poz { display:grid; grid-template-columns:1.6fr 1.1fr .9fr auto; gap:10px; align-items:center; font-size:13.5px; padding:4px 0; }
.trm-hist-poz .nazwa { font-weight:600; color:var(--t-txt); }
.trm-hist-poz .kto, .trm-hist-poz .stan { color:var(--t-mut); }
.trm-hist-poz .cena { text-align:right; color:var(--t-txt); white-space:nowrap; }
.trm-hist-poz.klik { grid-template-columns:auto 1.4fr 1.4fr .9fr auto; cursor:pointer; border-radius:8px; padding:6px 8px; }
.trm-hist-poz.klik:hover { background:var(--t-bg, #faf7f8); }
.trm-hist-poz .godz { font-variant-numeric:tabular-nums; color:var(--t-mut); }

.trm-hist-dni { display:flex; flex-direction:column; gap:12px; }
.trm-hist-dzien { background:var(--t-sur); border:1px solid var(--t-line); border-radius:var(--t-r); padding:12px 14px; }
.trm-hist-dzien .naglowek { font-weight:600; margin-bottom:6px; }

@media (max-width: 760px) {
  .trm-hist-poz, .trm-hist-poz.klik { grid-template-columns:1fr; gap:2px; padding:8px 0; border-bottom:1px solid var(--t-line); }
  .trm-hist-poz .cena { text-align:left; }
  .trm-hist-daty { width:100%; }
}

/* ─── ZMIANY W GRAFIKU (19.10.2026) ───────────────────────────────────────────────────────────
   Pasek pod licznikami dnia: ostrzeżenie, że z nadchodzących dni zniknęły wizyty. Celowo
   bursztynowy, nie czerwony — to nie awaria, tylko rzecz do sprawdzenia. */
.trm-zmiany-pasek { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:0 0 10px;
  padding:10px 14px; border:1px solid #f0d9ae; border-left:4px solid #d9a441; border-radius:var(--t-r); background:#fffaf0; font-size:13.5px; }
.trm-zmiany-pasek[hidden] { display:none; }   /* display:flex wygrywa z samym atrybutem hidden */
.trm-zmiany-pasek .ikona { color:#b45309; font-weight:700; }
.trm-zmiany-pasek .tresc { flex:1; color:#6b4f1d; }
.trm-zmiany-pasek b { color:#8a5a00; }

.trm-zmiany-lista { display:flex; flex-direction:column; gap:8px; }
.trm-zmiana { background:var(--t-sur); border:1px solid var(--t-line); border-left:4px solid var(--t-line); border-radius:var(--t-r); padding:10px 12px; cursor:pointer; transition:.15s; }
.trm-zmiana:hover { box-shadow:0 4px 14px rgba(26,14,26,.07); }
.trm-zmiana.bad { border-left-color:#b91c1c; }
.trm-zmiana.warn { border-left-color:#b45309; }
.trm-zmiana.ok { border-left-color:#15803d; }
.trm-zmiana .glowa { display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; }
.trm-zmiana .kto { font-size:13px; color:var(--t-txt); margin-top:2px; }
.trm-zmiana .opis { font-size:12.5px; color:var(--t-mut); margin-top:4px; }

/* ─── ZNAK NOTATKI PRZY WIZYCIE (19.10.2026) ──────────────────────────────────────────────────
   Recepcja nie ma klikać w kartę, żeby sprawdzić, czy jest notatka. Bursztynowy znaczek w rogu
   karty (siatka dnia, tygodnia, zasobów) i przy nazwisku w agendzie; w agendzie dodatkowo treść. */
.trm-notatka-znak { display:inline-flex; align-items:center; justify-content:center; width:17px; height:17px; flex:0 0 auto;
  border-radius:6px; background:#fdebcd; color:#9a5f00; border:1px solid #efd39d; vertical-align:-3px; }
.trm-notatka-znak svg { width:11px; height:11px; }
.trm-karta .trm-notatka-znak { position:absolute; top:3px; right:3px; z-index:3; box-shadow:0 1px 3px rgba(48,39,32,.14); }
.trm-karta .k, .trm-karta .l1 { padding-right:20px; }          /* miejsce na znaczek, żeby nie zasłaniał nazwiska */
.trm-ag-row .k .trm-notatka-znak { margin-left:6px; }
.trm-ag-notatka { margin-top:3px; font-size:12px; color:#8a5a00; background:#fffaf0; border-left:3px solid #e8c583;
  border-radius:4px; padding:2px 7px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }

/* ─── PREFERENCJE KLIENTKI (19.10.2026) ───────────────────────────────────────────────────────
   „Jednym rzutem oka”: chipsy przy nazwisku w agendzie i w szczegółach wizyty, mały znak na
   karcie w siatce. Spokojny, chłodny kolor — to nie alarm, tylko ułatwienie obsługi. */
.trm-pref { display:flex; flex-wrap:wrap; gap:5px; margin-top:5px; }
.trm-pref-chip { display:inline-flex; align-items:center; gap:4px; font-size:11.5px; line-height:1.5;
  padding:2px 8px; border-radius:999px; background:#eef4f3; color:#2f5b52; border:1px solid #d6e5e1; white-space:nowrap; max-width:220px; overflow:hidden; text-overflow:ellipsis; }
.trm-pref-chip .ik { font-size:12px; }
.trm-pref-chip.wiecej { background:var(--t-bg); color:var(--t-mut); border-style:dashed; }
.trm-pref-znak { position:absolute; top:3px; right:24px; z-index:3; display:inline-flex; align-items:center; justify-content:center;
  width:17px; height:17px; border-radius:6px; background:#eef4f3; border:1px solid #cfe1dc; font-size:10.5px; box-shadow:0 1px 3px rgba(48,39,32,.12); }
.trm-karta.krotka .trm-pref-znak, .trm-karta.mini .trm-pref-znak { display:none; }   /* na krótkiej karcie zostaje sama notatka */

.trm-pref-edytor { display:grid; grid-template-columns:repeat(auto-fit, minmax(230px, 1fr)); gap:8px; margin-top:8px; }
.trm-pref-pole { display:flex; flex-direction:column; gap:3px; font-size:12px; color:var(--t-mut); }
.trm-pref-pole select, .trm-pref-pole input { min-height:34px; }

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   TRYB CIEMNY — pełne pokrycie (19.10.2026)
   Zgłoszenie: „terminarz ma kulejący tryb dark, po zmianie niewiele tam widać”. Powód: sam
   moduł nadpisywał w ciemnym motywie tylko podstawowe zmienne, a kilkadziesiąt miejsc miało
   kolory wpisane na sztywno — jasne tła z jasnym tekstem (nieprzeczytana sprawa, podpowiedzi
   terminów, karty w kreatorze), niewidoczne obramowania i bordowy akcent na ciemnym tle.
   Zasada: najpierw zmienne, potem punktowe poprawki tych miejsc, które zmiennych nie używały.
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
body.dark-mode .trm {
  --t-acc:#e98aa4;                                  /* bordo nie istnieje na ciemnym tle — akcent jaśnieje */
  --t-gold:#caa468;
  --t-sh:0 16px 44px rgba(0,0,0,.55), 0 3px 12px rgba(0,0,0,.4);
}
/* Wypełnienia akcentem: na jaśniejszym różu biały tekst znika — piszemy ciemnym. */
body.dark-mode .trm .trm-views button.on,
body.dark-mode .trm .trm-btn.primary,
body.dark-mode .trm .trm-segment button.active,
body.dark-mode .trm .trm-krok-el.aktywny b,
body.dark-mode .trm .trm-sloty button.selected { color:#2b1017; }
body.dark-mode .trm .trm-btn.primary:hover { color:#2b1017; }
body.dark-mode .trm .trm-dzwonek-licz { color:#33240a; }   /* licznik na jasnym bursztynie */

/* Pola formularzy: moduł ma własną paletę, globalne style ciemne aplikacji dawały obcy granat. */
body.dark-mode .trm input, body.dark-mode .trm select, body.dark-mode .trm textarea {
  background:var(--t-bg); color:var(--t-ink); border-color:var(--t-line); }
body.dark-mode .trm input::placeholder, body.dark-mode .trm textarea::placeholder { color:var(--t-mut); }

/* Obramowania stanów (jasne pastele) i delikatne tła notatek. */
body.dark-mode .trm .trm-note.ok, body.dark-mode .trm .trm-dostep.ok, body.dark-mode .trm .trm-btn.ok { border-color:#2f6a51; }
body.dark-mode .trm .trm-note.warn, body.dark-mode .trm .trm-dostep.blad { border-color:#7a5f1c; }
body.dark-mode .trm .trm-note.bad, body.dark-mode .trm .trm-dostep.zajety, body.dark-mode .trm .trm-btn.danger { border-color:#7d3344; }
body.dark-mode .trm .trm-note.info { border-color:#2e5570; }
body.dark-mode .trm .trm-pill.pakiet { background:#24354d; color:#a8c8ef; }

/* Siatka dnia: karta wizyty (tło z koloru kategorii), bufory i blokady. */
body.dark-mode .trm .trm-karta { border-color:rgba(255,255,255,.16); }
body.dark-mode .trm .trm-karta.wyk { border-color:#2f6a51; }
body.dark-mode .trm .trm-karta:hover, body.dark-mode .trm .trm-karta:focus-visible { filter:brightness(1.18); box-shadow:0 4px 14px rgba(0,0,0,.45); }
body.dark-mode .trm .trm-karta.bufor { background:repeating-linear-gradient(135deg, #332b27 0 5px, #3d342f 5px 6px); }
body.dark-mode .trm .trm-col .blok { background:repeating-linear-gradient(135deg, var(--t-bg) 0 8px, #3a322c 8px 16px); }

/* Kreator wizyty: karty klientki i usługi, podpowiedzi terminów, slot „na brudno”. */
body.dark-mode .trm .trm-klient-karta:hover { background:var(--t-acc2); border-color:var(--t-acc); }
body.dark-mode .trm .trm-usl-karta:hover { background:var(--t-acc2); }
body.dark-mode .trm .trm-wynik-termin.ok { background:var(--t-ok-bg); border-color:#2f6a51; }
body.dark-mode .trm .trm-wynik-termin.zajety { background:var(--t-bad-bg); border-color:#7d3344; }
body.dark-mode .trm .trm-wynik-termin.blad { background:var(--t-warn-bg); border-color:#7a5f1c; }
body.dark-mode .trm .trm-sloty button { background:var(--t-bg); border-color:#7a4557; color:var(--t-ink); }
body.dark-mode .trm .trm-propozycja, body.dark-mode .trm .trm-draft-slot { background:#1d2f45e0; border-color:#5d8fd6; color:var(--t-ink); }
body.dark-mode .trm .trm-draft-slot.zle { background:#43202ae0; border-color:#b4546a; color:#ffc9d4; }
body.dark-mode .trm .trm-kroki::before { background:#4a403a; }
body.dark-mode .trm .trm-krok-el b { background:#3a322e; color:#cdc2bb; }
body.dark-mode .trm .trm-switch span { background:#564c46; }

/* Centrum powiadomień: nieprzeczytana sprawa miała jasne tło pod jasnym tekstem — najgorszy przypadek. */
body.dark-mode .trm .trm-sprawa-karta.nieprz { background:#332a22; }

/* Historia wizyt: kolory stanów i adnotacje. */
body.dark-mode .trm .trm-hist-wizyta.wykonana { border-left-color:#4ba877; }
body.dark-mode .trm .trm-hist-wizyta.odwolana { border-left-color:#d8903c; }
body.dark-mode .trm .trm-hist-wizyta.nieobecna { border-left-color:#e06464; }
body.dark-mode .trm .trm-hist-wizyta .uwaga { color:#e8c88a; }
body.dark-mode .trm .trm-hist-wizyta.nieobecna .uwaga { color:#f2a8a8; }

/* Pasek „co zniknęło”, znak notatki i treść notatki w agendzie — bursztyn na ciemno. */
body.dark-mode .trm .trm-zmiany-pasek { background:#392d15; border-color:#6b5423; border-left-color:#d9a441; }
body.dark-mode .trm .trm-zmiany-pasek .ikona { color:#ffc46b; }
body.dark-mode .trm .trm-zmiany-pasek .tresc { color:#ecdcc0; }
body.dark-mode .trm .trm-zmiany-pasek b { color:#ffd9a0; }
body.dark-mode .trm .trm-notatka-znak { background:#4a3a14; color:#ffd9a0; border-color:#6b5423; }
body.dark-mode .trm .trm-ag-notatka { background:#392d15; color:#f0dcb6; border-left-color:#8a6a22; }
body.dark-mode .trm .trm-zmiana.bad { border-left-color:#e06464; }
body.dark-mode .trm .trm-zmiana.warn { border-left-color:#d8903c; }
body.dark-mode .trm .trm-zmiana.ok { border-left-color:#4ba877; }

/* Preferencje klientki — zielony chłód zamiast jasnej mięty. */
body.dark-mode .trm .trm-pref-chip { background:#22332f; color:#a9ceC3; border-color:#36514a; }
body.dark-mode .trm .trm-pref-chip.wiecej { background:var(--t-bg); color:var(--t-mut); }
body.dark-mode .trm .trm-pref-znak { background:#22332f; border-color:#36514a; }
/* Karta wizyty: nazwa usługi szła kolorem „wyciszonym" na barwnym tle kategorii — w ciemnym
   motywie dawało to kontrast 2.7:1, czyli tekst na granicy czytelności. Podnosimy jasność. */
body.dark-mode .trm .trm-karta .u { color:#d2c5bd; }
body.dark-mode .trm .trm-karta .zn span { background:rgba(255,255,255,.14); color:#f0e7e1; }
body.dark-mode .trm .trm-karta.anul { background:#2b2522; }
/* Poprawka po przeklikaniu (19.10.2026): w ciemnym motywie świeciły jeszcze trzy rzeczy
   zbudowane z jasnych pasteli — licznik przy dzwonku i awatary osób. Na jasnym tle są
   delikatne, na ciemnym stają się najjaśniejszym punktem ekranu. Ściemniamy tła,
   rozjaśniamy litery — ten sam kod kolorystyczny, tylko odwrócony. */
body.dark-mode .trm .trm-dzwonek-licz { background:#7d5718; color:#ffe6bd; }
body.dark-mode .trm .trm-dzwonek-licz.pilne { background:#9c3341; color:#ffd7dd; }
body.dark-mode .trm .trm-awatar { background:#4a2a35; color:#f0a9c0; }
body.dark-mode .trm .trm-awatar.mint { background:#23402f; color:#8ed4b7; }
body.dark-mode .trm .trm-awatar.gold { background:#453515; color:#e6c57c; }
body.dark-mode .trm .trm-awatar.blue { background:#233648; color:#9cc6e8; }

/* Notatka w chmurce podglądu wizyty (19.10.2026) — prośba: „jak jest notatka, pokaż ją też
   w dymku", żeby recepcja nie musiała otwierać szczegółów tylko po to, by ją przeczytać. */
.trm-bubble-notatka { display:flex; align-items:flex-start; gap:7px; margin-top:9px; padding:8px 10px;
  background:#fffaf0; border:1px solid #f0d9ae; border-left:3px solid #d9a441; border-radius:var(--t-rs);
  font-size:12.5px; line-height:1.45; color:#6b4f1d; }
.trm-bubble-notatka svg { width:13px; height:13px; flex:0 0 auto; margin-top:1px; color:#b45309; }
body.dark-mode .trm .trm-bubble-notatka { background:#392d15; border-color:#6b5423; border-left-color:#d9a441; color:#f0dcb6; }
body.dark-mode .trm .trm-bubble-notatka svg { color:#ffc46b; }

/* Ostrzeżenie pod polem „Wykonawca dla wszystkich zabiegów" (zgłoszenie #10, 21.10.2026):
   wybrana osoba nie wykonuje części zabiegów, więc dobierzemy kogoś innego — mówimy to wprost,
   zamiast po cichu podmieniać wykonawcę. */
.trm-pref-uwaga { margin-top:6px; padding:8px 10px; border-radius:var(--t-rs); font-size:12.5px; line-height:1.5;
  background:#fff8ed; border:1px solid #f0d9ae; border-left:3px solid #d9a441; color:#6b4f1d; }
.trm-pref-uwaga b { color:#5a3f12; }
.trm-pref-uwaga .trm-btn.link { color:#9a6b12; }
body.dark-mode .trm .trm-pref-uwaga { background:#392d15; border-color:#6b5423; border-left-color:#d9a441; color:#f0dcb6; }
body.dark-mode .trm .trm-pref-uwaga b { color:#ffe2ad; }
body.dark-mode .trm .trm-pref-uwaga .trm-btn.link { color:#ffc46b; }

/* Legenda kolorów zabiegów pod siatką dnia (zgłoszenie #12, 21.10.2026). Kolor kafelka ma
   znaczyć konkretny zabieg, więc pokazujemy wprost, który odcień to która kategoria. */
.trm-legenda-kat { display:flex; gap:6px 12px; flex-wrap:wrap; align-items:center; margin-top:6px; font-size:12px; color:var(--t-mut); }
.trm-legenda-kat .e { font-weight:600; color:var(--t-txt); }
.trm-legenda-kat .poz { display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
.trm-legenda-kat .poz i { width:10px; height:10px; border-radius:3px; display:inline-block; flex:0 0 auto; box-shadow:0 0 0 1px rgba(48,39,32,.12) inset; }
body.dark-mode .trm .trm-legenda-kat .poz i { box-shadow:0 0 0 1px rgba(255,255,255,.18) inset; }

/* „1. wizyta" — oznaczenie pierwszego razu na dany zabieg (zgłoszenie #12b, 21.10.2026).
   Liczone na żywo z wizyt wykonanych i sprzedaży, więc po nieobecności wraca na kolejny termin. */
.trm-pierwsza { display:inline-block; margin-left:4px; padding:0 5px; border-radius:4px; font-size:10px; font-weight:700;
  letter-spacing:.2px; background:#e8f3ec; color:#1f6b45; border:1px solid #bfe0cd; vertical-align:1px; }
body.dark-mode .trm .trm-pierwsza { background:#1e3b2c; color:#8ed4b7; border-color:#2f5c45; }
.trm-hist-zab { margin-top:6px; font-size:12px; color:var(--t-mut); }
.trm-hist-zab.pierwsza { color:#1f6b45; font-weight:600; }
body.dark-mode .trm .trm-hist-zab.pierwsza { color:#8ed4b7; }

/* Kafelek-szkic nowej wizyty (zgłoszenie #11, 21.10.2026): widać go od razu po dodaniu zabiegu,
   zanim padnie decyzja o godzinie, i da się go przeciągnąć — w pionie godzina, w poziomie osoba.
   Przerywana ramka mówi: to jeszcze nie jest zapisana wizyta. */
.trm-szkic { position:absolute; left:5px; right:5px; width:calc(100% - 10px); z-index:4; cursor:grab; user-select:none;
  border:2px dashed var(--t-rose, #b87080); border-radius:7px; background:rgba(184,112,128,.12); color:var(--t-txt);
  padding:4px 8px; font-size:11.5px; line-height:1.3; overflow:hidden; box-shadow:0 2px 10px rgba(28,26,24,.10); }
.trm-szkic.ustalony { background:rgba(184,112,128,.18); border-style:solid; }
.trm-szkic.ciagniety { cursor:grabbing; opacity:.92; box-shadow:0 6px 18px rgba(28,26,24,.22); }
.trm-szkic b { display:block; font-size:12px; }
.trm-szkic span { display:block; opacity:.85; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.trm-szkic em { display:block; font-style:normal; font-size:10.5px; opacity:.7; margin-top:2px; }
body.dark-mode .trm .trm-szkic { background:rgba(240,169,192,.14); border-color:#f0a9c0; color:#f3e9ec; }
body.dark-mode .trm .trm-szkic.ustalony { background:rgba(240,169,192,.22); }
.trm-propozycja.ciagalna { cursor:grab; }
.trm-propozycja.ciagalna.ciagniety { cursor:grabbing; opacity:.92; }

/* ─── iPhone / wąski ekran (21.10.2026) ───────────────────────────────────────────────────────
   Audyt na emulowanym iPhonie 14 (390×844) i SE (375×667) wykazał trzy rzeczy do poprawy.
   Cała strona się nie rozjeżdżała (dokument = szerokość ekranu), ale: zakładka „Historia"
   była ucięta prawą krawędzią, karty wizyt wystawały o ~56 px, a część przycisków miała
   24 px wysokości zamiast wymaganych palcem ~44. */
@media (max-width: 760px) {
  /* 1. Pasek widoków: pięć zakładek nie mieści się w jednym rzędzie — zawijamy zamiast chować
     „Historię" poza ekranem. Zawijanie jest uczciwsze od przewijania w poziomie: widać wszystko. */
  .trm-views { flex-wrap:wrap; border-radius:18px; row-gap:4px; justify-content:flex-start; }
  .trm-views button { flex:1 1 auto; min-height:38px; font-size:13.5px; }

  /* 2. Karty wizyt (widok dnia i agenda): dzieci siatki mają domyślnie min-width:auto, więc
     długa notatka albo rząd chipsów rozpychał wiersz poza ekran. Zero minimalnej szerokości
     + zawijanie treści trzyma je w ryzach. */
  .trm-ag-row > * { min-width:0; }
  .trm-ag-row .k, .trm-ag-row .u { overflow-wrap:anywhere; }
  .trm-ag-notatka { overflow-wrap:anywhere; white-space:normal; }
  .trm-ag-prac { flex-wrap:wrap; }
  .trm-pref { flex-wrap:wrap; }

  /* 3. Cele dotyku poza panelem (w panelu było to zrobione już wcześniej): linki-przyciski
     w rodzaju „Co się zmieniło?", „30 dni", „+ Dodaj przerwę" miały 24 px wysokości. */
  .trm .trm-btn.sm, .trm .trm-btn.link { min-height:38px; min-width:44px; padding-top:8px; padding-bottom:8px; }
  .trm input[type=checkbox] { width:20px; height:20px; }
  .trm-filtry label, .trm-counters label { display:inline-flex; align-items:center; gap:8px; min-height:38px; }
}

/* Ustawienia → Godziny otwarcia: wiersz dnia (nazwa + przełącznik + dwa pola czasu + „Dodaj przerwę")
   miał na telefonie 380 px minimalnej szerokości i rozpychał kartę poza ekran o 12 px.
   Na wąskim ekranie pozwalamy mu się zawinąć — pola czasu lądują w drugiej linii. */
@media (max-width: 760px) {
  .trm-card { min-width:0; }
  .trm-dzien-wiersz { flex-wrap:wrap; gap:8px 10px; }
  .trm-dz-godz { flex-wrap:wrap; row-gap:6px; }
  .trm-hist-daty input[type=date] { flex:1 1 140px; min-width:0; }
}

/* Pływający przycisk pomocy (Esti) siedzi na telefonie w prawym dolnym rogu i zasłaniał ostatnią
   kartę listy. Zapas na dole modułu sprawia, że da się doczytać ostatnią wizytę dnia. */
@media (max-width: 760px) { .trm { padding-bottom:72px; } }

/* Chipsy preferencji na telefonie: długa uwaga („Zawsze przychodzi 15 minut wcześniej") nie mieści
   się w jednej linii i była ucięta krawędzią karty — pozwalamy jej się zawinąć. */
@media (max-width: 760px) {
  .trm-pref-chip { max-width:100%; white-space:normal; text-align:left; }
}