/* Workshops W2b — public booking pages (/{org}/termine, /{org}/workshops/…, /buchung/…).
   Light "paper" island, mobile first. Accent = org primary (--tl-primary from _Layout), text always dark ink. */

.tl-bk {
    --bk-ink: var(--tl-paper-ink, #1d2a3a);
    --bk-muted: #56627a;                  /* 5.9:1 on white */
    --bk-line: #d9dee7;
    --bk-soft: #f3f5f9;
    --bk-accent: var(--tl-primary, #b8913a);
    --bk-btn: var(--tl-navy, #1a2b4a);
    --bk-danger: #a4262c;
    --bk-ok: #1e6b3a;
    background: var(--tl-paper, #f7f5ef);
    color: var(--bk-ink);
    min-height: 100vh;
    padding: 1rem 1rem 3rem;
    font-size: 1rem;
    line-height: 1.55;
}
.tl-bk.tl-bk-embed { min-height: 0; padding: .75rem; background: #fff; }
.tl-bk-wrap { max-width: 56rem; margin: 0 auto; }
.tl-bk-narrow { max-width: 40rem; margin: 0 auto; }

.tl-bk h1 { font-size: 1.6rem; font-weight: 700; margin: .25rem 0 .25rem; color: var(--bk-ink); }
.tl-bk h2 { font-size: 1.2rem; font-weight: 700; margin: 1.75rem 0 .75rem; color: var(--bk-ink); }
.tl-bk-org { color: var(--bk-muted); font-size: .95rem; margin: 0; }
.tl-bk-lead { color: var(--bk-muted); margin: .25rem 0 1rem; }
.tl-bk a { color: var(--bk-btn); text-underline-offset: 2px; }
.tl-bk a:focus-visible, .tl-bk button:focus-visible, .tl-bk input:focus-visible, .tl-bk select:focus-visible, .tl-bk textarea:focus-visible {
    outline: 3px solid var(--bk-accent); outline-offset: 2px;
}

/* Filter */
.tl-bk-filter { display: flex; flex-wrap: wrap; gap: .5rem .75rem; align-items: flex-end; margin: 1rem 0; padding: .75rem; background: #fff; border: 1px solid var(--bk-line); border-radius: 12px; }
.tl-bk-filter label { display: block; font-size: .85rem; color: var(--bk-muted); margin-bottom: .2rem; }
.tl-bk-filter select { min-height: 44px; min-width: 12rem; }

/* Date cards */
.tl-bk-dates { list-style: none; padding: 0; margin: 0; display: grid; gap: .75rem; }
.tl-bk-date { background: #fff; border: 1px solid var(--bk-line); border-left: 5px solid var(--bk-accent); border-radius: 12px; padding: .9rem 1rem; display: grid; gap: .5rem; }
.tl-bk-date-when { font-weight: 700; font-size: 1.05rem; }
.tl-bk-date-what { font-weight: 600; }
.tl-bk-facts { display: flex; flex-wrap: wrap; gap: .35rem .9rem; margin: 0; padding: 0; list-style: none; color: var(--bk-muted); font-size: .92rem; }
.tl-bk-facts i { margin-right: .25rem; }
@media (min-width: 640px) {
    .tl-bk-date { grid-template-columns: 1fr auto; align-items: center; }
    .tl-bk-date .tl-bk-btn { justify-self: end; }
}

/* Buttons: 44px targets */
.tl-bk-btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-height: 44px; padding: .55rem 1.1rem; border-radius: 10px;
    border: 1px solid var(--bk-btn); background: var(--bk-btn); color: #fff !important; font-weight: 600; text-decoration: none; cursor: pointer; }
.tl-bk-btn:hover { filter: brightness(1.12); }
.tl-bk-btn-ghost { background: #fff; color: var(--bk-btn) !important; }
.tl-bk-btn-block { width: 100%; }

.tl-bk-box { background: #fff; border: 1px solid var(--bk-line); border-radius: 14px; padding: 1.1rem 1.1rem; }
.tl-bk-box + .tl-bk-box { margin-top: 1rem; }
.tl-bk-empty { text-align: center; padding: 2rem 1rem; }
.tl-bk-empty i { font-size: 2rem; color: var(--bk-muted); }
.tl-bk-request { margin-top: 1.25rem; display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; justify-content: space-between;
    background: var(--bk-soft); border: 1px dashed var(--bk-line); border-radius: 12px; padding: .9rem 1rem; }

/* Workshop page */
.tl-bk-hero { display: grid; gap: 1rem; }
.tl-bk-hero img { width: 100%; max-height: 260px; object-fit: cover; border-radius: 14px; }
.tl-bk-phases { list-style: none; margin: 0; padding: 0; border: 1px solid var(--bk-line); border-radius: 12px; background: #fff; }
.tl-bk-phases li { display: flex; justify-content: space-between; gap: 1rem; padding: .6rem .9rem; border-top: 1px solid var(--bk-line); }
.tl-bk-phases li:first-child { border-top: 0; }
.tl-bk-note { background: var(--bk-soft); border-radius: 10px; padding: .75rem .9rem; white-space: pre-line; }
.tl-bk-materials { list-style: none; padding: 0; margin: 0; display: grid; gap: .4rem; }
.tl-bk-materials a { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; }

/* Form */
.tl-bk-form fieldset { border: 0; padding: 0; margin: 0 0 1.25rem; }
.tl-bk-form legend { font-size: 1.05rem; font-weight: 700; margin-bottom: .5rem; }
.tl-bk-field { margin-bottom: .9rem; }
.tl-bk-field label { display: block; font-weight: 600; margin-bottom: .25rem; }
.tl-bk-field .tl-bk-hint { color: var(--bk-muted); font-size: .88rem; margin-top: .2rem; }
.tl-bk-form input[type=text], .tl-bk-form input[type=email], .tl-bk-form input[type=number], .tl-bk-form input[type=date],
.tl-bk-form select, .tl-bk-form textarea { width: 100%; min-height: 44px; padding: .5rem .7rem; border: 1px solid #aab3c3; border-radius: 8px; background: #fff; color: var(--bk-ink); font-size: 1rem; }
.tl-bk-form textarea { min-height: 7rem; }
.tl-bk-row { display: grid; gap: 0 .9rem; }
@media (min-width: 640px) { .tl-bk-row-2 { grid-template-columns: 1fr 1fr; } .tl-bk-row-3 { grid-template-columns: 2fr 1fr 1fr; } }
.tl-bk-wish { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; margin-bottom: .5rem; }
.tl-bk-form .tl-bk-invalid input, .tl-bk-form .tl-bk-invalid select, .tl-bk-form .tl-bk-invalid textarea { border-color: var(--bk-danger); border-width: 2px; }
.tl-bk-error { color: var(--bk-danger); font-size: .9rem; margin-top: .25rem; font-weight: 600; }
.tl-bk-error::before { content: "\F333"; font-family: "bootstrap-icons"; margin-right: .3rem; }
.tl-bk-summary { border: 2px solid var(--bk-danger); border-radius: 10px; padding: .7rem .9rem; margin-bottom: 1rem; background: #fff5f5; }
.tl-bk-consent { display: flex; gap: .6rem; align-items: flex-start; }
.tl-bk-consent input { width: 1.4rem; height: 1.4rem; margin-top: .15rem; flex: none; }
.tl-bk-warn { background: #fff7e0; border: 1px solid #e3c36b; border-radius: 10px; padding: .6rem .8rem; margin-top: .4rem; font-size: .92rem; }
.tl-bk-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Result / status */
.tl-bk-status { display: flex; gap: .8rem; align-items: flex-start; }
.tl-bk-status i { font-size: 1.8rem; line-height: 1; }
.tl-bk-status.ok i { color: var(--bk-ok); }
.tl-bk-status.warn i { color: #9a6b00; }
.tl-bk-status.info i { color: var(--bk-btn); }
.tl-bk-summaryline { margin: .75rem 0 0; padding: .75rem .9rem; background: var(--bk-soft); border-radius: 10px; }
.tl-bk-small { font-size: .9rem; color: var(--bk-muted); }

/* Footer: imprint, privacy, who offers it */
.tl-bk-foot { max-width: 56rem; margin: 2.5rem auto 0; padding-top: 1rem; border-top: 1px solid var(--bk-line);
    display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; justify-content: space-between; align-items: center; color: var(--bk-muted); font-size: .9rem; }
.tl-bk-foot nav { display: flex; gap: 1.25rem; }
.tl-bk-foot a { display: inline-flex; align-items: center; min-height: 44px; color: var(--bk-muted); }
.tl-bk-foot.tl-bk-foot-embed { display: block; margin-top: 1rem; padding-top: .5rem; font-size: .8rem; }
.tl-bk-foot.tl-bk-foot-embed a { min-height: 0; }

/* W2e: /{org}/events — past events greyed. (The landing itself lives in oeffentlich.css since W2f.) */
.tl-lp-past .tl-bk-date { border-left-color: var(--bk-line); }
