/* Dygtigbilist Holdstart – components. Themes can override the custom properties. */
.dbh-list, .dbh-form, .dbh-success {
	--dbh-ink: var(--ink, #15171C);
	--dbh-muted: var(--muted, #5A5E66);
	--dbh-line: var(--line, rgba(21,23,28,.12));
	--dbh-surface: var(--surface, #FFFFFF);
	--dbh-soft: var(--soft, #F2F3F5);
	--dbh-accent: var(--signal, #FF914D);
	--dbh-accent-ink: var(--signal-ink, #15171C);
	--dbh-ok: #1F9D55; --dbh-few: #D98A00; --dbh-full: #C8382E;
	--dbh-radius: var(--radius-l, 22px);
	color: var(--dbh-ink);
	font: inherit;
}
.screen-reader-text { position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); white-space:nowrap; }

/* Filter chips */
.dbh-filter { display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 1.25rem; }
.dbh-chip { appearance:none; border:1px solid var(--dbh-line); background:var(--dbh-surface); color:var(--dbh-ink); font:inherit; font-size:.9375rem; font-weight:560; padding:.55rem 1rem; border-radius:999px; cursor:pointer; transition:background .15s, color .15s, border-color .15s, transform .1s; }
.dbh-chip:hover { border-color:var(--dbh-ink); }
.dbh-chip:active { transform:scale(.97); }
.dbh-chip.is-active { background:var(--dbh-ink); border-color:var(--dbh-ink); color:#fff; }

/* Hold cards */
.dbh-cards { display:grid; gap:.75rem; }
.dbh-card { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:1.25rem; padding:1rem 1.25rem 1rem 1rem; background:var(--dbh-surface); border:1px solid var(--dbh-line); border-radius:var(--dbh-radius); }
.dbh-card[hidden] { display:none; }
.dbh-card__date { display:grid; place-items:center; width:4.25rem; height:4.25rem; border-radius:16px; background:var(--dbh-ink); color:#fff; line-height:1; text-align:center; }
.dbh-card__day { font-size:1.75rem; font-weight:800; font-stretch:115%; letter-spacing:-.02em; }
.dbh-card__month { font-size:.8125rem; font-weight:600; opacity:.8; margin-top:-.85rem; }
.dbh-card__title { margin:0; font-size:1.125rem; line-height:1.25; font-weight:700; letter-spacing:-.01em; }
.dbh-card__lang { display:inline-block; vertical-align:middle; margin-left:.35rem; font-size:.75rem; font-style:normal; font-weight:650; padding:.15rem .5rem; border-radius:999px; background:#E8F0FF; color:#1D4ED8; }
.dbh-card__when { margin:.2rem 0 .55rem; color:var(--dbh-muted); font-size:.9375rem; }
.dbh-card__sub { white-space:nowrap; }
.dbh-seats { display:flex; align-items:center; gap:.6rem; font-size:.875rem; font-weight:600; }
.dbh-seats__bar { position:relative; width:5.5rem; height:6px; border-radius:6px; background:var(--dbh-soft); overflow:hidden; flex:none; }
.dbh-seats__bar > span { position:absolute; inset:0 auto 0 0; border-radius:inherit; background:var(--dbh-ok); }
.dbh-card--few .dbh-seats__bar > span { background:var(--dbh-few); }
.dbh-card--full .dbh-seats__bar > span { background:var(--dbh-full); }
.dbh-card--plenty .dbh-seats__text { color:#167A42; }
.dbh-card--few .dbh-seats__text { color:#9A5F00; }
.dbh-card--full .dbh-seats__text { color:var(--dbh-full); }
.dbh-empty { padding:1.25rem; border-radius:var(--dbh-radius); background:var(--dbh-soft); color:var(--dbh-muted); }

/* Buttons */
.dbh-btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; min-height:2.875rem; padding:.7rem 1.35rem; border:0; border-radius:999px; background:var(--dbh-accent); color:var(--dbh-accent-ink); font:inherit; font-weight:700; font-size:1rem; text-decoration:none; cursor:pointer; transition:transform .1s ease-out, filter .15s, box-shadow .2s; box-shadow:0 1px 0 rgba(255,255,255,.45) inset, 0 6px 18px -8px rgba(255,120,40,.7); }
.dbh-btn:hover { filter:brightness(1.05); }
.dbh-btn:active { transform:scale(.97); }
.dbh-btn:focus-visible, .dbh-chip:focus-visible { outline:3px solid #1D4ED8; outline-offset:2px; }
.dbh-card--full .dbh-card__cta { background:var(--dbh-soft); color:var(--dbh-ink); box-shadow:none; }
.dbh-btn--lg { min-height:3.25rem; padding:.85rem 1.75rem; font-size:1.0625rem; }
.dbh-btn.is-busy { opacity:.7; pointer-events:none; }

/* Form */
.dbh-form { display:grid; gap:1.5rem; }
.dbh-hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.dbh-step { border:0; margin:0; padding:0; min-width:0; }
.dbh-step__title { display:flex; align-items:center; gap:.65rem; padding:0; margin:0 0 1rem; font-size:1.25rem; font-weight:750; letter-spacing:-.01em; }
.dbh-step__n { display:grid; place-items:center; width:1.75rem; height:1.75rem; border-radius:50%; background:var(--dbh-ink); color:#fff; font-size:.875rem; font-weight:700; }
.dbh-options { display:grid; gap:.5rem; }
.dbh-option { position:relative; display:flex; align-items:center; gap:1rem; padding:.85rem 1rem; border:1.5px solid var(--dbh-line); border-radius:16px; background:var(--dbh-surface); cursor:pointer; transition:border-color .15s, background .15s, box-shadow .15s; }
.dbh-option:hover { border-color:rgba(21,23,28,.35); }
.dbh-option input { position:absolute; opacity:0; pointer-events:none; }
.dbh-option:has(input:checked) { border-color:var(--dbh-ink); box-shadow:0 0 0 1px var(--dbh-ink); background:#fff; }
.dbh-option:has(input:focus-visible) { outline:3px solid #1D4ED8; outline-offset:2px; }
.dbh-option::after { content:""; margin-left:auto; flex:none; width:1.25rem; height:1.25rem; border-radius:50%; border:1.5px solid var(--dbh-line); }
.dbh-option:has(input:checked)::after { border:6px solid var(--dbh-accent); }
.dbh-option__date { flex:none; width:3.5rem; text-align:center; font-size:.8125rem; color:var(--dbh-muted); line-height:1.1; }
.dbh-option__date strong { display:block; font-size:1.5rem; font-weight:800; color:var(--dbh-ink); font-stretch:115%; }
.dbh-option__main { display:grid; gap:.15rem; }
.dbh-option__title { font-weight:700; }
.dbh-option__meta { font-size:.875rem; color:var(--dbh-muted); }
.dbh-option--full .dbh-option__meta { color:var(--dbh-full); }
.dbh-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:1rem 1rem; }
.dbh-field { grid-column:span 3; margin:0; display:grid; gap:.4rem; align-content:start; }
.dbh-field--full { grid-column:1 / -1; }
.dbh-field--sm { grid-column:span 2; }
.dbh-field--sm + .dbh-field { grid-column:span 4; }
.dbh-field label { font-size:.9375rem; font-weight:600; }
.dbh-field input, .dbh-field textarea, .dbh-field select { width:100%; box-sizing:border-box; font:inherit; font-size:1rem; color:var(--dbh-ink); background:var(--dbh-surface); border:1.5px solid var(--dbh-line); border-radius:14px; padding:.8rem .95rem; min-height:3rem; transition:border-color .15s, box-shadow .15s; }
.dbh-field textarea { min-height:5.5rem; resize:vertical; }
.dbh-field input:focus, .dbh-field textarea:focus, .dbh-field select:focus { outline:none; border-color:var(--dbh-ink); box-shadow:0 0 0 3px rgba(255,145,77,.35); }
.dbh-field [aria-invalid=true] { border-color:var(--dbh-full); }
.dbh-field__error, .dbh-step > .dbh-field__error { margin:.35rem 0 0; color:var(--dbh-full); font-size:.875rem; font-weight:600; }
.dbh-field__hint { font-size:.8125rem; color:#9A5F00; }
.dbh-consent { display:flex; gap:.7rem; align-items:flex-start; margin-top:1.25rem; font-size:.9375rem; line-height:1.45; cursor:pointer; }
.dbh-consent input { width:1.25rem; height:1.25rem; margin:.1rem 0 0; accent-color:var(--dbh-ink); flex:none; }
.dbh-consent a { color:inherit; }
.dbh-form__alert { margin:0; padding:.85rem 1rem; border-radius:14px; background:#FDECEA; color:#8A1F17; font-weight:600; }
.dbh-submit { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem 1.25rem; }
.dbh-submit__note { margin:0; font-size:.9375rem; color:var(--dbh-muted); }

/* Success */
.dbh-success { padding:2rem; border-radius:var(--dbh-radius); background:var(--dbh-surface); border:1px solid var(--dbh-line); text-align:left; outline:none; }
.dbh-success__icon { display:grid; place-items:center; width:3rem; height:3rem; border-radius:50%; background:var(--dbh-ok); margin-bottom:1rem; }
.dbh-success__icon::before { content:""; width:1rem; height:.55rem; border:solid #fff; border-width:0 0 3px 3px; transform:translateY(-2px) rotate(-45deg); }
.dbh-success h2 { margin:0 0 .5rem; font-size:1.5rem; }
.dbh-success p { margin:0 0 .35rem; color:var(--dbh-muted); }
.dbh-success__hold { font-weight:700; color:var(--dbh-ink)!important; }

@media (max-width:640px) {
	.dbh-card { grid-template-columns:auto 1fr; padding:1rem; gap:.9rem 1rem; }
	.dbh-card__cta { grid-column:1 / -1; width:100%; }
	.dbh-card__date { width:3.75rem; height:3.75rem; }
	.dbh-grid { grid-template-columns:1fr 1fr; }
	.dbh-field, .dbh-field--sm, .dbh-field--sm + .dbh-field { grid-column:1 / -1; }
	.dbh-field--sm { grid-column:span 1; }
	.dbh-field--sm + .dbh-field { grid-column:span 1; }
	.dbh-card__sub { display:none; }
}
@media (prefers-reduced-motion:reduce) { .dbh-btn, .dbh-chip, .dbh-option { transition:none; } }

/* Picked hold: the list folds to the chosen one */
.dbh-step { scroll-margin-top: calc(var(--header-h, 76px) + 24px); }
.dbh-change { margin-top: .75rem; padding: .55rem 1.1rem; min-height: 44px; border: 1px solid var(--dbh-line, #D9DCE1); border-radius: 999px; background: transparent; color: inherit; font: inherit; font-weight: 650; cursor: pointer; }
.dbh-change:hover { border-color: currentColor; }
.dbh-form.is-picked .dbh-option { animation: dbh-pick .25s ease-out; }
@keyframes dbh-pick { from { transform: scale(.98); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) { .dbh-form.is-picked .dbh-option { animation: none; } }
.dbh-option[hidden], .dbh-change[hidden] { display: none !important; }

/* Course type symbols: car = kørekort, lightning = lynkursus, cross = førstehjælp */
.dbh-mark { --mk: #15171C; --mk-bg: #EEF0F2; position: relative; flex: none; display: grid; place-items: center; width: 4.25rem; height: 4.25rem; border-radius: 16px; background: var(--mk-bg); color: var(--mk); }
.dbh-mark svg { width: 46%; height: 46%; }
.dbh-mark--bil { --mk: #2457E6; --mk-bg: #E6EDFF; }
.dbh-mark--lyn { --mk: #D9600C; --mk-bg: #FFEBDB; }
.dbh-mark--foerstehjaelp { --mk: #D93A40; --mk-bg: #FDE7E8; }
.dbh-mark__en { position: absolute; right: -6px; bottom: -6px; padding: 3px 6px; border-radius: 999px; border: 2px solid #fff; background: #1D4ED8; color: #fff; font-size: .625rem; font-weight: 800; line-height: 1; letter-spacing: .04em; }
.dbh-mark--sm { width: 2.75rem; height: 2.75rem; border-radius: 12px; }
.dbh-mark--sm .dbh-mark__en { right: -5px; bottom: -5px; padding: 2px 4px; font-size: .5625rem; }
.dbh-mark--chip { display: inline-grid; width: 1.35rem; height: 1.35rem; border-radius: 7px; margin: -.2rem .45rem -.2rem -.35rem; vertical-align: middle; }
.dbh-mark--chip svg { width: 68%; height: 68%; }
.dbh-chip.is-active .dbh-mark--chip { background: rgba(255,255,255,.16); color: #fff; }
.dbh-mark--corner { position: absolute; top: -6px; right: -6px; width: 22px; height: 22px; border-radius: 50%; box-shadow: 0 0 0 2px var(--mk-ring, #fff); }
.dbh-mark--corner svg { width: 62%; height: 62%; }
.dbh-card__id { display: flex; gap: .5rem; align-items: center; }
@media (max-width: 640px) {
	.dbh-mark:not(.dbh-mark--sm):not(.dbh-mark--chip):not(.dbh-mark--corner) { width: 3.75rem; height: 3.75rem; }
}

.dbh-mark--lang { --mk: #fff; --mk-bg: #1D4ED8; font-size: .5625rem; font-weight: 800; letter-spacing: .02em; width: auto; padding: 0 .35rem; }
@media (max-width: 640px) {
	.dbh-card__id { position: relative; }
	.dbh-card__id > .dbh-mark { position: absolute; top: -7px; right: -7px; width: 26px !important; height: 26px !important; border-radius: 50%; box-shadow: 0 0 0 2px var(--dbh-surface, #fff); }
	.dbh-card__id > .dbh-mark svg { width: 60%; height: 60%; }
	.dbh-card__id > .dbh-mark .dbh-mark__en { display: none; }
}

.dbh-withdraw .dbh-withdraw__what { padding:1rem 1.2rem; border-radius:16px; background:var(--dbh-soft); margin:0 0 1rem; }
.dbh-withdraw { --dbh-ink: var(--ink, #15171C); --dbh-line: var(--line, rgba(21,23,28,.12)); --dbh-surface: var(--surface, #fff); --dbh-soft: var(--soft, #F2F3F5); --dbh-accent: var(--signal, #FF914D); --dbh-accent-ink: var(--signal-ink, #15171C); --dbh-muted: var(--muted, #5A5E66); }
.dbh-consent--optional { margin-top:.6rem; color:var(--dbh-muted); font-size:.9375rem; }
