:root{
  --bg:#0b1220;
  --panel:#0f1a2e;
  --card:#111f38;
  --card2:#0f1b31;
  --text:#e7eefc;
  --muted:#9fb0d0;
  --line:rgba(255,255,255,.08);
  --primary:#ff0000;
  --primary2:#c40000;
  --ok:#22c55e;
  --warn:#f59e0b;
  --bad:#ef4444;
  --chip:#1c2b4a;
  --shadow: 0 10px 30px rgba(0,0,0,.35);
  --radius:14px;
  --radius2:10px;
  --font: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:var(--font);
  font-weight:300;
  font-weight:300;
  color:var(--text);
  background: radial-gradient(1200px 600px at 15% 10%, rgba(59,130,246,.25), transparent 60%),
              radial-gradient(900px 500px at 80% 0%, rgba(34,197,94,.18), transparent 60%),
              linear-gradient(180deg, #071022, #050a16 70%);

}
a{color:inherit; text-decoration:none}

/* Brand logo (global clamp) */
.brandImg{
  height:70px !important;
  max-height:70px !important;
  width:auto !important;
  max-width:420px;
  object-fit:contain;
  display:block;
}


.small{font-size:12px;color:var(--muted)}
.muted{color:var(--muted)}
.row{display:flex; gap:12px; align-items:center}
.spacer{flex:1}
.hr{height:1px;background:var(--line); margin:12px 0}
.container{max-width:1180px; margin:0 auto; padding:18px 14px 28px}
.topbar{
  position:sticky; top:0; z-index:50;
  backdrop-filter: blur(10px);
  background: linear-gradient(180deg, rgba(7,16,34,.85), rgba(7,16,34,.55));
  border-bottom:1px solid var(--line);
}
.brand{
  display:flex; align-items:center; gap:8px;
  padding:16px 16px;
}
.logo{
  width:34px; height:34px; border-radius:10px;
  background: conic-gradient(from 210deg, var(--primary), rgba(34,197,94,.9), rgba(245,158,11,.9), var(--primary));
  box-shadow: 0 8px 20px rgba(59,130,246,.18);
}
.brand .title{font-weight:900; letter-spacing:.2px}
.pill{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 10px; border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid var(--line);
  font-size:12px; color:var(--muted);
}
.pill .dot{width:8px;height:8px;border-radius:999px;background:var(--ok)}
.btn{
  border:1px solid var(--line);
  background:rgba(255,255,255,.04);
  color:var(--text);
  padding:10px 12px;
  border-radius:12px;
  font-weight:700;
  display:inline-flex; align-items:center; justify-content:center;
  gap:8px;
  cursor:pointer;
  transition: transform .06s ease, background .15s ease, border-color .15s ease;
  user-select:none;
}
.btn:hover{background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.14)}
.btn:active{transform:translateY(1px)}
.btn.primary{background:linear-gradient(180deg, rgba(59,130,246,.95), rgba(37,99,235,.95)); border-color:rgba(255,255,255,.12)}
.btn.primary:hover{filter:brightness(1.05)}
.btn.ghost{background:transparent}
.btn.danger{background:rgba(239,68,68,.12); border-color:rgba(239,68,68,.35)}
.btn.ok{background:rgba(34,197,94,.13); border-color:rgba(34,197,94,.35)}
.input, select{
  background:rgba(255,255,255,.04);
  border:1px solid var(--line);
  color:var(--text);
  padding:10px 12px;
  border-radius:12px;
  outline:none;
}
.input:focus, select:focus{border-color:rgba(59,130,246,.5); box-shadow:0 0 0 3px rgba(59,130,246,.15)}
.card{
  background:linear-gradient(180deg, rgba(17,31,56,.85), rgba(10,18,33,.7));
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.card.pad{padding:14px}
.grid2{display:grid; grid-template-columns: 340px 1fr; gap:14px}
.grid3{display:grid; grid-template-columns: 320px 1fr 360px; gap:12px}
@media (max-width: 980px){ .grid3{grid-template-columns:1fr} .grid2{grid-template-columns:1fr} .drawer{position:fixed; inset:0; width:auto} }

.h1{font-size:20px; font-weight:900; margin:0}
.h2{font-size:14px; font-weight:900; margin:0}
.sectionTitle{font-weight:900; font-size:12px; letter-spacing:.12em; color:rgba(231,238,252,.75); text-transform:uppercase}
.list{display:flex; flex-direction:column; gap:10px}
.person{
  display:flex; align-items:center; gap:8px;
  padding:10px 10px;
  border-radius:12px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
}
.person:hover{border-color:rgba(59,130,246,.35)}
.avatar{
  width:34px;height:34px;border-radius:12px;
  background:rgba(59,130,246,.22);
  display:flex; align-items:center; justify-content:center;
  font-weight:900;
}
.badge{
  font-size:11px; padding:4px 8px; border-radius:999px;
  background:rgba(255,255,255,.05); border:1px solid var(--line); color:var(--muted)
}
.badge.ok{background:rgba(34,197,94,.12); border-color:rgba(34,197,94,.35); color:#000}
.badge.warn{background:rgba(245,158,11,.12); border-color:rgba(245,158,11,.35); color:#000}
.badge.bad{background:rgba(239,68,68,.12); border-color:rgba(239,68,68,.35); color:#ffd1d1}
.chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 10px; border-radius:999px;
  background:rgba(255,255,255,.05); border:1px solid var(--line);
  font-size:12px;
}
.chip .mini{width:8px;height:8px;border-radius:999px;background:var(--primary)}
.chip.assistenza .mini{background:var(--primary)}
.chip.installazione .mini{background:var(--ok)}
.chip.ticket .mini{background:var(--warn)}
.chip.ferie .mini{background:var(--bad)}
.kbd{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace; background:rgba(255,255,255,.06); border:1px solid var(--line); padding:2px 6px; border-radius:8px; font-size:12px}

.toast{
  position:fixed; right:14px; bottom:14px;
  background:rgba(17,31,56,.95);
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  padding:12px 12px;
  box-shadow:var(--shadow);
  display:none;
  max-width:360px;
}
.toast.show{display:block; animation: pop .18s ease}
@keyframes pop{from{transform:translateY(8px); opacity:.6} to{transform:translateY(0);opacity:1}}

.calendarWrap{overflow:auto}
.calendar{
  min-width: 860px;
  border-collapse:separate;
  border-spacing:0;
  width:100%;
}
.calendar th, .calendar td{
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.calendar thead th{
  position:sticky; top:0;
  background:rgba(11,18,32,.92);
  backdrop-filter: blur(8px);
  padding:10px;
  text-align:left;
  font-size:12px;
  z-index:5;
}
.calendar thead th:first-child{
  left:0; position:sticky; z-index:6;
}
.calendar tbody th{
  position:sticky; left:0;
  background:rgba(11,18,32,.92);
  backdrop-filter: blur(8px);
  padding:10px;
  font-size:12px;
  z-index:4;
  width:240px;
}
.calendar td{
  vertical-align:top;
  padding:8px;
  min-height:72px;
  height:72px;
  background:rgba(255,255,255,.02);
}
.dropzone{border-radius:12px; height:100%; position:relative}
.dropzone.over{outline:2px dashed rgba(59,130,246,.6); outline-offset:-4px; background:rgba(59,130,246,.08)}
.event{
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  box-shadow:0 8px 18px rgba(0,0,0,.25);
  cursor:grab;
  user-select:none;
}
.event:active{cursor:grabbing}
.event .t{font-weight:900; font-size:12px}
.event .s{font-size:11px; color:var(--muted); margin-top:2px}
.event.assistenza{border-color:rgba(59,130,246,.35); background:rgba(59,130,246,.12)}
.event.installazione{border-color:rgba(34,197,94,.35); background:rgba(34,197,94,.12)}
.event.ticket{border-color:rgba(245,158,11,.35); background:rgba(245,158,11,.12)}
.event.ferie{border-color:rgba(239,68,68,.35); background:rgba(239,68,68,.12)}
.backlog .event{margin-bottom:10px}
.drawer{
  position:sticky; top:86px;
  height: calc(100vh - 110px);
  overflow:auto;
  padding:14px;
}
.drawer .x{
  width:36px;height:36px;border-radius:12px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.04);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
}
.drawer.hidden{display:none}

.loginWrap{
  min-height: calc(100vh - 80px);
  display:grid;
  place-items:center;
}
.loginCard{width:min(420px, 92vw); padding:16px}
.bigTitle{font-size:22px; font-weight:900; margin:0}
.helper{font-size:13px; color:var(--muted); margin-top:6px; line-height:1.4}
.tabs{display:flex; gap:8px; margin-top:12px}
.tab{flex:1; text-align:center}
.tab.active{background:rgba(59,130,246,.12); border-color:rgba(59,130,246,.35)}

.mobileNav{
  position:sticky; top:0; z-index:40;
  backdrop-filter: blur(10px);
  background: linear-gradient(180deg, rgba(7,16,34,.85), rgba(7,16,34,.55));
  border-bottom:1px solid var(--line);
}
.mobileNav .inner{display:flex; align-items:center; gap:8px; padding:12px 14px}
.kpis{display:grid; grid-template-columns: repeat(3, 1fr); gap:10px}
.kpi{padding:12px; border-radius:14px; border:1px solid var(--line); background:rgba(255,255,255,.03)}
.kpi .n{font-weight:900; font-size:18px}
.kpi .l{font-size:12px;color:var(--muted)}
.actionsGrid{display:grid; grid-template-columns: repeat(2, 1fr); gap:10px}
.actionsGrid .btn{padding:14px 12px; border-radius:16px; font-size:14px}
.tableLike{width:100%; border-collapse:collapse}
.tableLike td{padding:10px 0; border-bottom:1px solid var(--line)}

/* Brand logo image */
.brandLogo{height:34px;width:auto;display:block}
.brandLogo.sm{height:30px}
.logoBox{
  width:34px;height:34px;border-radius:10px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.logoBox.sm{width:30px;height:30px;border-radius:10px}


/* ---------- Light theme (Login/Home) ---------- */
body.light{
  font-weight:300;
  background:
    radial-gradient(1100px 620px at 12% -10%, rgba(255,0,0,.24), transparent 58%),
    radial-gradient(900px 560px at 92% 0%, rgba(255,0,0,.16), transparent 60%),
    radial-gradient(700px 520px at 50% 115%, rgba(0,0,0,.06), transparent 58%),
    linear-gradient(180deg, #ffffff, #f3f3f3 60%, #ffffff);
  color:#141414;
}

body.light .topbar{
  background:rgba(255,255,255,.88);
  border-bottom:1px solid rgba(0,0,0,.08);
}
body.light .card{
  background:#ffffff;
  border:1px solid rgba(0,0,0,.08);
  box-shadow: 0 12px 28px rgba(0,0,0,.10);
}
body.light .input, body.light select{
  background:#ffffff;
  border:1px solid rgba(0,0,0,.14);
  color:#141414;
}
body.light .input::placeholder{color:rgba(0,0,0,.45)}
body.light .btn{
  background:#ffffff;
  border:1px solid rgba(0,0,0,.14);
  color:#141414;
}
body.light .btn:hover{background:rgba(0,0,0,.03); border-color:rgba(0,0,0,.22)}
body.light .btn.primary{
  background:linear-gradient(180deg, var(--primary), var(--primary2));
  border-color:rgba(196,0,0,.35);
  color:#ffffff;
}
body.light .btn.primary:hover{filter:brightness(1.03)}
body.light .btn.ghost{
  background:transparent;
}
body.light .pill{
  background:rgba(0,0,0,.03);
  border:1px solid rgba(0,0,0,.10);
  color:rgba(0,0,0,.65);
}
body.light .small, body.light .muted{color:rgba(0,0,0,.55)}
body.light .hr{background:rgba(0,0,0,.08)}
body.light .tabs .tab{background:#ffffff}
body.light .tabs .tab.active{background:rgba(255,0,0,.08); border-color:rgba(255,0,0,.35)}
/* Brand header logo (no square) */
\.brandImg{  height:34px !important;
  width:auto;
  display:block;
}
@media (max-width:420px){
  .brandImg{height:34px}
}
.loginShell{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap:16px;
  width:min(980px, 94vw);
  margin:0 auto;
  padding:20px 14px 26px;
}
@media (max-width: 900px){
  .loginShell{grid-template-columns: 1fr; width:min(520px, 92vw)}
}
.loginHero{
  padding:18px;
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,0,0,.06), rgba(0,0,0,0));
  border:1px solid rgba(0,0,0,.08);
}
.loginHero h1{margin:0; font-size:26px; font-weight:900; letter-spacing:.2px}
.loginHero p{margin:10px 0 0 0; line-height:1.45; color:rgba(0,0,0,.62)}
.loginBullets{
  margin-top:14px;
  display:grid;
  gap:8px;
}
.loginBullet{
  display:flex;
  gap:8px;
  align-items:flex-start;
  padding:10px 12px;
  border-radius:14px;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
}
.loginBullet .ic{
  width:26px;height:26px;border-radius:10px;
  background:rgba(255,0,0,.10);
  display:flex;align-items:center;justify-content:center;
  font-weight:900;color:var(--primary2);
}
.loginBullet .t{font-weight:900}
.loginBullet .d{font-size:13px;color:rgba(0,0,0,.60); margin-top:2px}

/* Light nav */
body.light .mobileNav{
  background:rgba(255,255,255,.92);
  border-bottom:1px solid rgba(0,0,0,.08);
}
body.light .mobileNav .inner{color:#141414}

/* Light calendar */
body.light .calendar thead th{
  background:rgba(255,255,255,.92);
  border-bottom:1px solid rgba(0,0,0,.08);
  color:#141414;
}
body.light .calendar thead th:first-child,
body.light .calendar tbody th{
  background:rgba(255,255,255,.92);
  color:#141414;
}
body.light .calendar th, body.light .calendar td{
  border-right:1px solid rgba(0,0,0,.08);
  border-bottom:1px solid rgba(0,0,0,.08);
}
body.light .calendar td{background:rgba(255,255,255,.75)}
body.light .dropzone.over{
  outline:2px dashed rgba(255,0,0,.55);
  background:rgba(255,0,0,.06);
}
body.light .event{
  background:#ffffff;
  border:1px solid rgba(0,0,0,.12);
  box-shadow: 0 10px 22px rgba(0,0,0,.10);
  color:#141414;
}
body.light .event .s{color:rgba(0,0,0,.58)}
body.light .event.assistenza{border-color:rgba(255,0,0,.45); background:rgba(255,0,0,.06)}
body.light .event.installazione{border-color:rgba(34,197,94,.40); background:rgba(34,197,94,.08)}
body.light .event.ticket{border-color:rgba(245,158,11,.45); background:rgba(245,158,11,.10)}
body.light .event.ferie{border-color:rgba(239,68,68,.45); background:rgba(239,68,68,.08)}

.brandTitle{
  font-weight:900;
  letter-spacing:.2px;
}
.brandSub{
  font-size:12px;
  color:rgba(0,0,0,.55);
}
body.light .brandSub{color:rgba(0,0,0,.55)}

body.light .brand{display:flex; align-items:center; gap:8px; flex-wrap:nowrap}

.brandMark{display:flex; align-items:center; max-width:420px}

body.light .brand{flex-wrap:nowrap}

body.light .topbar .brand{min-height:92px}

/* Login sizing */
.loginCardWide{
  width:min(600px, 94vw);
  padding:22px;
}
.loginCardWide .bigTitle{font-size:26px}
.loginCardWide .helper{font-size:14px}
.loginCardWide .tabs .btn{padding:12px 12px}
.loginCardWide .input{padding:12px 14px; border-radius:14px}
.loginCardWide .btn{padding:12px 14px; border-radius:14px}


/* Header title next to logo */
.brandTitleText{
  font-weight:900;
  font-size:16px;
  color:#141414;
  letter-spacing:.2px;
  white-space:nowrap;
}
@media (max-width:520px){
  .brandTitleText{font-size:14px}
}

/* Input with icon + password toggle */
.field{
  position:relative;
  width:100%;
}
.field .input{
  width:100%;
  padding-left:42px;
}
.field .icon{
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  width:18px;
  height:18px;
  opacity:.55;
}
.pwdToggle{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  border:1px solid rgba(0,0,0,.14);
  background:rgba(255,255,255,.85);
  border-radius:12px;
  padding:8px 10px;
  cursor:pointer;
  font-weight:700;
  color:rgba(0,0,0,.70);
}
.pwdToggle:hover{background:rgba(0,0,0,.03)}
.alert{
  border:1px solid rgba(220,38,38,.25);
  background:rgba(220,38,38,.06);
  color:#7f1d1d;
  padding:10px 12px;
  border-radius:14px;
  font-size:13px;
  display:none;
}
.alert.show{display:block}

/* Mobile tweaks */
@media (max-width: 520px){
  .brandTitleText{display:none;} /* keep header clean on phone */
  .loginCardWide{width:min(520px, 94vw); padding:18px;}
  .actionsGrid{grid-template-columns:1fr;} /* bigger buttons in app tecnico */
  .calendar{min-width: 760px;} /* allow scroll but less wide */
}

/* Admin shell v3.9 */
body.admin{
  background:
    radial-gradient(1100px 620px at 12% -10%, rgba(255,0,0,.20), transparent 58%),
    radial-gradient(900px 560px at 92% 0%, rgba(255,0,0,.10), transparent 62%),
    linear-gradient(180deg, #ffffff, #f2f2f2 62%, #ffffff);
}

/* spazio per footer fisso */
body{ padding-bottom:72px; }

.adminLayout{
  display:grid;
  grid-template-columns: 180px 1fr;
  min-height: calc(100vh - 0px);
}

.sidebar{
  position:sticky;
  top:0;
  height:100vh;
  background:rgba(255,255,255,.92);
  border-right:1px solid rgba(0,0,0,.08);
  padding:12px 10px;
  overflow:auto;
}
.sidebar .navTitle{
  font-weight:900;
  color:rgba(0,0,0,.70);
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  margin:8px 10px 10px;
}
.navItem{
  font-size:12px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 10px;
  border-radius:14px;
  cursor:pointer;
  border:1px solid transparent;
  color:rgba(0,0,0,.78);
  font-weight:800;
}
.navItem:hover{
  background:rgba(0,0,0,.03);
  border-color:rgba(0,0,0,.06);
}
.navItem.active{
  background:rgba(255,0,0,.10);
  border-color:rgba(255,0,0,.28);
  color:#141414;
}
.navIcon{
  width:26px;height:26px;border-radius:12px;
  background:rgba(255,0,0,.10);
  display:flex;align-items:center;justify-content:center;
  font-weight:900;color:rgba(196,0,0,.95);
  flex:0 0 auto;
}

/* Badge notifica (es. Richieste) */
.navBadge{
  margin-left:auto;
  min-width:22px;
  height:22px;
  padding:0 7px;
  border-radius:999px;
  background:#e00000;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  font-size:12px;
  line-height:1;
}

.main{
  padding:16px 14px 22px;
}

.adminTopRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:12px;
}
.adminTopRow .left{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.adminTopRow .title{
  font-weight:900;
  font-size:18px;
  color:#141414;
  margin:0;
}
.adminTopRow .muted{
  color:rgba(0,0,0,.55);
  font-size:13px;
}
.seg{
  display:flex;
  gap:8px;
  padding:6px;
  border-radius:16px;
  border:1px solid rgba(0,0,0,.10);
  background:rgba(255,255,255,.75);
}
.seg .btn{
  padding:10px 12px;
  border-radius:12px;
}
.seg .btn.active{
  background:rgba(255,0,0,.10);
  border-color:rgba(255,0,0,.35);
}

.calCard{
  padding:0;
  overflow:hidden;
}
.calWrap{
  overflow:auto;
}
.calendar{
  width:max-content;
  border-collapse:separate;
  border-spacing:0;
}
.calendar th, .calendar td{
  border-right:1px solid rgba(0,0,0,.08);
  border-bottom:1px solid rgba(0,0,0,.08);
}
.calendar thead th{
  background:rgba(255,255,255,.92);
  color:#141414;
  font-weight:900;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.10em;
  padding:10px 10px;
  position:sticky;
  top:0;
  z-index:3;
}
.calendar thead th:first-child{
  left:0;
  z-index:5;
  min-width:240px;
}
.calendar tbody th{
  background:rgba(255,255,255,.92);
  position:sticky;
  left:0;
  z-index:4;
  padding:10px 10px;
  min-width:240px;
  font-weight:900;
}
.techName{font-size:13px; color:#141414}
.techMeta{font-size:11px; color:rgba(0,0,0,.55); margin-top:2px}
.calendar td{
  background:rgba(255,255,255,.70);
  min-width:150px;
  height:58px;
}
.calendar td.empty{
  background:rgba(255,255,255,.60);
}

.topbar .brand{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:nowrap;
}
.topbar .spacer{flex:1}

/* Sidebar collapse */
.sidebarToggle{display:inline-flex;}
body.sidebar-collapsed .adminLayout{grid-template-columns: 64px 1fr;}
body.sidebar-collapsed .sidebar{
  padding:14px 10px;
}
body.sidebar-collapsed .navTitle{
  display:none;
}
body.sidebar-collapsed .navItem .label{
  display:none;
}
body.sidebar-collapsed .navItem{
  justify-content:center;
  padding:10px 8px;
}
body.sidebar-collapsed .navIcon{
  width:34px;height:34px;border-radius:16px;
}

/* Mobile */
@media (max-width: 900px){
  .adminLayout{grid-template-columns: 1fr;}
  .sidebar{
    position:fixed;
    top:0; left:0;
    width:270px;
    transform:translateX(-102%);
    transition:transform .22s ease;
    z-index:60;
    box-shadow: 18px 0 40px rgba(0,0,0,.14);
  }
  body.sidebar-open .sidebar{transform:translateX(0)}
  .sidebarToggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  .main{padding:14px 10px 18px}
  .calendar thead th:first-child,
  .calendar tbody th{min-width:200px}
  .calendar td{min-width:130px}
}

/* Modal */
.backdrop{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.35);
  display:none;
  z-index:70;
}
.backdrop.show{display:block}

.modal{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  padding:16px;
  z-index:80;
}
.modal.show{display:flex}
.modalCard{
  width:min(980px, 96vw);
  max-height:92vh;
  overflow:auto;
  background:rgba(255,255,255,.98);
  border:1px solid rgba(0,0,0,.10);
  border-radius:18px;
  box-shadow: 0 28px 60px rgba(0,0,0,.20);
}
.modalHead{
  position:sticky;
  top:0;
  background:rgba(255,255,255,.98);
  border-bottom:1px solid rgba(0,0,0,.08);
  padding:16px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  z-index:2;
}
.modalTabs{
  display:flex;
  gap:8px;
}
.tabBtn{
  border:1px solid rgba(0,0,0,.12);
  background:rgba(255,255,255,.85);
  border-radius:12px;
  padding:10px 12px;
  font-weight:800;
  cursor:pointer;
}
.tabBtn.active{
  background:rgba(255,0,0,.10);
  border-color:rgba(255,0,0,.35);
}
.modalBody{padding:14px}
.formGrid{
  display:grid;
  grid-template-columns: 180px 1fr;
  gap:10px 12px;
  align-items:center;
}
.formGrid label{
  font-weight:800;
  color:rgba(0,0,0,.65);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.formGrid .input, .formGrid textarea, .formGrid select{
  width:100%;
}
.inlineRow{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}
.pillOpt{
  border:1px solid rgba(0,0,0,.12);
  background:rgba(255,255,255,.85);
  padding:10px 12px;
  border-radius:12px;
  font-weight:800;
  cursor:pointer;
}
.pillOpt.active{
  background:rgba(255,0,0,.10);
  border-color:rgba(255,0,0,.35);
}
.modalFoot{
  position:sticky;
  bottom:0;
  background:rgba(255,255,255,.98);
  border-top:1px solid rgba(0,0,0,.08);
  padding:14px;
  display:flex;
  gap:8px;
  justify-content:space-between;
  flex-wrap:wrap;
}
@media (max-width: 720px){
  .formGrid{grid-template-columns:1fr; align-items:start}
  .formGrid label{margin-top:6px}
}

/* Calendar v3.10 */
.calCard{height: calc(100vh - 170px); min-height:460px;}
.calWrap{height:100%;}
.calendar td{height:54px;}
.calendar td:hover{background:rgba(255,0,0,.05); cursor:pointer}
.calendar td::after{
  content:'';
  display:block;
  height:100%;
}
.daySep{
  background:rgba(0,0,0,.03);
}

/* Sidebar controls v3.10 */
.sidebarClose{
  display:none;
}
@media (max-width: 900px){
  .sidebarClose{
    display:flex;
    justify-content:flex-end;
    padding:6px 6px 0;
  }
}

/* Sidebar hide (desktop) */
body.sidebar-hidden .adminLayout{grid-template-columns:0 1fr;}
body.sidebar-hidden .sidebar{display:none;}

/* Calendar compact widths */
.calendar.compact15 td{min-width:70px}
.calendar.compact15 thead th{font-size:11px; padding:9px 8px}
.calendar.compact15 tbody th{min-width:190px}

.calendar.compact30 td{min-width:42px}
.calendar.compact30 thead th{font-size:10px; padding:8px 6px}
.calendar.compact30 tbody th{min-width:190px}

/* Files list */
.fileList{display:grid; gap:8px; margin-top:10px;}
.fileItem{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:10px 12px;
  border:1px solid rgba(0,0,0,.10);
  border-radius:14px;
  background:rgba(255,255,255,.85);
}
.fileMeta{display:flex; flex-direction:column; gap:2px;}
.fileName{font-weight:900}
.fileSub{font-size:12px; color:rgba(0,0,0,.55)}
/* Calendar event block */
.calEvent{
  margin:6px;
  padding:6px 8px;
  border-radius:10px;
  border:1px solid rgba(0,0,0,.08);
  background:rgba(255,0,0,.10);
  font-weight:900;
  font-size:11px;
  line-height:1.1;
}

.calEvent .sub{font-weight:800; font-size:10px; color:rgba(0,0,0,.55); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.calEvent .time{font-size:9.5px; opacity:.85; font-weight:900; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.05; margin-top:2px;}
.calEvent.half .time{font-size:8.5px;}

/* Mobile sidebar offcanvas v3.16 */
@media (max-width: 900px){
  .adminLayout{grid-template-columns: 0 1fr;}
  .sidebar{
    position:fixed;
    top:72px;
    left:0;
    bottom:0;
    width:220px;
    transform:translateX(0);
    transition:transform .18s ease;
    z-index:60;
  }
  body.sidebar-hidden .sidebar{
    display:block;
    transform:translateX(-110%);
  }
}

/* Half-day events v3.16 */
.cellEvents{display:grid; grid-template-columns: 1fr 1fr; gap:6px; align-items:start}
.calEvent{flex: 1 1 100%;}
.calEvent.half{flex: 0 0 calc(50% - 3px); max-width:calc(50% - 3px);}
.calEvent.half.slot-morning{margin-right:auto}
.calEvent.half.slot-afternoon{margin-left:auto}

.calEvent.status-programmato{
  background: rgba(255, 200, 0, .92);
  border-color: rgba(210, 150, 0, .80);
}

.calEvent.status-confermato{
  background: rgba(0, 170, 75, .92);
  border-color: rgba(0, 140, 60, .85);
}

/* Assenze approvate (da Richieste Dipendenti) */
.calEvent.abs-malattia{
  background: rgba(224, 0, 0, .92) !important;
  border-color: rgba(184, 0, 0, .85) !important;
  color:#fff !important;
}
.calEvent.abs-ferie,
.calEvent.abs-permesso{
  background: rgba(43, 127, 255, .92) !important;
  border-color: rgba(18, 90, 210, .85) !important;
  color:#fff !important;
}
.calEvent.abs-malattia .sub,
.calEvent.abs-ferie .sub,
.calEvent.abs-permesso .sub{
  color: rgba(255,255,255,.88) !important;
}

.calEvent .main{font-weight:900; font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.calEvent .sub{font-weight:800; font-size:10px; color:rgba(0,0,0,.55); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

.calEvent.half{font-size:10px;}

body.sidebar-hidden .main{grid-column: 1 / -1;}

/* Context menu */
.ctxMenu{
  background:rgba(255,255,255,.98);
  border:1px solid rgba(0,0,0,.12);
  border-radius:14px;
  box-shadow:0 20px 50px rgba(0,0,0,.18);
  padding:8px;
}
.ctxItem{
  padding:10px 10px;
  border-radius:12px;
  cursor:pointer;
  font-weight:900;
  font-size:12px;
}
.ctxItem:hover{background:rgba(0,0,0,.04)}
.ctxItem.danger{color:#b00020}

.calEvent.half .main{font-size:11px}
.calEvent.half .sub{font-size:9px}

/* Calendar header red */
.calendar thead th{
  background:#c00000;
  color:#fff;
  border-color: rgba(255,255,255,.22);
}
.calendar thead th.daySep{border-left-color: rgba(255,255,255,.28);}
.calendar thead th:first-child{position:sticky; left:0; z-index:2;}

.calEvent .main{font-size:12px;}

.calEvent .sub{font-size:10px; opacity:.9;}

/* Calendar header red v3.20 (force) */
#cal thead th{
  background:#c00000 !important;
  color:#ffffff !important;
  border-bottom:1px solid rgba(255,255,255,.22) !important;
}
#cal thead th.daySep{
  border-left:1px solid rgba(255,255,255,.30) !important;
}
#cal thead th:first-child{
  background:#c00000 !important;
  color:#ffffff !important;
}

/* Center calendar header labels */
#cal thead th{ text-align:center !important; }
#cal thead th:first-child{ text-align:center !important; }

/* Hide modal footer on Files tab */
.modal.onFiles .modalFoot{display:none;}

/* Simple table */
.table thead th{
  text-align:left;
  font-weight:900;
  font-size:12px;
  padding:12px 10px;
  border-bottom:1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.65);
  position:sticky;
  top:0;
  z-index:1;
}
.table tbody td{
  padding:10px 10px;
  border-bottom:1px solid rgba(0,0,0,.06);
  font-size:12px;
}

/* Hide close X on Files tab */
.modal.onFiles #btnCloseModal{display:none;}

/* Tech header cell */
.techHead{
  width: 220px;
  min-width: 220px;
  border-right: 1px solid rgba(0,0,0,.08);
}
.techName{ font-weight: 900; }
.techSede{font-size:9px; opacity:.85; margin-top:2px; line-height:1.1;}

/* Location accent (if classes are used elsewhere) */
.techHead.loc-torino{ background: rgba(30, 120, 255, .18) !important; }
.techHead.loc-roma{ background: rgba(150, 80, 255, .18) !important; }

#cal thead th .small{color:#fff !important; opacity:.92;}

#dipHead{
  background:#c00000;
  border-radius:16px;
  padding:16px 16px;
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
#dipHead .input{
  background:rgba(255,255,255,.15);
  border-color:rgba(255,255,255,.28);
  color:#fff;
}
#dipHead .input::placeholder{color:rgba(255,255,255,.75);}
#page_dipendenti .table thead th{
  background:#c00000 !important;
  color:#fff !important;
  border-bottom:1px solid rgba(255,255,255,.18) !important;
}

/* Overlap chooser */
.ovlBackdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.35);
  z-index:200; display:none; align-items:center; justify-content:center; padding:16px;
}
.ovlCard{
  width:min(720px, 96vw);
  background:rgba(255,255,255,.96);
  border:1px solid rgba(0,0,0,.10);
  border-radius:18px;
  box-shadow:0 26px 70px rgba(0,0,0,.28);
  overflow:hidden;
}
.ovlHead{
  background:#c00000;
  color:#fff;
  padding:14px 16px;
  font-weight:900;
  display:flex; align-items:center; justify-content:space-between;
}
.ovlBody{padding:14px 16px;}
.ovlList{display:grid; gap:10px; margin-top:10px;}
.ovlItem{
  border:1px solid rgba(0,0,0,.10);
  border-radius:14px;
  padding:10px 12px;
  background:rgba(0,0,0,.02);
  display:flex; gap:10px; align-items:flex-start;
}
.ovlTag{font-size:11px; font-weight:900; padding:4px 8px; border-radius:999px; border:1px solid rgba(0,0,0,.10);}
.ovlMain{flex:1; min-width:0;}
.ovlMain .t1{font-weight:900; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.ovlMain .t2{font-weight:800; font-size:12px; opacity:.85; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.ovlFoot{display:flex; gap:10px; justify-content:flex-end; padding:12px 16px; border-top:1px solid rgba(0,0,0,.08); background:rgba(255,255,255,.70);}

#cal thead th{color:#fff !important;}

#btnSidebar{
  width:40px; height:40px; border-radius:14px;
  font-weight:900;
  border:1px solid rgba(192,0,0,.25);
  background:rgba(255,255,255,.85);
  color:#c00000;
}
#btnSidebar:hover{ background:rgba(255,255,255,.95); }

/* Mobile refinements */
@media (max-width: 900px){
  .calCard{padding:0;}
  .calWrap{overflow-x:auto; -webkit-overflow-scrolling:touch; border-radius:18px;}
  .calendar{min-width:860px;}
  .calendar th, .calendar td{padding:8px 6px;}
  .techHead{min-width:160px;}
  .techName{font-size:12px;}
  .techSede{font-size:8px;}
  .calEvent{padding:6px 7px; border-radius:12px;}
  .calEvent .sub{font-size:10px;}
  /* Modal full screen-ish */
  #modal .modalCard{width: min(980px, 96vw); max-height: 92vh; overflow:auto;}
  #modal .modalBody{padding:12px;}
  #modal .tabs{position:sticky; top:0; background:rgba(255,255,255,.92); z-index:2;}
  /* Make buttons easier to tap */
  .btn{min-height:40px;}
}

#cal thead th, #cal thead th *{color:#fff !important;}

/* Fix half-day alignment */
.calEvent{overflow:hidden;}
.calEvent .sub{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:10px;}
.calEvent .tClient{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-weight:900;}
.calEvent:not(.half){grid-column: 1 / span 2;}
.calEvent.half{max-width:none; flex:none; min-height:44px;}
.calEvent.half.slot-morning{grid-column:1;}
.calEvent.half.slot-afternoon{grid-column:2;}
.slot-morning,.slot-afternoon{margin:0 !important;}

.sidebarOverlay{
  display:none;
}
@media (max-width: 900px){
  .adminLayout{grid-template-columns: 1fr !important;}
  .sidebar{
    position:fixed;
    left:0;
    /* topbar admin (con topbar_fix.css) è alta 92px: allineo per evitare overlay/click issues su mobile */
    top:92px;
    width:min(280px, 86vw);
    height:calc(100vh - 92px);
    z-index:120;
    transform:translateX(-110%);
    transition:transform .22s ease;
    box-shadow: 22px 0 70px rgba(0,0,0,.22);
  }
  body.sidebar-open .sidebar{transform:translateX(0);}
  .sidebarOverlay{
    position:fixed;
    inset:92px 0 0 0;
    background:rgba(0,0,0,.25);
    z-index:110;
    display:none;
  }
  body.sidebar-open .sidebarOverlay{display:block;}
  body.sidebar-hidden .sidebar{display:block;} /* sidebar-hidden not used on mobile */
}

/* Planning grid: slightly thicker lines for readability */
.calendar{border-collapse:separate !important; border-spacing:0 !important;}
.calendar th, .calendar td{
  border-right:2px solid rgba(0,0,0,.10) !important;
  border-bottom:2px solid rgba(0,0,0,.10) !important;
}
.calendar thead th{
  border-bottom:2px solid rgba(255,255,255,.22) !important; /* inside red header */
}
.calendar tr > *:first-child{
  border-left:2px solid rgba(0,0,0,.10) !important;
}
.calendar thead tr:first-child > *{
  border-top:2px solid rgba(0,0,0,.10) !important;
}

#rapHead{
  background:#c00000;
  border-radius:16px;
  padding:16px 16px;
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
#page_rapportini .table thead th{
  background:#c00000 !important;
  color:#fff !important;
  border-bottom:1px solid rgba(255,255,255,.18) !important;
}
#rapModalBg.show{display:block;}

/* Updated brand logo size */
.brandLogo img, header .brand img, header img.logo {
  height: 80px !important;
  width: auto !important;
}

/* v3.34 - bigger logo */
header .brand img, header img.logo, .brandLogo img{
  height: 120px !important;
  width: auto !important;
}

/* v3.38 - bigger header logo for readability (Enterprise Suite) */
header{
  min-height: 150px;
}
header .brand img, header img.logo, .brandLogo img{
  height: 150px !important;
  width: auto !important;
}
@media (max-width: 900px){
  header{min-height: 120px;}
  header .brand img, header img.logo, .brandLogo img{ height: 120px !important; }
}

/* v3.39 - Rapportini filters readability on red header */
#rapHead .input{
  background: rgba(255,255,255,.96) !important;
  border-color: rgba(0,0,0,.15) !important;
  color: #111 !important;
}
#rapHead .input::placeholder{ color: rgba(0,0,0,.55) !important; }
#rapHead select.input option{
  color: #111;
  background: #fff;
}


/* Rendicontazione refresh */
.rcHead{display:flex; justify-content:space-between; gap:14px; align-items:flex-end; flex-wrap:wrap;}
.rcFilters{display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end;}
.rcFilters .fItem{min-width:220px}
.rcGrid{display:grid; grid-template-columns: 1fr; gap:14px; margin-top:14px;}
.rcBox{min-width:0}
.rcTableWrap{max-height:520px; overflow:auto; border-radius:12px;}
.rcTableWrap table{min-width:720px}
.rcRow{cursor:pointer}
.rcRow:hover{background:rgba(0,0,0,0.03)}
.rcDetailCard{min-height:520px; overflow:auto}

/* Rendicontazione - estetica Essedi */
.rcPanel{
  position: relative;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 10px 26px rgba(0,0,0,.06);
}
.rcPanel:before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height:4px;
  background: rgba(200,16,46,.92);
  border-top-left-radius: 14px;
  border-top-right-radius: 14px;
}
.rcKpis{
  display:grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap:12px;
  margin-top:12px;
}
@media (max-width: 980px){
  .rcKpis{ grid-template-columns: repeat(2, minmax(140px, 1fr)); }
}
.rcKpiCard{
  background: rgba(255,255,255,.92);
  border:1px solid rgba(0,0,0,.08);
  border-radius:16px;
  padding:12px 12px 10px;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
  backdrop-filter: blur(4px);
}
.rcKpiTop{display:flex; align-items:center; justify-content:space-between; gap:10px;}
.rcKpiLabel{font-size:12px; font-weight:800; letter-spacing:.2px; color:rgba(0,0,0,.55);}
.rcKpiVal{font-size:22px; font-weight:900; letter-spacing:.2px; margin-top:2px;}
.rcKpiIcon{
  width:32px; height:32px;
  border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(200,16,46,.10);
  border:1px solid rgba(200,16,46,.16);
  color: rgb(200,16,46);
  font-weight:900;
}
.rcHint{
  margin-top:10px;
  padding:10px 12px;
  border-radius:14px;
  background: rgba(0,0,0,.03);
  border: 1px dashed rgba(0,0,0,.10);
}
.rcClient{font-weight:900;}
.rcSub{font-size:12px; color:rgba(0,0,0,.55); margin-top:2px;}
.rcCommLink{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:12px;
  border:1px solid rgba(200,16,46,.20);
  background: rgba(200,16,46,.05);
  color: #111;
  font-weight:900;
}
.rcCommLink .chev{color:rgb(200,16,46); font-weight:900;}
.rcTableWrap thead th{
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 2;
  box-shadow: 0 1px 0 rgba(0,0,0,.08);
}

/* Dettaglio popup */
.rcDetailGrid{display:grid; grid-template-columns: 1.55fr 1fr; gap:14px; margin-top:14px;}
@media (max-width: 980px){
  .rcDetailGrid{grid-template-columns:1fr;}
}
.rcCard{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:16px;
  padding:12px;
}
.rcCard .subTitle{margin-top:0}
.rcRepItem{
  padding:10px 0;
  border-bottom:1px solid rgba(0,0,0,.08);
}
.rcRepItem:last-child{border-bottom:none;}
.rcRepMeta{font-size:12px; color:rgba(0,0,0,.55); margin-top:2px;}


/* Rendicontazione - estetica Essedi */
.rcPanel{background:linear-gradient(180deg, rgba(200,16,46,.06), rgba(255,255,255,0) 220px); border:1px solid rgba(200,16,46,.10);}
.rcKpis{display:grid; grid-template-columns:repeat(4, minmax(160px, 1fr)); gap:12px; margin-top:12px;}
 (max-width: 980px){.rcKpis{grid-template-columns:repeat(2, minmax(140px,1fr));}}
.rcKpiCard{background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:16px; padding:12px 12px 10px; box-shadow:0 10px 24px rgba(0,0,0,.06);}
.rcKpiTop{display:flex; align-items:center; justify-content:space-between; gap:10px;}
.rcKpiLabel{font-size:12px; font-weight:800; color:#444;}
.rcKpiVal{font-size:20px; font-weight:900; letter-spacing:.2px;}
.rcKpiHint{margin-top:4px; font-size:12px; color:rgba(0,0,0,.55);}
.rcClient{font-weight:800;}
.rcSub{font-size:12px; color:rgba(0,0,0,.55); margin-top:2px;}
.rcCommLink{color:rgb(200,16,46); font-weight:900; text-decoration:none;}
.rcCommLink:hover{text-decoration:underline;}
.rcTableWrap thead th{position:sticky; top:0; z-index:2; background:#fff;}
.rcRow td{transition:background .12s ease;}
.rcRow td:first-child{white-space:nowrap;}
.rcRow td:first-child .rcCommLink{display:inline-flex; align-items:center; gap:8px;}
.rcRow td:first-child .rcChevron{opacity:.55; font-weight:900;}

.rcDetailCompact .subTitle{margin-top:10px;}
.rcDetailGrid{display:grid; grid-template-columns: 1.6fr 1fr; gap:12px; margin-top:12px;}
 (max-width: 980px){.rcDetailGrid{grid-template-columns:1fr;}}
.rcSideAction{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:10px;}
.rcMiniBtn{border:1px solid rgba(200,16,46,.35); background:#fff; color:rgb(200,16,46); border-radius:12px; padding:8px 10px; font-weight:900; cursor:pointer;}
.rcMiniBtn.primary{background:rgb(200,16,46); color:#fff; border-color:rgb(200,16,46);}
.rcRepItem{padding:10px 0; border-bottom:1px solid rgba(0,0,0,.08);}
.rcRepItem:last-child{border-bottom:none;}
.rcRepTop{display:flex; align-items:center; justify-content:space-between; gap:10px;}
.rcRepClient{font-weight:900;}
.rcRepMeta{font-size:12px; color:rgba(0,0,0,.55); margin-top:3px;}

@media (max-width: 980px){
  .rcGrid{grid-template-columns:1fr;}
  .rcTableWrap{max-height:360px;}
  .rcDetailCard{min-height:320px}
  .rcFilters .fItem{min-width: 180px}
}


/* Rendicontazione - stato moderno */
.statusPill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  font-weight:800;
  font-size:12px;
  letter-spacing:.2px;
  border:1px solid rgba(0,0,0,.08);
  background:#fff;
}
.statusDot{
  width:9px;height:9px;border-radius:50%;
  box-shadow:0 0 0 3px rgba(0,0,0,.04) inset;
}
.status-ok{ background:rgba(0,170,80,.10); color:#0b5a2b; border-color:rgba(0,170,80,.18); }
.status-ok .statusDot{ background:rgb(0,170,80); }

.status-warn{ background:rgba(255,170,0,.12); color:#7a4a00; border-color:rgba(255,170,0,.22); }
.status-warn .statusDot{ background:rgb(255,170,0); }

/* Essedi red for alert */
.status-alert{ background:rgba(200,16,46,.12); color:#7a0016; border-color:rgba(200,16,46,.22); }
.status-alert .statusDot{ background:rgb(200,16,46); }

/* Rendicontazione - miglior hover e selezione */
.rcRow:hover td{ background:rgba(200,16,46,.03); }
.rcRow.isActive td{ background:rgba(200,16,46,.06); }

/* % progress */
.pctCell{display:flex; align-items:center; gap:10px; justify-content:flex-end; min-width:120px}
.pctText{font-weight:800; font-size:12px; color:#333; min-width:52px; text-align:right}
.pctTrack{height:8px; width:120px; background:rgba(0,0,0,.08); border-radius:999px; overflow:hidden}
.pctFill{height:100%; border-radius:999px}
.pct-ok{background:rgb(0,170,80)}
.pct-warn{background:rgb(255,170,0)}
.pct-alert{background:rgb(200,16,46)} /* Essedi red */
/* modal */
.modalOverlay{position:fixed; inset:0; background:rgba(0,0,0,.45); display:flex; align-items:center; justify-content:center; padding:18px; z-index:9999;}
.modalOverlay .modalCard{width:min(1120px, 97vw); max-height:92vh; background:#fff; border-radius:18px; box-shadow:0 20px 60px rgba(0,0,0,.25); overflow:hidden; border:1px solid rgba(0,0,0,.08);}
.modalOverlay .modalHead{display:flex; align-items:center; justify-content:space-between; padding:14px 16px; background:linear-gradient(90deg, rgba(200,16,46,.10), rgba(255,255,255,1)); border-bottom:1px solid rgba(0,0,0,.08);}
.modalOverlay .modalTitle{font-weight:900; letter-spacing:.2px}
.modalOverlay .modalClose{border:1px solid rgba(200,16,46,.35); background:#fff; color:rgb(200,16,46); border-radius:10px; padding:6px 10px; font-weight:900; cursor:pointer}
.modalOverlay .modalBody{padding:16px; overflow:auto; max-height:calc(92vh - 60px);}


/* === Mobile density (Admin) === */
@media (max-width: 430px){
  body{font-size:14px;}
  /* Planning calendar: smaller headers/cells so activities are readable */
  .calWrap{overflow:auto; -webkit-overflow-scrolling:touch;}
  .calendar thead th{padding:6px !important; font-size:11px !important;}
  .calendar tbody th{padding:6px !important; font-size:11px !important; width:180px !important;}
  .calendar td{padding:4px !important; height:60px !important; min-height:60px !important;}
  .calEvent{margin:4px !important; padding:5px 6px !important; font-size:10px !important; border-radius:10px;}
  .calEvent .sub{font-size:9px !important;}
  /* Generic tables */
  th{font-size:11px;}
  td{font-size:12px;}
  /* keep form controls at 16px to avoid iOS zoom */
  input, select, textarea{font-size:16px;}
}
/* === /Mobile density (Admin) === */

/* Footer */
.esFooter{
  position:fixed;
  left:0; right:0; bottom:0;
  padding:10px 0;
  text-align:center;
  font-size:12px;
  font-weight:800;
  color: rgba(0,0,0,.62);
  background: rgba(255,255,255,.82);
  border-top:1px solid rgba(0,0,0,.08);
  backdrop-filter: blur(6px);
  z-index: 50;
}



/* v1.4.20 - Spese / Cartellino / Rendicontazione: stacco filtri + header tabella rosso */
#speseHead, #cartHead{
  background:#c00000;
  border-radius:16px;
  padding:14px 14px;
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:20px;
  border:1px solid rgba(255,255,255,.14);
  box-shadow: 0 12px 26px rgba(0,0,0,.14);
}

#speseHead .input, #cartHead .input{
  background: rgba(255,255,255,.96) !important;
  border-color: rgba(0,0,0,.15) !important;
  color: #111 !important;
}
#speseHead .input::placeholder, #cartHead .input::placeholder{
  color: rgba(0,0,0,.55) !important;
}
#speseHead select.input option, #cartHead select.input option{
  color:#111;
  background:#fff;
}

#page_spese .table thead th,
#page_cartellino .table thead th{
  background:#c00000 !important;
  color:#fff !important;
  border-bottom:1px solid rgba(255,255,255,.18) !important;
}

#page_spese .table thead th:first-child{border-top-left-radius:12px;}
#page_spese .table thead th:last-child{border-top-right-radius:12px;}
#page_cartellino .table thead th:first-child{border-top-left-radius:12px;}
#page_cartellino .table thead th:last-child{border-top-right-radius:12px;}

/* Rendicontazione */
.rcHead{
  background:#c00000;
  border-radius:16px;
  padding:16px 16px;
  margin-bottom:22px;
  color:#fff;
  border:1px solid rgba(255,255,255,.14);
  box-shadow: 0 12px 26px rgba(0,0,0,.14);
}
.rcHead .hTitle{color:#fff;}
.rcHead .helper{color:rgba(255,255,255,.82);}
.rcHead .label{color:rgba(255,255,255,.82);}
.rcHead .input{
  background: rgba(255,255,255,.96) !important;
  border-color: rgba(0,0,0,.15) !important;
  color:#111 !important;
}
.rcHead .input::placeholder{ color: rgba(0,0,0,.55) !important; }

.rcTableWrap thead th{
  background:#c00000 !important;
  color:#fff !important;
  border-bottom:1px solid rgba(255,255,255,.18) !important;
  box-shadow:none !important;
}


/* v1.4.21 - table head rounding */
#page_spese .table thead th:first-child,
#page_cartellino .table thead th:first-child,
.rcTableWrap thead th:first-child{ border-top-left-radius:12px; }
#page_spese .table thead th:last-child,
#page_cartellino .table thead th:last-child,
.rcTableWrap thead th:last-child{ border-top-right-radius:12px; }

/* v1.4.23 - Setting > Richieste dipendenti: filtri staccati e più "Essedi" */
#reqHead{
  background:#c00000;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.14);
  box-shadow: 0 12px 26px rgba(0,0,0,.14);
}
#reqHead .small,
#reqHead label.small{
  color:rgba(255,255,255,.84) !important;
}
#reqHead .pill{
  background:rgba(255,255,255,.16) !important;
  border:1px solid rgba(255,255,255,.22) !important;
  color:#fff !important;
}
#reqHead .pill *{color:#fff !important;}
#reqHead .input{
  background: rgba(255,255,255,.96) !important;
  border-color: rgba(0,0,0,.15) !important;
  color:#111 !important;
}
#reqHead .input::placeholder{ color: rgba(0,0,0,.55) !important; }
#reqHead select.input option{ color:#111; background:#fff; }

/* ===== UI PULITA (no note/spiegazioni) ===== */
.helper,
.hint,
.demo,
.demoNote,
.note,
.smallHint,
.subHint{
  display:none !important;
}


/* ===== FIX LEGGIBILITÀ: Calendario Furgoni ===== */
#vanCalendarWrap .table{
  background: rgba(255,255,255,.92);
}
#vanCalendarWrap .table tbody td{
  background: rgba(255,255,255,.92);
  color: #111;
}
#vanCalendarWrap .table tbody tr:nth-child(even) td{
  background: rgba(255,255,255,.86);
}
#vanCalendarWrap .table tbody td:first-child{
  font-weight: 900;
  color: #111;
}