/* DHB · Afspraak — standaardwaarden als variabelen; Elementor overschrijft ze per widget. */
.dhb-bk{
  --bk-bg:#0B0A0A;--bk-veil:.7;--bk-card-w:1080px;--bk-head-gap:44px;
  --bk-eyebrow:#ffd2b8;--bk-eyebrow-bg:#ffffff0a;--bk-eyebrow-bd:#ffffff3a;--bk-eyebrow-dot:#FF4500;
  --bk-title:#ffffff;--bk-acc:#ff5a17;--bk-acc2:#ffe6d4;--bk-lead:#f1e7e1;--bk-lead-w:62ch;
  --bk-card:#ffffff;--bk-panel:#faf8f6;--bk-div:#00000012;--bk-card-r:26px;--bk-left-w:45%;
  --bk-ctitle:#1a1414;--bk-text:#5e5854;--bk-muted:#8c847e;--bk-name:#1a1414;--bk-open:#1f9d55;--bk-closed:#c43a06;--bk-photo-ring:#ff45001f;--bk-photo:64px;
  --bk-chip-bg:#f5f2ef;--bk-chip-fg:#3b3532;--bk-chip-bd:#00000010;--bk-chip-ic:#e8440a;--bk-check:#1f9d55;
  --bk-tab-bg:#ffffff;--bk-tab-fg:#8c847e;--bk-tab-bd:#00000012;--bk-tab-on-bg:#141212;--bk-tab-on-fg:#ffffff;--bk-tab-num:#e9e5e1;--bk-tab-num-on:#FF4500;--bk-tab-num-done:#1f9d55;
  --bk-month:#1a1414;--bk-nav-bg:#ffffff;--bk-nav-fg:#1a1414;--bk-dow:#8c847e;--bk-day-off:#b5aea8;--bk-day-bg:#ffffff;--bk-day-fg:#1a1414;--bk-day-bd:#00000010;--bk-dot:#FF4500;--bk-day-hover:#ff45001a;--bk-sel-bg:#FF4500;--bk-sel-fg:#ffffff;--bk-today:#00000022;--bk-day-r:12px;--bk-note:#8c847e;
  --bk-slot-bg:#ffffff;--bk-slot-fg:#1a1414;--bk-slot-bd:#00000012;--bk-slot-sub:#8c847e;
  --bk-label:#5e5854;--bk-input-bg:#ffffff;--bk-input-fg:#1a1414;--bk-input-bd:#00000018;--bk-input-focus:#FF4500;--bk-sum-bg:#ffffff;--bk-sum-bd:#00000012;--bk-sum-ic:#e8440a;--bk-back:#8c847e;
  --bk-btn-bg:#FF4500;--bk-btn-fg:#ffffff;--bk-btn-hover:#E8440A;--bk-btn-ic-bg:#ffffff;--bk-btn-ic-fg:#1a0d05;--bk-btn-r:999px;--bk-btn2-bg:#ffffff;--bk-btn2-fg:#1a1414;--bk-btn2-bd:#00000022;
  --bk-ok:#1f9d55;--bk-ok-fg:#ffffff;--bk-recap-bg:#ffffff;--bk-recap-bd:#00000012;--bk-recap-fg:#1a1414;
  --bk-r1-bg:#ffffff;--bk-r1-fg:#1a1414;--bk-r1-acc:#FF4500;--bk-r2-bg:#FF4500;--bk-r2-fg:#ffffff;--bk-r2-acc:#1a0d05;--bk-ribbon-fs:22px;--bk-ribbon-dur:60s;--bk-r1-rot:-6deg;--bk-r2-rot:4deg;--bk-r1-top:62%;--bk-r2-top:74%;
  --dhb-open:var(--bk-open);--dhb-closed:var(--bk-closed);
  position:relative;isolation:isolate;overflow:hidden;padding:clamp(88px,10vw,148px) clamp(16px,4vw,48px) clamp(72px,9vw,128px);background:var(--bk-bg);color:#fff;text-align:center
}

/* Kopkleur vastzetten.
   Koppen hier zetten alleen een lettertype en erven hun kleur van de
   wrapper. Overerving heeft geen specificiteit, dus de Elementor-kit of
   het thema wint daarvan en kleurt de koppen ineens blauw. De wrapper
   staat er dubbel in, zodat deze regel zwaarder weegt dan de kit. De
   eigen kleuren hieronder hebben de wrapper ook gekregen en winnen weer
   van deze regel. */
.dhb-bk.dhb-bk h1,
.dhb-bk.dhb-bk h2,
.dhb-bk.dhb-bk h3,
.dhb-bk.dhb-bk h4,
.dhb-bk.dhb-bk h5,
.dhb-bk.dhb-bk h6 {
	color: inherit;
}



/* Gelaagdheid zoals in de Nexa-plugin: alles met positieve z-indexen binnen
   een eigen stapelcontext. Negatieve z-indexen vallen weg zodra een thema of
   Elementor de stapelcontext anders opbouwt; dan zie je de sectie wit.
   0 = achtergrond, 1 = sluier, 2 = linten, 3 = ruis, 4 = inhoud. */
.dhb-bk-liquid,.dhb-bk-img{position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 50% 20%,#7a2000,var(--bk-bg) 70%)}
.dhb-bk-liquid canvas,.dhb-bk-img img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover}
.dhb-bk-veil{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:var(--bk-veil);background:linear-gradient(180deg,var(--bk-bg),transparent 22%,transparent 70%,var(--bk-bg))}
.dhb-bk--color .dhb-bk-veil{display:none}

/* Linten */
.dhb-ribbons{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.dhb-ribbon{position:absolute;left:-10%;right:-10%;padding:14px 0;font-family:var(--dhb-head);font-weight:800;font-size:var(--bk-ribbon-fs);letter-spacing:-.01em;white-space:nowrap;box-shadow:0 20px 60px #00000060;line-height:1.2}
.dhb-ribbon>div{display:flex;width:max-content;animation:dhb-marquee var(--bk-ribbon-dur) linear infinite}
.dhb-ribbon span{padding:0 18px}
.dhb-ribbon i{font-style:normal}
.dhb-ribbon--r1{top:var(--bk-r1-top);transform:rotate(var(--bk-r1-rot));background:var(--bk-r1-bg);color:var(--bk-r1-fg)}
.dhb-ribbon--r1 i{color:var(--bk-r1-acc)}
.dhb-ribbon--r2{top:var(--bk-r2-top);transform:rotate(var(--bk-r2-rot));background:var(--bk-r2-bg);color:var(--bk-r2-fg)}
.dhb-ribbon--r2 i{color:var(--bk-r2-acc)}
.dhb-ribbon--r2>div{animation-direction:reverse;animation-duration:calc(var(--bk-ribbon-dur) * 1.25)}

/* Kop */
.dhb-bk-in{position:relative;z-index:4;max-width:1232px;margin-inline:auto}
.dhb-bk-head{max-width:820px;margin-inline:auto}
.dhb-bk-head[style*="left"] .dhb-lead{margin-inline:0}
.dhb-bk-title{font-family:var(--dhb-head);font-weight:800;letter-spacing:-.035em;line-height:1.02;font-size:clamp(44px,6vw,88px);margin-top:22px;color:var(--bk-title);text-wrap:balance}
.dhb-bk-title .dhb-acc{background:linear-gradient(100deg,var(--bk-acc),var(--bk-acc2));-webkit-background-clip:text;background-clip:text;color:transparent}
.dhb-bk-head .dhb-lead{margin:22px auto 0;color:var(--bk-lead);font-size:17px;line-height:1.7;max-width:var(--bk-lead-w);text-wrap:balance}

/* Kaart */
.dhb-bk-card{position:relative;margin:var(--bk-head-gap) auto 0;max-width:var(--bk-card-w);display:grid;grid-template-columns:var(--bk-left-w) minmax(0,1fr);background:var(--bk-card);color:#1a1414;border-radius:var(--bk-card-r);overflow:hidden;box-shadow:0 50px 120px #000000a0;text-align:left}
.dhb-bk--noleft .dhb-bk-card{grid-template-columns:1fr;max-width:640px}
.dhb-bk-left{padding:38px 40px;border-right:1px solid var(--bk-div);display:flex;flex-direction:column;gap:18px}
.dhb-bk-person{display:flex;align-items:center;gap:14px}
.dhb-bk-person img{width:var(--bk-photo);height:var(--bk-photo);border-radius:50%;object-fit:cover;object-position:60% 30%;border:3px solid var(--bk-photo-ring)}
.dhb-bk-person b{display:block;font-size:16px;color:var(--bk-name)}
.dhb-bk-person .dhb-status{margin-top:3px;color:var(--bk-open)}
.dhb-bk-person .dhb-status.is-closed{color:var(--bk-closed)}
.dhb-bk-ctitle{font-family:var(--dhb-head);font-weight:800;font-size:28px;letter-spacing:-.03em;line-height:1.1;color:var(--bk-ctitle)}
.dhb-bk-chips{display:flex;flex-wrap:wrap;gap:8px}
.dhb-bk-chips span{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border-radius:12px;background:var(--bk-chip-bg);border:1px solid var(--bk-chip-bd);font-size:13px;font-weight:700;color:var(--bk-chip-fg)}
.dhb-bk-chips .dhb-ic{width:15px;height:15px;color:var(--bk-chip-ic)}
.dhb-bk-left p{color:var(--bk-text);font-size:15px;line-height:1.7}
.dhb-bk-left ul{display:flex;flex-direction:column;gap:10px;font-size:14px;color:var(--bk-text)}
.dhb-bk-left li{display:flex;gap:10px;align-items:flex-start}
.dhb-bk-left li .dhb-ic{width:18px;height:18px;color:var(--bk-check);margin-top:2px}

/* Rechterpaneel */
.dhb-bk-right{padding:30px 34px 34px;background:var(--bk-panel)}
.dhb-bk-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.dhb-bk-tabs button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 10px;border-radius:12px;background:var(--bk-tab-bg);border:1px solid var(--bk-tab-bd);font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--bk-tab-fg);transition:background .2s,color .2s}
.dhb-bk-tabs button i{width:18px;height:18px;border-radius:50%;background:var(--bk-tab-num);color:#5e5854;font-style:normal;font-size:11px;display:grid;place-items:center}
.dhb-bk-tabs button.is-on{background:var(--bk-tab-on-bg);color:var(--bk-tab-on-fg);border-color:var(--bk-tab-on-bg)}
.dhb-bk-tabs button.is-on i{background:var(--bk-tab-num-on);color:#fff}
.dhb-bk-tabs button.is-done i{background:var(--bk-tab-num-done);color:#fff}
.dhb-bk-tabs button:disabled{cursor:default}
.dhb-bk-step{margin-top:22px}
.dhb-cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.dhb-cal-head b{font-family:var(--dhb-head);font-weight:800;font-size:20px;letter-spacing:-.02em;color:var(--bk-month)}
.dhb-cal-nav{width:36px;height:36px;border-radius:50%;background:var(--bk-nav-bg);border:1px solid var(--bk-tab-bd);display:grid;place-items:center;color:var(--bk-nav-fg)}
.dhb-cal-nav:disabled{opacity:.35;cursor:default}
.dhb-cal-nav .dhb-ic{width:16px;height:16px}
.dhb-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.dhb-cal-grid .dhb-dow{text-align:center;font-size:11px;font-weight:900;letter-spacing:.12em;color:var(--bk-dow);padding:6px 0 8px}
.dhb-day{aspect-ratio:1;display:grid;place-items:center;position:relative;border-radius:var(--bk-day-r);font-size:15px;font-weight:700;color:var(--bk-day-off);background:transparent;font-variant-numeric:tabular-nums}
.dhb-day.is-free{color:var(--bk-day-fg);background:var(--bk-day-bg);border:1px solid var(--bk-day-bd);cursor:pointer;transition:background .2s,color .2s,transform .2s}
.dhb-day.is-free::after{content:"";position:absolute;bottom:7px;width:5px;height:5px;border-radius:50%;background:var(--bk-dot)}
.dhb-day.is-free:hover{background:var(--bk-day-hover);transform:translateY(-1px)}
.dhb-day.is-today{box-shadow:inset 0 0 0 2px var(--bk-today)}
.dhb-day.is-on{background:var(--bk-sel-bg);color:var(--bk-sel-fg);border-color:var(--bk-sel-bg)}
.dhb-day.is-on::after{background:var(--bk-sel-fg)}
.dhb-day.is-pad{visibility:hidden}
.dhb-bk-note{margin-top:14px;font-size:12px;color:var(--bk-note)}
.dhb-bk-sub{font-size:14px;color:var(--bk-text)}
.dhb-bk-sub b{color:var(--bk-ctitle)}
.dhb-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}
.dhb-slot{padding:14px 10px;border-radius:12px;background:var(--bk-slot-bg);border:1px solid var(--bk-slot-bd);font-weight:700;font-size:15px;color:var(--bk-slot-fg);font-variant-numeric:tabular-nums;transition:background .2s,color .2s;text-align:center}
.dhb-slot:hover{background:var(--bk-day-hover)}
.dhb-slot.is-on{background:var(--bk-sel-bg);color:var(--bk-sel-fg);border-color:var(--bk-sel-bg)}
.dhb-slot small{display:block;font-size:11px;font-weight:500;color:var(--bk-slot-sub);margin-top:2px}
.dhb-slot.is-on small{color:var(--bk-sel-fg);opacity:.85}
.dhb-bk-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dhb-bk-fields label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:700;color:var(--bk-label)}
.dhb-bk-fields label.dhb-full{grid-column:1/-1}
.dhb-bk-fields input{width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--bk-input-bd);background:var(--bk-input-bg);color:var(--bk-input-fg);font:inherit;font-weight:500;font-size:14px;margin:0}
.dhb-bk-fields input:focus{outline:0;border-color:var(--bk-input-focus)}
.dhb-bk-summary{margin-top:14px;padding:14px 16px;border-radius:14px;background:var(--bk-sum-bg);border:1px solid var(--bk-sum-bd);font-size:14px;display:flex;gap:12px;align-items:center}
.dhb-bk-summary .dhb-ic{width:18px;height:18px;color:var(--bk-sum-ic)}
.dhb-bk-summary b{color:var(--bk-ctitle)}
.dhb-bk-summary small{display:block;color:var(--bk-muted);font-size:12px}
.dhb-bk-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:18px;flex-wrap:wrap}
.dhb-bk-back{font-size:13px;font-weight:700;color:var(--bk-back);display:inline-flex;align-items:center;gap:6px}
.dhb-bk-back .dhb-ic{width:14px;height:14px}

/* Na verzenden */
.dhb-bk-big{display:flex;align-items:center;gap:14px}
.dhb-bk-big span{width:48px;height:48px;border-radius:50%;background:var(--bk-ok);color:var(--bk-ok-fg);display:grid;place-items:center;flex-shrink:0}
.dhb-bk-big .dhb-ic{width:24px;height:24px;stroke-width:2.4}
.dhb-bk .dhb-bk-big h3{font-family:var(--dhb-head);font-weight:800;font-size:24px;letter-spacing:-.02em;color:var(--bk-ctitle);white-space:nowrap}
.dhb-bk-done>p{color:var(--bk-text);margin-top:12px;font-size:14px}
.dhb-bk-recap{margin-top:14px;padding:14px;border-radius:14px;background:var(--bk-recap-bg);border:1px solid var(--bk-recap-bd);font-size:13px;line-height:1.6;white-space:pre-line;color:var(--bk-recap-fg)}
.dhb-bk-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;align-items:center}
.dhb-bk-tiny{font-size:11px;color:var(--bk-muted);margin-top:12px}

@media (max-width:900px){
  .dhb-bk-card{grid-template-columns:1fr}
  .dhb-bk-left{border-right:0;border-bottom:1px solid var(--bk-div);padding:26px}
  .dhb-bk-right{padding:22px}
  .dhb-ribbon{font-size:calc(var(--bk-ribbon-fs) * .75)}
}
@media (max-width:600px){
  .dhb-bk-tabs button{font-size:10px;padding:10px 6px;letter-spacing:.06em}
  .dhb-bk-fields{grid-template-columns:1fr}
  .dhb-slots{grid-template-columns:1fr 1fr}
  .dhb-day{font-size:13px}
  .dhb-bk-title{font-size:clamp(38px,11vw,54px)}
}
@media (prefers-reduced-motion:reduce){.dhb-ribbon>div{animation:none}}
