/* Sitevlot appearance. Website images, videos and customer iframe palettes stay intact. */
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;flex:none;
  min-width:82px;min-height:38px;padding:7px 10px;border:1px solid currentColor;border-radius:999px;
  background:transparent;color:var(--ink);font:600 .82rem/1.2 'Inter',sans-serif;cursor:pointer}
.theme-toggle[hidden]{display:none}
.theme-toggle svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle:hover{background:color-mix(in srgb,currentColor 8%,transparent)}
.theme-toggle:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.theme-toggle .theme-sun{display:none}
html[data-theme=dark] .theme-toggle .theme-sun{display:block}
html[data-theme=dark] .theme-toggle .theme-moon{display:none}
.lp-pagina .theme-toggle{color:#fff}
@media(max-width:1100px){.topnav .navr{gap:10px}.topnav .navr .alleen-breed{display:none}}
@media(max-width:560px){
  .topnav .wrap{padding-inline:14px;gap:10px;min-height:62px;height:auto;padding-block:10px;flex-wrap:wrap}
  .topnav .navr{gap:10px;flex-wrap:wrap}
  .topnav .navr a{font-size:.82rem}
  .topnav .navr .btn.klein{padding:8px 10px}
  .theme-toggle{min-width:36px;min-height:36px;padding:7px}
  .theme-toggle [data-theme-label]{display:none}
}
html[data-theme=light]{
  --product-bg:#fafbfd;--product-surface:#ffffff;--product-raised:#f0f3f8;
  --product-line:#d3dae5;--product-text:#172033;--product-muted:#536176;--product-accent:#2456cf;
  --rand:#7b899c;--schaduw:0 18px 44px -24px rgba(25,42,70,.2);
  --ok:#17623a;--let:#80520c;--fout:#ae302b;
  --ok-vlak:#e8f6ed;--let-vlak:#fff3d9;--fout-vlak:#fff0ee;
}
html[data-theme=light] body{color-scheme:light}
html[data-theme=light] body.dash{
  --product-text:#172033;--accent-ink:#fff;--muted:#536176;--lijn:#d3dae5;
  --dash-tint:#eef2f7;--dash-tint-blue:#e8efff;--dash-hover:#f1f4f9;
}
html[data-theme=light] .navacc-bol{color:var(--ink)}
html[data-theme=light] .voet{background:var(--surface)}
html[data-theme=light] .overview-welcome,
html[data-theme=light] .help-hero{background:linear-gradient(135deg,#eef3ff,#f4f1fa);border-color:var(--lijn)}
html[data-theme=light] .question-chips button:hover{background:#e5edff;color:var(--ink)}
html[data-theme=light] body.dash .ov-koprij{background:#eef2f7}
html[data-theme=light] body.dash :is(.ov-balkje,.vg-balk){background:#e0e6ef}
html[data-theme=light] body.dash :is(.navacc-bol,.acc-bol){color:var(--ink)}
html[data-theme=light] .lp-pagina{background:#fff}
html[data-theme=light] .lp{
  --ink:#172033;--muted:#536176;--lijn:#d3dae5;--zacht:#f2f5f9;
  --vlak:#fff;--bg:#fff;--accent:#2456cf;color:var(--ink);
}
/* The hero and its overlaid navigation retain the original dark appearance. */
html[data-theme=light] .lp-hero{
  --ink:#fff;--muted:#9ba6b8;--lijn:rgba(255,255,255,.13);--zacht:#101319;
  --vlak:#151920;--bg:#0b0d11;--accent:#8ba9ff;color-scheme:dark;
}
html[data-theme=light] .lp-pagina .topnav:not(.vast){color:#f7f5ef;--accent:#3f72ff}
html[data-theme=light] .lp-pagina .topnav.vast{background:rgba(255,255,255,.94);border-bottom-color:#d3dae5}
html[data-theme=light] .lp-pagina .topnav.vast .logo,
html[data-theme=light] .lp-pagina .topnav.vast .logo b,
html[data-theme=light] .lp-pagina .topnav.vast .navr a,
html[data-theme=light] .lp-pagina .topnav.vast .theme-toggle{color:#172033}
html[data-theme=light] .lp-pagina .topnav.vast .navr a.btn{background:#2456cf;color:#fff}
html[data-theme=light] .lp-pagina .topnav.vast .navr a.btn:hover{background:#1a409f}
html[data-theme=light] .lp .filters button{color:#35445a}
html[data-theme=light] .lp .filters button:hover{background:#e9eef6}
html[data-theme=light] .lp .filters button.aan{background:#172033;color:#fff}
html[data-theme=light] .lp .kaart-cta{background:#f2f5f9}
html[data-theme=light] .lp .kaart-cta:hover{background:#e8eef7}
html[data-theme=light] .lp .site-kaart:hover .naam,
html[data-theme=light] .lp .prijs-punten li:hover{color:#172033}
html[data-theme=light] .lp .eyebrow{background-image:none;-webkit-text-fill-color:currentColor;color:var(--accent)}
html[data-theme=light] .lp .btn,
html[data-theme=light] .lp .slot .btn-wit,
html[data-theme=light] .lp .plakbalk button{background:#2456cf;color:#fff}
html[data-theme=light] .lp .btn:hover,
html[data-theme=light] .lp .slot .btn-wit:hover,
html[data-theme=light] .lp .plakbalk button:hover{background:#1a409f}
html[data-theme=light] .lp .prijskaart .btn.stil{background:transparent;color:#2456cf;border-color:#899bbc}
html[data-theme=light] .lp .prijskaart .btn.stil:hover{background:#e8efff}
html[data-theme=light] .prijskaart.uit{background:#eef3ff;border-color:#2456cf;box-shadow:0 24px 60px -38px rgba(36,86,207,.3)}
html[data-theme=light] :is(.prijskaart,.verg-kolom) .badge{background:#2456cf;color:#fff}
html[data-theme=light] .verg-kolom.uit{border-color:#2456cf}
html[data-theme=light] .verg-kolom li.ja::before,
html[data-theme=light] .verg-tabel :is(.vgl-naam,.vink),
html[data-theme=light] .verg-tabel tbody th{color:#172033}
html[data-theme=light] .verg-tabel thead th{border-bottom-color:#d3dae5}
html[data-theme=light] .verg-tabel .uit,
html[data-theme=light] .lp .verg-tabel tbody tr:not(.groep):hover{background:#eef3ff}
html[data-theme=light] .verg-tabel tr.groep th{color:#2456cf}
html[data-theme=light] .faq .teken::before,
html[data-theme=light] .faq .teken::after{background:#172033}
html[data-theme=light] .lp .faq details:hover{background:#f2f5f9}
html[data-theme=light] .lp :is(.slot,.slot h2){color:#172033}
html[data-theme=light] .lp .plakbalk{background:rgba(255,255,255,.96)}
html[data-theme=light] .lp :is(.bento .cel,.concept-kaart,.prijskaart,.verg-tabel-blok):hover{border-color:#899bbc;box-shadow:0 20px 45px -30px rgba(25,42,70,.24)}
html[data-theme=light] .lp-pagina footer.voet{background:#f2f5f9;border-top-color:#d3dae5}
html[data-theme=light] .lp-pagina footer.voet :is(a,.logo,.logo b){color:#172033}
html[data-theme=light] .lp-pagina :is(.voet h4,.voet-merk p,.voet-onder){color:#536176}
html[data-theme=light] .lp-pagina .voet-onder{border-top-color:#d3dae5}
html[data-theme=light] :is(.tsoorten,.detail-zij h2){color:var(--muted)}
html[data-theme=light] body.dash :is(.site-schouw,.ov-scherm){background:#e8edf5}
html[data-theme=light] body.dash .funnel-visual>div{color:#fff}


/* The longer Sitewillow wordmark still fits next to the mobile account actions. */
@media(max-width:380px){.topnav .wrap{padding-inline:10px;gap:6px}.topnav .logo{font-size:1.1rem}.topnav .navr{gap:7px}.topnav .navr .btn.klein{padding-inline:8px}}

/* Profielrondje rechtsboven: vol gekleurd en iets groter, zodat het naast de
   Dark/Light-knop duidelijk opvalt (licht en donker thema). */
html[data-theme] body .topnav .navacc .navacc-bol{
  width:36px;height:36px;background:var(--accent);border:0;color:#fff;font-size:.95rem;
  box-shadow:0 0 0 2px var(--bg),0 0 0 3px var(--accent)
}
html[data-theme] body .topnav .navacc:hover .navacc-bol{filter:brightness(1.12)}