/* DHB Elementor Widgets — gedeelde basis: fonts, knoppen, labels. Alle kleuren via variabelen (instelbaar per widget). */
@font-face{font-family:"DHB Satoshi";src:url("../fonts/satoshi-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"DHB Satoshi";src:url("../fonts/satoshi-500.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"DHB Satoshi";src:url("../fonts/satoshi-700.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"DHB Satoshi";src:url("../fonts/satoshi-900.woff2") format("woff2");font-weight:900;font-display:swap}
/* DHB Elms wordt in het hoofdbestand van de plugin aangemeld, zodat elke
   widget hem heeft en niet alleen de widgets die dit stylesheet laden. */

.dhb-bk,.dhb-ft,.dhb-fin,.dhbrm{--dhb-font:"DHB Satoshi",system-ui,-apple-system,"Segoe UI",sans-serif;--dhb-head:"DHB Elms","DHB Satoshi",system-ui,sans-serif;font-family:var(--dhb-font);font-weight:500;font-size:16px;line-height:1.65;box-sizing:border-box}
.dhb-bk *,.dhb-ft *,.dhb-fin *{box-sizing:border-box}
.dhb-bk [hidden],.dhb-ft [hidden],.dhb-fin [hidden]{display:none!important}
.dhb-bk h2,.dhb-bk h3,.dhb-bk h4,.dhb-bk p,.dhb-bk ul,.dhb-ft h2,.dhb-ft h3,.dhb-ft h4,.dhb-ft p,.dhb-ft ul,.dhb-fin h2,.dhb-fin p{margin:0}
.dhb-bk ul,.dhb-ft ul,.dhb-fin ul{padding:0;list-style:none}
.dhb-bk a,.dhb-ft a,.dhb-fin a{text-decoration:none;color:inherit}
.dhb-bk button,.dhb-ft button,.dhb-fin button{font:inherit;cursor:pointer;color:inherit;background:none;border:0;padding:0}
.dhb-bk img,.dhb-ft img,.dhb-fin img{display:block;max-width:100%;height:auto}
.dhb-ic{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;display:inline-block;vertical-align:middle}
.dhb-bk :focus-visible,.dhb-ft :focus-visible,.dhb-fin :focus-visible{outline:3px solid #ffb27d;outline-offset:3px}

/* Knop (pil met icoonrondje) */
.dhbx-btn{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;border-radius:var(--bk-btn-r,999px);background:var(--bk-btn-bg,#FF4500);color:var(--bk-btn-fg,#fff);padding:10px 10px 10px 22px;font-size:14px;font-weight:700;line-height:1.4;white-space:nowrap;border:1px solid transparent;transition:transform .2s,background .2s,box-shadow .2s;text-decoration:none}
.dhbx-btn>.dhb-ic{width:36px;height:36px;padding:10px;border-radius:50%;background:var(--bk-btn-ic-bg,#fff);color:var(--bk-btn-ic-fg,#1a0d05)}
.dhbx-btn:hover{background:var(--bk-btn-hover,#E8440A);color:var(--bk-btn-fg,#fff);transform:translateY(-2px);box-shadow:0 12px 34px #ff450040}
.dhbx-btn--sm{font-size:13px;padding:8px 8px 8px 16px;gap:12px}
.dhbx-btn--sm>.dhb-ic{width:30px;height:30px;padding:8px}
.dhbx-btn--ghost{background:var(--bk-btn2-bg,#fff);color:var(--bk-btn2-fg,#1a1414);border-color:var(--bk-btn2-bd,#00000022)}
.dhbx-btn--ghost>.dhb-ic{background:#00000010;color:inherit}
.dhbx-btn--ghost:hover{background:var(--bk-btn2-bg,#fff);color:var(--bk-btn2-fg,#1a1414);box-shadow:0 10px 30px #00000012}
.dhbx-btn:disabled{opacity:.45;cursor:default;transform:none;box-shadow:none}

/* Label boven een kop */
.dhb-eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:var(--bk-eyebrow,#ffd2b8)}
.dhb-eyebrow .dhb-signal{width:6px;height:6px;border-radius:50%;background:var(--bk-eyebrow-dot,#FF4500);box-shadow:0 0 0 4px #ff450022;flex-shrink:0}
.dhb-eyebrow.dhb-pill{padding:9px 16px 9px 12px;border:1px solid var(--bk-eyebrow-bd,#ffffff3a);border-radius:999px;background:var(--bk-eyebrow-bg,#ffffff0a);box-shadow:inset 0 1px 0 #ffffff14}

/* Open/gesloten-status */
.dhb-status{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:13px}
.dhb-status i{width:8px;height:8px;border-radius:50%;background:var(--dhb-open,#1f9d55);box-shadow:0 0 0 3px #1f9d5522;flex-shrink:0}
.dhb-status.is-closed i{background:var(--dhb-closed,#FF4500);box-shadow:0 0 0 3px #ff450022}

/* Melding onderin beeld */
.dhb-toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#fff;color:#1a1414;font-size:13px;font-weight:700;padding:12px 18px;border-radius:12px;box-shadow:0 20px 50px #00000080;z-index:9999;transition:opacity .3s,transform .3s;max-width:calc(100% - 32px)}
.dhb-toast.is-show{opacity:1;transform:translate(-50%,0)}

/* Filmkorrel */
.dhb-grain{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.08;mix-blend-mode:screen;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@keyframes dhb-marquee{to{transform:translateX(-50%)}}