:root{color-scheme:light;--page: #f7f9f8;--raster: rgba(15, 45, 35, .045);--surface: #ffffff;--ink: #0e1512;--ink-2: #46544e;--muted: #7d8a84;--grid: #e3e8e5;--baseline: #c8d2cd;--border: rgba(14, 21, 18, .08);--accent: #0ca678;--accent-ink: #0b7d5c;--accent-soft: #e3f5ee;--info: #2a78d6;--info-soft: #e3eefb;--good: #0b7d3e;--danger: #d6403b;--let-op: #fdf3e0;--let-op-ink: #8a5a00;--weekend: #eef2f0;--schaduw: 0 1px 2px rgba(14, 21, 18, .04), 0 6px 18px rgba(14, 21, 18, .05);--kroon: #c9a227;--implantaat: #8a5ad6;--series-2: #eb6834}:root[data-theme=dark]{color-scheme:dark;--page: #0e120f;--raster: rgba(255, 255, 255, .03);--surface: #171c19;--ink: #f2f5f3;--ink-2: #bcc7c1;--muted: #849087;--grid: #262d29;--baseline: #3a453f;--border: rgba(255, 255, 255, .09);--accent: #22b98a;--accent-ink: #4fd0a5;--accent-soft: #123327;--info: #3987e5;--info-soft: #10233a;--good: #35b36b;--danger: #e66767;--let-op: #2e2413;--let-op-ink: #e0b25e;--weekend: #1e2420;--schaduw: 0 1px 2px rgba(0, 0, 0, .4), 0 6px 18px rgba(0, 0, 0, .35)}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:linear-gradient(var(--raster) 1px,transparent 1px),linear-gradient(90deg,var(--raster) 1px,transparent 1px),var(--page);background-size:88px 88px,88px 88px,auto;color:var(--ink);font-size:14px}.layout{display:flex;min-height:100dvh}.sidebar{width:248px;flex-shrink:0;background:var(--surface);border-right:1px solid var(--grid);padding:20px 14px;position:sticky;top:0;height:100dvh;overflow-y:auto}.side-logo{display:flex;align-items:center;gap:10px;padding:2px 6px 6px}.logo-blok{width:34px;height:34px;border-radius:10px;flex-shrink:0;background:var(--accent);color:#fff;font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:center}.side-logo .naam{font-weight:800;font-size:16.5px;letter-spacing:-.2px}.side-logo .naam span{color:var(--accent)}.side-sectie{margin-top:26px}.side-sectie .kopje{color:var(--accent-ink);font-weight:700;font-size:13px;padding:0 8px}.side-sectie .kopje-sub{color:var(--muted);font-size:11.5px;padding:2px 8px 8px}.sidebar nav{display:flex;flex-direction:column;gap:2px}.sidebar nav button{display:flex;align-items:center;gap:11px;width:100%;border:0;background:none;color:var(--ink-2);text-align:left;font:inherit;font-size:14px;padding:10px 12px;border-radius:10px;cursor:pointer}.sidebar nav button svg{flex-shrink:0}.sidebar nav button:hover{background:var(--weekend);color:var(--ink)}.sidebar nav button.active{background:var(--accent-soft);color:var(--accent-ink);font-weight:600}.main{flex:1;min-width:0;padding:0 32px 24px}.main-top{display:flex;align-items:center;gap:6px;padding:14px 0;margin-bottom:22px;border-bottom:1px solid var(--grid)}.main-top .organisatie{color:var(--muted);font-size:13px}.env-badge{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:.6px;vertical-align:middle}.env-badge.env-test{background:#fdf3e0;color:#8a5a00}.env-badge.env-development{background:var(--weekend);color:var(--muted)}.gebruiker{margin-left:auto;color:var(--muted);font-size:13px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:none;border:0;font-family:inherit;cursor:pointer;padding:6px 10px;border-radius:10px}.gebruiker:hover{background:var(--weekend);color:var(--ink)}button.thema,button.logout{background:none;border:0;color:var(--muted);cursor:pointer;font-size:16px;padding:6px 8px;border-radius:10px}button.thema:hover,button.logout:hover{background:var(--weekend);color:var(--ink)}.wachtwoord-dialoog{max-width:380px}.mobiel-nav{display:none}h1{font-size:25px;margin:0 0 4px;letter-spacing:-.4px}h2{font-size:15px;margin:26px 0 10px}.sub{color:var(--muted);margin:0 0 18px}.card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px;box-shadow:var(--schaduw)}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.spacer{flex:1}button.primary{background:var(--accent);color:#fff;border:0;border-radius:10px;padding:9px 18px;font:inherit;font-weight:600;cursor:pointer;box-shadow:0 4px 12px #0ca67859}button.primary:hover{filter:brightness(1.06)}button.ghost{background:var(--surface);border:1px solid var(--baseline);color:var(--ink-2);border-radius:999px;padding:8px 16px;font:inherit;cursor:pointer}button.ghost:hover{background:var(--weekend);color:var(--ink)}button.ghost.pijl{padding:8px 13px;font-size:15px;line-height:1}button.icon{background:none;border:0;color:var(--muted);cursor:pointer;font-size:15px;padding:4px 6px;border-radius:8px}button.icon:hover{color:var(--danger);background:var(--weekend)}button.link{border:0;background:none;color:var(--accent-ink);font:inherit;font-size:13px;cursor:pointer;padding:2px 0}button.link:hover{text-decoration:underline}a.link{color:var(--accent-ink)}input,select,textarea{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--baseline);border-radius:10px;padding:8px 11px}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:-1px;border-color:transparent}input[type=number]{text-align:right}label.field{display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:var(--ink-2)}.field .hint{color:var(--muted);font-size:11.5px}.error{color:var(--danger);font-size:13px}.melding{color:var(--good);background:var(--accent-soft);border-radius:10px;padding:8px 12px;font-size:13px;margin:0 0 12px}.let-op{background:var(--let-op);color:var(--let-op-ink);border-radius:10px;padding:9px 13px;font-size:13px;margin:0 0 12px}.rol-tag{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--accent-ink);background:var(--accent-soft);border-radius:8px;padding:2px 8px}.archief-tag{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--let-op-ink);background:var(--let-op);border-radius:8px;padding:2px 9px}.status-chip{display:inline-block;font-size:11.5px;font-weight:600;color:var(--ink-2);background:var(--weekend);border:1px solid var(--baseline);border-radius:20px;padding:2px 10px;white-space:nowrap}.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:18px}.kpi{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px 16px;box-shadow:var(--schaduw)}.kpi .label{color:var(--muted);font-size:11.5px;text-transform:uppercase;letter-spacing:.5px}.kpi .value{font-size:26px;font-weight:700;margin-top:4px}.kpi .hint{color:var(--ink-2);font-size:12.5px;margin-top:2px}table{border-collapse:collapse;width:100%}th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--grid)}th{color:var(--muted);font-weight:600;font-size:11.5px;text-transform:uppercase;letter-spacing:.5px}td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}tr.clickable{cursor:pointer}tr.clickable:hover td{background:var(--weekend)}tfoot td{font-weight:600;border-top:2px solid var(--baseline);border-bottom:0}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}.tabs{display:flex;gap:6px;margin-bottom:16px}.tabs button{border:1px solid var(--baseline);background:var(--surface);color:var(--ink-2);font:inherit;padding:8px 16px;border-radius:999px;cursor:pointer}.tabs button:hover{background:var(--weekend)}.tabs button.active{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600;box-shadow:0 3px 9px #0ca6784d}dialog{border:1px solid var(--border);border-radius:16px;background:var(--surface);color:var(--ink);padding:22px;max-width:720px;width:calc(100vw - 48px);box-shadow:var(--schaduw)}dialog::backdrop{background:#0a141073}.login-wrap{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:20px}.login-card{display:flex;flex-direction:column;gap:14px;width:350px;padding:30px}.login-card .side-logo{padding:0}.periode-balk{margin-bottom:16px}.weergave-keuze{margin:0}.agenda-grid{display:grid;gap:10px;align-items:start}.kolom-kop{text-align:center;font-weight:600;padding:4px 0;color:var(--ink-2)}.agenda-gutter{position:relative}.agenda-tijd{position:absolute;right:6px;transform:translateY(-50%);font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}.agenda-body{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:14px;overflow:hidden;box-shadow:var(--schaduw)}.uurlijn{position:absolute;left:0;right:0;border-top:1px solid var(--grid);pointer-events:none}.afspraak{position:absolute;left:4px;right:4px;border-radius:9px;padding:3px 8px;font-size:12px;line-height:1.25;overflow:hidden;cursor:pointer;background:var(--accent-soft);color:var(--accent-ink);border:1px solid var(--accent)}.afspraak b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.afspraak.status-gekomen{background:var(--info-soft);color:var(--info);border-color:var(--info)}.afspraak.status-niet_verschenen{background:color-mix(in srgb,var(--danger) 12%,var(--surface));color:var(--danger);border-color:var(--danger)}.afspraak.status-geannuleerd{background:var(--weekend);color:var(--muted);border-style:dashed;border-color:var(--baseline);text-decoration:line-through}.dag-kaart{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:10px 14px;margin-bottom:10px;box-shadow:var(--schaduw)}.dag-kaart.vandaag{border-color:var(--accent)}.dag-kaart .dag-kop{display:flex;align-items:baseline;gap:10px;margin-bottom:4px}.dag-kaart .dag-kop .naam{font-weight:700;min-width:105px;text-transform:capitalize}.dag-kaart.vandaag .dag-kop .naam{color:var(--accent-ink)}.week-afspraak{display:flex;gap:12px;align-items:baseline;padding:6px 0;border-top:1px solid var(--grid);cursor:pointer}.week-afspraak:hover{background:var(--weekend)}.week-afspraak .tijd{font-variant-numeric:tabular-nums;color:var(--ink-2);white-space:nowrap}.week-afspraak .wie{font-weight:600}.week-afspraak .oms{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.week-afspraak.status-geannuleerd .wie{text-decoration:line-through;color:var(--muted)}.add-entry{border:0;background:none;color:var(--accent-ink);font:inherit;cursor:pointer;padding:4px 0;font-weight:600}.add-entry:hover{text-decoration:underline}.dossier-kop{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:4px}.dossier-kop h1,.dossier-kop .sub{margin:0}.gebit-wrap{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-start}.gebit-kaart{flex:1 1 560px;max-width:640px}.gebit-kaart svg{width:100%;height:auto;display:block}.gebit-panel{flex:1 1 240px;display:flex;flex-direction:column;gap:10px;max-width:320px}.gebit-legenda{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:12px;font-size:12.5px;color:var(--ink-2)}.gebit-legenda .swatch{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:5px;border:1px solid var(--baseline);vertical-align:-1px}@media(max-width:860px){body{font-size:15px}.sidebar{display:none}.main{padding:0 12px calc(84px + env(safe-area-inset-bottom))}.main-top{padding:12px 0;margin-bottom:14px}input,select,textarea{font-size:16px;padding:10px 12px}button.primary,button.ghost{padding:10px 16px}.mobiel-nav{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;gap:0;background:var(--surface);border-top:1px solid var(--grid);padding:6px 8px calc(6px + env(safe-area-inset-bottom))}.mobiel-nav button{flex:1;border:0;background:none;color:var(--ink-2);font:inherit;font-size:12.5px;padding:10px 4px;border-radius:10px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px}.mobiel-nav button.active{background:var(--accent-soft);color:var(--accent-ink);font-weight:600}.periode-balk{gap:8px}.weergave-keuze,.weergave-keuze button{flex:1}.kpis{grid-template-columns:1fr 1fr}.kpi .value{font-size:22px}.card:has(table){overflow-x:auto}th,td{padding:8px;white-space:nowrap}dialog{width:100vw;max-width:none;margin:0;height:100dvh;max-height:none;border-radius:0;border:0}.form-grid{grid-template-columns:1fr 1fr}}
