/* Fluch: de huisstijl bovenop app.css. Grafiet, laseroranje, staalgrijs; scherpe hoeken en haarlijnen
   zoals de homepage. Klantgerichte pagina's (offerte, klantportaal) houden de kleuren van het bedrijf zelf. */
*,*::before,*::after{border-radius:0!important}
body{font-size:15px}
::-webkit-scrollbar-thumb{background:#C9C6BE;border:2px solid var(--bg)}
:focus-visible{outline:2px solid var(--laser);outline-offset:2px}

/* Koppen in Barlow Condensed */
.page-head h1{font:800 32px/1.02 var(--cond);text-transform:uppercase;letter-spacing:.4px}
.page-head p{margin-top:6px}
.card-h h2,.card-h h3,.start-h h2,.modal-h h2,.sheet h1,.portal-hero h1{font-family:var(--cond);font-weight:700;text-transform:uppercase;letter-spacing:.5px}
.card-h h2,.card-h h3{font-size:18px;line-height:1.1}
.modal-h h2{font-size:21px}
.sheet h1{font-size:32px}
.portal-hero h1{font-size:30px}
.kpi .v,.pipeline b,.totals-bar b,.part-h .price b,.pricebox .big,.sheet-tot .grand{font-family:var(--cond);font-weight:700;letter-spacing:.3px}
.kpi .v{font-size:34px}
.pipeline b{font-size:26px}
.totals-bar b{font-size:20px}
.totals-bar .grand b{font-size:26px}
.part-h .price b{font-size:20px}
.t th,.nav-label,.tenant .cap,.kpi .l,.pipeline span,.totals-bar span{font-family:var(--mono);font-weight:500;font-size:11px;letter-spacing:.07em;text-transform:uppercase}
.kpi .l,.pipeline span,.totals-bar span{color:var(--muted)}
.part-h .pos{background:var(--grafiet);color:#fff}
.part-h .title input{font-size:16px}

/* Knoppen: hoekig, geen glans */
.btn:hover{background:#FAF9F6;border-color:#A9A59B}
.btn-accent,.btn-primary{font:700 15px/1 var(--cond);text-transform:uppercase;letter-spacing:.7px;border-width:2px}
.btn-sm.btn-accent,.btn-sm.btn-primary{font-size:14px}
.btn-accent:hover{background:var(--grafiet);border-color:var(--grafiet);color:#fff;filter:none}
.btn-primary{background:var(--grafiet);border-color:var(--grafiet);color:#fff}
.btn-primary:hover{background:#2B2F37;border-color:#2B2F37;filter:none}
.btn-ghost:hover{background:#ECEAE4}

/* Zijbalk */
.side{padding:20px 12px 16px}
.side-logo{display:block;padding:2px 8px 18px}
.side-logo img{display:block;height:30px;width:auto}
.tenant{background:transparent;border:1px solid rgba(255,255,255,.14)}
.badge-logo{background:#fff;color:var(--grafiet);font:700 16px var(--cond)}
.nav a:hover{background:rgba(255,255,255,.05)}
.nav a.on{background:rgba(255,255,255,.07);box-shadow:inset 3px 0 0 var(--laser)}
.nav .count{background:var(--laser);color:var(--grafiet);font:600 11px/20px var(--mono)}
.side-foot .made{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--staal-2)}
.side-foot .made a{color:var(--side-text)}
.top-logo{display:none}
@media (max-width:900px){
  .top-logo{display:block;height:20px;width:auto;flex:none}
  .topbar b{font-weight:500;color:var(--side-text);border-left:1px solid rgba(255,255,255,.2);padding-left:10px}
  .side-logo{display:none}
}

/* Statussen en meldingen */
.st{font-weight:600}
.summary{border-left-color:var(--staal);background:#F7F6F3;color:#30353D}
.ask{border-color:#EBCB86;background:#FFFAEE}
.ask.info{border-color:var(--line-2);background:#F7F6F3}
.ask.info h3{color:var(--text)}
.ask.info h3 .i{color:var(--laser)}
.eerder{background:#F7F6F3}
.eerder > .i{color:var(--staal)}
.drop:hover,.drop.over{border-color:var(--grafiet);background:#FBFAF7}
.chip.on{border-color:var(--grafiet);box-shadow:inset 0 0 0 1px var(--grafiet)}
.tabs-line a.on{border-bottom:3px solid var(--laser);margin-bottom:-1px}
.part.unsure{border-color:var(--flag-line)}
.part.picked{border-color:var(--grafiet);box-shadow:0 0 0 2px var(--laser)}
.reading .bar i{background:var(--laser)}
.reading li.now::before{background:var(--laser);box-shadow:none}
.modal-bg{background:rgba(22,24,29,.55)}
.modal{border-top:4px solid var(--laser);box-shadow:0 24px 50px -24px rgba(22,24,29,.6)}
.toast{background:var(--grafiet);border-left:4px solid var(--laser);box-shadow:0 14px 30px -16px rgba(22,24,29,.7)}
.start{border-top:4px solid var(--grafiet)}
.start-tegel > .i{color:var(--laser)}
.start-n{background:var(--grafiet);color:#fff}
.staffel > span.on{background:var(--grafiet)}
.cs-pop{box-shadow:0 16px 36px -16px rgba(22,24,29,.45)}
.cs-opt.act{background:#F3F2EE}
.cs-vink{stroke:var(--laser)}

/* Klantgerichte pagina's in de kleuren van het bedrijf zelf */
.portal{--side:var(--t-side);--accent:var(--t-accent);--accent-ink:var(--t-accent-ink)}
.portal .btn-primary{background:var(--t-side);border-color:var(--t-side)}
.portal-hero{background:var(--t-side)}
.sheet-brand .badge-logo{background:var(--t-side);color:var(--t-accent)}

/* Controlelijst op de aanvraag */
.controle{background:#fff;border:1px solid var(--line);border-top:4px solid var(--flag-line);margin-bottom:16px}
.controle.klaar{border-top-color:var(--ok)}
.controle-h{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;padding:12px 16px;border-bottom:1px solid var(--line)}
.controle.klaar .controle-h{border-bottom:0}
.controle-h h2{margin:0;font:700 19px/1.1 var(--cond);text-transform:uppercase;letter-spacing:.5px}
.controle-h p{margin:0;color:var(--muted);font-size:13.5px;flex:1;min-width:220px}
.controle-n{font:600 12px/1 var(--mono);padding:5px 8px;background:var(--flag);border:1px solid var(--flag-line);color:#6B4A00;white-space:nowrap}
.controle.klaar .controle-n{background:var(--ok-bg);border-color:#9ED3BC;color:var(--ok)}
.controle ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.controle li{display:flex;align-items:flex-start;gap:10px;padding:10px 16px;border-bottom:1px solid var(--line);min-width:0}
.controle li:nth-child(odd){border-right:1px solid var(--line)}
.controle li:last-child:nth-child(odd){grid-column:1/-1;border-right:0}
.controle .mk{width:12px;height:12px;flex:none;margin-top:4px;border:2px solid var(--flag-line);background:var(--flag)}
.controle li.rood .mk{border-color:var(--bad);background:var(--bad-bg)}
.controle li.vraag .mk{border-color:var(--staal);background:#fff}
.controle li.stap .mk{border-color:var(--laser);background:var(--laser)}
.controle .tx{flex:1;min-width:0;font-size:14px;line-height:1.4}
.controle .tx b{font-weight:600}
.controle .tx span{display:block;color:var(--muted);font-size:13px}
.controle .acts{display:flex;gap:6px;flex:none;align-items:center;flex-wrap:wrap}
.part.zoek{box-shadow:0 0 0 3px var(--laser)}
.exp{position:relative}
.exp > summary{list-style:none}
.exp > summary::-webkit-details-marker{display:none}
.exp-m{position:absolute;right:0;top:calc(100% + 4px);z-index:20;min-width:240px;background:#fff;border:1px solid var(--line-2);box-shadow:0 14px 30px -16px rgba(22,24,29,.45);padding:4px;display:grid}
.exp-m button{display:flex;align-items:center;gap:8px;width:100%;padding:9px 10px;border:0;background:transparent;text-align:left;font-size:13.5px}
.exp-m button:hover{background:#F3F2EE}
.exp-m .i{width:15px;height:15px;color:var(--muted)}
.lees-opnieuw{display:flex;gap:6px;flex-wrap:wrap}
@media (max-width:900px){
  .controle ol{grid-template-columns:1fr}
  .controle li:nth-child(odd){border-right:0}
}
@media (max-width:560px){
  .controle li{flex-wrap:wrap;padding:10px 14px}
  .controle .acts{width:100%;padding-left:22px}
  .page-head .actions{width:100%}
  .page-head .actions .btn-accent{flex:1}
}

/* Rondleiding voor een nieuw bedrijf */
.tour{position:fixed;right:20px;bottom:20px;z-index:85;width:min(390px,calc(100vw - 32px));background:var(--grafiet);color:#fff;border-top:4px solid var(--laser);box-shadow:0 24px 50px -24px rgba(0,0,0,.7)}
.tour-h{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 16px 0;font:500 11px var(--mono);color:var(--staal-2);letter-spacing:.08em;text-transform:uppercase}
.tour-h button{border:0;background:transparent;color:var(--staal-2);padding:4px;display:grid;place-items:center}
.tour-h button:hover{color:#fff}
.tour-stappen{display:flex;gap:4px;margin:10px 16px 0}
.tour-stappen span{flex:1;height:4px;background:rgba(255,255,255,.14)}
.tour-stappen span.klaar{background:#fff}
.tour-stappen span.on{background:var(--laser)}
.tour-b{padding:12px 16px 14px}
.tour-b h3{margin:0 0 6px;font:800 24px/1 var(--cond);text-transform:uppercase;letter-spacing:.4px}
.tour-b p{margin:0 0 8px;color:#C3C8D0;font-size:14px;line-height:1.5}
.tour-b ul{margin:6px 0 0;padding:0;list-style:none;display:grid;gap:4px;font-size:13.5px;color:#C3C8D0}
.tour-b li{position:relative;padding-left:18px}
.tour-b li::before{content:"";position:absolute;left:0;top:6px;width:8px;height:8px;border:1.5px solid var(--staal-2)}
.tour-b li.af{color:#fff}
.tour-b li.af::before{background:var(--laser);border-color:var(--laser)}
.tour-f{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding:0 16px 16px}
.tour-f .btn:not(.btn-accent){background:transparent;border-color:rgba(255,255,255,.28);color:#fff}
.tour-f .btn:not(.btn-accent):hover{background:rgba(255,255,255,.08);border-color:#fff}
.tour-f .btn-accent:hover{background:#fff;border-color:#fff;color:var(--grafiet)}
.tour-f .later{margin-left:auto;border:0;background:none;color:var(--staal-2);font-size:13px;text-decoration:underline;padding:4px}
.tour-f .later:hover{color:#fff}
.tour-doel{outline:2px solid var(--laser);outline-offset:-2px}
body.tour-open .main{padding-bottom:320px}
@media (max-width:560px){.tour{left:16px;right:16px;bottom:16px;width:auto}.tour-b h3{font-size:21px}}
@media print{.tour,.controle{display:none!important}}

/* ---------- Uitbreidingen ---------- */
.controle li.tek .mk{border-color:var(--laser);background:#FFF1E8}
.tc{padding:8px 14px;border-top:1px dashed var(--line);background:#FFF7F1;font-size:13px}
.tc > b{display:flex;align-items:center;gap:6px;color:#9A3E00;font-weight:600}
.tc > b .i{width:15px;height:15px}
.tc ul{margin:4px 0 0;padding-left:20px;color:#4A2A10}
.calc-oud{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:8px;padding:6px 8px;background:#FFF4E5;color:#7A3E06;font-family:var(--sans);font-size:12.5px}
.calc .calc-oud{display:flex;justify-content:flex-start}
.calc-oud .i{width:14px;height:14px}
.seg.taal{margin:0;padding:2px;background:#E9E7E1}
.seg.taal button{padding:6px 10px;font:600 12px var(--mono)}
.t.rev tr.anders td{background:#FFF7F1}
.t.rev td:last-child{white-space:nowrap;color:#9A3E00}

/* Dashboard */
.dash{margin-bottom:16px}
.dash-b{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1.2fr) minmax(0,.9fr);gap:20px;align-items:stretch}
.card-b.dash-b{padding-bottom:30px}
.dash-grafiek{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:6px;align-items:end;height:170px;border-bottom:1px solid var(--line-2);padding-top:6px}
.dash-kol{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;position:relative}
.dash-bar{display:block;width:100%;max-width:34px;min-height:2px;background:var(--staal)}
.dash-kol.nu .dash-bar{background:var(--laser)}
.dash-n{font:600 12px var(--mono);margin-bottom:3px}
.dash-wk{position:absolute;bottom:-20px;font:500 10.5px var(--mono);color:var(--muted);white-space:nowrap}
.dash-cijfers{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);align-self:start}
.dash-cijfers > div{background:#fff;padding:10px 12px}
.dash-cijfers dt{font:500 11px var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.dash-cijfers dd{margin:4px 0 2px;font:700 26px/1 var(--cond)}
.dash-cijfers span{font-size:12px;color:var(--muted)}
.dash-redenen > b{display:block;font:700 16px var(--cond);text-transform:uppercase;letter-spacing:.4px;margin-bottom:6px}
.dash-redenen ol{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.dash-redenen li{display:flex;justify-content:space-between;gap:8px;padding:6px 8px;background:#F7F6F3;font-size:13.5px}
.dash-redenen li b{font:600 13px var(--mono)}

/* Levertijd */
.lev-kop{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.lev-kop > div{flex:1;min-width:180px;display:flex;flex-direction:column}
.lev-kop > div b{font:700 22px/1.1 var(--cond);text-transform:uppercase;letter-spacing:.3px}
.t.lev-t td,.t.lev-t th{padding:7px 10px}

/* Werkbon */
.werkbon .wb-top{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-bottom:3px solid var(--grafiet);padding-bottom:14px;margin-bottom:18px}
.wb-label{font:500 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.werkbon .wb-top h1{margin:2px 0 0;font:600 30px var(--mono);text-transform:none;letter-spacing:0}
.werkbon .wb-top dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:2px 12px;font-size:13.5px}
.werkbon dt{color:var(--muted)}
.werkbon dd{margin:0}
.wb-deel{border:1px solid var(--line-2);margin-bottom:16px;break-inside:avoid;page-break-inside:avoid}
.wb-kop{display:flex;align-items:center;gap:10px;padding:8px 12px;background:#F3F2EE;border-bottom:1px solid var(--line-2)}
.wb-kop .pos{width:26px;height:26px;display:grid;place-items:center;background:var(--grafiet);color:#fff;font:600 12px var(--mono);flex:none}
.wb-kop b{flex:1;font-size:15.5px}
.wb-aantal{font:700 18px var(--cond);white-space:nowrap}
.wb-grid{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:14px;padding:10px 12px}
.wb-grid dl{margin:0;display:grid;grid-template-columns:110px 1fr;gap:3px 10px;font-size:13px;align-content:start}
.wb-schets{margin:0;border:1px solid var(--line)}
.wb-schets svg{display:block;width:100%;height:auto}
.wb-t{width:100%;border-collapse:collapse;font-size:13px}
.wb-t th{text-align:left;padding:6px 8px;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);font:500 10.5px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.wb-t td{padding:7px 8px;border-bottom:1px solid var(--line);vertical-align:top}
.wb-t .num{text-align:right;white-space:nowrap}
.wb-t .spec{display:block;font-size:12px;color:var(--muted)}
.wb-t .vak{width:30px}
.hok{display:inline-block;width:16px;height:16px;border:1.5px solid var(--grafiet)}
.wb-t td.paraaf{width:90px}
.wb-voet{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:24px;font-size:13px}

/* Nacalculatie */
.nc-meer{color:var(--bad);font-weight:600}
.nc-minder{color:var(--ok);font-weight:600}
.nc-ok{color:var(--muted)}
.voorstel{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.voorstel li{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 12px;border-left:3px solid var(--laser);background:#FAF9F6}
.voorstel .btn{white-space:normal;height:auto;min-height:32px;padding:6px 10px}

/* Prijs-ijking */
.ijk-kies{display:flex;gap:14px;flex-wrap:wrap;align-items:flex-end}
.ijk-ok{color:var(--ok);font-weight:600}
.ijk-mis{color:var(--bad);font-weight:600}
.ijk-t td{vertical-align:middle}
.ijk-totaal td{background:#F7F6F3;font-weight:600}
.oorzaken{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.oorzaken li{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:12px 14px;border:1px solid var(--line);border-left:4px solid var(--laser)}
.oorzaken li > div{flex:1;min-width:220px}
.oorzaken p{margin:4px 0 0;color:var(--muted);font-size:13.5px}

/* Materiaalprijzen */
.prijsdatum{white-space:nowrap}
.prijsdatum.oud{color:#9A3E00;font-weight:500}
.prijsdatum .btn{display:flex;margin-top:2px}
.prijs-grens{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px;color:var(--text)}
.prijs-waarsch{display:inline-flex;align-items:center;gap:6px;color:#9A3E00;font-weight:500}
.prijs-waarsch .i{width:15px;height:15px}

@media (max-width:1180px){.dash-b{grid-template-columns:1fr 1fr}.dash-redenen{grid-column:1/-1}}
@media (max-width:700px){.dash-b{grid-template-columns:1fr}.wb-grid{grid-template-columns:1fr}.wb-schets{max-width:320px}}
@media (max-width:560px){.wb-t{min-width:520px}.werkbon .wb-top h1{font-size:24px}}
@media print{.wb-deel{border-color:#999}.werkbon .table-wrap{overflow:visible}}

/* Fluch AI: knop rechtsonder en het gesprek ernaast */
.ai-knop{position:fixed;right:20px;bottom:20px;z-index:80;display:inline-flex;align-items:center;gap:8px;height:48px;padding:0 18px;border:0;background:var(--grafiet);color:#fff;font:700 17px var(--cond);text-transform:uppercase;letter-spacing:.5px;box-shadow:0 14px 30px -14px rgba(22,24,29,.8);cursor:pointer}
.ai-knop .i{width:20px;height:20px;color:var(--laser)}
.ai-knop:hover{background:#000}
.ai-knop[aria-expanded="true"]{display:none}
body.tour-open .ai-knop{display:none}
.ai-paneel{position:fixed;right:20px;bottom:20px;z-index:86;width:min(440px,calc(100vw - 40px));height:min(640px,calc(100vh - 40px));display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line-2);border-top:4px solid var(--laser);box-shadow:0 28px 60px -24px rgba(22,24,29,.55)}
.ai-paneel[hidden]{display:none}
.ai-h{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:12px 14px;background:var(--grafiet);color:#fff}
.ai-h b{display:flex;align-items:center;gap:8px;font:700 19px var(--cond);text-transform:uppercase;letter-spacing:.5px}
.ai-h b .i{color:var(--laser)}
.ai-scherm{display:block;margin-top:2px;font-size:13px;color:#C3C8D0}
.ai-h>div:last-child{display:flex;align-items:center;gap:6px}
.ai-h button{border:0;background:transparent;color:#C3C8D0;font-size:13px;cursor:pointer;padding:6px}
.ai-h button:hover{color:#fff}
.ai-nieuw{text-decoration:underline;text-underline-offset:3px}
.ai-log{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;font-size:15.5px;line-height:1.55}
.ai-log p{margin:0 0 8px}
.ai-log p:last-child{margin-bottom:0}
.ai-log ul{margin:0 0 8px;padding-left:20px}
.ai-log li{margin:2px 0}
.ai-welkom{color:var(--muted)}
.ai-welkom b{color:var(--text)}
.ai-msg{max-width:92%;padding:10px 12px}
.ai-ik{align-self:flex-end;background:#EFEDE7;border:1px solid var(--line)}
.ai-zij{align-self:flex-start;background:#fff;border:1px solid var(--line);border-left:3px solid var(--laser)}
.ai-fout{border-left-color:#B42318;background:#FDF0EE}
.ai-kopie{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:4px 8px;border:1px solid var(--line-2);background:#fff;font-size:13px;color:var(--muted);cursor:pointer}
.ai-kopie .i{width:14px;height:14px}
.ai-kopie:hover{color:var(--text);border-color:var(--text)}
.ai-denkt{display:flex;gap:5px;padding:6px 0}
.ai-denkt span{width:7px;height:7px;background:var(--laser);animation:aiDenk 1s infinite ease-in-out}
.ai-denkt span:nth-child(2){animation-delay:.15s}
.ai-denkt span:nth-child(3){animation-delay:.3s}
@keyframes aiDenk{0%,80%,100%{opacity:.25}40%{opacity:1}}
@media (prefers-reduced-motion:reduce){.ai-denkt span{animation:none;opacity:.7}}
.ai-vragen{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 10px}
.ai-vragen:empty{display:none}
.ai-vraag{padding:7px 10px;border:1px solid var(--line-2);background:#fff;font-size:14px;color:var(--text);text-align:left;cursor:pointer}
.ai-vraag:hover{border-color:var(--grafiet);background:#F7F6F2}
.ai-blok{width:100%;margin:0;padding:8px 10px;background:#FFF4E5;border-left:3px solid var(--laser);font-size:14px}
.ai-form{display:flex;gap:8px;padding:10px 14px;border-top:1px solid var(--line)}
.ai-form textarea{flex:1;min-height:46px;max-height:140px;resize:vertical;padding:10px 12px;border:1px solid var(--line-2);font:inherit;font-size:15.5px;line-height:1.45}
.ai-form textarea:focus{outline:2px solid var(--laser);outline-offset:-1px;border-color:transparent}
.ai-stuur{flex:none;width:46px;border:0;background:var(--laser);color:var(--grafiet);display:grid;place-items:center;cursor:pointer}
.ai-stuur .i{width:20px;height:20px}
.ai-noot{margin:0;padding:0 14px 12px;font-size:12.5px;color:var(--muted)}
@media (max-width:700px){
  .ai-knop{right:16px;bottom:16px;height:46px}
  .ai-paneel{left:0;right:0;bottom:0;width:auto;height:min(88vh,calc(100vh - 56px))}
}
@media print{.ai-knop,.ai-paneel{display:none!important}}

/* Zekerheid per prijs */
.part-st{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;min-width:0}
.zeker{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size:12.5px;font-weight:500;line-height:1.4;max-width:100%}
.zeker .dot{width:8px;height:8px;border-radius:50%;flex:none}
.zeker-hoog{background:var(--ok-bg);color:var(--ok)}.zeker-hoog .dot{background:var(--ok)}
.zeker-midden{background:var(--warn-bg);color:var(--warn)}.zeker-midden .dot{background:var(--warn)}
.zeker-laag{background:var(--bad-bg);color:var(--bad)}.zeker-laag .dot{background:var(--bad)}
.zeker-sam{display:flex;flex-direction:column;gap:4px;padding:10px 14px;margin-bottom:12px;border:1px solid var(--line);border-radius:8px;background:#F7F6F3;font-size:13.5px;line-height:1.5}
.zeker-sam a{color:inherit}
/* Lijkt op eerder werk */
.eerder.gelijk{background:#F2F6FC}
.eerder.gelijk > .i{color:var(--info, var(--staal))}
/* Opvolgen */
.opvolg{margin-bottom:16px}
.opvolg-acties{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}
.opvolg-voet{border-top:1px solid var(--line);padding-top:10px;padding-bottom:10px;line-height:1.5}
/* Werktijd */
.werktijd b{font-weight:600;color:var(--text)}
.dash-vroeger{display:flex;align-items:baseline;gap:6px}
.dash-vroeger .in.sm{width:76px;height:34px;font:700 20px/1 var(--cond);padding:0 8px}
@media (max-width:700px){.opvolg .t td{display:block}.opvolg-acties{justify-content:flex-start;padding-bottom:6px}}