:root{
  --ink:#0f1d2a;--ink-2:#172737;--ink-3:#26384a;--teal:#00ad9c;--teal-2:#13c2b0;--teal-soft:#dff8f4;--mint:#89e2d6;
  --bg:#f4f7f7;--surface:#fff;--surface-2:#eef4f4;--line:#d9e4e4;--text:#15212c;--muted:#667581;--danger:#c23d4b;--danger-soft:#fdebed;
  --warn:#b66b16;--warn-soft:#fff2dd;--success:#167a5a;--success-soft:#e2f5ed;--blue:#2d6cdf;--shadow:0 20px 55px rgba(15,29,42,.09);--radius:18px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit}img{max-width:100%}.hidden{display:none!important}
.auth-page{min-height:100vh;display:grid;grid-template-columns:minmax(420px,1fr) minmax(480px,1.15fr);background:linear-gradient(135deg,#f9fbfb 0%,#edf7f5 100%)}.auth-brand{padding:clamp(36px,6vw,90px);display:flex;flex-direction:column;justify-content:space-between;background:radial-gradient(circle at 20% 20%,rgba(0,173,156,.16),transparent 38%),linear-gradient(155deg,#183740,#244753 72%);color:#fff}.auth-logo{width:min(440px,85%);filter:drop-shadow(0 12px 28px rgba(0,0,0,.2))}.auth-brand h1{font-size:clamp(2.2rem,5vw,4.5rem);line-height:.98;letter-spacing:-.06em;max-width:680px;margin:60px 0 22px}.auth-brand p{max-width:620px;color:rgba(255,255,255,.72);font-size:1.06rem;line-height:1.7}.auth-points{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:40px}.auth-point{padding:16px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(255,255,255,.05);backdrop-filter:blur(8px)}.auth-point strong{display:block;font-size:.9rem}.auth-point small{display:block;color:rgba(255,255,255,.58);margin-top:5px;line-height:1.4}.auth-panel{display:grid;place-items:center;padding:30px}.auth-card{width:min(460px,100%);background:#fff;border:1px solid var(--line);border-radius:26px;padding:32px;box-shadow:var(--shadow)}.auth-card .mark{width:62px;margin-bottom:18px}.auth-card h2{margin:0;color:var(--ink);font-size:1.75rem;letter-spacing:-.04em}.auth-card>p{color:var(--muted);line-height:1.55}.form{display:grid;gap:15px}.field{display:grid;gap:7px}.field label{font-weight:800;color:var(--ink);font-size:.78rem}.field input,.field select,.field textarea{width:100%;border:1px solid #ccd9db;border-radius:11px;padding:11px 12px;background:#fff;color:var(--text);outline:none}.field textarea{min-height:96px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(0,173,156,.12)}.field small,.help{font-size:.72rem;color:var(--muted);line-height:1.45}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.field.full{grid-column:1/-1}.check-line{display:flex;align-items:center;gap:9px;font-size:.82rem}.check-line input{accent-color:var(--teal)}
.button{border:0;border-radius:11px;padding:11px 15px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.16s ease;text-decoration:none}.button:hover{transform:translateY(-1px)}.button.primary{background:linear-gradient(135deg,var(--teal),#008f83);color:#fff;box-shadow:0 8px 20px rgba(0,173,156,.22)}.button.dark{background:var(--ink);color:#fff}.button.ghost{background:#fff;border:1px solid var(--line);color:var(--ink)}.button.soft{background:var(--teal-soft);color:#007a70}.button.danger{background:var(--danger);color:#fff}.button.warn{background:var(--warn);color:#fff}.button.small{padding:7px 10px;border-radius:9px;font-size:.78rem}.button.block{width:100%}.button:disabled{opacity:.45;cursor:not-allowed;transform:none}.link-button{border:0;background:none;color:var(--teal);font-weight:800;padding:0}.auth-actions{display:flex;align-items:center;justify-content:space-between;margin-top:4px}.auth-message{padding:11px 13px;border-radius:11px;font-size:.82rem;margin-bottom:14px}.auth-message.error{background:var(--danger-soft);color:#8d2632}.auth-message.success{background:var(--success-soft);color:var(--success)}
.app-shell{min-height:100vh;display:grid;grid-template-columns:250px minmax(0,1fr)}.sidebar{height:100vh;position:sticky;top:0;background:linear-gradient(180deg,var(--ink) 0%,#122636 100%);color:#fff;padding:22px 16px;display:flex;flex-direction:column;z-index:30}.sidebar-logo{display:flex;align-items:center;gap:11px;text-decoration:none;padding:5px 8px 25px}.sidebar-logo img{width:38px}.sidebar-logo strong{display:block;font-size:1rem}.sidebar-logo small{display:block;color:rgba(255,255,255,.52);margin-top:2px}.portal-badge{font-size:.64rem;text-transform:uppercase;letter-spacing:.1em;color:var(--mint)}.nav{display:grid;gap:5px}.nav button,.nav a{border:0;background:transparent;color:rgba(255,255,255,.66);display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:11px;text-decoration:none;text-align:left;font-weight:700}.nav button:hover,.nav button.active,.nav a:hover,.nav a.active{background:rgba(255,255,255,.09);color:#fff}.nav-icon{width:22px;text-align:center;color:var(--mint)}.sidebar-bottom{margin-top:auto;padding:12px 8px}.user-mini{display:flex;align-items:center;gap:10px}.avatar{width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,var(--teal),var(--mint));color:var(--ink);display:grid;place-items:center;font-weight:900}.user-mini strong{display:block;font-size:.82rem}.user-mini small{display:block;color:rgba(255,255,255,.52);font-size:.7rem;margin-top:2px}.sidebar-actions{display:flex;gap:7px;margin-top:12px}.sidebar-actions button{flex:1;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#fff;padding:8px;border-radius:9px;font-size:.72rem}.main{min-width:0}.topbar{position:sticky;top:0;z-index:20;min-height:88px;background:rgba(244,247,247,.9);backdrop-filter:blur(12px);border-bottom:1px solid rgba(217,228,228,.8);padding:17px clamp(18px,3vw,42px);display:flex;align-items:center;justify-content:space-between;gap:18px}.topbar h1{margin:2px 0 0;color:var(--ink);font-size:clamp(1.45rem,2.2vw,2rem);letter-spacing:-.04em}.eyebrow{margin:0;text-transform:uppercase;letter-spacing:.11em;font-weight:900;font-size:.68rem;color:var(--teal)}.top-actions{display:flex;align-items:center;gap:9px}.mobile-toggle{display:none;border:0;background:#fff;border-radius:10px;width:40px;height:40px}.content{padding:18px clamp(18px,3vw,42px) 55px}.page{display:grid;gap:20px}.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.card.pad{padding:21px}.card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:17px}.card-header h2,.card-header h3{margin:0;color:var(--ink);letter-spacing:-.025em}.card-header p{margin:4px 0 0;color:var(--muted);font-size:.82rem}.toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.kpi{min-height:135px;padding:18px;display:flex;flex-direction:column;justify-content:space-between}.kpi-top{display:flex;align-items:center;justify-content:space-between}.kpi-label{font-size:.78rem;color:var(--muted);font-weight:800}.kpi-icon{width:38px;height:38px;border-radius:11px;background:var(--teal-soft);color:var(--teal);display:grid;place-items:center;font-weight:900}.kpi-value{font-size:1.85rem;color:var(--ink);font-weight:900;letter-spacing:-.045em;margin-top:15px}.kpi-note{font-size:.72rem;color:var(--muted);margin-top:3px}.grid-2{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.8fr);gap:18px}.grid-equal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.list{display:grid;gap:9px}.list-item{border:1px solid var(--line);border-radius:12px;padding:12px 13px;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;background:#fff}.list-item h4{margin:0;color:var(--ink);font-size:.88rem}.list-item p{margin:4px 0 0;color:var(--muted);font-size:.76rem;line-height:1.45}.list-main{display:flex;gap:10px;align-items:flex-start}.empty{padding:42px 18px;text-align:center;color:var(--muted)}.empty strong{display:block;color:var(--ink);margin-bottom:5px}.badge{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;font-weight:900;font-size:.68rem;white-space:nowrap}.badge.green{background:var(--success-soft);color:var(--success)}.badge.red{background:var(--danger-soft);color:var(--danger)}.badge.orange{background:var(--warn-soft);color:var(--warn)}.badge.teal{background:var(--teal-soft);color:#007b70}.badge.gray{background:#edf2f3;color:var(--muted)}.notice{padding:13px 15px;border-radius:13px;display:flex;gap:10px;font-size:.82rem;line-height:1.5}.notice.info{background:#eaf6f5;color:#1c5b58;border:1px solid #c9e9e5}.notice.warn{background:var(--warn-soft);color:#75470f;border:1px solid #f3d6a8}.notice.danger{background:var(--danger-soft);color:#812832;border:1px solid #f2c8cd}.notice strong{display:block}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:13px}.data-table{width:100%;border-collapse:collapse;min-width:780px}.data-table th{background:#f2f6f6;color:var(--muted);text-transform:uppercase;letter-spacing:.055em;font-size:.66rem;text-align:left;padding:11px 12px;white-space:nowrap}.data-table td{padding:12px;border-top:1px solid var(--line);vertical-align:top;font-size:.82rem}.data-table tr:hover td{background:#fbfdfd}.data-table strong{color:var(--ink)}.data-table small{display:block;color:var(--muted);margin-top:3px}.right{text-align:right}.progress{height:9px;background:#e8eeee;border-radius:999px;overflow:hidden}.progress span{height:100%;display:block;background:linear-gradient(90deg,var(--teal),var(--mint));border-radius:inherit}.segmented{display:inline-flex;padding:3px;border:1px solid var(--line);background:#f1f5f5;border-radius:10px}.segmented button{border:0;background:transparent;padding:7px 10px;border-radius:7px;font-weight:800;color:var(--muted)}.segmented button.active{background:var(--ink);color:#fff}.week-wrap{overflow:auto}.week-grid{min-width:1080px;display:grid;grid-template-columns:180px repeat(7,minmax(125px,1fr));border:1px solid var(--line);border-radius:13px;overflow:hidden}.week-cell{min-height:105px;padding:9px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);position:relative}.week-cell:nth-child(8n){border-right:0}.week-head{min-height:62px;background:#f2f6f6;color:var(--ink);font-weight:900}.week-head small{display:block;color:var(--muted);font-weight:600;margin-top:3px}.employee-cell{background:#fbfdfd;font-weight:800}.employee-cell small{display:block;color:var(--muted);font-weight:500;margin-top:4px}.shift{display:block;width:100%;border:0;text-align:left;border-radius:9px;padding:7px 8px;background:var(--teal-soft);border-left:3px solid var(--teal);color:var(--ink);margin-bottom:5px;font-size:.72rem}.shift.open{background:#edf1f2;border-left-color:#7b8992}.shift strong,.shift span{display:block}.shift span{color:var(--muted);font-size:.66rem;margin-top:2px}.cell-add{position:absolute;right:6px;bottom:6px;border:1px dashed #b6c5c7;background:#fff;color:var(--teal);width:25px;height:25px;border-radius:7px}.date-nav{display:flex;align-items:center;gap:7px}.date-nav strong{min-width:180px;text-align:center;color:var(--ink)}.stat-row{display:flex;gap:10px;flex-wrap:wrap}.stat-pill{padding:7px 10px;border-radius:999px;background:#edf4f3;color:var(--ink);font-size:.72rem;font-weight:800}.tabs{display:flex;gap:5px;overflow:auto;border-bottom:1px solid var(--line);margin-bottom:18px}.tab{border:0;background:transparent;padding:10px 12px;color:var(--muted);font-weight:800;border-bottom:3px solid transparent;white-space:nowrap}.tab.active{color:var(--teal);border-bottom-color:var(--teal)}.clock-panel{text-align:center;padding:32px}.clock-time{font-size:3.1rem;font-weight:900;color:var(--ink);letter-spacing:-.055em}.clock-date{color:var(--muted);margin-top:4px}.clock-status{margin:22px auto;max-width:360px}.clock-button{width:170px;height:170px;border-radius:50%;border:12px solid var(--teal-soft);background:linear-gradient(135deg,var(--teal),#008b7f);color:#fff;font-size:1.15rem;font-weight:900;box-shadow:0 18px 45px rgba(0,173,156,.25)}.clock-button.out{background:linear-gradient(135deg,var(--ink),#304354);border-color:#e2e9ea}.modal{width:min(720px,calc(100% - 24px));border:0;border-radius:20px;padding:0;box-shadow:0 30px 90px rgba(15,29,42,.3)}.modal::backdrop{background:rgba(8,19,28,.58);backdrop-filter:blur(3px)}.modal-head{padding:20px 22px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:12px}.modal-head h2{margin:2px 0 0;color:var(--ink)}.modal-body{padding:21px 22px;max-height:68vh;overflow:auto}.modal-actions{padding:15px 22px 20px;display:flex;justify-content:flex-end;gap:8px}.icon-button{border:0;background:#f0f4f4;color:var(--ink);width:38px;height:38px;border-radius:10px}.toast{position:fixed;right:22px;bottom:22px;z-index:100;background:var(--ink);color:#fff;padding:12px 15px;border-radius:11px;box-shadow:var(--shadow);opacity:0;transform:translateY(10px);pointer-events:none;transition:.18s}.toast.show{opacity:1;transform:none}.setup-card{max-width:720px;margin:50px auto}.logo-display{width:270px}.support-company{display:grid;grid-template-columns:1fr auto;gap:12px}.danger-zone{border:1px solid #f1c6cb;background:#fff9fa}.metric-line{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}.metric-line:last-child{border-bottom:0}.metric-line span{color:var(--muted)}.metric-line strong{color:var(--ink)}
@media(max-width:1100px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.grid-2,.grid-equal,.grid-3{grid-template-columns:1fr}.auth-page{grid-template-columns:1fr}.auth-brand{min-height:440px}.auth-panel{padding:24px}.auth-points{max-width:680px}.support-company{grid-template-columns:1fr}}
@media(max-width:780px){.app-shell{display:block}.sidebar{position:fixed;left:-270px;width:250px;transition:left .2s;box-shadow:20px 0 55px rgba(0,0,0,.25)}.sidebar.open{left:0}.mobile-toggle{display:grid;place-items:center}.topbar{padding:13px 15px;min-height:76px}.content{padding:14px 15px 40px}.top-actions .desktop-only{display:none}.kpi-grid{grid-template-columns:1fr 1fr;gap:10px}.kpi{min-height:120px;padding:14px}.kpi-value{font-size:1.5rem}.form-grid{grid-template-columns:1fr}.auth-brand{padding:35px 24px}.auth-brand h1{margin-top:45px}.auth-points{grid-template-columns:1fr}.auth-card{padding:24px}.card.pad{padding:16px}.card-header{flex-direction:column}.toolbar{width:100%}.date-nav strong{min-width:140px}.clock-button{width:145px;height:145px}.logo-display{width:220px}}
@media(max-width:480px){.kpi-grid{grid-template-columns:1fr}.auth-brand{min-height:360px}.auth-brand h1{font-size:2.3rem}.topbar h1{font-size:1.3rem}.top-actions .button.ghost{display:none}}
@media print{.sidebar,.topbar,.button,.icon-button,.tabs,.toast{display:none!important}.app-shell{display:block}.content{padding:0}.card{box-shadow:none;break-inside:avoid}body{background:#fff}}


/* ShiftKlaar V4.2 — responsive Progressive Web App */
.topbar-right{position:relative;display:flex;align-items:center;gap:9px}.mobile-account,.mobile-user-menu{display:none}.mobile-user-menu[hidden]{display:none!important}

html{height:100%;-webkit-text-size-adjust:100%;text-size-adjust:100%;overscroll-behavior-y:none}
body{min-height:100%;min-height:100dvh;-webkit-tap-highlight-color:transparent}
button,a,input,select,textarea{touch-action:manipulation}
button,.button,.nav button,.tab{min-height:44px}
input,select,textarea{min-height:46px;font-size:16px}
textarea{min-height:110px}
:focus-visible{outline:3px solid rgba(0,173,156,.35);outline-offset:2px}
.topbar{padding-top:max(17px,env(safe-area-inset-top))}
.sidebar{padding-left:max(16px,env(safe-area-inset-left))}
.content{padding-right:max(clamp(18px,3vw,42px),env(safe-area-inset-right))}
.table-wrap,.week-wrap{overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
.week-wrap{position:relative}
.week-wrap::after,.table-wrap::after{content:"Veeg horizontaal voor meer";display:none;position:sticky;left:12px;bottom:8px;width:max-content;padding:5px 8px;border-radius:999px;background:rgba(15,29,42,.82);color:#fff;font-size:.62rem;pointer-events:none}
.network-banner{position:fixed;z-index:200;left:50%;top:max(8px,env(safe-area-inset-top));transform:translate(-50%,-140%);display:flex;align-items:center;gap:8px;max-width:min(92vw,720px);padding:9px 13px;border-radius:999px;background:#7b4d12;color:#fff;box-shadow:0 12px 35px rgba(15,29,42,.22);font-size:.76rem;font-weight:750;transition:transform .22s ease}
.network-banner.show{transform:translate(-50%,0)}
.network-dot{width:8px;height:8px;border-radius:50%;background:#ffd38f;box-shadow:0 0 0 4px rgba(255,211,143,.16)}
.pwa-install{position:fixed;z-index:150;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));display:flex;align-items:center;gap:10px;width:min(330px,calc(100vw - 30px));padding:10px 12px;border:1px solid rgba(255,255,255,.12);border-radius:15px;background:linear-gradient(135deg,var(--ink),#163247);color:#fff;box-shadow:0 20px 60px rgba(15,29,42,.3);text-align:left}
.pwa-install[hidden]{display:none}.pwa-install img{width:42px;height:42px;object-fit:contain}.pwa-install span{min-width:0;flex:1}.pwa-install strong,.pwa-install small{display:block}.pwa-install strong{font-size:.8rem}.pwa-install small{margin-top:2px;color:rgba(255,255,255,.66);font-size:.67rem}.pwa-install b{display:grid;place-items:center;width:29px;height:29px;border-radius:9px;background:var(--teal);font-size:1.1rem}
.pwa-sheet[hidden],.pwa-update[hidden]{display:none}.pwa-sheet{position:fixed;inset:0;z-index:250;display:grid;align-items:end}.pwa-sheet-backdrop{position:absolute;inset:0;width:100%;height:100%;border:0;background:rgba(7,18,27,.62);backdrop-filter:blur(4px)}.pwa-sheet-card{position:relative;width:min(520px,100%);margin:0 auto;padding:12px 24px max(24px,env(safe-area-inset-bottom));border-radius:24px 24px 0 0;background:#fff;box-shadow:0 -20px 80px rgba(15,29,42,.25)}.pwa-sheet-handle{width:44px;height:5px;margin:0 auto 18px;border-radius:999px;background:#d6e0e1}.pwa-sheet-card>img{width:64px}.pwa-sheet-card h2{margin:12px 0 6px;color:var(--ink)}.pwa-sheet-card p{margin:0;color:var(--muted);line-height:1.55}.pwa-sheet-card ol{margin:18px 0;padding-left:22px;color:var(--ink)}.pwa-sheet-card li{padding:5px 0;line-height:1.45}.pwa-sheet-open{overflow:hidden}
.pwa-update{position:fixed;z-index:210;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;gap:14px;width:min(620px,calc(100vw - 30px));padding:12px 14px;border-radius:15px;background:#fff;border:1px solid var(--line);box-shadow:0 20px 70px rgba(15,29,42,.25)}.pwa-update span{flex:1}.pwa-update strong,.pwa-update small{display:block}.pwa-update small{color:var(--muted);margin-top:3px}
.offline-page{display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 75% 20%,rgba(0,173,156,.12),transparent 36%),var(--bg)}.offline-card{width:min(520px,100%);padding:34px;text-align:center;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:var(--shadow)}.offline-card>img{width:min(280px,78%)}.offline-icon{display:grid;place-items:center;width:68px;height:68px;margin:28px auto 16px;border-radius:20px;background:var(--teal-soft);color:var(--teal);font-size:2rem}.offline-card h1{margin:0;color:var(--ink)}.offline-card p{color:var(--muted);line-height:1.65}.offline-card small{display:block;margin-top:18px;color:var(--muted)}
@media(display-mode:standalone){.pwa-install{display:none!important}.topbar{padding-top:max(16px,env(safe-area-inset-top))}}
@media(max-width:780px){
  body:not(.auth-page):not(.offline-page){padding-bottom:calc(72px + env(safe-area-inset-bottom))}
  .app-shell{display:block!important;min-height:100dvh}
  .sidebar{position:fixed!important;inset:auto 0 0 0!important;width:100%!important;height:auto!important;min-height:0!important;padding:7px max(6px,env(safe-area-inset-right)) max(7px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left))!important;background:rgba(15,29,42,.97)!important;backdrop-filter:blur(14px);border-top:1px solid rgba(255,255,255,.1);box-shadow:0 -12px 38px rgba(15,29,42,.2);transition:none!important;z-index:120!important;overflow:visible!important}
  .sidebar-logo,.sidebar-bottom{display:none!important}
  .nav{display:flex!important;gap:3px!important;overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x proximity;padding:0!important;scrollbar-width:none}.nav::-webkit-scrollbar{display:none}
  .nav button,.nav a{flex:0 0 78px;min-width:78px;min-height:55px!important;display:flex!important;flex-direction:column;justify-content:center;align-items:center;gap:3px!important;padding:5px 6px!important;border-radius:11px!important;text-align:center!important;font-size:.62rem;line-height:1.1;scroll-snap-align:start}
  .nav button.active,.nav a.active{background:rgba(0,173,156,.18)!important;color:#fff!important}
  .nav-icon{width:auto!important;font-size:1.05rem;line-height:1;color:var(--mint)!important}
  .main{width:100%;min-height:100dvh}
  .mobile-toggle{display:none!important}
  .topbar{min-height:72px!important;padding:calc(10px + env(safe-area-inset-top)) 14px 10px!important;align-items:flex-end!important}
  .topbar h1{font-size:1.28rem!important;line-height:1.1}.topbar .eyebrow{font-size:.59rem}
  .top-actions{max-width:52%;justify-content:flex-end;overflow-x:auto;scrollbar-width:none}.top-actions::-webkit-scrollbar{display:none}.top-actions .button{white-space:nowrap;min-height:40px;padding:8px 10px;font-size:.7rem}
  .topbar-right{margin-left:auto;max-width:62%}.mobile-account{display:grid;place-items:center;flex:0 0 39px;width:39px;height:39px;min-height:39px;border:0;border-radius:12px;background:linear-gradient(135deg,var(--teal),var(--mint));color:var(--ink);font-weight:900}.mobile-user-menu{position:absolute;display:grid;right:0;top:calc(100% + 10px);width:210px;padding:12px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 18px 55px rgba(15,29,42,.22);z-index:180}.mobile-user-menu strong,.mobile-user-menu small{display:block}.mobile-user-menu strong{color:var(--ink);font-size:.8rem}.mobile-user-menu small{color:var(--muted);font-size:.68rem;margin:3px 0 10px}.mobile-user-menu button{min-height:40px;border:0;border-top:1px solid var(--line);background:#fff;text-align:left;color:var(--ink);font-weight:750;padding:9px 4px}.mobile-user-menu button:last-child{color:var(--danger)}
  .content{padding:13px 13px 24px!important}
  .page{gap:13px}.card{border-radius:15px}.card.pad{padding:15px!important}
  .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}.kpi{min-height:112px!important;padding:13px!important}.kpi-value{font-size:1.35rem!important}.kpi-label{font-size:.7rem}.kpi-note{font-size:.66rem}
  .card-header{gap:9px;margin-bottom:13px}.card-header h2{font-size:1.08rem}.card-header p{font-size:.74rem}
  .grid-2,.grid-equal,.grid-3{grid-template-columns:1fr!important;gap:13px!important}
  .toolbar{gap:6px}.toolbar .button{flex:0 0 auto}
  .list-item{padding:11px;align-items:center}.list-item p{font-size:.72rem}.list-item .button{min-height:38px;padding:7px 9px}
  .table-wrap,.week-wrap{margin-left:-15px;margin-right:-15px;border-left:0;border-right:0;border-radius:0}.week-wrap::after,.table-wrap::after{display:block}
  .data-table{min-width:720px}.data-table th,.data-table td{padding:10px}
  .week-grid{min-width:980px}
  .week-grid>.week-cell:nth-child(8n+1){position:sticky;left:0;z-index:4;box-shadow:8px 0 14px rgba(15,29,42,.06)}.week-grid>.week-head:nth-child(8n+1){z-index:6}
  .clock-panel{padding:22px 14px!important}.clock-time{font-size:2.55rem}.clock-button{width:148px!important;height:148px!important}
  .modal{width:100%!important;max-width:none!important;max-height:94dvh;margin:auto 0 0!important;border-radius:22px 22px 0 0!important}.modal-body{max-height:64dvh;padding:17px}.modal-head{padding:17px}.modal-actions{position:sticky;bottom:0;padding:12px max(15px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(15px,env(safe-area-inset-left));background:#fff;border-top:1px solid var(--line);flex-wrap:wrap}.modal-actions .button{flex:1}
  .toast{right:13px;left:13px;bottom:calc(82px + env(safe-area-inset-bottom));text-align:center}
  .pwa-install{right:12px;bottom:calc(82px + env(safe-area-inset-bottom));width:calc(100vw - 24px)}
  .pwa-update{bottom:calc(82px + env(safe-area-inset-bottom))}
  .auth-page{display:block!important;min-height:100dvh;background:var(--bg)}.auth-brand{min-height:auto!important;padding:calc(24px + env(safe-area-inset-top)) 22px 18px!important;background:#183740}.auth-logo{width:min(245px,80vw)!important}.auth-brand h1,.auth-brand>div>p,.auth-points,.auth-brand>small{display:none!important}.auth-panel{min-height:auto!important;padding:18px 14px calc(24px + env(safe-area-inset-bottom))!important}.auth-card{padding:22px!important;border-radius:19px!important}.auth-card .mark{width:48px}
}
@media(max-width:430px){
  .kpi-grid{grid-template-columns:1fr 1fr!important}.kpi{min-height:106px!important}.kpi-value{font-size:1.22rem!important}
  .top-actions{max-width:48%}.date-nav strong{min-width:118px!important}
  .auth-card h2{font-size:1.35rem}.auth-actions{gap:6px;flex-wrap:wrap}
}
@media(max-width:350px){.kpi-grid{grid-template-columns:1fr!important}.nav button,.nav a{flex-basis:72px;min-width:72px}.top-actions{display:none}}

/* ShiftKlaar V4.3 — departments, payroll, team schedule and week availability */
.section-label{margin-top:6px;padding:9px 11px;border-radius:10px;background:var(--surface-2);color:var(--ink)}
.section-label strong{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em}
.department-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.department-card{overflow:hidden;display:grid;grid-template-columns:7px 1fr;box-shadow:var(--shadow)}
.department-accent{background:var(--dept,#00ad9c)}
.department-card-body{padding:18px}.department-card h2{margin:2px 0 0}.employee-mini-list{display:flex;flex-wrap:wrap;gap:6px;min-height:45px;margin:14px 0}
.employee-mini-list span{padding:5px 8px;border-radius:999px;background:var(--surface-2);font-size:.7rem;font-weight:750;color:var(--ink)}
.employee-mini-list small{color:var(--muted);font-size:.72rem}
.planner-control-card{border-color:#bfe8e3;background:linear-gradient(145deg,#fff,#f5fcfb)}
.department-filters{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:14px}.department-filter{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--muted);padding:8px 11px;font-weight:800;font-size:.72rem}.department-filter span{width:9px;height:9px;border-radius:50%;background:var(--dept,#7b8790)}.department-filter.active{border-color:var(--teal);background:var(--teal-soft);color:#006e65;box-shadow:0 0 0 2px rgba(0,173,156,.08)}
.employee-picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:9px;margin-bottom:15px}.employee-pick{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-left:4px solid var(--dept,#7b8790);border-radius:12px;background:#fff;padding:9px;text-align:left;color:var(--ink)}.employee-pick:hover,.employee-pick.selected{border-color:var(--teal);background:var(--teal-soft);box-shadow:0 0 0 3px rgba(0,173,156,.09)}.employee-pick .avatar{width:34px;height:34px;flex:0 0 34px}.employee-pick strong,.employee-pick small{display:block}.employee-pick strong{font-size:.78rem}.employee-pick small{font-size:.66rem;color:var(--muted);margin-top:2px}
.quick-day-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}.quick-day{border:1px solid var(--line);border-radius:11px;background:#fff;padding:10px 7px;color:var(--muted);text-align:center}.quick-day span,.quick-day strong,.quick-day small{display:block}.quick-day span{font-size:.65rem;text-transform:uppercase;font-weight:850}.quick-day strong{color:var(--ink);margin:3px 0}.quick-day small{font-size:.61rem}.quick-day.ready{border-color:#9edbd5;background:#f4fbfa;color:#007d72}.quick-day.ready:hover{background:var(--teal);color:#fff}.quick-day.ready:hover strong{color:#fff}
.week-grid.workforce{grid-template-columns:205px repeat(7,minmax(135px,1fr));overflow:visible}.department-band{grid-column:1/-1;display:flex;align-items:center;gap:9px;min-height:40px;padding:8px 12px;border-bottom:1px solid var(--line);background:#eef5f4;color:var(--ink)}.department-band>span{width:10px;height:10px;border-radius:50%;background:var(--dept,#7b8790)}.department-band small{color:var(--muted);font-weight:600}.department-band.open-band{background:#f4f5f6}.planning-cell{min-height:126px}.planning-cell.leave-day{background:#fff5f6}.planning-cell.unavailable-day{background:#fff9f0}.leave-warning{display:inline-flex;margin-bottom:5px;padding:3px 6px;border-radius:999px;background:var(--danger-soft);color:var(--danger);font-size:.61rem;font-weight:900}.availability-label{display:inline-flex;margin-bottom:5px;padding:3px 6px;border-radius:999px;font-size:.6rem;font-weight:850}.availability-label.available{background:var(--success-soft);color:var(--success)}.availability-label.unavailable{background:var(--warn-soft);color:var(--warn)}.shift.conflict{background:var(--danger-soft);border-left-color:var(--danger)}.shift small{display:block;margin-top:3px;color:var(--danger);font-size:.6rem;font-weight:850}
.modal-employee-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.modal-employee-card{border:1px solid var(--line);border-left:4px solid var(--dept,#7b8790);border-radius:10px;background:#fff;padding:8px;text-align:left}.modal-employee-card strong,.modal-employee-card small{display:block}.modal-employee-card strong{font-size:.73rem;color:var(--ink)}.modal-employee-card small{font-size:.62rem;color:var(--muted);margin-top:2px}.modal-employee-card.selected{border-color:var(--teal);background:var(--teal-soft)}
.dept-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--dept,#7b8790);margin-right:6px}.employee-table{min-width:1180px}
.employee-report{display:grid;gap:18px}.report-hero{display:flex;align-items:center;gap:13px}.avatar.large{width:58px;height:58px;border-radius:16px}.report-hero h3{margin:0;color:var(--ink)}.report-hero p{margin:4px 0 0;color:var(--muted)}.report-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.report-stat-grid>div{padding:12px;border:1px solid var(--line);border-radius:11px;background:#fbfdfd}.report-stat-grid span,.report-stat-grid strong{display:block}.report-stat-grid span{font-size:.65rem;color:var(--muted)}.report-stat-grid strong{margin-top:4px;color:var(--ink)}.report-section{border-top:1px solid var(--line);padding-top:14px}.report-section h4{margin:0 0 10px;color:var(--ink)}.report-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.report-fields span{padding:9px 10px;border-radius:9px;background:var(--surface-2);font-size:.76rem;color:var(--ink)}.report-fields small{display:block;color:var(--muted);font-size:.62rem;text-transform:uppercase;margin-bottom:3px}
.payroll-controls{background:linear-gradient(145deg,#fff,#f4fbfa)}.period-controls{display:flex;align-items:end;gap:9px;flex-wrap:wrap}.period-controls .field{min-width:170px}
.inline-warning{margin-top:7px;padding:5px 7px;border-radius:8px;background:var(--danger-soft);color:var(--danger);font-size:.66rem;font-weight:850}.request-card{align-items:center}
.report-list{display:grid;gap:10px}.report-row{width:100%;display:grid;grid-template-columns:62px 1fr;gap:13px;border:1px solid var(--line);border-radius:13px;background:#fff;padding:12px;text-align:left}.report-row:hover{border-color:#a9dcd7;background:#fbfefd}.report-date{display:grid;place-items:center;align-content:center;border-radius:11px;background:var(--ink);color:#fff;min-height:68px}.report-date strong{font-size:1.35rem}.report-date span{font-size:.65rem;text-transform:uppercase;color:var(--mint)}.report-main{display:grid;grid-template-columns:minmax(220px,1fr) auto;gap:9px 16px}.report-main h3{margin:0;color:var(--ink);font-size:.9rem}.report-main p{margin:4px 0 0;color:var(--muted);font-size:.73rem}.report-tags{display:flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:flex-end;font-size:.7rem;font-weight:800;color:var(--ink)}.report-extras{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:8px}.report-extras span{padding:7px 9px;border-radius:8px;background:var(--surface-2);font-size:.69rem;color:var(--ink)}.report-extras small{display:block;color:var(--muted);font-size:.58rem;text-transform:uppercase;margin-bottom:2px}
.template-grid{display:grid;gap:9px}.template-card{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--line);border-radius:12px;background:#fff}.template-card.inactive{opacity:.58;background:#f4f6f6}.template-card h3{margin:7px 0 3px;color:var(--ink);font-size:.86rem}.template-card p{margin:0;color:var(--muted);font-size:.72rem;line-height:1.45}.template-card small{display:block;margin-top:7px;color:var(--muted);font-size:.64rem}
.team-inline{display:flex;gap:5px;align-items:center;flex-wrap:wrap;margin-top:7px;font-size:.66rem}.team-inline span{color:var(--muted)}.team-inline b{padding:3px 6px;border-radius:999px;background:var(--teal-soft);color:#00766c}.team-week-grid{display:grid;grid-template-columns:repeat(4,minmax(230px,1fr));gap:12px}.team-day{padding:14px;border:1px solid var(--line);box-shadow:none}.team-day.working{border-color:#9bdcd5;background:linear-gradient(145deg,#fff,#f6fcfb)}.team-day-head h3{margin:3px 0 13px;color:var(--ink)}.my-shift-block,.day-team-list{display:grid;gap:7px}.my-shift-block>small,.day-team-list>small{font-size:.62rem;text-transform:uppercase;color:var(--muted);font-weight:850}.day-team-list{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}.team-member{display:flex;align-items:center;gap:8px;padding:7px;border-radius:9px;background:var(--surface-2)}.team-member .avatar{width:31px;height:31px;border-radius:9px;font-size:.65rem}.team-member strong,.team-member small{display:block}.team-member strong{font-size:.7rem;color:var(--ink)}.team-member small{font-size:.61rem;color:var(--muted);margin-top:2px}.team-member.open{opacity:.7}
.availability-quick-actions{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:13px}.availability-week-grid{display:grid;grid-template-columns:repeat(7,minmax(145px,1fr));gap:9px}.availability-day{border:1px solid var(--line);border-radius:13px;background:#fff;padding:10px;transition:.15s}.availability-day.available{border-color:#9cdcd4;background:#f7fcfb}.availability-day.unavailable{border-color:#eccca4;background:#fffaf3}.availability-day-head{display:flex;align-items:flex-start;justify-content:space-between;gap:6px}.availability-day-head p{margin:0;color:var(--muted);font-size:.66rem;text-transform:uppercase;font-weight:850}.availability-day-head strong{display:block;color:var(--ink);font-size:.8rem;margin-top:2px}.availability-toggle{width:100%;display:flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:10px;margin:10px 0;padding:9px;background:var(--success-soft);color:var(--success)}.unavailable .availability-toggle{background:var(--warn-soft);color:var(--warn)}.availability-toggle span{display:grid;place-items:center;width:21px;height:21px;border-radius:7px;background:rgba(255,255,255,.75);font-weight:900}.availability-toggle strong{font-size:.7rem}.availability-times{display:grid;grid-template-columns:1fr 1fr;gap:5px}.availability-times label,.availability-note{display:grid;gap:3px;font-size:.6rem;color:var(--muted);font-weight:750}.availability-times input,.availability-note input{width:100%;border:1px solid var(--line);border-radius:8px;background:#fff;padding:7px 5px;font-size:.7rem;color:var(--ink)}.availability-note{margin-top:6px}.availability-save{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}.availability-save .notice{flex:1}
.profile-summary{display:flex;align-items:center;gap:12px;margin-bottom:17px;padding-bottom:15px;border-bottom:1px solid var(--line)}.profile-avatar{width:58px;height:58px;border-radius:16px;background:linear-gradient(135deg,var(--teal),var(--mint));display:grid;place-items:center;color:var(--ink);font-weight:900;font-size:1.05rem}.profile-summary h3{margin:0;color:var(--ink)}.profile-summary p{margin:3px 0 0;color:var(--muted);font-size:.76rem}

@media(max-width:1200px){
  .department-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quick-day-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .team-week-grid{grid-template-columns:repeat(2,minmax(230px,1fr))}
  .availability-week-grid{grid-template-columns:repeat(4,minmax(145px,1fr))}
}
@media(max-width:780px){
  .department-card-grid{grid-template-columns:1fr}.employee-picker{display:flex;overflow-x:auto;padding-bottom:4px}.employee-pick{flex:0 0 210px}
  .quick-day-grid{display:flex;overflow-x:auto}.quick-day{flex:0 0 102px;min-height:76px}
  .week-grid.workforce{min-width:1120px}.week-grid.workforce>.employee-cell{position:sticky!important;left:0;z-index:4;box-shadow:8px 0 14px rgba(15,29,42,.06)}.week-grid.workforce>.week-head:first-child{position:sticky;left:0;z-index:7}.week-grid.workforce>.department-band{position:sticky;left:0;z-index:5;width:1120px}
  .modal-employee-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.report-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.report-fields{grid-template-columns:1fr}
  .period-controls{align-items:stretch}.period-controls .field{min-width:calc(50% - 5px)}.period-controls .button{flex:1}
  .report-row{grid-template-columns:48px 1fr}.report-main{grid-template-columns:1fr}.report-tags{justify-content:flex-start}.report-extras{grid-template-columns:1fr}
  .team-week-grid{grid-template-columns:1fr}.availability-week-grid{display:flex;overflow-x:auto;padding-bottom:6px}.availability-day{flex:0 0 210px}.availability-save{display:grid}.availability-save .button{width:100%}
}
@media(max-width:430px){
  .modal-employee-grid{grid-template-columns:1fr}.report-stat-grid{grid-template-columns:1fr 1fr}.period-controls .field{min-width:100%}.template-card{display:grid}.template-card .toolbar{justify-content:flex-end}
}


/* ShiftKlaar V4.4 — assigned operational lists and in-app payroll report */
.assignment-summary{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:9px}.assignment-summary span{font-size:.62rem;color:var(--muted);font-weight:800}.assignment-summary b{padding:3px 7px;border-radius:999px;background:var(--teal-soft);color:#00766c;font-size:.62rem}.assignment-summary.manager-only span{padding:3px 7px;border-radius:999px;background:var(--surface-2);color:var(--muted)}
.assignment-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:8px}.assignment-person{display:flex;align-items:center;gap:8px;padding:9px;border:1px solid var(--line);border-radius:11px;background:#fff;cursor:pointer}.assignment-person:has(input:checked){border-color:var(--teal);background:var(--teal-soft)}.assignment-person input{width:18px;height:18px;min-height:0}.assignment-person .avatar{flex:0 0 32px;width:32px;height:32px;border-radius:9px;font-size:.65rem}.assignment-person strong,.assignment-person small{display:block}.assignment-person strong{font-size:.72rem;color:var(--ink)}.assignment-person small{margin-top:2px;font-size:.61rem;color:var(--muted)}
.employee-control-list{display:grid;gap:10px}.employee-control-card{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px;border:1px solid var(--line);border-radius:13px;background:#fff}.employee-control-card h3{margin:7px 0 4px;color:var(--ink);font-size:.88rem}.employee-control-card p{margin:0;color:var(--muted);font-size:.72rem;line-height:1.45}.employee-control-card small{display:block;margin-top:6px;color:var(--muted);font-size:.63rem}.control-action{display:flex;align-items:center;gap:8px;text-align:right}.control-action small{max-width:120px}.closing-check-card{cursor:pointer}.closing-check-card.done{background:#f6fcfb;border-color:#9edbd5}.closing-check-main{display:flex;align-items:flex-start;gap:10px}.closing-check-main input{width:23px;height:23px;min-height:0;margin-top:3px}
.payroll-report-sheet{padding:26px!important}.payroll-report-head{display:flex;justify-content:space-between;gap:22px;padding-bottom:18px;border-bottom:2px solid var(--ink)}.payroll-report-head h2{margin:4px 0 6px;font-size:1.65rem;color:var(--ink)}.payroll-report-head p{margin:0;color:var(--muted)}.payroll-document-meta{display:grid;gap:8px;min-width:230px}.payroll-document-meta span{padding:9px 11px;border-radius:10px;background:var(--surface-2);color:var(--ink);font-size:.74rem}.payroll-document-meta small{display:block;margin-bottom:3px;color:var(--muted);font-size:.58rem;text-transform:uppercase}.payroll-document-section{margin-top:24px}.payroll-document-section h3{margin:0 0 10px;color:var(--ink)}.payroll-report-footer{margin-top:24px;padding-top:12px;border-top:1px solid var(--line);color:var(--muted);font-size:.66rem;text-align:center}
@media(max-width:780px){.assignment-picker{grid-template-columns:1fr}.employee-control-card{align-items:flex-start;display:grid}.control-action{justify-content:space-between;text-align:left}.payroll-report-head{display:grid}.payroll-document-meta{min-width:0}.payroll-report-sheet{padding:16px!important}}
@media print{
  .payroll-report-page .payroll-report-sheet{border:0!important;padding:0!important;box-shadow:none!important}.payroll-report-page .table-wrap{overflow:visible!important;margin:0!important}.payroll-report-page .data-table{min-width:0!important;font-size:9pt}.payroll-report-page .data-table th,.payroll-report-page .data-table td{padding:5px!important}.payroll-report-head{break-inside:avoid}.payroll-document-section{break-inside:auto}.payroll-report-footer{position:fixed;bottom:0;left:0;right:0;background:#fff}
}

/* ShiftKlaar V4.5 — scale planning, tours and subscriptions */
.subscription-mini{margin-top:12px;padding:11px;border:1px solid rgba(107,231,207,.28);border-radius:13px;background:rgba(13,39,47,.55)}
.subscription-mini small,.subscription-mini strong{display:block}.subscription-mini small{font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;color:#8fb4b3}.subscription-mini strong{margin:3px 0 8px;color:#fff;font-size:.76rem}.subscription-mini .upgrade-link{display:flex;align-items:center;justify-content:center;min-height:34px;padding:6px 9px;border-radius:9px;background:var(--mint);color:var(--ink);font-size:.67rem;font-weight:900;text-decoration:none}
.plan-feature-list{display:grid;gap:8px;margin:16px 0}.plan-feature-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff}.plan-feature-row span{font-size:.72rem;color:var(--ink)}
.layout-switch{display:inline-flex;padding:3px;border:1px solid var(--line);border-radius:11px;background:var(--surface-2)}.layout-switch button{border:0;border-radius:8px;background:transparent;padding:8px 11px;color:var(--muted);font-size:.68rem;font-weight:850;cursor:pointer}.layout-switch button.active{background:#fff;color:var(--ink);box-shadow:0 2px 8px rgba(15,29,42,.08)}
.planner-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.planner-toolbar-actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.planner-stats{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:8px;margin:12px 0}.planner-stat{padding:10px 12px;border:1px solid var(--line);border-radius:11px;background:#fff}.planner-stat small,.planner-stat strong{display:block}.planner-stat small{font-size:.58rem;color:var(--muted);text-transform:uppercase;font-weight:850}.planner-stat strong{margin-top:4px;color:var(--ink);font-size:.9rem}
.day-column-grid{display:grid;grid-template-columns:repeat(7,minmax(210px,1fr));gap:10px;min-width:1540px}.day-column{min-height:390px;padding:11px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2)}.day-column.today{border-color:var(--teal);background:#f6fcfb}.day-column-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding-bottom:9px;border-bottom:1px solid var(--line)}.day-column-head h3{margin:3px 0 0;color:var(--ink);font-size:.84rem}.day-column-head p{margin:0;color:var(--muted);font-size:.61rem;text-transform:uppercase;font-weight:850}.day-column-metrics{display:flex;gap:5px;flex-wrap:wrap;margin:9px 0}.day-column-metrics span{padding:4px 6px;border-radius:7px;background:#fff;color:var(--muted);font-size:.58rem;font-weight:750}.day-add{width:100%;min-height:38px;margin-bottom:8px;border:1px dashed #8bcfc8;border-radius:10px;background:var(--teal-soft);color:#006e65;font-weight:900;cursor:pointer}.day-shift-list{display:grid;gap:7px}.day-shift{padding:9px;border:1px solid var(--line);border-left:4px solid var(--shift-color,var(--teal));border-radius:10px;background:#fff;cursor:pointer}.day-shift:hover{transform:translateY(-1px);box-shadow:0 5px 14px rgba(15,29,42,.07)}.day-shift strong,.day-shift small{display:block}.day-shift strong{color:var(--ink);font-size:.72rem}.day-shift small{margin-top:3px;color:var(--muted);font-size:.61rem}.day-shift .shift-dept{margin-top:6px;display:inline-block;padding:3px 6px;border-radius:999px;background:var(--surface-2);font-size:.57rem;color:var(--ink)}
.wizard-shell{min-height:470px}.wizard-progress{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:16px}.wizard-step{padding:8px;border-radius:10px;background:var(--surface-2);color:var(--muted);font-size:.62rem;font-weight:850;text-align:center}.wizard-step.active{background:var(--teal-soft);color:#006e65}.wizard-step.done{background:var(--success-soft);color:var(--success)}.wizard-filters{display:grid;grid-template-columns:minmax(210px,1.6fr) repeat(3,minmax(130px,.8fr));gap:8px;margin-bottom:12px}.wizard-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;max-height:430px;overflow:auto;padding:2px}.wizard-card{position:relative;display:flex;align-items:flex-start;gap:10px;min-height:92px;padding:12px;border:1px solid var(--line);border-radius:13px;background:#fff;text-align:left;cursor:pointer}.wizard-card:hover,.wizard-card.selected{border-color:var(--teal);background:#f6fcfb}.wizard-card.leave-warning{border-color:#e6a35f;background:#fffaf4}.wizard-card .avatar{flex:0 0 40px;width:40px;height:40px;border-radius:12px}.wizard-card h3{margin:0;color:var(--ink);font-size:.79rem}.wizard-card p{margin:3px 0 0;color:var(--muted);font-size:.64rem;line-height:1.4}.wizard-card .card-badges{display:flex;gap:4px;flex-wrap:wrap;margin-top:7px}.wizard-card .card-badges span{padding:3px 6px;border-radius:999px;background:var(--surface-2);color:var(--ink);font-size:.55rem}.wizard-card .warning-text{margin-top:7px;color:#9b5200;font-weight:850}.option-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.option-card{min-height:115px;padding:14px;border:1px solid var(--line);border-radius:13px;background:#fff;text-align:left;cursor:pointer}.option-card:hover,.option-card.selected{border-color:var(--teal);background:var(--teal-soft)}.option-card h3{margin:0;color:var(--ink);font-size:.84rem}.option-card p{margin:6px 0 0;color:var(--muted);font-size:.68rem;line-height:1.45}.option-card .option-color{width:22px;height:6px;border-radius:999px;margin-bottom:10px;background:var(--option-color,var(--teal))}.wizard-selection{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-bottom:12px;padding:9px;border-radius:10px;background:var(--surface-2)}.wizard-selection span{padding:4px 7px;border-radius:8px;background:#fff;color:var(--ink);font-size:.62rem;font-weight:800}.wizard-actions{display:flex;justify-content:space-between;gap:8px;margin-top:16px}.wizard-time-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}.wizard-time-summary div{padding:10px;border-radius:10px;background:var(--surface-2)}.wizard-time-summary small,.wizard-time-summary strong{display:block}.wizard-time-summary small{font-size:.56rem;color:var(--muted);text-transform:uppercase}.wizard-time-summary strong{margin-top:3px;color:var(--ink)}
.shift-template-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.shift-template-card{padding:14px;border:1px solid var(--line);border-top:5px solid var(--template-color,var(--teal));border-radius:14px;background:#fff}.shift-template-card.inactive{opacity:.58}.shift-template-card h3{margin:0;color:var(--ink);font-size:.9rem}.shift-template-card p{margin:5px 0 0;color:var(--muted);font-size:.68rem}.shift-template-card .template-time{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}.shift-template-card .template-time span{padding:5px 7px;border-radius:8px;background:var(--surface-2);color:var(--ink);font-size:.62rem;font-weight:800}.weekday-picker{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.weekday-picker label{display:grid;place-items:center;gap:4px;padding:7px;border:1px solid var(--line);border-radius:9px;font-size:.58rem;color:var(--muted)}.weekday-picker label:has(input:checked){border-color:var(--teal);background:var(--teal-soft);color:#006e65}.weekday-picker input{min-height:0;width:16px;height:16px}
.employee-search-toolbar{display:grid;grid-template-columns:minmax(240px,1.4fr) repeat(4,minmax(130px,.7fr));gap:8px;margin-bottom:12px}.search-result-count{margin:0 0 9px;color:var(--muted);font-size:.68rem}.department-multi-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.department-choice{display:flex;align-items:center;gap:8px;padding:9px;border:1px solid var(--line);border-radius:10px;background:#fff}.department-choice:has(input:checked){border-color:var(--teal);background:var(--teal-soft)}.department-choice input{min-height:0;width:18px;height:18px}.department-choice span{font-size:.68rem;color:var(--ink)}
.own-schedule-grid{display:grid;grid-template-columns:repeat(4,minmax(210px,1fr));gap:10px}.own-day-card{padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff}.own-day-card.today{border-color:var(--teal);background:#f6fcfb}.own-day-card h3{margin:3px 0 10px;color:var(--ink)}.own-day-card>p{margin:0;color:var(--muted);font-size:.62rem;text-transform:uppercase;font-weight:850}.own-shift{padding:10px;border-radius:10px;background:var(--surface-2)}.own-shift strong,.own-shift small{display:block}.own-shift strong{color:var(--ink);font-size:.76rem}.own-shift small{margin-top:4px;color:var(--muted);font-size:.63rem}.own-hours-total{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;margin-bottom:12px;border-radius:12px;background:var(--ink);color:#fff}.own-hours-total small{color:#b9cecf}
.tour-overlay{position:fixed;inset:0;z-index:1000;background:rgba(5,17,25,.64);display:grid;place-items:center;padding:18px}.tour-dialog{width:min(560px,100%);border-radius:20px;background:#fff;box-shadow:0 28px 70px rgba(0,0,0,.28);overflow:hidden}.tour-visual{min-height:150px;display:grid;place-items:center;background:linear-gradient(135deg,#0e2b32,#17655f);color:#fff;font-size:3rem}.tour-body{padding:22px}.tour-body .eyebrow{margin-bottom:7px}.tour-body h2{margin:0;color:var(--ink)}.tour-body p{margin:8px 0 0;color:var(--muted);line-height:1.55}.tour-dots{display:flex;gap:5px;margin:16px 0}.tour-dot{width:8px;height:8px;border-radius:999px;background:var(--line)}.tour-dot.active{width:24px;background:var(--teal)}.tour-actions{display:flex;align-items:center;justify-content:space-between;gap:8px}.tour-actions>div{display:flex;gap:7px}.tour-list{display:grid;gap:8px}.tour-list-item{display:flex;gap:10px;align-items:flex-start;padding:11px;border:1px solid var(--line);border-radius:11px;background:#fff}.tour-list-item b{display:grid;place-items:center;flex:0 0 27px;width:27px;height:27px;border-radius:8px;background:var(--teal-soft);color:#006e65}.tour-list-item strong,.tour-list-item small{display:block}.tour-list-item strong{font-size:.74rem;color:var(--ink)}.tour-list-item small{margin-top:3px;font-size:.64rem;color:var(--muted)}
.subscription-card{padding:18px;border:1px solid var(--line);border-radius:15px;background:#fff}.subscription-card.featured{border-color:var(--teal);box-shadow:0 10px 28px rgba(13,153,139,.12)}.subscription-card h3{margin:0;color:var(--ink)}.subscription-card .price{margin:10px 0 3px;font-size:1.55rem;font-weight:950;color:var(--ink)}.subscription-card .promo-price{color:#00796f;font-weight:900}.subscription-card ul{padding-left:18px;color:var(--muted);font-size:.7rem;line-height:1.8}.subscription-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.feature-override-list{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}.feature-override-list h3{margin:0 0 8px;color:var(--ink);font-size:.82rem}.check-row{display:flex!important;align-items:center;gap:8px}.check-row input{width:18px;height:18px;min-height:0}.muted{color:var(--muted);font-size:.7rem}
.schedule-print-page{background:#fff}.schedule-print-sheet{padding:20px}.schedule-print-head{display:flex;justify-content:space-between;gap:20px;padding-bottom:15px;border-bottom:2px solid var(--ink)}.schedule-print-head h2{margin:3px 0;color:var(--ink)}.schedule-print-head p{margin:3px 0;color:var(--muted)}.schedule-print-meta{text-align:right;font-size:.68rem;color:var(--muted)}.schedule-print-grid{margin-top:15px}.schedule-print-footer{margin-top:15px;padding-top:10px;border-top:1px solid var(--line);font-size:.62rem;color:var(--muted);text-align:center}

@media(max-width:1200px){.wizard-card-grid,.option-card-grid,.shift-template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.employee-search-toolbar{grid-template-columns:repeat(3,minmax(0,1fr))}.employee-search-toolbar .field:first-child{grid-column:span 2}.own-schedule-grid{grid-template-columns:repeat(2,minmax(210px,1fr))}.subscription-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:780px){.planner-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.planner-toolbar{align-items:stretch}.planner-toolbar-actions{width:100%}.planner-toolbar-actions .button{flex:1}.day-column-grid{display:flex;overflow-x:auto;min-width:0}.day-column{flex:0 0 255px}.wizard-progress{grid-template-columns:repeat(2,1fr)}.wizard-filters,.employee-search-toolbar{grid-template-columns:1fr}.employee-search-toolbar .field:first-child{grid-column:auto}.wizard-card-grid,.option-card-grid,.shift-template-grid,.subscription-grid{grid-template-columns:1fr}.wizard-card-grid{max-height:none}.wizard-card{min-height:84px}.wizard-actions{position:sticky;bottom:0;padding:10px 0;background:#fff}.weekday-picker{grid-template-columns:repeat(4,1fr)}.own-schedule-grid{grid-template-columns:1fr}.department-multi-picker{grid-template-columns:1fr}.tour-body{padding:18px}.tour-actions{align-items:stretch;display:grid}.tour-actions>div{justify-content:flex-end}.schedule-print-head{display:grid}.schedule-print-meta{text-align:left}}
@media print{
  body[data-printing="schedule"] .sidebar,body[data-printing="schedule"] .topbar,body[data-printing="schedule"] .mobile-nav,body[data-printing="schedule"] .planner-toolbar,body[data-printing="schedule"] .button,body[data-printing="schedule"] .install-banner{display:none!important}
  body[data-printing="schedule"] .app-main{margin:0!important;padding:0!important}body[data-printing="schedule"] #content{padding:0!important}body[data-printing="schedule"] .schedule-print-sheet{border:0!important;box-shadow:none!important;padding:0!important}
  body[data-printing="schedule"] .schedule-print-grid{overflow:visible!important}.schedule-print-page{page-break-inside:auto}.day-column-grid{min-width:0!important;grid-template-columns:repeat(7,1fr)!important;gap:4px!important}.day-column{min-height:0!important;padding:5px!important;border-radius:5px!important}.day-shift{padding:4px!important;border-radius:4px!important}.day-shift strong{font-size:7.5pt!important}.day-shift small,.day-column-metrics span{font-size:6.5pt!important}.day-add{display:none!important}
}
@page{size:A4 landscape;margin:9mm}
.packages-page{min-height:100vh;padding:42px clamp(18px,5vw,72px);background:linear-gradient(160deg,#f4f8f7,#fff)}.packages-hero{max-width:760px;margin:0 auto 30px;text-align:center}.packages-logo img{width:180px;max-width:50vw}.packages-hero h1{margin:10px 0;color:var(--ink);font-size:clamp(2rem,5vw,3.6rem)}.packages-hero>p:last-child{margin:0 auto;color:var(--muted);line-height:1.6;max-width:670px}.packages-grid{max-width:1120px;margin:0 auto}.subscription-card h2{margin:12px 0 0;color:var(--ink)}.subscription-card .price small{font-size:.72rem;color:var(--muted)}.package-note{color:var(--muted);font-size:.68rem}.packages-terms{max-width:1120px;margin:18px auto}.packages-terms h2{margin-top:0}.packages-terms strong{color:var(--ink)}.packages-terms p{color:var(--muted);font-size:.72rem;line-height:1.55}.packages-footer{max-width:1120px;margin:20px auto 0;display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:.7rem}.packages-footer a{color:#00766c;font-weight:850;text-decoration:none}@media(max-width:780px){.packages-page{padding:24px 14px}.packages-footer{display:grid;text-align:center}}
/* V4.5 concrete component selectors */
.planner-summary .planner-stats>span{padding:10px 12px;border:1px solid var(--line);border-radius:11px;background:#fff}.planner-summary .planner-stats small,.planner-summary .planner-stats strong{display:block}.planner-summary .planner-stats small{font-size:.58rem;color:var(--muted);text-transform:uppercase;font-weight:850}.planner-summary .planner-stats strong{margin-top:4px;color:var(--ink);font-size:.9rem}
.day-column>header{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding-bottom:9px;border-bottom:1px solid var(--line)}.day-column>header h3{margin:3px 0 0;color:var(--ink);font-size:.84rem}.day-column>header .day-add{width:36px;min-height:36px;margin:0}.day-column-stats{display:flex;gap:5px;flex-wrap:wrap;margin:9px 0}.day-column-stats span{padding:4px 6px;border-radius:7px;background:#fff;color:var(--muted);font-size:.58rem;font-weight:750}.day-shift-stack{display:grid;gap:7px}.day-shift{display:flex;align-items:center;gap:8px;width:100%;text-align:left;border-left-color:var(--dept,var(--teal))}.day-shift .avatar{flex:0 0 31px;width:31px;height:31px;border-radius:9px}.day-shift>b{margin-left:auto}.day-shift.conflict{border-color:#dc9a58;background:#fff9f2}
.wizard-progress>span{padding:8px;border-radius:10px;background:var(--surface-2);color:var(--muted);font-size:.62rem;font-weight:850;text-align:center}.wizard-progress>span.active{background:var(--teal-soft);color:#006e65}.wizard-person-card{display:flex;align-items:flex-start;gap:10px;min-height:108px;padding:12px;border:1px solid var(--line);border-radius:13px;background:#fff;text-align:left;cursor:pointer}.wizard-person-card:hover{border-color:var(--teal);background:#f6fcfb}.wizard-person-card.on-leave{border-color:#e5a25d;background:#fff9f2}.wizard-person-card.not-available{opacity:.7}.wizard-person-card .avatar{flex:0 0 40px;width:40px;height:40px;border-radius:12px}.wizard-person-card>span:nth-child(2){min-width:0}.wizard-person-card strong,.wizard-person-card small,.wizard-person-card em{display:block}.wizard-person-card strong{font-size:.77rem;color:var(--ink)}.wizard-person-card small{margin-top:3px;font-size:.61rem;color:var(--muted)}.wizard-person-card em{margin-top:6px;font-size:.59rem;color:#00766c;font-style:normal;font-weight:800}.wizard-person-card>b{margin-left:auto;color:#a45700}.wizard-person-card.open-card{align-items:center;justify-content:center;border-style:dashed}.wizard-option-card{min-height:116px;padding:14px;border:1px solid var(--line);border-top:4px solid var(--dept,var(--teal));border-radius:13px;background:#fff;text-align:left;cursor:pointer}.wizard-option-card:hover{border-color:var(--teal);background:var(--teal-soft)}.wizard-option-card strong,.wizard-option-card small,.wizard-option-card>span:last-child{display:block}.wizard-option-card strong{color:var(--ink);font-size:.82rem}.wizard-option-card small{margin-top:5px;color:var(--muted);font-size:.65rem}.wizard-option-card>span:last-child{margin-top:7px;color:#00766c;font-size:.58rem;font-weight:800}.department-dot{display:block;width:24px;height:6px;margin-bottom:10px;border-radius:999px;background:var(--dept,var(--teal))}.wizard-selection-summary{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px;padding:10px;border-radius:11px;background:var(--surface-2)}.wizard-selection-summary strong,.wizard-selection-summary span{display:block}.wizard-selection-summary strong{color:var(--ink);font-size:.75rem}.wizard-selection-summary span{color:var(--muted);font-size:.65rem}
.schedule-print-sheet{padding:24px;border:1px solid var(--line);border-radius:15px;background:#fff}.schedule-print-sheet>header{display:flex;align-items:center;gap:14px;padding-bottom:16px;border-bottom:2px solid var(--ink)}.schedule-print-sheet>header img{width:48px;height:48px}.schedule-print-sheet>header h1{margin:0;color:var(--ink)}.schedule-print-sheet>header p,.schedule-print-sheet>header small{display:block;margin:4px 0 0;color:var(--muted)}.print-day-grid{display:grid;grid-template-columns:repeat(7,minmax(150px,1fr));gap:8px;margin-top:14px}.print-day-grid>article{padding:9px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2)}.print-day-grid h2{margin:0 0 8px;color:var(--ink);font-size:.76rem}.print-day-grid h2 small{display:block;margin-top:2px;color:var(--muted);font-size:.58rem}.print-shift{padding:7px;margin-top:6px;border-left:4px solid var(--dept,var(--teal));border-radius:7px;background:#fff}.print-shift strong,.print-shift span,.print-shift small{display:block}.print-shift strong{color:var(--ink);font-size:.65rem}.print-shift span,.print-shift small{margin-top:2px;color:var(--muted);font-size:.56rem}.print-shift p{margin:5px 0 0;font-size:.55rem;color:var(--ink)}.schedule-print-sheet>footer{margin-top:12px;padding-top:8px;border-top:1px solid var(--line);text-align:center;color:var(--muted);font-size:.58rem}
.tour-slide{text-align:center;padding:4px 0}.tour-step-number{display:grid;place-items:center;width:60px;height:60px;margin:0 auto 13px;border-radius:18px;background:linear-gradient(135deg,var(--teal),var(--mint));color:var(--ink);font-size:1.5rem;font-weight:950}.tour-slide p{max-width:520px;margin:0 auto;color:var(--muted);line-height:1.6}.tour-slide .tour-dots{justify-content:center}.tour-slide .tour-dots span{width:8px;height:8px;border-radius:999px;background:var(--line)}.tour-slide .tour-dots span.active{width:24px;background:var(--teal)}.tour-topic-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.tour-topic-grid>div{padding:14px;border:1px solid var(--line);border-radius:12px;background:#fff}.tour-topic-grid span{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--teal-soft);color:#006e65;font-weight:900}.tour-topic-grid h3{margin:9px 0 4px;color:var(--ink);font-size:.78rem}.tour-topic-grid p{margin:0;color:var(--muted);font-size:.65rem;line-height:1.45}
@media(max-width:780px){.tour-topic-grid{grid-template-columns:1fr 1fr}.print-day-grid{display:flex;overflow-x:auto}.print-day-grid>article{flex:0 0 190px}}
@media print{.print-options,.no-print{display:none!important}.schedule-print-sheet{border:0!important;padding:0!important}.print-day-grid{grid-template-columns:repeat(7,1fr)!important;display:grid!important;overflow:visible!important}.print-day-grid>article{padding:4px!important}.print-shift{padding:4px!important}.schedule-print-sheet>header img{width:34px;height:34px}}

/* V4.5 print matrix for the selected planner layout */
.print-employee-wrap{overflow:auto;margin-top:14px}.print-employee-grid{width:100%;min-width:1160px;border-collapse:separate;border-spacing:4px;table-layout:fixed}.print-employee-grid th,.print-employee-grid td{padding:6px;vertical-align:top;border:1px solid var(--line);border-radius:8px;background:var(--surface-2)}.print-employee-grid thead th{color:var(--ink);font-size:.64rem;text-align:left}.print-employee-grid thead th:first-child{width:150px}.print-employee-grid th small{display:block;margin-top:3px;color:var(--muted);font-size:.52rem}.print-employee-grid tbody>tr>th{color:var(--ink);font-size:.62rem;background:#fff}.print-matrix-shift{padding:5px;margin-bottom:4px;border-left:4px solid var(--dept,var(--teal));border-radius:6px;background:#fff}.print-matrix-shift strong,.print-matrix-shift small{display:block}.print-matrix-shift strong{font-size:.57rem;color:var(--ink)}.print-matrix-shift small{margin-top:2px;font-size:.5rem;color:var(--muted)}.print-matrix-shift p{margin:4px 0 0;font-size:.5rem;color:var(--ink)}
@media print{.print-employee-wrap{overflow:visible!important}.print-employee-grid{min-width:0!important;border-spacing:2px!important}.print-employee-grid th,.print-employee-grid td{padding:3px!important;border-radius:3px!important}.print-employee-grid thead th:first-child{width:105px!important}.print-matrix-shift{padding:3px!important;margin-bottom:2px!important}.print-matrix-shift strong{font-size:6.3pt!important}.print-matrix-shift small,.print-matrix-shift p{font-size:5.4pt!important}}
/* V4.5 expanded filters */
.wizard-filters{grid-template-columns:minmax(210px,1.6fr) repeat(4,minmax(120px,.75fr))}
.employee-search-toolbar{grid-template-columns:minmax(240px,1.4fr) repeat(5,minmax(115px,.68fr))}
@media(max-width:1280px){.wizard-filters{grid-template-columns:repeat(3,minmax(0,1fr))}.wizard-filters>input{grid-column:span 2}.employee-search-toolbar{grid-template-columns:repeat(3,minmax(0,1fr))}.employee-search-toolbar .field:first-child{grid-column:span 2}}
@media(max-width:780px){.wizard-filters,.employee-search-toolbar{grid-template-columns:1fr}.wizard-filters>input,.employee-search-toolbar .field:first-child{grid-column:auto}}

/* V4.5: brede snelle-planningdialoog voor grote teams. */
.modal.modal-wide{width:min(1120px,calc(100% - 24px))}


/* V4.6: HACCP-archief, meldingen en visuele rondleidingen */
.nav button{position:relative}.nav-count{display:inline-grid;place-items:center;min-width:21px;height:21px;padding:0 6px;margin-left:auto;border-radius:999px;background:#d92f43;color:#fff;font-size:.62rem;font-weight:950;line-height:1;box-shadow:0 0 0 2px rgba(17,37,48,.95)}.nav-count[hidden]{display:none!important}.corner-count{position:absolute;right:7px;top:7px;display:grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:#d92f43;color:#fff;font-size:.62rem;font-weight:950;box-shadow:0 0 0 2px #fff;z-index:2}.shift .corner-count{right:4px;top:4px}.day-shift,.open-shift-response-card{position:relative}.toolbar.compact{gap:5px;margin-bottom:7px}
.open-shift-response-list{display:grid;gap:9px}.open-shift-response-card{display:grid;gap:4px;width:100%;padding:14px 44px 14px 14px;border:1px solid var(--line);border-radius:13px;background:#fff;text-align:left}.open-shift-response-card:hover{border-color:#8dd7cf;background:#f7fcfb}.open-shift-response-card strong{color:var(--ink);font-size:.86rem}.open-shift-response-card small,.open-shift-date{color:var(--muted);font-size:.68rem}.open-shift-applicants{display:grid;gap:9px}.open-shift-applicant{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:11px;align-items:start;padding:12px;border:1px solid var(--line);border-radius:12px;background:#fff}.open-shift-applicant .avatar{width:42px;height:42px}.open-shift-applicant h3{margin:0;color:var(--ink);font-size:.82rem}.open-shift-applicant p{margin:4px 0;color:var(--muted);font-size:.7rem;line-height:1.45}.open-shift-applicant small{color:var(--muted);font-size:.62rem}.open-shift-applicant .applicant-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.assignment-panel{grid-column:1/-1;padding:13px;border:1px solid var(--line);border-radius:13px;background:var(--surface-2)}.assignment-panel>label{display:block;margin-bottom:8px;color:var(--ink);font-size:.72rem;font-weight:850}.assignment-scope-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.assignment-scope-option{display:flex;align-items:center;gap:8px;padding:10px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:.7rem;font-weight:800;color:var(--ink)}.assignment-target-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:10px;max-height:230px;overflow:auto}.assignment-target-option{display:flex;align-items:flex-start;gap:8px;padding:9px;border:1px solid var(--line);border-radius:10px;background:#fff}.assignment-target-option strong,.assignment-target-option small{display:block}.assignment-target-option strong{color:var(--ink);font-size:.7rem}.assignment-target-option small{margin-top:2px;color:var(--muted);font-size:.6rem}.assignment-summary{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}.assignment-summary .badge{font-size:.59rem}
.haccp-filter-card{position:sticky;top:78px;z-index:5}.haccp-filter-grid{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr));gap:9px;align-items:end}.haccp-only-deviations{min-height:44px;padding:10px;border:1px solid var(--line);border-radius:10px;background:#fff}.quick-periods{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.haccp-archive-table tbody tr{cursor:pointer}.haccp-archive-table tbody tr:hover td{background:#eef9f7}.haccp-detail-sheet{max-width:920px;margin:0 auto}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.detail-grid>div{padding:12px;border:1px solid var(--line);border-radius:11px;background:var(--surface-2)}.detail-grid>.full{grid-column:1/-1}.detail-grid small,.detail-grid strong{display:block}.detail-grid small{font-size:.6rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:850}.detail-grid strong{margin-top:4px;color:var(--ink)}.detail-grid p{margin:5px 0 0;color:var(--ink);font-size:.75rem;line-height:1.5}.detail-grid .deviation-box{border-color:#e4a7af;background:var(--danger-soft)}.haccp-record-summary{display:grid;gap:8px}.employee-control-card.done{background:#f7fbfa;border-color:#bde1dd}
.tour-dialog{width:min(1000px,calc(100% - 24px))}.tour-dialog .modal-body{max-height:72vh}.visual-tour-slide,.visual-tour{display:grid;gap:14px}.tour-image-frame,.visual-tour-frame{overflow:hidden;border:1px solid var(--line);border-radius:15px;background:#e9efef;box-shadow:0 12px 35px rgba(20,46,57,.12)}.tour-image-frame img,.visual-tour-frame img{display:block;width:100%;height:auto;max-height:480px;object-fit:contain;background:#f4f7f7}.visual-tour-slide>p,.visual-tour-copy{margin:0;color:var(--ink);font-size:.86rem;line-height:1.55}.tour-progress{height:8px;border-radius:999px;background:#e2eaea;overflow:hidden}.tour-progress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--teal),var(--mint))}.tour-preview-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:16px}.tour-preview-strip img{width:100%;aspect-ratio:16/10;object-fit:cover;border:1px solid var(--line);border-radius:10px}.tour-preview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}.tour-preview-grid article{overflow:hidden;border:1px solid var(--line);border-radius:13px;background:#fff}.tour-preview-grid img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#edf2f2}.tour-preview-grid article>div{padding:11px}.tour-preview-grid span{display:inline-grid;place-items:center;width:25px;height:25px;border-radius:8px;background:var(--teal-soft);color:#006e65;font-size:.65rem;font-weight:900}.tour-preview-grid h3{display:inline;margin-left:7px;color:var(--ink);font-size:.76rem}.tour-preview-grid p{margin:6px 0 0;color:var(--muted);font-size:.65rem;line-height:1.45}
@media(max-width:980px){.haccp-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.assignment-target-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tour-preview-strip{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:780px){.nav-count{position:absolute;right:7px;top:4px;margin:0;box-shadow:0 0 0 2px var(--ink)}.haccp-filter-card{position:static}.haccp-filter-grid,.assignment-scope-grid,.assignment-target-grid,.detail-grid,.tour-preview-grid{grid-template-columns:1fr}.detail-grid>.full{grid-column:auto}.open-shift-applicant{grid-template-columns:38px minmax(0,1fr)}.open-shift-applicant .applicant-actions{grid-column:1/-1;justify-content:flex-start}.tour-dialog .modal-body{padding:14px}.tour-image-frame img,.visual-tour-frame img{max-height:55vh}.tour-preview-strip{display:flex;overflow-x:auto}.tour-preview-strip img{flex:0 0 230px}}
.assignment-scope-box{padding:13px;border:1px solid var(--line);border-radius:13px;background:var(--surface-2)}.assignment-scope-box>.help{margin:6px 0 10px;color:var(--muted);font-size:.65rem;line-height:1.45}.assignment-scope-panel[hidden]{display:none!important}.assignment-scope-panel>.field{margin-top:9px}
/* V4.6 open-dienst reacties */
.open-shift-applicant .list-main{grid-column:1/3;min-width:0}.open-shift-applicant .list-main>div:last-child{min-width:0}.open-shift-applicant .applicant-actions{grid-column:3;align-self:center}
@media(max-width:780px){.open-shift-applicant .list-main{grid-column:1/-1}.open-shift-applicant .applicant-actions{grid-column:1/-1}}

/* V4.7 Competitive Edge */
.top-date-input{border:1px solid var(--line);border-radius:11px;padding:10px 12px;background:#fff;color:var(--ink);font-weight:800}
.operation-hero,.migration-hero,.operation-personnel-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;background:linear-gradient(135deg,#102231,#183849);color:#fff;border-color:#24495c;overflow:hidden;position:relative}.operation-hero:after,.migration-hero:after,.operation-personnel-hero:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-95px;top:-120px;background:rgba(19,194,176,.16)}.operation-hero h2,.migration-hero h2,.operation-personnel-hero h2{margin:3px 0 7px;font-size:clamp(1.5rem,3vw,2.35rem);letter-spacing:-.045em}.operation-hero p,.migration-hero p,.operation-personnel-hero p{margin:0;color:rgba(255,255,255,.7);max-width:730px;line-height:1.55}.operation-score{position:relative;z-index:1;flex:0 0 128px;width:128px;height:128px;border-radius:50%;display:grid;place-items:center;align-content:center;border:9px solid rgba(255,255,255,.13);background:rgba(255,255,255,.06)}.operation-score strong{font-size:1.75rem;letter-spacing:-.05em}.operation-score span{font-size:.66rem;text-transform:uppercase;letter-spacing:.08em;color:rgba(255,255,255,.65)}.operation-score.good{border-color:#4ed4b6}.operation-score.warn{border-color:#f5b85b}.operation-score.danger{border-color:#f06d7b}
.operation-phase-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.operation-phase .card-header{align-items:center}.operation-phase .card-header h2{display:inline;margin-left:8px}.phase-icon{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--teal-soft);color:#007a70;font-weight:900}.operation-task-list{display:grid;gap:8px}.operation-task-row{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:start;padding:11px;border:1px solid var(--line);border-radius:11px;background:#fff}.operation-task-row.done{background:#f4fbf8;border-color:#bfe5da}.operation-task-row.issue{background:var(--danger-soft);border-color:#efbcc3}.operation-task-row.personnel{width:100%;text-align:left;cursor:pointer}.operation-task-row.personnel:hover{border-color:#7dd0c6}.operation-task-row strong,.operation-task-row small,.operation-task-row p,.operation-task-row em{display:block}.operation-task-row strong{color:var(--ink);font-size:.78rem}.operation-task-row small{margin-top:3px;color:var(--muted);font-size:.63rem}.operation-task-row p{margin:5px 0 0;color:var(--muted);font-size:.68rem;line-height:1.45}.operation-task-row em{margin-top:5px;color:var(--danger);font-size:.65rem}.task-check{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:var(--surface-2);color:var(--muted);font-weight:900}.done .task-check{background:var(--success-soft);color:var(--success)}.issue .task-check{background:#fff;color:var(--danger)}.operation-timeline{display:grid;gap:0;margin:0;padding:0;list-style:none}.operation-timeline li{position:relative;padding:12px 10px 12px 38px;border-left:2px solid var(--line);margin-left:12px}.operation-timeline li:before{content:"";position:absolute;left:-8px;top:18px;width:14px;height:14px;border-radius:50%;background:#fff;border:3px solid var(--line)}.operation-timeline li.done:before{border-color:var(--teal);background:var(--teal)}.operation-timeline strong,.operation-timeline span{display:block}.operation-timeline strong{font-size:.78rem;color:var(--ink)}.operation-timeline span{font-size:.66rem;color:var(--muted);margin-top:2px}
.announcement-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.announcement-card{border-top:4px solid var(--teal)}.announcement-card.priority-important{border-top-color:#e99c47}.announcement-card.priority-critical{border-top-color:var(--danger)}.announcement-card.inactive{opacity:.6}.announcement-card h2{margin-top:8px}.announcement-body{color:var(--text);line-height:1.6;font-size:.82rem;white-space:pre-wrap}.read-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px}.read-metrics>div{padding:10px;border-radius:11px;background:var(--surface-2);text-align:center}.read-metrics strong,.read-metrics span{display:block}.read-metrics strong{font-size:1.05rem;color:var(--ink)}.read-metrics span{font-size:.61rem;color:var(--muted);margin-top:2px}.personnel-news-list{display:grid;gap:12px}.personnel-news-card{cursor:pointer;border-left:5px solid var(--teal)}.personnel-news-card.priority-important{border-left-color:#e99c47}.personnel-news-card.priority-critical{border-left-color:var(--danger)}.personnel-news-card.read{opacity:.86}.personnel-news-card:hover{transform:translateY(-1px);border-color:#8ad5cc}.personnel-news-card>p{line-height:1.55;color:var(--text)}.news-chevron{font-size:2rem;color:var(--muted)}.announcement-detail{display:grid;gap:15px}.announcement-detail>p{font-size:.92rem;line-height:1.7;color:var(--ink)}
.learning-track-grid,.learning-personnel-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.learning-track-card.inactive{opacity:.6}.learning-track-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:14px 0}.learning-track-stats span{padding:9px 5px;border-radius:10px;background:var(--surface-2);font-size:.61rem;text-align:center;color:var(--muted)}.learning-track-stats strong{display:block;color:var(--ink);font-size:.9rem;margin-bottom:2px}.learning-assignment-picker{max-height:460px;overflow:auto}.learning-personnel-card{display:flex;flex-direction:column}.learning-personnel-card .button{margin-top:auto}.learning-progress{margin:10px 0}.learning-meta{display:flex;flex-wrap:wrap;gap:7px;margin:8px 0 18px}.learning-meta span{padding:6px 8px;border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:.62rem;font-weight:800}.learning-step-list{display:grid;gap:10px}.learning-step{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:11px;align-items:start;padding:13px;border:1px solid var(--line);border-radius:12px}.learning-step.done{background:#f4fbf8;border-color:#bfe5da}.learning-step.failed{background:var(--danger-soft);border-color:#efbcc3}.learning-step-number{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:var(--teal-soft);color:#007a70;font-weight:900}.learning-step h3{margin:0;color:var(--ink);font-size:.82rem}.learning-step p{margin:5px 0;color:var(--muted);font-size:.72rem;line-height:1.5}.learning-step .field{margin-top:9px}.learning-step .field select{padding:8px}
.revenue-chart{display:grid;gap:8px}.revenue-bar-row{display:grid;grid-template-columns:72px minmax(0,1fr) 90px;gap:9px;align-items:center}.revenue-bar-row>span,.revenue-bar-row>strong{font-size:.65rem}.revenue-bar-row>strong{text-align:right;color:var(--ink)}.revenue-bars{position:relative;height:28px;background:var(--surface-2);border-radius:8px;overflow:hidden}.revenue-bar,.labor-bar{position:absolute;left:0;display:block;border-radius:7px}.revenue-bar{top:4px;height:10px;background:linear-gradient(90deg,var(--teal),var(--mint))}.labor-bar{bottom:4px;height:6px;background:#f0a34e}.chart-legend{display:flex;gap:18px;margin-top:14px;color:var(--muted);font-size:.65rem}.chart-legend i{display:inline-block;width:16px;height:7px;border-radius:4px;margin-right:5px}.revenue-key{background:var(--teal)}.labor-key{background:#f0a34e}.insight-list{display:grid;gap:9px}.insight{padding:13px;border-left:4px solid var(--blue);border-radius:10px;background:#edf4ff}.insight.good{border-color:var(--success);background:var(--success-soft)}.insight.warn{border-color:var(--warn);background:var(--warn-soft)}.insight.danger{border-color:var(--danger);background:var(--danger-soft)}.insight strong{font-size:.78rem;color:var(--ink)}.insight p{margin:5px 0 0;font-size:.7rem;line-height:1.5;color:var(--muted)}.csv-preview{max-height:220px;overflow:auto;padding:12px;border-radius:10px;background:#102231;color:#dff8f4;font-size:.67rem}
.migration-steps{display:flex;gap:8px;position:relative;z-index:1}.migration-steps span{padding:10px 12px;border-radius:11px;background:rgba(255,255,255,.08);font-size:.65rem;color:rgba(255,255,255,.78);white-space:nowrap}.migration-steps b{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:7px;background:var(--teal);color:#fff;margin-right:5px}.migration-feature-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:16px}.migration-feature-list span{padding:10px;border-radius:10px;background:var(--surface-2);font-size:.69rem;font-weight:800;color:var(--ink)}.migration-validation{min-height:80px}.compact-table{min-width:620px}.operation-task-detail{display:grid;gap:13px}

@media(max-width:1250px){.operation-phase-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.learning-track-grid,.learning-personnel-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:780px){.operation-hero,.migration-hero,.operation-personnel-hero{align-items:flex-start;flex-direction:column}.operation-score{width:92px;height:92px;flex-basis:92px;position:absolute;right:18px;top:18px}.operation-hero>div:first-child,.operation-personnel-hero>div:first-child{padding-right:90px}.migration-hero>div:first-child{padding-right:0}.migration-steps{flex-wrap:wrap}.operation-phase-grid,.announcement-grid,.learning-track-grid,.learning-personnel-grid{grid-template-columns:1fr}.learning-track-stats{grid-template-columns:repeat(2,1fr)}.learning-step{grid-template-columns:32px minmax(0,1fr)}.learning-step>.button{grid-column:1/-1}.revenue-bar-row{grid-template-columns:58px minmax(0,1fr) 74px}.migration-feature-list{grid-template-columns:1fr}.read-metrics{grid-template-columns:repeat(2,1fr)}.operation-task-row{grid-template-columns:26px minmax(0,1fr)}.operation-task-row>.button,.operation-task-row>span:last-child{grid-column:1/-1}}
.status-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 20%,rgba(0,173,156,.12),transparent 35%),var(--bg)}.status-card{width:min(620px,100%)}.status-logo{width:190px;margin-bottom:24px}.status-card h1{font-size:2rem;letter-spacing:-.04em;color:var(--ink);margin:5px 0}.status-card>p:not(.eyebrow){color:var(--muted);line-height:1.6}.status-checks{display:grid;gap:9px;margin:22px 0}.status-check{display:flex;align-items:center;gap:12px;padding:13px;border-radius:12px;border:1px solid var(--line)}.status-check>span{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-weight:900}.status-check.ok>span{background:var(--success-soft);color:var(--success)}.status-check.fail>span{background:var(--danger-soft);color:var(--danger)}.status-check strong,.status-check small{display:block}.status-check small{color:var(--muted);margin-top:2px}.status-card>small{display:block;color:var(--muted);margin-top:18px}

/* ShiftKlaar V4.8 — compact schermgebruik en planning zonder horizontaal swipen */
.app-shell{grid-template-columns:220px minmax(0,1fr)}
.sidebar{padding:16px 12px}.sidebar-logo{padding:4px 7px 16px}.nav{gap:3px}.nav button,.nav a{gap:9px;padding:9px 10px;border-radius:9px;font-size:.78rem}.sidebar-bottom{padding:9px 7px}
.topbar{min-height:72px;padding:12px clamp(14px,2vw,26px)}.topbar h1{font-size:clamp(1.25rem,1.7vw,1.7rem)}.content{padding:14px clamp(14px,2vw,26px) 42px;overflow-x:hidden}.page{gap:14px}.card.pad{padding:16px}.card-header{margin-bottom:13px}.card-header p{font-size:.75rem}.kpi-grid{gap:10px}.kpi{min-height:112px;padding:14px}.kpi-value{font-size:1.55rem;margin-top:10px}.grid-2,.grid-equal,.grid-3{gap:13px}.notice{padding:11px 13px;font-size:.76rem}.button{padding:9px 12px}.modal-body{padding:16px 18px}.modal-head{padding:16px 18px}.modal-actions{padding:12px 18px 16px}
.section-tabs{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:5px;border:1px solid var(--line);border-radius:13px;background:#fff;box-shadow:0 8px 24px rgba(15,29,42,.05)}.section-tabs button{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:9px;background:transparent;color:var(--muted);padding:8px 11px;font-size:.72rem;font-weight:850}.section-tabs button:hover{background:var(--surface-2);color:var(--ink)}.section-tabs button.active{background:var(--ink);color:#fff}.section-tabs button span{display:grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:var(--danger);color:#fff;font-size:.58rem}
.recurrence-box{padding:12px;border:1px solid #cbe8e5;border-radius:12px;background:#f7fcfb}.schedule-state{display:inline-flex;margin-top:7px;padding:4px 7px;border-radius:999px;background:#edf2f3;color:var(--muted);font-size:.6rem;font-weight:850}.schedule-state.today{background:var(--success-soft);color:var(--success)}
.week-wrap{overflow:visible!important}.week-wrap::after{display:none!important}.week-grid.workforce{width:100%;min-width:0!important;grid-template-columns:minmax(145px,1.18fr) repeat(7,minmax(0,1fr))!important;border-radius:11px}.week-grid.workforce>.employee-cell,.week-grid.workforce>.week-head:first-child,.week-grid.workforce>.department-band{position:static!important;box-shadow:none!important}.week-grid.workforce>.department-band{width:auto!important}.week-cell{min-width:0;min-height:88px;padding:6px}.week-head{min-height:50px;font-size:.68rem}.week-head small{font-size:.58rem}.employee-cell{font-size:.67rem}.employee-cell small{font-size:.56rem;line-height:1.25}.planning-cell{min-height:95px}.shift{padding:5px 6px;border-radius:7px;font-size:.62rem}.shift span,.shift small{font-size:.54rem}.cell-add{right:4px;bottom:4px;width:22px;height:22px}.leave-warning,.availability-label{font-size:.51rem;padding:2px 4px}.department-band{min-height:32px;padding:6px 9px;font-size:.7rem}
.day-column-grid{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:7px!important;min-width:0!important;overflow:visible!important}.day-column{min-width:0!important;min-height:280px;padding:8px;border-radius:11px}.day-column>header,.day-column-head{gap:5px;padding-bottom:7px}.day-column>header h3,.day-column-head h3{font-size:.7rem}.day-column>header .day-add{width:29px;min-height:29px}.day-column-stats,.day-column-metrics{gap:3px;margin:6px 0}.day-column-stats span,.day-column-metrics span{padding:3px 4px;font-size:.49rem}.day-shift-stack,.day-shift-list{gap:5px}.day-shift{gap:5px;padding:6px;border-radius:8px}.day-shift .avatar{width:24px;height:24px;flex-basis:24px;border-radius:7px;font-size:.52rem}.day-shift strong{font-size:.59rem}.day-shift small{font-size:.5rem}.day-shift .shift-dept{font-size:.48rem;padding:2px 4px}
.planner-stats{gap:7px}.planner-stats>span{padding:9px}.planner-stats strong{font-size:1rem}.schedule-card{overflow:hidden}.template-card{padding:10px}.template-card h3{font-size:.8rem}

@media(max-width:1180px){
  .app-shell{grid-template-columns:200px minmax(0,1fr)}
  .day-column-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .week-grid.workforce{grid-template-columns:minmax(130px,1fr) repeat(7,minmax(92px,1fr))!important}
  .shift{font-size:.58rem}.shift span,.shift small{font-size:.49rem}
}
@media(max-width:920px){
  .day-column-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .grid-3{grid-template-columns:1fr}.operation-phase-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:780px){
  .content{padding:12px 12px calc(92px + env(safe-area-inset-bottom))}.topbar{min-height:64px;padding:10px 12px}.page{gap:11px}.card.pad{padding:13px}.section-tabs{position:sticky;top:66px;z-index:12;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.section-tabs::-webkit-scrollbar{display:none}.section-tabs button{white-space:nowrap;flex:0 0 auto}
  .day-column-grid{display:grid!important;grid-template-columns:1fr!important;overflow:visible!important;min-width:0!important}.day-column{min-height:0!important;width:100%!important;flex:none!important}.day-shift{min-height:46px}.planner-summary .card-header{display:grid}.planner-toolbar{display:grid;gap:8px}.date-nav{justify-content:space-between}.date-nav strong{min-width:0}.top-actions{max-width:60vw;overflow-x:auto}.top-actions .button{white-space:nowrap}.weekday-picker{grid-template-columns:repeat(4,1fr)}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.modal{width:calc(100% - 12px);max-height:94vh}.modal-body{max-height:72vh}.template-card{display:grid}.template-card .toolbar{justify-content:flex-start}
}
@media(max-width:520px){
  .planner-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.kpi{min-height:96px}.kpi-value{font-size:1.3rem}.section-tabs button{padding:7px 9px;font-size:.68rem}.read-metrics{grid-template-columns:1fr 1fr}
}


/* ShiftKlaar V4.8.2 - readable closing checklist hotfix */
.checklist{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;min-width:0}
.check-item{display:grid;grid-template-columns:22px minmax(0,1fr);align-items:flex-start;gap:11px;width:100%;min-width:0;padding:12px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--text);cursor:pointer;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}
.check-item:hover{border-color:#a9dcd7;background:#fbfefd;box-shadow:0 6px 18px rgba(15,29,42,.05)}
.check-item.critical{border-left:4px solid var(--danger)}
.check-item.done{border-color:#9edbd5;background:#f5fcfa}
.check-item-toggle{width:20px;height:20px;min-height:0;margin:2px 0 0;accent-color:var(--teal);flex:0 0 20px}
.check-item-content{display:grid;gap:5px;min-width:0}
.check-item-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;min-width:0}
.check-item-heading>strong{display:block;min-width:0;color:var(--ink);font-size:.82rem;line-height:1.3;overflow-wrap:anywhere;word-break:normal}
.check-item-heading>.badge{flex:0 0 auto}
.check-item-instruction{display:block;color:var(--muted);font-size:.7rem;line-height:1.45;overflow-wrap:anywhere}
.check-item-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:2px}
.check-item-chip{display:inline-flex;align-items:center;max-width:100%;padding:4px 7px;border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:.62rem;font-weight:800;line-height:1.25;overflow-wrap:anywhere}
.check-item-chip.assignee{background:var(--teal-soft);color:#00766c}
@media(max-width:780px){.check-item{padding:11px;gap:9px}.check-item-heading{display:grid;justify-content:stretch}.check-item-heading>.badge{justify-self:start}.check-item-instruction{font-size:.69rem}}

/* ShiftKlaar V4.8.3 - sidebar viewport and account actions hotfix */
@media(min-width:781px){
  .app-shell{min-height:100vh;min-height:100dvh}
  .sidebar{
    height:100vh;
    height:100dvh;
    max-height:100dvh;
    min-height:0;
    overflow:hidden;
    padding-bottom:max(10px,env(safe-area-inset-bottom));
  }
  .sidebar-logo{flex:0 0 auto}
  .sidebar>.nav{
    flex:1 1 auto;
    min-height:0;
    align-content:start;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    scrollbar-color:rgba(137,226,214,.45) transparent;
    padding-right:3px;
  }
  .sidebar>.nav::-webkit-scrollbar{width:5px}
  .sidebar>.nav::-webkit-scrollbar-track{background:transparent}
  .sidebar>.nav::-webkit-scrollbar-thumb{background:rgba(137,226,214,.35);border-radius:999px}
  .sidebar-bottom{
    flex:0 0 auto;
    margin-top:8px;
    padding:10px 5px max(2px,env(safe-area-inset-bottom));
    border-top:1px solid rgba(255,255,255,.1);
    background:linear-gradient(180deg,rgba(18,38,54,0),rgba(18,38,54,.96) 18%);
  }
  .user-mini{min-width:0}
  .user-mini>span:last-child{min-width:0}
  .user-mini strong,.user-mini small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .sidebar-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin-top:9px}
  .sidebar-actions button{min-width:0;min-height:34px;padding:6px 4px;font-size:.64rem;line-height:1.15;white-space:normal;overflow-wrap:anywhere}
}
@media(min-width:781px) and (max-height:760px){
  .sidebar{padding-top:11px}
  .sidebar-logo{padding-bottom:9px}
  .sidebar-logo img{width:32px}
  .sidebar-logo strong{font-size:.9rem}
  .sidebar-logo small{font-size:.67rem}
  .portal-badge{font-size:.57rem}
  .nav button,.nav a{min-height:38px;padding:7px 9px;font-size:.72rem}
  .sidebar-bottom{padding-top:7px}
  .avatar{width:32px;height:32px;border-radius:9px;font-size:.72rem}
  .user-mini strong{font-size:.74rem}
  .user-mini small{font-size:.63rem}
  .sidebar-actions{margin-top:7px}
  .sidebar-actions button{min-height:31px;font-size:.6rem;padding:5px 3px}
}
@media(min-width:781px){
  .sidebar-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sidebar-actions button:first-child:nth-last-child(3){grid-column:1/-1}
  .sidebar-actions button{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}


/* V4.9: mobiele HACCP-invoer, compact rooster en boekhouder-PDF */
.haccp-mobile-number{min-height:52px;font-size:16px;font-variant-numeric:tabular-nums}
.haccp-mobile-value small{display:block;margin-top:6px;line-height:1.35}
.payroll-brand{display:flex;align-items:center;gap:14px;min-width:0}.payroll-brand img{width:48px;height:48px;object-fit:contain;flex:0 0 auto}.payroll-brand>div{min-width:0}
.payroll-print-table th{background:#eef6f5;color:#45605f}.payroll-print-table tbody tr:nth-child(even) td{background:#fbfdfd}
@media(max-width:900px){.planning-page .card.pad{padding:14px}.planning-page .page{gap:14px}.planner-toolbar{gap:6px}.week-grid.workforce{font-size:.92em}}
@media(max-width:780px){.haccp-mobile-value{position:relative}.haccp-mobile-number{width:100%;font-size:18px;padding:14px 13px}.payroll-brand{align-items:flex-start}.payroll-brand img{width:42px;height:42px}.payroll-report-page .report-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.payroll-report-page .table-wrap{border-radius:10px}.payroll-report-page .data-table{min-width:680px}}
@media print{.payroll-brand img{width:34px;height:34px}.payroll-report-page .report-stat-grid>div{border-color:#b8d7d3}.payroll-print-table th{background:#e8f3f1!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}}

/* ShiftKlaar V4.10 — Weekgrid + Dag/stack planner */
.planner-layout-switch button{display:inline-flex;align-items:center;gap:6px;min-height:38px}
.planner-layout-switch button span{font-size:.9rem}
.dashboard-main-grid{grid-template-columns:minmax(0,1.45fr) minmax(300px,.75fr)}
.dashboard-day-plan{overflow:hidden}
.dashboard-day-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:12px}
.dashboard-day-summary span{padding:10px 11px;border:1px solid var(--line);border-radius:11px;background:var(--surface-2)}
.dashboard-day-summary strong,.dashboard-day-summary small{display:block}.dashboard-day-summary strong{color:var(--ink);font-size:1rem}.dashboard-day-summary small{margin-top:2px;color:var(--muted);font-size:.61rem;font-weight:750}
.dashboard-shift-stack{display:grid;gap:8px;max-height:470px;overflow:auto;padding-right:3px}
.dashboard-shift-row{display:grid;grid-template-columns:58px 34px minmax(0,1fr) auto;align-items:center;gap:10px;width:100%;padding:10px 11px;border:1px solid var(--line);border-left:4px solid var(--dept,var(--teal));border-radius:12px;background:#fff;text-align:left;cursor:pointer}
.dashboard-shift-row:hover{border-color:#a8d8d4;background:#fbfefd;box-shadow:0 5px 16px rgba(15,29,42,.06)}
.dashboard-shift-time{display:grid;color:var(--ink);font-size:.78rem;font-weight:900;line-height:1.05}.dashboard-shift-time small{margin-top:4px;color:var(--muted);font-size:.61rem;font-weight:700}
.dashboard-shift-row .avatar{width:34px;height:34px;border-radius:10px;font-size:.65rem}
.dashboard-shift-copy{min-width:0}.dashboard-shift-copy strong,.dashboard-shift-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dashboard-shift-copy strong{color:var(--ink);font-size:.78rem}.dashboard-shift-copy small{margin-top:3px;color:var(--muted);font-size:.65rem}

.week-date-selector{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;margin-bottom:13px}
.week-date-button{display:grid;gap:2px;justify-items:center;min-width:0;padding:9px 5px;border:1px solid var(--line);border-radius:11px;background:#fff;color:var(--muted);cursor:pointer}
.week-date-button:hover{border-color:#9fd8d2;background:#f8fcfb}.week-date-button.active{border-color:var(--teal);background:var(--teal-soft);color:#006f66;box-shadow:0 0 0 2px rgba(0,173,156,.08)}.week-date-button.today:not(.active){border-color:#b7d9d6}
.week-date-button small,.week-date-button strong,.week-date-button span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.week-date-button small{font-size:.59rem;text-transform:uppercase;font-weight:850}.week-date-button strong{color:var(--ink);font-size:1.02rem}.week-date-button span{font-size:.53rem;font-weight:750}
.day-stack-top{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 15px;margin-bottom:12px;border:1px solid #c8e7e3;border-radius:13px;background:linear-gradient(135deg,#f8fdfc,#eef9f7)}
.day-stack-top h3{margin:2px 0 0;color:var(--ink);font-size:1.08rem}.day-stack-top>div>p:last-child{margin:5px 0 0;color:var(--muted);font-size:.68rem}
.day-stack-layout{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:12px;align-items:start}
.day-stack-main{display:grid;gap:11px;min-width:0}
.day-stack-department{border:1px solid var(--line);border-radius:13px;background:var(--surface-2);overflow:hidden}
.day-stack-department>header{display:flex;align-items:center;justify-content:space-between;padding:9px 11px;border-bottom:1px solid var(--line);background:#fff}
.day-stack-department>header>div{display:grid;grid-template-columns:10px auto 1fr;align-items:center;gap:7px;min-width:0}.day-stack-department .department-dot{width:9px;height:9px;border-radius:50%;background:var(--dept,var(--teal))}.day-stack-department>header strong{color:var(--ink);font-size:.76rem}.day-stack-department>header small{color:var(--muted);font-size:.6rem;text-align:right}
.day-stack-items{display:grid;gap:7px;padding:8px}
.day-stack-shift{display:grid;grid-template-columns:54px 34px minmax(0,1fr) auto;align-items:center;gap:9px;width:100%;padding:9px 10px;border:1px solid var(--line);border-left:4px solid var(--dept,var(--teal));border-radius:11px;background:#fff;text-align:left;cursor:pointer;min-width:0}
.day-stack-shift:hover{border-color:#a8d8d4;box-shadow:0 5px 15px rgba(15,29,42,.055);transform:translateY(-1px)}.day-stack-shift.open{border-left-style:dashed;background:#fbfcfd}.day-stack-shift.conflict{border-color:#e2a05d;background:#fff9f2}
.day-stack-time{display:grid;color:var(--ink);font-size:.75rem;font-weight:900;line-height:1}.day-stack-time small{margin-top:5px;color:var(--muted);font-size:.59rem;font-weight:700}.day-stack-shift .avatar{width:34px;height:34px;border-radius:10px;font-size:.62rem}
.day-stack-copy{display:grid;gap:3px;min-width:0}.day-stack-copy strong,.day-stack-copy small,.day-stack-copy em{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.day-stack-copy strong{color:var(--ink);font-size:.75rem}.day-stack-copy small{color:var(--muted);font-size:.63rem}.day-stack-copy em{color:#9a5f1e;font-size:.58rem;font-style:normal;font-weight:800}.day-stack-copy em.ok{color:var(--success)}
.day-stack-status{display:flex;align-items:center;justify-content:flex-end;gap:6px;min-width:82px}.day-stack-status i{color:var(--muted);font-style:normal;font-size:1.15rem}.day-stack-status .corner-count{position:static;margin:0}
.day-stack-aside{display:grid;gap:8px;position:sticky;top:88px}.day-stack-stat,.day-stack-alert{padding:12px;border:1px solid var(--line);border-radius:12px;background:#fff}.day-stack-stat span,.day-stack-stat strong,.day-stack-stat small{display:block}.day-stack-stat span{color:var(--muted);font-size:.6rem;text-transform:uppercase;font-weight:850}.day-stack-stat strong{margin-top:4px;color:var(--ink);font-size:1.25rem}.day-stack-stat small{margin-top:2px;color:var(--muted);font-size:.58rem}.day-stack-alert{border-color:#f0c794;background:#fff9f1}.day-stack-alert strong,.day-stack-alert span,.day-stack-alert small{display:block}.day-stack-alert strong{color:#84521a;font-size:.7rem;margin-bottom:7px}.day-stack-alert span{padding:5px 0;border-top:1px solid rgba(132,82,26,.12);color:var(--ink);font-size:.63rem}.day-stack-alert small{margin-top:5px;color:var(--muted);font-size:.58rem}

/* Keep the full weekgrid visible on common laptop sizes. */
.week-grid.workforce{grid-template-columns:minmax(130px,1.05fr) repeat(7,minmax(0,1fr))!important}
.week-grid.workforce .week-cell{overflow:hidden}
.week-grid.workforce .employee-cell strong,.week-grid.workforce .employee-cell small,.week-grid.workforce .shift strong,.week-grid.workforce .shift span,.week-grid.workforce .shift small{overflow:hidden;text-overflow:ellipsis}
.week-grid.workforce .employee-cell strong,.week-grid.workforce .employee-cell small{white-space:nowrap}

@media(max-width:1100px){
  .dashboard-main-grid{grid-template-columns:1fr}
  .day-stack-layout{grid-template-columns:minmax(0,1fr) 190px}
  .day-stack-status .badge{display:none}
  .week-grid.workforce{grid-template-columns:minmax(112px,.9fr) repeat(7,minmax(0,1fr))!important}
}
@media(max-width:780px){
  .planner-layout-switch{width:100%}.planner-layout-switch button{flex:1;justify-content:center}
  .week-date-selector{gap:4px}.week-date-button{padding:7px 2px;border-radius:9px}.week-date-button span{display:none}.week-date-button strong{font-size:.86rem}.week-date-button small{font-size:.5rem}
  .day-stack-top{align-items:stretch;display:grid}.day-stack-top .button{width:100%}.day-stack-layout{grid-template-columns:1fr}.day-stack-aside{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}.day-stack-alert{grid-column:1/-1}
  .day-stack-shift{grid-template-columns:46px 30px minmax(0,1fr) 18px;padding:8px 7px;gap:7px}.day-stack-shift .avatar{width:30px;height:30px}.day-stack-status{min-width:0}.day-stack-status .badge,.day-stack-status .corner-count{display:none}
  .dashboard-shift-row{grid-template-columns:48px 32px minmax(0,1fr)}.dashboard-shift-row>.badge{display:none}
  .week-grid.workforce{grid-template-columns:78px repeat(7,minmax(0,1fr))!important}.week-grid.workforce .week-cell{min-height:58px;padding:3px}.week-grid.workforce .week-head{min-height:42px;font-size:.53rem}.week-grid.workforce .week-head small{font-size:.45rem}.week-grid.workforce .employee-cell{font-size:.5rem}.week-grid.workforce .employee-cell small,.week-grid.workforce .shift span,.week-grid.workforce .shift small,.week-grid.workforce .availability-label{display:none}.week-grid.workforce .shift{padding:3px 2px;border-left-width:2px;margin-bottom:3px}.week-grid.workforce .shift strong{font-size:.46rem;white-space:nowrap}.week-grid.workforce .planning-cell{min-height:62px}.week-grid.workforce .cell-add{width:18px;height:18px;right:2px;bottom:2px;font-size:.65rem}.week-grid.workforce .department-band{min-height:25px;padding:4px 6px;font-size:.55rem}.week-grid.workforce .department-band small{display:none}
}
@media(max-width:480px){
  .dashboard-day-summary{grid-template-columns:repeat(3,1fr)}.dashboard-day-summary span{padding:8px}.dashboard-day-summary strong{font-size:.85rem}.dashboard-shift-copy small{white-space:normal;line-height:1.25}
  .day-stack-aside{grid-template-columns:repeat(2,1fr)}
}

/* ShiftKlaar V4.10.1 - duidelijke afgeronde dienst-bolletjes */
.bubble-roster{background:#f7faf9}
.bubble-roster .day-bubble-head{display:grid;place-items:center;align-content:center;gap:1px;padding:5px 2px;text-align:center}
.bubble-roster .day-bubble-head span{font-size:.58rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.bubble-roster .day-bubble-head strong{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#fff;border:1px solid var(--line);color:var(--ink);font-size:.75rem;box-shadow:0 3px 10px rgba(15,29,42,.05)}
.bubble-roster .day-bubble-head small{font-size:.5rem;margin:0;color:var(--muted)}
.bubble-employee{display:flex;align-items:center;gap:7px;min-width:0;background:#fff}
.employee-bubble-avatar{flex:0 0 28px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--teal),var(--mint));color:#073830;font-weight:950;font-size:.58rem;box-shadow:0 3px 9px rgba(0,173,156,.17)}
.open-employee .employee-bubble-avatar{background:#e7edef;color:#64747e}
.employee-bubble-copy{display:grid;gap:2px;min-width:0}
.employee-bubble-copy strong,.employee-bubble-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.employee-bubble-copy strong{font-size:.66rem;color:var(--ink)}
.employee-bubble-copy small{font-size:.52rem;color:var(--muted)}
.bubble-planning-cell{background:#fbfdfd;padding:5px 4px 28px}
.shift-bubble-list{display:grid;gap:5px}
.shift.shift-bubble{position:relative;display:grid;grid-template-columns:9px minmax(0,1fr) 8px;align-items:center;gap:5px;width:100%;min-height:33px;margin:0;padding:5px 7px 5px 5px;border:1px solid #d8e4e4;border-left:1px solid #d8e4e4;border-radius:999px;background:#fff;color:var(--ink);box-shadow:0 3px 10px rgba(15,29,42,.055);transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease}
.shift.shift-bubble:hover{transform:translateY(-1px);box-shadow:0 6px 14px rgba(15,29,42,.09);border-color:var(--shift-color)}
.shift.shift-bubble.open{border-style:dashed;background:#f8fafb}
.shift.shift-bubble.conflict{background:#fff4f5;border-color:#e5a7ae}
.shift-bubble-dot{width:9px;height:9px;border-radius:50%;background:var(--shift-color,#00ad9c);box-shadow:0 0 0 3px rgba(255,255,255,.9),0 0 0 4px var(--shift-color,#00ad9c)}
.shift-bubble-copy{display:grid;gap:1px;min-width:0;text-align:left}
.shift-bubble-copy strong,.shift-bubble-copy span,.shift-bubble-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.shift-bubble-copy strong{font-size:.58rem;line-height:1.05;color:var(--ink)}
.shift-bubble-copy span{font-size:.49rem;line-height:1.1;color:var(--muted);margin:0}
.shift-bubble-copy small{font-size:.46rem;line-height:1.1;color:var(--danger);margin:0;font-weight:850}
.shift-state-dot{display:block;flex:0 0 auto;width:8px;height:8px;border-radius:50%;box-shadow:0 0 0 2px #fff}
.shift-state-dot.published{background:#19a672}
.shift-state-dot.draft{background:#f0a52c}
.bubble-add{border-radius:50%;background:#fff;box-shadow:0 3px 10px rgba(15,29,42,.08);font-weight:950}

.week-date-selector{gap:8px}
.week-date-button{border-radius:18px!important;box-shadow:0 3px 12px rgba(15,29,42,.05)}
.week-date-button.active{background:linear-gradient(145deg,var(--teal),#078d82)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 9px 20px rgba(0,173,156,.2)}
.week-date-button.active small,.week-date-button.active span{color:rgba(255,255,255,.82)!important}
.week-date-button strong{display:grid;place-items:center;width:34px;height:34px;margin:3px auto;border-radius:50%;background:rgba(255,255,255,.9);color:var(--ink)}
.week-date-button.active strong{background:#fff;color:#087c72}

.day-stack-items{gap:9px;padding:10px}
.day-stack-shift.shift-bubble-large{grid-template-columns:58px 38px minmax(0,1fr) auto;border:1px solid #d7e3e3;border-left:1px solid #d7e3e3;border-radius:999px;padding:8px 11px 8px 8px;background:#fff;box-shadow:0 5px 15px rgba(15,29,42,.06)}
.day-stack-shift.shift-bubble-large::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--dept,var(--teal));position:absolute;left:4px;top:50%;transform:translateY(-50%);box-shadow:0 0 0 3px #fff}
.day-stack-shift.shift-bubble-large:hover{border-color:var(--dept,var(--teal));box-shadow:0 9px 22px rgba(15,29,42,.1)}
.day-stack-shift.shift-bubble-large.open{border-style:dashed;background:#f8fafb}
.day-stack-shift.shift-bubble-large .avatar{border-radius:50%}
.day-stack-status{min-width:92px}
.shift-status-label{font-size:.56rem;color:var(--muted);font-weight:850;white-space:nowrap}

.dashboard-shift-pill{border-radius:999px;padding:8px 12px 8px 8px;border-left:1px solid var(--line);position:relative}
.dashboard-shift-pill::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--dept,var(--teal));position:absolute;left:4px;top:50%;transform:translateY(-50%);box-shadow:0 0 0 3px #fff}
.dashboard-shift-pill .avatar{border-radius:50%}
.dashboard-shift-state{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:.58rem;font-weight:850}

@media(max-width:1100px){
  .shift.shift-bubble{grid-template-columns:7px minmax(0,1fr) 7px;padding:4px 5px 4px 4px;gap:4px;min-height:30px}
  .shift-bubble-dot{width:7px;height:7px;box-shadow:none}
  .shift-bubble-copy strong{font-size:.52rem}.shift-bubble-copy span{font-size:.44rem}
  .employee-bubble-avatar{width:24px;height:24px;flex-basis:24px;font-size:.5rem}
  .employee-bubble-copy strong{font-size:.58rem}.employee-bubble-copy small{font-size:.47rem}
}
@media(max-width:780px){
  .bubble-roster-wrap{overflow:visible!important}
  .week-grid.workforce.bubble-roster{min-width:0!important;width:100%!important;grid-template-columns:62px repeat(7,minmax(0,1fr))!important}
  .bubble-roster .department-band{position:static!important;width:auto!important}
  .bubble-roster .employee-cell,.bubble-roster .week-head:first-child{position:static!important;box-shadow:none!important}
  .bubble-roster .day-bubble-head{min-height:44px;padding:3px 1px}
  .bubble-roster .day-bubble-head strong{width:23px;height:23px;font-size:.58rem}
  .bubble-roster .day-bubble-head span{font-size:.43rem}.bubble-roster .day-bubble-head small{display:none}
  .bubble-employee{justify-content:center;padding:3px!important}
  .employee-bubble-avatar{width:25px;height:25px;flex-basis:25px;font-size:.48rem}
  .employee-bubble-copy{display:none}
  .bubble-planning-cell{min-height:58px!important;padding:3px 2px 21px!important}
  .shift-bubble-list{gap:3px}
  .shift.shift-bubble{display:grid!important;grid-template-columns:6px minmax(0,1fr)!important;min-height:25px;padding:3px 3px;border-radius:999px;gap:3px}
  .shift-bubble-dot{display:block!important;width:6px;height:6px}
  .shift-bubble-copy{display:block!important;min-width:0}
  .shift-bubble-copy strong{display:block!important;font-size:.42rem!important;white-space:nowrap!important}
  .shift-bubble-copy span,.shift-bubble-copy small,.shift-state-dot{display:none!important}
  .bubble-add{width:17px!important;height:17px!important;font-size:.6rem!important}
  .day-stack-shift.shift-bubble-large{grid-template-columns:45px 30px minmax(0,1fr) 17px;border-radius:22px;padding:7px 6px 7px 7px}
  .day-stack-shift.shift-bubble-large::before{display:none}
  .shift-status-label{display:none}
  .dashboard-shift-pill{border-radius:22px}
  .dashboard-shift-state span{display:none}
}

/* ShiftKlaar V4.10.2 - echte afdeling/functie weekgrid met gestapelde dienstblokken */
.department-weekgrid-shell{width:100%;overflow:visible;border:1px solid var(--line);border-radius:12px;background:#f7fafa}
.department-weekgrid{display:grid;grid-template-columns:minmax(124px,.94fr) repeat(7,minmax(0,1fr));width:100%;min-width:0;overflow:hidden;border-radius:11px}
.department-grid-cell{min-width:0;border-right:1px solid #d8e3e4;border-bottom:1px solid #d8e3e4;background:#fff}
.department-grid-cell:nth-child(8n){border-right:0}
.department-grid-corner{min-height:72px;padding:11px 10px;display:flex;flex-direction:column;justify-content:center;background:#edf3f3;color:var(--ink)}
.department-grid-corner strong{font-size:.75rem;line-height:1.15}
.department-grid-corner small{margin-top:4px;color:var(--muted);font-size:.56rem;line-height:1.25}
.department-grid-day{min-height:72px;padding:7px 3px;display:grid;place-items:center;align-content:center;gap:1px;text-align:center;background:#edf3f3;color:var(--ink)}
.department-grid-day.today{background:#e4f7f4;box-shadow:inset 0 3px 0 var(--teal)}
.department-grid-day span{font-size:.59rem;text-transform:uppercase;letter-spacing:.055em;font-weight:900;color:#53616d}
.department-grid-day strong{font-size:.86rem;line-height:1.1}
.department-grid-day small{font-size:.49rem;color:#6d7a83;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.department-grid-section{grid-column:1/-1;min-height:34px;display:flex;align-items:center;gap:8px;padding:7px 10px;background:var(--dept);background:linear-gradient(90deg,color-mix(in srgb,var(--dept) 88%,#0e2635),color-mix(in srgb,var(--dept) 66%,#16364a));color:#fff;border-bottom:1px solid rgba(0,0,0,.08)}
.department-grid-section-dot{width:9px;height:9px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.22)}
.department-grid-section strong{font-size:.72rem;letter-spacing:.01em}
.department-grid-section small{margin-left:auto;color:rgba(255,255,255,.74);font-size:.54rem}
.department-grid-role{min-height:88px;padding:9px 8px;display:flex;flex-direction:column;justify-content:center;background:#f2f6f6;color:var(--ink)}
.department-grid-role strong{font-size:.67rem;line-height:1.18;overflow:hidden;text-overflow:ellipsis}
.department-grid-role small{margin-top:4px;color:var(--muted);font-size:.52rem;line-height:1.25}
.department-grid-slot{position:relative;min-height:88px;padding:5px 4px 24px;background:#fff;transition:background .14s ease}
.department-grid-slot:hover{background:#f7fbfb}
.department-grid-slot.has-shifts{background:#fcfefe}
.department-shift-list{display:flex;flex-wrap:wrap;align-content:flex-start;gap:4px;width:100%}
.department-shift-block{position:relative;flex:1 1 72px;min-width:0;min-height:45px;padding:5px 5px 5px 7px;border:1px solid #d8e3e4;border-color:color-mix(in srgb,var(--dept) 34%,#d8e3e4);border-left:4px solid var(--dept);border-radius:7px;background:#fff;text-align:left;color:var(--ink);box-shadow:0 2px 7px rgba(15,29,42,.055);overflow:hidden;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}
.department-shift-block:hover{transform:translateY(-1px);box-shadow:0 6px 14px rgba(15,29,42,.11);border-color:var(--dept)}
.department-shift-block.open{background:#fff6f6;border-color:#d24451;border-left-color:#d24451}
.department-shift-block.conflict{background:#fff0f2;border-color:#d24451;border-left-color:#d24451}
.department-shift-block.unavailable{background:#fff8ee;border-color:#d9953f;border-left-color:#d9953f}
.department-shift-time{display:block;font-size:.53rem;line-height:1.05;font-weight:900;color:#263843;white-space:nowrap}
.department-shift-block>strong{display:block;margin-top:3px;font-size:.56rem;line-height:1.12;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.department-shift-meta{display:flex;align-items:center;gap:3px;margin-top:3px;font-size:.43rem;line-height:1;color:#6d7a83;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.department-shift-meta .shift-state-dot{width:6px;height:6px;min-width:6px}
.department-grid-add{position:absolute;right:3px;bottom:3px;width:18px;height:18px;display:grid;place-items:center;padding:0;border:1px dashed #b8c8ca;border-color:color-mix(in srgb,var(--dept) 55%,#b8c8ca);border-radius:5px;background:#fff;color:var(--dept);font-size:.68rem;font-weight:900;opacity:.45;transition:.12s}
.department-grid-slot:hover .department-grid-add,.department-grid-add:focus{opacity:1;background:#f2faf9;background:color-mix(in srgb,var(--dept) 10%,#fff)}
.wizard-option-card.selected{outline:3px solid rgba(0,173,156,.25);outline-color:color-mix(in srgb,var(--dept) 32%,transparent);border-color:var(--dept)}

@media(max-width:1250px){
  .department-weekgrid{grid-template-columns:minmax(110px,.82fr) repeat(7,minmax(0,1fr))}
  .department-grid-corner,.department-grid-day{min-height:64px}
  .department-grid-role,.department-grid-slot{min-height:78px}
  .department-grid-role{padding:7px 6px}.department-grid-role strong{font-size:.6rem}.department-grid-role small{font-size:.46rem}
  .department-shift-block{flex-basis:62px;min-height:41px;padding:4px 4px 4px 6px;border-left-width:3px}
  .department-shift-time{font-size:.47rem}.department-shift-block>strong{font-size:.49rem}.department-shift-meta{font-size:.39rem}
}
@media(max-width:900px){
  .department-weekgrid-shell{overflow:visible}
  .department-weekgrid{grid-template-columns:82px repeat(7,minmax(0,1fr));border-radius:8px}
  .department-grid-corner{padding:5px 4px}.department-grid-corner strong{font-size:.53rem}.department-grid-corner small{display:none}
  .department-grid-day{min-height:48px;padding:4px 1px}.department-grid-day span{font-size:.42rem}.department-grid-day strong{font-size:.62rem}.department-grid-day small{display:none}
  .department-grid-section{min-height:27px;padding:4px 6px}.department-grid-section strong{font-size:.55rem}.department-grid-section small{display:none}.department-grid-section-dot{width:6px;height:6px;box-shadow:none}
  .department-grid-role,.department-grid-slot{min-height:58px}
  .department-grid-role{padding:4px}.department-grid-role strong{font-size:.48rem;line-height:1.05}.department-grid-role small{display:none}
  .department-grid-slot{padding:2px 2px 18px}
  .department-shift-list{gap:2px}
  .department-shift-block{flex:1 1 100%;min-height:29px;padding:3px 2px 3px 4px;border-left-width:2px;border-radius:5px;box-shadow:none}
  .department-shift-time{font-size:.39rem;letter-spacing:-.02em}.department-shift-block>strong{font-size:.4rem;margin-top:1px}.department-shift-meta{display:none}
  .department-grid-add{width:14px;height:14px;right:1px;bottom:1px;border-radius:4px;font-size:.5rem}
}
@media(max-width:560px){
  .schedule-card.card.pad{padding:8px}
  .schedule-card>.card-header{margin-bottom:8px}
  .department-weekgrid{grid-template-columns:64px repeat(7,minmax(0,1fr))}
  .department-grid-role,.department-grid-slot{min-height:52px}
  .department-grid-role strong{font-size:.42rem}
  .department-shift-block{min-height:25px;padding:2px 1px 2px 3px}
  .department-shift-time{font-size:.34rem}.department-shift-block>strong{font-size:.34rem}
}
.print-department-wrap{overflow:auto;margin-top:14px}.print-department-grid{width:100%;min-width:1120px;border-collapse:collapse;table-layout:fixed}.print-department-grid th,.print-department-grid td{padding:5px;vertical-align:top;border:1px solid var(--line);background:#fff}.print-department-grid thead th{background:#edf3f3;color:var(--ink);font-size:.61rem;text-align:left}.print-department-grid thead th:first-child{width:135px}.print-department-grid th small{display:block;margin-top:2px;color:var(--muted);font-size:.49rem}.print-department-grid tbody>tr:not(.print-department-band)>th{background:#f2f6f6;color:var(--ink);font-size:.58rem}.print-department-band th{padding:5px 8px!important;background:var(--dept,var(--teal))!important;color:#fff!important;text-align:left;font-size:.62rem}.print-department-band th small{display:inline;margin-left:8px;color:rgba(255,255,255,.75)}.print-grid-shift{padding:4px 5px;margin-bottom:3px;border:1px solid #d8e3e4;border-color:color-mix(in srgb,var(--dept) 30%,#d8e3e4);border-left:3px solid var(--dept);border-radius:5px;background:#fff}.print-grid-shift.open{border-color:#d24451;background:#fff4f5}.print-grid-shift strong,.print-grid-shift span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.print-grid-shift strong{font-size:.52rem;color:var(--ink)}.print-grid-shift span{font-size:.48rem;color:var(--muted);margin-top:1px}.print-grid-shift p{margin:3px 0 0;font-size:.47rem;color:var(--ink)}
@media print{.print-department-wrap{overflow:visible!important}.print-department-grid{min-width:0!important}.print-department-grid th,.print-department-grid td{padding:2.5px!important}.print-department-grid thead th:first-child{width:92px!important}.print-department-band th{padding:3px 5px!important}.print-grid-shift{padding:2px 3px!important;margin-bottom:1.5px!important;border-radius:3px!important}.print-grid-shift strong{font-size:6pt!important}.print-grid-shift span,.print-grid-shift p{font-size:5.2pt!important}}

/* ShiftKlaar V4.11 - urenbeoordeling, teamnieuws, inwerken en reviewmanagement */
.status-filter-row,.announcement-list-switch,.review-filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.status-filter{min-height:36px;padding:7px 11px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--muted);font-size:.75rem;font-weight:800;cursor:pointer}
.status-filter.active{border-color:var(--teal);background:var(--teal-soft);color:var(--teal-dark)}
.hours-status-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}
.hours-status-summary>div{padding:14px 10px;border:1px solid var(--line);border-radius:12px;background:var(--surface-soft);text-align:center}
.hours-status-summary strong{display:block;font-size:1.45rem;color:var(--ink)}
.hours-status-summary span{display:block;margin-top:3px;font-size:.69rem;color:var(--muted)}
.personnel-hours-list{display:grid;gap:9px}
.personnel-hour-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(155px,220px);gap:14px;align-items:center;padding:13px 14px;border:1px solid var(--line);border-left:4px solid #a7b7b9;border-radius:12px;background:#fff}
.personnel-hour-row.status-submitted{border-left-color:#d78a2c}.personnel-hour-row.status-approved{border-left-color:#2e9b6f}.personnel-hour-row.status-rejected{border-left-color:#d24451}.personnel-hour-row.status-open{border-left-color:var(--teal)}
.personnel-hour-row h3{margin:0 0 3px;font-size:.91rem}.personnel-hour-row p{margin:0;color:var(--muted);font-size:.72rem}
.hour-status-block{text-align:right}.hour-status-block small{display:block;margin-top:5px;color:var(--muted);font-size:.62rem;line-height:1.35}
.rejection-reason{display:flex;flex-direction:column;gap:2px;margin-top:8px;padding:8px 10px;border-radius:8px;background:#fff0f2;color:#932f3b;font-size:.68rem}
.hours-review-table .row-actions,.row-actions{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}.danger-text{color:#bb3040!important}
.hour-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.compact-list{display:grid;gap:7px}.compact-list>div{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
.personnel-news-list{display:grid;gap:10px}.personnel-news-card{padding:14px;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer}.personnel-news-card:hover{border-color:var(--teal);box-shadow:0 6px 18px rgba(15,29,42,.07)}.personnel-news-card.priority-critical{border-left:4px solid #d24451}.personnel-news-card.priority-important{border-left:4px solid #d78a2c}.personnel-news-card.read{opacity:.82}.personnel-news-card h3{margin:5px 0 3px}.news-chevron{font-size:1.4rem;color:var(--muted)}
.learning-introduction{padding:11px 12px;border-radius:10px;background:var(--teal-soft);color:var(--ink);font-size:.75rem;line-height:1.5}
.learning-foundation{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:18px}.learning-foundation section{padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--surface-soft)}.learning-foundation section>span{display:block;margin-bottom:4px;color:var(--teal-dark);font-size:.59rem;font-weight:900;text-transform:uppercase;letter-spacing:.06em}.learning-foundation h3{margin:0 0 6px;font-size:.85rem}.learning-foundation p{margin:0;color:var(--muted);font-size:.72rem;line-height:1.5}
.learning-category{margin:16px 0}.learning-category-head{display:flex;align-items:center;gap:9px;margin-bottom:8px}.learning-category-head>span{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--teal);color:#fff;font-weight:900}.learning-category-head h3,.learning-category-head p{margin:0}.learning-category-head h3{font-size:.86rem}.learning-category-head p{font-size:.63rem;color:var(--muted)}
.learning-step .toolbar.compact{justify-content:flex-start}.learning-step .toolbar.compact h3{margin-right:auto}
.onboarding-intro{display:grid;gap:12px}.onboarding-intro-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.onboarding-intro-flow>div{padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--surface-soft)}.intro-completeness{display:flex;align-items:center;gap:10px}.onboarding-section-field{padding:12px;border:1px solid var(--line);border-radius:10px;background:#fff}.onboarding-progress-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.manager-progress-list{display:grid;gap:8px}
.review-stars{display:inline-flex;gap:1px;color:#f3ad21;letter-spacing:.02em}.compact-select{max-width:250px}.review-inbox{display:grid;gap:12px}.review-card{padding:15px;border:1px solid var(--line);border-radius:14px;background:#fff}.review-card.status-escalated{border-left:4px solid #d24451}.review-card.status-closed{opacity:.82}.review-card-head{display:flex;justify-content:space-between;gap:14px}.review-card-head h3{margin:5px 0 2px}.review-card-head p{margin:0;color:var(--muted);font-size:.66rem}.review-card-actions{display:flex;gap:7px;align-items:flex-start;flex-wrap:wrap;justify-content:flex-end}.review-card blockquote{margin:13px 0;padding:12px;border-radius:10px;background:var(--surface-soft);font-size:.78rem;line-height:1.5}.public-reply,.draft-reply{margin-top:9px;padding:10px 12px;border-radius:10px}.public-reply{background:#eaf7f1}.draft-reply{background:#fff7e9}.public-reply p,.draft-reply p{margin:4px 0 0;font-size:.72rem;line-height:1.45}.review-action-list{display:grid;gap:6px;margin-top:10px}.review-action-list>div{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:8px;align-items:center;padding:8px;border:1px solid var(--line);border-radius:9px}.review-action-list p{margin:0}.review-action-list small{display:block;color:var(--muted);font-size:.62rem}.review-footer{display:flex;justify-content:flex-end;gap:12px;margin-top:11px;padding-top:9px;border-top:1px solid var(--line)}.text-button{border:0;background:transparent;color:var(--teal-dark);font-weight:800;cursor:pointer}.review-modal-quote{padding:12px;border-left:4px solid var(--teal);background:var(--surface-soft);border-radius:8px}
.personnel-review-actions{display:grid;gap:10px}.personnel-review-action{display:grid;grid-template-columns:100px minmax(0,1fr) 150px;gap:13px;align-items:center;padding:13px;border:1px solid var(--line);border-radius:12px;background:#fff}.personnel-review-action.status-done{opacity:.75;border-left:4px solid #2e9b6f}.review-action-rating strong{display:block;color:#f3ad21;letter-spacing:1px}.review-action-rating span{display:block;margin-top:3px;color:var(--muted);font-size:.62rem}.personnel-review-action h3{margin:0 0 5px;font-size:.84rem}.personnel-review-action blockquote{margin:0 0 5px;color:var(--muted);font-size:.7rem;line-height:1.4}.personnel-review-action p{margin:0 0 5px;font-size:.7rem}.review-action-controls{display:grid;gap:7px}

@media(max-width:900px){
  .personnel-hour-row{grid-template-columns:1fr}.hour-status-block{text-align:left}
  .learning-foundation{grid-template-columns:1fr}.onboarding-intro-flow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .review-card-head{display:grid}.review-card-actions{justify-content:flex-start}.personnel-review-action{grid-template-columns:1fr}.review-action-controls{grid-template-columns:minmax(0,1fr) auto}
}
@media(max-width:560px){
  .hours-status-summary{grid-template-columns:repeat(3,1fr);gap:5px}.hours-status-summary>div{padding:9px 4px}.hours-status-summary strong{font-size:1.05rem}.hours-status-summary span{font-size:.53rem}
  .personnel-hour-row{padding:10px}.onboarding-progress-summary{grid-template-columns:1fr}.review-card{padding:11px}.review-card-actions .button{flex:1}.review-action-controls{grid-template-columns:1fr}
  .learning-foundation section{padding:10px}
}

/* ShiftKlaar V4.11.1 - compact blauw weekrooster, geïnspireerd door klassieke workforce planners */
.v4111-compact-grid{
  --planner-blue:#087aa6;
  --planner-blue-dark:#075d82;
  --planner-blue-soft:#eaf5f9;
  border:0;
  background:#fff;
  box-shadow:0 8px 28px rgba(12,52,72,.08);
}
.compact-roster-caption{
  min-height:50px;
  padding:9px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  color:#fff;
  background:linear-gradient(135deg,var(--planner-blue-dark),var(--planner-blue));
  border-radius:11px 11px 0 0;
}
.compact-roster-caption>div:first-child{display:grid;gap:2px}
.compact-roster-caption strong{font-size:.78rem;line-height:1.1}
.compact-roster-caption>div:first-child span{font-size:.54rem;color:rgba(255,255,255,.76)}
.compact-roster-legend{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.compact-roster-legend span{display:flex;align-items:center;gap:4px;font-size:.5rem;font-weight:800;color:rgba(255,255,255,.88)}
.compact-roster-legend .shift-state-dot{width:7px;height:7px;min-width:7px}
.compact-roster-legend .legend-open,.compact-roster-legend .legend-conflict{padding:3px 6px;border-radius:999px;border:1px solid rgba(255,255,255,.35)}
.compact-roster-legend .legend-open{background:rgba(255,255,255,.1)}
.compact-roster-legend .legend-conflict{background:#b83643;border-color:#d9535f}
.v4111-compact-grid .department-weekgrid{
  grid-template-columns:minmax(132px,.95fr) repeat(7,minmax(0,1fr));
  border-radius:0 0 10px 10px;
  border:1px solid #cbdde4;
  border-top:0;
  background:#fff;
}
.v4111-compact-grid .department-grid-cell{border-color:#d5e2e7}
.v4111-compact-grid .department-grid-corner,
.v4111-compact-grid .department-grid-day{
  min-height:62px;
  padding:6px 7px;
  color:#fff;
  background:linear-gradient(180deg,#0b83b2,#08739d);
  border-color:rgba(255,255,255,.2);
}
.v4111-compact-grid .department-grid-corner{align-items:flex-start;justify-content:center}
.v4111-compact-grid .department-grid-corner strong{font-size:.66rem;color:#fff}
.v4111-compact-grid .department-grid-corner small{font-size:.46rem;color:rgba(255,255,255,.72)}
.planner-week-label{display:inline-flex;width:max-content;padding:2px 6px;border-radius:999px;background:rgba(255,255,255,.16);font-size:.48rem;font-weight:900;text-transform:uppercase;letter-spacing:.045em}
.v4111-compact-grid .department-grid-day{display:grid;place-items:center;align-content:center;gap:2px;text-align:center}
.v4111-compact-grid .department-grid-day.today{background:linear-gradient(180deg,#00a99a,#008f84);box-shadow:inset 0 -3px 0 rgba(255,255,255,.4)}
.v4111-compact-grid .department-grid-day span{font-size:.5rem;color:rgba(255,255,255,.78)}
.v4111-compact-grid .department-grid-day>strong{font-size:.7rem;color:#fff}
.planner-day-kpis{display:flex;align-items:center;justify-content:center;gap:3px;flex-wrap:wrap;margin-top:2px}
.planner-day-kpis b,.planner-day-kpis i,.planner-day-kpis em{min-width:22px;padding:2px 4px;border-radius:4px;background:rgba(255,255,255,.14);font-size:.4rem;line-height:1;font-style:normal;color:#fff}
.planner-day-kpis em{background:#b83643}
.v4111-compact-grid .department-grid-section{
  min-height:27px;
  padding:4px 8px;
  gap:6px;
  background:linear-gradient(90deg,var(--planner-blue-dark),var(--planner-blue));
  border-top:2px solid #fff;
  border-bottom:1px solid #c7dbe4;
}
.v4111-compact-grid .department-grid-section::before{content:"";width:4px;align-self:stretch;border-radius:3px;background:var(--dept)}
.v4111-compact-grid .department-grid-section-dot{display:none}
.v4111-compact-grid .department-grid-section strong{font-size:.6rem}
.v4111-compact-grid .department-grid-section small{font-size:.45rem;color:rgba(255,255,255,.76)}
.v4111-compact-grid .department-grid-role{
  min-height:67px;
  padding:6px 7px;
  justify-content:center;
  background:#eef5f7;
  border-right-color:#c8dbe3;
}
.v4111-compact-grid .department-grid-role strong{font-size:.58rem;line-height:1.08}
.v4111-compact-grid .department-grid-role small{margin-top:3px;font-size:.43rem}
.v4111-compact-grid .department-grid-role span{margin-top:3px;font-size:.42rem;font-weight:850;color:var(--planner-blue-dark)}
.v4111-compact-grid .department-grid-slot{
  min-height:67px;
  padding:3px 3px 19px;
  background:#fff;
}
.v4111-compact-grid .department-grid-slot:nth-child(even){background:#fbfdfe}
.v4111-compact-grid .department-grid-slot:hover{background:#eff8fb}
.v4111-compact-grid .department-shift-list{display:flex;flex-wrap:wrap;gap:3px;align-content:flex-start}
.v4111-compact-grid .department-shift-block{
  flex:1 1 66px;
  min-width:0;
  min-height:31px;
  padding:3px 4px;
  border:1px solid color-mix(in srgb,var(--dept) 35%,#ccdbe1);
  border-left:3px solid var(--dept);
  border-radius:4px;
  background:#fff;
  box-shadow:none;
}
.v4111-compact-grid .department-shift-block:hover{transform:none;box-shadow:0 3px 9px rgba(7,93,130,.12);background:#f7fcfe}
.v4111-compact-grid .department-shift-block.open{border-style:dashed;border-color:#bd3d49;background:#fff5f6}
.v4111-compact-grid .department-shift-block.conflict{border-color:#c93a48;background:#fff0f2}
.v4111-compact-grid .department-shift-block.unavailable{border-color:#d58c2f;background:#fff8ef}
.department-shift-topline{display:flex;align-items:center;justify-content:space-between;gap:3px;white-space:nowrap}
.department-shift-topline strong{font-size:.46rem;line-height:1;color:#263843}
.department-shift-topline .shift-state-dot{width:6px;height:6px;min-width:6px}
.department-shift-name{display:block;margin-top:2px;font-size:.48rem;line-height:1.08;font-weight:850;color:#10212d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v4111-compact-grid .department-shift-block>small{display:block;margin-top:2px;font-size:.38rem;font-weight:850;color:#b13240;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v4111-compact-grid .department-grid-add{
  right:2px;bottom:2px;width:15px;height:15px;border-radius:3px;
  border-color:#a9c6d2;color:var(--planner-blue-dark);font-size:.55rem;opacity:.25;
}
.v4111-compact-grid .department-grid-slot:hover .department-grid-add,.v4111-compact-grid .department-grid-add:focus{opacity:1;background:#e7f5fa}
.department-grid-total-label,.department-grid-total{min-height:45px;padding:6px 7px;background:#e4eef2;color:#17313f;border-top:2px solid #9cbcc8}
.department-grid-total-label{display:flex;flex-direction:column;justify-content:center}
.department-grid-total-label strong{font-size:.56rem}.department-grid-total-label small{margin-top:3px;font-size:.42rem;color:#60747e}
.department-grid-total{display:grid;place-items:center;align-content:center;text-align:center;gap:1px}
.department-grid-total strong{font-size:.48rem}.department-grid-total span{font-size:.44rem;font-weight:850;color:var(--planner-blue-dark)}.department-grid-total small{font-size:.39rem;color:#6c7d85}
.compact-roster-empty{padding:22px;text-align:center;border:1px solid #cbdde4;border-top:0}.compact-roster-empty strong,.compact-roster-empty span{display:block}.compact-roster-empty span{margin-top:4px;color:var(--muted);font-size:.7rem}
.planning-page .schedule-card{padding:10px}
.planning-page .schedule-card>.card-header{margin-bottom:8px}
.planning-page .schedule-card>.card-header h2{font-size:1rem}.planning-page .schedule-card>.card-header p{font-size:.65rem}

@media(max-width:1250px){
  .v4111-compact-grid .department-weekgrid{grid-template-columns:112px repeat(7,minmax(0,1fr))}
  .v4111-compact-grid .department-grid-role,.v4111-compact-grid .department-grid-slot{min-height:61px}
  .v4111-compact-grid .department-shift-block{flex-basis:57px;padding:3px}.department-shift-topline strong{font-size:.4rem}.department-shift-name{font-size:.42rem}
}
@media(max-width:900px){
  .compact-roster-caption{align-items:flex-start}.compact-roster-legend{display:none}
  .v4111-compact-grid .department-weekgrid{grid-template-columns:78px repeat(7,minmax(0,1fr))}
  .v4111-compact-grid .department-grid-corner,.v4111-compact-grid .department-grid-day{min-height:49px;padding:3px 2px}
  .v4111-compact-grid .department-grid-corner strong{font-size:.48rem}.v4111-compact-grid .department-grid-corner small{display:none}.planner-week-label{font-size:.38rem;padding:2px 4px}
  .v4111-compact-grid .department-grid-day span{font-size:.38rem}.v4111-compact-grid .department-grid-day>strong{font-size:.51rem}.planner-day-kpis{gap:1px}.planner-day-kpis b,.planner-day-kpis i{font-size:.31rem;min-width:16px;padding:1px 2px}.planner-day-kpis em{display:none}
  .v4111-compact-grid .department-grid-role,.v4111-compact-grid .department-grid-slot{min-height:52px}.v4111-compact-grid .department-grid-role{padding:3px}.v4111-compact-grid .department-grid-role strong{font-size:.4rem}.v4111-compact-grid .department-grid-role small,.v4111-compact-grid .department-grid-role span{font-size:.32rem}
  .v4111-compact-grid .department-shift-block{flex:1 1 100%;min-height:24px;padding:2px;border-left-width:2px}.department-shift-topline strong{font-size:.31rem}.department-shift-name{font-size:.33rem}.v4111-compact-grid .department-shift-block>small,.department-shift-topline .shift-state-dot{display:none}
  .department-grid-total-label,.department-grid-total{min-height:36px;padding:3px}.department-grid-total-label strong,.department-grid-total strong{font-size:.36rem}.department-grid-total-label small,.department-grid-total span,.department-grid-total small{font-size:.3rem}
}
@media(max-width:600px){
  .planning-page .schedule-card{padding:5px}
  .v4111-compact-grid .department-weekgrid{grid-template-columns:58px repeat(7,minmax(0,1fr))}
  .compact-roster-caption{min-height:40px;padding:6px 8px}.compact-roster-caption strong{font-size:.6rem}.compact-roster-caption>div:first-child span{font-size:.42rem}
  .v4111-compact-grid .department-grid-section{min-height:22px;padding:3px 4px}.v4111-compact-grid .department-grid-section strong{font-size:.43rem}.v4111-compact-grid .department-grid-section small{display:none}
  .v4111-compact-grid .department-grid-role,.v4111-compact-grid .department-grid-slot{min-height:46px}
  .v4111-compact-grid .department-grid-role strong{font-size:.34rem}.v4111-compact-grid .department-grid-role small,.v4111-compact-grid .department-grid-role span{display:none}
  .v4111-compact-grid .department-grid-add{width:12px;height:12px;font-size:.42rem}
  .department-shift-topline strong{font-size:.28rem}.department-shift-name{font-size:.29rem}
}

@media print{
  .compact-roster-caption{background:#087aa6!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .v4111-compact-grid .department-grid-corner,.v4111-compact-grid .department-grid-day,.v4111-compact-grid .department-grid-section{background:#087aa6!important;color:#fff!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .v4111-compact-grid .department-grid-add{display:none!important}
}

/* ===== V4.11.2 hotfix: compact planning, week publication, availability ===== */
.planner-summary-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.planner-week-state{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:16px;border:1px solid #d9e6e8;background:#f7fbfb;min-width:240px;box-shadow:inset 0 1px 0 rgba(255,255,255,.65)}
.planner-week-state strong{display:block;font-size:.82rem;color:#153341;line-height:1.15}
.planner-week-state small{display:block;font-size:.7rem;color:var(--muted);line-height:1.25}
.planner-week-state-dot{width:10px;height:10px;border-radius:999px;background:#7d8e95;box-shadow:0 0 0 4px rgba(125,142,149,.12);flex:none}
.planner-week-state.online{background:#eefbf5;border-color:#b9e2c8}.planner-week-state.online .planner-week-state-dot{background:#24a362;box-shadow:0 0 0 4px rgba(36,163,98,.16)}
.planner-week-state.offline{background:#fff5f5;border-color:#f5c9cf}.planner-week-state.offline .planner-week-state-dot{background:#d4455a;box-shadow:0 0 0 4px rgba(212,69,90,.14)}
.planner-week-state.partial{background:#fff9ed;border-color:#f2ddb0}.planner-week-state.partial .planner-week-state-dot{background:#e1a324;box-shadow:0 0 0 4px rgba(225,163,36,.16)}
.planner-toolbar-actions{align-items:center}
.planner-status-pill{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:999px;border:1px solid #d3dfe2;background:#f7fbfb;color:#123443;font-size:.72rem;font-weight:900;white-space:nowrap}
.planner-status-pill.online{background:#eefbf5;border-color:#b9e2c8;color:#156b42}
.planner-status-pill.offline{background:#fff5f5;border-color:#f5c9cf;color:#a72f42}
.planner-status-pill.partial{background:#fff8ec;border-color:#f2ddb0;color:#8a6110}
.planner-status-stat{border:1px solid #dce8ea;background:#f9fcfc}
.planner-status-stat.online{border-color:#b9e2c8;background:#eefbf5}
.planner-status-stat.offline{border-color:#f5c9cf;background:#fff5f5}
.planner-status-stat.partial{border-color:#f2ddb0;background:#fff8ec}
.planner-status-stat small{font-weight:800;color:#4d6874}
.planner-status-stat strong{font-weight:950}

.compact-roster-caption{padding:14px 16px;gap:16px;align-items:flex-start}
.compact-roster-caption strong{font-size:1rem;line-height:1.1}
.compact-roster-caption span{font-size:.72rem;line-height:1.3;color:#e2f5fb}
.compact-roster-tools{display:flex;flex-direction:column;align-items:flex-end;gap:8px;max-width:62%}
.compact-roster-legend{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px 12px}
.compact-roster-legend span{display:inline-flex;align-items:center;gap:6px;font-size:.66rem;font-weight:800;color:#edf9ff;line-height:1.1;position:relative}
.compact-roster-legend i{display:inline-block;width:8px;height:8px;border-radius:999px;flex:none}
.compact-roster-legend .legend-open,.compact-roster-legend .legend-conflict,.compact-roster-legend .legend-available,.compact-roster-legend .legend-unavailable{padding-left:14px}
.compact-roster-legend .legend-open::before,.compact-roster-legend .legend-conflict::before,.compact-roster-legend .legend-available::before,.compact-roster-legend .legend-unavailable::before{content:'';position:absolute;left:0;top:50%;width:8px;height:8px;border-radius:999px;transform:translateY(-50%)}
.compact-roster-legend .legend-open::before{background:#50a7ff}
.compact-roster-legend .legend-conflict::before{background:#ff6b6b}
.compact-roster-legend .legend-available::before{background:#4fd28a}
.compact-roster-legend .legend-unavailable::before{background:#ff9aa6}
.shift-state-dot{display:inline-block;width:8px;height:8px;border-radius:999px;background:#f0b03f;box-shadow:0 0 0 2px rgba(255,255,255,.65)}
.shift-state-dot.published{background:#2ab36f}
.shift-state-dot.draft{background:#f0b03f}

.department-grid-corner{min-height:78px;padding:12px 10px}
.department-grid-corner strong{font-size:.95rem;line-height:1.15}
.planner-week-label{font-size:.66rem;font-weight:900;color:#0f6476;text-transform:uppercase;letter-spacing:.05em}
.department-grid-day{min-height:78px;padding:11px 8px 10px}
.department-grid-day span{font-size:.68rem;font-weight:900;color:#0d6a7d;letter-spacing:.03em}
.department-grid-day strong{font-size:.98rem;line-height:1.05;color:#fff}
.department-grid-day.today{box-shadow:inset 0 -3px 0 rgba(255,255,255,.75)}
.department-grid-day .planner-day-kpis{margin-top:6px}
.department-grid-day .planner-day-kpis b,.department-grid-day .planner-day-kpis i,.department-grid-day .planner-day-kpis em{font-size:.62rem}
.department-grid-slot{padding:4px 4px 20px}
.department-slot-stack{display:flex;flex-direction:column;gap:4px;min-height:54px}
.department-shift-list.vertical{display:flex;flex-direction:column;align-items:stretch;gap:4px;flex-wrap:nowrap}
.v4111-compact-grid .department-shift-block{width:100%;flex:0 0 auto;min-height:31px;padding:4px 6px 5px;border-left-width:3px;gap:3px}
.department-shift-topline strong{font-size:.48rem;line-height:1.05}
.department-shift-name{font-size:.49rem;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.department-shift-availability,.department-shift-helper{display:inline-flex;align-items:center;gap:4px;max-width:100%;width:max-content;padding:2px 6px;border-radius:999px;font-size:.53rem;font-weight:900;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.department-shift-availability.available{background:#ecfdf3;color:#176b43}
.department-shift-availability.unavailable{background:#fff1f2;color:#b11c35}
.department-shift-helper{background:#eef5f6;color:#46616c}
.department-shift-helper.conflict,.department-shift-helper.unavailable{background:#fff1f2;color:#b11c35}
.department-shift-helper.open{background:#eff6ff;color:#195da9}
.department-availability-list{display:flex;flex-direction:column;gap:4px}
.department-availability-card{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:4px 6px;border-radius:10px;border:1px dashed #cadbdd;background:#f8fbfc;font-size:.56rem;line-height:1.2;color:#43606a}
.department-availability-card strong{font-size:.58rem;color:#173543;line-height:1.15}
.department-availability-card.available{background:#ecfdf3;border-color:#b9e2c8;color:#1a6e45}
.department-availability-card.unavailable{background:#fff5f5;border-color:#f4c7cc;color:#a72f42}
.department-cell-empty{font-size:.6rem;color:#7e959b;padding:4px 2px 0;line-height:1.3}
.department-grid-add{opacity:.68;background:#fff}
.v4111-compact-grid .department-grid-slot:hover .department-grid-add,.v4111-compact-grid .department-grid-add:focus{opacity:1;background:#f4fbfd}

@media (max-width:1180px){
  .planner-summary-actions{justify-content:flex-start}
  .planner-week-state{min-width:0;flex:1 1 220px}
  .compact-roster-tools{max-width:none;align-items:flex-start}
  .compact-roster-legend{justify-content:flex-start}
}

@media (max-width:900px){
  .compact-roster-caption{padding:12px 12px 13px}
  .department-grid-corner,.department-grid-day{min-height:72px}
  .v4111-compact-grid .department-shift-block{min-height:28px;padding:3px 5px 4px}
}


/* ShiftKlaar V5 RC1 - georganiseerde managernavigatie + Live Cockpit */
.nav-group{padding:12px 10px 4px;color:rgba(255,255,255,.38);font-size:.56rem;font-weight:950;letter-spacing:.13em;text-transform:uppercase;user-select:none}
.nav-group:first-child{padding-top:3px}.sidebar>.nav{align-content:start}.nav button.active{box-shadow:inset 3px 0 0 var(--teal)}

.cockpit-page{gap:14px}.cockpit-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:19px 22px;border-radius:17px;background:radial-gradient(circle at 10% 20%,rgba(0,173,156,.2),transparent 38%),linear-gradient(135deg,#102333,#173547);color:#fff;box-shadow:0 18px 44px rgba(15,29,42,.14)}.cockpit-hero h2{margin:3px 0 4px;font-size:1.5rem;letter-spacing:-.035em}.cockpit-hero p:last-child{margin:0;color:rgba(255,255,255,.63);font-size:.75rem}.cockpit-hero .eyebrow{color:var(--mint)}.cockpit-hero-state{display:grid;grid-template-columns:10px auto;align-items:center;gap:1px 8px;min-width:155px;padding:10px 13px;border:1px solid rgba(255,255,255,.13);border-radius:12px;background:rgba(255,255,255,.07)}.cockpit-hero-state>span{grid-row:1/3;width:9px;height:9px;border-radius:50%}.cockpit-hero-state.good>span{background:#3ed19a;box-shadow:0 0 0 4px rgba(62,209,154,.12)}.cockpit-hero-state.attention>span{background:#ffb24b;box-shadow:0 0 0 4px rgba(255,178,75,.12)}.cockpit-hero-state strong{font-size:.72rem}.cockpit-hero-state small{color:rgba(255,255,255,.58);font-size:.6rem}
.cockpit-kpi-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.cockpit-kpi{min-height:112px;padding:14px}.cockpit-kpi .kpi-value{margin-top:10px;font-size:1.55rem}.cockpit-kpi .kpi-icon{width:32px;height:32px;border-radius:9px}.cockpit-kpi-alert{border-color:#f2c9a2;background:#fffaf4}.cockpit-status-value{font-size:1.1rem!important}.cockpit-status-value.online{color:var(--success)}.cockpit-status-value.partial{color:var(--warn)}.cockpit-status-value.offline{color:var(--danger)}
.cockpit-grid-main{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,.72fr);gap:14px}.cockpit-grid-bottom{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(330px,.8fr);gap:14px}.cockpit-actions-card,.cockpit-trend-card,.cockpit-operation-card{min-width:0}.cockpit-action-list{display:grid;gap:7px}.cockpit-action-row{display:grid;grid-template-columns:7px minmax(0,1fr) auto 14px;align-items:center;gap:10px;width:100%;padding:10px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--text);text-align:left}.cockpit-action-row:hover{border-color:#b7d8d5;background:#fbfefd}.cockpit-action-row .cockpit-action-indicator{align-self:stretch;border-radius:999px;background:var(--teal)}.cockpit-action-row.severity-warning .cockpit-action-indicator{background:#e49b36}.cockpit-action-row.severity-critical .cockpit-action-indicator{background:var(--danger)}.cockpit-action-row strong,.cockpit-action-row small{display:block}.cockpit-action-row strong{font-size:.72rem;color:var(--ink)}.cockpit-action-row small{margin-top:2px;color:var(--muted);font-size:.58rem}.cockpit-action-row b{display:grid;place-items:center;min-width:24px;height:24px;padding:0 6px;border-radius:999px;background:var(--surface-2);font-size:.62rem}.cockpit-action-row i{font-style:normal;color:var(--muted)}
.cockpit-trend{display:grid;gap:8px;margin-top:3px}.cockpit-trend-row{display:grid;grid-template-columns:42px minmax(0,1fr) 76px;align-items:center;gap:8px}.cockpit-trend-row>span{color:var(--muted);font-size:.6rem;text-transform:capitalize}.cockpit-trend-row>strong{text-align:right;font-size:.62rem;color:var(--ink)}.cockpit-trend-track{height:14px;position:relative;border-radius:999px;background:#edf3f3;overflow:visible}.cockpit-revenue-bar{position:absolute;inset:0 auto 0 0;border-radius:999px;background:linear-gradient(90deg,var(--teal),#49d2c3)}.cockpit-labor-mark{position:absolute;top:-3px;bottom:-3px;width:2px;border-radius:99px;background:#1e3650;box-shadow:0 0 0 2px #fff}.cockpit-legend{display:flex;gap:15px;margin-top:11px;color:var(--muted);font-size:.58rem}.cockpit-legend span{display:flex;align-items:center;gap:5px}.cockpit-legend i{width:8px;height:8px;border-radius:50%}.cockpit-legend .revenue-dot{background:var(--teal)}.cockpit-legend .labor-dot{background:#1e3650}.cockpit-pos-note{margin-top:13px}.cockpit-focus-stat{display:grid;place-items:start;padding:10px 0}.cockpit-focus-stat strong{font-size:2.5rem;color:var(--ink)}.cockpit-focus-stat span{font-weight:850}.cockpit-focus-stat small{margin-top:5px;color:var(--muted)}
.cockpit-status-list{display:grid;gap:7px}.cockpit-status-list button{display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:center;gap:9px;width:100%;padding:10px;border:1px solid var(--line);border-radius:10px;background:#fff;text-align:left;color:var(--text)}.cockpit-status-list button:hover{background:#fbfefd;border-color:#badbd7}.cockpit-status-list strong,.cockpit-status-list small{display:block}.cockpit-status-list strong{font-size:.72rem;color:var(--ink)}.cockpit-status-list small{margin-top:2px;color:var(--muted);font-size:.58rem}.cockpit-status-list b{font-size:.6rem;color:var(--muted)}.status-orb{width:9px;height:9px;border-radius:50%;background:#9aa9b0}.status-orb.good{background:#26a774}.status-orb.warn{background:#dfa03e}.status-orb.danger{background:var(--danger)}

.action-center-page{gap:14px}.action-center-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}.action-center-list{display:grid;gap:8px}.action-center-item{display:grid;grid-template-columns:36px minmax(0,1fr) auto 68px;align-items:center;gap:11px;width:100%;padding:12px 13px;border:1px solid var(--line);border-left:4px solid var(--teal);border-radius:11px;background:#fff;text-align:left;color:var(--text)}.action-center-item.severity-warning{border-left-color:#e49b36}.action-center-item.severity-critical{border-left-color:var(--danger)}.action-center-item:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(15,29,42,.06)}.action-center-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:var(--surface-2);font-weight:950;color:var(--ink)}.action-center-item strong,.action-center-item small{display:block}.action-center-item strong{font-size:.78rem;color:var(--ink)}.action-center-item small{margin-top:3px;color:var(--muted);font-size:.62rem}.action-center-item>b{display:grid;place-items:center;min-width:30px;height:30px;padding:0 7px;border-radius:999px;background:var(--surface-2);font-size:.7rem}.action-center-item>i{font-style:normal;text-align:right;color:var(--teal);font-size:.64rem;font-weight:850}

@media(max-width:1200px){.cockpit-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.cockpit-grid-main,.cockpit-grid-bottom{grid-template-columns:1fr}.cockpit-actions-card{order:-1}}
@media(max-width:780px){.nav-group{display:none!important}.cockpit-hero{align-items:flex-start;padding:16px}.cockpit-hero-state{min-width:132px}.cockpit-kpi-grid,.action-center-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.cockpit-grid-main,.cockpit-grid-bottom{gap:11px}.cockpit-action-row{grid-template-columns:6px minmax(0,1fr) auto}.cockpit-action-row>i{display:none}.cockpit-trend-row{grid-template-columns:37px minmax(0,1fr) 68px}.action-center-item{grid-template-columns:32px minmax(0,1fr) auto}.action-center-item>i{display:none}}
@media(max-width:480px){.cockpit-hero{display:grid}.cockpit-hero-state{width:100%}.cockpit-kpi-grid{grid-template-columns:1fr 1fr}.cockpit-kpi{min-height:100px}.cockpit-kpi .kpi-value{font-size:1.3rem}.action-center-kpis{grid-template-columns:1fr 1fr}}

/* V5 RC1 mobile navigation readability */
@media(max-width:780px){
  .sidebar .nav button,.sidebar .nav a{flex-basis:72px;min-width:72px;font-size:.56rem}
  .sidebar .nav .nav-label{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media(max-width:360px){.sidebar .nav button,.sidebar .nav a{flex-basis:68px;min-width:68px;font-size:.53rem}}

/* ===== V5 RC1.1 mobile/iPhone hotfix + handmatige personeelsuren ===== */
.mobile-bottom-nav,.mobile-nav-sheet{display:none}
.manual-entry-badge,.manual-entry-label{display:inline-flex;align-items:center;gap:4px;margin-left:6px;padding:3px 6px;border-radius:999px;background:#eef6ff;color:#245f9e;font-size:.58rem;font-weight:900;vertical-align:middle}
.manual-entry-label{margin:4px 0 0}
.manual-hours-form .manual-overnight{padding:10px 11px;border:1px solid var(--line);border-radius:11px;background:#f8fbfb}
body{overflow-x:hidden}
.card,.page,.main,.content,.topbar-title{min-width:0}

@media(max-width:780px){
  body:not(.auth-page):not(.offline-page){padding-bottom:calc(78px + env(safe-area-inset-bottom))!important}
  body.mobile-nav-open{overflow:hidden}
  .sidebar{display:none!important}
  .mobile-toggle{display:none!important}
  .mobile-bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:180;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;padding:6px max(6px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left));background:rgba(15,29,42,.98);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid rgba(255,255,255,.1);box-shadow:0 -12px 38px rgba(15,29,42,.2)}
  .mobile-bottom-nav button{position:relative;min-width:0;min-height:55px;border:0;border-radius:11px;background:transparent;color:rgba(255,255,255,.68);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:4px 2px;font-size:.56rem;font-weight:800;line-height:1.05}
  .mobile-bottom-nav button.active,.mobile-bottom-nav button[aria-expanded="true"]{background:rgba(0,173,156,.18);color:#fff}
  .mobile-nav-icon{font-size:1.08rem;color:var(--mint);line-height:1}.mobile-nav-label{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mobile-nav-count{position:absolute;top:3px;right:7px;display:grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#d84b59;color:#fff;font-size:.55rem;font-weight:950}.mobile-nav-count[hidden]{display:none!important}
  .mobile-nav-sheet:not([hidden]){display:block;position:fixed;inset:0;z-index:170}
  .mobile-nav-backdrop{position:absolute;inset:0;width:100%;height:100%;border:0;background:rgba(7,18,27,.55);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
  .mobile-nav-panel{position:absolute;left:8px;right:8px;bottom:calc(70px + env(safe-area-inset-bottom));max-height:min(68dvh,620px);overflow:auto;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 24px 80px rgba(15,29,42,.3);padding:10px}
  .mobile-nav-panel-head{position:sticky;top:-10px;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 9px 12px;background:#fff;border-bottom:1px solid var(--line)}
  .mobile-nav-panel-head strong,.mobile-nav-panel-head small{display:block}.mobile-nav-panel-head small{margin-top:2px;color:var(--muted);font-size:.65rem}
  .mobile-nav-panel-list{display:grid;gap:4px;padding:7px 0 2px}.mobile-nav-group{padding:10px 9px 4px;color:var(--muted);font-size:.58rem;font-weight:950;letter-spacing:.11em;text-transform:uppercase}
  .mobile-nav-panel-list button{position:relative;width:100%;min-height:48px;display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:8px;border:0;border-radius:11px;padding:8px 10px;background:#fff;color:var(--ink);text-align:left;font-weight:800}
  .mobile-nav-panel-list button:hover,.mobile-nav-panel-list button.active{background:var(--teal-soft);color:#006f65}.mobile-nav-panel-list .nav-icon{font-size:1rem}
  .mobile-nav-panel-list .nav-count{position:static;justify-self:end}
  .topbar{min-height:70px!important;display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:8px 10px!important;padding:calc(9px + env(safe-area-inset-top)) 13px 9px!important}
  .topbar-title{flex:1 1 180px}.topbar-title h1{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .topbar-right{margin-left:auto!important;max-width:none!important;flex:0 0 auto}.mobile-account{display:grid!important}
  .top-actions{order:3;flex:1 0 100%;max-width:100%!important;width:100%;overflow-x:auto;overflow-y:hidden;padding:1px 0 2px;scrollbar-width:none}.top-actions::-webkit-scrollbar{display:none}.top-actions:empty{display:none}
  .top-actions .button{white-space:nowrap;min-height:38px;padding:7px 10px;font-size:.68rem}
  .content{width:100%;max-width:100vw;padding:12px 12px 22px!important;overflow-x:hidden}
  .cockpit-page,.action-center-page{width:100%;max-width:100%}
  .cockpit-hero{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;width:100%;padding:14px!important}.cockpit-hero-state{width:100%!important;min-width:0!important}
  .cockpit-kpi-grid,.action-center-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}.cockpit-kpi{min-width:0;min-height:96px!important;padding:12px!important}.cockpit-kpi .kpi-value{font-size:1.25rem!important;overflow-wrap:anywhere}
  .cockpit-grid-main,.cockpit-grid-bottom{grid-template-columns:1fr!important;gap:10px!important}.cockpit-action-row{grid-template-columns:6px minmax(0,1fr) auto!important}.cockpit-action-row>i{display:none!important}.cockpit-trend-row{grid-template-columns:34px minmax(0,1fr) 64px!important}
  .action-center-item{grid-template-columns:30px minmax(0,1fr) auto!important;padding:10px!important}.action-center-item>i{display:none!important}
  .card-header{align-items:stretch}.card-header>.button{width:100%}
  .personnel-hour-row{grid-template-columns:1fr!important;gap:9px!important}.hour-status-block{align-items:flex-start!important;text-align:left!important}
  .hours-status-summary{grid-template-columns:repeat(3,minmax(0,1fr))!important}.hours-status-summary>div{min-width:0}.hours-status-summary span{overflow-wrap:anywhere}
  .modal{max-width:100vw!important}.modal-body{overscroll-behavior:contain}.field input,.field select,.field textarea{font-size:16px!important}
  .table-wrap,.week-wrap{max-width:calc(100vw - 24px);overflow-x:auto!important;-webkit-overflow-scrolling:touch}
  .pwa-install,.pwa-update{z-index:150!important}
}
@media(max-width:420px){
  .mobile-bottom-nav button{font-size:.52rem}.mobile-nav-count{right:4px}.content{padding-left:10px!important;padding-right:10px!important}.cockpit-kpi-grid,.action-center-kpis{grid-template-columns:1fr 1fr!important}.kpi-grid{grid-template-columns:1fr 1fr!important}.clock-time{font-size:2.2rem!important}.clock-button{width:134px!important;height:134px!important;border-width:9px!important}.manual-entry-badge{display:inline-flex;margin:5px 0 0 0}
}
@supports(padding:max(0px)){
  @media(max-width:780px){.mobile-bottom-nav{padding-bottom:max(6px,env(safe-area-inset-bottom))}.topbar{padding-top:max(9px,env(safe-area-inset-top))!important}}
}

/* ===== V5 RC2 serious stability + mobile UI hardening ===== */
.portal-start-error{min-height:100dvh;display:grid;place-items:center;padding:24px}.portal-start-error>.card{width:min(680px,100%)}.portal-start-error h1{margin:5px 0 8px;color:var(--ink)}.portal-start-error p:not(.eyebrow){color:var(--muted);line-height:1.55}
@media(max-width:780px){
  .app-shell{display:block!important;min-height:100dvh!important}.main{width:100%;max-width:100vw}
  .topbar{box-shadow:0 5px 18px rgba(15,29,42,.04)}
  .topbar-title .eyebrow{font-size:.58rem;line-height:1.2}.topbar-title h1{font-size:1.18rem!important;line-height:1.12;margin-top:2px!important}
  .content{padding-top:10px!important;padding-bottom:calc(92px + env(safe-area-inset-bottom))!important}
  .card{max-width:100%;overflow-wrap:anywhere}.card.pad{padding:14px!important}
  .card-header{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:9px!important;align-items:start!important}.card-header>div{min-width:0}.card-header>.button{width:100%!important}.card-header>.toolbar{width:100%;justify-content:flex-start}
  .toolbar{max-width:100%}.toolbar .button{min-height:40px}
  .list-item{min-width:0}.list-item>div,.list-main{min-width:0}.list-item h4,.list-item p{overflow-wrap:anywhere}
  .metric-line{align-items:flex-start}.metric-line>span{min-width:0}.metric-line>strong{min-width:0;text-align:right;overflow-wrap:anywhere}
  .notice{min-width:0}.notice>div{min-width:0;overflow-wrap:anywhere}
  .mobile-user-menu{position:fixed!important;right:10px!important;top:calc(62px + env(safe-area-inset-top))!important;width:min(280px,calc(100vw - 20px))!important;max-height:70dvh;overflow:auto}
  .modal{max-height:calc(100dvh - env(safe-area-inset-top))!important}.modal-head{flex:0 0 auto}.modal-body{min-height:0;max-height:65dvh!important}.modal-actions{flex:0 0 auto}
  .table-wrap{width:100%;max-width:100%!important}
  .availability-week-grid,.own-schedule-grid,.learning-personnel-grid,.operation-phase-grid{min-width:0}
}
@media(max-width:480px){
  .content{padding-left:9px!important;padding-right:9px!important}.page{gap:10px!important}.card.pad{padding:12px!important}
  .list-item{display:grid!important;grid-template-columns:minmax(0,1fr)!important}.list-item>.toolbar,.list-item>.badge,.list-item>button{justify-self:start}.list-item>.toolbar{width:100%}
  .metric-line{display:grid!important;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)!important;gap:8px!important}.metric-line>strong{text-align:right}
  .modal-actions{display:grid!important;grid-template-columns:1fr!important}.modal-actions .button{width:100%!important}
  .clock-panel{padding:20px 12px!important}.clock-status{margin:15px auto!important}
  .top-actions .button{min-height:40px!important}
}

/* ShiftKlaar V5 RC4 — payrollbestand + klokcodebeheer */
.employee-pin-cell{min-width:150px}.employee-pin-cell>.badge{margin-bottom:6px}.employee-pin-cell .toolbar.compact{gap:4px;flex-wrap:wrap}
.payroll-report-page .payroll-report-sheet{border-top:5px solid var(--teal)}
.payroll-report-page .payroll-report-head{padding:16px 18px;border-radius:12px;background:#0f1d2a;border-bottom:0;color:#fff}
.payroll-report-page .payroll-report-head h2,.payroll-report-page .payroll-report-head p{color:#fff}.payroll-report-page .payroll-report-head .eyebrow{color:#7ee3d8}.payroll-report-page .payroll-document-meta span{background:rgba(255,255,255,.1);color:#fff}.payroll-report-page .payroll-document-meta small{color:#a9c4c7}
.payroll-report-page .report-stat-grid{margin-top:14px}.payroll-report-page .report-stat-grid>div{border:1px solid #d8e8e6;background:#f4faf9}
.payroll-report-page .payroll-print-table{border:1px solid #cbdcda}.payroll-report-page .payroll-print-table th{background:#dfeeed;color:#203d3c;border-bottom:1px solid #b9d0cd}.payroll-report-page .payroll-print-table td{border-bottom:1px solid #e5eceb}
@media print{.payroll-report-page .payroll-report-head{background:#0f1d2a!important;color:#fff!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}.payroll-report-page .payroll-report-head h2,.payroll-report-page .payroll-report-head p{color:#fff!important}.payroll-report-page .payroll-document-meta span{background:#20313e!important;color:#fff!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}.payroll-report-page .payroll-report-sheet{border-top:0!important}}

/* V5 RC6 - eenvoudig klokken en pauze */
.clock-action-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px}.clock-action-button{border:1px solid var(--line);border-radius:16px;background:#fff;padding:15px 11px;min-height:104px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--ink);box-shadow:0 7px 20px rgba(15,29,42,.05)}.clock-action-button>span{font-size:1.4rem}.clock-action-button strong{font-size:.92rem}.clock-action-button small{font-size:.67rem;color:var(--muted)}.clock-action-button.in:not(:disabled){border-color:#8fdcd1;background:#effbf8}.clock-action-button.pause:not(:disabled){border-color:#efd3a2;background:#fff9ef}.clock-action-button.pause.active{box-shadow:inset 0 0 0 2px #e1a341}.clock-action-button.out:not(:disabled){border-color:#b5c8d3;background:#f5f8fa}.clock-action-button:disabled{opacity:.42;cursor:not-allowed}.clock-pause-active{background:#fff4dc!important;color:#70470f!important;border-color:#efd09b!important}
@media(max-width:560px){.clock-action-grid{grid-template-columns:1fr}.clock-action-button{min-height:78px;display:grid;grid-template-columns:36px 1fr;text-align:left;justify-items:start}.clock-action-button>span{grid-row:1/3}.clock-action-button strong,.clock-action-button small{grid-column:2}}


/* V5 RC7 - onboarding kennistoets + rustige archieven */
.archive-switch{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.archive-switch .button span{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:5px;padding:0 6px;border-radius:999px;background:rgba(15,29,42,.08);font-size:11px}.button.primary span{background:rgba(255,255,255,.2)}
.onboarding-builder-section{padding:4px 0 18px}.onboarding-builder-section+.onboarding-builder-section{border-top:1px solid var(--line,#dbe4ea);padding-top:18px}.quiz-builder{background:linear-gradient(180deg,rgba(18,182,164,.05),transparent);border-radius:12px;padding-left:10px;padding-right:10px}.learning-quiz-card{margin-top:20px;padding:18px;border:1px solid #cfe4e1;background:#f8fcfb;border-radius:14px}.learning-quiz-card.passed{border-color:#a8d9c2;background:#f4fbf7}.quiz-question-list{display:grid;gap:12px;margin:14px 0}.quiz-question{border:1px solid #dbe4ea;background:#fff;border-radius:12px;padding:14px}.quiz-question-head{display:flex;gap:10px;align-items:flex-start;margin-bottom:11px}.quiz-question-head>span{display:grid;place-items:center;min-width:28px;height:28px;border-radius:8px;background:#0f1d2a;color:#fff;font-weight:800}.quiz-question-head strong{display:block;font-size:15px}.quiz-question-head small{display:block;margin-top:4px;color:#687985}.quiz-answer-grid{display:grid;gap:7px}.quiz-answer{cursor:pointer}.quiz-answer input{position:absolute;opacity:0;pointer-events:none}.quiz-answer span{display:flex;gap:9px;align-items:center;padding:10px 11px;border:1px solid #dbe4ea;border-radius:9px;background:#fff}.quiz-answer b{display:grid;place-items:center;width:26px;height:26px;border-radius:7px;background:#edf4f5;color:#0f1d2a}.quiz-answer input:checked+span{border-color:#12b6a4;box-shadow:0 0 0 2px rgba(18,182,164,.12);background:#f2fbf9}.quiz-answer input:checked+span b{background:#12b6a4;color:#fff}.quiz-answer input:disabled+span{opacity:.58;cursor:not-allowed}.quiz-attempt-history{margin-top:18px;border-top:1px solid #dbe4ea;padding-top:15px}.notice.success{border-color:#9dd7b9;background:#effaf4;color:#176f46}
@media(max-width:700px){.archive-switch{display:grid;grid-template-columns:1fr 1fr}.archive-switch .button{width:100%}.quiz-question{padding:12px}.quiz-answer span{min-height:48px}.learning-quiz-card{padding:13px}}

/* V5 RC7 - onboarding builder: toon alleen velden die bij het gekozen type horen. */
.quiz-field[hidden],.instruction-field[hidden]{display:none!important}

/* V5 RC7.1 - professionele polish voor dagelijkse checklists */
.manager-closing-page{gap:14px}.manager-closing-today,.manager-closing-manage{box-shadow:0 7px 24px rgba(15,29,42,.045)}.closing-progress{height:8px;background:#e8eff1;border-radius:999px;overflow:hidden;margin:0 0 14px}.closing-progress>span{display:block;height:100%;border-radius:999px;background:var(--teal);transition:width .2s ease}.manager-closing-list{display:grid;gap:8px}.manager-closing-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 13px;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;transition:border-color .12s ease,background .12s ease}.manager-closing-row:hover{border-color:#aad2cd;background:#fcfefe}.manager-closing-row.critical{border-left:4px solid var(--danger)}.manager-closing-row.done{background:#f4faf7;border-color:#d7e9e1}.manager-closing-row>input{position:absolute;opacity:0;pointer-events:none}.manager-closing-box{width:38px;height:38px;border:2px solid #bdcdd2;border-radius:10px;display:grid;place-items:center;color:transparent;font-size:20px;font-weight:900;background:#fff}.manager-closing-row:hover .manager-closing-box{border-color:var(--teal)}.manager-closing-row>input:checked+.manager-closing-box{background:#1e9b62;border-color:#1e9b62;color:#fff}.manager-closing-copy{min-width:0;display:grid;gap:3px}.manager-closing-title{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.manager-closing-title strong{font-size:.8rem}.manager-closing-instruction{font-size:.66rem;color:var(--muted);line-height:1.4}.manager-closing-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:2px;color:#617783;font-size:.58rem;font-weight:750}.manager-closing-meta>span{padding:3px 6px;border-radius:7px;background:var(--surface-soft)}.manager-closing-status{font-size:.62rem;font-weight:850;color:#60737d}.manager-closing-row.done .manager-closing-status{color:#1e7a52}.closing-manage-list{display:grid;gap:8px}.closing-manage-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:13px;border:1px solid var(--line);border-radius:12px;background:#fff}.closing-manage-row.inactive{opacity:.65;background:var(--surface-soft)}.closing-manage-copy h3{margin:5px 0 3px;font-size:.82rem}.closing-manage-copy p{margin:0;color:var(--muted);font-size:.66rem;line-height:1.45}.closing-manage-copy small{display:block;margin-top:5px;color:#536a76}.closing-assignment-line{margin-top:7px}.personnel-controls-page .card{box-shadow:0 7px 24px rgba(15,29,42,.04)}.closing-check-card{border-radius:12px!important;min-height:72px}.closing-check-card .closing-check-main{align-items:center}.closing-check-card input[type=checkbox]{width:26px;height:26px;accent-color:var(--teal);cursor:pointer}.closing-check-card.done{background:#f4faf7!important;border-color:#d7e9e1!important}.card-header h2{letter-spacing:-.01em}
@media(max-width:760px){.manager-closing-row{grid-template-columns:40px minmax(0,1fr)}.manager-closing-status{grid-column:2}.closing-manage-row{grid-template-columns:1fr}.closing-manage-row>.toolbar{justify-content:flex-start}.closing-manage-row>.toolbar .button{flex:1}.personnel-controls-page{grid-template-columns:1fr!important}}
/* RC7.1 touch-vinkje personeel: geen klein browsercheckboxje meer */
.closing-check-card input[type=checkbox]{appearance:none;-webkit-appearance:none;width:34px!important;height:34px!important;min-width:34px;border:2px solid #b9cbd0;border-radius:9px;background:#fff;display:grid;place-items:center;cursor:pointer;transition:.12s ease}
.closing-check-card input[type=checkbox]:hover{border-color:var(--teal)}.closing-check-card input[type=checkbox]:checked{background:#1e9b62;border-color:#1e9b62}.closing-check-card input[type=checkbox]:checked::after{content:'✓';color:#fff;font-size:20px;font-weight:950;line-height:1}.closing-check-card input[type=checkbox]:disabled{opacity:1}

/* V5 RC7.5 - modals en checkboxteksten altijd binnen beeld */
.modal-body .form-grid>.field{min-width:0}
.check-line{display:flex;align-items:flex-start;justify-content:flex-start;gap:10px;max-width:100%;min-width:0;width:100%;line-height:1.35;overflow-wrap:anywhere}
.check-line input[type="checkbox"],.check-line input[type="radio"]{width:18px!important;height:18px!important;min-width:18px!important;max-width:18px!important;min-height:18px!important;max-height:18px!important;flex:0 0 18px;padding:0!important;margin:1px 0 0!important}
.modal{max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}
.modal-body{min-width:0;overscroll-behavior:contain}
.modal-body .field input,.modal-body .field select,.modal-body .field textarea{max-width:100%;min-width:0}
.modal-actions{flex-wrap:wrap}
@media(max-width:780px){.modal{width:calc(100% - 16px);max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}.modal-head{padding:16px}.modal-body{padding:16px;max-height:calc(100dvh - 165px)}.modal-actions{padding:12px 16px 16px}.modal-actions .button{max-width:100%;white-space:normal}}

/* V5 RC7.6 - medewerkersbeheer binnen beeld + veilige verwijderflow */
.employee-management-page,.employee-directory-card{min-width:0;max-width:100%}
.employee-table-wrap{position:relative;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.employee-table{min-width:1180px}
.employee-table td{min-width:0;overflow-wrap:anywhere}
.employee-table td>strong,.employee-table td>small{max-width:100%}
.employee-table .employee-actions-cell{position:sticky;right:0;z-index:3;min-width:225px;background:#fff;box-shadow:-12px 0 18px -16px rgba(15,29,42,.45)}
.employee-table thead th:last-child{position:sticky;right:0;z-index:4;background:#f2f6f6;box-shadow:-12px 0 18px -16px rgba(15,29,42,.35)}
.employee-table tr:hover .employee-actions-cell{background:#fbfdfd}
.employee-row-actions{justify-content:flex-end;gap:5px;flex-wrap:wrap}
.employee-account-cell .badge{margin-bottom:5px}.employee-account-action{display:flex;margin-top:5px}
.employee-actions-cell .button.danger{background:#fff;color:var(--danger);border:1px solid #efc8ce}
.employee-actions-cell .button.danger:hover{background:var(--danger-soft)}
@media(max-width:1180px){
  .employee-table-wrap{overflow:visible!important;border:0!important;background:transparent}
  .employee-table{display:block;min-width:0!important;width:100%;border-collapse:separate}
  .employee-table thead{display:none}
  .employee-table tbody{display:grid;gap:10px;width:100%}
  .employee-table tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px;width:100%;padding:10px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 5px 18px rgba(15,29,42,.035)}
  .employee-table tbody tr[hidden]{display:none!important}
  .employee-table tbody td{display:block;min-width:0;padding:8px 9px;border:0!important;background:transparent!important;text-align:left!important}
  .employee-table tbody td::before{content:attr(data-label);display:block;margin-bottom:4px;color:var(--muted);font-size:.57rem;font-weight:900;text-transform:uppercase;letter-spacing:.055em}
  .employee-table .employee-actions-cell{position:static;grid-column:1/-1;min-width:0;box-shadow:none;border-top:1px solid var(--line)!important;margin-top:4px;padding-top:12px}
  .employee-table .employee-actions-cell::before{margin-bottom:7px}
  .employee-row-actions{justify-content:flex-start}
  .employee-row-actions .button{min-height:38px}
  .employee-pin-cell{min-width:0!important}
}
@media(max-width:620px){
  .employee-table tbody tr{grid-template-columns:1fr;padding:9px}
  .employee-table .employee-actions-cell{grid-column:auto}
  .employee-row-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  .employee-row-actions .button{width:100%;white-space:normal}
  .employee-row-actions .button.danger:last-child:nth-child(3){grid-column:1/-1}
}

/* V5 RC8.2 - availability month overview + linked reports/insights */
.availability-month-legend{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.availability-month-legend span{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:999px;font-size:11px;font-weight:800;background:#eef3f5;color:#546771}
.availability-month-legend span:before{content:"";width:8px;height:8px;border-radius:999px;background:#c4d0d5}
.availability-month-legend .available:before{background:#36a86b}
.availability-month-legend .unavailable:before{background:#dc5d5d}
.availability-month-legend .pending:before{background:#e7a43e}
.availability-month-legend .rejected:before{background:#8c98a0}
.availability-month-scroll{overflow:auto;max-height:58vh;border:1px solid #dfe8eb;border-radius:14px;background:#fff}
.availability-month-days,.availability-month-row{display:grid;grid-template-columns:minmax(170px,210px) repeat(31,minmax(28px,1fr));min-width:1120px;align-items:center}
.availability-month-days{position:sticky;top:0;z-index:4;background:#f5f8f9;border-bottom:1px solid #dfe8eb}
.availability-month-days b{padding:8px 2px;text-align:center;font-size:10px;color:#667983}
.availability-month-row{border-bottom:1px solid #edf2f4}
.availability-month-row:last-child{border-bottom:0}
.availability-month-person{position:sticky;left:0;z-index:2;background:#fff;padding:9px 12px;border-right:1px solid #edf2f4}
.availability-month-person strong,.availability-month-person small{display:block}
.availability-month-person small{margin-top:2px;color:#809099;font-size:10px}
.availability-month-cell{display:flex;align-items:center;justify-content:center;height:26px;margin:3px 2px;border-radius:7px;background:#eef3f5;color:#8a9aa2;font-size:10px;font-weight:800}
.availability-month-cell.available{background:#dff5e8;color:#197848}
.availability-month-cell.unavailable{background:#fde5e5;color:#a83e3e}
.availability-month-cell.pending{background:#fff0d6;color:#986415}
.availability-month-cell.rejected{background:#e9edef;color:#6e7d85}
.own-availability-month-grid{display:grid;grid-template-columns:repeat(7,minmax(84px,1fr));gap:8px}
.own-availability-month-cell{min-height:74px;padding:9px;border-radius:12px;background:#eef3f5;border:1px solid #e0e8eb}
.own-availability-month-cell span{display:block;font-size:18px;font-weight:900;color:#21323c}
.own-availability-month-cell small{display:block;margin-top:6px;color:#72858e;font-size:10px;line-height:1.25}
.own-availability-month-cell.available{background:#e6f8ed;border-color:#c9ecd7}
.own-availability-month-cell.unavailable{background:#fdeaea;border-color:#f4cccc}
.own-availability-month-cell.pending{background:#fff3df;border-color:#f4ddb5}
.own-availability-month-cell.rejected{background:#eff2f4;border-color:#dfe5e8}
.insights-report-link{margin-bottom:14px}
.insights-report-summary{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:14px;border-radius:14px;background:#f5f8f9}
.insights-report-summary p{margin:5px 0 0;color:#60737d;line-height:1.45}
.insights-report-summary>div:last-child{display:flex;align-items:flex-end;flex-direction:column;gap:6px;white-space:nowrap}
.insights-report-note{display:block;max-width:240px;margin-top:5px;color:#6e8089;white-space:normal;line-height:1.3}
@media(max-width:700px){.own-availability-month-grid{grid-template-columns:repeat(4,minmax(70px,1fr))}.insights-report-summary{flex-direction:column}.insights-report-summary>div:last-child{align-items:flex-start}}

/* V5 RC8.3 - availability requests grouped per employee/week */
.availability-review-card{overflow:hidden}
.availability-review-tip{margin-bottom:14px}
.availability-review-list{display:grid;gap:14px}
.availability-review-week{border:1px solid var(--line);border-radius:16px;background:#fbfdfd;overflow:hidden}
.availability-review-week>header{display:grid;grid-template-columns:minmax(230px,1fr) auto auto;gap:14px;align-items:center;padding:14px 15px;border-bottom:1px solid var(--line);background:#fff}
.availability-review-person{display:flex;gap:11px;align-items:center;min-width:0}
.availability-review-person .avatar{flex:0 0 38px}
.availability-review-person h3{margin:0;color:var(--ink);font-size:.95rem}
.availability-review-person p{margin:3px 0 0;color:var(--muted);font-size:.72rem}
.availability-review-summary{display:flex;gap:6px;flex-wrap:wrap;align-items:center;justify-content:flex-end}
.availability-review-summary span{padding:5px 8px;border-radius:999px;background:#edf4f3;color:#45626a;font-size:.66rem;font-weight:850}
.availability-review-summary span.danger{background:var(--danger-soft);color:var(--danger)}
.availability-review-summary small{width:100%;text-align:right;color:var(--muted);font-size:.64rem}
.availability-review-actions{justify-content:flex-end}
.availability-review-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:0;background:#fff}
.availability-review-day{position:relative;min-height:136px;padding:11px 10px;border-right:1px solid var(--line);background:#fff}
.availability-review-day:last-child{border-right:0}
.availability-review-day.available{background:#f5fcf8}
.availability-review-day.unavailable{background:#fff7f7}
.availability-review-day.pending{background:#fffaf1}
.availability-review-day.rejected{background:#f4f6f7}
.availability-review-day.empty-day{background:#fafcfc;color:#9aa8ae}
.availability-review-day-head{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:11px}
.availability-review-day-head strong{color:var(--ink);font-size:.72rem;text-transform:uppercase}
.availability-review-day-head span{color:var(--muted);font-size:.66rem}
.availability-review-state b{display:block;color:var(--ink);font-size:.78rem}
.availability-review-state small{display:block;margin-top:3px;color:var(--muted);font-size:.62rem}
.availability-review-state.none b{color:#9aa8ae}
.availability-review-day p{margin:8px 0 0;color:var(--muted);font-size:.63rem;line-height:1.35}
.availability-review-conflict{margin-top:8px;padding:5px 6px;border-radius:8px;background:var(--danger-soft);color:var(--danger);font-size:.61rem;font-weight:850}
.availability-review-day-actions{position:absolute;left:9px;right:9px;bottom:8px;display:flex;justify-content:flex-end;gap:5px}
.button.tiny{min-width:30px;padding:5px 8px;font-size:.67rem;border-radius:8px}
@media(max-width:1100px){.availability-review-week>header{grid-template-columns:1fr auto}.availability-review-actions{grid-column:1/-1}.availability-review-days{overflow-x:auto;grid-template-columns:repeat(7,minmax(150px,1fr))}.availability-review-day{min-width:150px}}
@media(max-width:700px){.availability-review-week>header{grid-template-columns:1fr}.availability-review-summary{justify-content:flex-start}.availability-review-summary small{text-align:left}.availability-review-actions{justify-content:flex-start}.availability-review-actions .button{flex:1}.availability-review-days{display:flex;overflow-x:auto}.availability-review-day{flex:0 0 160px;min-height:150px}}

/* V5 RC8.6 - calm workforce planning & availability */
.planning-page{--calm-ink:#22313a;--calm-muted:#74828a;--calm-line:#dde5e8;--calm-soft:#f6f8f9;--calm-soft-2:#eef3f4;--calm-green:#2f7b62;--calm-green-soft:#edf7f2;--calm-red:#a65353;--calm-red-soft:#fbf1f1;--calm-amber:#9b6b2f;--calm-amber-soft:#fbf6ed}
.calm-planner-overview{box-shadow:none;border-color:#dfe6e8;border-radius:14px;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:18px;background:#fff}
.calm-planner-overview-main{display:flex;align-items:center;gap:24px;min-width:0}
.calm-week-navigation{display:flex;align-items:center;gap:9px;min-width:max-content}
.calm-week-navigation>div{display:grid;gap:2px;min-width:132px;text-align:center}.calm-week-navigation span{font-size:.62rem;color:#7b8990;text-transform:uppercase;letter-spacing:.07em;font-weight:800}.calm-week-navigation strong{font-size:.86rem;color:#24333c}.calm-week-navigation .button{width:32px;height:32px;padding:0;border-radius:8px;box-shadow:none}
.calm-week-navigation.compact>div{min-width:150px}
.calm-planner-metrics{display:flex;align-items:center;gap:20px;padding-left:22px;border-left:1px solid #e3e9eb}.calm-planner-metrics>span{display:grid;gap:2px}.calm-planner-metrics small{font-size:.58rem;color:#829097;text-transform:uppercase;letter-spacing:.05em;font-weight:800}.calm-planner-metrics strong{font-size:.82rem;color:#263740}
.calm-planner-overview-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}.calm-planner-overview-actions .planner-week-state{padding:0 10px 0 0;border:0;background:transparent;min-width:0}.calm-planner-overview-actions .planner-week-state small{max-width:180px}.calm-planner-overview-actions .button{box-shadow:none}
.calm-schedule-card{box-shadow:none;border-color:#dfe6e8;padding:16px!important}.calm-schedule-card>.card-header{margin-bottom:12px!important}.calm-schedule-card>.card-header h2{font-size:1.05rem!important}.calm-schedule-card>.card-header p{font-size:.74rem!important;max-width:760px}
.calm-planner-shell{border:1px solid #dfe6e8;border-radius:12px;background:#fff;overflow:hidden}
.calm-planner-subbar{min-height:52px;padding:8px 10px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #e3e9eb;background:#fafbfb}
.calm-planner-filter{display:flex;align-items:center;gap:8px}.calm-planner-filter input,.calm-planner-filter select{height:34px;border:1px solid #d8e1e4;border-radius:8px;background:#fff;color:#263740;padding:0 10px;font-size:.72rem;outline:none}.calm-planner-filter input{width:230px}.calm-planner-filter input:focus,.calm-planner-filter select:focus{border-color:#8fb7b1;box-shadow:0 0 0 2px rgba(47,123,98,.08)}
.calm-planner-hints{display:flex;align-items:center;justify-content:flex-end;gap:11px;flex-wrap:wrap;color:#74828a;font-size:.62rem;font-weight:700}.calm-planner-hints>span{display:inline-flex;align-items:center;gap:5px}.calm-status-dot{width:7px;height:7px;border-radius:50%;background:#a7b1b6}.calm-status-dot.available{background:#4f967a}.calm-status-dot.unavailable{background:#b16a6a}.calm-status-dot.leave{background:#ad8750}
.calm-planner-scroll{overflow:auto;max-height:calc(100vh - 310px);min-height:360px;background:#fff;scrollbar-gutter:stable}
.calm-planner-table{width:100%;min-width:1180px;border-collapse:separate;border-spacing:0;table-layout:fixed;color:#283840}
.calm-planner-table th,.calm-planner-table td{border-right:1px solid #e5eaec;border-bottom:1px solid #e5eaec;vertical-align:top}.calm-planner-table tr>*:last-child{border-right:0}
.calm-planner-table thead th{position:sticky;top:0;z-index:6;height:62px;padding:9px 8px;background:#f7f9fa;text-align:center;font-weight:700}.calm-planner-person-head{left:0;z-index:8!important;width:222px!important;text-align:left!important;padding-left:14px!important}.calm-planner-person-head span,.calm-planner-person-head small{display:block}.calm-planner-person-head span{font-size:.7rem;color:#31434d}.calm-planner-person-head small{margin-top:3px;font-size:.55rem;color:#8a969c;font-weight:650}
.calm-planner-day-head span,.calm-planner-day-head strong,.calm-planner-day-head small{display:block}.calm-planner-day-head span{font-size:.57rem;text-transform:uppercase;color:#75858c;letter-spacing:.06em}.calm-planner-day-head strong{margin-top:2px;font-size:.78rem;color:#283941}.calm-planner-day-head small{margin-top:4px;font-size:.5rem;color:#8b969b;font-weight:650}.calm-planner-day-head.today{background:#edf6f3}.calm-planner-day-head.today strong{color:#2f755f}
.calm-planner-department-row th{padding:7px 12px;background:#f0f4f5;text-align:left;position:sticky;left:0;z-index:3;color:#34464f}.calm-planner-department-row th>span,.calm-planner-department-row th>strong,.calm-planner-department-row th>small{vertical-align:middle}.calm-dept-dot{display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;background:var(--dept,#7e8b92)}.calm-planner-department-row strong{font-size:.68rem}.calm-planner-department-row small{margin-left:8px;color:#839097;font-size:.53rem;font-weight:650}
.calm-planner-person{position:sticky;left:0;z-index:2;width:222px;padding:9px 10px;background:#fff;text-align:left}.calm-planner-employee-row:hover .calm-planner-person,.calm-planner-employee-row:hover td{background:#fbfcfc}.calm-planner-person-main{display:flex;align-items:center;gap:9px}.calm-planner-person-main .avatar{width:31px;height:31px;border-radius:9px;font-size:.68rem;background:#e9f2f0;color:#315e52}.calm-planner-person-main strong,.calm-planner-person-main small{display:block;max-width:126px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.calm-planner-person-main strong{font-size:.68rem;color:#283942}.calm-planner-person-main small{margin-top:2px;font-size:.54rem;color:#829097;font-weight:600}.calm-planner-load{display:flex;align-items:baseline;gap:3px;margin:6px 0 0 40px;color:#60717a}.calm-planner-load span{font-size:.56rem;font-weight:850}.calm-planner-load small{font-size:.5rem}.calm-planner-load.near span{color:#8e672f}.calm-planner-load.over span{color:#a34e4e}
.calm-planner-cell{position:relative;min-height:78px;height:78px;padding:5px 4px 20px;background:#fff}.calm-planner-cell.available{background:#fbfefc}.calm-planner-cell.unavailable{background:#fdfafa}.calm-planner-cell.leave{background:#fcfaf6}.calm-planner-cell.drag-over{background:#edf7f4!important;box-shadow:inset 0 0 0 2px #79a99b}.calm-cell-stack{display:grid;gap:4px}.calm-cell-state{display:block;padding:2px 4px;border-radius:5px;font-size:.47rem;font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#708087;background:#f1f4f5}.calm-cell-state.available{color:#39725e;background:#edf6f2}.calm-cell-state.unavailable{color:#995555;background:#faeeee}.calm-cell-state.leave{color:#87642f;background:#f8f1e6}
.calm-shift-card{position:relative;width:100%;min-height:38px;padding:5px 18px 5px 7px;border:1px solid #dce5e7;border-left:3px solid #6e9c92;border-radius:7px;background:#fff;text-align:left;box-shadow:none;color:#273940;transition:.12s}.calm-shift-card:hover{border-color:#b9c9cd;background:#fbfdfd}.calm-shift-card.dragging{opacity:.45}.calm-shift-card strong,.calm-shift-card small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.calm-shift-card strong{font-size:.58rem;letter-spacing:.01em}.calm-shift-card small{margin-top:2px;color:#75858d;font-size:.48rem;font-weight:600}.calm-shift-card .shift-state-dot{position:absolute;right:6px;top:7px;width:6px;height:6px}.calm-shift-card.draft{border-left-color:#9ba7ac}.calm-shift-card.open{border-left-color:#a56e6e;background:#fffafa}.calm-shift-card.conflict{border-color:#d9abab;background:#fff8f8}.calm-shift-grip{position:absolute;right:5px;bottom:2px;color:#b4bec2;font-size:.45rem;letter-spacing:-2px}
.calm-cell-add{position:absolute;right:4px;bottom:3px;width:17px;height:17px;padding:0;border:0;border-radius:5px;background:transparent;color:#91a0a6;font-size:.76rem;font-weight:800;opacity:.35}.calm-planner-cell:hover .calm-cell-add,.calm-cell-add:focus{opacity:1;background:#eff4f5;color:#405860}
.calm-open-person{display:flex;align-items:center;justify-content:space-between;background:#fafbfb!important}.calm-open-person strong,.calm-open-person small{display:block}.calm-open-person strong{font-size:.64rem}.calm-open-person small{margin-top:2px;color:#87949a;font-size:.52rem}.calm-open-person>span{min-width:23px;height:23px;display:grid;place-items:center;border-radius:999px;background:#eef2f3;font-size:.58rem}.calm-open-cell{background:#fcfcfc}.calm-planner-total-row th,.calm-planner-total-row td{position:sticky;bottom:0;z-index:4;padding:7px 8px;background:#f5f8f8}.calm-planner-total-row th{left:0;z-index:5;text-align:left}.calm-planner-total-row strong,.calm-planner-total-row small{display:block}.calm-planner-total-row strong{font-size:.6rem}.calm-planner-total-row small{margin-top:2px;color:#7b898f;font-size:.48rem}.calm-planner-total-row td{text-align:center}.calm-planner-total-row td strong{font-size:.58rem}.calm-planner-total-row td small{font-size:.45rem}

/* Calm manager availability matrix */
.calm-requests-page{gap:14px}.calm-request-topline{display:flex;align-items:center;justify-content:space-between;gap:14px}.calm-request-topline .archive-switch{margin:0}.calm-request-summary{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.calm-request-summary>span{min-width:118px;padding:8px 10px;border:1px solid #e0e6e8;border-radius:9px;background:#fff}.calm-request-summary small,.calm-request-summary strong{display:block}.calm-request-summary small{font-size:.53rem;color:#829097;text-transform:uppercase;letter-spacing:.04em;font-weight:750}.calm-request-summary strong{margin-top:2px;font-size:.78rem;color:#2c3c44}.calm-availability-review{box-shadow:none;border-color:#dfe6e8}.availability-review-list{gap:12px}
.availability-matrix-week{border:1px solid #dfe6e8;border-radius:11px;background:#fff;overflow:hidden}.availability-matrix-week>header{height:42px;padding:7px 10px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#f6f8f9;border-bottom:1px solid #e2e8ea}.availability-matrix-week>header div{display:flex;align-items:baseline;gap:8px}.availability-matrix-week>header span{font-size:.58rem;text-transform:uppercase;letter-spacing:.05em;color:#7d8a90;font-weight:800}.availability-matrix-week>header strong{font-size:.72rem;color:#30414a}.availability-matrix-week>header small{font-size:.55rem;color:#87949a}
.availability-matrix-scroll{overflow:auto}.availability-matrix-table{width:100%;min-width:1260px;border-collapse:separate;border-spacing:0;table-layout:fixed}.availability-matrix-table th,.availability-matrix-table td{border-right:1px solid #e5eaec;border-bottom:1px solid #e5eaec;vertical-align:top}.availability-matrix-table tr:last-child>*{border-bottom:0}.availability-matrix-table tr>*:last-child{border-right:0}.availability-matrix-table thead th{height:47px;padding:7px 6px;background:#fbfcfc;text-align:center}.availability-matrix-table thead th span,.availability-matrix-table thead th strong{display:block}.availability-matrix-table thead th span{font-size:.53rem;text-transform:uppercase;letter-spacing:.05em;color:#7e8c92}.availability-matrix-table thead th strong{margin-top:2px;font-size:.63rem;color:#32434c}
.availability-matrix-person{width:220px!important;text-align:left!important;padding:9px 10px!important;background:#fff!important;position:sticky;left:0;z-index:2}.availability-matrix-actions-head{width:128px!important}.availability-matrix-person-main{display:flex;align-items:center;gap:8px}.availability-matrix-person-main .avatar{width:31px;height:31px;border-radius:9px;background:#edf3f2;color:#43645b;font-size:.66rem}.availability-matrix-person-main strong,.availability-matrix-person-main small{display:block;max-width:135px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.availability-matrix-person-main strong{font-size:.67rem;color:#2a3b43}.availability-matrix-person-main small{margin-top:2px;font-size:.52rem;color:#849198}.availability-matrix-summary{margin:5px 0 0 39px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.availability-matrix-summary span{font-size:.49rem;color:#7a888e}.availability-matrix-summary b{font-size:.48rem;color:#9c5656}
.availability-matrix-cell{position:relative;height:91px;padding:7px 6px;background:#fff}.availability-matrix-cell.empty{background:#fbfcfc;color:#a0abad}.availability-cell-state{display:flex;align-items:center;gap:4px;color:#7c898f;font-size:.48rem;font-weight:750}.availability-cell-state i{width:6px;height:6px;border-radius:50%;background:#9ca7ac}.availability-matrix-cell.available .availability-cell-state i{background:#4f9278}.availability-matrix-cell.unavailable .availability-cell-state i{background:#ad6868}.availability-matrix-cell.pending .availability-cell-state i{background:#b78646}.availability-matrix-cell.rejected .availability-cell-state i{background:#9ba5aa}.availability-matrix-cell.available{background:#fbfefc}.availability-matrix-cell.unavailable{background:#fdfafa}.availability-matrix-cell.pending{background:#fffcf7}.availability-matrix-cell.rejected{background:#f8f9f9}.availability-cell-value{display:block;margin-top:6px;font-size:.61rem;color:#2f4048;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.availability-matrix-cell>small{display:block;margin-top:4px;font-size:.47rem;color:#839197;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.availability-cell-conflict{display:block;margin-top:4px;color:#9d5454;font-size:.47rem}.availability-cell-actions{position:absolute;right:5px;bottom:5px;display:flex;gap:3px}.availability-matrix-row-actions{width:128px;padding:8px;background:#fbfcfc;text-align:center}.availability-matrix-row-actions .button{width:100%;margin-bottom:5px;box-shadow:none}

/* Calm employee availability entry */
.calm-personnel-requests{gap:16px}.calm-own-availability{box-shadow:none;border-color:#dfe6e8}.calm-own-availability>.card-header{align-items:center}.calm-own-availability>.card-header h2{font-size:1.1rem}.calm-own-availability>.card-header p{max-width:620px}
.calm-availability-presets{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:10px;padding:8px 9px;border:1px solid #e2e8ea;border-radius:9px;background:#f8fafb}.calm-availability-presets>span{margin-right:4px;color:#7d898f;font-size:.56rem;text-transform:uppercase;letter-spacing:.05em;font-weight:800}.calm-availability-presets .button{padding:6px 9px;border-radius:7px;box-shadow:none;font-size:.66rem}
.calm-availability-grid{grid-template-columns:repeat(7,minmax(140px,1fr));gap:0;border:1px solid #dfe6e8;border-radius:11px;overflow:hidden;background:#fff}.calm-availability-day{border:0!important;border-right:1px solid #e4eaec!important;border-radius:0!important;padding:10px 9px!important;background:#fff!important;min-height:210px}.calm-availability-day:last-child{border-right:0!important}.calm-availability-day.available{box-shadow:inset 0 3px 0 #6d9f8d}.calm-availability-day.unavailable{box-shadow:inset 0 3px 0 #b57c7c}.calm-availability-day .availability-day-head{min-height:44px}.calm-availability-day .availability-day-head p{font-size:.58rem;color:#7d8b91;letter-spacing:.04em}.calm-availability-day .availability-day-head strong{font-size:.72rem;color:#2e4048}.calm-request-status{display:inline-flex;align-items:center;min-height:19px;padding:3px 5px;border-radius:5px;background:#f1f4f5;color:#77858b;font-size:.46rem;font-weight:750}.calm-request-status.approved{background:#edf6f1;color:#39715d}.calm-request-status.pending{background:#faf4e8;color:#8b6738}.calm-request-status.rejected{background:#faeeee;color:#985555}
.calm-availability-toggle{margin:8px 0!important;padding:7px!important;border:1px solid #dfe6e8!important;border-radius:7px!important;background:#f8faf9!important;color:#3f655a!important;box-shadow:none}.unavailable .calm-availability-toggle{background:#fbf7f7!important;color:#8d5f5f!important}.calm-availability-toggle span{width:18px!important;height:18px!important;border-radius:5px!important;background:#fff!important}.calm-availability-toggle strong{font-size:.62rem!important}.calm-availability-day .availability-times{gap:5px}.calm-availability-day .availability-times label,.calm-availability-day .availability-note{font-size:.52rem;color:#7c8a90}.calm-availability-day .availability-times input,.calm-availability-day .availability-note input{padding:6px 5px;border-radius:6px;border-color:#dfe6e8;font-size:.62rem}.calm-availability-day .availability-note{margin-top:7px}.calm-availability-save{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:12px;padding-top:12px;border-top:1px solid #e4eaec}.calm-availability-save p{margin:0}.calm-availability-save p strong,.calm-availability-save p span{display:block}.calm-availability-save p strong{font-size:.7rem;color:#30414a}.calm-availability-save p span{margin-top:2px;font-size:.59rem;color:#7d8b91}.calm-availability-save .button{box-shadow:none}

/* Quieter month availability */
.availability-month-legend{gap:7px}.availability-month-legend span{border-radius:6px!important;font-weight:700!important}.availability-month-cell{border-radius:5px!important}.availability-month-cell.available,.own-availability-month-cell.available{background:#edf6f1!important;color:#39715d!important;border-color:#d6e9e0!important}.availability-month-cell.unavailable,.own-availability-month-cell.unavailable{background:#faeeee!important;color:#985555!important;border-color:#efd8d8!important}.availability-month-cell.pending,.own-availability-month-cell.pending{background:#faf4e8!important;color:#8b6738!important;border-color:#eedfc3!important}

@media(max-width:1180px){.calm-planner-overview{align-items:flex-start}.calm-planner-overview-main{display:grid;gap:10px}.calm-planner-metrics{padding-left:0;border-left:0}.calm-request-topline{align-items:flex-start;flex-direction:column}.calm-request-summary{width:100%}.calm-request-summary>span{flex:1}}
@media(max-width:900px){.calm-planner-overview{display:grid}.calm-planner-overview-actions{justify-content:flex-start}.calm-planner-scroll{max-height:none}.calm-planner-subbar{align-items:flex-start;flex-direction:column}.calm-planner-filter{width:100%}.calm-planner-filter input{flex:1;width:auto}.desktop-only{display:none!important}.calm-planner-table{min-width:1080px}.calm-planner-person-head,.calm-planner-person{width:178px!important}.availability-matrix-table{min-width:1120px}.availability-matrix-person{width:185px!important}.calm-availability-grid{display:flex;overflow-x:auto;border-radius:9px}.calm-availability-day{flex:0 0 190px}.calm-availability-save{align-items:stretch;flex-direction:column}.calm-availability-save .button{width:100%}}
@media(max-width:600px){.calm-planner-overview-main{display:grid}.calm-planner-metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:7px 16px}.calm-planner-overview-actions .planner-week-state{display:none}.calm-planner-filter{display:grid;grid-template-columns:1fr}.calm-planner-filter input,.calm-planner-filter select{width:100%}.calm-planner-table{min-width:980px}.calm-planner-person-head,.calm-planner-person{width:154px!important}.calm-planner-person-main .avatar{display:none}.calm-planner-load{margin-left:0}.calm-planner-person-main strong,.calm-planner-person-main small{max-width:132px}.calm-request-summary{display:grid;grid-template-columns:1fr 1fr}.calm-request-summary>span{min-width:0}.availability-matrix-table{min-width:1040px}.availability-matrix-person{width:165px!important}.calm-own-availability>.card-header{align-items:flex-start;display:grid}.calm-week-navigation.compact{margin-top:6px}}

/* RC8.6 refinements */
.calm-availability-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(150px,1fr);overflow-x:auto;scrollbar-gutter:stable}
.calm-availability-day .availability-times input{min-width:0;width:100%}
.planning-page .day-stack-top{border-color:#dfe6e8;background:#f8fafb;box-shadow:none}.planning-page .day-stack-department{border-color:#dfe6e8;background:#fafbfb;box-shadow:none}.planning-page .day-stack-shift.shift-bubble-large{border-radius:9px;box-shadow:none;border-color:#dfe6e8;border-left:3px solid var(--dept,var(--teal));padding:8px 10px}.planning-page .day-stack-shift.shift-bubble-large::before{display:none}.planning-page .day-stack-shift.shift-bubble-large:hover{box-shadow:none;background:#fbfcfc;border-color:#cbd8db}.planning-page .day-stack-stat,.planning-page .day-stack-alert{box-shadow:none;border-color:#dfe6e8}
@media(min-width:901px){.calm-availability-grid{grid-template-columns:repeat(7,minmax(0,1fr));grid-auto-flow:row;grid-auto-columns:auto;overflow:visible}.calm-availability-day .availability-times{grid-template-columns:1fr}.calm-availability-day{min-height:250px}}

/* =========================================================
   V5 RC8.6 - UX hardening / no horizontal scrolling
   ========================================================= */
html,body{max-width:100%;overflow-x:clip}
img,svg,video,canvas{max-width:100%}
.main,.content,.page,.card,.card.pad,.grid-2,.grid-3,.grid-equal,.topbar,.top-actions,.toolbar,.list-item,.form-grid,.field{min-width:0;max-width:100%}
button,a,input,select,textarea{max-width:100%}
button,a,.button,.nav-label,.list-item p,.list-item h4,.card-header p{overflow-wrap:anywhere}
.brand-link,.status-logo-link,.offline-logo-link{display:inline-flex;text-decoration:none}

/* Calm, explicit success/error feedback */
.toast{display:flex;align-items:center;gap:10px;max-width:min(420px,calc(100vw - 28px));min-height:46px;border:1px solid transparent;font-weight:750;line-height:1.35}
.toast.success{background:#173f32;border-color:#2c6b56}.toast.error{background:#662d35;border-color:#8c4650}.toast.info{background:#213744;border-color:#405662}
.toast-feedback-icon{display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;border-radius:999px;background:rgba(255,255,255,.14);font-size:.76rem;font-weight:950}

/* Custom 404 */
.not-found-page{min-height:100dvh;display:grid;place-items:center;padding:24px;background:linear-gradient(180deg,#f5f8f8 0%,#edf3f3 100%)}
.not-found-card{width:min(560px,100%);text-align:center;padding:clamp(24px,6vw,48px)!important}.not-found-card .mark{width:54px;margin:0 auto 20px}.not-found-card h1{margin:7px 0 10px;color:var(--ink);font-size:clamp(2rem,7vw,3.25rem);letter-spacing:-.05em}.not-found-card>p:not(.eyebrow){max-width:420px;margin:0 auto 22px;color:var(--muted);line-height:1.6}.not-found-card .toolbar{justify-content:center}

/* Month availability no longer depends on a 1120px canvas */
.availability-month-scroll{overflow:visible;max-height:none}
.availability-month-days{grid-template-columns:200px 1fr;min-width:0}.availability-month-days>span:first-child{min-width:0}.availability-month-days b{display:none}
.availability-month-row{grid-template-columns:minmax(160px,200px) minmax(0,1fr);min-width:0}
.availability-month-person{position:static;min-width:0}
.availability-month-cells{display:grid;grid-template-columns:repeat(31,minmax(18px,1fr));gap:2px;min-width:0;padding:3px 5px}
.availability-month-cell{min-width:0;margin:0;height:26px}

@media(max-width:780px){
  html,body{width:100%;overflow-x:hidden!important}
  body{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
  .app-shell,.main,.content,.page{width:100%;max-width:100%;min-width:0!important}
  .content{padding:12px 10px calc(82px + env(safe-area-inset-bottom))!important}
  .page{gap:12px!important}
  .card.pad{padding:14px!important}
  .grid-2,.grid-3,.grid-equal{grid-template-columns:1fr!important;gap:12px!important}
  .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}.kpi{min-height:108px;padding:13px!important}.kpi-value{font-size:1.45rem}

  /* Mobile header + actual hamburger menu */
  .topbar{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"menu title account" "actions actions actions";gap:9px 10px;padding:10px 10px 9px!important;min-height:68px!important}
  .mobile-toggle{display:grid!important;grid-area:menu;place-items:center!important;width:40px;height:40px;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:1.15rem;box-shadow:none}
  .topbar-title{grid-area:title;min-width:0}.topbar-title h1{font-size:1.18rem!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-title .eyebrow{font-size:.57rem}
  .topbar-right{grid-area:account}.mobile-account{display:grid!important}
  .top-actions{grid-area:actions;display:flex!important;flex-wrap:wrap!important;align-items:stretch!important;width:100%!important;max-width:100%!important;overflow:visible!important;padding:0!important;gap:6px!important}
  .top-actions:empty{display:none!important}.top-actions .button,.top-actions>a,.top-actions>button,.top-actions>input,.top-actions>select{flex:1 1 auto;white-space:normal!important;min-width:0!important;min-height:38px!important}
  .top-actions .date-nav{width:100%;display:grid;grid-template-columns:auto minmax(0,1fr) auto}.top-actions .date-nav strong{min-width:0!important}

  .mobile-bottom-nav{grid-template-columns:none!important;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:2px!important}.mobile-bottom-nav button{min-width:0!important}
  .mobile-nav-panel{width:min(360px,calc(100vw - 18px))!important;max-width:100%!important}.mobile-nav-panel-list button{min-height:45px;text-align:left}
  body.mobile-nav-open{overflow:hidden!important}

  /* No scrolling tabs; wrap them */
  .tabs,.section-tabs,.status-filter-row,.quick-periods,.calm-availability-presets{display:flex!important;flex-wrap:wrap!important;overflow:visible!important;max-width:100%!important;gap:5px!important}
  .tab,.section-tab,.status-filter,.quick-periods .button,.calm-availability-presets .button{white-space:normal!important;flex:1 1 auto;min-width:0}

  /* Ordinary tables become vertical cards on phones */
  .table-wrap:not(.employee-table-wrap){width:100%!important;max-width:100%!important;overflow:visible!important;border:0!important;background:transparent!important}
  table.mobile-card-table:not(.employee-table){display:block!important;width:100%!important;min-width:0!important;border:0!important}
  table.mobile-card-table:not(.employee-table) thead{display:none!important}
  table.mobile-card-table:not(.employee-table) tbody{display:grid!important;gap:10px!important;width:100%!important}
  table.mobile-card-table:not(.employee-table) tbody tr{display:block!important;width:100%!important;min-width:0!important;padding:8px 10px!important;border:1px solid var(--line)!important;border-radius:12px!important;background:#fff!important;box-shadow:none!important}
  table.mobile-card-table:not(.employee-table) tbody tr[hidden]{display:none!important}
  table.mobile-card-table:not(.employee-table) tbody td{display:grid!important;grid-template-columns:minmax(88px,34%) minmax(0,1fr)!important;gap:10px!important;align-items:start!important;width:100%!important;min-width:0!important;padding:8px 2px!important;border:0!important;border-bottom:1px solid #edf2f3!important;background:transparent!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important}
  table.mobile-card-table:not(.employee-table) tbody td:last-child{border-bottom:0!important}
  table.mobile-card-table:not(.employee-table) tbody td::before{content:attr(data-label);display:block;color:var(--muted);font-size:.58rem;font-weight:900;text-transform:uppercase;letter-spacing:.045em;line-height:1.35}
  table.mobile-card-table:not(.employee-table) tbody td[colspan]{display:block!important}
  table.mobile-card-table:not(.employee-table) tbody td[colspan]::before{display:none}
  table.mobile-card-table:not(.employee-table) .right{text-align:left!important}.data-table .toolbar{justify-content:flex-start!important}

  /* Dyflexis-style calm planner without horizontal canvas */
  .calm-planner-shell,.calm-planner-scroll{width:100%!important;max-width:100%!important;min-width:0!important;overflow:visible!important;max-height:none!important;border:0!important;background:transparent!important}
  .calm-planner-subbar{display:grid!important;gap:9px!important;padding:10px!important}.calm-planner-filter{display:grid!important;grid-template-columns:1fr!important;width:100%!important}.calm-planner-filter input,.calm-planner-filter select{width:100%!important}
  .calm-planner-table{display:block!important;width:100%!important;min-width:0!important;table-layout:auto!important;border:0!important;background:transparent!important}
  .calm-planner-table thead,.calm-planner-table tfoot{display:none!important}.calm-planner-table tbody{display:grid!important;gap:10px!important}
  .calm-planner-department-row{display:block!important}.calm-planner-department-row th{display:flex!important;align-items:center!important;gap:7px!important;width:100%!important;position:static!important;padding:9px 4px!important;border:0!important;background:transparent!important}.calm-planner-department-row th small{margin-left:auto!important;text-align:right}
  .calm-planner-employee-row,.calm-planner-open-row{display:block!important;width:100%!important;border:1px solid #dde6e8!important;border-radius:13px!important;overflow:hidden!important;background:#fff!important}
  .calm-planner-person{display:flex!important;position:static!important;width:100%!important;min-width:0!important;align-items:center!important;justify-content:space-between!important;padding:11px!important;border:0!important;border-bottom:1px solid #e6edef!important;background:#f8fafb!important}.calm-planner-person-main{min-width:0}.calm-planner-person-main strong,.calm-planner-person-main small{max-width:none!important}.calm-planner-person-main .avatar{display:grid!important}.calm-planner-load{margin-left:auto!important}
  .calm-planner-cell{display:grid!important;grid-template-columns:minmax(84px,28%) minmax(0,1fr) auto!important;gap:8px!important;align-items:start!important;width:100%!important;min-width:0!important;min-height:50px!important;padding:8px 9px!important;border:0!important;border-bottom:1px solid #edf2f3!important;background:#fff!important}.calm-planner-cell:last-child{border-bottom:0!important}.calm-planner-cell::before{content:attr(data-label);padding-top:4px;color:#718089;font-size:.61rem;font-weight:900;text-transform:capitalize}.calm-planner-cell.available{background:#fbfdfc!important}.calm-planner-cell.unavailable{background:#fffafa!important}.calm-planner-cell.leave{background:#fdfbf7!important}
  .calm-cell-stack{min-width:0!important}.calm-shift-card{width:100%!important;min-width:0!important}.calm-cell-add{position:static!important;align-self:center!important;justify-self:end!important}
  .calm-open-person{display:flex!important}.calm-planner-hints{gap:5px!important}.calm-planner-hints span{white-space:normal!important}

  /* Availability review: employee as card, seven days underneath */
  .availability-matrix-scroll{overflow:visible!important;width:100%!important;max-width:100%!important}.availability-matrix-table{display:block!important;width:100%!important;min-width:0!important;border:0!important}.availability-matrix-table thead{display:none!important}.availability-matrix-table tbody{display:grid!important;gap:10px!important}.availability-matrix-table tbody tr{display:block!important;width:100%!important;border:1px solid #dde6e8!important;border-radius:13px!important;overflow:hidden!important;background:#fff!important}.availability-matrix-table tbody th.availability-matrix-person{display:block!important;position:static!important;width:100%!important;min-width:0!important;padding:11px!important;border:0!important;border-bottom:1px solid #e6edef!important;background:#f8fafb!important}.availability-matrix-table tbody td{display:grid!important;grid-template-columns:minmax(82px,28%) minmax(0,1fr)!important;gap:8px!important;width:100%!important;min-width:0!important;padding:9px 10px!important;border:0!important;border-bottom:1px solid #edf2f3!important;background:#fff!important}.availability-matrix-table tbody td::before{content:attr(data-label);color:#718089;font-size:.61rem;font-weight:900;padding-top:2px}.availability-matrix-table .availability-cell-state,.availability-matrix-table .availability-cell-value,.availability-matrix-table td>small,.availability-matrix-table .availability-cell-conflict,.availability-matrix-table .availability-cell-actions{grid-column:2}.availability-matrix-table .availability-cell-actions{justify-content:flex-start!important}.availability-matrix-row-actions{display:flex!important;align-items:center!important;gap:8px!important}.availability-matrix-row-actions::before{flex:0 0 28%}.availability-matrix-row-actions .toolbar{flex:1!important}

  /* Availability input/review uses one day per row instead of swiping */
  .calm-availability-grid{display:grid!important;grid-template-columns:1fr!important;grid-auto-flow:row!important;grid-auto-columns:auto!important;width:100%!important;overflow:visible!important;border:0!important;gap:8px!important;background:transparent!important}.calm-availability-day{display:grid!important;grid-template-columns:1fr!important;flex:none!important;width:100%!important;min-height:0!important;padding:11px!important;border:1px solid #dfe6e8!important;border-radius:11px!important}.calm-availability-day:last-child{border-right:1px solid #dfe6e8!important}.calm-availability-day .availability-times{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .availability-review-days{display:grid!important;grid-template-columns:1fr!important;overflow:visible!important}.availability-review-day{flex:none!important;width:100%!important;min-width:0!important;min-height:0!important;border-right:0!important;border-bottom:1px solid var(--line)!important}.availability-review-day:last-child{border-bottom:0!important}

  /* Manager month: days wrap by week rather than scroll sideways */
  .availability-month-scroll{overflow:visible!important;max-height:none!important;border:0!important}.availability-month-days{display:none!important}.availability-month-row{display:block!important;width:100%!important;min-width:0!important;margin-bottom:10px;border:1px solid var(--line)!important;border-radius:12px!important;overflow:hidden!important}.availability-month-person{position:static!important;padding:10px 11px!important;border:0!important;border-bottom:1px solid var(--line)!important;background:#f8fafb!important}.availability-month-cells{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:5px!important;padding:8px!important}.availability-month-cell{height:32px!important;margin:0!important}.own-availability-month-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}

  /* Other horizontal components */
  .week-wrap{overflow:visible!important;max-width:100%!important}.team-week-grid{grid-template-columns:1fr!important}.date-nav{width:100%;max-width:100%;justify-content:space-between}.date-nav strong{min-width:0!important;white-space:normal!important}.list-item{flex-direction:column!important}.list-item>.toolbar{width:100%;justify-content:flex-start!important}.card-header{display:grid!important;grid-template-columns:1fr!important}.card-header>.toolbar,.card-header>.field,.card-header>.date-nav{width:100%!important}.support-company{grid-template-columns:1fr!important}.packages-grid{grid-template-columns:1fr!important}.packages-footer{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;gap:10px 16px!important}
  .modal{max-width:calc(100vw - 12px)!important}.modal-body{overflow-y:auto!important;overflow-x:hidden!important}.modal-actions{justify-content:stretch!important}.modal-actions .button{flex:1 1 auto!important}.form-grid{grid-template-columns:1fr!important}.weekday-picker{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .toast{left:10px!important;right:10px!important;bottom:calc(78px + env(safe-area-inset-bottom))!important;max-width:none!important;width:auto!important}
}

@media(max-width:430px){
  .kpi-grid{grid-template-columns:1fr!important}.calm-planner-cell{grid-template-columns:78px minmax(0,1fr) auto!important}.availability-matrix-table tbody td{grid-template-columns:76px minmax(0,1fr)!important}.availability-matrix-row-actions::before{flex-basis:76px}.own-availability-month-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.calm-availability-day .availability-times{grid-template-columns:1fr!important}.weekday-picker{grid-template-columns:repeat(3,minmax(0,1fr))!important}.not-found-card .toolbar{display:grid!important}.not-found-card .button{width:100%}
}

/* RC8.6 mobile availability action buttons: keep labels/buttons readable without horizontal overflow */
@media (max-width:780px){
  .availability-matrix-table tbody td.availability-matrix-row-actions{
    display:grid!important;
    grid-template-columns:minmax(76px,28%) minmax(0,1fr)!important;
    gap:7px 8px!important;
    width:100%!important;
    max-width:100%!important;
    align-items:start!important;
  }
  .availability-matrix-row-actions::before{
    grid-column:1!important;
    grid-row:1 / -1!important;
    align-self:start!important;
    flex:none!important;
    min-width:0!important;
  }
  .availability-matrix-row-actions .button{
    grid-column:2!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
}

/* ===== ShiftKlaar V5 RC8.6 — eigen rustige huisstijl, geinspireerd door moderne workforce-apps ===== */
:root{
  --sk-ink:#182631;
  --sk-ink-soft:#31424d;
  --sk-teal:#00ad9c;
  --sk-teal-dark:#008f82;
  --sk-mint:#89e2d6;
  --sk-bg:#f5f8f8;
  --sk-card:#ffffff;
  --sk-line:#dfe8e8;
  --sk-muted:#728089;
  --sk-soft:#edf5f4;
  --sk-shadow:0 8px 24px rgba(24,38,49,.07);
}
body{background:var(--sk-bg)}
.card{border-color:var(--sk-line);border-radius:14px;box-shadow:var(--sk-shadow)}
.card.pad{padding:18px}
.button{border-radius:9px;box-shadow:none!important}
.button.primary{background:var(--sk-teal);color:#fff;box-shadow:none!important}
.button.primary:hover{background:var(--sk-teal-dark)}
.button.soft{background:#e7f8f5;color:#007d71}
.button.ghost{border-color:var(--sk-line);background:#fff;color:var(--sk-ink)}
.field input,.field select,.field textarea{border-color:#d9e3e4;border-radius:9px;box-shadow:none}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--sk-teal);box-shadow:0 0 0 3px rgba(0,173,156,.1)}
.notice{border-radius:10px}
.badge{font-weight:800}
.sidebar{background:var(--sk-ink);box-shadow:10px 0 34px rgba(24,38,49,.08)}
.sidebar-logo{border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:10px}
.sidebar-logo img{width:42px;height:42px;object-fit:cover;border-radius:11px}
.nav button,.nav a{border-radius:8px;color:rgba(255,255,255,.67)}
.nav button:hover,.nav button.active,.nav a:hover,.nav a.active{background:rgba(0,173,156,.14);color:#fff}
.nav button.active .nav-icon,.nav a.active .nav-icon{color:#fff}.nav-icon{color:var(--sk-mint)}
.topbar{background:rgba(245,248,248,.96);border-bottom:1px solid #e3eaea;box-shadow:none}
.topbar h1{color:var(--sk-ink)}
.eyebrow{color:var(--sk-teal-dark)}
.content{max-width:1680px;width:100%;margin:0 auto}
.kpi{box-shadow:none;border-color:#e2e9ea}.kpi-icon{background:#e8f7f4;color:var(--sk-teal-dark)}
.table-wrap{border-color:#e1e9ea;border-radius:10px}.data-table th{background:#f7f9f9}.data-table tr:hover td{background:#fbfdfd}
.section-tabs{box-shadow:none;border-color:var(--sk-line);background:#fff}.section-tabs button.active{background:var(--sk-ink);color:#fff}

.mobile-brand{display:none;text-decoration:none}.mobile-brand img{display:block;max-width:none}
.mobile-nav-brand{display:grid;gap:3px}.mobile-nav-brand img{width:142px;max-height:38px;object-fit:contain;object-position:left center}.mobile-nav-brand small{color:var(--sk-muted);font-size:.66rem}

/* Personeelsrooster: eigen ShiftKlaar kalender + rustige dienstkaarten */
.sk-personnel-page{gap:12px}
.sk-roster-card{overflow:hidden;padding:0;box-shadow:var(--sk-shadow)}
.sk-view-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding:5px;margin:14px 14px 8px;border:1px solid var(--sk-line);border-radius:10px;background:#f3f7f7}
.sk-view-switch button{min-height:36px;border:0;border-radius:7px;background:transparent;color:var(--sk-muted);font-size:.72rem;font-weight:850}
.sk-view-switch button.active{background:#fff;color:var(--sk-teal-dark);box-shadow:0 2px 8px rgba(24,38,49,.07)}
.sk-roster-nav{display:grid;grid-template-columns:42px 1fr 42px;align-items:center;gap:8px;padding:12px 16px 8px;text-align:center}
.sk-roster-nav strong{font-size:.9rem;color:var(--sk-ink);font-weight:850;text-transform:capitalize}
.sk-nav-arrow{width:38px;height:38px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--sk-teal-dark);font-size:1.12rem;font-weight:900}
.sk-nav-arrow:hover{background:#e9f7f4;border-color:#d8eeea}
.sk-week-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;padding:4px 14px 14px}
.sk-week-day{position:relative;display:grid;place-items:center;align-content:center;min-width:0;min-height:58px;border:1px solid #dfe7e8;border-radius:10px;background:#fff;color:var(--sk-ink-soft)}
.sk-week-day small{font-size:.58rem;font-weight:800;text-transform:uppercase;color:#7c8990}.sk-week-day strong{margin-top:2px;font-size:.96rem}
.sk-week-day.planned{background:#e9f7f4;border-color:#bfe7df;color:#08796f}.sk-week-day.approved{background:#edf7ef;border-color:#cfe7d6;color:#347a54}.sk-week-day.rejected{background:#fbecee;border-color:#efc8ce;color:#a53d49}.sk-week-day.leave{background:#fff3df;border-color:#efd7ae;color:#9a6517}.sk-week-day.sick{background:#f1edf9;border-color:#ddd3ef;color:#665093}
.sk-week-day.planned small,.sk-week-day.approved small,.sk-week-day.rejected small,.sk-week-day.leave small,.sk-week-day.sick small{color:inherit;opacity:.8}
.sk-week-day.selected{border-color:var(--sk-teal);background:var(--sk-teal);color:#fff;box-shadow:0 5px 14px rgba(0,173,156,.2)}
.sk-week-day.selected.planned,.sk-week-day.selected.approved,.sk-week-day.selected.rejected,.sk-week-day.selected.leave,.sk-week-day.selected.sick{border-color:#24363e;box-shadow:inset 0 0 0 1px #24363e,0 4px 12px rgba(24,38,49,.12)}
.sk-week-day.selected.planned{background:#d8f0eb;color:#066d63}.sk-week-day.selected.approved{background:#dff0e4;color:#2f704d}.sk-week-day.selected.rejected{background:#f5dfe3;color:#963541}.sk-week-day.selected.leave{background:#fae8c8;color:#8f5c12}.sk-week-day.selected.sick{background:#e8e0f5;color:#5c4788}
.sk-week-day.selected small{color:inherit;opacity:.86}
.sk-calendar{padding:2px 14px 14px}
.sk-calendar-weekdays,.sk-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.sk-calendar-weekdays span{padding:7px 0;text-align:center;color:#7d8990;font-size:.58rem;font-weight:900;text-transform:uppercase}
.sk-calendar-grid{gap:4px}
.sk-month-day{position:relative;min-height:42px;border:0;border-radius:9px;background:transparent;color:var(--sk-ink-soft);font-weight:750}
.sk-month-day.outside{color:#c4cccf}.sk-month-day:hover{background:#f0f5f5}.sk-month-day.selected{background:var(--sk-teal);color:#fff}.sk-month-day.planned:not(.selected){background:#ecf8f5;color:#006d64}
.sk-month-day i{position:absolute;left:50%;bottom:4px;transform:translateX(-50%);width:14px;height:2px;border-radius:99px;background:var(--sk-teal)}.sk-month-day.selected i{background:#fff}
.sk-selected-day{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:15px 16px;border-top:1px solid var(--sk-line);background:#fafcfc}
.sk-selected-day.compact{padding-bottom:12px}.sk-selected-day h2{margin:2px 0 0;font-size:1.02rem;letter-spacing:-.02em;color:var(--sk-ink);text-transform:capitalize}.sk-selected-day .eyebrow{font-size:.56rem}
.sk-roster-day-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0}.sk-day-add-button{display:inline-grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border:1px solid #bfe3de;border-radius:10px;background:#eaf8f5;color:#06786e;font-size:1.3rem;line-height:1;font-weight:900;cursor:pointer}.sk-day-add-button:hover,.sk-day-add-button:focus-visible{background:#dff4ef;border-color:#8fd2c8;outline:0;box-shadow:0 0 0 3px rgba(0,173,156,.12)}
.sk-roster-summary{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.sk-roster-summary span,.sk-roster-status{display:inline-flex;align-items:center;min-height:26px;padding:4px 8px;border-radius:999px;background:#eaf6f4;color:#057b70;font-size:.6rem;font-weight:850;white-space:nowrap}
.sk-day-action-list{display:grid;gap:9px}.sk-day-action-choice{display:grid;grid-template-columns:40px minmax(0,1fr) 20px;gap:11px;align-items:center;width:100%;padding:12px;border:1px solid var(--sk-line);border-radius:10px;background:#fff;color:var(--sk-ink);text-align:left;cursor:pointer}.sk-day-action-choice:hover,.sk-day-action-choice:focus-visible{border-color:#a9dcd4;background:#f4fbf9;outline:0}.sk-day-action-choice>span{display:grid;place-items:center;width:40px;height:40px;border-radius:9px;background:#eaf8f5;color:#08796f;font-size:1rem;font-weight:900}.sk-day-action-choice strong,.sk-day-action-choice small{display:block}.sk-day-action-choice strong{font-size:.76rem}.sk-day-action-choice small{margin-top:3px;color:var(--sk-muted);font-size:.61rem;line-height:1.35}.sk-day-action-choice>b{color:#7f8e94;font-size:1.1rem;text-align:center}.is-disabled{opacity:.45}
.sk-day-shifts{display:grid;gap:8px;padding:12px 14px 16px}.sk-roster-card>.empty{margin:0 14px 14px;border:1px dashed #dce5e6;border-radius:10px;background:#fff}
.sk-roster-shift{position:relative;display:grid;grid-template-columns:4px minmax(88px,.62fr) minmax(0,1fr) auto;gap:11px;align-items:center;min-width:0;padding:11px 12px 11px 0;border:1px solid #e1e8e9;border-radius:10px;background:#fff;overflow:hidden}
.sk-roster-accent{align-self:stretch;width:4px;border-radius:0 4px 4px 0;background:var(--sk-teal)}
.sk-roster-time strong,.sk-roster-time small,.sk-roster-meta strong,.sk-roster-meta span{display:block}.sk-roster-time strong{font-size:.76rem;color:var(--sk-ink)}.sk-roster-time small,.sk-roster-meta span{margin-top:2px;color:var(--sk-muted);font-size:.61rem}.sk-roster-meta{min-width:0}.sk-roster-meta strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sk-ink-soft);font-size:.72rem}
.sk-inline-stats{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap}.sk-inline-stats span{padding:7px 10px;border:1px solid var(--sk-line);border-radius:999px;background:#fff;color:var(--sk-muted);font-size:.62rem}.sk-inline-stats strong{color:var(--sk-ink)}
.sk-team-groups{display:grid;gap:10px;padding:0 14px 16px}.sk-team-group{border:1px solid #e1e8e9;border-radius:11px;background:#fff;overflow:hidden}.sk-team-group>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 12px;background:var(--sk-ink);color:#fff}.sk-team-group>header strong,.sk-team-group>header small{display:block}.sk-team-group>header strong{font-size:.73rem}.sk-team-group>header small{margin-top:2px;color:rgba(255,255,255,.58);font-size:.54rem}.sk-team-group>header>span{font-size:.58rem;color:var(--sk-mint);font-weight:800}
.sk-team-row{display:grid;grid-template-columns:94px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 12px;border-top:1px solid #edf1f2}.sk-team-row:first-child{border-top:0}.sk-team-row.mine{background:#f0fbf8}.sk-team-time{font-size:.66rem;font-weight:800;color:var(--sk-ink-soft)}.sk-team-row strong,.sk-team-row small{display:block}.sk-team-row strong{font-size:.7rem;color:var(--sk-ink)}.sk-team-row small{margin-top:2px;color:var(--sk-muted);font-size:.56rem}.sk-me-badge{padding:3px 7px;border-radius:999px;background:var(--sk-teal);color:#fff;font-size:.52rem;font-weight:900}

/* Manager planning/aanvragen: rustiger, meer lucht, ShiftKlaar-accenten */
.calm-planner-overview{border-color:var(--sk-line);box-shadow:none;background:#fff}
.calm-planner-shell{border-color:var(--sk-line);border-radius:12px;box-shadow:none}.calm-planner-subbar{background:#f8fbfb;border-color:#e5ecec}.calm-planner-filter input,.calm-planner-filter select{border-color:#dfe7e8}.calm-planner-table thead th{background:#f8fafa}.calm-planner-day-head.today{background:#e9f7f4}.calm-planner-day-head.today strong{color:#00786d}.calm-planner-department-row th{background:#f0f5f4}.calm-dept-dot{background:var(--sk-teal)}.calm-planner-person-main .avatar{background:#e8f7f4;color:#06786e}.calm-planner-cell.available{background:#fbfefd}.calm-planner-cell.drag-over{background:#e7f7f3!important;box-shadow:inset 0 0 0 2px var(--sk-teal)}.calm-cell-state.available{background:#e6f6f1;color:#087466}.calm-cell-add:focus,.calm-planner-cell:hover .calm-cell-add{background:#e8f5f3;color:#08776c}
.calm-availability-review,.availability-matrix-week{border-color:var(--sk-line);box-shadow:none}.availability-matrix-week>header{background:#f7faf9}.availability-matrix-person-main .avatar{background:#eaf6f4;color:#147669}.availability-cell-state.available{background:#e6f6f1;color:#087466}

@media(max-width:780px){
  body:not(.auth-page):not(.offline-page){padding-bottom:calc(70px + env(safe-area-inset-bottom))!important}
  .topbar{display:grid!important;grid-template-columns:112px minmax(0,1fr) 38px!important;grid-template-areas:"brand title account" "actions actions actions"!important;min-height:62px!important;padding:calc(8px + env(safe-area-inset-top)) 12px 8px!important;background:#fff!important;border-bottom:1px solid var(--sk-line)!important;box-shadow:0 4px 14px rgba(24,38,49,.04)!important}
  .mobile-brand{grid-area:brand;display:flex;align-items:center;min-width:0}.mobile-brand img{width:108px;height:32px;object-fit:contain;object-position:left center}
  .topbar-title{grid-area:title;min-width:0!important;text-align:center}.topbar-title .eyebrow{display:none}.topbar-title h1{margin:0!important;font-size:1rem!important;letter-spacing:-.02em!important;color:var(--sk-ink)!important}
  .topbar-right{grid-area:account;margin:0!important;justify-self:end}.mobile-account{width:34px!important;height:34px!important;border-radius:10px!important;background:#eef7f5!important;color:#08796f!important;border:1px solid #dceae7!important;font-size:.62rem!important;box-shadow:none!important}
  .top-actions{grid-area:actions;order:initial!important;padding-top:3px!important}.top-actions .button{min-height:34px!important}
  .content{padding:10px 10px 18px!important;background:var(--sk-bg)!important}
  .mobile-bottom-nav{left:0!important;right:0!important;bottom:0!important;min-height:62px!important;padding:5px 5px max(5px,env(safe-area-inset-bottom))!important;background:rgba(255,255,255,.98)!important;border-top:1px solid #e0e8e9!important;box-shadow:0 -7px 22px rgba(24,38,49,.08)!important;backdrop-filter:blur(15px)!important}
  .mobile-bottom-nav button{min-height:50px!important;border-radius:9px!important;color:#93a0a6!important;font-size:.52rem!important;font-weight:800!important}
  .mobile-bottom-nav button.active,.mobile-bottom-nav button[aria-expanded="true"]{background:#eaf8f5!important;color:#08796f!important}.mobile-nav-icon{color:currentColor!important;font-size:1rem!important}.mobile-nav-count{background:var(--danger)!important;top:1px!important;right:6px!important}
  .mobile-nav-sheet:not([hidden]){display:block!important}.mobile-nav-backdrop{background:rgba(11,24,33,.48)!important;backdrop-filter:blur(2px)!important}
  .mobile-nav-panel{inset:0 0 0 auto!important;width:min(88vw,360px)!important;max-height:none!important;border:0!important;border-left:1px solid var(--sk-line)!important;border-radius:20px 0 0 20px!important;padding:0!important;background:#fff!important;box-shadow:-20px 0 60px rgba(15,29,42,.2)!important;overflow:auto!important}
  .mobile-nav-panel-head{top:0!important;padding:calc(18px + env(safe-area-inset-top)) 16px 14px!important;border-bottom:1px solid var(--sk-line)!important;background:#fff!important}.mobile-nav-brand img{width:150px!important;height:38px!important}.mobile-nav-brand small{margin-top:4px!important}
  .mobile-nav-panel-list{padding:8px 10px 18px!important}.mobile-nav-group{padding:14px 10px 5px!important;color:#9aa5aa!important}.mobile-nav-panel-list button{min-height:46px!important;border-radius:9px!important;padding:8px 10px!important;color:var(--sk-ink)!important}.mobile-nav-panel-list button:hover,.mobile-nav-panel-list button.active{background:#eaf8f5!important;color:#08796f!important}.mobile-nav-panel-list .nav-icon{color:#5d717a!important}
  .mobile-user-menu{right:10px!important;top:calc(56px + env(safe-area-inset-top))!important;border-color:var(--sk-line)!important;border-radius:12px!important;box-shadow:var(--sk-shadow)!important}
  .card{border-radius:12px!important;box-shadow:0 5px 16px rgba(24,38,49,.05)!important}.card.pad{padding:14px!important}.page{gap:10px!important}.kpi-grid{gap:8px!important}.kpi{min-height:95px!important;padding:12px!important}.kpi-icon{width:32px!important;height:32px!important;border-radius:9px!important}.kpi-value{font-size:1.28rem!important}.kpi-note{font-size:.61rem!important}
  .button{min-height:38px}.field label{font-size:.7rem}.notice{font-size:.74rem}
  [data-portal="Personeelsportaal"] .kpi-grid{display:none!important}
  [data-portal="Personeelsportaal"] .grid-2{display:grid!important;grid-template-columns:1fr!important}
  [data-portal="Personeelsportaal"] .sk-inline-stats{padding-bottom:2px}
  .sk-roster-card{border-radius:13px!important}.sk-view-switch{margin:10px 10px 5px}.sk-roster-nav{padding:8px 10px 5px}.sk-week-strip{gap:5px;padding:3px 10px 10px}.sk-week-day{min-height:54px;border-radius:9px}.sk-calendar{padding:0 10px 10px}.sk-month-day{min-height:39px}.sk-selected-day{padding:12px 11px}.sk-selected-day h2{font-size:.93rem}.sk-roster-day-actions{gap:6px}.sk-day-add-button{width:36px;height:36px;flex-basis:36px;border-radius:9px}.sk-roster-summary{gap:4px}.sk-day-action-choice{padding:11px;grid-template-columns:38px minmax(0,1fr) 18px}.sk-day-action-choice>span{width:38px;height:38px}.sk-day-shifts{padding:9px 10px 12px}.sk-roster-shift{grid-template-columns:4px 84px minmax(0,1fr);gap:8px;padding-right:9px}.sk-roster-status{grid-column:2/-1;justify-self:start}.sk-roster-time strong{font-size:.69rem}.sk-roster-meta strong{font-size:.68rem}.sk-inline-stats span{padding:6px 9px}.sk-team-groups{padding:0 10px 12px}.sk-team-group>header{background:var(--sk-ink);padding:8px 10px}.sk-team-row{grid-template-columns:82px minmax(0,1fr) auto;padding:9px 10px}.sk-team-time{font-size:.61rem}
  .calm-planner-employee-row,.calm-planner-open-row,.availability-matrix-table tbody tr{box-shadow:0 4px 14px rgba(24,38,49,.04)!important;border-color:#e0e8e9!important}.calm-planner-person,.availability-matrix-table tbody th.availability-matrix-person{background:#f8fbfa!important}.calm-planner-cell::before,.availability-matrix-table tbody td::before{color:#8a969c!important}.calm-planner-cell,.availability-matrix-table tbody td{border-color:#edf1f2!important}
}
@media(max-width:390px){.topbar{grid-template-columns:98px minmax(0,1fr) 34px!important}.mobile-brand img{width:94px}.sk-week-day{min-height:50px}.sk-week-day strong{font-size:.88rem}.sk-roster-shift{grid-template-columns:4px 78px minmax(0,1fr)}.sk-team-row{grid-template-columns:76px minmax(0,1fr) auto}}
@media(max-width:780px){.mobile-toggle{display:none!important}}

/* RC8.7 - absence, day close and geofence */
.absence-overview{display:grid;gap:10px}.absence-row{display:grid;grid-template-columns:minmax(170px,1.2fr) minmax(110px,.7fr) minmax(145px,.9fr) minmax(120px,.8fr) minmax(110px,.7fr) auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.absence-row:last-child{border-bottom:0}.absence-row small{display:block;color:var(--muted);margin-top:3px}.day-close-page{display:grid;gap:16px}.day-close-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.day-close-summary span{padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff}.day-close-summary small{display:block;color:var(--muted);font-size:.72rem}.day-close-summary strong{display:block;margin-top:4px;color:var(--ink)}.day-close-hours{display:grid}.day-close-hour-row{display:grid;grid-template-columns:minmax(220px,1fr) 90px 130px;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}.day-close-hour-row small{display:block;color:var(--muted);margin-top:3px}.day-close-final-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.day-close-date{border:1px solid var(--line);border-radius:10px;padding:9px 11px;background:#fff;color:var(--ink)}.geofence-coordinates{align-items:end}.print-grid-shift span{font-weight:800!important;color:var(--ink)!important;font-size:.54rem!important}.print-shift span{font-weight:800;color:var(--ink)}
@media(max-width:780px){.absence-row{grid-template-columns:1fr;gap:7px;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff}.day-close-summary{grid-template-columns:1fr 1fr}.day-close-hour-row{grid-template-columns:1fr auto;gap:8px}.day-close-hour-row>div:last-child{grid-column:1/-1}.day-close-final-actions{flex-direction:column}.day-close-final-actions .button{width:100%}}

.absence-table-head{display:grid;grid-template-columns:minmax(170px,1.2fr) minmax(110px,.7fr) minmax(145px,.9fr) minmax(120px,.8fr) minmax(110px,.7fr) auto;gap:14px;padding:0 0 9px;border-bottom:1px solid var(--line);color:var(--muted);font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}@media(max-width:780px){.absence-table-head{display:none}}

/* ========================================================================== */
/* ShiftKlaar V5 RC8.9 - compact workflow, crisp login, employee 360          */
/* ========================================================================== */
.auth-brand-lockup{display:inline-flex;align-items:center;gap:18px;width:max-content;text-decoration:none;color:#fff}
.sk-brand-mark{position:relative;display:inline-block;width:94px;height:74px;flex:0 0 94px}
.sk-brand-mark i,.sk-brand-mark b{position:absolute;display:block;width:58px;height:58px;border-radius:13px}
.sk-brand-mark i{left:0;top:0;background:linear-gradient(145deg,#17c7b3,#00a995);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.sk-brand-mark b{right:0;bottom:0;background:linear-gradient(145deg,#263846,#0f1d2a);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1),0 9px 22px rgba(0,0,0,.18)}
.sk-brand-word{font-size:clamp(2rem,3.4vw,4.1rem);line-height:1;letter-spacing:-.055em;white-space:nowrap}
.sk-brand-word strong{font-weight:750;color:#f5fbfb}.sk-brand-word em{font-style:normal;font-weight:750;color:#14c5b1}
.auth-card-mark{width:52px;height:42px;display:block;margin-bottom:18px;flex-basis:52px}.auth-card-mark i,.auth-card-mark b{width:34px;height:34px;border-radius:8px}.auth-brand{background:radial-gradient(circle at 18% 18%,rgba(20,197,177,.18),transparent 38%),linear-gradient(155deg,#17343d,#244955 72%)}
.auth-message.info{background:#e8f7f5;color:#185d57;border:1px solid #cceae6}
.portal-boot{min-height:100dvh;display:grid;place-content:center;justify-items:center;gap:9px;background:var(--bg);color:var(--ink);text-align:center;padding:28px}
.portal-boot-mark{position:relative;width:58px;height:46px;margin-bottom:5px}.portal-boot-mark i,.portal-boot-mark b{position:absolute;width:36px;height:36px;border-radius:9px}.portal-boot-mark i{left:0;top:0;background:var(--teal)}.portal-boot-mark b{right:0;bottom:0;background:var(--ink)}
.portal-boot small{color:var(--muted)}.portal-boot-spinner{width:22px;height:22px;margin-top:8px;border:2px solid #d4e1e2;border-top-color:var(--teal);border-radius:999px;animation:skSpin .7s linear infinite}@keyframes skSpin{to{transform:rotate(360deg)}}

.page{gap:14px}.card.pad{padding:18px}.card-header{margin-bottom:14px}.content{padding-top:16px}
.top-actions{flex-wrap:wrap;justify-content:flex-end;min-width:0}.top-actions>*{max-width:100%}
.day-column-grid{grid-template-columns:repeat(7,minmax(0,1fr))!important;min-width:0!important;overflow:visible!important}
.day-column{min-width:0!important}.day-shift{min-width:0}.day-shift>span:nth-child(2){min-width:0}.day-shift strong,.day-shift small{overflow-wrap:anywhere}

.employee-overview-select{min-width:220px;max-width:320px;border:1px solid var(--line);border-radius:11px;padding:10px 12px;background:#fff;color:var(--ink);font-weight:750}
.employee-360-page{gap:14px}.employee-360-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 20px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 10px 28px rgba(15,29,42,.05)}
.employee-360-person{display:flex;align-items:center;gap:14px}.employee-360-person h2{margin:2px 0 3px;color:var(--ink);font-size:1.35rem}.employee-360-person p:last-child{margin:0;color:var(--muted);font-size:.8rem}.employee-360-contact{display:flex;align-items:center;justify-content:flex-end;gap:9px;flex-wrap:wrap;color:var(--muted);font-size:.77rem}
.employee-360-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.employee-360-kpis>div{padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:#fff}.employee-360-kpis span,.employee-360-kpis small{display:block}.employee-360-kpis span{color:var(--muted);font-size:.7rem;font-weight:800}.employee-360-kpis strong{display:block;margin:4px 0;color:var(--ink);font-size:1.45rem}.employee-360-kpis small{color:var(--muted);font-size:.67rem}.employee-360-kpis .positive strong{color:var(--success)}.employee-360-kpis .negative strong{color:var(--danger)}
.employee-360-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.employee-360-wide{grid-column:1/-1}.compact-timeline{display:grid;gap:0}.compact-timeline>div{display:grid;grid-template-columns:95px 110px minmax(0,1fr);gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}.compact-timeline>div:last-child{border-bottom:0}.compact-timeline span,.compact-timeline small{font-size:.72rem;color:var(--muted)}.compact-timeline strong{font-size:.77rem;color:var(--ink)}
.employee-360-events{display:grid;gap:7px}.employee-360-event{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:#fbfdfd}.employee-360-event small{display:block;color:var(--muted);margin-top:2px;font-size:.68rem}.employee-360-mini-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.employee-360-mini-stats span{padding:11px;border:1px solid var(--line);border-radius:11px;color:var(--muted);font-size:.72rem}.employee-360-mini-stats strong{display:block;color:var(--ink);font-size:1.1rem;margin-bottom:2px}

.day-close-page{gap:13px}.day-close-summary{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.day-close-summary span{padding:11px 13px;border-radius:12px}.day-close-summary .warn{border-color:#f1d29e;background:var(--warn-soft)}
.day-close-date-nav{display:flex;align-items:end;gap:7px;flex-wrap:wrap}.day-close-date-nav label{display:grid;gap:3px}.day-close-date-nav label span{font-size:.62rem;font-weight:800;color:var(--muted);text-transform:uppercase}.day-close-date-nav .day-close-date{min-width:145px}
.day-close-upper-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.compact-form{gap:9px}.day-close-report-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.day-close-report-grid textarea{min-height:58px!important;resize:vertical}.day-close-hours-card{min-width:0}.day-close-hour-row{grid-template-columns:minmax(190px,1fr) 72px minmax(250px,auto);gap:10px;padding:9px 0}.day-close-hour-row .toolbar{justify-content:flex-end}.day-close-final-actions{margin-top:0}
.day-close-task-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.day-close-task-grid section{display:grid;gap:6px;padding:11px 12px;border:1px solid var(--line);border-radius:11px;background:#fbfdfd}.day-close-task-grid header{display:flex;align-items:center;justify-content:space-between;gap:8px}.day-close-task-grid section>span{font-size:.72rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.print-day-grid{grid-template-columns:repeat(7,minmax(0,1fr));min-width:0;overflow:visible}.print-day-grid>article{min-width:0}.schedule-print-page{min-width:0}

@media(max-width:1100px){.day-column-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.employee-360-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.day-close-summary{grid-template-columns:repeat(3,minmax(0,1fr))}.day-close-task-grid{grid-template-columns:1fr 1fr}}
@media(max-width:780px){
  .auth-brand{padding:calc(20px + env(safe-area-inset-top)) 20px 15px!important}.auth-brand-lockup{gap:11px}.sk-brand-mark{width:62px;height:49px;flex-basis:62px}.sk-brand-mark i,.sk-brand-mark b{width:39px;height:39px;border-radius:9px}.sk-brand-word{font-size:2.15rem}.auth-card-mark{width:44px;height:35px;flex-basis:44px}.auth-card-mark i,.auth-card-mark b{width:28px;height:28px;border-radius:7px}
  .content{padding:11px 11px 30px}.page{gap:10px}.card.pad{padding:13px;border-radius:14px}.card-header{margin-bottom:10px;gap:9px}.card-header h2{font-size:1rem}.card-header p{font-size:.72rem}
  .top-actions{max-width:none!important;overflow:visible!important;width:100%;justify-content:flex-start}.top-actions .button,.top-actions select,.top-actions input{white-space:normal;min-width:0}
  .day-column-grid{grid-template-columns:1fr!important}.day-column{min-height:0!important}.day-column>header{position:static}.day-shift{min-height:44px}
  .employee-360-hero{display:grid;padding:14px}.employee-360-contact{justify-content:flex-start}.employee-360-kpis{grid-template-columns:1fr 1fr;gap:7px}.employee-360-kpis>div{padding:10px}.employee-360-kpis strong{font-size:1.15rem}.employee-360-grid{grid-template-columns:1fr;gap:10px}.employee-360-wide{grid-column:auto}.compact-timeline>div{grid-template-columns:75px 90px minmax(0,1fr);gap:7px}.employee-360-mini-stats{grid-template-columns:1fr 1fr}.employee-overview-select{min-width:0;width:100%;max-width:none}
  .day-close-summary{grid-template-columns:1fr 1fr}.day-close-summary span{padding:9px 10px}.day-close-upper-grid{grid-template-columns:1fr}.day-close-report-grid{grid-template-columns:1fr 1fr}.day-close-hour-row{grid-template-columns:minmax(0,1fr) auto;gap:7px}.day-close-hour-row>div:last-child{grid-column:1/-1}.day-close-hour-row .toolbar{justify-content:flex-start}.day-close-task-grid{grid-template-columns:1fr}.day-close-date-nav{width:100%;display:grid;grid-template-columns:auto minmax(0,1fr) auto}.day-close-date-nav label{grid-column:2}.day-close-date-nav #dayClosePrevious{grid-column:1;grid-row:1}.day-close-date-nav #dayCloseNext{grid-column:3;grid-row:1}.day-close-date-nav #dayCloseCalendar,.day-close-date-nav #dayCloseToday{display:none}.day-close-date-nav .day-close-date{width:100%;min-width:0}
  .print-day-grid{display:grid!important;grid-template-columns:1fr!important;overflow:visible!important}.print-day-grid>article{width:100%!important;flex:none!important}
}
@media(max-width:480px){.employee-360-kpis{grid-template-columns:1fr}.employee-360-mini-stats{grid-template-columns:1fr}.day-close-report-grid{grid-template-columns:1fr}.day-close-summary{grid-template-columns:1fr 1fr}}

/* RC8.8 login brand: exact ShiftKlaar mark + crisp live text, no raster halo */
.sk-brand-mark img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;filter:none!important}
.sk-brand-mark:has(img) i,.sk-brand-mark:has(img) b{display:none!important}

/* ShiftKlaar V5 RC8.9 - responsiveness + day-close hour review hardening */
.view-loading-state{min-height:220px;display:grid;place-items:start center;padding-top:28px}
.view-loading-card{width:min(520px,100%);display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 8px 24px rgba(15,29,42,.05)}
.view-loading-card strong,.view-loading-card small{display:block}.view-loading-card small{margin-top:3px;color:var(--muted)}
.button.danger-outline{background:#fff;border-color:#efb8b8;color:#a52e2e}.button.danger-outline:hover{background:#fff2f2;border-color:#dc8d8d}
.day-close-review-list{display:grid;min-width:0}
.day-close-review-head,.day-close-review-row{display:grid;grid-template-columns:minmax(180px,1.4fr) minmax(58px,.45fr) minmax(58px,.45fr) minmax(72px,.52fr) minmax(72px,.52fr) minmax(110px,.75fr) minmax(250px,1.3fr);gap:10px;align-items:center;min-width:0}
.day-close-review-head{padding:0 0 8px;border-bottom:1px solid var(--line);font-size:.67rem;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.day-close-review-row{padding:11px 0;border-bottom:1px solid var(--line)}
.day-close-review-row:last-child{border-bottom:0}
.day-close-review-person,.day-close-review-cell,.day-close-review-status,.day-close-review-actions{min-width:0}
.day-close-review-person strong,.day-close-review-person small,.day-close-review-cell small,.day-close-review-cell strong{display:block}
.day-close-review-person small,.day-close-review-cell small{color:var(--muted);margin-top:3px;font-size:.72rem}
.day-close-review-cell strong{margin-top:2px;font-variant-numeric:tabular-nums}
.day-close-review-status{display:grid;gap:4px;justify-items:start}.day-close-review-status .danger-text{color:#a52e2e;line-height:1.25}
.day-close-review-actions{display:flex;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.day-close-review-actions .button{white-space:nowrap}
.day-close-hours-card{overflow:hidden}

/* Avoid expensive off-screen painting on long manager lists without changing layout. */
.report-row,.list-item,.employee-row,.day-close-review-row{contain:layout paint style}

@media(max-width:980px){
  .day-close-review-head{display:none}
  .day-close-review-list{gap:10px}
  .day-close-review-row{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:12px;border:1px solid var(--line);border-radius:12px;background:#fff}
  .day-close-review-person{grid-column:1/-1;padding-bottom:5px;border-bottom:1px solid var(--line)}
  .day-close-review-status{grid-column:1/3}.day-close-review-actions{grid-column:3/-1;justify-content:flex-end}
}
@media(max-width:620px){
  .view-loading-state{padding-top:14px}.view-loading-card{padding:13px 14px;border-radius:12px}
  .day-close-review-row{grid-template-columns:1fr 1fr}
  .day-close-review-person{grid-column:1/-1}
  .day-close-review-status,.day-close-review-actions{grid-column:1/-1}
  .day-close-review-actions{justify-content:stretch;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .day-close-review-actions .button{width:100%;padding-inline:8px}
  .day-close-hours-card .card-header{align-items:flex-start}.day-close-hours-card .card-header>.button{width:100%}
}

/* ShiftKlaar V5 RC9.0 - afdelingsweekrooster, support en periodebesturing */
.department-week-shell{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;min-width:0}
.department-week-grid{display:grid;min-width:0;background:#fff}
.department-week-row{display:grid;grid-template-columns:minmax(140px,1.25fr) repeat(7,minmax(0,1fr));min-width:0;border-bottom:1px solid var(--line)}
.department-week-row:last-child{border-bottom:0}.department-week-row>*{min-width:0;border-right:1px solid var(--line)}.department-week-row>*:last-child{border-right:0}
.department-week-head{position:sticky;top:0;z-index:4;background:#f7f9fa}.department-week-head .department-week-label,.department-week-head .department-week-day{padding:10px 9px}
.department-week-label{display:flex;align-items:flex-start;gap:9px;padding:12px;background:#fafcfc}.department-week-label>div{min-width:0}.department-week-label strong,.department-week-label small{display:block}.department-week-label strong{font-size:.76rem;color:var(--ink)}.department-week-label small{margin-top:3px;color:var(--muted);font-size:.6rem;line-height:1.3}.department-week-dot{width:8px;height:34px;flex:0 0 8px;border-radius:7px;background:var(--dept,var(--teal))}
.department-week-day{text-align:center}.department-week-day span,.department-week-day strong,.department-week-day small{display:block}.department-week-day span{font-size:.58rem;text-transform:uppercase;color:var(--muted);font-weight:800}.department-week-day strong{margin-top:2px;font-size:.76rem;color:var(--ink)}.department-week-day small{margin-top:3px;font-size:.5rem;color:#8a969c}.department-week-day.today{background:#edf7f4}.department-week-day.today strong{color:var(--teal-dark)}
.department-week-cell{position:relative;min-height:92px;padding:7px 7px 30px;background:#fff}.department-week-cell.has-shifts{background:#fcfefe}.department-week-cell-stack{display:grid;gap:5px}.department-week-empty{display:grid;place-items:center;height:38px;color:#c1c9cc}
.department-week-shift{position:relative;width:100%;min-width:0;text-align:left;border:1px solid #dbe5e7;border-left:3px solid var(--teal);border-radius:8px;background:#fff;padding:6px 7px;box-shadow:none;color:var(--ink);cursor:pointer}.department-week-shift:hover{border-color:#a8ceca;background:#f7fbfa}.department-week-shift.draft{border-left-color:#d5a04f;background:#fffaf2}.department-week-shift.open{border-left-color:#8f9aa0;background:#f7f9fa}.department-week-shift strong,.department-week-shift span,.department-week-shift small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.department-week-shift strong{font-size:.65rem;font-variant-numeric:tabular-nums}.department-week-shift span{margin-top:2px;font-size:.65rem;font-weight:800}.department-week-shift small{margin-top:2px;color:var(--muted);font-size:.54rem}.department-week-shift b{position:absolute;right:4px;top:4px;display:grid;place-items:center;min-width:17px;height:17px;padding:0 4px;border-radius:10px;background:var(--warn);color:#fff;font-size:.5rem}
.department-week-add{position:absolute;right:6px;bottom:6px;width:23px;height:23px;border:1px dashed #b9c7ca;border-radius:7px;background:#fff;color:var(--muted);font-weight:800}.department-week-add:hover{border-style:solid;border-color:var(--teal);color:var(--teal-dark);background:#f1fbf8}
.employee-name-link{display:grid;gap:2px;padding:0;border:0;background:transparent;text-align:left;color:inherit;cursor:pointer}.employee-name-link strong{color:var(--ink);text-decoration:none}.employee-name-link span{font-size:.58rem;color:var(--teal-dark);font-weight:750}.employee-name-link:hover strong{text-decoration:underline;text-decoration-color:#8ec9c1;text-underline-offset:2px}.employee-account-cell>small{display:block;margin-top:3px;color:var(--muted);font-size:.6rem}
.hours-period-nav{display:grid;grid-template-columns:auto 130px minmax(150px,auto) minmax(180px,1fr) auto auto;gap:8px;align-items:end}.hours-period-nav>strong{align-self:center;color:var(--ink);font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hours-anchor-field{display:grid;gap:3px}.hours-anchor-field>span{font-size:.6rem;font-weight:800;text-transform:uppercase;color:var(--muted)}.hours-anchor-field input{height:38px}.period-controls.is-collapsed{display:none}
.support-ticket-list{display:grid;gap:9px}.support-ticket-card{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:start;padding:14px 15px;border:1px solid var(--line);border-radius:12px;background:#fff;text-align:left;color:inherit}.support-ticket-card:hover{border-color:#a6ccc7;background:#fbfefd}.support-ticket-card.needs-action,.support-ticket-card.has-reply{border-left:4px solid var(--teal)}.support-ticket-card>div:first-child{min-width:0}.support-ticket-card>div:last-child{display:flex;gap:5px;justify-content:flex-end;flex-wrap:wrap}.support-ticket-card strong,.support-ticket-card p,.support-ticket-card small,.support-ticket-category{display:block}.support-ticket-card strong{margin:3px 0 5px;color:var(--ink);font-size:.83rem}.support-ticket-card p{margin:0;color:var(--muted);font-size:.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.support-ticket-card small{margin-top:6px;color:#8a969c;font-size:.6rem}.support-ticket-category{font-size:.58rem;text-transform:uppercase;letter-spacing:.04em;color:var(--teal-dark);font-weight:800}
.support-ticket-detail-head{display:grid;gap:9px;padding:0 0 12px;border-bottom:1px solid var(--line)}.support-ticket-detail-head>div{display:flex;gap:6px;flex-wrap:wrap}.support-ticket-detail-head p{margin:0;color:var(--ink);white-space:pre-wrap;line-height:1.45}.support-thread{display:grid;gap:8px;max-height:360px;overflow:auto;padding:12px 1px}.support-thread-message{max-width:86%;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#f6f9fa}.support-thread-message.manager{justify-self:end;background:#ecf8f5;border-color:#cde8e2}.support-thread-message.support{justify-self:start}.support-thread-message>div{display:flex;align-items:center;justify-content:space-between;gap:12px}.support-thread-message strong{font-size:.68rem}.support-thread-message small{font-size:.56rem;color:var(--muted)}.support-thread-message p{margin:5px 0 0;white-space:pre-wrap;font-size:.72rem;line-height:1.4}.support-reply-field{margin-top:8px}
.print-week-grid{margin-top:14px;border:1px solid #d8e1e3;border-radius:8px;overflow:hidden}.print-week-head,.print-week-row{display:grid;grid-template-columns:120px repeat(7,minmax(0,1fr));min-width:0}.print-week-head{background:#eef3f4;font-size:.61rem;font-weight:800;text-transform:uppercase}.print-week-head>div,.print-week-day{padding:7px 5px;border-right:1px solid #d8e1e3}.print-week-head>div:last-child,.print-week-day:last-child{border-right:0}.print-week-day{text-align:center}.print-week-day strong,.print-week-day span{display:block}.print-week-day span{margin-top:2px;color:#69777e;font-size:.54rem;font-weight:650;text-transform:none}.print-week-row{border-top:1px solid #d8e1e3;break-inside:avoid}.print-week-department,.print-week-cell{min-width:0;padding:7px 5px;border-right:1px solid #e2e8ea}.print-week-cell:last-child{border-right:0}.print-week-department{display:flex;align-items:flex-start;gap:6px;background:#fafcfc}.print-week-department>span{width:5px;height:28px;border-radius:5px;background:var(--dept,var(--teal));flex:0 0 5px}.print-week-department strong{font-size:.62rem}.print-week-cell{display:grid;align-content:start;gap:4px}.print-week-shift{padding:4px 5px;border-left:2px solid var(--teal);border-radius:4px;background:#f7fbfa}.print-week-shift strong,.print-week-shift span,.print-week-shift small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.print-week-shift strong{font-size:.56rem}.print-week-shift span{font-size:.55rem;font-weight:750}.print-week-shift small{font-size:.49rem;color:var(--muted)}.print-week-shift p{margin:3px 0 0;font-size:.48rem}.print-week-empty{color:#aeb8bc;text-align:center}
@media(max-width:900px){.hours-period-nav{grid-template-columns:auto minmax(0,1fr) auto}.hours-period-nav #hoursPeriodMode{grid-column:2}.hours-period-nav .hours-anchor-field{grid-column:1/-1;grid-row:2}.hours-period-nav>strong{grid-column:1/-1;grid-row:3}.hours-period-nav #hoursPeriodToday{grid-column:1/-1}.support-ticket-card{grid-template-columns:1fr}.support-ticket-card>div:last-child{justify-content:flex-start}}
@media(max-width:780px){.department-week-grid{display:grid;gap:9px;padding:9px;background:#f6f9fa}.department-week-head{display:none}.department-week-row:not(.department-week-head){display:grid;grid-template-columns:1fr;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}.department-week-row>*{border-right:0}.department-week-label{border-bottom:1px solid var(--line)}.department-week-cell{display:grid;grid-template-columns:86px minmax(0,1fr) auto;gap:8px;align-items:start;min-height:54px;padding:8px;border-bottom:1px solid var(--line)}.department-week-cell:last-child{border-bottom:0}.department-week-cell::before{content:attr(data-label);font-size:.62rem;font-weight:800;color:var(--muted);text-transform:capitalize}.department-week-cell-stack{min-width:0}.department-week-add{position:static;align-self:center}.calm-planner-subbar{display:grid}.calm-planner-filter{display:grid;grid-template-columns:1fr}.calm-planner-filter input{width:100%}.support-thread-message{max-width:94%}.schedule-print-sheet{overflow:visible}.print-week-grid{font-size:.85em}}
@media print{
  body[data-printing="schedule"] .schedule-print-sheet{width:100%!important;max-width:none!important}
  body[data-printing="schedule"] .print-week-grid{display:block!important;overflow:visible!important;border-radius:0!important}
  body[data-printing="schedule"] .print-week-head,body[data-printing="schedule"] .print-week-row{grid-template-columns:26mm repeat(7,minmax(0,1fr))!important;break-inside:avoid!important;page-break-inside:avoid!important}
  body[data-printing="schedule"] .print-week-head>div,body[data-printing="schedule"] .print-week-day{padding:1.6mm 1mm!important}
  body[data-printing="schedule"] .print-week-department,body[data-printing="schedule"] .print-week-cell{padding:1.4mm 1mm!important}
  body[data-printing="schedule"] .print-week-shift{padding:1mm!important;margin:0 0 .7mm!important}
  body[data-printing="schedule"] .print-week-shift strong,body[data-printing="schedule"] .print-week-shift span{font-size:6.2pt!important}
  body[data-printing="schedule"] .print-week-shift small,body[data-printing="schedule"] .print-week-shift p{font-size:5.2pt!important}
  body[data-printing="schedule"] .print-week-row,body[data-printing="schedule"] .print-week-head{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* RC9.1 - planning layout chooser + private manager ratings */
.planner-layout-summary{display:grid!important;grid-template-columns:auto 1fr auto;align-items:center;gap:9px;min-width:210px;text-align:left}.planner-layout-summary>span:first-child{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:var(--teal-soft);color:var(--teal-dark);font-size:1rem}.planner-layout-summary>span:nth-child(2){display:grid;gap:1px}.planner-layout-summary small{font-size:.56rem;color:var(--muted);font-weight:700}.planner-layout-summary strong{font-size:.68rem;color:var(--ink)}.planner-layout-summary i{font-style:normal;font-size:.58rem;color:var(--teal-dark);font-weight:800}
.layout-choice-intro{margin:0 0 14px;color:var(--muted);line-height:1.55}.planner-layout-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.planner-layout-choice{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:start;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--ink);text-align:left;cursor:pointer;transition:.16s ease}.planner-layout-choice:hover{border-color:#9ccfc9;box-shadow:0 7px 18px rgba(15,29,42,.06);transform:translateY(-1px)}.planner-layout-choice.active{border-color:var(--teal);background:var(--teal-soft)}.planner-layout-choice-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#eef6f6;color:var(--teal-dark);font-size:1.15rem;font-weight:900}.planner-layout-choice>span:nth-child(2){display:grid;gap:4px}.planner-layout-choice strong{font-size:.78rem}.planner-layout-choice small{color:var(--muted);line-height:1.45;font-size:.62rem}.planner-layout-choice i{font-style:normal;padding:4px 7px;border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:.55rem;font-weight:850}.planner-layout-choice.active i{background:#d6f2ee;color:#006b61}
.compact-week-planner{display:grid;gap:12px}.compact-week-summary{display:flex;gap:8px;flex-wrap:wrap}.compact-week-summary>span{min-width:92px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);display:grid;gap:1px}.compact-week-summary small{font-size:.55rem;color:var(--muted);font-weight:750}.compact-week-summary strong{font-size:.82rem;color:var(--ink)}.compact-week-days{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.compact-week-day{min-width:0;border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden}.compact-week-day.today{border-color:#82c9c1;box-shadow:inset 0 0 0 1px #82c9c1}.compact-week-day>header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 10px;border-bottom:1px solid var(--line);background:var(--surface-2)}.compact-week-day>header div{display:grid;gap:1px}.compact-week-day>header small{font-size:.55rem;color:var(--muted);text-transform:capitalize}.compact-week-day>header strong{font-size:.72rem}.compact-week-day>header>span{display:grid;place-items:center;min-width:24px;height:24px;border-radius:999px;background:#fff;color:var(--muted);font-size:.58rem;font-weight:850}.compact-week-shifts{display:grid;gap:5px;padding:7px}.compact-week-shift{display:grid;grid-template-columns:minmax(92px,.8fr) minmax(0,1fr) auto;align-items:center;gap:8px;width:100%;padding:7px 8px;border:1px solid var(--line);border-left:3px solid var(--dept,var(--teal));border-radius:8px;background:#fff;text-align:left;color:inherit;cursor:pointer}.compact-week-shift:hover{background:#f8fbfb}.compact-week-shift.open{border-style:dashed}.compact-week-shift span{display:grid;gap:1px;min-width:0}.compact-week-shift strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.62rem}.compact-week-shift small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:.52rem}.compact-week-shift b{display:grid;place-items:center;width:21px;height:21px;border-radius:999px;background:#fff0d8;color:#9a6300;font-size:.53rem}.compact-week-empty{padding:18px 8px;text-align:center;color:var(--muted);font-size:.6rem}.compact-week-add{width:calc(100% - 14px);margin:0 7px 7px;padding:7px;border:1px dashed #9bcfc9;border-radius:8px;background:var(--teal-soft);color:var(--teal-dark);font-size:.6rem;font-weight:850;cursor:pointer}
.employee-rating-control{display:inline-grid;grid-template-columns:auto auto;align-items:center;gap:3px 8px;margin-top:7px;padding:7px 9px;border:1px solid #dce5e6;border-radius:10px;background:#f8fbfb}.employee-rating-stars{display:flex;align-items:center;gap:1px}.employee-rating-star{appearance:none;border:0;background:transparent;padding:0 1px;color:#c9d1d5;font-size:1rem;line-height:1;cursor:pointer}.employee-rating-star:hover,.employee-rating-star.active{color:#d8a321}.employee-rating-control small{grid-column:1/2;font-size:.52rem;color:var(--muted);font-weight:700}.employee-rating-clear{grid-column:2/3;grid-row:2/3;appearance:none;border:0;background:transparent;padding:0;color:var(--muted);font-size:.5rem;text-decoration:underline;cursor:pointer}.employee-rating-control.compact{display:grid;grid-template-columns:1fr;gap:3px;margin-top:6px;padding:5px 7px;max-width:max-content}.employee-rating-control.compact .employee-rating-star{font-size:.82rem}.employee-rating-control.compact small{grid-column:auto;font-size:.48rem}.employee-rating-control.compact .employee-rating-clear{grid-column:auto;grid-row:auto;justify-self:start}.employee-360-person .employee-rating-control{margin-top:9px}
@media(max-width:1000px){.compact-week-days{grid-template-columns:repeat(2,minmax(0,1fr))}.planner-layout-choice-grid{grid-template-columns:1fr}}
@media(max-width:700px){.planner-layout-summary{min-width:0;width:100%}.compact-week-days{grid-template-columns:1fr}.compact-week-shift{grid-template-columns:100px minmax(0,1fr) auto}.employee-rating-control{max-width:100%}.employee-rating-star{font-size:1.08rem}}


/* ShiftKlaar V5 RC9.2 - praktische UI, planning drag & hours management */
:root{--radius:8px;--shadow:0 1px 3px rgba(15,29,42,.08)}
.card{border-radius:8px;box-shadow:var(--shadow)}
.button{border-radius:5px;box-shadow:none!important;transition:background-color .12s ease,border-color .12s ease,color .12s ease;transform:none!important}
.button.primary{background:var(--teal);box-shadow:none}.button.primary:hover{background:#009b8d}.button.small{border-radius:4px}.button.ghost{background:#fff}.button.soft{background:#e3f5f2;border:1px solid #c5e8e3}.button.danger-outline{background:#fff;color:var(--danger);border:1px solid #e9bfc4}
.field input,.field select,.field textarea{border-radius:5px}.modal{border-radius:8px}.icon-button{border-radius:5px}.notice{border-radius:6px}.list-item,.table-wrap{border-radius:6px}.badge{border-radius:4px}.avatar{border-radius:6px;background:var(--teal-soft);color:#006f65}.kpi-icon{border-radius:5px}
.sidebar{background:#142733;box-shadow:6px 0 20px rgba(15,29,42,.08)}.sidebar-logo img{border-radius:5px}.nav button,.nav a{border-radius:4px}.nav button:hover,.nav a:hover{background:#1b3443}.nav button.active,.nav a.active{background:#1d3b49;box-shadow:inset 3px 0 0 var(--teal)}.sidebar-actions button{border-radius:4px;background:#1a3341}.topbar{backdrop-filter:none;background:#f4f7f7}
.cockpit-grid-main-single{grid-template-columns:minmax(0,1fr)!important}.cockpit-grid-main-single>.card{min-height:0}

.planner-staff-pool{padding:14px 16px}.planner-staff-pool .card-header{margin-bottom:10px}.planner-staff-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#fff}.planner-staff-day{min-width:0;border-right:1px solid var(--line);padding:8px}.planner-staff-day:last-child{border-right:0}.planner-staff-day>header{display:flex;align-items:baseline;justify-content:space-between;padding-bottom:6px;border-bottom:1px solid var(--line);margin-bottom:6px}.planner-staff-day>header span{text-transform:uppercase;font-size:.63rem;color:var(--muted);font-weight:800}.planner-staff-day>header strong{font-size:.78rem}.planner-staff-group{display:grid;gap:4px;max-height:118px;overflow:auto;padding-right:2px}.planner-staff-group+ .planner-staff-group{border-top:1px dashed var(--line);margin-top:7px;padding-top:6px}.planner-staff-group>small{font-size:.6rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:800}.planner-staff-group>em{font-size:.68rem;color:#9aa7ad;font-style:normal}.planner-employee-chip{display:block;width:100%;border:1px solid #cfe7df;background:#eefaf5;color:var(--ink);text-align:left;padding:5px 6px;border-radius:4px;cursor:grab}.planner-employee-chip.flex{background:#f6f8f8;border-color:#e0e6e7}.planner-employee-chip:active{cursor:grabbing}.planner-employee-chip strong{display:block;font-size:.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.planner-employee-chip small{display:block;font-size:.58rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.planner-employee-chip.dragging{opacity:.45}.employee-drag-over{outline:2px solid var(--teal)!important;outline-offset:-2px;background:#e7faf6!important}
.hours-person-filter{display:flex;align-items:end;gap:12px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}.hours-person-filter label{display:grid;gap:4px;min-width:260px}.hours-person-filter label span{font-size:.7rem;font-weight:800;color:var(--ink)}.hours-person-filter select{border:1px solid var(--line);border-radius:5px;padding:9px 10px;background:#fff}.hours-person-filter small{color:var(--muted);font-size:.7rem}
.day-close-lower-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(250px,.7fr);gap:14px;align-items:start}.day-close-operations{position:sticky;top:100px}.day-close-task-grid{grid-template-columns:1fr!important}.day-close-page{gap:14px}.day-close-summary{border-radius:6px!important}.day-close-upper-grid{gap:14px!important}.day-close-review-row{border-radius:4px!important}
@media(max-width:1050px){.planner-staff-week{grid-template-columns:repeat(4,minmax(0,1fr))}.planner-staff-day:nth-child(4){border-right:0}.planner-staff-day{border-bottom:1px solid var(--line)}.day-close-lower-grid{grid-template-columns:1fr}.day-close-operations{position:static}}
@media(max-width:700px){.planner-staff-week{grid-template-columns:1fr 1fr}.planner-staff-day{border-right:1px solid var(--line)}.planner-staff-day:nth-child(even){border-right:0}.planner-staff-group{max-height:150px}.hours-person-filter{display:grid;gap:6px}.hours-person-filter label{min-width:0}.button{border-radius:5px}.card{border-radius:7px}}

/* RC9.3 stability release: only requested planning, employees, onboarding and insights refinements */
.quick-planning-intro{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 14px;padding:10px 12px;border-left:3px solid var(--teal);background:#f4faf9}.quick-planning-intro strong{color:var(--ink)}.quick-planning-intro span{color:var(--muted);font-size:.72rem}.quick-planning-form{gap:11px}.input-with-unit{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}.input-with-unit span{align-self:stretch;display:grid;place-items:center;padding:0 10px;border:1px solid var(--line);border-left:0;background:#f5f8f8;color:var(--muted);font-size:.7rem;font-weight:800}
.planner-selection-bar{display:flex;align-items:center;gap:10px;position:sticky;top:78px;z-index:16;padding:9px 12px;border:1px solid #9fded5;background:#ecfaf7;box-shadow:0 5px 15px rgba(15,29,42,.07)}.planner-selection-bar.hidden{display:none}.planner-selection-bar>div{min-width:0;flex:1}.planner-selection-bar small,.planner-selection-bar strong,.planner-selection-bar span{font-size:.72rem}.planner-selection-bar small{display:block;color:var(--muted);font-size:.58rem;text-transform:uppercase;font-weight:900}.planner-selection-check{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:var(--teal);color:#fff;font-weight:900}.planner-employee-chip span{display:block;margin-top:2px;color:#54706d;font-size:.54rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.planner-employee-chip.selected{border-color:var(--teal)!important;background:#dff7f2!important;box-shadow:0 0 0 2px rgba(0,173,156,.18)}
.planner-dragging{user-select:none!important}.employee-drag-target{box-shadow:inset 0 0 0 1px rgba(0,173,156,.35)}.employee-drag-invalid{opacity:.52;cursor:not-allowed!important;filter:saturate(.55)}.employee-drag-over{outline:2px solid var(--teal)!important;outline-offset:-2px;background:#e7faf6!important}
.manager-mobile-month-grid{display:none}.mobile-month-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}.mobile-month-heading>div{text-align:center}.mobile-month-heading small,.mobile-month-heading strong{display:block}.mobile-month-heading small{font-size:.58rem;text-transform:uppercase;color:var(--muted);font-weight:900}.mobile-month-heading strong{font-size:.9rem;text-transform:capitalize}.manager-mobile-month-grid .sk-month-day{display:grid;align-content:center;justify-items:center;gap:1px;padding:3px 1px}.manager-mobile-month-grid .sk-month-day span{font-size:.72rem}.manager-mobile-month-grid .sk-month-day small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.46rem;font-weight:700;color:var(--muted)}.manager-mobile-month-grid .sk-month-day.selected small{color:rgba(255,255,255,.82)}.manager-mobile-month-grid .sk-month-day.today:not(.selected){box-shadow:inset 0 0 0 1px var(--teal)}

/* Medewerkers: vaste compacte desktopkolommen; geen sticky actiekolom of brede 1180px tabel. */
.employee-table-wrap{width:100%;max-width:100%;overflow:visible!important}.employee-table{width:100%;min-width:0!important;table-layout:fixed}.employee-table th:nth-child(1){width:31%}.employee-table th:nth-child(2){width:17%}.employee-table th:nth-child(3){width:22%}.employee-table th:nth-child(4){width:16%}.employee-table th:nth-child(5){width:14%}.employee-table .employee-actions-cell,.employee-table thead th:last-child{position:static!important;min-width:0!important;box-shadow:none!important;background:inherit}.employee-table td{vertical-align:top}.employee-role-line,.employee-meta-line,.employee-account-row{display:flex;align-items:center;gap:6px;min-width:0;flex-wrap:wrap;margin-top:5px}.employee-role-line{color:var(--muted);font-size:.69rem}.employee-meta-line small{color:var(--muted)}.employee-inline-actions{display:grid;grid-template-columns:1fr;gap:5px;margin-top:6px}.employee-inline-actions .button{width:100%;white-space:normal}.employee-account-row .button{margin:0}.employee-row-actions{display:grid!important;grid-template-columns:1fr;gap:5px!important;width:100%}.employee-row-actions .button{width:100%;white-space:normal}.employee-name-link{max-width:100%;text-align:left}
.document-upload-state{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;padding:8px 10px;border:1px solid var(--line);background:#f8fbfb}.document-upload-state strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.72rem}.document-upload-state small{color:var(--muted);font-size:.62rem;text-align:right}

.insights-period-card{display:grid;gap:10px}.insights-period-controls{display:grid;grid-template-columns:auto minmax(150px,210px) minmax(180px,1fr) auto;align-items:center;gap:8px}.insights-period-controls>strong{text-align:center;font-size:.82rem}.insights-custom-range{display:flex;align-items:end;justify-content:center;gap:8px;padding-top:8px;border-top:1px solid var(--line)}.insights-custom-range[hidden]{display:none!important}.insights-custom-range .field{min-width:155px}.insights-history-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border:1px solid var(--line);background:#fff}.insights-history-strip span{padding:10px 12px;border-right:1px solid var(--line)}.insights-history-strip span:last-child{border-right:0}.insights-history-strip small,.insights-history-strip strong{display:block}.insights-history-strip small{color:var(--muted);font-size:.6rem;text-transform:uppercase;font-weight:850}.insights-history-strip strong{margin-top:3px;color:var(--ink);font-size:1rem}

@media(max-width:1180px){.employee-table th:nth-child(n){width:auto}}
@media(max-width:700px){
  .manager-mobile-month-grid{display:block}.planner-selection-bar{top:62px}.planner-staff-week{grid-template-columns:1fr!important}.planner-staff-day{border-right:0!important}.planner-staff-group{max-height:190px}.planner-employee-chip{min-height:44px;padding:7px 8px}.planner-employee-chip strong{font-size:.74rem}.planner-employee-chip small{font-size:.62rem}.planner-employee-chip span{font-size:.57rem}
  .quick-planning-intro{display:grid}.quick-planning-form{grid-template-columns:1fr}.quick-planning-form .field{grid-column:1/-1}.modal-wide .modal-body{padding-bottom:18px}
  .document-upload-state{display:grid}.document-upload-state small{text-align:left}
  .insights-period-controls{grid-template-columns:1fr 1fr}.insights-period-controls select,.insights-period-controls>strong{grid-column:1/-1}.insights-period-controls>strong{order:-1}.insights-custom-range{display:grid;grid-template-columns:1fr 1fr}.insights-custom-range .field{min-width:0}.insights-custom-range .button{grid-column:1/-1}.insights-history-strip{grid-template-columns:1fr 1fr}.insights-history-strip span{border-bottom:1px solid var(--line)}.insights-history-strip span:nth-child(even){border-right:0}.insights-history-strip span:last-child{grid-column:1/-1;border-bottom:0}
  .employee-table .employee-actions-cell{background:transparent!important}.employee-inline-actions{grid-template-columns:1fr 1fr}.employee-row-actions{grid-template-columns:1fr 1fr!important}.employee-row-actions .button.danger:nth-child(3){grid-column:1/-1}
}

/* RC9.3.1 — uitsluitend: dienstsjablonenblokken + mobiel personeelsportaal */
/* Dienstsjablonen gebruiken dezelfde rustige blokopbouw als Afdelingen. */
.template-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.template-card{overflow:hidden;display:grid;grid-template-columns:7px minmax(0,1fr);align-items:stretch;gap:0;padding:0;box-shadow:var(--shadow)}
.template-card .template-color{display:block;min-height:100%;background:var(--dept,#00ad9c)}
.template-card .template-card-body{min-width:0;padding:18px}
.template-card .template-card-body .card-header{align-items:flex-start}
.template-card .template-time{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:14px 0 9px}
.template-card .template-time strong{font-size:.95rem;color:var(--ink);font-variant-numeric:tabular-nums}
.template-card .template-time span,.template-card .template-weekend{padding:6px 8px;border-radius:8px;background:var(--surface-2);font-size:.66rem;color:var(--muted)}
.template-card .template-weekend{display:inline-flex;align-items:center;gap:6px;margin-bottom:9px}.template-card .template-weekend small{margin:0;text-transform:uppercase;font-weight:850}.template-card .template-weekend strong{color:var(--ink)}
.template-card .template-days{display:flex;gap:4px;flex-wrap:wrap;margin:2px 0 14px}.template-card .template-days span{display:grid;place-items:center;min-width:27px;height:25px;padding:0 5px;border:1px solid var(--line);border-radius:7px;color:#9aa5aa;font-size:.58rem;font-weight:850;text-transform:uppercase}.template-card .template-days span.active{border-color:#a9dcd5;background:var(--teal-soft);color:#05796f}
.template-card .toolbar{justify-content:flex-start}

/* Manager: per medewerker alleen de benodigde personeelsportal-onderdelen tonen. */
.portal-section-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.portal-section-picker>label{display:flex;align-items:flex-start;gap:9px;min-width:0;padding:10px;border:1px solid var(--line);border-radius:9px;background:#fff;cursor:pointer}
.portal-section-picker>label:has(input:checked){border-color:#9edbd5;background:#f0faf8}
.portal-section-picker input{width:17px;height:17px;min-height:0;flex:0 0 auto;margin-top:2px;accent-color:var(--teal)}
.portal-section-picker span{min-width:0}.portal-section-picker strong,.portal-section-picker small{display:block}.portal-section-picker strong{font-size:.72rem;color:var(--ink)}.portal-section-picker small{margin-top:2px;color:var(--muted);font-size:.6rem;line-height:1.3}

/* Personeelsportaal maandrooster: meerdere statussen kunnen op dezelfde dag zichtbaar zijn. */
.sk-month-legend{display:flex;flex-wrap:wrap;gap:5px 10px;padding:2px 14px 8px}
.sk-month-legend span,.sk-day-status-strip span{display:inline-flex;align-items:center;gap:5px;color:var(--muted);font-size:.58rem;font-weight:850}
.sk-month-legend i,.sk-day-status-strip i{display:inline-block;width:7px;height:7px;border-radius:50%;flex:0 0 7px}
.sk-month-legend .planned i,.sk-day-status-strip .planned i,.sk-month-markers i.planned{background:#139687}
.sk-month-legend .approved i,.sk-day-status-strip .approved i,.sk-month-markers i.approved{background:#3c8f62}
.sk-month-legend .rejected i,.sk-day-status-strip .rejected i,.sk-month-markers i.rejected{background:#c84e5a}
.sk-month-legend .leave i,.sk-day-status-strip .leave i,.sk-month-markers i.leave{background:#d38c25}
.sk-month-legend .sick i,.sk-day-status-strip .sick i,.sk-month-markers i.sick{background:#7660a9}
.sk-month-markers{position:absolute;left:3px;right:3px;bottom:4px;display:flex;align-items:center;justify-content:center;gap:2px;pointer-events:none}
.sk-month-day>.sk-month-markers i{position:static;left:auto;bottom:auto;transform:none;width:5px;height:5px;border-radius:50%}
.sk-month-day.selected>.sk-month-markers i{box-shadow:0 0 0 1px rgba(255,255,255,.8)}
.sk-day-status-strip{display:flex;flex-wrap:wrap;gap:5px;padding:9px 14px;border-top:1px solid var(--line);background:#fbfdfd}
.sk-day-status-strip span{padding:5px 7px;border-radius:999px;background:#f2f5f5}.sk-day-status-strip .neutral{color:#8a969c}
.sk-roster-status.planned{background:#eeeaff;color:#4b3f92}
.personnel-controls-single{display:grid;grid-template-columns:minmax(0,1fr);max-width:900px}

@media(max-width:1100px){
  .template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .portal-section-picker{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:780px){
  .template-grid{grid-template-columns:1fr}
  .template-card{display:grid;grid-template-columns:6px minmax(0,1fr)}
  .template-card .template-card-body{padding:14px}
  .portal-section-picker{grid-template-columns:1fr}

  /* Alleen het personeelsportaal krijgt deze mobiele opruiming. */
  [data-portal="Personeelsportaal"] .content{padding-bottom:calc(78px + env(safe-area-inset-bottom))!important}
  [data-portal="Personeelsportaal"] .mobile-bottom-nav button{min-height:56px!important;padding:4px 1px!important}
  [data-portal="Personeelsportaal"] .mobile-nav-label{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;text-align:center;line-height:1.02}
  [data-portal="Personeelsportaal"] .mobile-bottom-nav [data-mobile-view="requests"] .mobile-nav-label{font-size:.46rem;max-width:74px}
  [data-portal="Personeelsportaal"] .top-actions{max-width:54vw;gap:5px}
  [data-portal="Personeelsportaal"] .top-actions .button{min-height:40px;padding:7px 9px}
  [data-portal="Personeelsportaal"] .list-item{padding:12px!important;gap:8px}
  [data-portal="Personeelsportaal"] .list-item h4{line-height:1.25}
  [data-portal="Personeelsportaal"] .calm-week-navigation.compact{width:100%;justify-content:space-between}
  [data-portal="Personeelsportaal"] .calm-week-navigation.compact>div{min-width:0;flex:1;text-align:center}
  [data-portal="Personeelsportaal"] .calm-availability-presets{gap:6px}
  [data-portal="Personeelsportaal"] .calm-availability-presets .button{min-height:38px;white-space:normal}
  [data-portal="Personeelsportaal"] .sk-month-legend{padding:1px 10px 8px;gap:4px 7px}
  [data-portal="Personeelsportaal"] .sk-month-legend span{font-size:.54rem}
  [data-portal="Personeelsportaal"] .sk-day-status-strip{padding:8px 10px}
  [data-portal="Personeelsportaal"] .sk-month-markers{gap:1px}
  [data-portal="Personeelsportaal"] .sk-month-day>.sk-month-markers i{width:4px;height:4px}
}

/* RC9.3.4 — Mijn rooster: hele datumvakken kleuren, geen statusbolletjes. */
.sk-own-roster-card .sk-week-day{min-height:66px;padding:5px 2px;gap:1px}
.sk-own-roster-card .sk-week-day .sk-roster-day-label{display:block;max-width:100%;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.46rem;line-height:1.05;font-weight:900;text-transform:none;color:inherit}
.sk-own-roster-card .sk-week-day.planned{background:#ddd6ff;border-color:#8674ea;color:#42358c}
.sk-own-roster-card .sk-week-day.open-shift{background:#c9e2ff;border-color:#5b9fe8;color:#164f86}
.sk-own-roster-card .sk-week-day.approved{background:#c8f0d0;border-color:#4cb96b;color:#176635}
.sk-own-roster-card .sk-week-day.pending{background:#ffd8a1;border-color:#ee9632;color:#874900}
.sk-own-roster-card .sk-week-day.selected{border-color:#162a34!important;box-shadow:inset 0 0 0 1px #162a34,0 3px 9px rgba(24,38,49,.1)!important}
.sk-own-roster-card .sk-week-day.selected:not(.planned):not(.open-shift):not(.approved):not(.pending){background:#eef5f4;color:#18313a}
.sk-own-roster-card .sk-week-day.selected small,.sk-own-roster-card .sk-week-day.selected .sk-roster-day-label{color:inherit;opacity:1}

.sk-own-roster-card .sk-month-day{display:grid;align-content:center;justify-items:center;gap:2px;min-height:52px;padding:4px 1px;border:1px solid transparent;border-radius:9px;background:#fff;color:var(--sk-ink-soft)}
.sk-own-roster-card .sk-month-day .sk-day-number{display:block;font-size:.76rem;line-height:1;font-weight:900;color:inherit}
.sk-own-roster-card .sk-month-day .sk-roster-day-label{display:block;width:100%;padding:0 1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;font-size:.41rem;line-height:1.05;font-weight:900;color:inherit}
.sk-own-roster-card .sk-month-day.planned{background:#ddd6ff;border-color:#8674ea;color:#42358c}
.sk-own-roster-card .sk-month-day.open-shift{background:#c9e2ff;border-color:#5b9fe8;color:#164f86}
.sk-own-roster-card .sk-month-day.approved{background:#c8f0d0;border-color:#4cb96b;color:#176635}
.sk-own-roster-card .sk-month-day.pending{background:#ffd8a1;border-color:#ee9632;color:#874900}
.sk-own-roster-card .sk-month-day.outside{opacity:.42}
.sk-own-roster-card .sk-month-day.selected{border-color:#162a34!important;box-shadow:inset 0 0 0 1px #162a34,0 2px 7px rgba(24,38,49,.1)!important}
.sk-own-roster-card .sk-month-day.selected:not(.planned):not(.open-shift):not(.approved):not(.pending){background:#eef5f4;color:#18313a}
.sk-own-roster-card .sk-month-day i,.sk-own-roster-card .sk-month-markers{display:none!important}
.sk-own-roster-card .sk-day-status-strip{display:flex;flex-wrap:wrap;gap:5px;padding:9px 14px;border-top:1px solid var(--line);background:#fbfdfd}
.sk-own-roster-card .sk-day-status-strip span{display:inline-flex;align-items:center;min-height:27px;padding:5px 8px;border-radius:999px;font-size:.58rem;font-weight:900}
.sk-own-roster-card .sk-day-status-strip .planned{background:#ddd6ff;color:#42358c}
.sk-own-roster-card .sk-day-status-strip .open-shift{background:#c9e2ff;color:#164f86}
.sk-own-roster-card .sk-day-status-strip .approved{background:#c8f0d0;color:#176635}
.sk-own-roster-card .sk-day-status-strip .pending{background:#ffd8a1;color:#874900}
.sk-roster-status.approved{background:#e4f5e8;color:#2e744c}
.sk-roster-status.pending{background:#fff0d9;color:#9a6417}
@media(max-width:780px){
  [data-portal="Personeelsportaal"] .sk-own-roster-card .sk-month-day{min-height:50px}
  [data-portal="Personeelsportaal"] .sk-own-roster-card .sk-month-day .sk-roster-day-label{font-size:.39rem}
  [data-portal="Personeelsportaal"] .sk-own-roster-card .sk-week-day{min-height:64px}
}


/* RC9.3.7 — uitsluitend: duidelijkere ingeplandkleur, mobiel manager-menu, tijdlijnlayout, dashboardbezetting en taalinstelling. */
@media(max-width:780px){
  [data-portal="Managerportaal"] .mobile-nav-panel{height:100dvh!important;max-height:100dvh!important;overflow-y:auto!important;overscroll-behavior:contain!important}
  [data-portal="Managerportaal"] .mobile-nav-panel-list{padding-bottom:calc(112px + env(safe-area-inset-bottom))!important}
}
.language-settings-card{margin-top:14px}.language-settings-row{display:grid;grid-template-columns:minmax(190px,260px) minmax(0,1fr) auto;align-items:end;gap:14px}.language-settings-row p{margin:0 0 8px;color:var(--muted);font-size:.68rem;line-height:1.45}.language-settings-row .button{min-width:120px}
@media(max-width:700px){.language-settings-row{grid-template-columns:1fr}.language-settings-row p{margin:0}.language-settings-row .button{width:100%}}

.manager-timeline-planner{display:grid;gap:12px;min-width:0}.manager-timeline-heading{display:flex;align-items:end;justify-content:space-between;gap:12px;padding:2px 2px 0}.manager-timeline-heading h3{margin:2px 0 0;color:var(--ink);font-size:1rem;text-transform:capitalize}.manager-timeline-shell{display:grid;grid-template-columns:minmax(120px,170px) minmax(0,1fr);align-items:stretch;min-width:0;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#fff}.manager-timeline-axis{position:relative;height:39px;border-left:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--surface-2)}.manager-timeline-axis span{position:absolute;bottom:9px;transform:translateX(-50%);font-size:.56rem;font-weight:850;color:var(--muted);font-variant-numeric:tabular-nums}.manager-timeline-axis span:first-child{transform:none}.manager-timeline-axis span:last-child{transform:translateX(-100%)}.manager-timeline-row{display:contents}.manager-timeline-person{min-width:0;padding:11px 12px;border-top:1px solid var(--line);background:#fbfdfd}.manager-timeline-person strong,.manager-timeline-person small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.manager-timeline-person strong{font-size:.7rem;color:var(--ink)}.manager-timeline-person small{margin-top:2px;color:var(--muted);font-size:.56rem}.manager-timeline-row.open .manager-timeline-person strong{color:#a06410}.manager-timeline-track{position:relative;min-height:58px;border-top:1px solid var(--line);border-left:1px solid var(--line);background:#fff}.manager-timeline-gridline{position:absolute;top:0;bottom:0;width:1px;background:#edf1f2}.manager-timeline-shift{position:absolute;top:10px;height:27px;min-width:28px;border:1px solid color-mix(in srgb,var(--dept) 65%,#4f646e);border-radius:5px;background:color-mix(in srgb,var(--dept) 22%,#fff);color:var(--ink);padding:0 6px;overflow:hidden;text-align:left;cursor:pointer}.manager-timeline-shift:hover{box-shadow:0 4px 12px rgba(15,29,42,.12);z-index:2}.manager-timeline-shift span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.55rem;font-weight:900;font-variant-numeric:tabular-nums}.manager-timeline-shift.open{border-style:dashed;border-color:#dc9837;background:#fff2db;color:#8a5410}.manager-timeline-shift b{position:absolute;right:3px;top:3px;display:grid;place-items:center;min-width:16px;height:16px;border-radius:999px;background:#fff;color:#8a5410;font-size:.48rem}.manager-timeline-empty{grid-column:1/-1;padding:14px}.manager-timeline-shell>div:first-child{height:39px;border-bottom:1px solid var(--line);background:var(--surface-2)}
@media(max-width:700px){.manager-timeline-heading{align-items:stretch;flex-direction:column}.manager-timeline-heading .button{width:100%}.manager-timeline-shell{grid-template-columns:92px minmax(0,1fr)}.manager-timeline-person{padding:9px 7px}.manager-timeline-person strong{font-size:.62rem}.manager-timeline-person small{font-size:.5rem}.manager-timeline-axis span.minor{display:none}.manager-timeline-track{min-height:54px}.manager-timeline-shift{top:9px;height:26px;padding:0 4px}.manager-timeline-shift span{font-size:.49rem}}

.dashboard-occupancy-card{min-width:0}.dashboard-occupancy-list{display:grid;gap:6px}.dashboard-occupancy-row{display:grid;grid-template-columns:52px minmax(0,1fr) 112px;align-items:center;gap:10px;min-height:30px}.dashboard-occupancy-row time{color:var(--ink);font-size:.65rem;font-weight:850;font-variant-numeric:tabular-nums}.dashboard-occupancy-track{height:14px;border-radius:4px;background:#edf3f3;overflow:hidden}.dashboard-occupancy-track i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#00ad9c,#24c5b4)}.dashboard-occupancy-row strong{color:var(--ink);font-size:.62rem;font-weight:800}.dashboard-occupancy-row:has(i[style*="width:0%"]){opacity:.62}
@media(max-width:520px){.dashboard-occupancy-row{grid-template-columns:44px minmax(0,1fr) 76px;gap:7px}.dashboard-occupancy-row strong{font-size:.55rem}.dashboard-occupancy-track{height:12px}}


/* ===== RC9.3.7 personeel: Instellingen bereikbaar + taalkeuze ===== */
.personnel-language-settings-row{display:grid;grid-template-columns:minmax(180px,260px) minmax(0,1fr) auto;gap:14px;align-items:end}
.personnel-language-settings-row>p{margin:0 0 10px;color:var(--muted);line-height:1.45}
@media(max-width:780px){
  body[data-portal="Personeelsportaal"] .mobile-nav-panel{max-height:calc(100dvh - 92px - env(safe-area-inset-bottom));overflow-y:auto!important;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y}
  body[data-portal="Personeelsportaal"] .mobile-nav-panel-list{padding-bottom:calc(22px + env(safe-area-inset-bottom))}
  .personnel-language-settings-row{grid-template-columns:1fr;align-items:stretch;gap:10px}
  .personnel-language-settings-row>p{margin:0}
  .personnel-language-settings-row .button{width:100%}
}

/* RC9.3.8 — algemene login en compacte personeelsinstellingen */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
body.auth-page.auth-gateway{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(520px,1fr)!important;min-height:100dvh!important;background:#f5f9f9!important;color:var(--ink)}
.auth-reference-visual{min-height:100dvh;background-image:url('/assets/login-hospitality-sharp.webp');background-size:cover;background-position:center center;background-repeat:no-repeat;box-shadow:inset -1px 0 rgba(255,255,255,.08)}
.auth-gateway-panel{position:relative;min-width:0;display:grid;place-items:center;padding:92px clamp(32px,7vw,112px) 50px;background:radial-gradient(circle at 70% 10%,rgba(0,173,156,.08),transparent 34%),linear-gradient(145deg,#fbfdfd,#f1f8f7)}
.auth-gateway-language{position:absolute;right:clamp(26px,5vw,72px);top:28px}.auth-gateway-language select{border:0;background:transparent;color:#66747d;padding:8px 28px 8px 8px;font-weight:700;outline:none}
.auth-mobile-brand{display:none}.auth-gateway-card{width:min(600px,100%);padding:44px 50px 36px!important;border-radius:20px!important;border:1px solid #e4ebec!important;box-shadow:0 22px 70px rgba(15,29,42,.09)!important;background:rgba(255,255,255,.96)!important}
.auth-gateway-kicker{display:none}.auth-gateway-card h1{font-size:2.55rem;line-height:1.02;letter-spacing:-.045em;margin:0 0 8px;color:#111d27}.auth-gateway-subtitle{margin:0 0 28px;color:#687681;font-size:1.05rem}
.auth-gateway-form{gap:20px}.auth-gateway-form .field label{font-size:.9rem}.auth-input-wrap{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr) 42px;align-items:center;border:1px solid #cfd8db;border-radius:12px;background:#fff;overflow:hidden;transition:.16s ease}.auth-input-wrap:focus-within{border-color:var(--teal);box-shadow:0 0 0 3px rgba(0,173,156,.12)}.auth-input-wrap>span{display:grid;place-items:center;color:#7a8992;font-size:1rem}.auth-input-wrap input{border:0!important;box-shadow:none!important;border-radius:0!important;padding:15px 4px!important;min-width:0}.auth-password-toggle{border:0;background:transparent;color:#71818a;height:100%;font-weight:900}
.auth-forgot-row{display:flex;justify-content:flex-end;margin-top:-10px}.auth-gateway-login{min-height:54px;font-size:1rem;margin-top:2px}.auth-gateway-login b{font-size:1.35rem;font-weight:500}.auth-trust{display:flex;align-items:center;justify-content:center;gap:8px;color:#87939a;margin-top:30px;font-size:.82rem}.auth-app-identity{display:block;margin:-18px 0 20px;color:#91a0a6}
.auth-app-list{display:grid;gap:14px}.auth-app-card{width:100%;display:grid;grid-template-columns:58px minmax(0,1fr) 24px;gap:16px;align-items:center;padding:15px 18px;border:1px solid #dde5e7;border-radius:14px;background:#fbfcfc;text-align:left;color:#17242d;transition:.16s ease}.auth-app-card:hover{transform:translateY(-1px);border-color:#bfd6d4;box-shadow:0 10px 28px rgba(15,29,42,.07)}.auth-app-card>span:nth-child(2){min-width:0}.auth-app-card strong{display:block;font-size:1rem;margin-bottom:4px}.auth-app-card small{display:block;color:#74818a;line-height:1.35}.auth-app-card>b{justify-self:end;font-size:1.9rem;font-weight:400;color:#67757d}.auth-app-icon{width:54px;height:54px;border-radius:12px;display:grid;place-items:center;color:#fff;font-weight:900;font-size:1.25rem}.auth-app-card.shiftklaar .auth-app-icon{background:linear-gradient(145deg,#12bea9,#07877d)}.auth-app-card.pos .auth-app-icon{background:linear-gradient(145deg,#173646,#0f1d2a)}.auth-app-card.payroll .auth-app-icon{background:linear-gradient(145deg,#9c59e8,#7435c5)}
.auth-app-footer{border-top:1px solid #e3e9eb;margin-top:26px;padding-top:22px;display:flex;align-items:center;justify-content:center;gap:8px;color:#7e8a91;font-size:.82rem}.auth-change-account{display:block;margin:20px auto 0}
.personnel-settings-page{display:grid;gap:14px}.personnel-settings-grid{align-items:stretch}.personnel-preferences-card .form{height:100%;align-content:start}.personnel-preferences-card .button{margin-top:auto}.personnel-account-settings-card{margin-top:0}.personnel-settings-actions{display:flex;gap:10px;flex-wrap:wrap}.personnel-settings-actions .button{min-width:150px}
@media(max-width:980px){body.auth-page.auth-gateway{grid-template-columns:minmax(330px,.85fr) minmax(500px,1.15fr)!important}.auth-gateway-panel{padding-left:32px;padding-right:32px}.auth-gateway-card{padding:38px 38px 32px!important}}
@media(max-width:760px){body.auth-page.auth-gateway{display:block!important;background:#f5f9f9!important}.auth-reference-visual{display:none}.auth-gateway-panel{min-height:100dvh;padding:calc(76px + env(safe-area-inset-top)) 14px calc(24px + env(safe-area-inset-bottom));display:block}.auth-gateway-language{top:calc(13px + env(safe-area-inset-top));right:12px}.auth-mobile-brand{display:block;width:160px;margin:0 0 20px 8px}.auth-gateway-card{width:100%;padding:26px 22px 24px!important;border-radius:18px!important}.auth-gateway-card h1{font-size:1.8rem}.auth-gateway-subtitle{font-size:.94rem;margin-bottom:22px}.auth-app-card{grid-template-columns:50px minmax(0,1fr) 18px;padding:13px}.auth-app-icon{width:48px;height:48px}.auth-app-card strong{font-size:.96rem}.auth-app-card small{font-size:.76rem}.personnel-settings-actions{display:grid}.personnel-settings-actions .button{width:100%}}


/* RC9.3.9 - requested manager/support refinements only. */
.planner-availability-toggle{display:flex;align-items:center;gap:8px;min-height:34px;padding:7px 10px;border:1px solid var(--line);border-radius:7px;background:var(--surface-2);color:var(--ink);font-size:.62rem;font-weight:850;white-space:nowrap}.planner-availability-toggle input{width:16px;height:16px;margin:0;accent-color:var(--teal)}
.request-view-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.request-template-switch{display:inline-flex;gap:6px;padding:4px;border:1px solid var(--line);border-radius:8px;background:#fff}.request-month-toolbar{display:flex;align-items:center;justify-content:center;gap:10px;margin:4px 0 10px}.request-month-toolbar strong{min-width:155px;text-align:center;text-transform:capitalize}.request-month-inline{max-height:520px}
.time-entry-correction{min-width:0}.time-entry-correction-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.time-entry-correction-grid>*{min-width:0}.time-entry-correction-grid input,.time-entry-correction-grid textarea{width:100%;max-width:100%;min-width:0}
.support-onboarding-card{border-left:4px solid var(--teal)}.support-onboarding-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.support-onboarding-summary>span{display:grid;gap:2px;padding:10px 12px;border:1px solid var(--line);border-radius:7px;background:var(--surface-2)}.support-onboarding-summary small{color:var(--muted);font-size:.56rem;font-weight:800}.support-onboarding-summary strong{color:var(--ink);font-size:1rem}.support-onboarding-workspace{display:grid;gap:14px}.support-onboarding-section{display:grid;gap:12px;padding:14px;border:1px solid var(--line);border-radius:8px;background:#fff}.support-onboarding-section h3{margin:0;color:var(--ink)}.support-onboarding-create-option{margin-top:4px;padding:10px;border:1px solid color-mix(in srgb,var(--teal) 26%,var(--line));border-radius:7px;background:color-mix(in srgb,var(--teal) 6%,#fff)}
@media(max-width:900px){.time-entry-correction-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.planner-staff-pool-head{align-items:stretch!important;flex-direction:column}.planner-availability-toggle{width:100%;justify-content:flex-start}.request-view-controls{align-items:stretch;flex-direction:column}.request-template-switch{display:grid;grid-template-columns:1fr 1fr;width:100%}.request-template-switch .button{width:100%}.time-entry-correction-grid{grid-template-columns:1fr}.support-onboarding-summary{grid-template-columns:repeat(3,minmax(0,1fr))}.support-onboarding-section{padding:11px}}

/* RC9.3.9 — uitsluitend gevraagde mobiele/login-correcties. */
.network-banner[hidden]{display:none!important}
.auth-gateway-login,.auth-gateway-login *{-webkit-user-select:none!important;user-select:none!important;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}


/* ShiftKlaar V5 RC9.3.10 - gerichte correcties */
/* Login: de generieke primary-button span achtergrond mag het label Inloggen niet markeren. */
.auth-gateway-login [data-i18n="login"]{
  background:transparent!important;
  box-shadow:none!important;
  text-decoration:none!important;
  -webkit-user-select:none!important;
  user-select:none!important;
}
.auth-gateway-login [data-i18n="login"]::selection{background:transparent;color:inherit}

/* Dag afsluiten: de urenkaart schakelt eerder naar 1 kolom zodat Acties/Corrigeren nooit wordt afgeknipt. */
@media(max-width:1320px){
  .day-close-lower-grid{grid-template-columns:1fr!important}
  .day-close-operations{position:static!important}
}
.day-close-review-actions .button{max-width:100%}

/* Personeelsrooster: goedgekeurd verlof krijgt een volledig, duidelijk afwijkend datumvak. */
.sk-own-roster-card .sk-week-day.leave{
  background:#ffd9e4!important;
  border-color:#d86d8b!important;
  color:#7d2d47!important;
}
.sk-own-roster-card .sk-month-day.leave{
  background:#ffd9e4!important;
  border:1px solid #d86d8b!important;
  color:#7d2d47!important;
}
.sk-own-roster-card .sk-week-day.selected.leave,
.sk-own-roster-card .sk-month-day.selected.leave{
  background:#f6c7d5!important;
  border-color:#b95070!important;
  color:#642239!important;
  box-shadow:inset 0 0 0 1px #b95070,0 4px 12px rgba(24,38,49,.12)!important;
}
.sk-roster-status.leave{background:#ffe7ee;color:#8b3552}
.sk-day-status-strip .leave{background:#ffe7ee;color:#8b3552}


/* RC9.3.11 — uitsluitend scherpere loginpresentatie; geen functionele wijzigingen. */
body.auth-page.auth-gateway .auth-reference-visual{
  background-image:url('/assets/login-hospitality-sharp.webp')!important;
  filter:contrast(1.035) saturate(1.035);
}
body.auth-page.auth-gateway .auth-gateway-panel,
body.auth-page.auth-gateway .auth-gateway-card,
body.auth-page.auth-gateway .auth-gateway-language{
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:auto;
  font-synthesis:none;
}
body.auth-page.auth-gateway .auth-gateway-card h1{color:#0b1720;font-weight:850}
body.auth-page.auth-gateway .auth-gateway-subtitle{color:#566771}
body.auth-page.auth-gateway .auth-gateway-form .field label{color:#111f28;font-weight:800}
body.auth-page.auth-gateway .auth-input-wrap input{color:#172630;font-weight:600}
body.auth-page.auth-gateway .auth-input-wrap input::placeholder{color:#6a7a84;opacity:1}
body.auth-page.auth-gateway .auth-mobile-brand img{display:block;width:100%;height:auto;filter:contrast(1.06) saturate(1.04)}

/* RC9.3.13 - support: extra applicaties los van pakket */
.support-app-access-grid{display:grid;gap:10px;margin-top:12px}

/* RC9.3.13 — applicatiekeuze: verborgen klantapps blijven echt verborgen. */
.auth-app-card[hidden]{display:none!important}


/* ShiftKlaar RC9.3.14 — support factuur crafter */
.modal.invoice-modal{width:min(1180px,calc(100% - 24px))}
.invoice-modal .modal-body{max-height:76vh;background:#f7f9f9}
.support-invoice-crafter{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(390px,.95fr);gap:18px;align-items:start}
.support-invoice-form{display:grid;gap:14px;min-width:0}
.support-invoice-section{border:1px solid var(--line);border-radius:14px;background:#fff;padding:15px}
.support-invoice-section .card-header{margin-bottom:13px}
.support-invoice-lines{display:grid;gap:9px}
.support-invoice-line{display:grid;grid-template-columns:78px minmax(180px,1.5fr) 76px 90px 112px 82px 38px;gap:8px;align-items:end;padding:10px;border:1px solid var(--line);border-radius:11px;background:#fbfdfd}
.support-invoice-line .field{gap:4px}.support-invoice-line .field label{font-size:.64rem}.support-invoice-line .field input,.support-invoice-line .field select{padding:8px 9px;font-size:.78rem}
.support-invoice-use{display:grid;gap:5px;justify-items:start;font-size:.68rem;font-weight:850;color:var(--muted);padding-bottom:9px}.support-invoice-use input{accent-color:var(--teal)}
.support-invoice-remove{width:34px;height:34px;margin-bottom:1px}
.support-invoice-preview-wrap{position:sticky;top:0;display:grid;gap:9px;min-width:0}
.support-invoice-preview-bar{display:flex;align-items:center;justify-content:space-between;gap:10px}
.support-invoice-document{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px;box-shadow:0 16px 45px rgba(15,29,42,.08);color:var(--ink)}
.support-invoice-doc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;border-bottom:2px solid var(--teal);padding-bottom:15px}.support-invoice-doc-head>div{display:grid;gap:4px}.support-invoice-doc-head img{width:145px;max-height:46px;object-fit:contain;object-position:right top}.support-invoice-title{font-size:1.35rem;font-weight:950;letter-spacing:.08em}.support-invoice-doc-head strong{font-size:.72rem;color:var(--muted)}
.support-invoice-parties{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:20px 0}.support-invoice-parties>div{display:grid;gap:3px}.support-invoice-parties small,.support-invoice-meta small,.support-invoice-totals small,.support-invoice-notes small{font-size:.58rem;font-weight:900;letter-spacing:.08em;color:var(--muted)}.support-invoice-parties strong{font-size:.82rem}.support-invoice-parties span{font-size:.65rem;color:var(--muted)}
.support-invoice-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;background:#f1f6f5;border-radius:10px;padding:10px;margin-bottom:14px}.support-invoice-meta>span{display:grid;gap:2px}.support-invoice-meta strong{font-size:.68rem;overflow-wrap:anywhere}
.support-invoice-preview-lines{border:1px solid var(--line);border-radius:10px;overflow:hidden}.support-invoice-preview-line{display:grid;grid-template-columns:minmax(0,2fr) .55fr .8fr .55fr .9fr;gap:7px;align-items:center;padding:8px 9px;border-top:1px solid var(--line);font-size:.62rem}.support-invoice-preview-line.head{border-top:0;background:#eef4f3;color:var(--muted);font-size:.52rem;font-weight:900;text-transform:uppercase;letter-spacing:.05em}.support-invoice-preview-line span:first-child{display:grid;gap:1px}.support-invoice-preview-line span:last-child{text-align:right}.support-invoice-preview-line small{color:var(--muted)}
.support-invoice-totals{display:grid;gap:2px;width:min(260px,100%);margin:13px 0 12px auto}.support-invoice-totals>span{display:flex;justify-content:space-between;gap:16px;padding:4px 0}.support-invoice-totals .grand{border-top:2px solid var(--ink);padding-top:7px}.support-invoice-totals .grand strong{font-size:1rem}
.support-invoice-notes,.support-invoice-payment{border-radius:9px;background:#f4f7f7;padding:9px 10px;margin-top:8px;font-size:.63rem}.support-invoice-notes p{margin:4px 0 0}.support-invoice-payment{display:grid;gap:4px;background:#e8f7f5}.support-invoice-payment strong{color:#087b72}.support-invoice-footer{text-align:center;color:var(--muted);font-size:.58rem;margin:16px 0 0}
@media(max-width:1000px){.support-invoice-crafter{grid-template-columns:1fr}.support-invoice-preview-wrap{position:static}.support-invoice-line{grid-template-columns:70px minmax(150px,1fr) 68px 82px 105px 76px 36px}}
@media(max-width:780px){.modal.invoice-modal{width:calc(100% - 12px)}.invoice-modal .modal-body{padding:13px;max-height:74vh}.support-invoice-section{padding:12px}.support-invoice-line{grid-template-columns:1fr 1fr;align-items:end}.support-invoice-use,.support-invoice-description{grid-column:1/-1}.support-invoice-remove{grid-column:2;justify-self:end}.support-invoice-document{padding:15px}.support-invoice-doc-head img{width:118px}.support-invoice-parties{grid-template-columns:1fr}.support-invoice-preview-line{grid-template-columns:minmax(0,1.7fr) .5fr .8fr .5fr .9fr;font-size:.56rem;padding:7px 6px}}

/* RC9.3.18 - optionele donkere modus en consistente ShiftKlaar highlights. */
.sk-appearance-card{overflow:hidden}
.sk-appearance-settings{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(135deg,rgba(0,173,156,.08),rgba(255,255,255,.72))}
.sk-appearance-copy{display:grid;gap:4px}.sk-appearance-copy strong{color:var(--ink);font-size:.92rem}.sk-appearance-copy span{color:var(--muted);font-size:.76rem;line-height:1.45}
.sk-theme-switch{display:inline-grid;grid-template-columns:1fr 1fr;gap:5px;padding:4px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2);min-width:190px}
.sk-theme-switch button{border:0;border-radius:9px;padding:10px 14px;background:transparent;color:var(--muted);font-weight:850}
.sk-theme-switch button.active{background:linear-gradient(135deg,#00b7a5,#087f73);color:#fff;box-shadow:0 8px 24px rgba(0,173,156,.24)}
.nav button.active,.nav a.active{background:linear-gradient(135deg,rgba(0,173,156,.24),rgba(0,173,156,.10));box-shadow:inset 3px 0 0 var(--teal-2);color:#fff}
.section-tabs button.active{background:linear-gradient(135deg,#073f46,#087f73);box-shadow:0 8px 18px rgba(0,173,156,.16)}
.button.primary{background:linear-gradient(135deg,#11c9b5,#008e83);box-shadow:0 10px 28px rgba(0,173,156,.24)}
.card:focus-within{border-color:rgba(0,173,156,.35)}

html[data-sk-theme="dark"]{
  color-scheme:dark;
  --ink:#f3f8fb;--ink-2:#d9e6ee;--ink-3:#a9bcc9;--bg:#081722;--surface:#0d2231;--surface-2:#132b3b;--line:#284457;--text:#eef5f8;--muted:#9fb2bf;
  --danger:#ff6b77;--danger-soft:#3a1c27;--warn:#f5b44d;--warn-soft:#362916;--success:#43d394;--success-soft:#15372b;--blue:#6ba7ff;--shadow:0 20px 55px rgba(0,0,0,.30);
}
html[data-sk-theme="dark"] body{background:radial-gradient(circle at 86% 8%,rgba(0,173,156,.08),transparent 24%),#081722;color:var(--text)}
html[data-sk-theme="dark"] .main{background:transparent}
html[data-sk-theme="dark"] .topbar{background:rgba(8,23,34,.90);border-bottom-color:#203a4c}
html[data-sk-theme="dark"] .topbar h1,html[data-sk-theme="dark"] .card-header h2,html[data-sk-theme="dark"] .card-header h3,html[data-sk-theme="dark"] .card h2,html[data-sk-theme="dark"] .card h3,html[data-sk-theme="dark"] .list-item h4,html[data-sk-theme="dark"] .data-table strong{color:var(--ink)}
html[data-sk-theme="dark"] .card,html[data-sk-theme="dark"] .list-item,html[data-sk-theme="dark"] .section-tabs,html[data-sk-theme="dark"] .modal,html[data-sk-theme="dark"] .auth-card{background:#0d2231;border-color:#284457;box-shadow:0 14px 36px rgba(0,0,0,.20)}
html[data-sk-theme="dark"] .field input,html[data-sk-theme="dark"] .field select,html[data-sk-theme="dark"] .field textarea,html[data-sk-theme="dark"] input,html[data-sk-theme="dark"] select,html[data-sk-theme="dark"] textarea{background:#102838;border-color:#315166;color:#eef5f8}
html[data-sk-theme="dark"] .button.ghost,html[data-sk-theme="dark"] .mobile-toggle{background:#112a3a;border-color:#315166;color:#eef5f8}
html[data-sk-theme="dark"] .data-table th{background:#122b3a;color:#9fb2bf}
html[data-sk-theme="dark"] .data-table td{border-top-color:#284457}
html[data-sk-theme="dark"] .data-table tr:hover td{background:#102838}
html[data-sk-theme="dark"] .table-wrap{border-color:#284457}
html[data-sk-theme="dark"] .segmented,html[data-sk-theme="dark"] .progress,html[data-sk-theme="dark"] .check-item-chip{background:#132b3b;border-color:#284457}
html[data-sk-theme="dark"] .check-item{background:#0d2231;border-color:#284457;color:#eef5f8}
html[data-sk-theme="dark"] .check-item:hover{background:#102838;border-color:#2a8f88}
html[data-sk-theme="dark"] .notice.info{background:#0f3134;border-color:#1c5556;color:#aee8df}
html[data-sk-theme="dark"] .notice.warn{background:#352817;border-color:#5c4420;color:#f0c779}
html[data-sk-theme="dark"] .notice.danger{background:#351c26;border-color:#5a2a38;color:#ff9ba3}
html[data-sk-theme="dark"] .badge.gray{background:#183244;color:#b6c6d0}
html[data-sk-theme="dark"] .sk-appearance-settings{background:linear-gradient(135deg,rgba(0,210,190,.12),rgba(13,34,49,.88));border-color:#315166}
html[data-sk-theme="dark"] .sk-theme-switch{background:#0a1d2a;border-color:#315166}
html[data-sk-theme="dark"] dialog.modal{background:#0d2231;color:#eef5f8}
html[data-sk-theme="dark"] .modal-head,html[data-sk-theme="dark"] .modal-actions{border-color:#284457;background:#0d2231}
html[data-sk-theme="dark"] .modal-body{background:#0d2231}
html[data-sk-theme="dark"] .bottom-nav,html[data-sk-theme="dark"] .personnel-bottom-nav{background:rgba(8,23,34,.96);border-color:#284457}
@media(max-width:700px){.sk-appearance-settings{align-items:stretch;flex-direction:column}.sk-theme-switch{width:100%;min-width:0}}

/* RC9.3.19 - dark-mode afronding + decoratieve icoontjes verwijderd. Alleen styling. */
/* Verwijder uitsluitend decoratieve icoonvakjes; functionele status-/actie-indicatoren blijven bestaan. */
.nav-icon,.mobile-nav-icon,.kpi-icon,.phase-icon,.planner-layout-choice-icon,.action-center-icon{display:none!important}
.nav button,.nav a{gap:7px}.mobile-nav-panel-list button{gap:8px}.kpi-top{justify-content:flex-start}

/* Beschikbaarheid / aanvragen: volledige dark-mode dekking, zonder lichte vlakken of harde lijnen. */
html[data-sk-theme="dark"] .request-template-switch{background:#0d2231;border-color:#223f52}
html[data-sk-theme="dark"] .request-month-toolbar strong{color:#f3f8fb}
html[data-sk-theme="dark"] .availability-month-scroll{background:#0b2130;border-color:#18384b;box-shadow:none}
html[data-sk-theme="dark"] .availability-month-days{background:#0e2637;border-bottom-color:#18384b}
html[data-sk-theme="dark"] .availability-month-days b{color:#91a9b8}
html[data-sk-theme="dark"] .availability-month-row{border-bottom-color:#173447}
html[data-sk-theme="dark"] .availability-month-person{background:#0c2232;border-right-color:#173447}
html[data-sk-theme="dark"] .availability-month-person strong{color:#eef6fa}
html[data-sk-theme="dark"] .availability-month-person small{color:#91a8b7}
html[data-sk-theme="dark"] .availability-month-cell{background:#122b3d;color:#8ea6b5;box-shadow:none}
html[data-sk-theme="dark"] .availability-month-cell.available{background:#12392f!important;color:#6fe0aa!important;border-color:transparent!important}
html[data-sk-theme="dark"] .availability-month-cell.unavailable{background:#3a2029!important;color:#ff8c96!important;border-color:transparent!important}
html[data-sk-theme="dark"] .availability-month-cell.pending{background:#3b301d!important;color:#f4bd58!important;border-color:transparent!important}
html[data-sk-theme="dark"] .availability-month-cell.rejected{background:#243442!important;color:#aebdca!important;border-color:transparent!important}
html[data-sk-theme="dark"] .availability-month-legend span{background:#102839;color:#c7d5de;border:0;box-shadow:none}
html[data-sk-theme="dark"] .availability-month-legend .available:before{background:#43d394}
html[data-sk-theme="dark"] .availability-month-legend .unavailable:before{background:#ff6b77}
html[data-sk-theme="dark"] .availability-month-legend .pending:before{background:#f5b44d}
html[data-sk-theme="dark"] .availability-month-legend .rejected:before{background:#8799a7}
html[data-sk-theme="dark"] .availability-month-legend .none:before{background:#506779}
html[data-sk-theme="dark"] .own-availability-month-cell{background:#102838;border-color:#23465a;color:#eef6fa}
html[data-sk-theme="dark"] .own-availability-month-cell span{color:#eef6fa}
html[data-sk-theme="dark"] .own-availability-month-cell small{color:#91a8b7}
html[data-sk-theme="dark"] .own-availability-month-cell.available{background:#12392f!important;border-color:#245441!important}
html[data-sk-theme="dark"] .own-availability-month-cell.unavailable{background:#3a2029!important;border-color:#5b2d37!important}
html[data-sk-theme="dark"] .own-availability-month-cell.pending{background:#3b301d!important;border-color:#5e4926!important}
html[data-sk-theme="dark"] .own-availability-month-cell.rejected{background:#243442!important;border-color:#344d60!important}
html[data-sk-theme="dark"] .availability-review-week{background:#0c2232;border-color:#203f52}
html[data-sk-theme="dark"] .availability-review-week>header{background:#0e2738;border-bottom-color:#203f52}
html[data-sk-theme="dark"] .availability-review-days{background:#0b2130}
html[data-sk-theme="dark"] .availability-review-day{background:#0d2434;border-right-color:#203f52}
html[data-sk-theme="dark"] .availability-review-summary span{background:#132d3e;color:#c1d2dc}
html[data-sk-theme="dark"] .availability-review-summary span.danger{background:#3a2029;color:#ff8993}
html[data-sk-theme="dark"] .availability-matrix-scroll,html[data-sk-theme="dark"] .availability-matrix-table,html[data-sk-theme="dark"] .availability-matrix-week{background:#0b2130;border-color:#203f52}
html[data-sk-theme="dark"] .availability-matrix-person,html[data-sk-theme="dark"] .availability-matrix-cell{background:#0d2434;border-color:#203f52;color:#eaf4f9}
html[data-sk-theme="dark"] .calm-availability-day,html[data-sk-theme="dark"] .calm-own-availability{background:#0d2434;border-color:#203f52}
html[data-sk-theme="dark"] .planner-availability-toggle{background:#102838;border-color:#294b60;color:#eaf4f9}

/* Overige legacy-onderdelen die nog hard wit waren in dark mode. */
html[data-sk-theme="dark"] .week-grid{border-color:#203f52}
html[data-sk-theme="dark"] .week-head{background:#102838;color:#f2f7fa}
html[data-sk-theme="dark"] .employee-cell{background:#0d2434;color:#eef6fa}
html[data-sk-theme="dark"] .cell-add{background:#102838;border-color:#315166;color:#44d9c5}
html[data-sk-theme="dark"] .stat-pill{background:#132d3e;color:#dce9ef}
html[data-sk-theme="dark"] .shift{background:#123a39;border-left-color:#24d2bc;color:#eef8f6}
html[data-sk-theme="dark"] .shift.open{background:#172d3c;border-left-color:#688092}
html[data-sk-theme="dark"] .manager-closing-row,html[data-sk-theme="dark"] .closing-manage-row{background:#0d2434;border-color:#203f52}
html[data-sk-theme="dark"] .manager-closing-row:hover{background:#102a3b;border-color:#2a776f}
html[data-sk-theme="dark"] .manager-closing-row.done,html[data-sk-theme="dark"] .closing-check-card.done{background:#113329!important;border-color:#24503f!important}
html[data-sk-theme="dark"] .manager-closing-box,html[data-sk-theme="dark"] .closing-check-card input[type=checkbox]{background:#102838;border-color:#365a70}
html[data-sk-theme="dark"] .closing-manage-row.inactive{background:#102331}
html[data-sk-theme="dark"] .employee-table tbody tr{background:#0d2434;border-color:#203f52}
html[data-sk-theme="dark"] .employee-table .employee-actions-cell{background:#0d2434}
html[data-sk-theme="dark"] .employee-table thead th:last-child{background:#122b3a}
html[data-sk-theme="dark"] .learning-quiz-card,html[data-sk-theme="dark"] .quiz-question,html[data-sk-theme="dark"] .quiz-answer span{background:#0d2434;border-color:#203f52}
html[data-sk-theme="dark"] .quiz-answer input:checked+span{background:#10332f;border-color:#19bda9}
html[data-sk-theme="dark"] .quiz-answer b{background:#173447;color:#d8e6ed}

/* Geen felle randlijnen rond donkere kaarten: contrast komt uit vlak en highlight. */
html[data-sk-theme="dark"] .card,html[data-sk-theme="dark"] .list-item,html[data-sk-theme="dark"] .table-wrap{box-shadow:0 12px 30px rgba(0,0,0,.16)}
html[data-sk-theme="dark"] .card:focus-within{border-color:#2a596b}

/* RC9.3.20 - professional polish only: no functional changes. */
/* Consistent interaction states */
.button,.nav button,.nav a,.section-tab,.status-filter,.mobile-bottom-nav button,.mobile-nav-panel-list button,.text-button,.icon-button,.employee-name-link,.support-ticket-card,.planner-layout-choice,.availability-review-day-actions button,.calm-request-summary>span{
  transition:background-color .14s ease,border-color .14s ease,color .14s ease,box-shadow .14s ease,transform .14s ease;
}
.button:not(:disabled):hover,.nav button:hover,.nav a:hover,.section-tab:hover,.status-filter:hover,.mobile-nav-panel-list button:hover{
  border-color:rgba(0,173,156,.42);
  box-shadow:0 0 0 3px rgba(0,173,156,.08);
}
.button.primary:not(:disabled):hover{background:linear-gradient(135deg,#18d4bf,#00867b);box-shadow:0 10px 24px rgba(0,173,156,.22)}
.button.ghost:not(:disabled):hover{background:#f1faf8;color:#08796f}
.button.danger:not(:disabled):hover{filter:brightness(.96)}

/* Decorative icon containers are intentionally suppressed. Functional status dots, badges and controls remain. */
.nav-icon,.mobile-nav-icon,.kpi-icon,.phase-icon,.planner-layout-choice-icon,.action-center-icon,.floor-task-icon,.metric-icon,.section-icon,.card-icon,.quick-action-icon{display:none!important}
.nav button,.nav a,.mobile-nav-panel-list button,.kpi-top,.planner-layout-choice{gap:8px}

/* Light mode: calmer borders and surfaces. */
.card,.list-item,.table-wrap,.calm-request-summary>span,.availability-review-week,.availability-month-scroll{border-color:#e2eaec;box-shadow:0 8px 24px rgba(15,29,42,.045)}
.data-table th,.employee-table thead th{background:#f5f8f9}
.data-table tr:hover td,.employee-table tbody tr:hover td{background:#f4fbf9}

/* DARK MODE: one coherent surface system across every portal. */
html[data-sk-theme="dark"] body{background:#081722;color:#eef5f8}
html[data-sk-theme="dark"] .sidebar,html[data-sk-theme="dark"] .topbar,html[data-sk-theme="dark"] .mobile-bottom-nav,html[data-sk-theme="dark"] .personnel-bottom-nav,html[data-sk-theme="dark"] .mobile-nav-panel,html[data-sk-theme="dark"] .mobile-nav-panel-head{background:#091b28!important;border-color:#1e394a!important;color:#eef5f8!important}
html[data-sk-theme="dark"] .main,html[data-sk-theme="dark"] .page,html[data-sk-theme="dark"] .content{background:transparent!important}
html[data-sk-theme="dark"] .card,html[data-sk-theme="dark"] .list-item,html[data-sk-theme="dark"] .table-wrap,html[data-sk-theme="dark"] .kpi,html[data-sk-theme="dark"] .summary-card,html[data-sk-theme="dark"] .metric-card,html[data-sk-theme="dark"] .dashboard-card,html[data-sk-theme="dark"] .calm-request-summary>span,html[data-sk-theme="dark"] .request-template-switch,html[data-sk-theme="dark"] .availability-review-week,html[data-sk-theme="dark"] .availability-month-scroll,html[data-sk-theme="dark"] .availability-matrix-scroll,html[data-sk-theme="dark"] .availability-matrix-table,html[data-sk-theme="dark"] .availability-matrix-week,html[data-sk-theme="dark"] .employee-table tbody tr,html[data-sk-theme="dark"] .support-ticket-card,html[data-sk-theme="dark"] .review-card,html[data-sk-theme="dark"] .personnel-hour-row,html[data-sk-theme="dark"] .personnel-news-card,html[data-sk-theme="dark"] .personnel-review-action,html[data-sk-theme="dark"] .operation-task-row,html[data-sk-theme="dark"] .learning-foundation section,html[data-sk-theme="dark"] .learning-step,html[data-sk-theme="dark"] .planner-layout-choice{
  background:#0d2231!important;border-color:#203f52!important;color:#eef5f8!important;box-shadow:0 10px 28px rgba(0,0,0,.16)!important;
}
html[data-sk-theme="dark"] .calm-request-summary small,html[data-sk-theme="dark"] .calm-request-summary strong{color:#d7e5ec!important}
html[data-sk-theme="dark"] .calm-request-summary small{color:#90a7b5!important}
html[data-sk-theme="dark"] .card-header,html[data-sk-theme="dark"] .modal-head,html[data-sk-theme="dark"] .modal-actions{border-color:#203f52!important}
html[data-sk-theme="dark"] .card-header h1,html[data-sk-theme="dark"] .card-header h2,html[data-sk-theme="dark"] .card-header h3,html[data-sk-theme="dark"] .card h1,html[data-sk-theme="dark"] .card h2,html[data-sk-theme="dark"] .card h3,html[data-sk-theme="dark"] .topbar h1,html[data-sk-theme="dark"] .employee-table strong,html[data-sk-theme="dark"] .calm-request-summary strong{color:#f3f8fb!important}
html[data-sk-theme="dark"] p,html[data-sk-theme="dark"] small,html[data-sk-theme="dark"] .muted{color:#9fb2bf}

/* Tables and grids: eliminate white headers/cells and hard grey lines. */
html[data-sk-theme="dark"] .data-table,html[data-sk-theme="dark"] .employee-table,html[data-sk-theme="dark"] .calm-planner-table,html[data-sk-theme="dark"] table{background:#0b1f2d;color:#eaf3f7}
html[data-sk-theme="dark"] .data-table th,html[data-sk-theme="dark"] .employee-table thead th,html[data-sk-theme="dark"] .calm-planner-table th,html[data-sk-theme="dark"] table thead th{background:#102838!important;color:#9fb2bf!important;border-color:#203f52!important}
html[data-sk-theme="dark"] .data-table td,html[data-sk-theme="dark"] .employee-table td,html[data-sk-theme="dark"] .calm-planner-table td,html[data-sk-theme="dark"] table td{background:#0d2231;color:#eaf3f7;border-color:#203f52!important}
html[data-sk-theme="dark"] .data-table tr:hover td,html[data-sk-theme="dark"] .employee-table tbody tr:hover td,html[data-sk-theme="dark"] .calm-planner-table tbody tr:hover td{background:#102b3b!important}
html[data-sk-theme="dark"] .employee-cell,html[data-sk-theme="dark"] .availability-matrix-person,html[data-sk-theme="dark"] .availability-matrix-cell{background:#0d2231!important;border-color:#203f52!important;color:#eef5f8!important}
html[data-sk-theme="dark"] .availability-review-week>header,html[data-sk-theme="dark"] .availability-review-days{background:#0c2232!important;border-color:#203f52!important}
html[data-sk-theme="dark"] .availability-review-day{background:#0d2434!important;border-color:#203f52!important;color:#eef5f8!important}
html[data-sk-theme="dark"] .availability-review-day.available{background:#113329!important}
html[data-sk-theme="dark"] .availability-review-day.unavailable{background:#321d27!important}
html[data-sk-theme="dark"] .availability-review-day.pending{background:#352817!important}
html[data-sk-theme="dark"] .availability-review-day.rejected,html[data-sk-theme="dark"] .availability-review-day.empty-day{background:#132938!important}

/* Inputs and segmented controls. */
html[data-sk-theme="dark"] input,html[data-sk-theme="dark"] select,html[data-sk-theme="dark"] textarea,html[data-sk-theme="dark"] .segmented,html[data-sk-theme="dark"] .section-tabs,html[data-sk-theme="dark"] .status-filter,html[data-sk-theme="dark"] .sk-theme-switch{background:#102838!important;border-color:#2b4c60!important;color:#eef5f8!important}
html[data-sk-theme="dark"] input::placeholder,html[data-sk-theme="dark"] textarea::placeholder{color:#78909f}
html[data-sk-theme="dark"] .section-tab:hover,html[data-sk-theme="dark"] .status-filter:hover,html[data-sk-theme="dark"] .button.ghost:hover,html[data-sk-theme="dark"] .mobile-nav-panel-list button:hover{background:#123144!important;border-color:#2d776f!important;color:#64e1d1!important;box-shadow:0 0 0 3px rgba(0,173,156,.10)!important}
html[data-sk-theme="dark"] .section-tab.active,html[data-sk-theme="dark"] .status-filter.active,html[data-sk-theme="dark"] .mobile-bottom-nav button.active,html[data-sk-theme="dark"] .mobile-bottom-nav button[aria-expanded="true"],html[data-sk-theme="dark"] .mobile-nav-panel-list button.active{background:linear-gradient(135deg,#0a6d66,#0a9488)!important;color:#fff!important;border-color:#18bbaa!important;box-shadow:none!important}
html[data-sk-theme="dark"] .button.ghost{background:#102838!important;border-color:#2b4c60!important;color:#eaf3f7!important}
html[data-sk-theme="dark"] .button.danger{background:#a83f4d!important;color:#fff!important;border-color:#c65563!important}

/* Personnel mobile portal: header and fixed nav must follow dark mode too. */
@media(max-width:760px){
  html[data-sk-theme="dark"] .topbar,html[data-sk-theme="dark"] .mobile-bottom-nav{background:rgba(8,23,34,.98)!important;border-color:#203f52!important;box-shadow:0 -7px 22px rgba(0,0,0,.18)!important}
  html[data-sk-theme="dark"] .mobile-bottom-nav button{color:#89a0ae!important;background:transparent!important}
  html[data-sk-theme="dark"] .mobile-bottom-nav button.active,html[data-sk-theme="dark"] .mobile-bottom-nav button[aria-expanded="true"]{background:#103934!important;color:#63dbc9!important}
  html[data-sk-theme="dark"] .mobile-nav-panel,html[data-sk-theme="dark"] .mobile-nav-panel-head{background:#0b1f2d!important;border-color:#203f52!important}
  html[data-sk-theme="dark"] .mobile-nav-panel-list button{color:#d9e6ee!important;background:transparent!important}
  html[data-sk-theme="dark"] .mobile-nav-panel-list button:hover,html[data-sk-theme="dark"] .mobile-nav-panel-list button.active{background:#103934!important;color:#63dbc9!important}
  html[data-sk-theme="dark"] .mobile-nav-group{color:#78909f!important}
}

/* Professional hover state for clickable rows/cards, without layout movement. */
html[data-sk-theme="dark"] .support-ticket-card:hover,html[data-sk-theme="dark"] .personnel-news-card:hover,html[data-sk-theme="dark"] .planner-layout-choice:hover,html[data-sk-theme="dark"] .operation-task-row.personnel:hover{background:#102b3b!important;border-color:#2a6b66!important;box-shadow:0 0 0 3px rgba(0,173,156,.08)!important;transform:none!important}

/* Scrollbars match dark surfaces instead of creating bright horizontal bands. */
html[data-sk-theme="dark"] *{scrollbar-color:#39586a #0b1f2d}
html[data-sk-theme="dark"] *::-webkit-scrollbar{width:10px;height:10px}
html[data-sk-theme="dark"] *::-webkit-scrollbar-track{background:#0b1f2d}
html[data-sk-theme="dark"] *::-webkit-scrollbar-thumb{background:#39586a;border:2px solid #0b1f2d;border-radius:999px}
html[data-sk-theme="dark"] *::-webkit-scrollbar-thumb:hover{background:#477084}

/* ================================================================
   ShiftKlaar RC9.3.21 — consumentvriendelijke vereenvoudiging
   Functies blijven beschikbaar; dagelijkse acties krijgen prioriteit.
   ================================================================ */
:root{
  --sk-soft-shadow:0 6px 20px rgba(15,29,42,.045);
  --sk-hover-shadow:0 8px 26px rgba(15,29,42,.07);
}

/* Rustiger basisritme: minder dashboardgevoel, meer appgevoel. */
.card{box-shadow:var(--sk-soft-shadow);border-color:#e2eaec}
.card.pad{padding:15px 16px}
.card-header{margin-bottom:12px;gap:12px}
.card-header h2,.card-header h3{font-size:1rem;line-height:1.25}
.card-header p{font-size:.72rem;line-height:1.45;max-width:72ch}
.page{gap:13px}
.content{padding-top:13px}
.button{min-height:38px;border-radius:10px;padding:8px 12px}
.button.small{min-height:32px;padding:6px 9px}
.button.ghost{box-shadow:none;background:#fff}
.button.ghost:not(:disabled):hover{background:#f5faf9;box-shadow:none;transform:none}
.button.primary:not(:disabled):hover,.button.soft:not(:disabled):hover{transform:none}

/* Navigatie: tekst is leidend, groepslabels zijn rustig en scanbaar. */
.app-shell{grid-template-columns:208px minmax(0,1fr)}
.sidebar{padding:15px 11px}
.sidebar-logo{padding:4px 8px 15px}
.sidebar-logo img{width:34px}
.nav{gap:2px}
.nav-group{margin:12px 9px 4px!important;font-size:.58rem!important;letter-spacing:.09em!important;color:rgba(255,255,255,.36)!important}
.nav button,.nav a{min-height:36px;padding:8px 10px;border-radius:9px;font-size:.76rem;font-weight:720}
.nav button.active,.nav a.active{background:rgba(0,173,156,.14)!important;box-shadow:inset 2px 0 0 var(--teal-2)!important}
.sidebar-bottom{padding:8px 7px}
.sidebar-actions{gap:5px}.sidebar-actions button{padding:7px 6px;font-size:.67rem}
.topbar{min-height:68px;padding:10px clamp(14px,2vw,25px)}
.topbar h1{font-size:clamp(1.28rem,1.6vw,1.65rem)}
.topbar-title{min-width:0}.topbar-title .eyebrow:empty,.topbar-title .eyebrow[hidden]{display:none!important}
.content{padding-left:clamp(14px,2vw,25px);padding-right:clamp(14px,2vw,25px)}

/* Bovenbalk: één hoofdactie zichtbaar, incidentele acties onder Meer. */
.top-actions{gap:7px;position:relative;flex-wrap:nowrap}
.sk-action-menu,.sk-row-menu{position:relative;display:inline-block}
.sk-action-menu>summary,.sk-row-menu>summary{list-style:none;display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);font-size:.78rem;font-weight:800;cursor:pointer;user-select:none}
.sk-row-menu>summary{min-height:32px;padding:6px 9px;font-size:.72rem}
.sk-action-menu>summary::-webkit-details-marker,.sk-row-menu>summary::-webkit-details-marker{display:none}
.sk-action-menu>summary::after,.sk-row-menu>summary::after{content:'⌄';font-size:.7rem;margin-left:7px;color:var(--muted)}
.sk-action-menu[open]>summary,.sk-row-menu[open]>summary{border-color:#b9dcd8;background:#f5fbfa;color:#08776d}
.sk-action-menu-panel,.sk-row-menu-panel{position:absolute;right:0;top:calc(100% + 7px);z-index:60;display:grid;gap:5px;min-width:210px;padding:7px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 16px 42px rgba(15,29,42,.15)}
.sk-row-menu-panel{min-width:190px;z-index:45}
.sk-action-menu-panel .button,.sk-row-menu-panel .button{width:100%;justify-content:flex-start;background:#fff;border:0;box-shadow:none;text-align:left}
.sk-action-menu-panel .button:hover,.sk-row-menu-panel .button:hover{background:#f3f8f8}
.sk-action-menu-panel .button.danger,.sk-row-menu-panel .button.danger{background:#fff;color:var(--danger)}

/* KPI's zijn voortaan compacte informatie, geen vier dominante tegels. */
.kpi-grid{gap:8px}
.kpi{min-height:82px;padding:11px 13px;box-shadow:none;background:#fff}
.kpi-top{min-height:0}.kpi-label{font-size:.67rem;font-weight:800}
.kpi-value{font-size:1.25rem;margin-top:8px;letter-spacing:-.03em}
.kpi-note{font-size:.62rem;line-height:1.35}

/* Nieuwe compacte samenvattingsstrip voor schermen met veel beheerinformatie. */
.sk-summary-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid #e1e9eb;border-radius:13px;background:#fff;overflow:hidden;box-shadow:var(--sk-soft-shadow)}
.sk-summary-strip>span{display:grid;gap:3px;padding:12px 14px;border-right:1px solid #e8eef0;min-width:0}
.sk-summary-strip>span:last-child{border-right:0}
.sk-summary-strip small{font-size:.63rem;color:var(--muted);font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-summary-strip strong{font-size:1.08rem;color:var(--ink);letter-spacing:-.025em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-summary-strip .needs-attention{background:#fffaf2}.sk-summary-strip .needs-attention strong{color:var(--warn)}
.sk-summary-strip .is-good{background:#f7fcfa}.sk-summary-strip .is-good strong{color:var(--success)}

/* Medewerkers: zoek eerst, filter alleen als nodig; acties in twee lagen. */
.employee-management-page{gap:12px}
.employee-directory-card{overflow:visible}
.employee-search-toolbar{display:grid!important;grid-template-columns:minmax(240px,1fr) auto;align-items:end;gap:9px!important;padding:0!important;background:transparent!important;border:0!important}
.employee-search-toolbar .sk-search-field{min-width:0}
.sk-filter-toggle{align-self:end}
.sk-filter-toggle span{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--teal);color:#fff;font-size:.58rem}
.sk-filter-fields{grid-column:1/-1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:10px;border:1px solid #e3ebec;border-radius:11px;background:#f7f9f9}
.sk-filter-fields[hidden]{display:none!important}
.sk-filter-fields .field{gap:5px}.sk-filter-fields .field label{font-size:.67rem}.sk-filter-fields .field select{padding:8px 9px;font-size:.76rem}
.search-result-count{margin:9px 0 7px!important;color:var(--muted);font-size:.68rem;font-weight:700}
.employee-table-wrap{border:1px solid #e2eaec!important;border-radius:12px!important;overflow:visible!important}
.employee-table{table-layout:fixed;min-width:0!important}
.employee-table th:nth-child(1){width:31%}.employee-table th:nth-child(2){width:17%}.employee-table th:nth-child(3){width:19%}.employee-table th:nth-child(4){width:18%}.employee-table th:nth-child(5){width:15%}
.employee-table th{padding:9px 10px!important;font-size:.59rem!important;background:#f6f8f9!important}
.employee-table td{padding:10px!important;font-size:.77rem!important;vertical-align:middle!important}
.employee-table tbody tr:hover td{background:#f9fcfb!important}
.employee-name-link{display:grid!important;gap:2px;text-decoration:none}.employee-name-link strong{font-size:.83rem}.employee-name-link span{font-size:.57rem!important;color:#16877d!important;opacity:0;transition:opacity .14s ease}.employee-table tr:hover .employee-name-link span,.employee-name-link:focus-visible span{opacity:1}
.employee-role-line,.employee-meta-line{margin-top:4px!important;font-size:.64rem!important;gap:5px!important}
.employee-meta-line .badge{padding:3px 6px;font-size:.58rem}.employee-meta-line small{font-size:.6rem!important}
.employee-simple-status{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.employee-simple-status .button{min-height:28px;padding:5px 7px;font-size:.67rem}
.employee-actions-cell{overflow:visible!important}
.employee-row-actions{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:5px!important;width:auto!important}
.employee-row-actions>.button{width:auto!important;white-space:nowrap!important}
.employee-row-actions .sk-row-menu{width:auto!important}
.employee-pin-status,.employee-inline-actions{margin:0!important}

/* Uren & payroll: beoordelen is hoofdtaak; controles blijven compact. */
.payroll-controls{padding-bottom:13px!important}
.payroll-controls .card-header{margin-bottom:8px}
.hours-period-nav{gap:7px!important;align-items:center!important}
.hours-period-nav select,.hours-period-nav input{min-height:36px!important}
.hours-person-filter{margin-top:8px!important;padding-top:8px!important;border-top:1px solid #edf1f2}
.hours-person-filter small{font-size:.63rem}
.hours-review-table .row-actions{display:flex!important;align-items:center!important;gap:5px!important;flex-wrap:nowrap!important}
.hours-review-table .row-actions>.button{width:auto!important;white-space:nowrap!important}
.status-filter-row{gap:5px!important;margin-bottom:10px!important;overflow-x:auto;scrollbar-width:none}
.status-filter{min-height:32px!important;padding:6px 9px!important;font-size:.68rem!important;white-space:nowrap}

/* Tabellen: koppen en acties minder dominant, kerninformatie beter scanbaar. */
.table-wrap{box-shadow:none}
.data-table th{padding:9px 10px;font-size:.6rem;letter-spacing:.045em;background:#f6f8f9}
.data-table td{padding:10px;font-size:.77rem}
.data-table .badge{font-size:.6rem;padding:4px 7px}

/* Sectietabs en kleine keuzebalken voelen als navigatie in plaats van losse knoppen. */
.section-tabs{padding:3px;gap:3px;border-radius:11px;box-shadow:none}
.section-tabs button{min-height:32px;padding:6px 9px;font-size:.67rem}
.section-tabs button.active{background:#0c4c50!important;box-shadow:none!important}

/* Minder permanente uitleg: notices en hulpteksten zijn compact, waarschuwingen blijven zichtbaar. */
.notice{padding:10px 12px;font-size:.72rem;border-radius:11px}
.notice strong{margin-bottom:1px}
.help,.field small{font-size:.66rem}

/* Planning: primaire actie is Nieuwe dienst; beheeropties zitten via de topbar onder Meer. */
.calm-planner-overview{box-shadow:var(--sk-soft-shadow)!important}
.calm-planner-overview-main,.calm-planner-overview-actions{gap:9px!important}
.calm-planner-metrics span{padding:7px 9px!important}
.calm-planner-metrics small{font-size:.56rem!important}.calm-planner-metrics strong{font-size:.8rem!important}
.calm-planner-subbar{padding:7px 9px!important}.calm-planner-hints{font-size:.59rem!important}

/* Personeelsportaal: dagelijkse acties eerst, minder tegelgevoel. */
body[data-portal="Personeelsportaal"] .card{box-shadow:var(--sk-soft-shadow)}
body[data-portal="Personeelsportaal"] .quick-actions-grid,
body[data-portal="Personeelsportaal"] .personnel-action-grid{gap:8px!important}
body[data-portal="Personeelsportaal"] .topbar{min-height:64px}
body[data-portal="Personeelsportaal"] .topbar h1{font-size:1.18rem}

/* Supportportaal deelt dezelfde actiehiërarchie, zonder functionaliteit te verbergen. */
body[data-portal="Supportportaal"] .kpi{min-height:80px}
body[data-portal="Supportportaal"] .support-company{gap:8px}

/* Mobiel/tablet: alles blijft één kolom en Meer-menu's blijven binnen beeld. */
@media(max-width:1180px){
  .app-shell{grid-template-columns:194px minmax(0,1fr)}
  .sk-filter-fields{grid-template-columns:repeat(3,minmax(0,1fr))}
  .employee-table th:nth-child(n){width:auto}
}
@media(max-width:780px){
  .topbar{min-height:62px}.content{padding-top:10px}.card.pad{padding:12px}.page{gap:10px}
  .top-actions{max-width:none!important;overflow:visible!important}
  .sk-action-menu-panel{position:fixed;right:12px;top:64px;min-width:min(260px,calc(100vw - 24px))}
  .sk-summary-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sk-summary-strip>span:nth-child(2){border-right:0}.sk-summary-strip>span:nth-child(-n+2){border-bottom:1px solid #e8eef0}
  .employee-search-toolbar{grid-template-columns:minmax(0,1fr) auto!important}
  .sk-filter-fields{grid-template-columns:1fr 1fr}
  .employee-table-wrap{border:0!important}
  .employee-row-actions{justify-content:flex-start!important}
  .employee-name-link span{opacity:1}
  .sk-row-menu-panel{position:fixed;right:12px;left:12px;top:auto;bottom:calc(82px + env(safe-area-inset-bottom));min-width:0;max-height:55vh;overflow:auto}
  .kpi{min-height:74px;padding:10px 11px}.kpi-value{font-size:1.15rem}
}
@media(max-width:520px){
  .sk-summary-strip{grid-template-columns:1fr 1fr}
  .sk-summary-strip>span{padding:10px 11px}
  .sk-summary-strip strong{font-size:.98rem}
  .sk-filter-fields{grid-template-columns:1fr}
  .employee-search-toolbar{grid-template-columns:1fr!important}
  .sk-filter-toggle{width:100%}
  .top-actions .button.primary{max-width:56vw;white-space:normal;text-align:center}
}

/* Progressive disclosure: incidentele inrichting is één klik verder, nooit verwijderd. */
.sk-disclosure-card{padding:0!important;overflow:visible!important}
.sk-disclosure-card>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;padding:14px 16px;cursor:pointer;user-select:none;border-radius:13px;transition:background-color .14s ease}
.sk-disclosure-card>summary::-webkit-details-marker{display:none}
.sk-disclosure-card>summary:hover{background:#f8fbfb}
.sk-disclosure-card>summary>div{display:grid;gap:3px;min-width:0}
.sk-disclosure-card>summary strong{font-size:.88rem;color:var(--ink)}
.sk-disclosure-card>summary small{font-size:.65rem;color:var(--muted);line-height:1.4;font-weight:650}
.sk-disclosure-card>summary>span{flex:0 0 auto;font-size:.68rem;font-weight:850;color:#08776d}
.sk-disclosure-card>summary>span::after{content:'⌄';display:inline-block;margin-left:7px;transition:transform .14s ease}
.sk-disclosure-card[open]>summary{border-bottom-left-radius:0;border-bottom-right-radius:0;background:#f8fbfb}
.sk-disclosure-card[open]>summary>span::after{transform:rotate(180deg)}
.sk-disclosure-content{padding:14px 16px 16px;border-top:1px solid #edf1f2}
.sk-inline-disclosure{margin-top:9px;border:1px solid #e4ebed;border-radius:11px;background:#fbfcfc}
.sk-inline-disclosure>summary{list-style:none;cursor:pointer;padding:9px 11px;font-size:.7rem;font-weight:850;color:#49616b}
.sk-inline-disclosure>summary::-webkit-details-marker{display:none}
.sk-inline-disclosure>summary::after{content:'⌄';float:right;color:#7b9099}
.sk-inline-disclosure[open]>summary::after{transform:rotate(180deg)}
.sk-inline-disclosure .sk-inline-disclosure-content{padding:10px 11px;border-top:1px solid #e8edef}

/* Dashboard: eerst beslissen en handelen, trends pas daarna. */
.dashboard-priority-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:12px}
.dashboard-priority-grid>.card{min-width:0}
.dashboard-insight-disclosure .dashboard-grid,.dashboard-insight-disclosure .cockpit-grid-main{margin-top:0}
.dashboard-insight-disclosure .sk-disclosure-content{padding-top:12px}

/* Aanvragen: compacte status bovenaan, actieknoppen niet permanent allemaal zichtbaar. */
.calm-request-topline{display:grid!important;gap:10px!important}
.calm-request-summary{width:100%;margin:0!important}
.request-row-actions{display:flex!important;align-items:center!important;gap:5px!important;overflow:visible!important}
.request-row-actions>.button{white-space:nowrap}

/* HACCP / sluitlijsten: dagelijks werk zichtbaar, inrichting op de achtergrond. */
.haccp-manager-page .haccp-setup-disclosure,.manager-closing-page .manager-closing-manage{margin-top:0}
.haccp-setup-disclosure .template-grid{margin-top:0}
.haccp-template-actions{display:flex;align-items:center;gap:5px;overflow:visible}
.haccp-filter-card .haccp-filter-grid{margin-top:0}
.haccp-archive-summary{margin-top:0}
.closing-manage-row>.toolbar{overflow:visible}

/* Dagafsluiting: goedkeuren is de zichtbare beslissing; correctie/afwijzen onder Meer. */
.day-close-review-actions{display:flex!important;align-items:center!important;gap:5px!important;overflow:visible!important;flex-wrap:nowrap!important}
.day-close-review-actions>.button{white-space:nowrap}
.day-close-summary{box-shadow:var(--sk-soft-shadow)!important}

/* iPad-beheer: technische uitleg en uitzonderingen blijven secundair. */
.ipad-manager-page .ipad-pin-table .row-actions{display:flex;align-items:center;gap:5px;justify-content:flex-end;overflow:visible}
.ipad-manager-page .sk-disclosure-card{margin-top:0}

/* Instellingen: dagelijkse bedrijfsgegevens boven technische locatiebeveiliging. */
.settings-page .sk-inline-disclosure{grid-column:1/-1}

@media(max-width:980px){
  .dashboard-priority-grid{grid-template-columns:1fr}
}
@media(max-width:780px){
  .sk-disclosure-card>summary{min-height:58px;padding:12px}
  .sk-disclosure-card>summary>small{white-space:normal}
  .sk-disclosure-content{padding:12px}
  .calm-request-topline{display:grid!important}
  .day-close-review-actions{justify-content:flex-start!important}
}

/* ==================================================================
   Planningvariant: Teamweek
   Extra weekweergave; bestaande planninglayouts blijven ongewijzigd.
   ================================================================== */
.staff-week-overview .planner-week-state strong{font-size:.76rem}
.staff-week-planner{border:1px solid #dfe6e8;border-radius:10px;background:#fff;overflow:hidden}
.staff-week-subbar{min-height:48px;padding:7px 9px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #e3e9eb;background:#fafbfb}
.staff-week-search{display:flex;align-items:center;gap:7px;min-width:240px}
.staff-week-search label{font-size:.62rem;font-weight:800;color:#6f7e85}
.staff-week-search input{width:245px;height:33px;border:1px solid #d8e1e4;border-radius:7px;background:#fff;color:#263740;padding:0 9px;font-size:.72rem;outline:none}
.staff-week-search input:focus{border-color:#8fb7b1;box-shadow:0 0 0 2px rgba(47,123,98,.08)}
.staff-week-legend{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;color:#74828a;font-size:.59rem;font-weight:700}
.staff-week-legend>span{display:inline-flex;align-items:center;gap:5px}
.staff-week-publication{display:inline-flex;align-items:center;min-height:24px;padding:0 8px;border:1px solid #d7e0e2;border-radius:999px;background:#fff;color:#65767d;font-size:.58rem;font-weight:850}
.staff-week-publication.online{border-color:#bcded2;background:#f2faf7;color:#2f755f}
.staff-week-publication.partial{border-color:#ead7b8;background:#fffaf1;color:#8a632c}
.staff-week-scroll{overflow:auto;max-height:calc(100vh - 325px);min-height:380px;background:#fff;scrollbar-gutter:stable}
.staff-week-table{width:100%;min-width:1050px;border-collapse:separate;border-spacing:0;table-layout:fixed;color:#283840}
.staff-week-table th,.staff-week-table td{border-right:1px solid #e5eaec;border-bottom:1px solid #e5eaec;vertical-align:top}
.staff-week-table tr>*:last-child{border-right:0}
.staff-week-table thead th{position:sticky;top:0;z-index:8;height:54px;padding:8px 6px;background:#f7f9fa;text-align:center}
.staff-week-person-head{left:0;z-index:11!important;width:180px;text-align:left!important;padding-left:11px!important}
.staff-week-person-head span{font-size:.64rem;color:#53636b;font-weight:850}
.staff-week-day-head span,.staff-week-day-head strong{display:block}
.staff-week-day-head span{font-size:.56rem;text-transform:uppercase;letter-spacing:.05em;color:#78878d;font-weight:800}
.staff-week-day-head strong{margin-top:2px;font-size:.72rem;color:#283941}
.staff-week-day-head.today{background:#edf6f3}
.staff-week-day-head.today strong{color:#2f755f}
.staff-week-total-head{right:0;z-index:11!important;width:76px;background:#f1f5f5!important;color:#4f6068!important;font-size:.6rem;text-transform:uppercase;letter-spacing:.04em}
.staff-week-person{position:sticky;left:0;z-index:5;width:180px;padding:8px 10px;background:#fff;text-align:left}
.staff-week-person-copy{display:grid;gap:2px;min-width:0}
.staff-week-person-copy strong,.staff-week-person-copy small,.staff-week-person-copy span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.staff-week-person-copy strong{font-size:.68rem;color:#283942}
.staff-week-person-copy small{font-size:.55rem;color:#6f7e85;font-weight:650}
.staff-week-person-copy span{font-size:.49rem;color:#95a0a5;font-weight:650}
.staff-week-cell{position:relative;height:76px;min-height:76px;padding:4px 4px 20px;background:#fff}
.staff-week-person-row:hover .staff-week-person,.staff-week-person-row:hover .staff-week-cell,.staff-week-person-row:hover .staff-week-total{background:#fbfcfc}
.staff-week-cell.available{background:#fbfefc}
.staff-week-cell.unavailable{background:#fdfafa}
.staff-week-cell.leave{background:#fcfaf6}
.staff-week-cell.drag-over{background:#edf7f4!important;box-shadow:inset 0 0 0 2px #79a99b}
.staff-week-cell-stack{display:grid;gap:3px}
.staff-week-status{display:block;max-width:100%;padding:2px 4px;border-radius:4px;background:#f1f4f5;color:#708087;font-size:.45rem;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.staff-week-status.available{background:#edf6f2;color:#39725e}
.staff-week-status.unavailable{background:#f7eeee;color:#8b5757}
.staff-week-status.leave{background:#f6f0e8;color:#7d633d}
.staff-week-shift{position:relative;display:block;width:100%;min-width:0;padding:5px 16px 5px 6px;border:1px solid #d9e3e5;border-left:3px solid #4b8f81;border-radius:6px;background:#fff;color:#263740;text-align:left;box-shadow:none;cursor:pointer}
.staff-week-shift:hover{border-color:#a8ceca;background:#f7fbfa}
.staff-week-shift.draft{border-left-color:#c9903d;background:#fffaf3}
.staff-week-shift.open{border-left-color:#8e9ba1;background:#f7f9fa}
.staff-week-shift.conflict{border-left-color:#b05f5f;background:#fff7f7}
.staff-week-shift strong,.staff-week-shift small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.staff-week-shift strong{font-size:.61rem;line-height:1.2;font-variant-numeric:tabular-nums}
.staff-week-shift small{margin-top:2px;color:#73828a;font-size:.48rem;font-weight:650}
.staff-week-shift .shift-state-dot{position:absolute;right:5px;top:6px;width:5px;height:5px}
.staff-week-response-count{position:absolute;right:4px;bottom:4px;display:grid;place-items:center;min-width:16px;height:16px;padding:0 4px;border-radius:9px;background:#e7eef0;color:#40545d;font-size:.48rem;font-weight:900}
.staff-week-empty-add{position:absolute;inset:4px 4px 4px 4px;display:grid;place-items:center;align-content:center;gap:1px;border:1px dashed transparent;border-radius:6px;background:transparent;color:#a0adb2;cursor:pointer}
.staff-week-empty-add span{font-size:.82rem;line-height:1;font-weight:800}
.staff-week-empty-add small{font-size:.45rem;font-weight:750;opacity:0}
.staff-week-empty-add:hover,.staff-week-empty-add:focus-visible{border-color:#b9cdca;background:#f8fbfa;color:#487a70;outline:0}
.staff-week-empty-add:hover small,.staff-week-empty-add:focus-visible small{opacity:1}
.staff-week-empty-add.open:hover,.staff-week-empty-add.open:focus-visible{border-color:#b9c5c8;background:#f7f9fa;color:#66787f}
.staff-week-mini-add{position:absolute;right:4px;bottom:3px;width:17px;height:17px;padding:0;border:0;border-radius:4px;background:transparent;color:#98a5aa;font-size:.72rem;font-weight:850;opacity:.25}
.staff-week-cell:hover .staff-week-mini-add,.staff-week-mini-add:focus-visible{opacity:1;background:#eef3f4;color:#405860;outline:0}
.staff-week-total{position:sticky;right:0;z-index:4;width:76px;padding:9px 7px;background:#f8fafb;text-align:center;vertical-align:middle!important}
.staff-week-total strong,.staff-week-total small{display:block}
.staff-week-total strong{font-size:.72rem;color:#283942;font-variant-numeric:tabular-nums}
.staff-week-total small{margin-top:3px;font-size:.46rem;color:#89969b;font-weight:650}
.staff-week-open-row .staff-week-person,.staff-week-open-row .staff-week-cell,.staff-week-open-row .staff-week-total{background:#fafbfb}
.staff-week-open-person{display:flex;align-items:center;justify-content:space-between}
.staff-week-open-person>span{flex:0 0 auto;display:grid;place-items:center;min-width:22px;height:22px;padding:0 5px;border-radius:999px;background:#e9eef0;color:#566970;font-size:.55rem;font-weight:850}

.modal.modal-planner-quick{width:min(640px,calc(100% - 24px));border-radius:10px}
.modal-planner-quick .modal-body{padding:16px 18px}
.quick-planning-form.simple{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.quick-planning-form.simple .field.full{grid-column:1/-1}
.quick-planning-more{grid-column:1/-1;border:1px solid #e2e9eb;border-radius:7px;background:#fafcfc}
.quick-planning-more>summary{list-style:none;padding:8px 10px;color:#687980;font-size:.64rem;font-weight:800;cursor:pointer}
.quick-planning-more>summary::-webkit-details-marker{display:none}
.quick-planning-more>summary::after{content:'+';float:right;color:#87969c}
.quick-planning-more[open]>summary::after{content:'−'}
.quick-planning-more-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:9px 10px 10px;border-top:1px solid #e7edef}

@media(max-width:1180px){
  .staff-week-scroll{max-height:none}
  .staff-week-table{min-width:1000px}
  .staff-week-person-head,.staff-week-person{width:165px}
}
@media(max-width:780px){
  .staff-week-subbar{align-items:flex-start;flex-direction:column}
  .staff-week-search{width:100%;min-width:0}
  .staff-week-search input{flex:1;width:auto}
  .staff-week-legend{justify-content:flex-start}
  .staff-week-scroll{min-height:0;max-height:none}
  .staff-week-table{min-width:980px}
  .staff-week-person-head,.staff-week-person{width:150px}
  .staff-week-cell{height:72px;min-height:72px}
  .modal.modal-planner-quick{width:calc(100% - 16px)}
  .quick-planning-form.simple,.quick-planning-more-grid{grid-template-columns:1fr}
  .quick-planning-form.simple .field,.quick-planning-more{grid-column:1/-1}
}

/* Teamweek hotfix: rooster directer in beeld, zonder andere planninglayouts te wijzigen. */
.planning-page-staffweek{gap:8px}
.planning-page-staffweek .staff-week-overview{padding:8px 10px;border-radius:10px;gap:10px}
.planning-page-staffweek .staff-week-overview .calm-planner-overview-main{gap:12px!important}
.planning-page-staffweek .staff-week-overview .calm-planner-metrics{gap:12px;padding-left:12px}
.planning-page-staffweek .staff-week-overview .calm-planner-overview-actions{gap:7px!important}
.planning-page-staffweek .staff-week-schedule-card{padding:6px!important}
.planning-page-staffweek .staff-week-schedule-card>.card-header{display:none}
.planning-page-staffweek .staff-week-scroll{max-height:calc(100vh - 250px)}
@media(max-width:1180px){.planning-page-staffweek .staff-week-scroll{max-height:none}}

/* Personeelsportaal mobiel: herstel brede, leesbare items in het Meer-menu. */
@media(max-width:780px){
  body[data-portal="Personeelsportaal"] .mobile-nav-panel-list button{
    grid-template-columns:minmax(0,1fr) auto!important;
  }
  body[data-portal="Personeelsportaal"] .mobile-nav-panel-list button>span:nth-child(2){
    min-width:0;
    white-space:normal;
    word-break:normal;
    overflow-wrap:normal;
    line-height:1.25;
  }
  body[data-portal="Personeelsportaal"] .mobile-nav-panel-list .nav-count{
    margin-left:auto;
  }
}

/* Managerportaal mobiel: herstel bruikbare, brede navigatie-items in Meer-menu. */
@media(max-width:780px){
  body[data-portal="Managerportaal"] .mobile-nav-panel{
    width:min(92vw,380px)!important;
  }
  body[data-portal="Managerportaal"] .mobile-nav-panel-list{
    gap:3px!important;
    padding:8px 10px calc(96px + env(safe-area-inset-bottom))!important;
  }
  body[data-portal="Managerportaal"] .mobile-nav-panel-list button{
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:10px!important;
    min-height:46px!important;
    padding:9px 11px!important;
    align-items:center!important;
  }
  body[data-portal="Managerportaal"] .mobile-nav-panel-list button>span:nth-child(2){
    min-width:0;
    white-space:normal;
    word-break:normal;
    overflow-wrap:normal;
    line-height:1.22;
  }
  body[data-portal="Managerportaal"] .mobile-nav-panel-list .nav-count{
    margin-left:auto;
    justify-self:end;
  }
  body[data-portal="Managerportaal"] .mobile-nav-group{
    padding:13px 11px 5px!important;
  }
}

/* Managerportaal mobiel — navigatie zonder doublures en secties nooit over content heen. */
@media(max-width:780px){
  body[data-portal="Managerportaal"] .mobile-nav-sheet:not([hidden]){
    z-index:240!important;
  }
  body[data-portal="Managerportaal"].mobile-nav-open .mobile-bottom-nav{
    pointer-events:none!important;
  }

  /* Lokale paginatabs blijven in de normale documentflow. De oude sticky positie
     kon op telefoons over banners en titels heen komen wanneer de topbar twee regels had. */
  body[data-portal="Managerportaal"] .section-tabs{
    position:relative!important;
    top:auto!important;
    z-index:2!important;
    display:flex!important;
    flex-wrap:wrap!important;
    width:100%!important;
    max-width:100%!important;
    margin:0 0 2px!important;
    padding:4px!important;
    gap:4px!important;
    overflow:visible!important;
    border-radius:11px!important;
  }
  body[data-portal="Managerportaal"] .section-tabs button{
    flex:1 1 calc(50% - 4px)!important;
    min-width:0!important;
    min-height:36px!important;
    padding:7px 6px!important;
    justify-content:center!important;
    white-space:normal!important;
    text-align:center!important;
    line-height:1.15!important;
  }
  body[data-portal="Managerportaal"] .operation-cockpit>.operation-hero,
  body[data-portal="Managerportaal"] .haccp-manager-page>.sk-summary-strip,
  body[data-portal="Managerportaal"] .manager-closing-page>.closing-overview,
  body[data-portal="Managerportaal"] .page>.section-tabs+*{
    margin-top:0!important;
  }

  /* Actiebalk bovenaan mag op smalle schermen nooit buiten de pagina drukken. */
  body[data-portal="Managerportaal"] .top-actions{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:stretch!important;
    gap:6px!important;
    width:100%!important;
    min-width:0!important;
  }
  body[data-portal="Managerportaal"] .top-actions>input,
  body[data-portal="Managerportaal"] .top-actions>select{
    grid-column:1/-1!important;
    width:100%!important;
    min-width:0!important;
  }
  body[data-portal="Managerportaal"] .top-actions>.button.primary{
    grid-column:1/2!important;
    width:100%!important;
    min-width:0!important;
  }
  body[data-portal="Managerportaal"] .top-actions>.sk-action-menu{
    grid-column:2/3!important;
    min-width:88px!important;
  }
  body[data-portal="Managerportaal"] .top-actions>.sk-action-menu>summary{
    width:100%!important;
    min-height:38px!important;
  }
  body[data-portal="Managerportaal"] .top-actions>.button:not(.primary):only-child,
  body[data-portal="Managerportaal"] .top-actions>.button.primary:only-child{
    grid-column:1/-1!important;
  }
}

@media(max-width:430px){
  body[data-portal="Managerportaal"] .section-tabs button{
    font-size:.62rem!important;
  }
  body[data-portal="Managerportaal"] .top-actions>.sk-action-menu{
    min-width:82px!important;
  }
}