.srsb-booking {
	--srsb-accent: #2271b1;
	--srsb-border: #c3c4c7;
	--srsb-surface: #fff;
	--srsb-muted: #f6f7f7;
	width: 100%;
	max-width: 760px;
	margin-inline: auto;
	padding: clamp(18px, 4vw, 32px);
	border: 1px solid var(--srsb-border);
	border-radius: 8px;
	background: var(--srsb-surface);
	color: #1d2327;
}

.srsb-booking * { box-sizing: border-box; }
.srsb-booking__header h2 { margin-top: 0; }
.srsb-booking__description p { margin: 0 0 1rem; }

.srsb-booking__date-row {
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	gap: 10px;
	margin: 1.25rem 0;
}

.srsb-booking__date-row label {
	flex-basis: 100%;
	font-weight: 700;
}

.srsb-booking input,
.srsb-booking button {
	min-height: 44px;
	font: inherit;
}

.srsb-booking__date { padding: 8px 10px; }

.srsb-booking button {
	padding: 8px 16px;
	border: 2px solid var(--srsb-accent);
	border-radius: 5px;
	background: var(--srsb-accent);
	color: #fff;
	cursor: pointer;
}

.srsb-booking button:hover { filter: brightness(.9); }
.srsb-booking button:focus-visible,
.srsb-booking input:focus-visible { outline: 3px solid #72aee6; outline-offset: 2px; }
.srsb-booking button:disabled { cursor: wait; opacity: .6; }

.srsb-booking__status {
	min-height: 1.6em;
	margin: 1rem 0;
	font-weight: 600;
}

.srsb-booking .srsb-booking__next-date {
	display: inline-block;
	margin: 0 0 1rem;
	background: #fff;
	color: var(--srsb-accent);
}

.srsb-booking .srsb-booking__next-date[hidden] { display: none; }

.srsb-booking__slots {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(88px, 1fr));
	gap: 10px;
}

.srsb-booking .srsb-booking__slot {
	background: #fff;
	color: var(--srsb-accent);
}

.srsb-booking .srsb-booking__slot.is-selected {
	background: var(--srsb-accent);
	color: #fff;
}

.srsb-booking__hold {
	margin-top: 1.5rem;
	padding: 18px;
	border: 2px solid var(--srsb-accent);
	border-radius: 6px;
	background: var(--srsb-muted);
}

.srsb-booking__selection,
.srsb-booking__countdown { font-weight: 700; }
.srsb-booking__countdown.is-warning { color: #b32d2e; }

.srsb-booking__form {
	display: grid;
	gap: 14px;
	margin: 1.5rem 0;
}

.srsb-booking__form h3 { margin: 0; }
.srsb-booking__field label { display: block; margin-bottom: 5px; font-weight: 700; }
.srsb-booking__field > input,
.srsb-booking__field > select,
.srsb-booking__field > textarea { width: 100%; padding: 8px 10px; border: 1px solid var(--srsb-border); border-radius: 4px; }
.srsb-booking__field fieldset { margin: 0; padding: 0; border: 0; }
.srsb-booking__field fieldset legend { margin-bottom: 6px; font-weight: 700; }
.srsb-booking__field fieldset label { display: block; font-weight: 400; }
.srsb-booking__field fieldset input { width: auto; min-height: auto; }
.srsb-booking__custom-heading { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--srsb-border); }
.srsb-booking__custom-heading h4 { margin: 0 0 5px; }
.srsb-booking__custom-heading p,
.srsb-booking__help { margin: 5px 0 0; color: #50575e; font-size: .92em; }
.srsb-booking__consent { display: flex; align-items: flex-start; gap: 9px; }
.srsb-booking__consent input { flex: 0 0 auto; min-height: auto; margin-top: .3em; }
.srsb-booking__honeypot { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.srsb-booking__form-status { min-height: 1.5em; margin: 0; color: #b32d2e; font-weight: 600; }

.srsb-booking__success {
	margin-top: 1.5rem;
	padding: 20px;
	border: 2px solid #008a20;
	border-radius: 6px;
	background: #edfaef;
}

.srsb-booking__success h3 { margin-top: 0; }
.srsb-calendar-links { margin: 18px 0; }
.srsb-calendar-links p { display: flex; flex-wrap: wrap; gap: 8px; }
.srsb-calendar-links a { display: inline-block; padding: 8px 12px; border: 1px solid var(--srsb-accent); border-radius: 5px; background: #fff; color: var(--srsb-accent); text-decoration: none; }
.srsb-calendar-links a:hover { background: var(--srsb-muted); }

.srsb-booking .srsb-booking__release {
	background: #fff;
	color: var(--srsb-accent);
}

.srsb-management {
	--srsb-accent: #2271b1;
	--srsb-border: #c3c4c7;
	--srsb-surface: #fff;
	--srsb-muted: #f6f7f7;
	max-width: 760px;
	padding: clamp(18px, 4vw, 32px);
	border: 1px solid var(--srsb-border);
	border-radius: 8px;
	background: var(--srsb-surface);
	color: #1d2327;
}

.srsb-management * { box-sizing: border-box; }
.srsb-management [hidden] { display: none !important; }
.srsb-management input,
.srsb-management select,
.srsb-management textarea,
.srsb-management button { min-height: 44px; font: inherit; }
.srsb-management .srsb-booking__date { padding: 8px 10px; }
.srsb-management .srsb-booking__load,
.srsb-management__primary { padding: 8px 16px; border: 2px solid var(--srsb-accent); border-radius: 5px; background: var(--srsb-accent); color: #fff; cursor: pointer; }
.srsb-management .srsb-booking__load:hover,
.srsb-management__primary:hover { filter: brightness(.9); }
.srsb-management input:focus-visible,
.srsb-management select:focus-visible,
.srsb-management textarea:focus-visible,
.srsb-management button:focus-visible { outline: 3px solid #72aee6; outline-offset: 2px; }

.srsb-management__details > div {
	display: grid;
	grid-template-columns: minmax(130px, .6fr) 1.4fr;
	gap: 16px;
	padding: 10px 0;
	border-bottom: 1px solid #e2e4e7;
}

.srsb-management__details dt { font-weight: 700; }
.srsb-management__details dd { margin: 0; }
.srsb-management__notice { padding: 12px; border-left: 4px solid #dba617; background: #fcf9e8; }
.srsb-management__notice.is-success { border-color: #008a20; background: #edfaef; }
.srsb-management__notice.is-error,
.srsb-management--error { border-color: #b32d2e; background: #fcf0f1; }
.srsb-management__cancel-panel { margin-top: 24px; padding: 18px; border: 1px solid #d63638; border-radius: 6px; }
.srsb-management__reschedule-panel { margin-top: 24px; padding: 18px; border: 1px solid #2271b1; border-radius: 6px; }
.srsb-management__loading { display: flex; align-items: center; gap: 10px; margin: 18px 0; font-weight: 700; }
.srsb-management__spinner { width: 22px; height: 22px; border: 3px solid #c3c4c7; border-top-color: var(--srsb-accent); border-radius: 50%; animation: srsb-spin .7s linear infinite; }
@keyframes srsb-spin { to { transform: rotate(360deg); } }
.srsb-management__cancel-panel select,
.srsb-management__cancel-panel textarea,
.srsb-management__reschedule-panel select,
.srsb-management__reschedule-panel textarea { width: 100%; max-width: 520px; padding: 8px; }
.srsb-management__cancel-link,
.srsb-management__danger { display: inline-block; padding: 10px 16px; border: 1px solid #b32d2e; border-radius: 4px; background: #fff; color: #b32d2e; font-weight: 700; text-decoration: none; }
.srsb-management__danger { background: #b32d2e; color: #fff; cursor: pointer; }
.srsb-management__reschedule-link { display: inline-block; padding: 10px 16px; border: 1px solid #2271b1; border-radius: 4px; background: #2271b1; color: #fff; font-weight: 700; text-decoration: none; }
.srsb-management__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.srsb-confirmation-exit { margin-top: 28px; padding-top: 18px; border-top: 1px solid var(--srsb-border); }
.srsb-confirmation-exit > p { margin: 8px 0; }
.srsb-confirmation-exit__countdown { color: #50575e; }
.srsb-confirmation-exit__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.srsb-confirmation-exit__close,
.srsb-confirmation-exit__stay { min-height: 44px; padding: 9px 16px; border: 1px solid var(--srsb-accent); border-radius: 4px; font: inherit; font-weight: 700; cursor: pointer; }
.srsb-confirmation-exit__close { background: var(--srsb-accent); color: #fff; }
.srsb-confirmation-exit__stay { background: #fff; color: var(--srsb-accent); }
.srsb-confirmation-exit__close:focus-visible,
.srsb-confirmation-exit__stay:focus-visible { outline: 3px solid #72aee6; outline-offset: 2px; }
.srsb-management__reschedule-form { display: grid; gap: 14px; }
.srsb-management__time-field { min-width: 0; margin: 8px 0; padding: 0; border: 0; }
.srsb-management__time-field legend { margin-bottom: 10px; font-weight: 700; }
.srsb-management__slot { position: relative; display: block; cursor: pointer; }
.srsb-management__slot input { position: absolute; width: 1px; height: 1px; min-height: 0; opacity: 0; }
.srsb-management__slot span { display: flex; min-height: 44px; align-items: center; justify-content: center; padding: 8px 12px; border: 2px solid var(--srsb-accent); border-radius: 5px; background: #fff; color: var(--srsb-accent); }
.srsb-management__slot:hover span { filter: brightness(.94); }
.srsb-management__slot input:checked + span { background: var(--srsb-accent); color: #fff; }
.srsb-management__slot input:focus-visible + span { outline: 3px solid #72aee6; outline-offset: 2px; }

@media (max-width: 480px) {
	.srsb-booking__date,
	.srsb-booking__load { width: 100%; }
}
