.kmk-tool,.kmk-tool *,.kmk-tool *::before,.kmk-tool *::after{box-sizing:border-box}
/* KMK Tool UI kern voor de plugin - gescoped onder .kmk-tool.
   Elke tool-shortcode draagt de klasse kmk-tool naast zijn eigen scope
   (kmk-kk, kmk-ml, kmk-anl). Deze laag brengt alle tools op de standaard:
   volledige tokens, exact gelijke segmentknoppen met vaste hoogte,
   en zichtbare focusringen. Laadt NA de toolspecifieke stylesheet. */
.kmk-tool{display:block;max-width:1140px;margin-left:auto;margin-right:auto;padding:10px 20px;--navy:#0D2B45;--blue:#1E5FD2;--blue-700:#174FAB;--sky:#3DB7E4;--orange:#FF9F00;
  --papier:#F5F8FB;--papier-2:#EEF4F9;--border:#DCE6EF;--border-soft:#EAF0F6;
  --ink:#14293D;--text:#33495F;--muted:#5B7186;--groen:#1F7A4D;--rood:#B3392E;--amber:#9A6B00;
  --f-head:'Schibsted Grotesk',system-ui,sans-serif;--f-body:'Inter',system-ui,sans-serif}
/* Kaarten in rasters mogen altijd krimpen (voorkomt horizontale overloop op smalle schermen) */
.kmk-tool .kk-card,.kmk-tool .ml-card,.kmk-tool .anl-form{min-width:0}
.kmk-tool .kk-grid>*,.kmk-tool .ml-grid>*{min-width:0}
/* Waarderegels mogen afbreken in plaats van de kaart oprekken */
.kmk-tool .kk-uit *{overflow-wrap:anywhere}
/* Segmentknoppen: exact gelijke kolommen, vaste aanraakhoogte, gecentreerd */
.kmk-tool .kk-seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px;flex-wrap:nowrap}
.kmk-tool .kk-seg button{min-height:46px;display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.35;width:100%;transition:background .15s,color .15s,border-color .15s}
/* Zichtbare focusring voor toetsenbordbediening, op alle bedienbare elementen */
.kmk-tool[class] button:focus-visible,.kmk-tool[class] input:focus-visible,.kmk-tool[class] select:focus-visible,.kmk-tool[class] summary:focus-visible,.kmk-tool[class] a:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
@media(max-width:380px){.kmk-tool .kk-seg{grid-auto-flow:row;grid-auto-columns:unset;grid-template-columns:1fr}}

/* Gedeelde componenten voor de tool-shortcodes (zelfde namen als in de standalone kern) */
.kmk-tool .demo-badge{display:inline-flex;align-items:center;gap:8px;background:#FFF4E0;border:1px solid #F2D9A6;color:#7A5600;font-size:12.5px;font-weight:600;border-radius:999px;padding:6px 14px;margin:0 0 14px}
.kmk-tool .card{display:block;background:#fff;border:1px solid var(--border);border-radius:16px;padding:24px;box-shadow:0 6px 22px rgba(13,43,69,.05);min-width:0}
.kmk-tool .btn{font-family:var(--f-body);display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-size:15px;padding:13px 24px;min-height:50px;border-radius:999px;border:0;cursor:pointer;transition:background .15s,color .15s,border-color .15s;width:100%;text-decoration:none}
.kmk-tool .btn--pri{background:var(--blue);color:#fff}
.kmk-tool .btn--pri:hover{background:var(--blue-700);color:#fff}
.kmk-tool .btn--pri:disabled{background:var(--papier-2);color:var(--muted);cursor:not-allowed}
.kmk-tool .btn--sec{background:#fff;color:var(--navy);border:1px solid var(--border)}
.kmk-tool .btn--sec:hover{color:var(--navy)}
.kmk-tool .nav{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px;padding-top:18px;border-top:1px solid var(--border-soft)}
.kmk-tool .nav--een{grid-template-columns:1fr}
.kmk-tool .nav>*{min-width:0}
.kmk-tool .ring{width:92px;height:92px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--blue) calc(var(--pct)*1%), var(--papier-2) 0)}
.kmk-tool .ring b{width:70px;height:70px;border-radius:50%;background:#fff;display:grid;place-items:center;font-family:var(--f-head);font-size:19px;color:var(--navy)}
.kmk-tool .st{font-weight:700;font-size:12px;display:inline-flex;align-items:flex-start;gap:6px;text-align:right;max-width:60%}
.kmk-tool .st::before{content:"";width:9px;height:9px;border-radius:50%;margin-top:3px;flex:0 0 auto}
.kmk-tool .st--ok{color:var(--groen)}.kmk-tool .st--ok::before{background:var(--groen)}
.kmk-tool .st--bijna{color:var(--amber)}.kmk-tool .st--bijna::before{background:var(--orange)}
.kmk-tool .st--nee{color:var(--rood)}.kmk-tool .st--nee::before{background:var(--rood)}
.kmk-tool .must-alarm{background:#FBEDEB;border:1px solid #E8C4BF;color:var(--rood);font-size:13px;font-weight:600;border-radius:10px;padding:10px 13px;margin-bottom:12px}
.kmk-tool .balk{display:flex;align-items:center;gap:12px;padding:5px 0;font-size:13px}
.kmk-tool .balk .n{flex:0 0 168px;color:var(--ink);font-weight:600}
.kmk-tool .balk .b{flex:1;height:8px;background:var(--papier-2);border-radius:999px;overflow:hidden}
.kmk-tool .balk .b i{display:block;height:100%;background:var(--sky);border-radius:999px}
.kmk-tool .balk .v{flex:0 0 34px;text-align:right;font-weight:700;color:var(--navy);font-variant-numeric:tabular-nums}
.kmk-tool .disc{margin-top:16px;font-size:12px;color:var(--muted);line-height:1.6;border-top:1px solid var(--border-soft);padding-top:14px}
.kmk-tool .hint{font-size:12px;color:var(--muted)}
.kmk-tool .schaal{display:flex;align-items:center;gap:14px}
.kmk-tool .schaal input{flex:1;min-width:0;accent-color:var(--blue);margin:0}
.kmk-tool .schaal output{font-family:var(--f-head);font-weight:800;color:var(--navy);font-size:17px;min-width:26px;text-align:center;flex-shrink:0;max-width:52%;overflow-wrap:anywhere}
.kmk-tool .schaal__lbl{display:flex;justify-content:space-between;font-size:11.5px;color:var(--muted);margin-top:4px}
@media(max-width:560px){.kmk-tool .card{padding:20px}.kmk-tool .balk .n{flex-basis:126px}}

.kmk-tool .kmk-leeg{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:54px 20px;text-align:center;min-height:220px}
.kmk-tool .kmk-leeg__img{max-width:200px;width:60%;height:auto;opacity:.95}
.kmk-tool .kmk-leeg .leeg{color:var(--muted);font-size:14px;margin:0;padding:0}

.kmk-tool .kmk-locatie{padding:9px 0 14px;border-bottom:1px solid var(--border-soft);margin-bottom:8px}
.kmk-tool .kmk-locatie__rij{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.kmk-tool .kmk-locatie input{width:112px;border:1px solid var(--border);border-radius:10px;padding:9px 12px;font-family:var(--f-body);font-size:15px;font-weight:600;letter-spacing:.1em;color:var(--ink);background:#fff;text-align:center;box-sizing:border-box}
.kmk-tool .kmk-locatie input:focus{outline:2px solid var(--sky);outline-offset:1px}
.kmk-tool .kmk-locatie__ok{font-size:12px;font-weight:700;color:#1B5E37;background:#E9F7EF;border:1px solid #B7E4C7;border-radius:99px;padding:3px 10px}
.kmk-tool .kmk-locatie__fout{font-size:12.5px;color:#7A5600;margin:6px 0 0}
.kmk-tool .kmk-locatie-kaart{background:#fff;border:1px solid var(--border);border-radius:14px;padding:14px 20px 2px;margin:0 0 16px;box-sizing:border-box}
.kmk-tool .kmk-locatie-kaart .kmk-locatie{border-bottom:0;padding-bottom:8px;margin-bottom:0}

@media(max-width:360px){.kmk-tool .schaal{gap:8px}}

.kmk-tool .kmk-governance{margin-top:22px;padding-top:14px;border-top:1px solid var(--border-soft)}
.kmk-tool .kmk-gov__betrouw{font-size:12.5px;font-weight:600;color:var(--ink);margin:0 0 8px}
.kmk-tool .kmk-gov__meta{font-size:11.5px;line-height:1.55;color:var(--muted);margin:0 0 4px}
.kmk-tool .kmk-gov__meta a{color:var(--blue);text-decoration:underline}

.kmk-tool .kmk-geld{display:flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:10px;background:#fff;padding:0 12px;max-width:220px}
.kmk-tool .kmk-geld:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px rgba(30,95,210,.12)}
.kmk-tool .kmk-geld__eur{font-family:var(--f-head);font-weight:800;color:var(--muted);font-size:15px}
.kmk-tool .kmk-geld input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-family:var(--f-head);font-weight:800;color:var(--navy);font-size:17px;padding:10px 0;font-variant-numeric:tabular-nums;-moz-appearance:textfield}
.kmk-tool .kmk-geld input::-webkit-outer-spin-button,.kmk-tool .kmk-geld input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.kmk-tool .kmk-geld__fout{font-size:12px;color:#7A5600;margin:6px 0 0}

/* ===== Gedeelde titelbalk boven elke calculator ===== */
.kmk-tool .kmk-titel{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--border);border-radius:16px;padding:18px 22px;margin:0 0 20px;box-shadow:0 6px 22px rgba(13,43,69,.05);position:relative;overflow:hidden}
.kmk-tool .kmk-titel::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,var(--blue),var(--sky))}
.kmk-tool .kmk-titel__icoon{flex:0 0 52px;width:52px;height:52px;border-radius:14px;background:var(--papier-2);display:grid;place-items:center;color:var(--blue)}
.kmk-tool .kmk-titel__icoon svg{width:26px;height:26px}
.kmk-tool .kmk-titel__tekst{min-width:0}
.kmk-tool .kmk-titel__naam{font-family:var(--f-head);font-weight:800;font-size:23px;line-height:1.15;color:var(--navy);margin:0}
.kmk-tool .kmk-titel__sub{font-size:14px;color:var(--muted);margin:4px 0 0;line-height:1.4}
@media(max-width:560px){.kmk-tool .kmk-titel{padding:15px 16px 15px 20px;gap:13px}.kmk-tool .kmk-titel__icoon{flex-basis:44px;width:44px;height:44px;border-radius:12px}.kmk-tool .kmk-titel__icoon svg{width:22px;height:22px}.kmk-tool .kmk-titel__naam{font-size:19px}.kmk-tool .kmk-titel__sub{font-size:13px}}

/* ===== Gedeelde keuzeknoppen (.keuze) - gebruikt door meerdere tools ===== */
.kmk-tool .keuze{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.kmk-tool .keuze--drie{grid-template-columns:repeat(3,minmax(0,1fr))}
.kmk-tool[class] .keuze button{font-family:var(--f-body);font-size:12.5px!important;line-height:1.3!important;font-weight:600;color:var(--navy)!important;background:#fff!important;border:1px solid var(--border)!important;border-radius:10px!important;padding:10px 8px!important;min-height:42px!important;min-width:0;overflow-wrap:anywhere;cursor:pointer;transition:background .13s,color .13s,border-color .13s;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;width:100%;box-shadow:none!important}
.kmk-tool[class] .keuze button small{font-size:11px!important;font-weight:400;opacity:.85;margin-top:2px}
.kmk-tool[class] .keuze button.on{background:var(--navy)!important;color:#fff!important;border-color:var(--navy)!important}
@media(max-width:440px){.kmk-tool .keuze--drie{grid-template-columns:1fr}}
