/* Workshop detail only: editorial content with a self-contained booking card. */
.workshop-detail { min-width: 0; }
.workshop-detail > .container { width: 100%; max-width: none; margin: 0; padding: 0; }
.workshop-detail .back-link { margin: 0 0 var(--s-5); }
.workshop-detail .back-link a { color: var(--c-ink-soft); font-size: var(--t-sm); text-decoration: none; }
.workshop-detail .back-link a:hover { color: var(--c-oxide); }
.workshop-detail .page-header { margin-bottom: var(--s-4); padding-bottom: 0; border: 0; }
.workshop-detail .page-header__title { font-size: clamp(2rem, 3.4vw, 3rem); max-width: 26ch; line-height: 1.15; }
.workshop-detail .page-header__lead { margin-top: var(--s-3); font-size: var(--t-sm); color: var(--c-ink-soft); }
.workshop-detail .service-highlights { gap: var(--s-2); margin: 0 0 var(--s-6); padding: 0; border: 0; }
.workshop-detail .service-highlights span { padding: var(--s-2) var(--s-3); border: var(--border); border-radius: var(--s-6); font-size: var(--t-xs); color: var(--c-ink-soft); background: var(--c-white); }
.workshop-detail .service-highlights .workshop-detail__tag { background: var(--c-oxide-tint); color: var(--c-oxide); border-color: transparent; }
.workshop-detail .service-detail__layout { grid-template-columns: minmax(0, 1fr) minmax(350px, 390px); gap: var(--s-6); }
.workshop-detail .service-detail__main { min-width: 0; }
.workshop-detail .service-detail__media { margin-bottom: var(--s-5); }
.workshop-detail .service-detail__media img { width: 100%; height: auto; aspect-ratio: 16 / 10; max-height: 420px; object-fit: cover; border-radius: 18px; }
.workshop-detail__placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--s-3); min-height: 240px; aspect-ratio: 16 / 9; border: var(--border); border-radius: 18px; background: radial-gradient(ellipse at 20% 20%, var(--c-paper), transparent 65%), var(--c-raised); color: var(--c-oxide); }
.workshop-detail__placeholder > span { font: var(--t-xl) var(--f-display); color: var(--c-ink); }
.workshop-detail__placeholder small { color: var(--c-ink-soft); font-size: var(--t-xs); }
.workshop-detail .host-card { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); padding: var(--s-4); margin: 0; background: var(--c-white); border: var(--border); border-radius: var(--r-lg); }
.workshop-detail .host-avatar { width: 44px; height: 44px; }
.workshop-detail .host-info { flex: 1; min-width: 8rem; }
.workshop-detail .host-label { margin: 0; font-size: var(--t-xs); }
.workshop-detail .host-name { margin: 0; font-size: var(--t-sm); font-weight: 600; }
.workshop-detail .host-card .button { padding: var(--s-2) var(--s-3); font-size: var(--t-xs); }
.workshop-detail .stack { margin-bottom: var(--s-5); }
.workshop-detail .stack h2 { font-size: var(--t-lg); margin: var(--s-5) 0 var(--s-3); }
.workshop-detail .stack > p { color: var(--c-ink-soft); font-size: var(--t-sm); line-height: 1.75; }
.workshop-detail .service-detail__aside { min-width: 0; padding: var(--s-5); background: var(--c-white); border: var(--border); border-radius: 18px; box-shadow: var(--shadow-2); }
.workshop-detail__eyebrow { margin: 0 0 var(--s-2); font-size: .6875rem; letter-spacing: .14em; font-weight: 700; color: var(--c-oxide); }
.workshop-detail .service-detail__price { margin: 0 0 var(--s-4); font-size: var(--t-2xl); font-weight: 600; line-height: 1.2; }
.workshop-detail .service-detail__price span { font-size: var(--t-xs); color: var(--c-ink-soft); font-weight: 400; }
.workshop-detail .detail-list { display: grid; grid-template-columns: 1fr auto; gap: var(--s-2); margin: 0; padding-bottom: var(--s-4); border-bottom: var(--border); font-size: var(--t-sm); }
.workshop-detail .detail-list dt { font-weight: 400; color: var(--c-ink-soft); }
.workshop-detail .detail-list dd { margin: 0; text-align: right; }
.workshop-detail .availability-preview { padding: var(--s-4) 0; margin: 0; border: 0; border-radius: 0; background: transparent; }
.workshop-detail .availability-preview h3 { margin: 0 0 var(--s-2); font-size: var(--t-md); }
.workshop-detail__hint { margin: 0 0 var(--s-4); color: var(--c-ink-soft); font-size: var(--t-xs); }
.workshop-detail #availability-calendar { width: 100%; min-width: 0; overflow: visible; }
.workshop-detail .flatpickr-calendar.inline { width: 100%; max-width: none; box-shadow: none; border: var(--border); border-radius: 10px; padding: var(--s-2); box-sizing: border-box; }
.workshop-detail .flatpickr-innerContainer, .workshop-detail .flatpickr-rContainer, .workshop-detail .flatpickr-days { width: 100%; min-width: 0; }
.workshop-detail .dayContainer { width: 100%; min-width: 0; max-width: none; }
.workshop-detail .flatpickr-day { flex-basis: 14.2857%; max-width: 14.2857%; height: 36px; line-height: 34px; border-radius: var(--r-md); }
.workshop-detail .flatpickr-day.selected { background: var(--c-oxide); border-color: var(--c-oxide); }
.workshop-detail .flatpickr-day.today { border-color: var(--c-oxide); }
.workshop-detail #availability-times { font-size: var(--t-xs); color: var(--c-ink-soft); }
.workshop-detail .availability-times__list { display: grid; grid-template-columns: 1fr; }
.workshop-detail #availability-times .availability-time { width: 100%; font-size: var(--t-xs); }
.workshop-detail .service-detail__aside > .button-row { display: grid; grid-template-columns: 1fr; gap: var(--s-2); padding-top: var(--s-4); border-top: var(--border); }
.workshop-detail .service-detail__aside > .button-row .button { justify-content: center; text-align: center; border-radius: 8px; font-size: var(--t-sm); }
@media (max-width: 1100px) { .workshop-detail .service-detail__layout { grid-template-columns: minmax(0, 1fr) 350px; gap: var(--s-5); } }
@media (max-width: 950px) { .workshop-detail .service-detail__layout { grid-template-columns: 1fr; } .workshop-detail .service-detail__aside { width: 100%; max-width: 500px; justify-self: center; } }
@media (max-width: 400px) { .workshop-detail .service-detail__aside { padding: var(--s-4); } .workshop-detail .flatpickr-calendar.inline { padding: var(--s-1); } }

/* The public layout has no app__inner wrapper: supply its own centred gutters. */
body > main > .workshop-detail {
    box-sizing: border-box;
    width: 100%;
    max-width: 1240px;
    margin-inline: auto;
    padding: var(--s-5) var(--s-6) var(--s-8);
}
@media (max-width: 600px) {
    body > main > .workshop-detail { padding: var(--s-4) var(--s-4) var(--s-7); }
}

.session-legend { display:flex; flex-wrap:wrap; gap:12px; margin:12px 0 20px; font-size:12px; color:#2d7064; }
.session-legend__full { color:#96631b; }
.session-legend__none { color:#96918a; }
.workshop-detail .flatpickr-day.has-full-sessions { background:#fff0d5; color:#865514; border-color:#e8c58c; }
.workshop-detail .flatpickr-day.has-full-sessions.selected { background:#96631b; color:white; border-color:#96631b; }
.workshop-detail .flatpickr-day.has-availability:not(.selected) { background:#e4f0eb; color:#286357; }
.workshop-detail #availability-times .availability-time--full { background:#fff0d5; color:#865514; border-color:#e8c58c; }
.session-waitlist-dialog { box-sizing:border-box; width:min(480px,calc(100vw - 32px)); max-height:85vh; overflow:auto; padding:28px; border:1px solid #e6d4bd; border-radius:20px; background:#fffdf9; color:#292119; box-shadow:0 24px 80px #241a1733; }
.session-waitlist-dialog:not([open]) { display:none; }
.session-waitlist-dialog[open] { animation:waitlist-enter .22s ease-out; }
.session-waitlist-dialog::backdrop { background:#241e1966; backdrop-filter:blur(3px); }
.session-waitlist-dialog h3 { margin:8px 0 16px; }
.session-waitlist-dialog p { font-size:15px; line-height:1.65; }
.session-waitlist-dialog input { width:100%; }
.session-waitlist-dialog form .button { width:100%; margin-top:12px; }
.session-waitlist-dialog > button { margin-top:12px; }
@keyframes waitlist-enter { from { opacity:0; transform:translateY(-12px) scale(.98); } to { opacity:1; transform:none; } }
@media(prefers-reduced-motion:reduce) { .session-waitlist-dialog[open] { animation:none; } }

.workshop-detail #book-now-link[hidden] { display:none; }
