:root{--red:#e02020;--red-dark:#bd1616;--ink:#111;--paper:#f5f4f0;--white:#fff;--line:#deddd8;--muted:#6d6d68;--sidebar:#111;--green:#1f8b52;--amber:#a66b00}
*{box-sizing:border-box}html{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;background:var(--paper);color:var(--ink)}body{margin:0}.app-body{min-height:100vh}.app-shell{min-height:100vh;display:grid;grid-template-columns:260px minmax(0,1fr)}.sidebar{position:sticky;top:0;height:100vh;background:var(--sidebar);color:#fff;padding:30px 22px;display:flex;flex-direction:column;z-index:30}.app-brand{display:block;padding:5px 8px 30px;border-bottom:1px solid rgba(255,255,255,.12)}.app-brand img{width:180px;max-width:100%}.app-nav{display:grid;gap:7px;padding:28px 0}.app-nav a{color:rgba(255,255,255,.72);text-decoration:none;padding:12px 13px;border-left:3px solid transparent;font-weight:650;font-size:14px}.app-nav a:hover,.app-nav a.active{background:rgba(255,255,255,.07);color:#fff;border-left-color:var(--red)}.sidebar-user{margin-top:auto;padding:18px 10px 0;border-top:1px solid rgba(255,255,255,.12);display:grid;gap:13px}.sidebar-user strong,.sidebar-user small{display:block}.sidebar-user small{color:rgba(255,255,255,.5);font-size:12px;margin-top:3px}.sidebar-user a{color:#fff;font-size:13px;text-decoration:none}.app-main{min-width:0}.app-topbar{height:82px;background:rgba(245,244,240,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:16px;padding:0 clamp(20px,4vw,48px);position:sticky;top:0;z-index:20}.app-topbar>div{display:grid}.topbar-label{font-size:10px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);font-weight:800}.app-topbar strong{font-size:18px}.back-site{margin-left:auto;color:var(--ink);font-size:13px;font-weight:750;text-decoration:none}.sidebar-toggle{display:none;border:1px solid var(--line);background:#fff;width:42px;height:42px;font-size:19px}.app-content{padding:clamp(24px,4vw,48px);max-width:1500px;margin:0 auto}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:30px}.page-head h1{font-size:clamp(32px,4vw,52px);letter-spacing:-.04em;line-height:1;margin:0 0 8px}.page-head p{margin:0;color:var(--muted);max-width:700px}.btn{border:1px solid var(--red);background:var(--red);color:#fff;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 17px;font-weight:750;font-size:13px;cursor:pointer}.btn:hover{background:var(--red-dark);border-color:var(--red-dark)}.btn.secondary{background:#fff;color:var(--ink);border-color:var(--line)}.btn.dark{background:var(--ink);border-color:var(--ink)}.btn.danger{background:#fff;color:var(--red);border-color:#efb7b7}.btn.small{min-height:36px;padding:0 12px;font-size:12px}.actions{display:flex;gap:10px;flex-wrap:wrap}.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-bottom:28px}.kpi{background:#fff;border:1px solid var(--line);padding:22px;min-height:145px;display:flex;flex-direction:column;justify-content:space-between}.kpi small{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.1em;font-weight:800}.kpi strong{font-size:clamp(30px,3vw,44px);letter-spacing:-.04em;line-height:1}.kpi span{font-size:12px;color:var(--muted)}.grid-2{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:18px}.panel{background:#fff;border:1px solid var(--line);padding:24px;min-width:0}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.panel h2{font-size:22px;margin:0;letter-spacing:-.03em}.panel h3{margin:0}.muted{color:var(--muted)}.small-text{font-size:12px}.table-wrap{overflow:auto;border:1px solid var(--line);background:#fff}.data-table{border-collapse:collapse;width:100%;min-width:720px}.data-table th,.data-table td{text-align:left;padding:14px 15px;border-bottom:1px solid var(--line);vertical-align:middle}.data-table th{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:850;background:#fafafa}.data-table tbody tr:last-child td,.data-table tfoot tr:last-child td{border-bottom:0}.data-table strong{font-weight:760}.badge{display:inline-flex;align-items:center;min-height:25px;padding:0 9px;font-size:11px;font-weight:800;border-radius:20px;background:#efefec;color:#333}.badge.active{background:#e6f4ec;color:#16663d}.badge.completed{background:#ececec;color:#555}.badge.paused{background:#fff3da;color:#805300}.bar-list{display:grid;gap:16px}.bar-item{display:grid;grid-template-columns:minmax(90px,1fr) 3fr 68px;gap:12px;align-items:center;font-size:13px}.bar-track{height:10px;background:#ecebe7;overflow:hidden}.bar-fill{height:100%;background:var(--red);min-width:2px}.bar-value{text-align:right;font-weight:800}.week-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.week-nav strong{font-size:18px}.week-nav a{text-decoration:none}.hours-table{min-width:980px}.hours-table th{text-align:center}.hours-table th:first-child,.hours-table td:first-child{text-align:left;min-width:220px}.hours-table td{text-align:center}.hours-input{width:72px;min-height:42px;border:1px solid var(--line);padding:8px;text-align:center;font:inherit;background:#fff}.hours-input:focus,input:focus,select:focus,textarea:focus{outline:2px solid rgba(224,32,32,.18);border-color:var(--red)}.today-col{background:#fff8f8!important}.row-total{font-weight:850}.totals-row td{background:#fafafa;font-weight:850}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.field{display:grid;gap:7px}.field.full{grid-column:1/-1}.field label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:800;color:#444}.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);background:#fff;min-height:46px;padding:11px 12px;font:inherit;color:var(--ink)}.field textarea{min-height:110px;resize:vertical}.checkbox-list{display:grid;gap:10px}.check{display:flex;align-items:center;gap:10px;border:1px solid var(--line);padding:12px;background:#fff}.check input{width:18px;height:18px}.filters{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin-bottom:18px}.filters .field{min-width:180px;flex:1}.filters .btn{flex:0 0 auto}.alert{padding:14px 16px;margin-bottom:18px;border-left:4px solid}.alert-success{background:#e9f5ee;border-color:var(--green);color:#165d39}.alert-error{background:#fff0f0;border-color:var(--red);color:#8f1919}.alert-warning{background:#fff6df;border-color:#d49617;color:#715006}.empty{padding:36px;text-align:center;color:var(--muted);border:1px dashed #ccc;background:#fff}.login-body{min-height:100vh;background:#111;display:grid;grid-template-columns:1fr 1fr}.login-visual{position:relative;min-height:100vh;background:url('../../assets/images/hero.webp') center/cover}.login-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,10,.2),rgba(10,10,10,.78))}.login-panel{background:var(--paper);display:flex;align-items:center;justify-content:center;padding:40px}.login-card{width:min(100%,460px)}.login-logo{width:210px;margin-bottom:52px}.login-card h1{font-size:46px;line-height:1;letter-spacing:-.045em;margin:0 0 14px}.login-card>p{color:var(--muted);margin-bottom:28px}.login-card .field{margin-bottom:16px}.login-card .btn{width:100%;margin-top:5px}.login-help{font-size:12px;color:var(--muted);margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}.project-card-list{display:grid;gap:12px}.project-card{border:1px solid var(--line);padding:18px;display:flex;justify-content:space-between;gap:20px;align-items:center;background:#fff}.project-card h3{font-size:17px;margin:0 0 5px}.project-card p{margin:0;color:var(--muted);font-size:13px}.metric-inline{display:flex;gap:18px;flex-wrap:wrap}.metric-inline span{font-size:12px;color:var(--muted)}.metric-inline strong{color:var(--ink);font-size:14px}.danger-zone{border-color:#efb7b7}.footer-note{font-size:11px;color:var(--muted);margin-top:24px}
@media(max-width:1100px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}}
@media(max-width:820px){.app-shell{grid-template-columns:1fr}.sidebar{position:fixed;left:-280px;width:260px;transition:left .2s ease}.sidebar.open{left:0}.sidebar-toggle{display:block}.app-topbar{padding:0 18px}.app-content{padding:24px 18px}.page-head{align-items:flex-start;flex-direction:column}.kpi-grid{grid-template-columns:1fr 1fr}.login-body{grid-template-columns:1fr}.login-visual{display:none}.login-panel{min-height:100vh;padding:28px 20px}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}}
@media(max-width:520px){.kpi-grid{grid-template-columns:1fr}.back-site{display:none}.app-topbar strong{font-size:16px}.login-card h1{font-size:38px}.bar-item{grid-template-columns:90px 1fr 55px}}
.field-help{font-size:11px;color:var(--muted);line-height:1.45}.compact-check{max-width:560px}.text-danger{color:var(--red)!important}.project-finance-list{display:grid;gap:18px}.finance-row{display:grid;gap:8px}.finance-row-top,.finance-meta{display:flex;align-items:center;justify-content:space-between;gap:14px}.finance-row-top>span:first-child{display:grid;gap:2px}.finance-row-top small,.finance-meta{font-size:11px;color:var(--muted)}.finance-cost{font-weight:850;font-size:16px}.bar-subline{margin-top:-10px;font-size:11px;color:var(--muted)}.account-kpis{margin-bottom:18px}
@media(max-width:650px){.finance-row-top,.finance-meta{align-items:flex-start}.finance-meta{flex-direction:column;gap:3px}.bar-subline{padding-left:0}}
/* V3 - financial-first admin polish */
.finance-kpis .money-kpi{border-top:4px solid var(--red);padding-top:18px}.finance-kpis .money-kpi strong{font-size:clamp(32px,3.4vw,48px)}.finance-main-grid{grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr)}.finance-row-large{padding:2px 0 4px}.finance-progress{height:12px}.bar-over{background:#8f1919}.money-bars .bar-item{grid-template-columns:minmax(110px,1fr) 2fr minmax(105px,auto)}.money-bars .bar-value{min-width:105px}.quick-finance-list{display:grid;border:1px solid var(--line)}.quick-finance-list a{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--line);background:#fff}.quick-finance-list a:last-child{border-bottom:0}.quick-finance-list a:hover{background:#fafafa}.quick-finance-list span{display:grid;gap:4px}.quick-finance-list small{color:var(--muted);font-size:12px}.quick-finance-list b{font-size:20px;color:var(--red)}.finance-table{min-width:640px}.finance-table td:nth-child(3){font-size:15px}.app-nav a span{display:block}.account-kpis .money-kpi{border-top:4px solid var(--red)}
@media(max-width:1100px){.finance-main-grid{grid-template-columns:1fr}}
@media(max-width:650px){.money-bars .bar-item{grid-template-columns:100px 1fr 92px}.money-bars .bar-value{min-width:92px;font-size:12px}}

/* V4 - duidelijke kleurcodering, werknemerwaarde en project vooruitblik */
:root{
  --blue:#2563eb;--blue-soft:#eff6ff;
  --green-strong:#15803d;--green-soft:#ecfdf3;
  --red-soft:#fff1f2;
  --amber-strong:#b45309;--amber-soft:#fff7ed;
  --purple:#7c3aed;--purple-soft:#f5f3ff;
  --cyan:#0f766e;--cyan-soft:#f0fdfa;
}
.kpi{position:relative;overflow:hidden;border-radius:2px}
.kpi:after{content:"";position:absolute;right:-28px;top:-32px;width:95px;height:95px;border-radius:50%;opacity:.35;pointer-events:none}
.kpi.tone-blue{border-top:4px solid var(--blue);background:linear-gradient(145deg,#fff 55%,var(--blue-soft));padding-top:18px}.kpi.tone-blue:after{background:#bfdbfe}
.kpi.tone-red{border-top:4px solid var(--red);background:linear-gradient(145deg,#fff 55%,var(--red-soft));padding-top:18px}.kpi.tone-red:after{background:#fecdd3}
.kpi.tone-green{border-top:4px solid var(--green-strong);background:linear-gradient(145deg,#fff 55%,var(--green-soft));padding-top:18px}.kpi.tone-green:after{background:#bbf7d0}
.kpi.tone-amber{border-top:4px solid var(--amber-strong);background:linear-gradient(145deg,#fff 55%,var(--amber-soft));padding-top:18px}.kpi.tone-amber:after{background:#fed7aa}
.kpi.tone-purple{border-top:4px solid var(--purple);background:linear-gradient(145deg,#fff 55%,var(--purple-soft));padding-top:18px}.kpi.tone-purple:after{background:#ddd6fe}
.kpi.tone-blue strong,.money-blue{color:var(--blue)}.kpi.tone-red strong,.money-red{color:#c81e1e}.kpi.tone-green strong,.money-green{color:var(--green-strong)}.kpi.tone-amber strong,.money-amber{color:var(--amber-strong)}.kpi.tone-purple strong,.money-purple{color:var(--purple)}
.panel-accent{border-top-width:4px}.tone-blue-panel{border-top-color:var(--blue)}.tone-green-panel{border-top-color:var(--green-strong)}.tone-amber-panel{border-top-color:var(--amber-strong)}.tone-purple-panel{border-top-color:var(--purple)}
.app-nav .nav-forecast.active{border-left-color:var(--amber-strong);background:rgba(180,83,9,.17)}.app-nav .nav-accounts.active{border-left-color:var(--purple);background:rgba(124,58,237,.16)}.app-nav .nav-projects.active{border-left-color:var(--blue);background:rgba(37,99,235,.16)}
.eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.13em;font-weight:850;color:var(--muted)}
.row-actions{display:flex;gap:7px;white-space:nowrap}.project-money-table{min-width:1180px}
.employee-checkbox-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.employee-check{border-left:3px solid #dbeafe}.employee-check:has(input:checked){background:var(--blue-soft);border-color:#bfdbfe;border-left-color:var(--blue)}
.explain-strip{display:grid;grid-template-columns:minmax(180px,.3fr) minmax(0,1fr);gap:18px;align-items:center;padding:16px 18px;border:1px solid #d8d2fe;border-left:4px solid var(--purple);background:var(--purple-soft);margin-bottom:18px;font-size:13px}.explain-strip a{color:var(--purple);font-weight:750}
.employee-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.employee-card{background:#fff;border:1px solid var(--line);border-top:4px solid var(--purple);padding:22px;display:grid;gap:18px}.employee-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.employee-card-head h2{font-size:24px;margin:9px 0 4px;letter-spacing:-.03em}.employee-card-head p{margin:0;color:var(--muted);font-size:13px}.rate-pill{background:var(--blue-soft);border:1px solid #bfdbfe;padding:10px 12px;min-width:130px;text-align:right}.rate-pill small,.rate-pill strong{display:block}.rate-pill small{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#4b6ba9}.rate-pill strong{margin-top:3px;color:var(--blue)}
.employee-money-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.mini-metric{padding:13px;min-height:86px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid transparent}.mini-metric small{font-size:10px;text-transform:uppercase;letter-spacing:.07em;font-weight:800;color:var(--muted)}.mini-metric strong{font-size:18px;letter-spacing:-.02em}.tone-blue-soft{background:var(--blue-soft);border-color:#dbeafe}.tone-red-soft{background:var(--red-soft);border-color:#ffe4e6}.tone-green-soft{background:var(--green-soft);border-color:#d1fae5}.tone-purple-soft{background:var(--purple-soft);border-color:#ede9fe}.employee-card-meta{display:flex;justify-content:space-between;gap:12px;padding-top:13px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.employee-hero,.forecast-project-title{display:flex;align-items:center;justify-content:space-between;gap:24px}.employee-hero h2,.forecast-project-title h2{font-size:30px;margin:3px 0 5px}.employee-hero p,.forecast-project-title p{margin:0}.forecast-budget{text-align:right;background:var(--blue-soft);padding:14px 16px;border:1px solid #bfdbfe;min-width:200px}.forecast-budget small,.forecast-budget strong{display:block}.forecast-budget small{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#4b6ba9}.forecast-budget strong{font-size:25px;margin-top:5px;color:var(--blue)}
.forecast-layout{grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr)}.forecast-employee-list{display:grid;gap:10px}.forecast-employee-row{display:grid;grid-template-columns:minmax(180px,1fr) 145px 145px;gap:14px;align-items:end;padding:14px;border:1px solid var(--line);background:#fff}.forecast-person{display:grid;gap:4px;align-self:center}.forecast-person span{font-size:12px;color:var(--muted)}.compact-field label{font-size:10px}.forecast-row-cost{display:grid;gap:5px;text-align:right;align-self:center}.forecast-row-cost small{font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}.forecast-row-cost strong{font-size:16px;color:var(--red)}.one-col{grid-template-columns:1fr}.forecast-mini-summary{display:grid;gap:1px;margin-top:18px;border:1px solid #fde7c2}.forecast-mini-summary>div{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 14px;background:#fff}.forecast-mini-summary>div+div{border-top:1px solid #f5e7d2}.forecast-mini-summary small{color:var(--muted);font-size:11px}.forecast-mini-summary strong{color:var(--amber-strong)}
.forecast-decision{margin-top:18px;display:flex;align-items:center;justify-content:space-between;gap:28px}.forecast-decision h2{margin:4px 0 8px}.forecast-decision p{margin:0;max-width:800px}.forecast-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.forecast-card{background:#fff;border:1px solid var(--line);border-top:4px solid var(--amber-strong);padding:20px;display:grid;gap:18px}.forecast-card.healthy{border-top-color:var(--green-strong)}.forecast-card.not-planned{border-top-color:#9ca3af}.forecast-card-head{display:flex;justify-content:space-between;gap:18px}.forecast-card-head h2{font-size:22px;margin:10px 0 4px}.forecast-card-head p{margin:0;color:var(--muted);font-size:13px}.forecast-health{font-size:11px;font-weight:850;align-self:flex-start;padding:7px 10px;border-radius:30px;background:var(--amber-soft);color:var(--amber-strong)}.forecast-card.healthy .forecast-health{background:var(--green-soft);color:var(--green-strong)}.forecast-card.not-planned .forecast-health{background:#f3f4f6;color:#6b7280}.forecast-card-metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.forecast-card-metrics>div{background:#fafafa;border:1px solid #eee;padding:11px}.forecast-card-metrics small,.forecast-card-metrics strong{display:block}.forecast-card-metrics small{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.forecast-card-metrics strong{font-size:16px;margin-top:4px}.forecast-card-bottom{display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:12px;color:var(--muted);padding-top:12px;border-top:1px solid var(--line)}
.bar-fill.blue{background:var(--blue)}.bar-fill.green{background:var(--green-strong)}.bar-fill.amber{background:var(--amber-strong)}.bar-fill.purple{background:var(--purple)}
@media(max-width:1180px){.employee-card-grid,.forecast-card-grid{grid-template-columns:1fr}.employee-money-grid{grid-template-columns:repeat(2,1fr)}.forecast-layout{grid-template-columns:1fr}}
@media(max-width:760px){.employee-checkbox-grid{grid-template-columns:1fr}.employee-card-head,.employee-hero,.forecast-project-title,.forecast-decision{align-items:flex-start;flex-direction:column}.rate-pill,.forecast-budget{width:100%;text-align:left}.forecast-employee-row{grid-template-columns:1fr}.forecast-row-cost{text-align:left}.explain-strip{grid-template-columns:1fr}.employee-card-meta,.forecast-card-bottom{align-items:flex-start;flex-direction:column}}
@media(max-width:520px){.employee-money-grid,.forecast-card-metrics{grid-template-columns:1fr}}

.bar-fill.red{background:var(--red)}

/* V5 - dashboard split: geld en uren duidelijk apart, beide tegelijk zichtbaar */
html{scroll-behavior:smooth}
.dashboard-page-head{margin-bottom:16px}
.dashboard-split-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:22px}
.split-nav-card{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--line);background:#fff;color:var(--ink);text-decoration:none;transition:.15s ease;box-shadow:0 1px 0 rgba(0,0,0,.02)}
.split-nav-card:hover{transform:translateY(-1px);box-shadow:0 7px 20px rgba(0,0,0,.06)}
.split-nav-card>span:nth-child(2){display:grid;gap:3px;min-width:0}
.split-nav-card strong{font-size:17px}.split-nav-card small{font-size:12px;color:var(--muted)}.split-nav-card b{margin-left:auto;font-size:18px}
.split-nav-icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-size:17px;font-weight:900;flex:0 0 42px}
.money-nav-card{border-left:4px solid var(--green-strong);background:linear-gradient(90deg,var(--green-soft),#fff 34%)}
.money-nav-card .split-nav-icon{background:#dcfce7;color:var(--green-strong)}
.money-nav-card b{color:var(--green-strong)}
.hours-nav-card{border-left:4px solid var(--blue);background:linear-gradient(90deg,var(--blue-soft),#fff 34%)}
.hours-nav-card .split-nav-icon{background:#dbeafe;color:var(--blue)}
.hours-nav-card b{color:var(--blue)}
.dashboard-section{scroll-margin-top:20px;margin-top:18px;padding:20px;border:1px solid var(--line);background:#fbfbfa}
.dashboard-money-section{border-top:5px solid var(--green-strong);background:linear-gradient(180deg,#f7fff9 0,#fbfbfa 180px)}
.dashboard-hours-section{border-top:5px solid var(--blue);background:linear-gradient(180deg,#f7faff 0,#fbfbfa 180px);margin-top:28px}
.dashboard-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:18px;padding-bottom:15px;border-bottom:1px solid var(--line)}
.dashboard-section-head h2{font-size:28px;margin:4px 0 5px;letter-spacing:-.03em}.dashboard-section-head p{margin:0;color:var(--muted);font-size:13px}
.section-kicker{display:inline-flex;align-items:center;gap:7px;font-size:10px;font-weight:900;letter-spacing:.16em;padding:5px 8px;border-radius:2px}
.money-kicker{background:#dcfce7;color:var(--green-strong)}
.hours-kicker{background:#dbeafe;color:var(--blue)}
.section-link{font-size:12px;font-weight:800;color:var(--green-strong);text-decoration:none;white-space:nowrap}.hours-link{color:var(--blue)}
.section-grid-gap{margin-top:18px}
.hours-kpis .kpi{border-top:4px solid var(--blue);padding-top:18px}
.kpi.hours-tone-blue{background:linear-gradient(145deg,#fff 55%,#eff6ff);border-top-color:#2563eb}.kpi.hours-tone-blue strong{color:#2563eb}
.kpi.hours-tone-cyan{background:linear-gradient(145deg,#fff 55%,#ecfeff);border-top-color:#0891b2}.kpi.hours-tone-cyan strong{color:#0e7490}
.kpi.hours-tone-purple{background:linear-gradient(145deg,#fff 55%,#f5f3ff);border-top-color:#7c3aed}.kpi.hours-tone-purple strong{color:#7c3aed}
.kpi.hours-tone-slate{background:linear-gradient(145deg,#fff 55%,#f1f5f9);border-top-color:#475569}.kpi.hours-tone-slate strong{color:#334155}
.hours-main-grid{grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr)}
.hours-panel-blue{border-top-color:#2563eb}.hours-panel-cyan{border-top-color:#0891b2}.hours-panel-purple{border-top-color:#7c3aed}
.hours-project-list{display:grid;gap:14px}.hours-project-row{padding-bottom:14px;border-bottom:1px solid var(--line)}.hours-project-row:last-child{border-bottom:0;padding-bottom:0}
.hours-project-top{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:8px}.hours-project-top>span{display:grid;gap:3px}.hours-project-top small{font-size:11px;color:var(--muted)}
.hours-value{color:#2563eb}.hours-progress{height:10px}.bar-fill.cyan{background:#0891b2}
.hours-bars .bar-item{grid-template-columns:minmax(110px,1fr) 2fr minmax(90px,auto)}.hours-bars .bar-value{min-width:90px;color:#0e7490;font-weight:750}
.hours-table{min-width:680px}.hours-table td:nth-child(2){background:#f8fbff}.hours-table td:nth-child(4){background:#fbfffc}
.dashboard-recent-panel{margin-top:28px;border-top:4px solid #64748b}
.data-table .hours-col{background:#f5f9ff}.data-table .money-col{background:#f5fff7}.data-table th.hours-col{color:#1d4ed8}.data-table th.money-col{color:#15803d}
@media(max-width:1100px){.hours-main-grid{grid-template-columns:1fr}}
@media(max-width:760px){.dashboard-split-nav{grid-template-columns:1fr}.dashboard-section{padding:14px}.dashboard-section-head{align-items:flex-start;flex-direction:column}.dashboard-section-head h2{font-size:24px}.section-link{white-space:normal}.hours-project-top{align-items:flex-start;flex-direction:column}}

/* V6 werknemerportaal: tweeweekse urenperiodes */
.employee-dashboard-head{align-items:center}
.employee-period-panel{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);gap:24px;align-items:stretch;margin-bottom:18px;border-top:4px solid #2563eb;background:linear-gradient(105deg,#f7fbff 0%,#fff 60%)}
.employee-period-main{padding:4px 2px;display:flex;flex-direction:column;justify-content:center}
.period-kicker{display:block;font-size:10px;line-height:1.2;text-transform:uppercase;letter-spacing:.12em;font-weight:850;color:#2563eb;margin-bottom:9px}
.employee-period-main h2{font-size:clamp(34px,4vw,52px);line-height:1;letter-spacing:-.045em;margin:0 0 10px}
.employee-period-main p{margin:0;color:var(--muted);font-size:14px}
.employee-period-next{border-left:1px solid var(--line);padding:8px 0 8px 28px;display:flex;flex-direction:column;justify-content:center;gap:6px}
.employee-period-next span{font-size:10px;text-transform:uppercase;letter-spacing:.1em;font-weight:800;color:var(--muted)}
.employee-period-next strong{font-size:22px;letter-spacing:-.02em}
.employee-period-next small{font-size:12px;color:var(--muted)}
.employee-dashboard-grid{align-items:start}
.employee-project-card{justify-content:flex-start;min-height:82px}
.employee-project-card h3{margin-bottom:7px}
.recent-entry-card strong{white-space:nowrap}

.period-nav{display:grid;grid-template-columns:1fr auto 1fr;padding:18px 20px;align-items:center}
.period-nav-side{display:flex;justify-content:flex-start}
.period-nav-right{justify-content:flex-end}
.period-nav-title{text-align:center;display:grid;gap:3px}
.period-nav-title>span{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:800}
.period-nav-title strong{font-size:24px;letter-spacing:-.025em}
.period-nav-title small{font-size:12px;color:var(--muted)}
.hours-week-panel{margin-bottom:18px;padding:0;overflow:hidden}
.hours-week-head{padding:22px 24px 18px;margin:0;border-bottom:1px solid var(--line);background:#fbfcff}
.hours-week-head h2{font-size:25px;margin:0 0 5px}
.hours-week-panel .table-wrap{border:0}
.period-save-actions{justify-content:flex-end;margin-top:18px}

@media(max-width:820px){
  .employee-period-panel{grid-template-columns:1fr}
  .employee-period-next{border-left:0;border-top:1px solid var(--line);padding:18px 0 0}
  .period-nav{grid-template-columns:1fr;gap:14px;text-align:center}
  .period-nav-side,.period-nav-right{justify-content:center;order:2}
  .period-nav-title{order:1}
  .period-nav-right{order:3}
}

/* V6.1 - duidelijk weeknummer + totaal rechtsonder */
.week-total-cell{min-width:150px;text-align:right!important;background:#f4f7ff!important}
.week-total-cell .week-total-label{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:800;margin-bottom:4px}
.week-total-cell strong{font-size:18px;color:#1d4ed8;white-space:nowrap}
.hours-week-head .period-kicker{display:inline-flex;align-items:center;min-height:26px;padding:0 9px;background:#eaf0ff;color:#1d4ed8;font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;margin-bottom:7px}

/* V6.3 - Project vooruitblik als calculator voor een nieuw project */
.forecast-builder-head{align-items:center}
.forecast-builder-grid{display:grid;grid-template-columns:minmax(340px,.85fr) minmax(560px,1.35fr);gap:18px;align-items:start}
.forecast-builder-project,.forecast-builder-team{min-height:100%}
.forecast-builder-team-list{display:grid;gap:10px}
.forecast-builder-row{display:grid;grid-template-columns:minmax(230px,1fr) 130px 150px 145px;gap:14px;align-items:center;padding:14px;border:1px solid var(--line);background:#fff;transition:.15s ease}
.forecast-builder-row.selected{border-color:#c4b5fd;background:#faf8ff;box-shadow:inset 4px 0 0 var(--purple)}
.forecast-worker-main{display:flex;align-items:center;gap:12px;cursor:pointer;min-width:0}
.forecast-worker-main input{width:19px;height:19px;flex:0 0 19px}
.forecast-worker-main>span{display:grid;gap:3px;min-width:0}
.forecast-worker-main strong{font-size:15px}
.forecast-worker-main small{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.forecast-worker-rate,.forecast-worker-total{display:grid;gap:4px}
.forecast-worker-rate small,.forecast-worker-total small{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:800}
.forecast-worker-rate strong{font-size:14px;color:var(--purple)}
.forecast-worker-rate span{font-size:10px;color:var(--red);font-weight:750}
.forecast-worker-rate.rate-missing strong{color:var(--red)}
.forecast-hours-week-wrap input:disabled{background:#f4f4f1;color:#aaa;cursor:not-allowed}
.forecast-worker-total{text-align:right}
.forecast-worker-total strong{font-size:15px;color:var(--blue)}
.forecast-worker-total span{font-size:12px;color:var(--red);font-weight:750}
.forecast-price-layout{margin-top:18px;grid-template-columns:minmax(320px,.72fr) minmax(440px,1.28fr)}
.forecast-advice-lines{display:grid;gap:1px;border:1px solid #dcf0e3;background:#dcf0e3}
.forecast-advice-lines>div{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 14px;background:#fff}
.forecast-advice-lines span{font-size:12px;color:var(--muted)}
.forecast-advice-lines strong{font-size:16px}
.forecast-advice-lines .forecast-cost-total{background:#f6fff9;border-top:2px solid #b9e5c9;padding-top:15px;padding-bottom:15px}
.forecast-advice-lines .forecast-cost-total span{font-weight:850;color:var(--ink)}
.forecast-advice-lines .forecast-cost-total strong{font-size:22px;color:var(--ink)}
.forecast-advice-price{margin-top:14px;padding:18px;background:linear-gradient(135deg,#0f7a45,#1f9b5d);color:#fff;display:grid;gap:5px}
.forecast-advice-price>span{font-size:10px;text-transform:uppercase;letter-spacing:.12em;font-weight:850;opacity:.85}
.forecast-advice-price>strong{font-size:clamp(32px,4vw,48px);line-height:1;letter-spacing:-.045em}
.forecast-advice-price>small{font-size:12px;opacity:.88}
.forecast-create-panel{margin-top:18px;display:flex;align-items:center;justify-content:space-between;gap:30px;border-left:5px solid var(--green-strong)}
.forecast-create-panel h2{margin:5px 0 8px}.forecast-create-panel p{margin:0;max-width:820px}
.forecast-create-panel .btn:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:1220px){.forecast-builder-grid,.forecast-price-layout{grid-template-columns:1fr}.forecast-builder-row{grid-template-columns:minmax(220px,1fr) 120px 140px 130px}}
@media(max-width:820px){.forecast-builder-row{grid-template-columns:1fr 1fr}.forecast-worker-main{grid-column:1/-1}.forecast-worker-total{text-align:left}.forecast-create-panel{align-items:flex-start;flex-direction:column}}
@media(max-width:520px){.forecast-builder-row{grid-template-columns:1fr}.forecast-worker-main{grid-column:auto}.forecast-create-panel .btn{width:100%}}

/* V6.4 accountformulier: veldspecifieke validatie */
.field-error{display:block;font-size:11px;line-height:1.4;color:#a31313;font-weight:700}.field.has-error input,.field.has-error select,.field.has-error textarea{border-color:#d71f1f;background:#fff7f7}.field.has-error input:focus,.field.has-error select:focus,.field.has-error textarea:focus{outline:2px solid rgba(215,31,31,.16);border-color:#d71f1f}[hidden]{display:none!important}.btn:disabled{opacity:.6;cursor:wait}

/* V6.6 team selection + admin rate polish */
.team-select-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:8px 0 14px;padding:12px 14px;border:1px solid var(--line,#dedbd5);background:#f7f5f1}.team-select-toolbar .field-help{margin:0;max-width:720px}.forecast-team-toolbar{margin-top:0}.account-rate-form{margin-top:18px;padding-top:18px;border-top:1px solid var(--line,#dedbd5)}
@media (max-width:760px){.team-select-toolbar{align-items:flex-start;flex-direction:column}.team-select-toolbar .actions{width:100%}.team-select-toolbar .actions .btn{flex:1}}


/* V6.9 - Mobiele urenregistratie als rustige verticale lijst */
@media(max-width:760px){
  .hours-week-panel{overflow:visible;border:0;background:transparent;box-shadow:none;margin-bottom:22px}
  .hours-week-head{padding:16px 15px;border:1px solid var(--line);background:#fff;border-radius:0}
  .hours-week-head h2{font-size:23px;margin-bottom:3px}
  .hours-week-head .period-kicker{margin-bottom:6px}
  .hours-week-panel .table-wrap{overflow:visible!important;border:0;background:transparent}

  /* Geen brede tabel meer: ieder project wordt een verticale invoerlijst. */
  .hours-table{display:block;width:100%;min-width:0!important;border:0;background:transparent}
  .hours-table thead{display:none}
  .hours-table tbody{display:grid;gap:12px;padding:10px 0 12px}
  .hours-table tbody tr{display:block;border:1px solid var(--line);background:#fff;overflow:hidden}

  /* Projectkop */
  .hours-table tbody td{min-width:0!important;border:0!important;text-align:left!important;background:#fff!important}
  .hours-table tbody td:first-child{display:block;padding:13px 14px 12px;border-bottom:1px solid #eceae5!important;background:#faf9f6!important}
  .hours-table tbody td:first-child strong{display:block;font-size:15px;line-height:1.28;margin-bottom:3px}
  .hours-table tbody td:first-child .small-text{font-size:11px;line-height:1.35}

  /* Eén dag = één regel: dag links, urenveld rechts. */
  .hours-table tbody td:not(:first-child):not(:last-child){display:grid;grid-template-columns:minmax(0,1fr) 92px;align-items:center;gap:14px;min-height:58px;padding:8px 12px;border-bottom:1px solid #f0efeb!important}
  .hours-table tbody td:not(:first-child):not(:last-child)::before{content:attr(data-label);font-size:13px;font-weight:750;letter-spacing:0;text-transform:none;color:#292929;line-height:1.2}
  .hours-table tbody td.today-col{background:#fff8f7!important;box-shadow:inset 3px 0 0 var(--red)}
  .hours-table tbody td.today-col::before{color:#b91c1c}
  .hours-table tbody td:nth-last-child(2){border-bottom:0!important}

  .hours-input{width:92px;min-width:0;min-height:42px;padding:7px 8px;font-size:16px;font-weight:800;text-align:center;border:1px solid #d8d5cf;border-radius:0;background:#fff}
  .hours-input:focus{outline:2px solid rgba(215,31,31,.14);outline-offset:0;border-color:var(--red)}
  .hours-input::placeholder{color:#b6b4af}

  /* Projecttotaal is op mobiel bewust verborgen: focus op invoer + weektotaal. */
  .hours-table .row-total{display:none!important}

  /* Alleen het totale aantal uren van de week blijft prominent zichtbaar. */
  .hours-table tfoot{display:block;border:1px solid #cbd8f0;background:#f4f7ff;margin-top:0}
  .hours-table tfoot tr{display:block}
  .hours-table tfoot td{display:none!important}
  .hours-table tfoot .week-total-cell{display:flex!important;width:100%;min-width:0;align-items:center;justify-content:space-between;gap:14px;padding:14px 15px;text-align:left!important;background:#f4f7ff!important}
  .hours-table tfoot .week-total-cell .week-total-label{margin:0;font-size:11px;color:#4b5d79}
  .hours-table tfoot .week-total-cell strong{font-size:22px;flex:0 0 auto}

  /* Opslaan blijft bereikbaar zonder het formulier te overlappen. */
  .period-save-actions{position:sticky;bottom:8px;z-index:15;margin:14px 0 4px;padding:7px;background:rgba(247,246,242,.95);backdrop-filter:blur(7px)}
  .period-save-actions .btn{width:100%;min-height:50px;font-size:14px}

  /* Periodebediening compact en duidelijk. */
  .period-nav{grid-template-columns:1fr 1fr;gap:8px;padding:14px}
  .period-nav-title{grid-column:1/-1;order:1;margin-bottom:3px}
  .period-nav-title strong{font-size:22px}
  .period-nav-side,.period-nav-right{order:2!important;justify-content:stretch}
  .period-nav-side .btn,.period-nav-right .btn{width:100%;justify-content:center;min-height:42px;padding:7px 6px;font-size:11px}
}

@media(max-width:390px){
  .hours-table tbody{gap:10px}
  .hours-table tbody td:not(:first-child):not(:last-child){grid-template-columns:minmax(0,1fr) 84px;gap:10px;padding:8px 10px}
  .hours-input{width:84px;min-height:40px;font-size:16px}
  .period-nav{padding:12px 10px}
  .period-nav-side .btn,.period-nav-right .btn{font-size:10px}
}

/* V6.12 - mobiel: per dag direct Project -> Uren in één rustige regel */
.mobile-hours-weeks{display:none}
@media(max-width:760px){
  /* Op telefoon gebruiken we niet de brede projecttabel, maar een daglijst. */
  .desktop-hours-week{display:none!important}
  .mobile-hours-weeks{display:grid;gap:18px;margin-top:14px}

  .mobile-week-card{border:1px solid var(--line);background:#fff}
  .mobile-week-heading{padding:16px 15px 14px;border-bottom:1px solid var(--line);background:#faf9f6}
  .mobile-week-heading .period-kicker{display:inline-block;margin-bottom:7px}
  .mobile-week-heading h2{font-size:24px;line-height:1.05;margin:0 0 5px}
  .mobile-week-heading p{margin:0;font-size:12px;color:var(--muted)}

  .mobile-day-list{display:block}
  .mobile-day-block{padding:0;border-bottom:1px solid #eceae5;background:#fff}
  .mobile-day-block:last-child{border-bottom:0}
  .mobile-day-block.is-today{box-shadow:inset 3px 0 0 var(--red);background:#fffafa}
  .mobile-day-entries{display:grid}

  /* Dag | Project | Uren. Dit is bewust één regel op mobiel. */
  .mobile-day-entry{display:grid;grid-template-columns:58px minmax(0,1fr) 76px;align-items:center;gap:8px;min-height:58px;padding:8px 10px}
  .mobile-day-entry + .mobile-day-entry{border-top:1px dashed #eceae5;padding-top:7px;padding-bottom:7px}
  .mobile-day-label{display:flex;flex-direction:column;gap:1px;min-width:0}
  .mobile-day-label strong{font-size:13px;line-height:1.1;color:var(--ink)}
  .mobile-day-label span{font-size:11px;line-height:1.1;color:#77736d}
  .mobile-day-label.is-extra{align-items:center;justify-content:center;color:#aaa}
  .mobile-day-block.is-today .mobile-day-label strong{color:#b91c1c}

  .mobile-project-field{min-width:0}
  .mobile-project-select{display:block;width:100%;min-width:0;height:42px;padding:0 30px 0 10px;border:1px solid #d8d5cf;background:#fff;color:#171717;font:inherit;font-size:12px;font-weight:750;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;border-radius:0}
  .mobile-project-select:focus{outline:2px solid rgba(35,100,220,.14);border-color:#4675cf}

  .mobile-hours-field{display:grid;grid-template-columns:minmax(0,1fr) 13px;align-items:center;gap:3px}
  .mobile-hours-value{width:100%;min-width:0;height:42px;padding:6px 5px;border:1px solid #d8d5cf;background:#fff;font-size:16px;font-weight:850;text-align:center;border-radius:0}
  .mobile-hours-value:focus{outline:2px solid rgba(215,31,31,.14);border-color:var(--red)}
  .mobile-hours-field>span{font-size:11px;font-weight:800;color:#77736d}

  .mobile-add-project{appearance:none;border:0;background:transparent;color:#5d6571;font:inherit;font-size:11px;font-weight:800;padding:0 10px 9px 76px;cursor:pointer;text-align:left}
  .mobile-add-project:hover,.mobile-add-project:focus{color:var(--red)}

  .mobile-week-total{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 15px;border-top:1px solid #cbd8f0;background:#f4f7ff}
  .mobile-week-total>span{font-size:11px;font-weight:800;color:#4b5d79;text-transform:uppercase;letter-spacing:.04em}
  .mobile-week-total strong{font-size:22px;line-height:1;color:#1d4fb8}

  .period-save-actions{position:sticky;bottom:8px;z-index:15;margin:14px 0 4px;padding:7px;background:rgba(247,246,242,.95);backdrop-filter:blur(7px)}
  .period-save-actions .btn{width:100%;min-height:50px;font-size:14px}
}

@media(max-width:390px){
  .mobile-day-entry{grid-template-columns:52px minmax(0,1fr) 70px;gap:6px;padding-left:8px;padding-right:8px}
  .mobile-project-select{font-size:11px;padding-left:8px}
  .mobile-hours-value{font-size:15px}
  .mobile-add-project{padding-left:66px}
}

/* V6.13 - mobiele uren: één project per dag + duidelijke validatie */
@media (max-width:760px){
  .mobile-day-error{margin:0;padding:0 10px 9px 76px;font-size:11px;line-height:1.35;font-weight:750;color:#b91c1c}
  .mobile-day-block.has-error{background:#fffafa;box-shadow:inset 3px 0 0 #dc2626}
  .mobile-day-block.has-error .mobile-project-select[aria-invalid="true"],
  .mobile-day-block.has-error .mobile-hours-value[aria-invalid="true"]{border-color:#dc2626;background:#fff7f7;outline:2px solid rgba(220,38,38,.08)}
  .mobile-add-project{display:none!important}
}
@media (max-width:390px){
  .mobile-day-error{padding-left:66px}
}
\n\n/* V6.14 - installeerbare PWA */
.pwa-install-btn{appearance:none;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;min-height:38px;padding:0 12px;font:inherit;font-size:12px;font-weight:800;cursor:pointer;text-align:center}
.pwa-install-btn:hover,.pwa-install-btn:focus{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.38);outline:none}
.login-install-btn{display:flex;align-items:center;gap:12px;width:100%;margin-top:12px;padding:12px 14px;border:1px solid #d7d2ca;background:linear-gradient(180deg,#fff 0%,#f7f4ef 100%);color:var(--ink);min-height:58px;text-align:left;box-shadow:0 1px 0 rgba(17,17,17,.04)}
.login-install-btn:hover,.login-install-btn:focus{background:linear-gradient(180deg,#fff 0%,#f2eee7 100%);border-color:#c7c1b8;outline:none}
.login-install-btn__icon{display:flex;align-items:center;justify-content:center;flex:0 0 34px;width:34px;height:34px;border:1px solid #e1dbd2;background:#fff;color:var(--red);font-size:18px;font-weight:900;line-height:1;box-shadow:0 1px 0 rgba(17,17,17,.03)}
.login-install-btn__content{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0}
.login-install-btn__content strong{font-size:14px;line-height:1.15;color:var(--ink)}
.login-install-btn__content small{font-size:11px;line-height:1.35;color:var(--muted)}
@media(max-width:820px){.sidebar-user .pwa-install-btn{width:100%}}
@media(max-width:560px){.login-install-btn{padding:11px 12px;gap:10px;min-height:56px}.login-install-btn__icon{flex-basis:32px;width:32px;height:32px;font-size:17px}.login-install-btn__content strong{font-size:13px}.login-install-btn__content small{font-size:10px}}

/* V6.15 - sidebar footer polish */
.sidebar-user{gap:12px}
.sidebar-user-profile{padding:0 2px 2px}
.sidebar-logout{display:flex!important;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:42px;padding:0 13px!important;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.055);color:#fff!important;font-weight:750;font-size:12px!important;transition:background .18s ease,border-color .18s ease,transform .18s ease}
.sidebar-logout:hover,.sidebar-logout:focus{background:rgba(224,32,32,.16);border-color:rgba(224,32,32,.65);outline:none;transform:translateY(-1px)}
.sidebar-credit{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding:2px 2px 0;font-size:10px;line-height:1.4;color:rgba(255,255,255,.34)}
.sidebar-credit a{font-size:10px!important;font-weight:750;color:rgba(255,255,255,.58)!important;text-decoration:none!important;transition:color .18s ease}
.sidebar-credit a:hover,.sidebar-credit a:focus{color:#fff!important;outline:none}
@media(max-width:820px){.sidebar-credit{padding-bottom:2px}}

/* V6.17 security - logout is a CSRF-protected POST form */
.sidebar-logout-form{margin:0;width:100%}
.sidebar-logout-form .sidebar-logout{font-family:inherit;cursor:pointer}


/* V6.20 - dashboard: budget en uren restant per project */
.project-balance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:2px 0 1px}
.project-balance-grid>div{display:grid;gap:3px;padding:9px 10px;background:#fafafa;border:1px solid #ece9e3}
.project-balance-grid small{font-size:9px;line-height:1.2;font-weight:850;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.project-balance-grid strong{font-size:13px;line-height:1.2}
.project-hours-balance{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 8px}
.project-hours-balance span{display:grid;gap:2px;padding:8px 9px;background:#f8fbff;border:1px solid #dfe8f5;font-size:10px;color:var(--muted)}
.project-hours-balance strong{font-size:13px;color:#2563eb}
.project-hours-balance.is-over span:last-child{background:#fff5f5;border-color:#f2cccc;color:#991b1b}
.project-hours-balance.is-over span:last-child strong{color:#b91c1c}
@media(max-width:650px){.project-balance-grid,.project-hours-balance{grid-template-columns:1fr}.project-balance-grid>div,.project-hours-balance span{padding:8px 9px}}

/* V6.21 - admin urenmeldingen / Web Push */
.push-settings-panel{margin-top:22px}
.push-settings-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:4px}
.push-settings-row>div:first-child{min-width:0}
.push-settings-row strong{display:block;margin-bottom:5px;font-size:15px}
.push-settings-row p{margin:0}
.app-toast-root{position:fixed;right:20px;top:20px;z-index:9999;display:grid;gap:10px;width:min(390px,calc(100vw - 32px));pointer-events:none}
.app-toast{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:16px 44px 16px 16px;background:#111;color:#fff;border-left:4px solid var(--red);box-shadow:0 16px 42px rgba(0,0,0,.25);pointer-events:auto;animation:bitar-toast-in .22s ease-out}
.app-toast-content{min-width:0}
.app-toast-content strong{display:block;font-size:14px;line-height:1.25;margin-bottom:4px}
.app-toast-content p{margin:0;color:rgba(255,255,255,.72);font-size:12px;line-height:1.4}
.app-toast-link{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 11px;border:1px solid rgba(255,255,255,.22);color:#fff;text-decoration:none;font-size:11px;font-weight:800;white-space:nowrap}
.app-toast-link:hover,.app-toast-link:focus{background:#fff;color:#111;outline:none}
.app-toast-close{position:absolute;right:8px;top:6px;width:28px;height:28px;border:0;background:transparent;color:rgba(255,255,255,.65);font-size:22px;line-height:1;cursor:pointer}
.app-toast-close:hover,.app-toast-close:focus{color:#fff;outline:none}
@keyframes bitar-toast-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){.push-settings-row{align-items:stretch;flex-direction:column}.push-settings-row .actions{width:100%}.push-settings-row .btn{width:100%}.app-toast-root{right:12px;top:12px;width:calc(100vw - 24px)}.app-toast{grid-template-columns:1fr;padding-right:40px}.app-toast-link{justify-self:start}}