*{box-sizing:border-box} body{margin:0;font-family:Segoe UI,Arial,sans-serif;background:#f3f6fb;color:#172033}

/* Layout */
.app{display:flex;min-height:100vh}
/* CS-N106: `min-width:0` — fără el, un flex item (`.content`) nu se micșorează sub lățimea
   conținutului lui, deci `.table-wrapper{overflow-x:auto}` nu apuca niciodată să intre în joc pe
   ecrane mai înguste: tabelul își trăgea PĂRINTELE mai lat decât fereastra și scrolla toată
   PAGINA (inclusiv sidebar-ul), nu doar tabelul. Cu `min-width:0`, `.content` se supune lățimii
   disponibile, iar `.table-wrapper` capătă propriul scroll orizontal, izolat — același principiu
   ca `nav{min-height:0}` de mai jos, pe axa cealaltă. */
.content{flex:1;padding:32px;min-width:0} header h1{margin:0;font-size:32px} header p{color:#64748b}

/* Sidebar */
.sidebar{width:255px;background:#0d1b2f;color:white;padding:20px 16px;display:flex;flex-direction:column}
.brand{display:flex;align-items:center;gap:12px;margin-bottom:24px;padding:0 8px}
.brand-icon{font-size:28px}
.brand-text{font-size:18px;font-weight:800;line-height:1.2}
.brand-text small{display:block;font-size:11px;font-weight:400;color:#94a3b8;margin-top:2px}
/* L1-02: nav-ul poate depăși înălțimea ecranului cu 6 titluri de grup → derulează el, ca
   `.sidebar-bottom` (limbă/logout) să rămână mereu vizibil. `min-height:0` e obligatoriu:
   fără el, un flex item nu se micșorează sub conținut și overflow-ul nu se activează. */
nav{flex:1;min-height:0;overflow-y:auto}
nav a{display:flex;align-items:center;gap:10px;color:#cbd5e1;text-decoration:none;padding:10px 14px;border-radius:12px;margin:2px 0;font-size:14px;transition:all .15s}
nav a svg{width:20px;height:20px;flex-shrink:0;stroke-width:1.8}
nav a.active,nav a:hover{background:#1d4ed8;color:white}
/* L1-02 — grupuri de meniu colapsabile */
.nav-group{margin-bottom:6px}
.nav-group-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:0;cursor:pointer;color:#7f97b8;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:8px 14px 4px;font-family:inherit}
.nav-group-toggle:hover{color:#cbd5e1}
.nav-group-chevron{width:14px;height:14px;flex-shrink:0;transition:transform .15s}
.nav-group.collapsed .nav-group-chevron{transform:rotate(-90deg)}
.nav-group.collapsed .nav-group-items{display:none}
.sidebar-bottom{margin-top:auto;padding-top:16px;border-top:1px solid #1e3a5f}
.lang-switch{display:flex;gap:6px;margin-bottom:12px;padding:0 4px}
.lang-switch a{color:#cbd5e1;text-decoration:none;padding:6px 14px;border-radius:10px;font-weight:700;font-size:13px;border:1px solid #334155}
.lang-switch a.active{background:#1d4ed8;color:white;border-color:#1d4ed8}
.user-info{display:flex;align-items:center;gap:10px;padding:10px 8px;margin-bottom:4px}
.user-avatar{width:36px;height:36px;background:#334155;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px}
.user-details strong{display:block;font-size:14px;color:white}
.user-details small{font-size:11px;color:#94a3b8}
.logout{display:flex;align-items:center;gap:10px;color:#cbd5e1;text-decoration:none;padding:10px 14px;border-radius:12px;font-size:14px;transition:all .15s}
.logout svg{width:20px;height:20px;flex-shrink:0}
.logout:hover{background:#dc2626;color:white}

/* Cards */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:24px 0}
.card{background:white;border-radius:22px;padding:24px;box-shadow:0 10px 30px #dbe4f0}
.card span{color:#64748b}.card strong{display:block;font-size:30px;margin-top:8px}

/* Grid & Panels */
.grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.panel{background:white;border-radius:22px;padding:22px;box-shadow:0 10px 30px #dbe4f0;margin-bottom:20px}

/* Tables */
.table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;min-width:600px} th,td{text-align:left;padding:12px;border-bottom:1px solid #e5e7eb} th{color:#64748b;font-size:13px}
/* CS-N128 — antetul listei e acum `<thead>` real (era primul `<tr>` din `<tbody>`), deci POATE fi
   lipicios: la derulare pe `/cheltuieli` (7 coloane) sau `/facturi_emise` (12) nu se mai pierde
   care coloană e „Valoare".
   `background` explicit: fără el, rândurile derulate s-ar vedea PRIN antet (elementul lipicios nu
   moștenește fundalul panoului). `box-shadow:inset`, nu `border-bottom`: cu `border-collapse:
   collapse` marginea unei celule lipicioase nu se pictează peste conținutul care trece pe sub ea. */
thead th{position:sticky;top:0;z-index:2;background:#fff;box-shadow:inset 0 -1px 0 #e5e7eb}
/* `position:sticky` se raportează la cel mai apropiat container cu derulare. `.table-wrapper` e
   deja unul (`overflow-x:auto` ⇒ `overflow-y` calculat `auto`), dar fără înălțime limitată nu
   derulează NICIODATĂ pe verticală — deci antetul n-ar sta lipit nici o clipă, oricâtă pagină ar
   derula operatorul. `.table-scroll` e ce transformă regula de mai sus din decor în efect: se pune
   DOAR pe containerul listei principale a unui ecran, nu pe orice tabel din aplicație. */
.table-scroll{max-height:60vh;overflow-y:auto}
.badge{background:#e0ecff;color:#1d4ed8;padding:6px 10px;border-radius:999px;font-weight:700;font-size:12px}

/* CS-N105 — ierarhia acțiunilor din lista de rezervări (poarta ACK 10.09.2026).
   `.link-btn` era folosit fără regulă proprie și moștenea `button{background:#1d4ed8}` — patru
   acțiuni de rând arătau IDENTIC (rutină și „mișcă bani" la fel), deși doar una din ele
   declanșează factura de avans. Stilul de mai jos e cauza reparată, nu simptomul: clasa capătă o
   identitate proprie (buton neutru, folosit în meniul grupat și pe ecranul rezervării), nu doar
   culori schimbate punctual pe fiecare buton. */
.link-btn{background:none;color:#172033;border:0;border-radius:8px;padding:9px 14px;font-weight:600;font-size:13px;text-align:left;width:100%;cursor:pointer;text-decoration:none;display:block;white-space:nowrap}
.link-btn:hover{background:#f1f5f9}
.link-btn:focus-visible{outline:2px solid #1d4ed8;outline-offset:-2px}
.menu-item-danger{color:#b91c1c;font-weight:700}
.menu-item-danger:hover{background:#fef2f2}
.inline-form{display:inline-block;width:100%}
/* Acțiunile frecvente, la vedere pe rând (Edit, Contract PDF) — neutre, deliberat NU albastru
   plin: un singur accent pe rând, mai jos. */
.btn-row-neutral{background:#f1f5f9;color:#334155;border:1px solid #cbd5e1;border-radius:8px;padding:6px 12px;font-weight:600;font-size:13px;text-decoration:none;cursor:pointer;display:inline-flex;align-items:center;line-height:1.3}
.btn-row-neutral:hover{background:#e2e8f0}
.btn-row-neutral:focus-visible{outline:2px solid #1d4ed8;outline-offset:1px}
/* SINGURUL accent al rândului: mută rezervarea la pasul următor din ciclul ei de viață (predare/
   primire vehicul). Culorile sunt cele deja folosite azi pe acest link — nicio paletă nouă. */
.btn-row-accent{border-radius:8px;padding:6px 12px;font-weight:700;font-size:13px;text-decoration:none;display:inline-flex;align-items:center;color:white}
.btn-row-accent-checkout{background:#059669}
.btn-row-accent-checkout:hover{background:#047857}
.btn-row-accent-checkin{background:#7c3aed}
.btn-row-accent-checkin:hover{background:#6d28d9}
/* CS-N106: rândul avea 133px. CAUZA reală nu era doar `flex-wrap:wrap` — era `.inline-form`
   (regula generică de mai sus, `width:100%`) care, ÎN interiorul `.row-actions`, cerea formularului
   „Contract PDF" toată lățimea containerului flex, împingând restul acțiunilor pe rândul următor.
   `CS-N105` reparase asta DOAR pentru `.resv-actions-row .inline-form` (ecranul dedicat); rândul
   din listă a rămas cu regula generică. Fix-ul de-aici e ACELAȘI pattern, la locul care lipsea.
   `nowrap` + `flex-shrink:0`: rămân, ca plasă — acțiunile stau pe UN rând sau ies din cadru (scroll
   orizontal pe `.table-wrapper`, deja existent), NICIODATĂ micșorate (zonele de clic nu se
   negociază). Lățimea recuperată vine, în plus, din `.col-date`/`.col-pachet` de mai jos — coloane
   care nu se mai rup și nu mai cer/primesc mai mult spațiu decât au nevoie. */
.row-actions{display:flex;flex-wrap:nowrap;align-items:center;gap:6px}
.row-actions>*{flex-shrink:0}
.row-actions .inline-form{width:auto}
/* Layout-ul automat de tabel, cu conținut flex `nowrap` ÎNĂUNTRUL unei celule, nu propagă mereu
   corect min-content-ul copiilor spre coloană (măsurat: la 1366px coloana primea 254px, sub cei
   326px reali ai celui mai lat set de acțiuni — Edit + Contract PDF + Predare/Primire vehicul +
   „⋮", cu cele trei spații de 6px dintre ele). `min-width` explicit pe celulă e varianta care
   chiar ține layout-ul de tabel la produsul corect, indiferent de euristica browserului. */
.col-actions{min-width:350px}
.kebab-btn{background:#f1f5f9;color:#334155;border:1px solid #cbd5e1;border-radius:8px;width:34px;height:34px;font-weight:700;font-size:16px;cursor:pointer;line-height:1}
.kebab-btn:hover{background:#e2e8f0}
.kebab-btn:focus-visible{outline:2px solid #1d4ed8;outline-offset:1px}
.actions-menu-wrap{position:relative;display:inline-block}
/* `position:fixed`, nu `absolute` — vezi comentariul JS din reservations.html (tăierea de către
   `.table-wrapper{overflow-x:auto}`). */
.actions-menu{display:none;position:fixed;min-width:220px;background:white;border-radius:12px;box-shadow:0 12px 30px rgba(15,23,42,.18);border:1px solid #e2e8f0;padding:6px;z-index:1100}
.actions-menu.open{display:block}
.menu-divider{border-top:1px solid #e5e7eb;margin:6px 2px}
/* Stări needitabile lângă coloana pe care o descriu (`Nr. contract`, `Total`) — informație, nu
   acțiune, deci NU intră în meniul de mai sus (poarta ACK, pct. 2). */
.badge-inline-note{margin-top:4px;font-size:12px;font-weight:600;color:#15803d;white-space:nowrap}
.badge-warn{margin-top:4px;background:#fef3c7;color:#92400e;border-radius:6px;padding:2px 8px;font-size:12px;font-weight:600;display:inline-block}
.col-suma{text-align:right;white-space:nowrap}
.suma{font-variant-numeric:tabular-nums}
/* CS-N106 — sursa lățimii recuperate pentru `.row-actions`: datele NU se mai rup pe două rânduri
   („2026-09-" / „09") și `Pachet` (deseori „—" în date reale, niciodată mai lat decât numele unui
   pachet) nu mai primește din spațiul liber pe care layout-ul automat de tabel i-l dădea în plus,
   în dauna coloanei de acțiuni. Niciuna din cele două nu se ascunde — doar nu mai cer/primesc mai
   mult spațiu decât au nevoie (CS-N106 00-REQUEST.md, „de unde vine lățimea"). */
.col-date{white-space:nowrap}
.col-pachet{white-space:nowrap}
/* CS-N116 — vehiculul se scrie acum «Nume (Număr)», deci celula e cu ~11 caractere mai lată. Fără
   `nowrap` se rupea pe două linii și rândul creștea de la 61px la 97px — adică fix regresia de
   densitate pe care CS-N106 o măsoară (pragul de 80px din
   `e2e/test_cs_n106_densitate_lista.py`). Aceeași soluție ca la `.col-date`: coloana nu se rupe;
   lățimea în plus o absoarbe `.table-wrapper{overflow-x:auto}`, care există deja. */
.col-vehicul{white-space:nowrap}

/* Secțiunea de acțiuni a ecranului rezervării — ACELEAȘI macro-uri ca rândul din listă, randate
   ca butoane la vedere (spațiu suficient aici, spre deosebire de rând). */
.resv-actions-panel .resv-actions-heading{margin:0 0 10px;font-size:14px;color:#475569;text-transform:uppercase;letter-spacing:.04em}
.resv-actions-panel .resv-actions-heading:not(:first-child){margin-top:18px;padding-top:14px;border-top:1px dashed #cbd5e1}
.resv-actions-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.resv-actions-row .inline-form{width:auto}
.resv-actions-row .link-btn{width:auto;background:#f1f5f9;color:#334155;border:1px solid #cbd5e1}
.resv-actions-row .link-btn:hover{background:#e2e8f0}
.resv-actions-danger{margin-top:18px;padding-top:14px;border-top:1px dashed #cbd5e1}
.resv-actions-danger .link-btn{width:auto;color:#b91c1c;border:1px solid #fecaca}
.resv-actions-danger .link-btn:hover{background:#fef2f2}

/* Stare goală (CS-N105 AC) — text + acțiunea următoare, nu un tabel fără rânduri. */
.empty-state{padding:36px 16px;text-align:center;color:#64748b}
.empty-state strong{display:block;font-size:16px;color:#172033;margin-bottom:6px}

/* Forms */
.form-panel form{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
/* CS-N114 — containerul de alocare pe vehicule (`/cheltuieli`) păstrează ACEEAȘI lățime în toate
   cele trei moduri («un vehicul» / «selecție multiplă» / «toate»). Clientul pe UAT: „chenarul se
   modifică atunci când selectăm toate vehiculele, se expandează puțin în partea dreaptă".
   Două lucruri, amândouă necesare:
     - în șablon, ambele select-uri stau acum în ACEEAȘI celulă de grilă: `display:none` pe unul nu
       mai scoate un element din grilă, deci restul câmpurilor nu se mai mută cu o celulă;
     - `min-width:0` anulează minimul INTRINSEC al celulei (`1fr` = `minmax(auto,1fr)`, iar `auto`
       înseamnă min-content): fără el, un `<select multiple>` cu nume lungi de vehicule împinge
       coloana peste 1/3 din formular exact cât e vizibil, și numai atunci.
   Niciun control nu se micșorează: select-urile ocupă toată lățimea celulei (`width:100%`), care
   rămâne cea dinainte. */
.alocare-vehicule{min-width:0}
.alocare-vehicule>select{width:100%;min-width:0}
/* CS-N117 — lista MULTIPLĂ de linii de factură (`/cheltuieli`, la CREARE). `min-width:0` din
   aceleași motive ca la containerul de mai sus: celula de grilă e `1fr` = `minmax(auto,1fr)`, iar
   `auto` înseamnă min-content — o etichetă lungă de linie (furnizor + nr. factură + denumire) ar
   împinge singură coloana peste o treime din formular. `max-height` ține lista la șase rânduri
   vizibile și derulabilă: liniile disponibile pot fi sute (`LIMITA_LINII_DISPONIBILE`), iar un
   listbox care crește cu ele ar împinge butonul de salvare sub ecran. */
#cheltuiala-linie-select[multiple]{width:100%;min-width:0;max-height:180px}
/* Rezumatul lotului: „N linii alese · total X". Stă în propria celulă de grilă, aliniat pe centru
   față de câmpurile vecine, ca să se citească fără să mute nimic. */
.lot-rezumat{margin:0;min-width:0;align-self:center;font-size:13px;font-weight:600;color:#1d4ed8}
input,select{padding:12px;border:1px solid #d6deeb;border-radius:12px;background:white;font-family:inherit;font-size:inherit}
select{cursor:pointer;appearance:auto}
button{background:#1d4ed8;color:white;border:0;border-radius:12px;padding:12px;font-weight:700;cursor:pointer}

/* CS-N128 — zona pliabilă a formularului, randată SUB listă. */
.form-collapse{margin-bottom:20px}
.form-collapse-body[hidden]{display:none}
/* SINGURUL buton accentuat al ecranului (cerința §3). Restul butoanelor de pe un ecran de listă
   (căutare, filtre, acțiuni de rând) sunt neutre — mai jos și în blocul CS-N105 de mai sus: 15
   butoane saturate pe 15 rânduri înseamnă că niciunul nu e principal. Accentul e cel deja folosit
   în aplicație (#1d4ed8), nu o culoare nouă. */
.btn-principal{display:inline-flex;align-items:center;gap:10px;padding:13px 22px;font-size:15px;box-shadow:0 6px 16px rgba(29,78,216,.25)}
.btn-principal:hover{background:#1e40af}
.btn-principal:focus-visible{outline:2px solid #172033;outline-offset:2px}
/* Semnul de pliere e desenat din CSS, nu scris în șablon: „+" când e pliat, „−" când e desfăcut.
   Așa eticheta rămâne curat traductibilă, iar starea nu depinde de un caracter dintr-un text. */
.form-collapse-icon{font-size:18px;line-height:1;font-weight:700}
.form-collapse-icon::before{content:"+"}
.form-collapse.open .form-collapse-icon::before{content:"\2212"}
/* Butoanele SECUNDARE ale unui ecran de listă (căutare, filtre pe interval, bară de status).
   Moșteneau `button{background:#1d4ed8}`, deci concurau cromatic cu acțiunea principală. Aceeași
   identitate neutră ca `.btn-row-neutral` (CS-N105) — nu o paletă nouă. */
.search-form button,.status-toolbar button,.rinv-filtru button{background:#f1f5f9;color:#334155;border:1px solid #cbd5e1;font-weight:600}
.search-form button:hover,.status-toolbar button:hover,.rinv-filtru button:hover{background:#e2e8f0}
.search-input{width:100%;padding:12px 16px;border:1px solid #d6deeb;border-radius:12px;margin-bottom:16px;font-size:14px;background:#f8fafc}
.search-input:focus{outline:none;border-color:#1d4ed8;box-shadow:0 0 0 3px rgba(29,78,216,0.1)}
/* CS-N125: căutarea listelor e un <form method="get"> (server-side), deci are buton și o
   ieșire explicită din filtru. Câmpul nu mai are marginea de jos proprie — o dă formularul. */
.search-form{display:flex;gap:8px;align-items:center;margin-bottom:16px}
.search-form .search-input{margin-bottom:0}
.search-form .search-clear{font-size:13px;color:#475569;white-space:nowrap}
.search-empty{margin:0 0 16px;padding:12px 16px;border:1px dashed #d6deeb;border-radius:12px;color:#475569;font-size:14px;background:#f8fafc}

/* CS-N130: butonul de export .xlsx, lângă caseta de căutare (fragmentul `_export.html`), plus
   coloana de bifare injectată în tabel. Coloana e îngustă și nu se lățește: e un control, nu o
   dată — spațiul rămâne la coloanele pe care operatorul chiar le citește. */
.export-bara{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 16px}
.export-btn{display:inline-block;padding:9px 14px;border:1px solid #cbd5e1;border-radius:10px;background:#f1f5f9;color:#334155;font-weight:600;font-size:14px;text-decoration:none;white-space:nowrap}
.export-btn:hover{background:#e2e8f0}
.export-hint{font-size:13px;color:#475569}
th.export-col,td.export-col{width:32px;padding-left:10px;padding-right:0;text-align:center}

/* Auth */
.auth-card{max-width:430px;margin:12vh auto;background:white;padding:34px;border-radius:24px;box-shadow:0 20px 50px #cbd5e1}
.auth-card form{display:grid;gap:12px}
.error{background:#fee2e2;color:#991b1b;padding:10px;border-radius:12px;margin:12px 0}

/* Flash messages */
.flash{padding:14px 20px;border-radius:12px;margin-bottom:20px;font-weight:600;font-size:14px;display:flex;justify-content:space-between;align-items:center;transition:opacity .4s}
.flash-success{background:#d1fae5;color:#065f46;border:1px solid #6ee7b7}
.flash-error{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5}
/* CS-N47/AC3: simularea SmartBill — aceeași greutate vizuală ca succesul (.flash comun), culoare distinctă */
.flash-warning{background:#fef3c7;color:#92400e;border:1px solid #fcd34d}
.flash-close{cursor:pointer;font-size:18px;opacity:.6;padding:0 4px}
.flash-close:hover{opacity:1}

/* Delete confirmation modal */
.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:1000;display:flex;align-items:center;justify-content:center}
.modal-box{background:white;border-radius:20px;padding:32px;max-width:420px;width:90%;box-shadow:0 25px 60px rgba(0,0,0,.3)}
.modal-box h3{font-size:20px;margin-bottom:8px;color:#172033}
.modal-box p{color:#64748b;font-size:14px;margin-bottom:24px}
.modal-warning{background:#fef3c7;color:#92400e;border:1px solid #f59e0b;border-radius:8px;padding:10px 12px;font-weight:600;margin:-12px 0 20px}
.modal-actions{display:flex;gap:12px;justify-content:flex-end}
.modal-cancel{background:#e5e7eb;color:#172033;border:0;border-radius:12px;padding:10px 20px;font-weight:700;cursor:pointer}
.modal-cancel:hover{background:#d1d5db}
.modal-delete{background:#dc2626;color:white;border:0;border-radius:12px;padding:10px 20px;font-weight:700;cursor:pointer;text-decoration:none;display:inline-block}
.modal-delete:hover{background:#b91c1c}

/* Pagination */
.pagination{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:16px;padding:12px 0}
.pagination a,.pagination span{padding:8px 14px;border-radius:10px;font-size:13px;font-weight:600;text-decoration:none}
.pagination a{color:#1d4ed8;background:#e0ecff}
.pagination a:hover{background:#1d4ed8;color:white}
.pagination .current{background:#1d4ed8;color:white;padding:8px 14px;border-radius:10px}
.pagination .info{color:#64748b;font-size:13px}
/* CS-N129 — paginatorul spune CÂTE înregistrări sunt („1–15 din 42"), nu doar a câta pagină e
   deschisă, iar pagina curentă din șirul de numere se vede fără să fie nevoie de `.current`
   (fragmentul comun marchează cu `.active`, ca vechiul paginator din /jurnal). */
.pagination a.active{background:#1d4ed8;color:white}
.pagination .page-filtrat{font-style:italic;color:#94a3b8}
/* Antetul unei coloane SORTABILE: link, cu indicator de direcție. Coloanele nesortabile rămân
   text — un antet care arată clicabil dar nu e, e tot un control care minte (vezi
   templates/_sortare.html). */
th.sortabil a{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
th.sortabil a:hover{color:#1d4ed8}
th.sortabil .sort-ind{font-size:10px;opacity:.45}
th.sortat{color:#1d4ed8}
th.sortat .sort-ind{opacity:1}
th.sortabil .sort-cheie{display:block;font-weight:400;font-size:10px;color:#94a3b8}

/* Calendar */
.cal-controls{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.cal-title{font-size:20px;font-weight:700;min-width:200px;text-align:center}
.cal-btn{background:#e0ecff;color:#1d4ed8;border:0;border-radius:10px;padding:8px 16px;font-weight:600;cursor:pointer}
.cal-btn:hover{background:#1d4ed8;color:white}
.cal-today{background:#1d4ed8;color:white}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.cal-header{background:#0d1b2f;color:white;padding:10px;text-align:center;font-weight:700;font-size:13px;border-radius:6px}
.cal-day{min-height:90px;background:#f8fafc;border-radius:6px;padding:6px;position:relative;border:1px solid #e5e7eb}
.cal-day.today{border:2px solid #1d4ed8;background:#eef2ff}
.cal-day.other-month{opacity:0.4}
.cal-day-num{font-size:13px;font-weight:600;color:#64748b;margin-bottom:4px}
.cal-event{font-size:11px;padding:3px 6px;border-radius:6px;margin:2px 0;color:white;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:default}
.cal-legend{display:flex;gap:12px;margin-top:12px;flex-wrap:wrap}
.cal-legend-item{display:flex;align-items:center;gap:6px;font-size:13px}
.cal-legend-color{width:14px;height:14px;border-radius:4px}

/* Dashboard activity feed */
/* CS-N137: `.activity-feed` NU mai are `max-height`/`overflow-y`. Plafonul de 320px tăia 456px de
   conținut într-un card de 1354px și punea un scroll intern într-un card care avea loc — cel mai
   enervant tipar dintr-o interfață. Lista rămâne mărginită, dar de NUMĂRUL de intrări trimise de
   server (`LIMITA_ACTIVITATE`, app/routers/api.py), nu de pixeli: la 20 de intrări × ~57px ≈
   1140px, sub înălțimea cardului la o rezoluție de birou obișnuită. Deci nu mai există prag de la
   care să intre un scroll intern — regula a dispărut, nu a fost mărită. */
.activity-item{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid #e5e7eb;align-items:flex-start}
.activity-icon{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}
.activity-icon.reservation{background:#e0ecff;color:#1d4ed8}
.activity-icon.payment{background:#d1fae5;color:#059669}
.activity-icon.maintenance{background:#fef3c7;color:#d97706}
.activity-text{font-size:14px;color:#172033}
.activity-date{font-size:12px;color:#64748b}
/* CS-N137: mențiunea de trunchiere a feed-ului + drumul spre jurnalul complet. */
.activity-truncat{font-size:12px;color:#64748b;margin:10px 0 0;display:flex;flex-wrap:wrap;gap:6px}
/* `display:flex` de mai sus ÎNVINGE regula implicită a browserului pentru `[hidden]`
   (`display:none`) — o clasă e mai specifică decât un selector de element din UA stylesheet. Fără
   regula asta, mențiunea s-ar vedea MEREU, inclusiv cu textul gol, pe un feed netrunchiat. Prins
   în browser real (E2E), nu în suita HTML: atributul `hidden` chiar era pe element. */
.activity-truncat[hidden]{display:none}

/* Reports export buttons */
.export-btn{display:inline-block;background:#059669;color:white;padding:10px 20px;border-radius:12px;text-decoration:none;font-weight:700;font-size:13px}
.export-btn:hover{background:#047857}

/* Responsive */
/* N3-05 — badge de status client (Activ/Dormant/Inactiv). Cele trei se disting prin FORMĂ
   (border-radius + stilul chenarului) și ICONIȚĂ, nu doar prin culoare: alb-negru sau pentru
   cineva care nu distinge verdele de chihlimbariu, badge-ul rămâne citibil. */
.badge-status{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;font-size:12px;font-weight:600;border:1px solid;white-space:nowrap}
.badge-status .ico{font-size:11px;line-height:1}
.badge-status-activ{background:#dcfce7;color:#166534;border-color:#166534;border-radius:999px}
.badge-status-dormant{background:#fef3c7;color:#92400e;border-color:#92400e;border-radius:4px;border-style:dashed}
.badge-status-inactiv{background:#f1f5f9;color:#334155;border-color:#64748b;border-radius:0}
.badge-status-necalculat{background:#fff;color:#94a3b8;border-color:#cbd5e1;border-radius:0;border-style:dotted;font-weight:400}
.badge-status-manual{margin-left:6px;font-size:11px;color:#7c3aed;white-space:nowrap}
.status-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px}

@media(max-width:1000px){
  .cards,.grid{grid-template-columns:1fr}
  .form-panel form{grid-template-columns:1fr}
  .sidebar{width:220px}
}
@media(max-width:768px){
  .app{flex-direction:column}
  .sidebar{width:100%;flex-direction:row;flex-wrap:wrap;padding:12px 16px;gap:8px}
  .brand{margin-bottom:0}
  nav{display:flex;flex-wrap:wrap;gap:4px;flex:1;overflow-y:visible}
  nav a{padding:8px 12px;font-size:13px}
  nav a svg{width:16px;height:16px}
  /* L1-02: pe mobil `nav` e flex-wrap → fiecare grup ocupă o linie întreagă, iar elementele lui
     se aliniază pe orizontală ca înainte de grupare. */
  .nav-group{flex:1 0 100%;margin-bottom:2px}
  .nav-group-items{display:flex;flex-wrap:wrap;gap:4px}
  .nav-group-toggle{padding:4px 8px 2px}
  .sidebar-bottom{margin-top:0;border-top:none;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
  .user-info{display:none}
  .content{padding:16px}
  .cards{grid-template-columns:1fr 1fr}
  .cal-grid{grid-template-columns:repeat(7,1fr);font-size:11px}
  .cal-day{min-height:60px;padding:3px}
  .cal-event{font-size:9px;padding:2px 4px}
  .form-panel form{grid-template-columns:1fr}
}
@media(max-width:480px){
  .cards{grid-template-columns:1fr}
  .cal-grid{grid-template-columns:repeat(7,1fr)}
  .cal-day{min-height:45px}
  .cal-header{padding:6px;font-size:11px}
}