:root{
  --sh-primary:#4F46E5; --sh-primary-hover:#4338CA; --sh-primary-soft:#EEF2FF;
  --sh-bg:#F8FAFC; --sh-surface:#FFFFFF; --sh-border:#E2E8F0;
  --sh-text:#0F172A; --sh-muted:#64748B;
  --sh-success:#16A34A; --sh-warning:#D97706; --sh-danger:#DC2626; --sh-info:#0EA5E9;
  --sh-radius:10px; --sh-shadow:0 1px 3px rgba(15,23,42,.08);
  --sh-sidebar-w:248px;
}
*{box-sizing:border-box}
body{
  font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  background:var(--sh-bg); color:var(--sh-text); margin:0;
}
/* ---- Shell ---- */
.sh-app{display:flex; min-height:100vh}
.sh-sidebar{
  width:var(--sh-sidebar-w); flex:0 0 var(--sh-sidebar-w);
  background:var(--sh-surface); border-right:1px solid var(--sh-border);
  display:flex; flex-direction:column; position:sticky; top:0; height:100vh;
}
.sh-brand{
  display:flex; align-items:center; gap:.65rem; padding:.9rem .95rem;
  font-weight:700; min-height:60px;
}
.sh-brand-tile{width:34px; height:34px; flex:0 0 34px; border-radius:10px;
  display:grid; place-items:center; font-size:1.05rem; color:#fff;
  background:var(--sh-brand-grad,var(--sh-primary));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28)}
.sh-brand:has(img) .sh-brand-tile{display:none}
.sh-brand img{max-height:34px; max-width:150px; object-fit:contain}
.sh-brand-name{font-size:.98rem; line-height:1.15}
.sh-brand-name small{display:block; font-size:.68rem; font-weight:500;
  color:var(--sh-muted); letter-spacing:.02em}
.sh-nav{padding:.4rem .6rem .75rem; display:flex; flex-direction:column; gap:.15rem;
  overflow-y:auto; flex:1 1 auto}
.sh-nav-eyebrow{font-family:var(--sh-mono,ui-monospace,monospace); font-size:.62rem;
  font-weight:600; letter-spacing:.13em; text-transform:uppercase;
  color:var(--sh-muted); padding:.85rem .6rem .3rem; white-space:nowrap}
.sh-nav-eyebrow:first-child{padding-top:.35rem}
.sh-nav a{
  display:flex; align-items:center; gap:.7rem; padding:.55rem .8rem;
  border-radius:var(--sh-radius); color:var(--sh-muted); text-decoration:none;
  font-weight:500; font-size:.95rem; position:relative; white-space:nowrap;
}
.sh-nav a:hover{background:var(--sh-bg); color:var(--sh-text)}
.sh-nav a.active{background:var(--sh-primary-soft); color:var(--sh-primary); font-weight:600}
.sh-nav a i{font-size:1.05rem}
.sh-nav-label{flex:1 1 auto; overflow:hidden; text-overflow:ellipsis}
.sh-nav-badge{font-family:var(--sh-mono,ui-monospace,monospace); font-size:.68rem;
  font-weight:600; line-height:1; padding:.22rem .45rem; border-radius:999px;
  background:var(--sh-amber-soft,#FFF0E1); color:var(--sh-amber-text,#B45400);
  font-variant-numeric:tabular-nums}
.sh-side-foot{margin-top:auto; border-top:1px solid var(--sh-border); padding:.5rem .55rem}
.sh-rail-btn{display:flex; align-items:center; gap:.7rem; width:100%; padding:.5rem .65rem;
  border:0; border-radius:var(--sh-radius); background:transparent; color:var(--sh-muted);
  font:inherit; font-size:.84rem; font-weight:500; cursor:pointer; white-space:nowrap}
.sh-rail-btn:hover{background:var(--sh-bg); color:var(--sh-text)}
.sh-rail-btn:focus-visible{outline:2px solid var(--sh-primary); outline-offset:-2px}
/* ---- Mod restrâns (rail) — doar desktop; pe mobil rămâne off-canvas ---- */
@media (min-width:769px){
  [data-sidebar="rail"] .sh-sidebar{width:68px; flex:0 0 68px}
  [data-sidebar="rail"] .sh-brand{justify-content:center; padding-left:.4rem; padding-right:.4rem}
  [data-sidebar="rail"] .sh-brand img, [data-sidebar="rail"] .sh-brand-name{display:none}
  [data-sidebar="rail"] .sh-brand .sh-brand-tile{display:grid}
  [data-sidebar="rail"] .sh-nav{overflow:visible; padding-left:.5rem; padding-right:.5rem}
  [data-sidebar="rail"] .sh-nav .sh-nav-label, [data-sidebar="rail"] .sh-nav-badge{display:none}
  [data-sidebar="rail"] .sh-nav-eyebrow{font-size:0; padding:0; margin:.55rem .4rem;
    border-top:1px solid var(--sh-border)}
  [data-sidebar="rail"] .sh-nav a{justify-content:center; padding:.55rem 0}
  [data-sidebar="rail"] .sh-rail-btn{justify-content:center}
  [data-sidebar="rail"] .sh-rail-btn .sh-nav-label{display:none}
  [data-sidebar="rail"] .sh-rail-btn i{transform:rotate(180deg)}
  [data-sidebar="rail"] .sh-nav a:hover::after{content:attr(data-label); position:absolute;
    left:calc(100% + 12px); top:50%; transform:translateY(-50%);
    background:var(--sh-text); color:var(--sh-bg); font-size:.75rem; font-weight:600;
    padding:.4rem .6rem; border-radius:8px; white-space:nowrap; z-index:1060;
    box-shadow:var(--sh-shadow)}
}
/* ---- Main ---- */
.sh-main{flex:1 1 auto; min-width:0; display:flex; flex-direction:column}
.sh-topbar{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.75rem 1.25rem; background:var(--sh-surface);
  border-bottom:1px solid var(--sh-border); position:sticky; top:0; z-index:10;
}
.sh-topbar h1{font-size:1.15rem; font-weight:600; margin:0}
.sh-firm-badge{
  background:var(--sh-primary-soft); color:var(--sh-primary);
  border-radius:999px; padding:.2rem .7rem; font-size:.8rem; font-weight:600;
}
.sh-content{padding:1.5rem 1.25rem; flex:1 1 auto}
.sh-hamburger{display:none; border:0; background:transparent; font-size:1.4rem; color:var(--sh-text);
  padding:.4rem .6rem; margin-left:-.6rem}
/* ---- Cards / KPI ---- */
.sh-card{
  background:var(--sh-surface); border:1px solid var(--sh-border);
  border-radius:var(--sh-radius); box-shadow:var(--sh-shadow);
}
.sh-kpi{padding:1.1rem 1.2rem; display:flex; align-items:center; gap:1rem}
.sh-kpi .sh-kpi-icon{
  width:44px; height:44px; border-radius:var(--sh-radius);
  display:flex; align-items:center; justify-content:center;
  background:var(--sh-primary-soft); color:var(--sh-primary); font-size:1.3rem; flex:0 0 44px;
}
.sh-kpi .sh-kpi-value{font-size:1.5rem; font-weight:700; line-height:1.1}
.sh-kpi .sh-kpi-label{color:var(--sh-muted); font-size:.85rem}
/* ---- Formulare dense (aviz, configurare, useri) ---- */
.form-compact .form-label{font-size:.8rem; color:var(--sh-muted); margin-bottom:.15rem}
/* subtitlul din page-header (nr./dată/firmă sub titlul paginii) */
.page-header-sub{color:var(--sh-muted); font-size:.82rem}

/* ---- Section title (keeps old .fs-section name) ---- */
.fs-section,.sh-section{
  font-weight:600; color:var(--sh-text); margin:1.25rem 0 .6rem; font-size:1rem;
}
/* Titlu de secțiune cu butoane pe aceeași linie (Materiale/Servicii) */
.fs-section.with-action{display:flex; justify-content:space-between; align-items:center; gap:.5rem; flex-wrap:wrap}
/* ---- Caseta de totaluri din formularul de aviz ---- */
.totals-box{min-width:320px; max-width:420px}
.totals-box td{padding:.25rem .5rem}
.totals-box .total-row td{border-top:2px solid var(--sh-border); padding-top:.5rem}
/* ---- Bară sticky de acțiuni în formularul de aviz ---- */
.aviz-sticky-bar{
  position:sticky; bottom:0; z-index:20; display:flex; justify-content:space-between; align-items:center;
  gap:1rem; flex-wrap:wrap; padding:.6rem .9rem; margin:0 -.25rem;
  background:var(--sh-surface); border-top:1px solid var(--sh-border);
  box-shadow:0 -4px 12px rgba(0,0,0,.06); border-radius:.5rem .5rem 0 0;
}
.aviz-sticky-total{display:flex; align-items:baseline}
/* pe mobil inputurile numerice la 16px evită zoom-ul automat iOS la focus */
@media (max-width:767.98px){
  .table-form input.form-control{font-size:16px}
}
/* ---- Detaliu aviz: prezentare de ecran ----
   Printul folosește în continuare _detaliu_continut.html + print.css;
   clasele dz-* există doar pe ecran. Fallback-urile pe amber acoperă
   paginile fără servicehub-2026.css. */
.sh-timeline{list-style:none; margin:0; padding:0}
.sh-timeline li{position:relative; padding:0 0 .55rem 1.15rem; font-size:.82rem}
.sh-timeline li::before{content:''; position:absolute; left:2px; top:.42em;
  width:7px; height:7px; border-radius:50%; background:var(--sh-primary)}
/* conectorul urcă spre evenimentul anterior: elementele ascunse de la coadă
   nu lasă o linie suspendată sub ultimul vizibil */
.sh-timeline li:not(:first-child)::after{content:''; position:absolute; left:5px;
  top:-.5rem; height:.85em; width:1px; background:var(--sh-border)}
.sh-timeline .t{color:var(--sh-muted); font-size:.75rem; font-family:var(--sh-mono)}
.dz-deviz{padding:1.5rem 1.75rem}
@media (max-width:575.98px){.dz-deviz{padding:1rem}}
.dz-head{display:flex; justify-content:space-between; gap:1rem 1.5rem; flex-wrap:wrap;
  padding-bottom:1rem; border-bottom:2px solid var(--sh-border); margin-bottom:1.25rem}
.dz-firma{display:flex; gap:.75rem; align-items:flex-start}
.dz-logo{width:44px; height:44px; border-radius:10px; background:var(--sh-primary-soft);
  color:var(--sh-primary); display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:1.05rem; flex:0 0 44px}
.dz-logo-img{max-height:44px; max-width:120px; object-fit:contain}
.dz-firma-line{display:flex; flex-wrap:wrap; align-items:baseline; column-gap:.65rem;
  font-size:.83rem; color:var(--sh-muted)}
.dz-firma-line b{font-size:1.02rem; color:var(--sh-text)}
.dz-firma-line .sep{color:var(--sh-border)}
.dz-firma-adr{color:var(--sh-muted); font-size:.83rem}
.dz-id{text-align:right; margin-left:auto}
.dz-eyebrow{font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--sh-muted)}
.dz-nr{font-size:1.35rem; font-weight:800; font-family:var(--sh-mono)}
.dz-data{color:var(--sh-muted); font-size:.83rem}
.dz-parti{display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:1.25rem}
@media (max-width:719.98px){.dz-parti{grid-template-columns:1fr}}
.dz-parte{background:var(--sh-surface-2); border:1px solid var(--sh-border);
  border-radius:10px; padding:.85rem 1rem}
.dz-parte h3{margin:0 0 .55rem; font-size:.72rem; text-transform:uppercase;
  letter-spacing:.05em; color:var(--sh-muted); font-weight:600;
  display:flex; align-items:center; gap:.45rem}
.dz-kv{display:grid; grid-template-columns:auto 1fr; gap:.15rem .9rem; font-size:.85rem; margin:0}
.dz-kv dt{color:var(--sh-muted); font-weight:400}
.dz-kv dd{margin:0}
.dz-plate{display:inline-block; font-family:var(--sh-mono); font-weight:700; letter-spacing:.05em;
  border:1.5px solid var(--sh-border); border-radius:6px; padding:.02rem .45rem;
  background:var(--sh-surface)}
.dz-defect{border-left:3px solid var(--sh-amber,#E8890C); background:var(--sh-amber-soft,#FFF0E1);
  border-radius:0 10px 10px 0; padding:.65rem .9rem; margin-bottom:.75rem; font-size:.87rem}
.dz-defect b{display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.05em;
  margin-bottom:.15rem; color:var(--sh-amber-text,#B45400)}
.dz-defect.dz-constatat{border-left-color:var(--sh-info);
  background:color-mix(in srgb, var(--sh-info) 9%, var(--sh-surface))}
.dz-defect.dz-constatat b{color:var(--sh-info)}
.dz-sect{margin:1.35rem 0 .5rem; font-size:.72rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.06em; color:var(--sh-muted); display:flex; align-items:center; gap:.6rem}
.dz-sect::after{content:''; flex:1; height:1px; background:var(--sh-border)}
.dz-count{background:var(--sh-primary-soft); color:var(--sh-primary); border-radius:999px;
  padding:.05rem .5rem; font-family:var(--sh-mono)}
.dz-scroll{overflow-x:auto}
.dz-items{width:100%; border-collapse:collapse; font-size:.86rem}
.dz-items th{font-size:.7rem; text-transform:uppercase; letter-spacing:.04em; color:var(--sh-muted);
  text-align:left; padding:.4rem .6rem; border-bottom:1px solid var(--sh-border); font-weight:600}
.dz-items td{padding:.45rem .6rem;
  border-bottom:1px solid color-mix(in srgb, var(--sh-border) 55%, transparent)}
.dz-items tbody tr:last-child td{border-bottom:0}
.dz-items .r{text-align:right}
.dz-items td.r{font-family:var(--sh-mono); font-variant-numeric:tabular-nums}
.dz-items .idx{color:var(--sh-muted); width:2rem}
.dz-items tfoot td{border-top:1px solid var(--sh-border); border-bottom:0;
  font-weight:700; padding-top:.5rem}
.dz-totals-wrap{display:flex; justify-content:flex-end; margin-top:1.25rem}
.dz-totals{min-width:min(320px,100%); background:var(--sh-surface-2);
  border:1px solid var(--sh-border); border-radius:10px; padding:.85rem 1.1rem}
.dz-totals .dz-row{display:flex; justify-content:space-between; gap:2rem;
  padding:.22rem 0; font-size:.87rem}
.dz-totals .dz-row span:last-child{font-family:var(--sh-mono); font-variant-numeric:tabular-nums}
.dz-totals .dz-grand{margin-top:.45rem; padding-top:.55rem;
  border-top:2px solid var(--sh-amber,#E8890C); font-weight:800; font-size:1.02rem}
.dz-totals .dz-grand span:last-child{color:var(--sh-amber-text,#B45400)}
.page-header{display:flex; justify-content:space-between; align-items:center; margin-bottom:1rem}
/* ---- Tables (keeps old .table-app name) ---- */
.table-app,.sh-table{background:var(--sh-surface)}
.sh-card .table{margin:0}
.table thead th{
  background:var(--sh-bg); color:var(--sh-muted); font-weight:600;
  text-transform:uppercase; font-size:.72rem; letter-spacing:.03em; border-bottom:1px solid var(--sh-border);
}
/* override Bootstrap's dark table heads used in old templates */
.table-dark{--bs-table-bg:var(--sh-bg); --bs-table-color:var(--sh-muted)}
.table-dark th{color:var(--sh-muted)!important}
/* ---- Buttons / brand ---- */
.btn-primary{--bs-btn-bg:var(--sh-primary); --bs-btn-border-color:var(--sh-primary);
  --bs-btn-hover-bg:var(--sh-primary-hover); --bs-btn-hover-border-color:var(--sh-primary-hover);
  --bs-btn-active-bg:var(--sh-primary-hover)}
.btn-outline-primary{--bs-btn-color:var(--sh-primary); --bs-btn-border-color:var(--sh-primary);
  --bs-btn-hover-bg:var(--sh-primary); --bs-btn-hover-border-color:var(--sh-primary)}
a{color:var(--sh-primary)}
/* ---- Butoane-icon din rânduri: țintă tactilă decentă (44px pe touch) ---- */
.btn-icon{display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px; padding:0; line-height:1}
@media (pointer:coarse){
  .btn-icon{width:44px; height:44px}
}
/* ---- Status pills ----
   O singură sursă pe tokeni semantici: fundal = tenta culorii peste surface,
   text = culoarea trasă spre --sh-text (light: mai închis, dark: mai deschis)
   → contrast AA în ambele teme fără perechi hardcodate per temă. */
.sh-pill{display:inline-flex; align-items:center; gap:.35rem; padding:.2rem .65rem;
  border-radius:999px; font-size:.78rem; font-weight:600; line-height:1.4;
  --pill-c:var(--sh-muted);
  background:color-mix(in srgb, var(--pill-c) 14%, var(--sh-surface));
  color:color-mix(in srgb, var(--pill-c) 62%, var(--sh-text))}
.sh-pill::before{content:''; width:7px; height:7px; border-radius:50%; background:currentColor}
/* nou / programat / neincasata rămân pe --sh-muted (default) */
.sh-pill-in_lucru{--pill-c:var(--sh-primary)}
.sh-pill-asteapta_piese,.sh-pill-asteapta,.sh-pill-partial{--pill-c:var(--sh-warning)}
.sh-pill-gata,.sh-pill-onorat,.sh-pill-incasata{--pill-c:var(--sh-success)}
.sh-pill-predat{--pill-c:var(--sh-info)}
.sh-pill-facturat{--pill-c:var(--sh-amber,#B45400)} /* fallback pt. base_print fără CSS 2026 */
.sh-pill-anulat{--pill-c:var(--sh-danger)}
/* ---- Calendar programări: grid orar, sloturi de 30 min ---- */
.cal-wrap{overflow:auto; max-height:78vh}
.cal-grid{border-collapse:separate; border-spacing:0; width:100%; min-width:960px; table-layout:fixed}
.cal-grid thead th{position:sticky; top:0; z-index:2; background:var(--sh-surface);
  font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.03em;
  color:var(--sh-muted); padding:.5rem; text-align:left;
  border-bottom:1px solid var(--sh-border)}
.cal-grid thead th.cal-today{color:var(--sh-amber-text,#B45400)}
.cal-hcol{width:56px; min-width:56px; text-align:right !important; color:var(--sh-muted);
  font-size:.72rem; font-weight:500; padding:.2rem .5rem .2rem .2rem;
  background:var(--sh-surface); border-right:1px solid var(--sh-border);
  vertical-align:top; position:sticky; left:0; z-index:1}
.cal-grid thead th.cal-hcol{z-index:3}
.cal-grid tbody th.cal-hcol{border-bottom:1px solid var(--sh-border)}
.cal-grid tbody td{height:36px; padding:2px 3px; position:relative; vertical-align:top;
  border-right:1px solid color-mix(in srgb, var(--sh-border) 55%, transparent)}
.cal-row-h td{border-bottom:1px dashed color-mix(in srgb, var(--sh-border) 70%, transparent)}
.cal-row-hh td{border-bottom:1px solid var(--sh-border)}
.cal-off{background:color-mix(in srgb, var(--sh-muted) 8%, transparent)}
.cal-add{position:absolute; inset:2px; display:flex; align-items:center; justify-content:center;
  border-radius:7px; color:transparent; text-decoration:none; z-index:0}
.cal-add:hover, .cal-add:focus-visible{background:var(--sh-primary-soft); color:var(--sh-primary)}
.cal-item{position:relative; z-index:1; display:block; margin-bottom:2px; padding:.18rem .45rem;
  border-radius:7px; font-size:.75rem; line-height:1.35; text-decoration:none;
  background:var(--sh-primary-soft); color:var(--sh-text);
  border-left:3px solid var(--sh-primary);
  overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
.cal-item strong{font-weight:600}
.cal-item-meta{color:var(--sh-muted)}
.cal-item-onorat{border-left-color:var(--sh-success)}
.cal-item-anulat{border-left-color:var(--sh-danger); opacity:.6}
.cal-item-anulat strong{text-decoration:line-through}
.cal-dot{display:inline-block; width:7px; height:7px; border-radius:50%;
  --pill-c:var(--sh-muted); background:var(--pill-c); margin-right:1px}
/* continuarea unei programări în sloturile acoperite de durată */
.cal-cont{position:relative; z-index:1; display:block; min-height:28px; margin-bottom:2px;
  border-radius:0 4px 4px 0; border-left:3px solid var(--sh-primary);
  background:color-mix(in srgb, var(--sh-primary-soft) 55%, transparent)}
.cal-cont.cal-item-onorat{border-left-color:var(--sh-success)}
.cal-cont.cal-item-anulat{border-left-color:var(--sh-danger); opacity:.45}

/* ---- Kanban (Comenzi) ---- */
.kanban{scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch}
.kanban-col{min-width:240px; flex:0 0 240px; scroll-snap-align:start;
  background:var(--sh-surface-2); border:1px solid var(--sh-border);
  border-radius:var(--sh-radius); padding:.6rem; display:flex; flex-direction:column}
.kanban-col-head{font-weight:600; font-size:.78rem; text-transform:uppercase;
  letter-spacing:.03em; color:var(--sh-muted); margin-bottom:.5rem;
  display:flex; align-items:center; justify-content:space-between; gap:.5rem}
.kanban-col-body{min-height:60px; max-height:70vh; overflow-y:auto; border-radius:6px}
.kanban-ghost{opacity:.45; outline:2px dashed var(--sh-primary); outline-offset:-2px; border-radius:8px}

/* ---- Empty state ---- */
.sh-empty{text-align:center; color:var(--sh-muted); padding:2.5rem 1rem}
.sh-empty i{font-size:2rem; display:block; margin-bottom:.5rem; opacity:.6}
/* ---- Auth ---- */
.sh-auth{min-height:100vh; display:flex; align-items:center; justify-content:center; background:var(--sh-bg)}
.sh-auth .sh-card{width:100%; max-width:380px; padding:2rem}
.sh-auth-brand{text-align:center; font-weight:700; font-size:1.3rem; margin-bottom:.25rem}
/* ---- Responsive ---- */
@media (max-width:768px){
  .sh-sidebar{position:fixed; left:0; top:0; z-index:1050; transform:translateX(-100%);
    transition:transform .2s ease}
  .sh-sidebar.show{transform:translateX(0)}
  .sh-hamburger{display:inline-block}
  .sh-side-foot{display:none}
  .sh-backdrop{position:fixed; inset:0; background:rgba(15,23,42,.4); z-index:1040; display:none}
  .sh-backdrop.show{display:block}
}
/* ---- Print ---- */
.print-header{margin-bottom:1rem}
.print-title{font-size:1.1rem; font-weight:700; margin-bottom:1rem; text-align:center}
.signature-line{border-bottom:1px solid #000; margin:2rem auto .25rem; width:180px}
.avoid-break{page-break-inside:avoid}
.no-print{margin-bottom:1.5rem}
@media print{
  .no-print{display:none}
  .sh-topbar,.sh-sidebar,.sh-backdrop{display:none}
  body{background:#fff}
}
.sh-autocomplete{position:absolute; z-index:30; max-width:340px; margin-top:2px}