:root{
  --green:#52B69A;
  --green-deep:#3D9077;
  --green-tint:#E4F3EE;
  --blue:#1A759F;
  --blue-deep:#145A7B;
  --blue-dark:#134B66;
  --blue-tint:#E2EFF5;
  --cream:#F2F7E3;
  --orange:#F28123;
  --orange-deep:#C4661A;
  --orange-tint:#FDEEDF;
  --ink:#494441;
  --ink-2:#6E6864;
  --ink-3:#9A938E;
  --surface:#FFFFFF;
  --line:#E6E4DC;
  --line-2:#D3D0C6;
  --alert:#C0453B;
  --alert-tint:#FBEAE8;
  --rail-w:238px;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:'Manrope',system-ui,sans-serif;
  background:var(--cream);
  color:var(--ink);
  font-size:15px;line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.mono{font-variant-numeric:tabular-nums;font-feature-settings:'tnum'}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}

/* ---------- LOGIN ---------- */
#login{position:fixed;inset:0;z-index:100;background:var(--blue-dark);display:flex;align-items:center;justify-content:center}
#login::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 22% 18%, rgba(82,182,154,.30), transparent 58%);
}
#login.hide{display:none}
.login-card{width:100%;max-width:376px;padding:0 24px;position:relative}
.login-mark{display:flex;align-items:center;gap:13px;margin-bottom:36px}
.login-mark img{width:46px;height:46px;background:#fff;border-radius:11px;padding:4px}
.login-mark h1{font-size:18px;font-weight:700;color:#fff;letter-spacing:-.02em}
.login-mark p{font-size:12.5px;color:rgba(242,247,227,.62);margin-top:1px}
.login-card label{display:block;font-size:12.5px;color:rgba(242,247,227,.72);margin-bottom:6px;font-weight:500}
.login-card input{
  width:100%;height:43px;padding:0 13px;margin-bottom:16px;
  background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.17);
  border-radius:8px;color:#fff;font:inherit;font-size:14px;
}
.login-card input:focus{outline:none;border-color:var(--green);background:rgba(255,255,255,.13)}
.login-btn{
  width:100%;height:44px;background:var(--green);color:#fff;border-radius:8px;
  font-weight:600;font-size:14.5px;margin-top:6px;transition:background .15s;
}
.login-btn:hover{background:var(--green-deep)}
.login-hint{margin-top:20px;font-size:12px;color:rgba(242,247,227,.45);text-align:center;line-height:1.65}

/* ---------- SHELL ---------- */
#app{display:none;min-height:100vh}
#app.show{display:block}
.rail{position:fixed;top:0;left:0;bottom:0;width:var(--rail-w);background:var(--blue-dark);display:flex;flex-direction:column;z-index:20}
.rail-head{padding:17px 16px 15px;border-bottom:1px solid rgba(255,255,255,.10)}
.rail-mark{display:flex;align-items:center;gap:10px}
.rail-mark img{width:34px;height:34px;background:#fff;border-radius:8px;padding:3px;flex-shrink:0}
.rail-mark h1{font-size:14.5px;font-weight:700;color:#fff;letter-spacing:-.015em;line-height:1.2}
.rail-mark p{font-size:11px;color:rgba(242,247,227,.52)}
.rail-nav{flex:1;padding:12px 10px;overflow-y:auto}
.nav-group{margin-bottom:15px}
.nav-group-label{font-size:10.5px;color:rgba(242,247,227,.42);padding:0 9px;margin-bottom:5px;letter-spacing:.05em;font-weight:600}
.nav-item{
  display:flex;align-items:center;gap:10px;width:100%;padding:8px 9px;border-radius:7px;
  color:rgba(242,247,227,.76);font-size:13.5px;text-align:left;position:relative;
  transition:background .12s,color .12s;
}
.nav-item:hover{background:rgba(255,255,255,.08);color:#fff}
.nav-item.on{background:rgba(255,255,255,.11);color:#fff;font-weight:600}
.nav-item.on::before{content:'';position:absolute;left:-10px;top:7px;bottom:7px;width:3px;background:var(--green);border-radius:0 3px 3px 0}
.nav-item svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.7;flex-shrink:0}
.nav-badge{margin-left:auto;background:var(--orange);color:#fff;font-size:10.5px;font-weight:700;padding:1px 6px;border-radius:9px;line-height:1.5}
.rail-foot{padding:10px;border-top:1px solid rgba(255,255,255,.10)}
.rail-user{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:7px;width:100%;text-align:left}
.rail-user:hover{background:rgba(255,255,255,.08)}
.avatar{
  width:30px;height:30px;border-radius:50%;
  background:linear-gradient(135deg,var(--blue),var(--green));
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-size:11.5px;font-weight:700;flex-shrink:0;
}
.rail-user-txt strong{display:block;font-size:12.5px;color:#fff;font-weight:600;line-height:1.3}
.rail-user-txt span{font-size:11px;color:rgba(242,247,227,.52)}

.main{margin-left:var(--rail-w);min-height:100vh}
.topbar{
  position:sticky;top:0;z-index:10;background:rgba(242,247,227,.92);backdrop-filter:blur(9px);
  border-bottom:1px solid var(--line);padding:0 30px;height:60px;display:flex;align-items:center;gap:15px;
}
.topbar h2{font-size:17.5px;font-weight:700;letter-spacing:-.02em}
.topbar .sub{font-size:13px;color:var(--ink-3);font-weight:500}
.topbar .right{margin-left:auto;display:flex;align-items:center;gap:9px}
.btn{
  height:36px;padding:0 14px;border-radius:8px;border:1px solid var(--line-2);background:var(--surface);
  font-size:13.5px;font-weight:500;display:inline-flex;align-items:center;gap:7px;
  transition:border-color .12s,background .12s;
}
.btn:hover{border-color:var(--ink-3)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn:disabled:hover{border-color:var(--line-2)}
.btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.9}
.btn-primary{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:600}
.btn-primary:hover{background:var(--blue-deep);border-color:var(--blue-deep)}
.page{padding:25px 30px 60px}
.screen{display:none}
.screen.on{display:block}

/* ---------- CARDS ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:13px}
.card-head{padding:15px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:11px}
.card-head h3{font-size:14.5px;font-weight:700;letter-spacing:-.01em}
.card-head .more{margin-left:auto;font-size:12.5px;color:var(--blue);font-weight:600}
.grid{display:grid;gap:15px}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g23{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr)}

.stat{background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:15px 17px;position:relative;overflow:hidden}
.stat::after{content:'';position:absolute;left:0;top:0;bottom:0;width:3px}
.stat.s-green::after{background:var(--green)}
.stat.s-blue::after{background:var(--blue)}
.stat.s-orange::after{background:var(--orange)}
.stat .lab{font-size:12.5px;color:var(--ink-2);font-weight:500}
.stat .val{font-size:26px;font-weight:700;letter-spacing:-.03em;margin-top:6px;line-height:1.1}
.stat .foot{font-size:12px;color:var(--ink-3);margin-top:5px;font-weight:500}
.stat .foot em{font-style:normal;font-weight:600}
.up{color:var(--green-deep)}
.down{color:var(--alert)}
.blue{color:var(--blue)}

/* ---------- MARGE ---------- */
.mrow{padding:13px 18px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .12s}
.mrow:last-child{border-bottom:none}
.mrow:hover{background:#FAFCF4}
.mrow-top{display:flex;align-items:baseline;gap:10px;margin-bottom:8px}
.mrow-top strong{font-size:14px;font-weight:600}
.mrow-top .cust{font-size:12.5px;color:var(--ink-3);font-weight:500}
.mrow-top .amt{margin-left:auto;font-size:14px;font-weight:700}
.mbar{display:flex;height:8px;border-radius:4px;overflow:hidden;background:var(--line)}
.mbar i{display:block}
.mbar .cost{background:var(--blue)}
.mbar .marg{background:var(--green)}
.mlegend{display:flex;gap:14px;margin-top:7px;font-size:11.5px;color:var(--ink-3);font-weight:500}
.mlegend b{font-weight:600;color:var(--ink-2)}

/* ---------- TABLE ---------- */
table{width:100%;border-collapse:collapse}
th{text-align:left;font-size:11.5px;font-weight:600;color:var(--ink-3);padding:10px 18px;border-bottom:1px solid var(--line);white-space:nowrap;letter-spacing:.01em}
td{padding:12px 18px;border-bottom:1px solid var(--line);font-size:13.5px;vertical-align:middle}
tbody tr:last-child td{border-bottom:none}
tbody tr{cursor:pointer;transition:background .12s}
tbody tr:hover{background:#FAFCF4}
.num{text-align:right;font-variant-numeric:tabular-nums}

.tag{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:2.5px 8px;border-radius:6px;white-space:nowrap}
.t-green{background:var(--green-tint);color:var(--green-deep)}
.t-blue{background:var(--blue-tint);color:var(--blue-deep)}
.t-orange{background:var(--orange-tint);color:var(--orange-deep)}
.t-alert{background:var(--alert-tint);color:var(--alert)}
.t-grey{background:#EEEDE6;color:var(--ink-2)}
.dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}

/* ---------- INBOX ---------- */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:15px}
/* Detailkaart (rechterkolom) blijft in beeld staan terwijl je door een lange
   lijst links scrolt, i.p.v. mee omhoog te schuiven — zelf scrollbaar zodra
   de inhoud (PDF + actieknoppen) niet in de resterende hoogte past. */
.split > *:last-child{position:sticky;top:75px;max-height:calc(100vh - 90px);overflow-y:auto}
.mail{padding:13px 17px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .12s}
.mail:last-child{border-bottom:none}
.mail:hover{background:#FAFCF4}
.mail.on{background:var(--blue-tint)}
.mail-top{display:flex;align-items:center;gap:8px;margin-bottom:3px}
.mail-top strong{font-size:13.5px;font-weight:600}
.mail-top .time{margin-left:auto;font-size:11.5px;color:var(--ink-3);white-space:nowrap;font-weight:500}
.mail-subj{font-size:13px;color:var(--ink-2);margin-bottom:6px}
.mail-prev{font-size:12.5px;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.draft{padding:17px 18px}
.draft-meta{font-size:12.5px;color:var(--ink-3);margin-bottom:14px;padding-bottom:13px;border-bottom:1px solid var(--line)}
.draft-meta div{margin-bottom:3px}
.draft-meta b{color:var(--ink-2);font-weight:600}
.draft-body{background:#FBFCF6;border:1px solid var(--line);border-radius:9px;padding:15px 16px;font-size:13.5px;line-height:1.75;white-space:pre-line}
.draft-src{margin-top:13px;padding:11px 13px;background:var(--orange-tint);border-radius:9px;font-size:12.5px;color:var(--orange-deep);line-height:1.6}
.draft-src b{font-weight:700}
.draft-acts{display:flex;gap:9px;margin-top:15px}

/* ---------- DETAIL ---------- */
.back{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--ink-2);margin-bottom:15px;font-weight:500}
.back:hover{color:var(--blue)}
.back svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2}
.dh{display:flex;align-items:flex-start;gap:15px;margin-bottom:20px}
.dh h2{font-size:23px;font-weight:700;letter-spacing:-.03em;line-height:1.25}
.dh p{font-size:13.5px;color:var(--ink-3);margin-top:3px;font-weight:500}
.dh .r{margin-left:auto;text-align:right;flex-shrink:0}
.dh .r .lab{font-size:12px;color:var(--ink-3);font-weight:500}
.dh .r .val{font-size:30px;font-weight:700;letter-spacing:-.035em;line-height:1.15;margin-top:1px}
.dh .r .pct{font-size:12.5px;margin-top:1px;font-weight:600}

.fin{padding:16px 18px}
.finline{display:flex;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.finline:last-child{border-bottom:none}
.finline .n{color:var(--ink-2);font-weight:500}
.finline .n small{display:block;font-size:11.5px;color:var(--ink-3);font-weight:400}
.finline .v{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:600}
.finline.tot{border-top:2px solid var(--ink);border-bottom:none;margin-top:5px;padding-top:12px}
.finline.tot .n{font-weight:700;color:var(--ink)}
.finline.tot .v{font-size:16px;font-weight:700}
.link-btn{width:100%;padding:11px;border:1px dashed var(--line-2);border-radius:9px;font-size:13px;color:var(--ink-2);margin-top:12px;font-weight:500;transition:border-color .12s,color .12s}
.link-btn:hover{border-color:var(--green);color:var(--green-deep)}

.marge-gauge{padding:18px}
.marge-gauge-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}
.marge-gauge-pct{font-size:24px;font-weight:700;color:var(--ink)}
.marge-gauge-pct.up{color:var(--green-deep)}
.marge-gauge-pct.laag{color:var(--orange-deep)}
.marge-gauge-streef{font-size:11.5px;color:var(--ink-3)}
.marge-bar{position:relative;height:14px;background:var(--line);border-radius:7px}
.marge-bar-vulling{position:absolute;top:0;left:0;height:100%;min-width:7px;border-radius:7px;background:var(--green);transition:width .3s}
.marge-bar-vulling.laag{background:var(--orange)}
.marge-drempel{position:absolute;top:-4px;bottom:-4px;width:0;border-left:2px dashed var(--ink-2)}
.marge-bar-as{position:relative;height:14px;margin-top:5px;font-size:10.5px;color:var(--ink-3)}

.tl{padding:16px 18px}
.tl-item{display:flex;gap:12px;padding-bottom:16px;position:relative}
.tl-item:last-child{padding-bottom:0}
.tl-item::before{content:'';position:absolute;left:11px;top:26px;bottom:0;width:1px;background:var(--line)}
.tl-item:last-child::before{display:none}
.tl-ic{width:23px;height:23px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;z-index:1}
.tl-ic svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.3}
.tl-body strong{display:block;font-size:13.5px;font-weight:600;line-height:1.4}
.tl-body p{font-size:12.5px;color:var(--ink-3);margin-top:2px}
.tl-body time{font-size:11.5px;color:var(--ink-3);font-weight:500}

/* ---------- KENNISBANK ---------- */
.kb-search{position:relative;margin-bottom:16px;max-width:480px}
.kb-search input{width:100%;height:41px;padding:0 13px 0 38px;border:1px solid var(--line-2);border-radius:9px;background:var(--surface);font:inherit;font-size:14px}
.kb-search input:focus{outline:none;border-color:var(--green)}
.kb-search svg{position:absolute;left:13px;top:12.5px;width:16px;height:16px;stroke:var(--ink-3);fill:none;stroke-width:1.9}
.kb-item{padding:14px 18px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .12s}
.kb-item:last-child{border-bottom:none}
.kb-item:hover{background:#FAFCF4}
.kb-top{display:flex;align-items:center;gap:9px;margin-bottom:5px}
.kb-top strong{font-size:13.5px;font-weight:600}
.kb-sym{font-size:12.5px;color:var(--ink-2);line-height:1.65}
.kb-src{font-size:11.5px;color:var(--ink-3);margin-top:5px;font-weight:500}

/* ---------- RECHTEN ---------- */
.perm{width:16px;height:16px;border-radius:5px;border:1.5px solid var(--line-2);display:inline-flex;align-items:center;justify-content:center}
.perm.on{background:var(--green);border-color:var(--green)}
.perm.on::after{content:'';width:3.5px;height:7px;border:1.6px solid #fff;border-top:0;border-left:0;transform:rotate(42deg) translateY(-1px)}
.pcell{text-align:center}

/* ---------- GESPREKKEN ---------- */
.call{padding:15px 18px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .12s}
.call:last-child{border-bottom:none}
.call:hover{background:#FAFCF4}
.call-top{display:flex;align-items:center;gap:9px;margin-bottom:6px}
.call-top strong{font-size:13.5px;font-weight:600}
.call-top .dur{margin-left:auto;font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums;font-weight:500}
.call-sum{font-size:12.5px;color:var(--ink-2);line-height:1.7}
.call-pts{margin-top:8px;padding-left:16px}
.call-pts li{font-size:12.5px;color:var(--ink-2);line-height:1.7;margin-bottom:2px}
.call-foot{display:flex;align-items:center;gap:8px;margin-top:9px;font-size:11.5px;color:var(--ink-3);font-weight:500}

/* ---------- OPUSFLOW ---------- */
.of-btn{
  display:inline-flex;align-items:center;gap:4px;padding:4px 6px;border-radius:7px;
  border:1px solid var(--line);background:var(--surface);transition:border-color .12s,background .12s;
}
.of-btn:hover{border-color:var(--blue);background:var(--blue-tint)}
.of-mark{width:17px;height:17px;border-radius:5px;flex-shrink:0;display:block;object-fit:cover}
.of-btn .ext{width:12px;height:12px;stroke:var(--ink-3);fill:none;stroke-width:2}
.of-btn:hover .ext{stroke:var(--blue)}
.of-inline{display:inline-flex;align-items:center;gap:6px;padding:5px 10px 5px 6px;border-radius:8px;border:1px solid var(--line-2);background:var(--surface);font-size:12.5px;font-weight:600;color:var(--ink-2)}
.of-inline:hover{border-color:var(--blue);color:var(--blue);background:var(--blue-tint)}

/* ---------- FACTUUR ---------- */
.fac{padding:13px 17px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .12s}
.fac:last-child{border-bottom:none}
.fac:hover{background:#FAFCF4}
.fac.on{background:var(--blue-tint)}
.fac-top{display:flex;align-items:center;gap:8px;margin-bottom:3px}
.fac-top strong{font-size:13.5px;font-weight:600}
.fac-top .bd{margin-left:auto;font-size:13.5px;font-weight:700;font-variant-numeric:tabular-nums}
.fac-sub{font-size:12.5px;color:var(--ink-3);font-weight:500}

.pdf-wrap{background:#EDECE4;border:1px solid var(--line);border-radius:13px 13px 0 0;padding:16px;border-bottom:none}
.pdf{
  background:#fff;border-radius:4px;padding:26px 28px;font-size:11px;line-height:1.6;
  box-shadow:0 1px 4px rgba(73,68,65,.13);max-width:100%;color:#3E3A37;
}
.pdf-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:22px}
.pdf-logo{font-size:15px;font-weight:700;letter-spacing:-.02em}
.pdf-meta{text-align:right;font-size:10px;color:#7A7470;line-height:1.7}
.pdf-to{margin-bottom:18px;font-size:10.5px;color:#5C5652;line-height:1.7}
.pdf-to b{display:block;color:#3E3A37;font-weight:600;margin-bottom:2px}
.pdf table{width:100%;border-collapse:collapse;margin-bottom:14px}
.pdf th{font-size:9.5px;text-transform:none;color:#7A7470;border-bottom:1px solid #DDD9D2;padding:5px 0;font-weight:600;letter-spacing:0}
.pdf td{font-size:10.5px;border-bottom:1px solid #EFEDE7;padding:6px 0;color:#3E3A37}
.pdf .r{text-align:right;font-variant-numeric:tabular-nums}
.pdf-tot{display:flex;justify-content:flex-end;gap:26px;font-size:10.5px;padding:3px 0}
.pdf-tot.big{font-weight:700;font-size:12px;border-top:1.5px solid #3E3A37;margin-top:5px;padding-top:7px}
.pdf-foot{margin-top:20px;padding-top:11px;border-top:1px solid #EFEDE7;font-size:9.5px;color:#8A8480;line-height:1.7}
.pdf-frame{width:100%;height:64vh;min-height:420px;display:block;border:0;border-radius:4px;background:#fff;box-shadow:0 1px 4px rgba(73,68,65,.13)}

.fac-act{background:var(--surface);border:1px solid var(--line);border-radius:0 0 13px 13px;padding:16px 18px}
.fac-act .row{display:flex;align-items:center;gap:9px;margin-bottom:11px}
.fac-act .row-zoek{flex-direction:column;align-items:stretch;gap:6px}
.fac-act .row-zoek label{min-width:0}
.fac-act label{font-size:12.5px;color:var(--ink-2);font-weight:600;min-width:98px}
.fac-act select{
  flex:1;height:38px;padding:0 11px;border:1px solid var(--line-2);border-radius:8px;
  background:var(--surface);font:inherit;font-size:13.5px;color:var(--ink);
}
.fac-act select:focus{outline:none;border-color:var(--green)}

.zoek-select{position:relative;flex:1;min-width:0}
.zoek-select-input{
  width:100%;height:38px;padding:0 11px;border:1px solid var(--line-2);border-radius:8px;
  background:var(--surface);font:inherit;font-size:13.5px;color:var(--ink);
}
.zoek-select-input:focus{outline:none;border-color:var(--green)}
.zoek-select-lijst{
  position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:20;max-height:260px;overflow-y:auto;
  background:var(--surface);border:1px solid var(--line-2);border-radius:8px;box-shadow:0 4px 16px rgba(73,68,65,.15);
}
.zoek-select-optie{padding:8px 11px;font-size:13px;cursor:pointer;color:var(--ink)}
.zoek-select-optie.actief{background:var(--green-tint);color:var(--green-deep)}
.zoek-select-leeg{padding:8px 11px;font-size:13px;color:var(--ink-3)}

.hint-match{
  display:flex;gap:9px;padding:10px 13px;background:var(--green-tint);border-radius:9px;
  font-size:12.5px;color:var(--green-deep);line-height:1.6;margin-bottom:13px;font-weight:500;
}
.hint-match svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.3;flex-shrink:0;margin-top:2px}
.fac-btns{display:flex;gap:9px;flex-wrap:wrap}
.btn-green{background:var(--green);border-color:var(--green);color:#fff;font-weight:600}
.btn-green:hover{background:var(--green-deep);border-color:var(--green-deep)}

.toast{
  position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(70px);
  background:var(--ink);color:#fff;padding:11px 18px;border-radius:10px;font-size:13.5px;
  font-weight:500;z-index:200;opacity:0;transition:transform .25s,opacity .25s;pointer-events:none;
  box-shadow:0 5px 20px rgba(73,68,65,.28);
}
.toast.show{transform:translateX(-50%) translateY(0);opacity:1}
.toast.fout{background:var(--alert)}

.pdf-ic{width:30px;height:30px;border-radius:7px;background:var(--alert-tint);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pdf-ic svg{width:15px;height:15px;stroke:var(--alert);fill:none;stroke-width:1.8}
.chip.klein{padding:4px 9px;font-size:11.5px}
.upload-vak{
  display:flex;align-items:center;gap:13px;padding:20px;margin-bottom:15px;
  border:1.5px dashed var(--line-2);border-radius:11px;cursor:pointer;
  font-size:13px;color:var(--ink-2);line-height:1.6;transition:all .12s;
}
.upload-vak:hover,.upload-vak.over{border-color:var(--green);background:var(--green-tint);color:var(--green-deep)}
.upload-vak svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.6;flex-shrink:0}
.upload-vak b{font-weight:600}
.stub-rij{display:flex;align-items:baseline;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.stub-rij b{font-weight:600;min-width:160px}
.stub-rij span{color:var(--ink-3);font-size:13px}

.week-nav{display:flex;align-items:center;gap:12px;padding:0 0 15px;margin-bottom:15px;border-bottom:1px solid var(--line)}
.week-lab{flex:1;text-align:center}
.week-lab b{display:block;font-size:14px;font-weight:600}
.week-lab span{font-size:11.5px;color:var(--ink-3);font-weight:500}
.week-hist{margin-top:16px;padding-top:15px;border-top:1px solid var(--line)}
.wh-rij{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.wh-kol{padding:8px 4px 6px;border-radius:9px;border:1px solid transparent;transition:all .12s;text-align:center}
.wh-kol:hover{background:#FAFCF4;border-color:var(--line)}
.wh-kol.on{background:var(--green-tint);border-color:var(--green)}
.wh-bars{height:56px;display:flex;align-items:flex-end;justify-content:center;margin-bottom:7px}
.wh-bar{width:26px;background:var(--blue-tint);border-radius:4px;position:relative;display:flex;align-items:flex-end;overflow:hidden;min-height:5px}
.wh-bar i{display:block;width:100%;background:var(--green);border-radius:0 0 4px 4px}
.wh-n{font-size:14px;font-weight:700;line-height:1.2}
.wh-a{font-size:11.5px;font-weight:600;color:var(--green-deep);line-height:1.3}
.wh-l{font-size:11px;color:var(--ink-3);font-weight:500;margin-top:3px}
.wh-legenda{display:flex;gap:14px;justify-content:center;margin-top:11px;font-size:11.5px;color:var(--ink-3);font-weight:500}
.wh-legenda span{display:flex;align-items:center;gap:5px}
.lg{width:9px;height:9px;border-radius:2px;display:inline-block}
.lg-licht{background:var(--blue-tint)} .lg-groen{background:var(--green)}
.periode{flex-wrap:wrap}

.periode{display:flex;gap:3px;margin-left:auto;background:var(--cream);border-radius:8px;padding:3px}
.per{padding:5px 10px;border-radius:6px;font-size:12px;font-weight:600;color:var(--ink-3);transition:all .12s}
.per:hover{color:var(--ink-2)}
.per.on{background:var(--surface);color:var(--ink);box-shadow:0 1px 2px rgba(73,68,65,.09)}
.tr-top{display:flex;align-items:center;gap:14px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.tr-cijfer{flex:1}
.tr-cijfer .lab{display:block;font-size:12.5px;color:var(--ink-2);font-weight:500}
.tr-cijfer .val{display:block;font-size:28px;font-weight:700;letter-spacing:-.03em;line-height:1.15;margin-top:3px}
.tr-pijl{display:flex;flex-direction:column;align-items:center;gap:2px;flex-shrink:0;padding:0 4px}
.tr-pijl svg{width:26px;height:26px;stroke:var(--line-2);fill:none;stroke-width:1.8}
.tr-pijl span{font-size:13px;font-weight:700;color:var(--green-deep)}
.tr-kanalen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;padding:16px 0 4px}
.tr-kan-top{display:flex;align-items:center;gap:7px;margin-bottom:7px}
.tr-ic{width:15px;height:15px;fill:none;stroke-width:1.9;flex-shrink:0}
.tr-ic.blue{stroke:var(--blue)} .tr-ic.green{stroke:var(--green-deep)} .tr-ic.orange{stroke:var(--orange-deep)}
.tr-kan-l{font-size:12.5px;color:var(--ink-2);font-weight:500}
.tr-kan-n{margin-left:auto;font-size:15px;font-weight:700}
.tr-bar{height:6px;border-radius:3px;background:var(--line);overflow:hidden}
.tr-bar i{display:block;height:100%;border-radius:3px;transition:width .3s}
.b-blue{background:var(--blue)} .b-green{background:var(--green)} .b-orange{background:var(--orange)}
.tr-kan-p{font-size:11.5px;color:var(--ink-3);margin-top:5px;font-weight:500}
.tr-voet{font-size:11.5px;color:var(--ink-3);line-height:1.6;margin-top:14px;padding-top:13px;border-top:1px solid var(--line)}
@media(max-width:900px){.tr-kanalen{grid-template-columns:minmax(0,1fr)}}

.veld-grid{display:flex;flex-wrap:wrap;gap:0 14px}
.veld-grid > .kb-veld{flex:1 1 calc(50% - 7px);min-width:190px}
.corr{display:flex;align-items:flex-start;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.corr:last-child{border-bottom:none}
.corr-d{font-size:11.5px;color:var(--ink-3);font-weight:600;white-space:nowrap;min-width:62px;padding-top:2px}
.corr-t{flex:1;font-size:13px;color:var(--ink-2);line-height:1.65}
.std-t{font-size:12.5px;color:var(--ink-3);line-height:1.7;margin-top:5px}
.int-ic{
  width:36px;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0;
  background:var(--green-tint);
}
.int-ic svg{width:19px;height:19px;stroke:var(--green-deep);fill:none;stroke-width:1.8}
.int-ic.let{background:var(--orange-tint)} .int-ic.let svg{stroke:var(--orange-deep)}
.int-ic.vraag{background:#EEEDE6} .int-ic.vraag svg{stroke:var(--ink-2)}
.int-ic.fout{background:var(--alert-tint)} .int-ic.fout svg{stroke:var(--alert)}
.int-veld{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.int-veld:last-of-type{border-bottom:none}
.int-veld label{color:var(--ink-2);font-weight:500;min-width:180px}
.int-val{flex:1;display:flex;align-items:center;gap:8px;color:var(--ink);word-break:break-all}
.int-val.geheim{font-family:var(--mono,monospace);letter-spacing:.06em;color:var(--ink-3)}
.int-uitleg{font-size:12.5px;color:var(--ink-3);line-height:1.7;margin:13px 0 15px;padding-top:13px;border-top:1px solid var(--line)}
.int-laatst{margin-left:auto;font-size:11.5px;color:var(--ink-3);font-weight:500;align-self:center}

.op-kop{font-size:15px;font-weight:600;margin-bottom:3px}
.op-tijd{font-size:12.5px;color:var(--ink-3);font-weight:500}
.op-tijd b{font-weight:700;color:var(--ink-2)}
.op-tijd.laat b{color:var(--alert)}
.op-bal{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.op-bal label{display:block;font-size:12.5px;font-weight:600;color:var(--ink-2);margin-bottom:7px}

.doc-selects{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:15px}
.doc-selects select{
  height:34px;padding:0 28px 0 11px;border:1px solid var(--line-2);border-radius:8px;
  background:var(--surface);font:inherit;font-size:13px;color:var(--ink-2);cursor:pointer;appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239A938E' stroke-width='2.4'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 9px center;background-size:12px;
}
.doc-selects select:focus{outline:none;border-color:var(--green)}
.doc-tel{margin-left:auto;font-size:12.5px;color:var(--ink-3);font-weight:500}

.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:15px}
.chip{
  display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:20px;
  border:1px solid var(--line-2);background:var(--surface);font-size:12.5px;font-weight:500;
  color:var(--ink-2);transition:all .12s;
}
.chip:hover{border-color:var(--ink-3)}
.chip.on{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:600}
.chip-n{font-size:11px;opacity:.65;font-variant-numeric:tabular-nums}
.kb-tekst{font-size:13.5px;color:var(--ink-2);line-height:1.7}
.kb-veld{margin-bottom:13px}
.kb-veld label{display:block;font-size:12.5px;font-weight:600;color:var(--ink-2);margin-bottom:5px}
.kb-veld input, .kb-veld textarea, .kb-veld select{
  width:100%;padding:9px 11px;border:1px solid var(--line-2);border-radius:8px;
  background:var(--surface);font:inherit;font-size:13.5px;color:var(--ink);line-height:1.6;resize:vertical;
}
.kb-veld input{height:38px;padding:0 11px}
.kb-veld select{height:38px;padding:0 11px}
.kb-veld input:focus, .kb-veld textarea:focus, .kb-veld select:focus{outline:none;border-color:var(--green)}

.veld-kop{font-size:12px;font-weight:600;color:var(--ink-3);margin-bottom:5px}
.note svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;flex-shrink:0;margin-top:2px}

tr.gearchiveerd td{opacity:.5}
tr.gearchiveerd:hover td{opacity:.75}
.veld-uitleg{font-size:12px;color:var(--ink-3);line-height:1.6;margin:2px 0 12px;padding-left:107px}

.dt-in{
  height:29px;padding:0 8px;border:1px solid transparent;border-radius:6px;
  font:inherit;font-size:12.5px;color:var(--ink-2);background:none;cursor:pointer;
  font-variant-numeric:tabular-nums;
}
.dt-in:hover{border-color:var(--line-2);background:var(--surface)}
.dt-in:focus{outline:none;border-color:var(--green);background:var(--surface)}
.dt-in:invalid, .dt-in[value=""]{color:var(--ink-3)}
.dt-in.laat{color:var(--alert);font-weight:600}
.veld-hint{font-size:11.5px;color:var(--ink-3);white-space:nowrap}
.fin .row input[type=date]{flex:0 0 auto;width:auto;min-width:150px}

.lev-sel{
  height:29px;padding:0 22px 0 8px;border-radius:6px;border:1px solid transparent;
  font:inherit;font-size:12.5px;color:var(--ink-2);cursor:pointer;appearance:none;max-width:190px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239A938E' stroke-width='2.4'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 5px center;background-size:11px;
  text-overflow:ellipsis;
}
.lev-sel:hover{border-color:var(--line-2);background-color:var(--surface)}
.lev-sel:focus{outline:none;border-color:var(--green);background-color:var(--surface)}
.toon-btn{
  width:100%;padding:11px;border:1px dashed var(--line-2);border-radius:9px;
  font-size:13px;color:var(--ink-2);font-weight:500;background:none;
  transition:border-color .12s,color .12s;
}
.toon-btn:hover{border-color:var(--ink-3);color:var(--ink)}
.keuze{display:flex;gap:7px;flex:1;flex-wrap:wrap}
.kz{
  padding:8px 13px;border:1px solid var(--line-2);border-radius:8px;
  font-size:12.5px;font-weight:500;background:var(--surface);color:var(--ink-2);
  transition:all .12s;
}
.kz:hover{border-color:var(--ink-3)}
.kz.on{background:var(--green-tint);border-color:var(--green);color:var(--green-deep);font-weight:600}

.st-sel{
  height:29px;padding:0 24px 0 9px;border-radius:6px;border:1px solid transparent;
  font:inherit;font-size:11.5px;font-weight:600;cursor:pointer;appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236E6864' stroke-width='2.4'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 6px center;background-size:11px;
}
.st-sel:focus{outline:none;border-color:var(--ink-3)}
.st-green{background-color:var(--green-tint);color:var(--green-deep)}
.st-blue{background-color:var(--blue-tint);color:var(--blue-deep)}
.st-orange{background-color:var(--orange-tint);color:var(--orange-deep)}
.st-alert{background-color:var(--alert-tint);color:var(--alert)}
.st-grey{background-color:#EEEDE6;color:var(--ink-2)}
.btn-mini{height:29px;padding:0 10px;font-size:12px;font-weight:600;border-radius:7px}
.ord-note{display:block;font-size:11.5px;color:var(--ink-3);font-weight:400;margin-top:2px;max-width:280px;line-height:1.5}
.fac-act .row input, .fin .row input{
  flex:1;height:38px;padding:0 11px;border:1px solid var(--line-2);border-radius:8px;
  background:var(--surface);font:inherit;font-size:13.5px;color:var(--ink);min-width:0;
}
.fin .row{display:flex;align-items:center;gap:9px;margin-bottom:11px}
.fin .row-zoek{flex-direction:column;align-items:stretch;gap:6px}
.fin .row-zoek label{min-width:0}
.fin .row label{font-size:12.5px;color:var(--ink-2);font-weight:600;min-width:98px}
.fin .row select{flex:1;height:38px;padding:0 11px;border:1px solid var(--line-2);border-radius:8px;background:var(--surface);font:inherit;font-size:13.5px;color:var(--ink);min-width:0}
.fin .row input:focus, .fin .row select:focus{outline:none;border-color:var(--green)}

.btn-weiger{color:var(--alert);border-color:var(--line-2)}
.btn-weiger:hover{border-color:var(--alert);background:var(--alert-tint)}
.tab-n.red{background:var(--alert)}
.weiger-bar{
  display:flex;gap:10px;padding:12px 14px;background:var(--alert-tint);border-radius:10px;
  font-size:12.5px;color:var(--alert);line-height:1.6;margin-top:13px;font-weight:500;
}
.weiger-bar svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;flex-shrink:0;margin-top:2px}
.weiger-bar b{font-weight:700}
.concept-head{font-size:12.5px;font-weight:600;color:var(--ink-2);margin:15px 0 8px}

.fac-tabs{display:flex;border-bottom:1px solid var(--line);padding:0 6px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
.fac-tabs::-webkit-scrollbar{display:none}
.fac-tab{
  padding:13px 11px;font-size:13px;font-weight:600;color:var(--ink-3);white-space:nowrap;flex-shrink:0;
  border-bottom:2px solid transparent;margin-bottom:-1px;display:flex;align-items:center;gap:6px;
}
.fac-tab:hover{color:var(--ink-2)}
.fac-tab.on{color:var(--ink);border-bottom-color:var(--green)}
.tab-n{background:var(--orange);color:#fff;font-size:10.5px;font-weight:700;padding:1px 6px;border-radius:9px;line-height:1.5}
.tab-n.grey{background:#DEDCD4;color:var(--ink-2)}
.fac-meta{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.yuki-line{
  display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-2);
  padding:9px 12px;background:#F7F6F0;border-radius:8px;font-weight:500;
}
.yuki-line svg{width:15px;height:15px;stroke:var(--ink-3);fill:none;stroke-width:1.8;flex-shrink:0}
.yuki-line b{font-weight:600;color:var(--ink)}
.fac-act select:disabled{background:#F4F3EE;color:var(--ink-3);cursor:not-allowed}

.split-head{display:flex;align-items:center;gap:9px;margin-bottom:12px;font-size:12.5px;font-weight:600;color:var(--ink-2)}
.split-head span{flex:1}
.sp-row{gap:8px}
.sp-row select{flex:1;min-width:0}
.sp-row .zoek-select-cel{flex:1;min-width:0;position:relative}
.eur-in{display:flex;align-items:center;gap:5px;border:1px solid var(--line-2);border-radius:8px;height:38px;padding:0 10px;background:var(--surface);flex-shrink:0}
.eur-in:focus-within{border-color:var(--green)}
.eur-in span{font-size:13px;color:var(--ink-3);font-weight:600}
.eur-in input, .fac-act .row .eur-in input, .fin .row .eur-in input{width:78px;border:none;background:none;font:inherit;font-size:13.5px;text-align:right;font-variant-numeric:tabular-nums;padding:0;height:100%;color:var(--ink)}
.eur-in input:focus{outline:none}
.split-sum{display:flex;align-items:center;padding:10px 13px;border-radius:9px;font-size:12.5px;font-weight:600;margin-bottom:13px}
.split-sum span{flex:1}
.split-sum b{font-variant-numeric:tabular-nums;font-size:14px}
.split-sum.ok{background:var(--green-tint);color:var(--green-deep)}
.split-sum.off{background:var(--orange-tint);color:var(--orange-deep)}
.mini[disabled]{cursor:not-allowed}
.mini[disabled]:hover{border-color:var(--line);background:var(--surface)}
.mini[disabled]:hover svg{stroke:var(--ink-3)}

.fin-acts{display:flex;gap:5px;margin-left:11px}
.mini{
  width:27px;height:27px;border-radius:7px;border:1px solid var(--line);
  background:var(--surface);display:inline-flex;align-items:center;justify-content:center;
  transition:border-color .12s,background .12s;
}
.mini svg{width:14px;height:14px;stroke:var(--ink-3);fill:none;stroke-width:1.9}
.mini:hover{border-color:var(--blue);background:var(--blue-tint)}
.mini:hover svg{stroke:var(--blue)}
.mini.danger:hover{border-color:var(--alert);background:var(--alert-tint)}
.mini.danger:hover svg{stroke:var(--alert)}
.mini.doc-fav.on{border-color:var(--orange);background:var(--orange-tint)}
.mini.doc-fav.on svg{stroke:var(--orange);fill:var(--orange)}
.mini.doc-fav:hover{border-color:var(--orange);background:var(--orange-tint)}
.mini.doc-fav:hover svg{stroke:var(--orange)}
.finline .v{margin-left:auto}

.empty{padding:44px 20px;text-align:center}
.empty svg{width:30px;height:30px;stroke:var(--ink-3);fill:none;stroke-width:1.6;margin-bottom:11px}
.empty strong{display:block;font-size:14.5px;font-weight:600;margin-bottom:4px}
.empty p{font-size:13px;color:var(--ink-3);max-width:330px;margin:0 auto;line-height:1.65}

.note{display:flex;gap:10px;padding:12px 15px;background:var(--blue-tint);border-radius:10px;font-size:13px;color:var(--blue-deep);line-height:1.6;margin-bottom:18px;font-weight:500}
.note svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;flex-shrink:0;margin-top:2px}

.menu-toggle{display:none;width:36px;height:36px;border-radius:8px;border:1px solid var(--line-2);background:var(--surface);align-items:center;justify-content:center;flex-shrink:0}
.menu-toggle svg{width:19px;height:19px;stroke:var(--ink);fill:none;stroke-width:2}
.rail-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:15}
.rail-overlay.on{display:block}

.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:100;align-items:center;justify-content:center;padding:24px}
.modal-box{background:var(--surface);border-radius:13px;max-width:900px;width:100%;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 8px 30px rgba(0,0,0,.25)}
.modal-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line)}
.modal-head h3{font-size:15px;font-weight:600}
.modal-body{padding:16px;overflow:auto;flex:1}
.modal-body .pdf-frame{height:75vh}

@media(max-width:1080px){.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.g23,.split{grid-template-columns:minmax(0,1fr)}.split > *:last-child{position:static;max-height:none;overflow-y:visible}}
@media(max-width:820px){
  :root{--rail-w:0px}
  .rail{transform:translateX(-100%);width:260px;transition:transform .2s ease}
  .rail.menu-open{transform:translateX(0)}
  .main{margin-left:0}
  .page,.topbar{padding-left:18px;padding-right:18px}
  .g4{grid-template-columns:minmax(0,1fr)}
  .menu-toggle{display:flex}
}

@media(max-width:520px){
  .topbar{padding:0 14px;gap:10px}
  .page{padding:16px 14px 50px}
  .topbar h2{font-size:15.5px}
  .topbar .sub{display:none}
  table{display:block;overflow-x:auto;white-space:nowrap}
  .int-veld{flex-direction:column;align-items:flex-start;gap:2px}
  .int-veld label{min-width:0}
  .int-val{word-break:break-word}
}

/* ---------- FASE 1: AANVULLINGEN ---------- */
.login-fout{background:rgba(192,69,59,.18);color:#fff;border:1px solid rgba(192,69,59,.4);border-radius:8px;padding:9px 12px;font-size:12.5px;margin-bottom:14px;line-height:1.5}
.flash{padding:11px 15px;border-radius:9px;font-size:13px;font-weight:500;margin-bottom:16px;line-height:1.6}
.flash.ok{background:var(--green-tint);color:var(--green-deep)}
.flash.fout{background:var(--alert-tint);color:var(--alert)}
.perm-btn{background:none;border:none;padding:0;cursor:pointer}
.perm-btn[disabled]{cursor:not-allowed;opacity:.5}
.veld{margin-bottom:13px}
.veld label{display:block;font-size:12.5px;font-weight:600;color:var(--ink-2);margin-bottom:5px}
.veld input,.veld select{width:100%;height:38px;padding:0 11px;border:1px solid var(--line-2);border-radius:8px;background:var(--surface);font:inherit;font-size:13.5px;color:var(--ink)}
.veld input:focus,.veld select:focus{outline:none;border-color:var(--green)}
.rij-acties{display:flex;gap:7px;justify-content:flex-end}
.stub{padding:44px 20px;text-align:center;color:var(--ink-3)}
.stub strong{display:block;font-size:14.5px;font-weight:600;color:var(--ink);margin-bottom:6px}
.groep-kop td{background:var(--cream);font-weight:600;color:var(--ink-2);padding:8px 14px;font-size:12.5px;border-top:1px solid var(--line)}

/* Administratie: maandelijkse checklist per bedrijf */
.adm-kop{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:15px}
.adm-maandnav{display:flex;align-items:center;gap:10px;margin-left:auto}
.adm-maandnav b{min-width:130px;text-align:center;font-size:13.5px;font-weight:600;text-transform:capitalize}
.adm-maandnav a.mini{display:inline-flex;align-items:center;justify-content:center}
.adm-pad{padding:16px 18px}
.adm-sub{margin-left:auto;font-size:12px;color:var(--ink-3);font-weight:500}
.adm-totaal{display:flex;align-items:baseline;gap:12px;margin-bottom:9px}
.adm-groot{font-size:28px;font-weight:700;letter-spacing:-.03em}
.adm-totaal span:last-child{font-size:12.5px;color:var(--ink-3)}
.adm-bar{height:10px;border-radius:6px;background:var(--line);overflow:hidden}
.adm-bar.klein{height:6px}
.adm-bar i{display:block;height:100%;border-radius:6px;background:var(--green);transition:width .2s}
.adm-bar.klaar i{background:var(--green-deep)}
.adm-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:15px}
.adm-tab{background:var(--surface);border:2px solid var(--line);border-radius:13px;padding:13px 15px;text-align:left;color:inherit;font:inherit;cursor:pointer}
.adm-tab:hover{border-color:var(--ink-3)}
.adm-tab.on{border-color:var(--blue);background:var(--blue-tint)}
.adm-tab-naam{display:flex;justify-content:space-between;gap:8px;font-weight:700;font-size:13.5px;margin-bottom:8px}
.adm-tab-naam em{font-style:normal;color:var(--ink-3);font-weight:600;white-space:nowrap}
.adm-sectiekop{display:flex;align-items:center;gap:10px;padding:12px 18px;border-bottom:1px solid var(--line);background:#FAFCF4;border-radius:13px 13px 0 0}
.adm-sectiekop h3{margin:0;font-size:14px}
.adm-tijd{font-size:12px;color:var(--ink-3);font-weight:500}
.adm-sp{margin-left:auto;font-size:12px;font-weight:700;color:var(--ink-2)}
.adm-punt{display:flex;align-items:flex-start;gap:11px;padding:10px 18px;border-bottom:1px solid var(--line)}
.adm-punt:last-child{border-bottom:none}
.adm-punt input[type=checkbox]{width:18px;height:18px;margin-top:1px;flex:none;accent-color:var(--green);cursor:pointer}
.adm-punt label{flex:1;cursor:pointer;line-height:1.45;font-size:13.5px}
.adm-punt.klaar label{color:var(--ink-3);text-decoration:line-through}
.adm-wanneer{font-size:11.5px;color:var(--green-deep);font-weight:600;white-space:nowrap}
.adm-badge{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:5px;background:var(--orange-tint);color:#B35A0C;font-size:10.5px;font-weight:700;text-decoration:none}
.adm-invoer{width:72px;margin-left:8px;padding:3px 7px;border:1px solid var(--line);border-radius:7px;font:inherit;text-decoration:none}
.adm-textarea{width:100%;min-height:80px;padding:10px 12px;border:1px solid var(--line);border-radius:9px;font:inherit;resize:vertical}
.adm-textarea:focus,.adm-invoer:focus{outline:none;border-color:var(--green)}
.adm-hrij{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:13px 18px;border-bottom:1px solid var(--line);color:inherit;text-decoration:none}
.adm-hrij:last-child{border-bottom:none}
.adm-hrij:hover{background:#FAFCF4}
.adm-hmaand{display:flex;flex-direction:column;gap:6px;align-items:flex-start;min-width:140px;text-transform:capitalize}
.adm-hbedrijven{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;flex:1;min-width:280px}
.adm-hb-top{display:flex;justify-content:space-between;gap:6px;font-size:11.5px;color:var(--ink-2);margin-bottom:5px}
.adm-hb-top em{font-style:normal;color:var(--ink-3)}
.adm-htot{font-size:18px;font-weight:700;min-width:48px;text-align:right}
@media(max-width:860px){.adm-tabs{grid-template-columns:minmax(0,1fr)}.adm-maandnav{margin-left:0}.adm-hbedrijven{grid-template-columns:minmax(0,1fr)}}