/* Apsilankymų registracija */
.zsv { --zsv-green: var(--green-800, #1d3a29); --zsv-green-2: var(--green-500, #4a7a57); --zsv-green-light: var(--green-100, #dde8d9); --zsv-cream: var(--cream, #f6f3ec); --zsv-line: var(--line, rgba(27,30,26,.1)); --zsv-radius: var(--radius, 22px); --zsv-radius-sm: var(--radius-sm, 12px); --zsv-radius-frame: var(--radius-frame, 4px); --zsv-ink-2: var(--ink-2, #474c44); --zsv-ink-3: var(--ink-3, #78807a); --zsv-danger: var(--danger, #b2453a); }
.zsv__layout { display: grid; gap: 28px; }
.zsv__layout > * { min-width: 0; }
/* Scroll targets land below the sticky header. */
.zsv-slots, .zsv__step-label, .zsv-form, .zsv-success, .zsv-cancel { scroll-margin-top: calc(var(--header-h, 84px) + 24px); }
.zsv__step-label { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 1rem; letter-spacing: 0.02em; margin-bottom: 14px; color: var(--zsv-green); }
.zsv__step-label span { width: 28px; height: 28px; border-radius: 50%; background: var(--zsv-green); color: #fff; display: grid; place-items: center; font-family: var(--font-display, serif); font-size: 1rem; }
.zsv__step-label--form { margin-top: 28px; }
.zsv__step-label--form[hidden] { display: none; }

.zsv-cal { background: #fff; border-radius: var(--zsv-radius-frame); border: 1px solid var(--zsv-line); padding: clamp(16px, 2.5vw, 28px); }
.zsv-cal__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.zsv-cal__title { font-family: var(--font-display, serif); font-size: 1.5rem; color: var(--zsv-green); font-variant-numeric: lining-nums; }
.zsv-cal__nav { width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid var(--zsv-line); background: transparent; font-size: 1.5rem; line-height: 1; cursor: pointer; transition: background-color 0.25s, border-color 0.25s, transform 0.3s; display: grid; place-items: center; }
.zsv-cal__nav:hover { background: var(--zsv-green); color: #fff; border-color: var(--zsv-green); }
.zsv-cal__nav[disabled] { opacity: 0.3; pointer-events: none; }
.zsv-cal__weekdays, .zsv-cal__days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.zsv-cal__weekdays span { text-align: center; font-size: 1rem; text-transform: uppercase; color: var(--zsv-ink-2); font-weight: 700; padding: 6px 0; letter-spacing: 0.02em; }
.day { position: relative; aspect-ratio: 1; border-radius: 12px; border: 1.5px solid transparent; background: transparent; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; font-weight: 600; font-size: 1rem; color: var(--zsv-ink-2); cursor: default; transition: background-color 0.25s, border-color 0.25s, color 0.25s, transform 0.3s; }
.day.is-empty { visibility: hidden; }
.day.is-past { opacity: 0.35; }
.day.is-today::after { content: ""; position: absolute; bottom: 6px; width: 4px; height: 4px; border-radius: 50%; background: var(--zsv-ink-2); }
.day.is-available { background: var(--zsv-green-light); color: var(--zsv-green); cursor: pointer; }
.day.is-available:hover { border-color: var(--zsv-green-2); transform: translateY(-2px); }
.day.is-available.is-today::after { background: var(--zsv-green-2); }
.day.is-full { background: #f1ede4; color: var(--zsv-ink-2); text-decoration: line-through; }
.day.is-selected { background: var(--zsv-green); color: #fff; border-color: var(--zsv-green); }
.day.is-selected.is-today::after { background: #fff; }
.day small { font-size: 1rem; font-weight: 700; letter-spacing: 0.02em; }
.zsv-cal__legend { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 16px; font-size: 1rem; color: var(--zsv-ink-2); }
.zsv-cal__legend i { display: inline-block; width: 14px; height: 14px; border-radius: 4px; vertical-align: -2px; margin-right: 6px; }
.zsv-cal__legend .is-available { background: var(--zsv-green-light); }
.zsv-cal__legend .is-full { background: #f1ede4; }
.zsv__loading { text-align: center; padding: 12px; color: var(--zsv-ink-3); font-size: 1rem; }

.zsv-slots { display: grid; gap: 10px; }
.zsv-slots__empty { margin: 0; padding: 18px 20px; background: #fff; border-radius: var(--zsv-radius-sm); color: var(--zsv-ink-2); font-size: 1rem; border: 1.5px dashed var(--zsv-line); }
.zsv-slots__date { font-family: var(--font-body, sans-serif); font-weight: 600; font-size: 1.125rem; font-variant-numeric: lining-nums tabular-nums; color: var(--zsv-green); margin: 0 0 10px; }
.slot { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; text-align: left; width: 100%; min-height: 56px; padding: 14px 18px; background: #fff; border: 1.5px solid var(--zsv-line); border-radius: var(--zsv-radius-frame); cursor: pointer; transition: border-color 0.25s, transform 0.3s; }
.slot:hover { border-color: var(--zsv-green-2); transform: translateY(-2px); }
.slot.is-selected { border-color: var(--zsv-green); background: var(--zsv-green); color: #fff; }
.slot[disabled] { opacity: 0.55; cursor: not-allowed; transform: none; box-shadow: none; }
.slot__time { font-weight: 700; font-size: 1.05rem; white-space: nowrap; }
.slot__meta { font-size: 1rem; color: var(--zsv-ink-2); }
.slot.is-selected .slot__meta { color: rgba(255,255,255,0.8); }
.slot__seats { font-size: 1rem; font-weight: 700; padding: 5px 10px; border-radius: 999px; background: var(--zsv-green-light); color: var(--zsv-green); white-space: nowrap; }
.slot__seats.is-low { background: #fbeed3; color: #7a5a12; }
.slot__seats.is-none { background: #f1ede4; color: var(--zsv-ink-3); }
.slot.is-selected .slot__seats { background: rgba(255,255,255,0.18); color: #fff; }

.zsv-form { background: #fff; border-radius: var(--zsv-radius-frame); border: 1px solid var(--zsv-line); padding: clamp(18px, 2.5vw, 28px); }
.zsv-form[hidden] { display: none; }
.zsv-form__selected { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; padding: 12px 16px; border-radius: var(--zsv-radius-sm); background: var(--zsv-green-light); color: var(--zsv-green); font-weight: 600; font-size: 1rem; margin-bottom: 18px; }
.zsv-form__selected small { font-weight: 400; color: var(--zsv-ink-2); }
.zsv-form__msg { padding: 12px 16px; border-radius: var(--zsv-radius-sm); background: #fbe9e6; color: var(--zsv-danger); font-size: 1rem; margin-bottom: 14px; }
.zsv-form__msg[hidden] { display: none; }
.zsv-form__submit { width: 100%; justify-content: center; }
.zsv-form__submit.is-busy { opacity: 0.7; pointer-events: none; }
.zsv-form__note { margin: 14px 0 0; font-size: 1rem; color: var(--zsv-ink-2); text-align: center; }
.zsv .field .error:empty { display: none; }

.zsv-success { background: var(--zsv-green); color: var(--zsv-cream); border-radius: var(--zsv-radius-frame); padding: clamp(24px, 3vw, 36px); }
.zsv-success[hidden] { display: none; }
.zsv-success__icon { width: 52px; height: 52px; border-radius: 50%; background: rgba(255,255,255,0.15); display: grid; place-items: center; font-size: 1.5rem; margin-bottom: 14px; }
.zsv-success h3, .zsv-success__title { color: #fff; font-size: 1.6rem; margin-bottom: 14px; }
.zsv-success__dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 16px; margin: 0 0 16px; font-size: 1rem; }
.zsv-success__dl dt { opacity: 0.7; }
.zsv-success__dl dd { margin: 0; font-weight: 600; }
.zsv-success__note { font-size: 1rem; opacity: 0.85; margin-bottom: 20px; }
.zsv-success .btn--ghost { color: #fff; border-color: rgba(255,255,255,0.35); }
.zsv-success .btn--ghost:hover { background: rgba(255,255,255,0.1); border-color: #fff; }

.zsv-cancel { margin-top: 24px; padding: 20px 24px; border-radius: var(--zsv-radius-frame); background: #fff; border: 1px solid var(--zsv-line); }
.zsv-cancel[hidden] { display: none; }
.zsv-cancel.is-ok { border-left: 4px solid var(--zsv-green-2); }
.zsv-cancel.is-err { border-left: 4px solid var(--zsv-danger); }
.zsv-cancel p { margin: 0 0 12px; }
.zsv-cancel .btn { margin-top: 4px; }

@media (min-width: 900px) {
	.zsv__layout { grid-template-columns: 1.05fr 1fr; gap: 40px; align-items: start; }
	.zsv__calendar { position: sticky; top: calc(var(--header-h, 84px) + 24px); }
}
@media (max-width: 640px) {
	.zsv-cal__weekdays, .zsv-cal__days { gap: 4px; }
	.day { border-radius: 9px; font-size: 1rem; }
	.day small { display: none; }
}
@media (max-width: 480px) {
	.slot { grid-template-columns: auto 1fr; }
	.slot__seats { grid-column: 1 / -1; justify-self: start; }
}
