/* Buchungsdienst. Nutzt die Farbvariablen der Hugo-Seite (main.css), mit Rückfallwerten. */
.bk { --bk-ink: var(--ink, #172a2e); --bk-muted: var(--muted, #55676b); --bk-main: var(--atlantic, #17525e);
  --bk-sun: var(--sol, #e3a02b); --bk-line: var(--line, #d8d6cc); --bk-wash: var(--wash, #ebeeea); }
.bk h2 { font-size: 1.4rem; }
.bk h3 { margin-top: 2rem; }
.bk-hint, .bk-note, .opt-note { color: var(--bk-muted); }
.bk-note { font-size: 0.9rem; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.bk-ok, .bk-err { margin-block: 1rem; padding: 0.9rem 1.1rem; border-left: 4px solid; }
.bk-ok { background: #e4f1e6; border-color: #2c7a3f; }
.bk-err { background: #fbe6e3; border-color: #b3261e; }
.bk-err ul { margin: 0.4rem 0 0; padding-left: 1.2rem; }
.bk-down { padding: 0.9rem 1.1rem; background: #fff4d6; border-left: 4px solid var(--bk-sun); }

.cal-nav { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-block: 1rem 0.5rem; }
.cal-nav a { padding: 0.4rem 0; }
.cal { width: 100%; max-width: 30rem; border-collapse: separate; border-spacing: 3px; table-layout: fixed; }
.cal th { font-weight: 600; font-size: 0.85rem; color: var(--bk-muted); padding-block: 0.25rem; }
.cal td { padding: 0; text-align: center; height: 2.9rem; }
.cal td a, .cal td span { display: flex; align-items: center; justify-content: center; height: 100%;
  border-radius: 3px; text-decoration: none; font-variant-numeric: tabular-nums; }
.cal td.is-today a, .cal td.is-today span { box-shadow: inset 0 0 0 2px var(--bk-ink); }
.cal .d-free a { background: #fff; border: 2px solid var(--bk-main); color: var(--bk-main); font-weight: 600; }
.cal .d-partial a { background: var(--bk-wash); border: 2px dashed var(--bk-main); color: var(--bk-main); font-weight: 600; }
.cal .d-free a:hover, .cal .d-partial a:hover { background: var(--bk-main); color: #fff; }
.cal .d-full span { color: var(--bk-muted); text-decoration: line-through; background: var(--bk-wash); }
.cal .d-out span, .cal .d-closed span { color: #8a9799; }
.cal td.is-sel a { background: var(--bk-main); color: #fff; border-style: solid; }

.legend { display: flex; flex-wrap: wrap; gap: 0.4rem 1.25rem; list-style: none; padding: 0; margin: 0.75rem 0 0; font-size: 0.9rem; }
.legend .sw { display: inline-block; width: 1.1rem; height: 1.1rem; margin-right: 0.4rem; vertical-align: -0.2rem; border-radius: 2px; }
.legend .d-free .sw { background: #fff; border: 2px solid var(--bk-main); }
.legend .d-partial .sw { background: var(--bk-wash); border: 2px dashed var(--bk-main); }
.legend .d-full .sw { background: var(--bk-wash); position: relative; }
.legend .d-full .sw::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; border-top: 2px solid var(--bk-muted); }
.legend .d-out .sw { background: #fff; border: 1px solid var(--bk-line); }

.bk-day { border-top: 1px solid var(--bk-line); margin-top: 1.5rem; }
.bk-form { max-width: 32rem; }
.bk-form p { max-width: none; }
.bk-form label { display: block; font-weight: 600; margin-bottom: 0.25rem; }
.bk-form .opt-note { font-weight: 400; }
.bk-form input:not([type="radio"]):not([type="checkbox"]), .bk-form select, .bk-form textarea {
  width: 100%; padding: 0.6rem 0.7rem; font: inherit; color: inherit; background: #fff;
  border: 1px solid #8a9799; border-radius: 3px; }
.bk-form .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.bk-form fieldset { border: 0; padding: 0; margin: 0 0 1em; }
.bk-form legend { font-weight: 600; padding: 0; margin-bottom: 0.25rem; }
.bk-form label.opt, .bk-form .consent label { display: flex; align-items: flex-start; gap: 0.5rem; font-weight: 400; margin: 0.25rem 0; }
.bk-form input[type="radio"], .bk-form input[type="checkbox"] { margin-top: 0.35rem; accent-color: var(--bk-main); }
.bk-form .price { font-weight: 600; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 30rem) { .bk-form .row2 { grid-template-columns: 1fr; } }