:root{
  --bg:#f1f5f9;--surface:#fbfcfe;--surface2:#f4f7fb;--surface3:#edf2f7;
  --text:#10233d;--muted:#6f8095;--border:#d2deea;--border-strong:#b9c9da;
  --sidebar:#0b1f33;--sidebar2:#0a1827;--accent:#1769e0;--accent2:#0d5ccc;
  --shadow:0 10px 30px rgba(16,35,61,.07);--shadow-soft:0 4px 14px rgba(16,35,61,.05);
  --presence:#2fb86e;--vacation:#f5c542;--rol:#8b5cf6;--smart:#4f9df7;--sick:#ef6464;
  --nonwork:#aab5c4;--holiday:#e09f22;--business:#16a4aa;--other:#6f7f90;--danger:#d84b4b;
}
[data-theme="dark"]{
  --bg:#091724;--surface:#0f2234;--surface2:#142b40;--surface3:#182f44;
  --text:#eaf2fb;--muted:#9fb0c2;--border:#2d4861;--border-strong:#3e5f7b;
  --sidebar:#071522;--sidebar2:#06111c;--accent:#1976f3;--accent2:#3b8cff;
  --shadow:0 14px 34px rgba(0,0,0,.20);--shadow-soft:0 5px 16px rgba(0,0,0,.16);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}
body{font-size:14px;letter-spacing:.002em}
button,input,textarea,select{font:inherit}.hidden{display:none!important}.muted{color:var(--muted)}.small{font-size:12px}.label-help{font-size:11px;color:var(--muted);font-weight:500}

/* Login */
.login-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background-image:linear-gradient(180deg,rgba(3,13,24,.16),rgba(3,13,24,.30)),url("/tnn-presenze-login-bg.png");background-size:cover;background-position:center center;background-repeat:no-repeat;background-attachment:fixed}
.login-card{width:min(430px,100%);background:rgba(248,251,255,.62);border:1px solid rgba(255,255,255,.42);border-radius:24px;padding:34px;box-shadow:0 28px 80px rgba(3,13,24,.30),inset 0 1px 0 rgba(255,255,255,.16);-webkit-backdrop-filter:blur(18px) saturate(130%);backdrop-filter:blur(18px) saturate(130%)}
[data-theme="dark"] .login-card{background:linear-gradient(145deg,rgba(7,22,35,.48),rgba(8,25,40,.38));border-color:rgba(120,182,239,.36);box-shadow:0 30px 90px rgba(0,0,0,.38),0 0 0 1px rgba(31,123,255,.06),inset 0 1px 0 rgba(255,255,255,.08)}
[data-theme="light"] .login-card{background:linear-gradient(145deg,rgba(255,255,255,.66),rgba(245,250,255,.56));border-color:rgba(255,255,255,.72);box-shadow:0 28px 80px rgba(16,35,61,.22),inset 0 1px 0 rgba(255,255,255,.60)}
.login-card input{background:rgba(16,42,65,.52);border-color:rgba(125,176,220,.36);box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}
[data-theme="light"] .login-card input{background:rgba(255,255,255,.62);border-color:rgba(92,140,188,.30)}
.login-card input:focus{background:rgba(18,48,74,.64);border-color:rgba(65,151,255,.80);box-shadow:0 0 0 3px rgba(25,118,243,.18),inset 0 1px 0 rgba(255,255,255,.05)}
[data-theme="light"] .login-card input:focus{background:rgba(255,255,255,.80)}
.login-card .btn.primary{box-shadow:0 10px 26px rgba(25,118,243,.30)}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:18px;white-space:nowrap}.brand-large{font-size:24px;margin-bottom:12px}
.brand-logo{width:38px;height:38px;object-fit:contain;border-radius:10px;flex:0 0 auto;box-shadow:0 5px 14px rgba(0,0,0,.18)}.brand-logo-login{width:58px;height:58px;border-radius:14px}.brand-large{align-items:center}
label{display:block;margin:18px 0 8px;font-weight:650}
input,textarea,select{width:100%;margin-top:7px;padding:12px 13px;border:1px solid var(--border);border-radius:10px;background:var(--surface2);color:var(--text);outline:none;transition:.15s border-color,.15s box-shadow,.15s background}
input:focus,textarea:focus,select:focus{border-color:var(--accent);background:var(--surface);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent)}
.btn{border:0;border-radius:10px;padding:11px 16px;font-weight:750;cursor:pointer;transition:.15s transform,.15s background,.15s border-color,.15s box-shadow}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.primary{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 90%,#fff),var(--accent));color:#fff;box-shadow:0 7px 15px color-mix(in srgb,var(--accent) 22%,transparent)}.btn.primary:hover:not(:disabled){background:var(--accent2)}
.btn.secondary{background:var(--surface);color:var(--text);border:1px solid var(--border)}.btn.secondary:hover:not(:disabled){border-color:var(--border-strong);background:var(--surface2)}.btn.full{width:100%;margin-top:22px}.small-btn{padding:7px 11px;font-size:12px}.error{color:#d74444;margin-top:12px;min-height:20px;font-size:14px}

/* Shell */
.app-shell{min-height:100vh;display:grid;grid-template-columns:238px minmax(0,1fr)}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:238px;background:linear-gradient(180deg,var(--sidebar),var(--sidebar2));color:#e8f2ff;padding:20px 16px 16px;display:flex;flex-direction:column;z-index:30;border-right:1px solid rgba(255,255,255,.04)}
.sidebar>.brand{height:42px;padding:0 7px}
.profile{display:flex;gap:11px;align-items:center;padding:20px 8px 18px;margin-top:4px;border-bottom:1px solid rgba(255,255,255,.075)}.profile strong{font-size:13px}.profile small{display:block;color:#92a9bf;margin-top:3px;font-size:11px}
.avatar,.mini-avatar{border-radius:50%;background:linear-gradient(145deg,#315e89,#1c3d5f);display:grid;place-items:center;color:#fff;font-weight:750}.avatar{width:38px;height:38px;font-size:12px}.mini-avatar{width:34px;height:34px;font-size:11px}
.sidebar nav{display:grid;gap:5px;margin-top:18px}.nav-item{display:flex;gap:12px;align-items:center;text-align:left;padding:10px 11px;border-radius:8px;border:0;background:transparent;color:#d7e5f2;cursor:pointer;font-size:13px;transition:.14s background,.14s color,.14s transform}.nav-item:hover{background:rgba(255,255,255,.055);color:#fff}.nav-item.active{background:linear-gradient(90deg,#1558a4,#1c64b9);color:white;box-shadow:0 7px 16px rgba(0,0,0,.13)}
.nav-icon{width:20px;height:20px;display:grid;place-items:center;text-align:center;font-size:13px;color:#bdd3e8}.nav-item.active .nav-icon{color:white}.logout{margin-top:6px}.sidebar-version{margin-top:auto;padding:12px 10px 6px;color:#6f8aa4;font-size:10px}.sidebar-backdrop{display:none}
.main{grid-column:2;min-width:0}.topbar{height:64px;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--surface) 96%,transparent);display:flex;justify-content:space-between;align-items:center;padding:0 28px;position:sticky;top:0;z-index:20;backdrop-filter:blur(12px)}
.top-actions{display:flex;align-items:center;gap:12px;font-size:13px}.icon-btn{width:38px;height:38px;border-radius:9px;border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:20px;cursor:pointer;display:grid;place-items:center;transition:.15s}.icon-btn:hover{background:var(--surface2);border-color:var(--border-strong)}
.view{display:none;padding:28px 30px 34px;max-width:1660px;margin:0 auto}.active-view{display:block}
.page-title-row{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:18px}.page-title-row h1{margin:0;font-size:27px;letter-spacing:-.02em}.page-title-row p{margin:6px 0 0;font-size:13px}

/* Calendar */
.calendar-toolbar{display:flex;justify-content:center;align-items:center;gap:14px;margin:6px 0 16px}.calendar-toolbar h2{min-width:220px;text-align:center;margin:0;font-size:20px;letter-spacing:-.01em}.calendar-toolbar .icon-btn{width:36px;height:36px;font-size:20px}
.calendar-layout{display:grid;grid-template-columns:minmax(0,1fr) 302px;gap:18px;align-items:start}
.calendar-card,.editor-card,.panel,.kpi{background:var(--surface);border:1px solid var(--border);border-radius:13px;box-shadow:var(--shadow-soft)}.calendar-card{padding:14px;border-color:var(--border-strong);box-shadow:0 10px 28px rgba(16,35,61,.08);background:#f7f9fc}
[data-theme="dark"] .calendar-card{border-color:var(--border);box-shadow:0 12px 30px rgba(0,0,0,.18);background:var(--surface)}
.weekday-row,.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px}.weekday-row span{text-align:center;font-size:11px;font-weight:750;color:var(--muted);padding:7px 0 8px;text-transform:none}
.day{position:relative;min-height:90px;border:1px solid var(--border-strong);border-radius:10px;padding:9px;background:linear-gradient(180deg,#ffffff,#f8fbff);color:var(--text);cursor:pointer;transition:.16s transform,.16s border-color,.16s box-shadow,.16s background;text-align:left;overflow:hidden;box-shadow:0 2px 7px rgba(16,35,61,.055)}
.day:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 60%,var(--border-strong));box-shadow:0 8px 18px rgba(16,35,61,.11);background:linear-gradient(180deg,#ffffff,color-mix(in srgb,#f5f9ff 90%,var(--accent)))}
.day.blank{opacity:0;pointer-events:none;box-shadow:none}.day.selected{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent);background:color-mix(in srgb,#ffffff 94%,var(--accent));box-shadow:0 8px 20px color-mix(in srgb,var(--accent) 16%,transparent)}.day.today{border-color:color-mix(in srgb,var(--accent) 48%,var(--border-strong));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 22%,transparent),0 3px 10px rgba(16,35,61,.07)}.day.today .day-number{display:inline-grid;place-items:center;min-width:25px;height:25px;padding:0 6px;border-radius:999px;background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent)}.day.today.selected{outline-width:2px}
.day.nonworking-day{opacity:1;background:linear-gradient(180deg,#f1f4f8,#e9eef4);border-color:#c8d2dd}.day.nonworking-day .day-number{color:#526477}
[data-theme="dark"] .day{background:linear-gradient(180deg,#162e44,#12283b);border-color:#35516b;box-shadow:inset 0 1px 0 rgba(255,255,255,.02),0 3px 8px rgba(0,0,0,.13)}
[data-theme="dark"] .day:hover{background:linear-gradient(180deg,#19354e,#142d43);border-color:color-mix(in srgb,var(--accent) 55%,#35516b);box-shadow:0 8px 18px rgba(0,0,0,.22)}
[data-theme="dark"] .day.selected{background:color-mix(in srgb,#142b40 90%,var(--accent));border-color:var(--accent)}
[data-theme="dark"] .day.nonworking-day{background:linear-gradient(180deg,#172839,#142332);border-color:#30475d}.day.nonworking-day .status-chip.non_working{background:#b7c1ce;color:#273646}.day-number{font-weight:800;font-size:13px;line-height:1}.status-chip{display:block;margin-top:10px;padding:6px 6px;border-radius:5px;font-size:10px;font-weight:800;color:#fff;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-chip em{font-style:normal;opacity:.9}.status-chip.presence{background:color-mix(in srgb,var(--presence) 84%,#000)}.status-chip.vacation{background:color-mix(in srgb,var(--vacation) 86%,#9a6f00);color:#4d3a00}.status-chip.rol{background:var(--rol)}.status-chip.smart_working{background:var(--smart)}.status-chip.sick{background:var(--sick)}.status-chip.business_trip{background:var(--business)}.status-chip.other{background:var(--other)}.status-chip.non_working{background:var(--nonwork);color:#2b3a4b}.holiday-name{font-size:9px;color:var(--muted);margin-top:5px;line-height:1.15}.mobile-status{display:none}
.legend{display:flex;flex-wrap:wrap;gap:13px;padding:12px 5px 2px;font-size:10px;color:var(--muted)}.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px;vertical-align:-1px}.dot.presence{background:var(--presence)}.dot.vacation{background:var(--vacation)}.dot.rol{background:var(--rol)}.dot.smart_working{background:var(--smart)}.dot.sick{background:var(--sick)}.dot.business_trip{background:var(--business)}.dot.other{background:var(--other)}.dot.non_working{background:var(--nonwork)}
.editor-card{padding:17px 16px;height:max-content;position:sticky;top:82px}.editor-head{display:flex;align-items:center;justify-content:space-between}.editor-head h3{margin:0 0 11px;font-size:16px}.editor-card>.muted{font-size:12px;line-height:1.5}
.radio-list{display:grid;gap:4px;margin:10px 0 14px}.radio-line{display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:7px;border:1px solid transparent;cursor:pointer;margin:0;font-weight:600;font-size:12px;transition:.12s}.radio-line:hover{background:var(--surface2)}.radio-line:has(input:checked){background:color-mix(in srgb,var(--vacation) 13%,var(--surface2));border-color:color-mix(in srgb,var(--vacation) 36%,var(--border))}.radio-line input{width:auto;margin:0;accent-color:var(--accent)}.radio-line span{display:flex;align-items:center}.editor-card label:not(.radio-line){font-size:12px}.editor-actions{display:flex;gap:10px;margin-top:15px}.editor-actions .btn{width:100%}.nonworking-box{padding:13px;border-radius:9px;background:var(--surface2);font-size:12px}.nonworking-box p{line-height:1.5}

/* KPI + panels */
.kpi-grid{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:12px;margin-bottom:16px}.kpi{padding:16px 17px;min-height:94px;position:relative}.kpi strong{display:block;font-size:27px;margin-top:5px;letter-spacing:-.025em}.kpi .muted{font-size:12px}.kpi-icon{float:right}.panel{padding:17px;margin-top:16px}.panel h3{margin-top:0;font-size:16px}.panel-heading{display:flex;justify-content:space-between;align-items:flex-start}.table-wrap{overflow:auto;border-radius:9px}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:11px 10px;border-bottom:1px solid var(--border);font-size:13px}th{color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.045em;font-weight:750;background:color-mix(in srgb,var(--surface2) 55%,transparent)}tbody tr:hover{background:color-mix(in srgb,var(--surface2) 68%,transparent)}.status-text{display:inline-flex;align-items:center;gap:7px}.settings-panel{margin:0}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.status-ok{color:var(--presence);font-weight:800}.mobile-only{display:none}

/* Users */
.users-toolbar{max-width:430px;margin-bottom:14px}.users-toolbar input{margin:0}.user-cell{display:flex;align-items:center;gap:10px}.user-cell small{display:block;color:var(--muted);margin-top:3px;font-size:10px}.role-badge,.active-badge{display:inline-block;padding:5px 9px;border-radius:999px;font-size:10px;font-weight:800}.role-badge.admin{background:color-mix(in srgb,var(--rol) 17%,transparent);color:var(--rol)}.role-badge.user{background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent)}.active-badge.yes{background:color-mix(in srgb,var(--presence) 16%,transparent);color:var(--presence)}.active-badge.no{background:color-mix(in srgb,var(--danger) 14%,transparent);color:var(--danger)}.disabled-row{opacity:.62}.actions-cell{text-align:right}.empty-cell{text-align:center;padding:28px}

/* Modal */
.modal{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:18px}.modal-backdrop{position:absolute;inset:0;background:rgba(2,10,18,.64);backdrop-filter:blur(3px)}.modal-card{position:relative;width:min(620px,100%);max-height:92vh;overflow:auto;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;box-shadow:0 30px 70px rgba(0,0,0,.35)}.modal-head{display:flex;justify-content:space-between;align-items:center}.modal-head h3{margin:0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.check-line{display:flex;align-items:center;gap:9px}.check-line input{width:auto;margin:0}.reset-box hr{border:0;border-top:1px solid var(--border);margin:20px 0}.inline-form{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end}.inline-form input{margin:0}.toast{position:fixed;right:20px;bottom:20px;z-index:100;padding:12px 16px;border-radius:10px;background:#12324d;color:#fff;box-shadow:var(--shadow);font-weight:700}.toast.error{background:#a83232}

/* Responsive */
@media(max-width:1180px){.calendar-layout{grid-template-columns:minmax(0,1fr) 280px}.kpi-grid{grid-template-columns:repeat(3,1fr)}.settings-grid{grid-template-columns:1fr}}
@media(max-width:1020px){.calendar-layout{grid-template-columns:1fr}.editor-card{position:static}.app-shell{grid-template-columns:1fr}.main{grid-column:1}.sidebar{transform:translateX(-105%);transition:.2s}.sidebar.open{transform:translateX(0)}.sidebar-backdrop.open{display:block;position:fixed;inset:0;background:rgba(0,0,0,.48);z-index:25}.mobile-only{display:grid}.topbar{padding:0 16px}.view{padding:20px}}
@media(max-width:720px){body{font-size:13px}.topbar{height:56px}.page-title-row{align-items:stretch;flex-direction:column;margin-bottom:13px}.page-title-row h1{font-size:22px}.page-title-row p{font-size:12px}.page-title-row .btn{align-self:flex-start}.kpi-grid{grid-template-columns:1fr 1fr}.view{padding:14px 12px 24px}.calendar-card{padding:7px}.calendar-layout{gap:11px}.top-actions #topUser{display:none}.login-card{padding:24px}.calendar-toolbar{margin:3px 0 11px}.calendar-toolbar h2{min-width:150px;font-size:18px}.weekday-row,.calendar-grid{gap:4px}.weekday-row span{font-size:9px;padding:5px 0}.day{min-height:62px;padding:5px;border-radius:7px}.day-number{font-size:11px}.desktop-status{display:none}.mobile-status{display:inline}.status-chip{margin-top:6px;padding:4px 2px;font-size:8px}.holiday-name{display:none}.legend{gap:7px;font-size:9px;padding:9px 2px 2px}.form-grid{grid-template-columns:1fr}.modal{padding:8px}.modal-card{padding:16px}.inline-form{grid-template-columns:1fr}.user-panel{padding:10px}table{min-width:680px}.toast{left:14px;right:14px;bottom:14px;text-align:center}.editor-card{padding:15px}.editor-card label:not(.radio-line){font-size:12px}}
@media(max-width:430px){.day{min-height:58px}.calendar-card{border-radius:10px}.kpi-grid{grid-template-columns:1fr}.legend{display:grid;grid-template-columns:1fr 1fr}.calendar-toolbar{gap:8px}.calendar-toolbar .icon-btn{width:34px;height:34px}.page-title-row{margin-bottom:10px}.sidebar{width:82vw;max-width:270px}}


/* 0.3.0 monthly workflow */
.auto-approved{display:inline-flex;align-items:center;padding:7px 10px;border-radius:999px;background:color-mix(in srgb,var(--presence) 14%,transparent);color:var(--presence);font-size:11px;font-weight:800;white-space:nowrap}
.summary-detail{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr));gap:12px;margin-top:8px}.summary-detail>div{padding:14px;border:1px solid var(--border);border-radius:10px;background:var(--surface2)}.summary-detail span{display:block;color:var(--muted);font-size:11px}.summary-detail strong{display:block;font-size:20px;margin-top:5px}
@media(max-width:720px){.summary-detail{grid-template-columns:1fr 1fr}.auto-approved{white-space:normal}.panel-heading{gap:10px;flex-direction:column}}

/* v0.3.1 - Festivi distinti e giorni di riposo modificabili */
.day.holiday-day{background:linear-gradient(180deg,#fff9eb,#fff3d7);border-color:#e8c675}
.day.holiday-day .day-number{color:#8a6414}
[data-theme="dark"] .day.holiday-day{background:linear-gradient(180deg,#2a261b,#221f18);border-color:#6e5828}
[data-theme="dark"] .day.holiday-day .day-number{color:#f0c45a}
.status-chip.holiday{background:var(--holiday);color:#3d2b00}
.dot.holiday{background:var(--holiday)}
.day-info{display:grid;gap:4px;padding:11px 12px;border-radius:9px;margin-bottom:10px;font-size:12px}
.day-info span{color:var(--muted);line-height:1.35}.holiday-info{background:color-mix(in srgb,var(--holiday) 14%,var(--surface));border:1px solid color-mix(in srgb,var(--holiday) 42%,var(--border))}.rest-info{background:var(--surface2);border:1px solid var(--border)}
.editor-actions{flex-wrap:wrap}.editor-actions .btn{flex:1 1 150px}


/* v0.3.2 - ore e straordinari */
:root{--overtime:#8b5cf6}
.dot.overtime{background:var(--overtime)}
.overtime-chip{display:block;margin-top:4px;padding:4px 5px;border-radius:5px;background:color-mix(in srgb,var(--overtime) 18%,var(--surface));border:1px solid color-mix(in srgb,var(--overtime) 45%,var(--border));color:color-mix(in srgb,var(--overtime) 80%,var(--text));font-size:9px;font-weight:850;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.overtime-field{margin-top:10px;padding:10px;border:1px solid color-mix(in srgb,var(--overtime) 35%,var(--border));border-radius:9px;background:color-mix(in srgb,var(--overtime) 7%,var(--surface2))}
.overtime-label{display:flex;align-items:center;font-weight:800;margin-bottom:2px}.overtime-field input{margin-bottom:0}
.report-actions{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}.report-actions label{margin:0;min-width:220px;font-size:11px;color:var(--muted)}.report-actions select{margin:4px 0 0;min-width:220px}
@media(max-width:720px){.report-actions{width:100%;align-items:stretch}.report-actions label,.report-actions select,.report-actions .btn{width:100%;min-width:0}.overtime-chip{font-size:7px;padding:3px 2px}}


/* v0.3.3 - mobile stability + rest-day overtime */
html{width:100%;max-width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{width:100%;max-width:100%;overflow-x:hidden}
.app-shell,.main,.view,.calendar-layout,.calendar-card,.editor-card,.panel,.kpi-grid,.summary-detail,.settings-grid{min-width:0;max-width:100%}
.calendar-card,.editor-card,.panel{width:100%}
.weekday-row,.calendar-grid{width:100%;min-width:0}
.day{min-width:0;width:100%;max-width:100%}
.status-chip,.overtime-chip{max-width:100%;min-width:0}
.table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
img,svg{max-width:100%}

@media(max-width:1020px){
  .app-shell{display:block;width:100%;overflow-x:hidden}
  .main{width:100%;max-width:100%;overflow-x:hidden}
  .topbar{width:100%;max-width:100%}
  .view{width:100%;margin:0;overflow-x:hidden}
}
@media(max-width:720px){
  input,select,textarea{font-size:16px!important;max-width:100%;min-width:0}
  .calendar-card{width:100%;overflow:hidden}
  .calendar-toolbar{width:100%;max-width:100%;justify-content:center;flex-wrap:nowrap}
  .calendar-toolbar h2{min-width:0;flex:1 1 auto;font-size:17px;white-space:nowrap}
  .calendar-toolbar .icon-btn{flex:0 0 36px}
  .weekday-row,.calendar-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
  .day{padding:4px 3px;min-height:58px;overflow:hidden}
  .status-chip{display:block;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .overtime-chip{width:100%;font-size:7px;line-height:1.1;white-space:normal;overflow-wrap:anywhere}
  .page-title-row,.panel-heading,.report-actions,.editor-actions{max-width:100%}
}
@media(max-width:380px){
  .view{padding-left:8px;padding-right:8px}
  .calendar-card{padding:5px}
  .weekday-row,.calendar-grid{gap:2px}
  .day{padding:3px 2px;min-height:55px}
  .day-number{font-size:10px}
  .status-chip{font-size:7px;padding:3px 1px}
}

/* v0.3.3 report layout refresh */
.report-filter-panel{margin-top:0}.report-filter-grid{display:grid;grid-template-columns:minmax(180px,1.2fr) minmax(160px,.8fr) minmax(180px,1fr) minmax(220px,1.2fr);gap:12px;align-items:end}.report-filter-grid label{margin:0}.report-check{min-height:46px;padding:0 4px}.report-filter-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:14px}.html-report-preview{display:grid;gap:20px;margin-top:18px}.report-sheet{background:#fff;color:#10233d;border:1px solid #d6e0ea;border-radius:13px;padding:10px;box-shadow:0 10px 28px rgba(16,35,61,.10);overflow:hidden}.report-sheet-head{display:flex;justify-content:space-between;align-items:center;gap:20px;background:linear-gradient(90deg,#0b2b4a,#0a355d);color:#fff;border-radius:8px;padding:15px 18px}.report-brand{font-size:24px;font-weight:850;letter-spacing:-.025em}.report-subtitle{font-size:10px;font-weight:700;opacity:.9;margin-top:3px}.report-period{text-align:right;display:grid;gap:3px}.report-period strong{font-size:22px}.report-period span{font-size:10px;opacity:.9}.report-top-row{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(0,2.1fr);gap:8px;margin-top:8px}.report-employee{background:#f7f9fc;border:1px solid #d9e2eb;border-radius:8px;padding:13px 15px;display:grid;grid-template-columns:1fr 1fr;gap:7px 18px}.report-employee>span{grid-column:1/-1;font-size:9px;color:#6f8095;font-weight:800}.report-employee h2{grid-column:1/-1;margin:0;font-size:25px;letter-spacing:-.025em}.report-employee div{display:grid;gap:2px}.report-employee small{color:#6f8095;font-size:8px}.report-employee strong{font-size:10px}.report-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.report-metric{min-width:0;background:#f5f8fb;border:1px solid #dbe4ed;border-radius:8px;padding:10px 7px;text-align:center;display:flex;flex-direction:column;justify-content:center}.report-metric strong{font-size:22px;line-height:1.05}.report-metric span{font-size:8px;font-weight:800;margin-top:5px}.report-metric small{font-size:7px;color:#6f8095;margin-top:2px}.report-metric.blue{background:#edf5ff}.report-metric.green{background:#edf9f2}.report-metric.purple{background:#f4efff}.report-metric.yellow{background:#fff7dc}.report-tables{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}.report-day-table{width:100%;table-layout:fixed;border-collapse:collapse}.report-day-table th{background:#12304a;color:#fff;font-size:7px;text-transform:none;letter-spacing:0;padding:5px 4px;border:1px solid #244866}.report-day-table td{font-size:7px;padding:4px 4px;border:1px solid #d9e1e9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.report-day-table th:nth-child(1){width:9%}.report-day-table th:nth-child(2){width:9%}.report-day-table th:nth-child(3){width:17%}.report-day-table th:nth-child(4),.report-day-table th:nth-child(5),.report-day-table th:nth-child(6),.report-day-table th:nth-child(7){width:9%}.report-day-table th:nth-child(8){width:20%}.report-day-table tbody tr:nth-child(even){background:#f9fbfd}.report-status-cell{font-weight:800;text-align:center}.report-status-cell.presence{background:#dff5e8}.report-status-cell.vacation{background:#fff2bf}.report-status-cell.rol{background:#eee5ff}.report-status-cell.smart_working{background:#deedff}.report-status-cell.sick{background:#ffe2e2}.report-status-cell.business_trip{background:#dff4f3}.report-status-cell.holiday{background:#fff0cf}.report-status-cell.non_working{background:#e9eef4}.report-note{color:#50647a}.report-sheet-footer{display:grid;grid-template-columns:minmax(0,1fr) 185px;gap:8px;margin-top:8px}.report-summary-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;background:#f6f9fc;border:1px solid #d9e2eb;border-radius:8px;padding:7px}.report-summary-strip .report-metric{padding:6px 4px;border:0;background:#fff}.report-summary-strip .report-metric strong{font-size:15px}.report-summary-strip .report-metric span{font-size:6.7px}.report-total{background:#eaf4ff;border:1px solid #c8ddf3;border-radius:8px;padding:9px 12px;display:flex;flex-direction:column;justify-content:center}.report-total span{font-size:7px;color:#1769e0;font-weight:850}.report-total strong{font-size:25px;line-height:1.05;margin-top:4px}.report-total small{font-size:7px;color:#6f8095;margin-top:3px}.report-footnote{font-size:7px;color:#6f8095;margin:6px 2px 0}
@media(max-width:1100px){.report-filter-grid{grid-template-columns:1fr 1fr}.report-top-row{grid-template-columns:1fr}.report-sheet{overflow-x:auto}.report-sheet>*{min-width:900px}}
@media(max-width:720px){.report-filter-grid{grid-template-columns:1fr}.report-filter-actions .btn{width:100%}.html-report-preview{overflow-x:auto;-webkit-overflow-scrolling:touch}.report-sheet{min-width:920px}.report-sheet>*{min-width:0}}
@media print{
  body{background:#fff!important}.sidebar,.topbar,.page-title-row,.report-filter-panel,#calendarView,#summaryView,#adminView,#usersView,#settingsView,.toast{display:none!important}.app-shell,.main,.view{display:block!important;width:auto!important;max-width:none!important;padding:0!important;margin:0!important}.view:not(#reportsView){display:none!important}#reportsView{display:block!important}.html-report-preview{display:block!important;margin:0!important}.report-sheet{box-shadow:none!important;border:0!important;border-radius:0!important;page-break-after:always;padding:0!important;margin:0!important}.report-sheet:last-child{page-break-after:auto}.report-filter-panel{display:none!important}@page{size:A4 landscape;margin:7mm}
}
/* v0.3.4 report selector + cache-safe report v2 */
.report-filter-grid-v2{grid-template-columns:repeat(5,minmax(150px,1fr));align-items:end}
.report-filter-grid-v2 label{min-width:0}
.report-filter-grid-v2 input,.report-filter-grid-v2 select{width:100%;max-width:100%}
#reportModeHint{margin-top:10px}
.report-filter-actions button:disabled,.report-filter-grid select:disabled,.report-filter-grid input:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:1100px){.report-filter-grid-v2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.report-filter-grid-v2{grid-template-columns:1fr}.report-filter-actions{display:grid;grid-template-columns:1fr}.report-filter-actions .btn{width:100%}}
/* v0.3.5 multi-month report controls */
.report-filter-grid-v3{grid-template-columns:repeat(4,minmax(170px,1fr));align-items:end}
.report-filter-grid-v3 label{min-width:0}.report-filter-grid-v3 input,.report-filter-grid-v3 select{width:100%;max-width:100%}
@media(max-width:900px){.report-filter-grid-v3{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.report-filter-grid-v3{grid-template-columns:1fr}}

/* v0.4.0 - Account security / 2FA */
.security-callout,.security-alert{display:flex;flex-direction:column;gap:5px;padding:13px 14px;border-radius:10px;background:color-mix(in srgb,var(--accent) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 32%,var(--border));margin-bottom:14px}.security-callout span,.security-alert span{font-size:12px;color:var(--muted)}.security-alert{margin:0 0 16px}.account-info{display:grid;gap:12px}.account-info>div{display:flex;justify-content:space-between;gap:18px;border-bottom:1px solid var(--border);padding-bottom:10px}.account-info>div:last-child{border-bottom:0;padding-bottom:0}.account-info span{color:var(--muted);font-size:12px}.twofa-setup{display:grid;grid-template-columns:180px minmax(0,1fr);gap:20px;align-items:start}.twofa-setup img{display:block;width:180px;max-width:100%;border-radius:12px;border:8px solid #fff;background:#fff}.twofa-setup details{margin:10px 0}.twofa-setup code{display:block;word-break:break-all;margin-top:8px;padding:8px;border-radius:6px;background:var(--surface2);font-size:11px}.danger-outline{border-color:#cc5a5a!important;color:#c74646!important;background:transparent!important}.danger-outline:hover{background:rgba(199,70,70,.08)!important}#reset2faBtn{margin-top:12px}.settings-panel .table-wrap{max-height:320px}.settings-panel table{min-width:620px}
@media(max-width:720px){.twofa-setup{grid-template-columns:1fr}.twofa-setup img{width:165px;margin-inline:auto}.account-info>div{align-items:flex-start;flex-direction:column;gap:3px}.security-callout{padding:12px}.settings-panel table{min-width:600px}}
.security-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:10px;align-items:end;margin-top:12px}.security-form label{margin:0}.security-form input{margin-top:6px}.security-form .btn{margin-bottom:1px}@media(max-width:720px){.security-form{grid-template-columns:1fr}.security-form .btn{width:100%}}


/* v0.4.2 - mobile/PWA stability hardening */
html,body{min-width:0;overscroll-behavior-x:none}
body{position:relative}
button,input,select,textarea{max-width:100%}
.topbar,.top-actions,.brand,.profile,.calendar-toolbar,.page-title-row{min-width:0}
.topbar .brand{overflow:hidden;text-overflow:ellipsis}
.modal-card,.login-card{max-width:calc(100vw - 16px)}
@supports(padding:max(0px)){
  @media(max-width:1020px){
    .topbar{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
    .view{padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right))}
  }
}
@media(max-width:720px){
  .app-shell,.main,.view{inline-size:100%;max-inline-size:100%;min-inline-size:0}
  .page-title-row>*{min-width:0;max-width:100%}
  .calendar-toolbar h2{overflow:hidden;text-overflow:ellipsis}
  .editor-card,.panel,.calendar-card{contain:layout style}
  .modal-card{max-height:calc(100% - 16px)}
}

/* 0.5.0 administrative settings */
.weekday-field{border:1px solid var(--border);border-radius:10px;padding:12px;margin:12px 0 16px}.weekday-field legend{font-size:11px;color:var(--muted);padding:0 6px}.weekday-checks{display:flex;flex-wrap:wrap;gap:8px}.weekday-checks label{display:flex;align-items:center;gap:5px;padding:7px 9px;border:1px solid var(--border);border-radius:8px;background:var(--surface2);font-size:11px;font-weight:700;margin:0}.weekday-checks input{width:auto;margin:0}.custom-day-form{display:grid;grid-template-columns:145px minmax(0,1fr) 160px auto;gap:8px;align-items:end}.custom-day-form input,.custom-day-form select{margin:0}.custom-days-list{display:grid;gap:7px;margin-top:14px}.custom-day-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 10px;border:1px solid var(--border);border-radius:9px;background:var(--surface2)}.custom-day-row div{display:flex;flex-direction:column;gap:2px}.custom-day-row span{font-size:10px;color:var(--muted)}.cert-details{white-space:pre-wrap;word-break:break-word;max-height:180px;overflow:auto;background:var(--surface2);border:1px solid var(--border);border-radius:9px;padding:10px;font-size:10px;line-height:1.45}.settings-panel code{font-size:10px}
@media(max-width:720px){.custom-day-form{grid-template-columns:1fr}.weekday-checks{display:grid;grid-template-columns:repeat(4,1fr)}.weekday-checks label{justify-content:center}.custom-day-row{align-items:flex-start}.custom-day-row .btn{flex:0 0 auto}}

/* 0.6.0 report archive */
.archive-panel{margin-top:18px}.archive-actions{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin-bottom:14px}.archive-actions label{margin:0;min-width:210px}.archive-row-actions{display:flex;gap:6px;flex-wrap:wrap}.automation-options{display:grid;gap:8px;margin:12px 0}.automation-options .check-line{margin:0;padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface2)}@media(max-width:600px){.archive-actions{display:grid;grid-template-columns:1fr}.archive-actions label,.archive-actions .btn{width:100%;min-width:0}}

/* 0.6.1 SMTP settings */
.smtp-actions{display:flex;gap:8px;margin-top:12px}.smtp-test-box{margin-top:16px;padding-top:14px;border-top:1px solid var(--border)}.smtp-test-box h4{margin:0 0 10px}.smtp-test-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end}.smtp-test-row label{margin:0}.smtp-test-row input{margin-bottom:0}@media(max-width:600px){.smtp-test-row{grid-template-columns:1fr}.smtp-test-row .btn{width:100%}}

/* 0.6.2 brand/today/light refinements */
[data-theme="light"] .login-card{background:linear-gradient(145deg,rgba(255,255,255,.66),rgba(245,250,255,.56))}
[data-theme="light"] .day{background:linear-gradient(180deg,#fcfdff,#f6f9fc)}
[data-theme="dark"] .day.today{border-color:color-mix(in srgb,var(--accent) 65%,var(--border));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 20%,transparent),0 5px 14px rgba(0,0,0,.18)}

/* 0.6.3 profilo orario individuale */
.schedule-box{margin:16px 0;padding:14px;border:1px solid var(--border);border-radius:12px;background:var(--surface2)}
.schedule-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.schedule-head p{margin:4px 0 0}.schedule-grid{margin-top:12px;display:grid;gap:7px}.schedule-row{display:grid;grid-template-columns:minmax(110px,1fr) 130px 110px;gap:12px;align-items:center;padding:8px 10px;background:var(--surface);border:1px solid var(--border);border-radius:9px}.schedule-row>span{font-weight:700}.schedule-row label{margin:0}.schedule-row input[type=number]{margin:0}.schedule-row .check-line{font-size:12px}
@media(max-width:720px){.schedule-head{flex-direction:column}.schedule-row{grid-template-columns:1fr 1fr}.schedule-row>span{grid-column:1/-1}.schedule-row label:last-child{min-width:0}}

/* v0.6.4 - conferma mensile */
.calendar-title-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.user-confirm-btn:disabled{opacity:.78;cursor:default}.confirmation-locked{border-color:var(--presence)}
@media(max-width:720px){.calendar-title-actions{width:100%;justify-content:flex-start}.calendar-title-actions .btn{flex:1 1 150px}}

/* v1.1.0 ferie/ROL e dashboard */
.leave-balance-grid{display:grid;grid-template-columns:repeat(4,minmax(140px,1fr));gap:12px;margin:4px 0 16px}.leave-kpi{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:14px 16px}.leave-kpi span,.leave-kpi small{display:block;color:var(--muted);font-size:12px}.leave-kpi strong{display:block;font-size:23px;margin:5px 0}.dashboard-charts{display:grid;grid-template-columns:1fr 1fr;gap:16px}.dashboard-charts .panel{margin-top:0}.bar-chart{display:grid;gap:12px}.bar-row{display:grid;grid-template-columns:105px 1fr 60px;align-items:center;gap:10px;font-size:12px}.bar-row>div{height:9px;background:var(--surface2);border-radius:999px;overflow:hidden}.bar-row i{display:block;height:100%;background:var(--accent);border-radius:999px}.bar-row strong{text-align:right}.user-only.hidden{display:none!important}
@media(max-width:900px){.leave-balance-grid{grid-template-columns:1fr 1fr}.dashboard-charts{grid-template-columns:1fr}}
@media(max-width:430px){.leave-balance-grid{grid-template-columns:1fr}}

/* Login background patch r1 */
@media(max-width:720px){.login-shell{padding:16px;background-attachment:scroll;background-position:42% center}.login-card{padding:24px;background:rgba(248,251,255,.62)}[data-theme="dark"] .login-card{background:linear-gradient(145deg,rgba(7,22,35,.54),rgba(8,25,40,.44))}}

/* TNN Presenze login r5: desktop login card high, tablet/phone remain centered */
@media (min-width: 1200px) and (hover: hover) and (pointer: fine) {
  .login-shell {
    align-items: start;
    justify-items: center;
    padding-top: clamp(24px, 3vh, 42px);
    padding-bottom: 24px;
  }

  .login-card {
    margin-top: 0;
  }
}

/* TNN Presenze login r11
   Tre artwork dello stesso sfondo approvato, pre-croppati per rapporto.
   Nessuna deformazione, nessuna banda, nessun blur o duplicazione. */
@media (min-width: 769px) {
  .login-shell {
    background-color: #071827 !important;
    background-image: url('/tnn-presenze-login-bg.png?v=loginbg11') !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
  }
}

/* Desktop molto largo / monitor 4K full-screen */
@media (min-width: 1200px) and (min-aspect-ratio: 17/10) {
  .login-shell {
    background-image: url('/tnn-presenze-login-bg-wide.png?v=loginbg11') !important;
  }
}

/* Desktop stretto / finestra sdoppiata */
@media (min-width: 900px) and (max-aspect-ratio: 7/5) {
  .login-shell {
    background-image: url('/tnn-presenze-login-bg-narrow.png?v=loginbg11') !important;
  }
}

/* Tablet touch: continua a usare l'artwork originale. */
@media (min-width: 769px) and (pointer: coarse) {
  .login-shell {
    background-image: url('/tnn-presenze-login-bg.png?v=loginbg11') !important;
  }
}

