
/* DATUMPRIKKER-20260929 — alles onder .dp- zodat niets de rest van de site raakt. */
.dp-hero{background:linear-gradient(145deg,var(--dk,#0d1117),var(--dk2,#111827));padding:44px 16px 84px;text-align:center}
.dp-hero h1{color:#fff;font-size:clamp(1.6rem,5.4vw,2.5rem);font-weight:800;margin:0 auto .55rem;max-width:40rem;line-height:1.15;overflow-wrap:anywhere}
.dp-hero p{color:rgba(255,255,255,.88);max-width:36rem;margin:0 auto;font-size:1.02rem;line-height:1.55;overflow-wrap:anywhere}
.dp-hero .dp-pre{display:inline-block;color:#bbf7d0;font-weight:700;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;margin-bottom:.5rem}
.dp-feiten{display:flex;flex-wrap:wrap;justify-content:center;gap:.35rem 1.1rem;margin-top:1rem;color:#fff;font-weight:600;font-size:.9rem}
.dp-feiten span::before{content:"✓ ";color:#4ade80}
.dp-wrap{max-width:760px;margin:-56px auto 40px;padding:0 16px;position:relative}
.dp-kaart{background:#fff;border:1px solid var(--bdr,#e5e7eb);border-radius:16px;box-shadow:0 10px 30px rgba(15,23,42,.10);padding:22px 18px;margin-bottom:18px}
.dp-kaart h2{font-size:1.2rem;margin:0 0 .9rem;color:var(--dk,#0d1117)}
.dp-veld{margin-bottom:14px}
.dp-veld label,.dp-lbl{display:block;font-weight:600;font-size:.92rem;color:var(--tx,#1f2937);margin-bottom:5px}
.dp-veld small{font-weight:400;color:#64748b}
.dp-in{width:100%;box-sizing:border-box;border:1.5px solid #cbd5e1;border-radius:10px;padding:11px 12px;font-size:16px;font-family:inherit;color:var(--tx,#1f2937);background:#fff}
.dp-in:focus{outline:none;border-color:var(--g,#00805A);box-shadow:0 0 0 3px rgba(0,128,90,.15)}
textarea.dp-in{min-height:74px;resize:vertical}
.dp-opt-rij{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) 44px;gap:8px;margin-bottom:8px;align-items:center}
.dp-opt-rij .dp-in{padding:10px 8px;min-height:46px}
.dp-x{width:44px;height:46px;border:1.5px solid #cbd5e1;border-radius:10px;background:#fff;color:#475569;font-size:1.3rem;cursor:pointer;line-height:1}
.dp-x:hover{border-color:#ef4444;color:#b91c1c}
.dp-knop{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:12px;padding:13px 18px;font-size:1rem;font-weight:700;cursor:pointer;text-decoration:none;font-family:inherit;line-height:1.2;text-align:center}
.dp-knop-g{background:var(--g,#00805A);color:#fff!important}
.dp-knop-g:hover{background:var(--g2,#007A51);color:#fff!important}
.dp-knop-wa{background:#075E54;color:#fff!important}
.dp-knop-wa:hover{background:#064c44;color:#fff!important}
.dp-knop-l{background:#fff;color:var(--g-tx,#047857)!important;border:1.5px solid var(--g,#00805A)}
.dp-knop-l:hover{background:var(--lt,#f0fdf4)}
.dp-knop-s{padding:8px 12px;font-size:.88rem;border-radius:9px}
.dp-breed{width:100%}
.dp-knop[disabled]{opacity:.6;cursor:wait}
.dp-toevoegen{background:none;border:1.5px dashed #94a3b8;color:var(--g-tx,#047857);border-radius:10px;padding:10px;width:100%;font-weight:700;font-size:.95rem;cursor:pointer;font-family:inherit}
.dp-hint{font-size:.85rem;color:#64748b;margin:.2rem 0 .8rem}
.dp-fout{background:#fef2f2;border:1px solid #fecaca;color:#991b1b;border-radius:10px;padding:10px 12px;margin:10px 0;font-size:.93rem;display:none}
.dp-fout.aan{display:block}
.dp-ok{background:#f0fdf4;border:1px solid #bbf7d0;color:#166534;border-radius:10px;padding:10px 12px;margin:10px 0;font-size:.93rem}
.dp-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
details.dp-meer summary{cursor:pointer;font-weight:600;color:var(--g-tx,#047857);margin-bottom:10px;font-size:.95rem}
.dp-link{display:flex;gap:8px;align-items:stretch;margin:6px 0 12px}
.dp-link input{flex:1;min-width:0;font-size:14px;background:#f8fafc}
.dp-link button{flex-shrink:0}
.dp-waarsch{background:#fffbeb;border:1px solid #fde68a;color:#78350f;border-radius:10px;padding:10px 12px;font-size:.88rem;margin:4px 0 8px}
.dp-knoppen{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.dp-knoppen .dp-knop{flex:1 1 200px}
.dp-meta{color:#475569;font-size:.95rem;margin:.1rem 0 0;overflow-wrap:anywhere}
/* stemmen */
.dp-stem-rij{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;padding:11px 0;border-top:1px solid #eef2f7}
.dp-stem-rij:first-of-type{border-top:none}
.dp-stem-datum{font-weight:700;color:var(--tx,#1f2937);font-size:.98rem;min-width:9.5rem}
.dp-seg{display:flex;gap:6px;flex:1 1 240px;max-width:330px}
.dp-seg input{position:absolute;opacity:0;width:1px;height:1px}
.dp-seg label{display:inline-flex;align-items:center;justify-content:center;flex:1;min-width:0;height:42px;padding:0 6px;border:1.5px solid #cbd5e1;border-radius:10px;font-weight:700;font-size:.88rem;cursor:pointer;color:#334155;background:#fff;user-select:none}
.dp-seg input:focus-visible+label{outline:3px solid rgba(0,128,90,.35);outline-offset:1px}
.dp-seg input.j:checked+label{background:#15803d;border-color:#15803d;color:#fff}
.dp-seg input.m:checked+label{background:#fbbf24;border-color:#f59e0b;color:#1f1300}
.dp-seg input.n:checked+label{background:#475569;border-color:#475569;color:#fff}
.dp-snel{display:flex;gap:8px;flex-wrap:wrap;margin:2px 0 8px}
.dp-snel button{background:#f1f5f9;border:1px solid #e2e8f0;color:#334155;border-radius:8px;padding:6px 10px;font-size:.84rem;font-weight:600;cursor:pointer;font-family:inherit}
/* overzicht */
.dp-tabelwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid #e2e8f0;border-radius:12px}
.dp-tabel{border-collapse:separate;border-spacing:0;width:100%;font-size:.9rem}
.dp-tabel th,.dp-tabel td{padding:9px 8px;border-bottom:1px solid #eef2f7;text-align:center;white-space:nowrap}
.dp-tabel tr:last-child td{border-bottom:none}
.dp-tabel thead th{background:#f8fafc;font-weight:700;color:#334155;font-size:.8rem}
.dp-tabel th.dp-opt,.dp-tabel td.dp-opt{position:sticky;left:0;background:#fff;text-align:left;z-index:1;box-shadow:1px 0 0 #eef2f7;white-space:normal;min-width:8.5rem;max-width:11rem}
.dp-tabel thead th.dp-opt{background:#f8fafc}
.dp-tabel .dp-naamkop{max-width:6.5rem;overflow:hidden;text-overflow:ellipsis}
.dp-tabel .dp-jij{color:var(--g-tx,#047857)}
.dp-c-j{background:#dcfce7;color:#166534;font-weight:700}
.dp-c-m{background:#fef3c7;color:#92400e;font-weight:700}
.dp-c-n{background:#f1f5f9;color:#475569}
.dp-c-leeg{color:#94a3b8}
.dp-telcel{font-weight:700;color:#166534}
.dp-telcel small{display:block;font-weight:600;color:#92400e;font-size:.72rem}
.dp-beste td.dp-opt{background:#ecfdf5;box-shadow:inset 4px 0 0 var(--g,#00805A)}
.dp-badge{display:inline-block;background:var(--g,#00805A);color:#fff;border-radius:999px;padding:2px 8px;font-size:.7rem;font-weight:700;margin-top:3px}
.dp-badge-vast{background:#1d4ed8}
.dp-wis{background:none;border:none;color:#b91c1c;cursor:pointer;font-size:.95rem;padding:0 0 0 3px}
.dp-vast{background:linear-gradient(135deg,#ecfdf5,#f0fdf4);border:2px solid var(--g,#00805A)}
.dp-vast .dp-datum-groot{font-size:1.35rem;font-weight:800;color:var(--dk,#0d1117);margin:.2rem 0 .3rem}
.dp-beheerbalk{background:#eff6ff;border:1px solid #bfdbfe;color:#1e3a8a;border-radius:12px;padding:10px 12px;font-size:.9rem;margin-bottom:14px}
/* uitleg */
.dp-uitleg{max-width:760px;margin:0 auto;padding:10px 16px 30px;color:var(--tx,#1f2937)}
.dp-uitleg h2{font-size:1.45rem;margin:1.6rem 0 .8rem;color:var(--dk,#0d1117)}
.dp-uitleg p{line-height:1.65;color:var(--nt,#374151)}
.dp-stappen{list-style:none;counter-reset:s;padding:0;margin:0}
.dp-stappen li{counter-increment:s;position:relative;padding:4px 0 14px 48px;line-height:1.6;color:var(--nt,#374151)}
.dp-stappen li::before{content:counter(s);position:absolute;left:0;top:2px;width:34px;height:34px;border-radius:50%;background:var(--g,#00805A);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center}
.dp-stappen strong{color:var(--dk,#0d1117)}
.dp-faq details{border:1px solid #e2e8f0;border-radius:12px;padding:12px 14px;margin-bottom:10px;background:#fff}
.dp-faq summary{cursor:pointer;font-weight:700;color:var(--dk,#0d1117);line-height:1.4}
.dp-faq details p{margin:.6rem 0 0}
.dp-cta{background:linear-gradient(145deg,var(--dk,#0d1117),#0f2d22);border-radius:18px;padding:26px 20px;color:#fff;margin:2rem 0 1rem}
.dp-cta h2{color:#fff;margin:0 0 .5rem;font-size:1.3rem}
.dp-cta p{color:rgba(255,255,255,.88);margin:0 0 1rem;line-height:1.6}
.dp-cta .dp-knop-l{background:transparent;color:#fff!important;border-color:rgba(255,255,255,.6)}
.dp-cta .dp-knop-l:hover{background:rgba(255,255,255,.1)}
.dp-verborgen{display:none!important}
@media (min-width:640px){.dp-kaart{padding:26px 28px}.dp-wrap{margin-top:-60px}}
