/* ============================================================
   BITV v2.0 Appointment Wizard — WCAG 2.1 AA / BITV 2.0
   ============================================================ */

/* --- Custom Properties --- */
:root {
	/* Default color scheme — overridden per theme via [data-wiz-theme="..."] rules.
	   Ensures native browser controls (select dropdowns, date pickers, scrollbars,
	   autofill) render matching the wizard's theme colors. */
	color-scheme: light;
	--wiz-color-primary: #63BAEF; /* brand-primary */
	--wiz-color-primary-hover: #4EAACE; /* brand-primary-shadow */
	--wiz-color-primary-contrast: #ffffff;
	--wiz-color-error: #E1141C;
	--wiz-color-error-bg: #fef2f2;
	--wiz-color-success: #0d7a3e;
	--wiz-color-success-bg: #f0fdf4;
	--wiz-color-warning: #92400e;
	--wiz-color-warning-bg: #fffbeb;
	--wiz-color-bg: #ffffff;
	--wiz-color-bg-alt: #f5f5f5;
	--wiz-color-text: #1a1a1a;
	--wiz-color-text-muted: #555555;
	--wiz-color-border: #333333;
	--wiz-color-border-light: #cccccc;
	--wiz-color-focus: var(--wiz-color-primary);
	--wiz-font-family: 'Lato', Arial, Helvetica, sans-serif;
	--wiz-font-size-base: 1rem;
	--wiz-font-size-sm: 0.875rem;
	--wiz-font-size-lg: 1.125rem;
	--wiz-font-size-xl: 1.5rem;
	--wiz-max-width: 1024px;
	--wiz-border-radius: 0;
	--wiz-focus-outline: 3px solid var(--wiz-color-focus);
	--wiz-focus-offset: 2px;
	--wiz-spacing-xs: 0.25rem;
	--wiz-spacing-sm: 0.5rem;
	--wiz-spacing-md: 1rem;
	--wiz-spacing-lg: 1.5rem;
	--wiz-spacing-xl: 2rem;
	--wiz-transition: 150ms ease-in-out;
}

/* --- Reset & Base --- */
*, *::before, *::after {
	box-sizing: border-box;
}

html {
	margin: 0;
	padding: 0;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	padding: 0;
	font-family: var(--wiz-font-family);
	font-size: var(--wiz-font-size-base);
	line-height: 1.5;
	color: var(--wiz-color-text);
	background-color: var(--wiz-color-bg);
	-webkit-font-smoothing: antialiased;
}

/* --- Skip Link --- */
.wiz-skip-link {
	position: absolute;
	top: -100%;
	left: var(--wiz-spacing-md);
	z-index: 1000;
	padding: var(--wiz-spacing-sm) var(--wiz-spacing-md);
	background: var(--wiz-color-primary);
	color: var(--wiz-color-primary-contrast);
	text-decoration: none;
	font-weight: 700;
	border-radius: var(--wiz-border-radius);
}

.wiz-skip-link:focus {
	top: var(--wiz-spacing-sm);
	outline: var(--wiz-focus-outline);
	outline-offset: var(--wiz-focus-offset);
}

/* --- Noscript Fallback --- */
.wiz-noscript {
	max-width: var(--wiz-max-width);
	margin: var(--wiz-spacing-xl) auto;
	padding: var(--wiz-spacing-lg);
	background: var(--wiz-color-warning-bg);
	border: 2px solid var(--wiz-color-warning);
	color: var(--wiz-color-warning);
}

/* --- Focus Styles (Global) --- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
	outline: var(--wiz-focus-outline);
	outline-offset: var(--wiz-focus-offset);
}

/* --- Page Layout --- */
.wiz-page {
	max-width: var(--wiz-max-width);
	margin: 0 auto;
	padding: 0 var(--wiz-spacing-md);
}

/* --- Header --- */
.wiz-header {
	padding: var(--wiz-spacing-lg) 0;
	border-bottom: 2px solid var(--wiz-color-border);
}

.wiz-header__inner {
	display: flex;
	align-items: center;
	gap: var(--wiz-spacing-md);
}

.wiz-header__logo {
	max-height: 60px;
	width: auto;
}

.wiz-header__title {
	font-size: var(--wiz-font-size-xl);
	font-weight: 700;
	margin: 0;
	flex: 1;
	color: var(--wiz-color-text);
}

/* Language Switcher */
.wiz-lang-switch {
	margin-left: auto;
	flex-shrink: 0;
}

.wiz-lang-switch__select {
	font-family: var(--wiz-font-family);
	font-size: var(--wiz-font-size-sm);
	padding: var(--wiz-spacing-xs) var(--wiz-spacing-sm);
	border: 1px solid var(--wiz-color-border);
	border-radius: var(--wiz-border-radius);
	background: var(--wiz-color-bg);
	color: var(--wiz-color-text);
	cursor: pointer;
}

.wiz-lang-switch__select:focus {
	outline: var(--wiz-focus-outline);
	outline-offset: var(--wiz-focus-offset);
}

/* --- Step Navigation --- */
.wiz-steps {
	padding: var(--wiz-spacing-lg) 0 var(--wiz-spacing-sm);
}

.wiz-steps__list {
	display: flex;
	justify-content: space-between;
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: step;
	position: relative;
}

/* Grey baseline — full width behind all circles */
.wiz-steps__list::before {
	content: "";
	position: absolute;
	top: calc(var(--wiz-spacing-sm) + 1.125rem - 1px);
	left: 0;
	right: 0;
	height: 3px;
	background: var(--wiz-color-border-light);
	z-index: 0;
}

/* Green progress overlay — width controlled by --wiz-progress CSS variable set in JS */
.wiz-steps__list::after {
	content: "";
	position: absolute;
	top: calc(var(--wiz-spacing-sm) + 1.125rem - 1px);
	left: 0;
	width: var(--wiz-progress, 0%);
	height: 3px;
	background: var(--wiz-color-success);
	z-index: 0;
	transition: width 0.3s ease;
}

.wiz-steps__item {
	counter-increment: step;
	position: relative;
	text-align: center;
	flex: 0 0 auto;
}

.wiz-steps__label {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--wiz-spacing-xs);
	padding: var(--wiz-spacing-sm) 0;
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-text-muted);
	text-decoration: none;
	border: 2px solid transparent;
	background: none;
	cursor: default;
	font-family: inherit;
	position: relative;
	z-index: 1;
}

.wiz-steps__label::before {
	content: counter(step);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	border: 2px solid var(--wiz-color-border-light);
	border-radius: 50%;
	font-weight: 700;
	font-size: var(--wiz-font-size-base);
	color: var(--wiz-color-text-muted);
	background: var(--wiz-color-bg);
	transition: background var(--wiz-transition), color var(--wiz-transition), border-color var(--wiz-transition);
}

.wiz-steps__item--active .wiz-steps__label {
	color: var(--wiz-color-text);
	font-weight: 700;
}

.wiz-steps__item--active .wiz-steps__label::before {
	background: var(--wiz-color-primary);
	color: var(--wiz-color-primary-contrast);
	border-color: var(--wiz-color-primary);
}

.wiz-steps__item--completed .wiz-steps__label {
	color: var(--wiz-color-text);
	cursor: pointer;
}

.wiz-steps__item--completed .wiz-steps__label::before {
	content: "\2713";
	background: var(--wiz-color-success);
	color: #fff;
	border-color: var(--wiz-color-success);
}

button.wiz-steps__label:hover {
	border-color: var(--wiz-color-primary);
}

button.wiz-steps__label:focus-visible {
	outline: var(--wiz-focus-outline);
	outline-offset: var(--wiz-focus-offset);
}

/* --- Main Content Area --- */
.wiz-main {
	display: flex;
	gap: var(--wiz-spacing-xl);
	padding: var(--wiz-spacing-lg) 0;
	min-height: 400px;
}

.wiz-content {
	flex: 1;
	min-width: 0;
}

.wiz-sidebar {
	width: 280px;
	flex-shrink: 0;
}

/* --- Step Content --- */
.wiz-step__title {
	font-size: var(--wiz-font-size-xl);
	font-weight: 700;
	margin: 0 0 var(--wiz-spacing-sm) 0;
	color: var(--wiz-color-text);
}

.wiz-step__title:focus {
	outline: none;
}

.wiz-step__intro {
	margin: 0 0 var(--wiz-spacing-lg) 0;
	color: var(--wiz-color-text-muted);
}

/* --- Fieldset / Legend --- */
.wiz-fieldset {
	border: none;
	margin: 0 0 var(--wiz-spacing-lg) 0;
	padding: 0;
}

.wiz-legend {
	font-size: var(--wiz-font-size-lg);
	font-weight: 700;
	padding: 0;
	margin: 0 0 var(--wiz-spacing-md) 0;
	color: var(--wiz-color-text);
}

/* --- Service Card --- */
.wiz-service {
	display: flex;
	align-items: flex-start;
	gap: var(--wiz-spacing-md);
	padding: var(--wiz-spacing-md);
	margin-bottom: var(--wiz-spacing-sm);
	background: var(--wiz-color-bg-alt);
	border: 2px solid transparent;
	transition: border-color var(--wiz-transition);
}

.wiz-service:hover {
	border-color: var(--wiz-color-border-light);
}

.wiz-service--selected {
	border-color: var(--wiz-color-primary);
	background: #f0f6fc;
}

.wiz-service--disabled {
	opacity: 0.5;
	pointer-events: none;
}

.wiz-service--incompatible {
	opacity: 0.55;
	border-color: var(--wiz-color-border-light);
}

.wiz-service--incompatible .wiz-service__name {
	cursor: default;
}

.wiz-service__combination-msg {
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-error, #c0392b);
	margin-top: var(--wiz-spacing-xs);
	font-style: italic;
}

.wiz-service__checkbox {
	flex-shrink: 0;
	width: 1.25rem;
	height: 1.25rem;
	margin-top: 0.125rem;
	accent-color: var(--wiz-color-primary);
	cursor: pointer;
}

.wiz-service__body {
	flex: 1;
	min-width: 0;
}

.wiz-service__name {
	font-weight: 700;
	cursor: pointer;
	-webkit-hyphens: auto;
	hyphens: auto;
	overflow-wrap: break-word;
	word-break: break-word;
}

.wiz-service__info {
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-text-muted);
	margin-top: var(--wiz-spacing-xs);
}

.wiz-service__extra {
	flex: 1 1 40%;
	min-width: 0;
	border-left: 1px solid var(--wiz-color-border-light, rgba(128,128,128,0.25));
	padding-left: var(--wiz-spacing-md);
	align-self: center;
}

.wiz-service__description {
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-text-muted);
	line-height: 1.5;
}

.wiz-service__description p {
	margin: 0 0 var(--wiz-spacing-xs) 0;
}

.wiz-service__description p:last-child {
	margin-bottom: 0;
}

.wiz-service__description a {
	color: var(--wiz-color-primary);
	text-decoration: underline;
	pointer-events: auto;
}

.wiz-service__description a:hover {
	opacity: 0.8;
}

.wiz-service__image {
	flex-shrink: 0;
	align-self: center;
	margin-left: auto;
	width: 120px;
	height: 90px;
	object-fit: cover;
	border-radius: var(--wiz-border-radius, 4px);
	border: 1px solid var(--wiz-color-border-light);
	cursor: zoom-in;
	transition: opacity var(--wiz-transition);
}

.wiz-service__image:hover {
	opacity: 0.8;
}

/* --- Image lightbox overlay --- */
.wiz-image-overlay {
	position: fixed;
	inset: 0;
	z-index: 10000;
	background: rgba(0, 0, 0, 0.75);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: zoom-out;
}

.wiz-image-overlay__content {
	position: relative;
	max-width: 90vw;
	max-height: 90vh;
	cursor: default;
}

.wiz-image-overlay__content img {
	display: block;
	max-width: 90vw;
	max-height: 80vh;
	object-fit: contain;
	border-radius: var(--wiz-border-radius, 4px);
	background: #fff;
}

.wiz-image-overlay__caption {
	text-align: center;
	color: #fff;
	padding: var(--wiz-spacing-sm) 0;
	font-size: var(--wiz-font-size-sm);
}

.wiz-image-overlay__close {
	position: absolute;
	top: -12px;
	right: -12px;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: none;
	background: #fff;
	color: #333;
	font-size: 1.25rem;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

.wiz-image-overlay__close:hover {
	background: #eee;
}

.wiz-service__amount {
	display: inline-flex;
	align-items: center;
	gap: var(--wiz-spacing-sm);
	margin-top: var(--wiz-spacing-sm);
	visibility: hidden;
}

.wiz-service--selected .wiz-service__amount {
	visibility: visible;
}

.wiz-service__amount label {
	font-size: var(--wiz-font-size-sm);
	font-weight: 600;
}

.wiz-service__amount input[type="number"] {
	width: 4rem;
	padding: var(--wiz-spacing-xs) var(--wiz-spacing-sm);
	border: 2px solid var(--wiz-color-border);
	border-radius: var(--wiz-border-radius);
	font-family: inherit;
	font-size: var(--wiz-font-size-base);
	text-align: center;
}

/* --- Search field --- */
.wiz-search-field {
	display: block;
	width: 100%;
	padding: var(--wiz-spacing-sm) var(--wiz-spacing-md);
	border: 2px solid var(--wiz-color-border);
	border-radius: var(--wiz-border-radius);
	font-family: inherit;
	font-size: var(--wiz-font-size-base);
	margin-bottom: var(--wiz-spacing-md);
}

/* --- Location Card --- */
.wiz-location {
	display: flex;
	align-items: stretch;
	gap: var(--wiz-spacing-md);
	padding: var(--wiz-spacing-md);
	margin-bottom: var(--wiz-spacing-sm);
	background: var(--wiz-color-bg-alt);
	border: 2px solid transparent;
	transition: border-color var(--wiz-transition);
}

.wiz-location:hover {
	border-color: var(--wiz-color-border-light);
}

.wiz-location--disabled {
	opacity: 0.5;
	cursor: default;
	border-color: var(--wiz-color-border-light);
}

.wiz-location--disabled .wiz-location__name {
	cursor: default;
}

.wiz-location--disabled:hover {
	border-color: var(--wiz-color-border-light);
}

.wiz-location--selected {
	border-color: var(--wiz-color-primary);
	background: #f0f6fc;
}

.wiz-location__radio,
.wiz-location__checkbox {
	flex-shrink: 0;
	align-self: flex-start;
	width: 1.25rem;
	height: 1.25rem;
	margin-top: 0.125rem;
	accent-color: var(--wiz-color-primary);
	cursor: pointer;
}

.wiz-location__body {
	flex: 1;
	align-self: center;
}

.wiz-location__name {
	font-weight: 700;
	cursor: pointer;
	-webkit-hyphens: auto;
	hyphens: auto;
	overflow-wrap: break-word;
	word-break: break-word;
}

.wiz-location__address {
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-text-muted);
	margin-top: var(--wiz-spacing-xs);
}

/* --- Slot Calendar --- */
.wiz-calendar {
	margin-bottom: var(--wiz-spacing-lg);
}

.wiz-calendar__nav {
	display: flex;
	align-items: stretch;
	margin-bottom: var(--wiz-spacing-md);
	gap: var(--wiz-spacing-sm);
}

.wiz-calendar__nav > * {
	flex: 1 1 0;
}

.wiz-calendar__nav > .wiz-btn {
	justify-content: center;
}

.wiz-calendar__period {
	font-weight: 700;
	font-size: var(--wiz-font-size-lg);
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}

.wiz-calendar__days {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: var(--wiz-spacing-md);
}

.wiz-day {
	border: 2px solid var(--wiz-color-border-light);
	padding: var(--wiz-spacing-sm);
}

.wiz-day__header {
	font-weight: 700;
	padding-bottom: var(--wiz-spacing-sm);
	margin-bottom: var(--wiz-spacing-sm);
	border-bottom: 1px solid var(--wiz-color-border-light);
	font-size: var(--wiz-font-size-sm);
}

.wiz-day__slots {
	display: flex;
	flex-direction: column;
	gap: var(--wiz-spacing-xs);
}

.wiz-slot {
	display: block;
	width: 100%;
	padding: var(--wiz-spacing-sm);
	background: var(--wiz-color-bg);
	border: 2px solid var(--wiz-color-border-light);
	border-radius: var(--wiz-border-radius);
	font-family: inherit;
	font-size: var(--wiz-font-size-sm);
	font-weight: 600;
	cursor: pointer;
	text-align: center;
	transition: background var(--wiz-transition), border-color var(--wiz-transition);
}

.wiz-slot:hover {
	background: var(--wiz-color-bg-alt);
	border-color: var(--wiz-color-primary);
}

.wiz-slot--selected {
	background: var(--wiz-color-primary);
	color: var(--wiz-color-primary-contrast);
	border-color: var(--wiz-color-primary);
}

.wiz-slot--more,
.wiz-slot--prev,
[data-wiz-theme] .wiz-slot--more,
[data-wiz-theme] .wiz-slot--prev {
	border-style: dashed;
	font-weight: 400;
	color: var(--wiz-color-text-muted);
	text-shadow: none;
	letter-spacing: normal;
	text-transform: none;
}

.wiz-slot--more::before,
.wiz-slot--prev::before {
	display: none !important;
}

.wiz-slot--more:hover,
.wiz-slot--prev:hover,
[data-wiz-theme] .wiz-slot--more:hover,
[data-wiz-theme] .wiz-slot--prev:hover {
	color: var(--wiz-color-primary);
}

/* --- Timezone Toggle --- */
.wiz-tz-toggle {
	display: flex;
	justify-content: center;
	margin-bottom: var(--wiz-spacing-md);
}

.wiz-tz-toggle__option {
	padding: var(--wiz-spacing-xs) var(--wiz-spacing-md);
	font-family: inherit;
	font-size: var(--wiz-font-size-sm);
	font-weight: 600;
	cursor: pointer;
	border: 1px solid var(--wiz-color-border);
	background: var(--wiz-color-bg);
	color: var(--wiz-color-text-muted);
	transition: background var(--wiz-transition), color var(--wiz-transition);
}

.wiz-tz-toggle__option:first-child {
	border-radius: var(--wiz-border-radius) 0 0 var(--wiz-border-radius);
	border-right: none;
}

.wiz-tz-toggle__option:last-child {
	border-radius: 0 var(--wiz-border-radius) var(--wiz-border-radius) 0;
}

.wiz-tz-toggle__option--active {
	background: var(--wiz-color-primary);
	color: var(--wiz-color-primary-contrast);
	border-color: var(--wiz-color-primary);
}

.wiz-slot:disabled {
	opacity: 0.4;
	cursor: not-allowed;
}

/* --- Form Elements --- */
.wiz-form-group {
	margin-bottom: var(--wiz-spacing-md);
}

.wiz-label {
	display: block;
	font-weight: 600;
	margin-bottom: var(--wiz-spacing-xs);
	font-size: var(--wiz-font-size-base);
}

.wiz-label--required::after {
	content: " *";
	color: var(--wiz-color-error);
}

.wiz-input,
.wiz-select,
.wiz-textarea {
	display: block;
	width: 100%;
	padding: var(--wiz-spacing-sm) var(--wiz-spacing-md);
	border: 2px solid var(--wiz-color-border);
	border-radius: var(--wiz-border-radius);
	font-family: inherit;
	font-size: var(--wiz-font-size-base);
	color: var(--wiz-color-text);
	background: var(--wiz-color-bg);
	transition: border-color var(--wiz-transition);
}

.wiz-input:focus,
.wiz-select:focus,
.wiz-textarea:focus {
	border-color: var(--wiz-color-primary);
}

.wiz-input[aria-invalid="true"],
.wiz-select[aria-invalid="true"],
.wiz-textarea[aria-invalid="true"] {
	border-color: var(--wiz-color-error);
}

.wiz-textarea {
	min-height: 6rem;
	resize: vertical;
}

.wiz-hint {
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-text-muted);
	margin-top: var(--wiz-spacing-xs);
}

.wiz-field-hint {
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-text-muted);
	margin-top: var(--wiz-spacing-xs);
}

.wiz-field-error {
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-error);
	margin-top: var(--wiz-spacing-xs);
}

/* --- File Upload --- */

.wiz-file-input {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

.wiz-file-drop {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--wiz-spacing-xs);
	padding: var(--wiz-spacing-lg) var(--wiz-spacing-md);
	border: 2px dashed var(--wiz-color-border);
	border-radius: var(--wiz-border-radius);
	background: var(--wiz-color-bg);
	cursor: pointer;
	transition: border-color var(--wiz-transition), background var(--wiz-transition);
	text-align: center;
}

.wiz-file-drop:hover,
.wiz-file-drop:focus-visible {
	border-color: var(--wiz-color-primary);
	background: var(--wiz-color-bg-alt);
}

.wiz-file-drop--active {
	border-color: var(--wiz-color-primary);
	background: var(--wiz-color-bg-alt);
}

.wiz-file-drop__icon {
	font-size: 1.5rem;
	line-height: 1;
}

.wiz-file-drop__text {
	font-size: var(--wiz-font-size-base);
	color: var(--wiz-color-text);
}

.wiz-file-drop__browse {
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-primary);
	text-decoration: underline;
	font-weight: 600;
}

.wiz-file-drop__hint {
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-text-muted);
}

.wiz-file-list {
	list-style: none;
	margin: var(--wiz-spacing-sm) 0 0;
	padding: 0;
}

.wiz-file-item {
	display: flex;
	align-items: center;
	gap: var(--wiz-spacing-sm);
	padding: var(--wiz-spacing-xs) var(--wiz-spacing-sm);
	border: 1px solid var(--wiz-color-border);
	border-radius: var(--wiz-border-radius);
	margin-bottom: var(--wiz-spacing-xs);
	background: var(--wiz-color-bg);
	flex-wrap: wrap;
}

.wiz-file-item--error {
	border-color: var(--wiz-color-error);
}

.wiz-file-item__name {
	flex: 1 1 auto;
	font-size: var(--wiz-font-size-sm);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	min-width: 0;
}

.wiz-file-item__size {
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-text-muted);
	flex-shrink: 0;
}

.wiz-file-item__remove {
	background: none;
	border: none;
	color: var(--wiz-color-error);
	cursor: pointer;
	font-size: 1.1rem;
	line-height: 1;
	padding: 0.1rem 0.3rem;
	border-radius: var(--wiz-border-radius);
	flex-shrink: 0;
}

.wiz-file-item__remove:hover,
.wiz-file-item__remove:focus-visible {
	background: rgba(220, 53, 69, 0.1);
}

.wiz-file-item__error {
	width: 100%;
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-error);
}

.wiz-form-group--checkbox .wiz-checkbox-wrapper {
	display: flex;
	align-items: center;
	gap: var(--wiz-spacing-sm);
}

.wiz-form-group--checkbox input[type="checkbox"] {
	width: 1.25rem;
	height: 1.25rem;
	flex-shrink: 0;
}

.wiz-form-group--checkbox label {
	font-weight: 400;
}

/* --- Error Summary --- */
.wiz-error-summary {
	padding: var(--wiz-spacing-md);
	margin-bottom: var(--wiz-spacing-lg);
	background: var(--wiz-color-error-bg);
	border: 2px solid var(--wiz-color-error);
}

.wiz-error-summary__title {
	font-weight: 700;
	color: var(--wiz-color-error);
	margin: 0 0 var(--wiz-spacing-sm) 0;
}

.wiz-error-summary__list {
	margin: 0;
	padding: 0 0 0 var(--wiz-spacing-lg);
}

.wiz-error-summary__list a {
	color: var(--wiz-color-error);
}

/* --- Alert --- */
.wiz-alert {
	padding: var(--wiz-spacing-md);
	margin-bottom: var(--wiz-spacing-lg);
	border: 2px solid var(--wiz-color-border);
}

.wiz-alert--error {
	background: var(--wiz-color-error-bg);
	border-color: var(--wiz-color-error);
	color: var(--wiz-color-error);
}

.wiz-alert--warning {
	background: var(--wiz-color-warning-bg);
	border-color: var(--wiz-color-warning);
	color: var(--wiz-color-warning);
}

.wiz-alert p {
	margin: 0;
}

/* --- Success Icon --- */
.wiz-success-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3rem;
	height: 3rem;
	border-radius: 50%;
	background: var(--wiz-color-success);
	color: #fff;
	font-size: 1.5rem;
	font-weight: 700;
	margin-bottom: var(--wiz-spacing-md);
}

/* --- Details List --- */
.wiz-details {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: var(--wiz-spacing-xs) var(--wiz-spacing-md);
	margin: var(--wiz-spacing-md) 0;
}

.wiz-details dt {
	font-weight: 700;
	color: var(--wiz-color-text);
}

.wiz-details dd {
	margin: 0;
}

.wiz-details dd ul {
	margin: 0;
	padding-left: var(--wiz-spacing-md);
}

/* --- Buttons --- */
.wiz-btn {
	display: inline-flex;
	align-items: center;
	gap: var(--wiz-spacing-sm);
	padding: var(--wiz-spacing-sm) var(--wiz-spacing-lg);
	border: 2px solid transparent;
	border-radius: var(--wiz-border-radius);
	font-family: inherit;
	font-size: var(--wiz-font-size-base);
	font-weight: 700;
	cursor: pointer;
	text-decoration: none;
	transition: background var(--wiz-transition), border-color var(--wiz-transition);
	min-height: 44px;
}

.wiz-btn--primary {
	background: var(--wiz-color-primary);
	color: var(--wiz-color-primary-contrast);
	border-color: var(--wiz-color-primary);
}

.wiz-btn--primary:hover {
	background: var(--wiz-color-primary-hover);
	border-color: var(--wiz-color-primary-hover);
}

.wiz-btn--secondary {
	background: var(--wiz-color-bg);
	color: var(--wiz-color-text);
	border-color: var(--wiz-color-border);
}

.wiz-btn--secondary:hover {
	background: var(--wiz-color-bg-alt);
}

.wiz-btn--danger {
	background: var(--wiz-color-error);
	color: #fff;
	border-color: var(--wiz-color-error);
}

.wiz-btn--danger:hover {
	background: #c01018;
	border-color: #c01018;
}

.wiz-btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.wiz-actions {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: var(--wiz-spacing-md) 0;
	gap: var(--wiz-spacing-md);
	position: sticky;
	bottom: 0;
	background: var(--wiz-color-bg);
	border-top: 1px solid var(--wiz-color-border-light);
	z-index: 10;
}

.wiz-actions > .wiz-btn:only-child {
	margin-left: auto;
}

/* --- Summary Sidebar --- */
.wiz-summary {
	background: var(--wiz-color-bg-alt);
	padding: var(--wiz-spacing-lg);
	border: 1px solid var(--wiz-color-border-light);
	position: sticky;
	top: var(--wiz-spacing-md);
}

.wiz-summary__title {
	font-size: var(--wiz-font-size-lg);
	font-weight: 700;
	margin: 0 0 var(--wiz-spacing-md) 0;
	padding-bottom: var(--wiz-spacing-sm);
	border-bottom: 2px solid var(--wiz-color-border);
}

.wiz-summary__empty {
	color: var(--wiz-color-text-muted);
	font-size: var(--wiz-font-size-sm);
	font-style: italic;
	margin: 0;
}

.wiz-summary__section {
	padding: var(--wiz-spacing-sm) 0;
}

.wiz-summary__section + .wiz-summary__section {
	border-top: 1px solid var(--wiz-color-border-light);
}

.wiz-summary__label {
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-text-muted);
	margin-bottom: 2px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.wiz-summary__value {
	font-weight: 600;
	line-height: 1.4;
}

.wiz-summary__value--secondary {
	font-weight: 400;
	font-size: var(--wiz-font-size-sm);
}

.wiz-summary__additional {
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-text-muted);
	padding: var(--wiz-spacing-xs) 0;
	line-height: 1.4;
}

/* Session countdown (footer) */
.wiz-footer__session {
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-text-muted);
	margin-top: var(--wiz-spacing-sm);
	text-align: right;
}

.wiz-footer__session--warning {
	color: var(--wiz-color-error);
	font-weight: 700;
}

/* --- Confirmation / Finish --- */
.wiz-confirmation {
	padding: var(--wiz-spacing-lg);
	background: var(--wiz-color-success-bg);
	border: 2px solid var(--wiz-color-success);
	margin-bottom: var(--wiz-spacing-lg);
}

.wiz-confirmation__title {
	font-size: var(--wiz-font-size-lg);
	font-weight: 700;
	color: var(--wiz-color-success);
	margin: 0 0 var(--wiz-spacing-sm) 0;
}

.wiz-detail-list {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: var(--wiz-spacing-sm) var(--wiz-spacing-md);
	margin-bottom: var(--wiz-spacing-lg);
}

.wiz-detail-list dt {
	font-weight: 600;
	color: var(--wiz-color-text-muted);
}

.wiz-detail-list dd {
	margin: 0;
}

/* --- Loading Spinner --- */
.wiz-loading {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: var(--wiz-spacing-xl);
	gap: var(--wiz-spacing-md);
}

/* Initial loading skeleton — visible immediately after the static shell
   parses, before any wizard JS executes. Cleared by WizardApp.init(). */
.wiz-initial-loading {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 50vh;
	padding: var(--wiz-spacing-xl);
}

.wiz-spinner {
	width: 2.5rem;
	height: 2.5rem;
	border: 3px solid var(--wiz-color-border-light);
	border-top-color: var(--wiz-color-primary);
	border-radius: 50%;
	animation: wiz-spin 0.8s linear infinite;
}

@keyframes wiz-spin {
	to { transform: rotate(360deg); }
}

.wiz-loading__text {
	color: var(--wiz-color-text-muted);
	font-size: var(--wiz-font-size-sm);
}

/* --- Session Timeout Dialog --- */
.wiz-dialog-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 1000;
}

.wiz-dialog {
	background: var(--wiz-color-bg);
	padding: var(--wiz-spacing-lg);
	max-width: 500px;
	width: 90%;
	border: 2px solid var(--wiz-color-border);
}

.wiz-dialog__title {
	font-size: var(--wiz-font-size-lg);
	font-weight: 700;
	margin: 0 0 var(--wiz-spacing-md) 0;
}

.wiz-dialog__actions {
	display: flex;
	gap: var(--wiz-spacing-md);
	margin-top: var(--wiz-spacing-lg);
}

/* --- Footer --- */
.wiz-footer {
	padding: var(--wiz-spacing-lg) 0;
	border-top: 2px solid var(--wiz-color-border);
	margin-top: var(--wiz-spacing-xl);
}

.wiz-footer__links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wiz-spacing-md);
	list-style: none;
	margin: 0;
	padding: 0;
}

.wiz-footer__links a {
	color: var(--wiz-color-primary);
	text-decoration: underline;
	font-size: var(--wiz-font-size-sm);
}

.wiz-footer__links a:hover {
	color: var(--wiz-color-primary-hover);
}

/* --- Privacy Checkbox --- */
.wiz-privacy {
	display: flex;
	align-items: flex-start;
	gap: var(--wiz-spacing-sm);
	padding: var(--wiz-spacing-md);
	background: var(--wiz-color-bg-alt);
	margin-bottom: var(--wiz-spacing-md);
}

.wiz-privacy input[type="checkbox"] {
	flex-shrink: 0;
	width: 1.25rem;
	height: 1.25rem;
	margin-top: 0.125rem;
	accent-color: var(--wiz-color-primary);
}

.wiz-privacy--error {
	border: 2px solid var(--wiz-color-error);
	background: var(--wiz-color-error-bg);
}

.wiz-privacy--error label {
	color: var(--wiz-color-error);
}

/* --- Aria Live Region (hidden) --- */
.wiz-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* --- Responsive --- */
@media (max-width: 768px) {
	.wiz-page {
		padding: 0 var(--wiz-spacing-sm);
	}

	[data-wiz-theme] .wiz-header,
	[data-wiz-theme] .wiz-footer {
		margin-left: calc(-1 * var(--wiz-spacing-sm)) !important;
		margin-right: calc(-1 * var(--wiz-spacing-sm)) !important;
	}

	.wiz-main {
		flex-direction: column;
		gap: var(--wiz-spacing-md);
		padding: var(--wiz-spacing-md) 0;
	}

	.wiz-content,
	[data-wiz-theme] .wiz-content {
		padding: var(--wiz-spacing-md);
	}

	.wiz-sidebar {
		width: 100%;
		order: -1;
	}

	.wiz-summary,
	[data-wiz-theme] .wiz-summary {
		position: static;
		padding: var(--wiz-spacing-md);
	}

	.wiz-summary__title {
		font-size: var(--wiz-font-size-base);
		margin-bottom: var(--wiz-spacing-sm);
		padding-bottom: var(--wiz-spacing-xs);
	}

	.wiz-summary__section {
		padding: var(--wiz-spacing-xs) 0;
	}

	.wiz-summary__label {
		font-size: 0.6875rem;
	}

	.wiz-summary__value {
		font-size: var(--wiz-font-size-sm);
	}

	.wiz-steps__label {
		font-size: 0.75rem;
		padding: var(--wiz-spacing-xs) 0;
	}

	.wiz-steps__list::before,
	.wiz-steps__list::after {
		display: none;
	}

	.wiz-calendar__nav {
		flex-wrap: wrap;
		gap: 0;
	}

	.wiz-calendar__nav .wiz-calendar__period {
		flex-basis: 100%;
		order: -1;
		font-size: var(--wiz-font-size-base);
		margin-bottom: var(--wiz-spacing-xs);
	}

	.wiz-calendar__nav > .wiz-btn {
		flex: 1 1 0;
		min-width: 0;
		justify-content: center;
		text-align: center;
	}

	.wiz-calendar__nav > .wiz-btn:first-child {
		border-radius: var(--wiz-border-radius) 0 0 var(--wiz-border-radius);
		border-right: none;
	}

	.wiz-calendar__nav > .wiz-btn:last-child {
		border-radius: 0 var(--wiz-border-radius) var(--wiz-border-radius) 0;
		border-left: 1px solid var(--wiz-color-border);
	}

	[data-wiz-theme="artdeco"] .wiz-calendar__nav > .wiz-btn:first-child {
		clip-path: polygon(12px 0%, 100% 0%, 100% 100%, 12px 100%, 0% 50%) !important;
	}

	[data-wiz-theme="artdeco"] .wiz-calendar__nav > .wiz-btn:last-child {
		clip-path: polygon(0% 0%, calc(100% - 12px) 0%, 100% 50%, calc(100% - 12px) 100%, 0% 100%) !important;
	}

	[data-wiz-theme="cyberpunk"] .wiz-calendar__nav > .wiz-btn:first-child {
		clip-path: polygon(10px 0%, 100% 0%, 100% 100%, 0% 100%) !important;
	}

	[data-wiz-theme="cyberpunk"] .wiz-calendar__nav > .wiz-btn:last-child {
		clip-path: polygon(0% 0%, 100% 0%, calc(100% - 10px) 100%, 0% 100%) !important;
	}

	.wiz-calendar__days {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--wiz-spacing-sm);
	}

	.wiz-day {
		min-width: 0;
		overflow: hidden;
	}

	.wiz-slot {
		padding: var(--wiz-spacing-xs);
	}

	.wiz-detail-list {
		grid-template-columns: 1fr;
	}

	.wiz-actions {
		gap: 0;
		align-items: stretch;
	}

	.wiz-actions > .wiz-btn {
		flex: 1 1 0;
		min-width: 0;
		justify-content: center;
		text-align: center;
		font-size: var(--wiz-font-size-sm);
		padding-left: var(--wiz-spacing-sm);
		padding-right: var(--wiz-spacing-sm);
	}

	.wiz-actions > .wiz-btn:first-child:not(:only-child) {
		border-radius: var(--wiz-border-radius) 0 0 var(--wiz-border-radius);
		border-right: none;
	}

	.wiz-actions > .wiz-btn:last-child:not(:only-child) {
		border-radius: 0 var(--wiz-border-radius) var(--wiz-border-radius) 0;
		border-left: 1px solid var(--wiz-color-border);
	}

	[data-wiz-theme="artdeco"] .wiz-actions > .wiz-btn:first-child:not(:only-child) {
		clip-path: polygon(12px 0%, 100% 0%, 100% 100%, 12px 100%, 0% 50%) !important;
	}

	[data-wiz-theme="artdeco"] .wiz-actions > .wiz-btn:last-child:not(:only-child) {
		clip-path: polygon(0% 0%, calc(100% - 12px) 0%, 100% 50%, calc(100% - 12px) 100%, 0% 100%) !important;
	}

	[data-wiz-theme="artdeco"] .wiz-actions > .wiz-btn:only-child {
		clip-path: polygon(12px 0%, calc(100% - 12px) 0%, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0% 50%) !important;
	}

	[data-wiz-theme="cyberpunk"] .wiz-actions > .wiz-btn:first-child:not(:only-child) {
		clip-path: polygon(10px 0%, 100% 0%, 100% 100%, 0% 100%) !important;
	}

	[data-wiz-theme="cyberpunk"] .wiz-actions > .wiz-btn:last-child:not(:only-child) {
		clip-path: polygon(0% 0%, 100% 0%, calc(100% - 10px) 100%, 0% 100%) !important;
	}

	[data-wiz-theme="cyberpunk"] .wiz-actions > .wiz-btn:only-child {
		clip-path: polygon(10px 0%, 100% 0%, calc(100% - 10px) 100%, 0% 100%) !important;
	}

	.wiz-location {
		flex-wrap: wrap;
		padding: var(--wiz-spacing-sm);
		gap: var(--wiz-spacing-sm);
	}

	.wiz-location__body {
		flex: 1 1 calc(100% - 3rem);
		min-width: 0;
	}

	.wiz-location__image {
		width: 50px;
		height: 38px;
		order: -1;
	}

	.wiz-location__earliest {
		flex-basis: 100%;
		min-width: 0;
		margin-left: 0;
		padding-top: var(--wiz-spacing-sm);
		border-top: 1px solid var(--wiz-color-border-light);
		margin-top: var(--wiz-spacing-xs);
	}

	.wiz-location__earliest .wiz-btn--sm {
		width: 100%;
		text-align: center;
	}

	.wiz-service {
		flex-wrap: wrap;
		padding: var(--wiz-spacing-sm);
		gap: var(--wiz-spacing-sm);
	}

	.wiz-service__body {
		min-width: 0;
		flex: 1 1 calc(100% - 3rem);
	}

	.wiz-service__extra {
		flex: 1 1 100%;
		border-left: none;
		padding-left: 0;
		border-top: 1px solid var(--wiz-color-border-light, rgba(128,128,128,0.25));
		padding-top: var(--wiz-spacing-sm);
	}
}

@media (max-width: 480px) {
	:root {
		--wiz-font-size-base: 0.9375rem;
		--wiz-font-size-xl: 1.25rem;
	}

	.wiz-header__inner {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* --- Step Info Text --- */
.wiz-step__info {
	margin: 0 0 var(--wiz-spacing-md) 0;
	color: var(--wiz-color-text-muted);
	font-size: var(--wiz-font-size-sm);
}

/* --- Step Sub-Header --- */
.wiz-step__header {
	font-size: var(--wiz-font-size-lg);
	font-weight: 600;
	margin: 0 0 var(--wiz-spacing-sm) 0;
	color: var(--wiz-color-text-muted);
}

/* --- Info Box --- */
.wiz-info-box {
	padding: var(--wiz-spacing-md);
	margin-bottom: var(--wiz-spacing-md);
	background: var(--wiz-color-warning-bg);
	border: 1px solid var(--wiz-color-border-light);
	font-size: var(--wiz-font-size-sm);
}

/* --- Service Categories --- */
.wiz-category {
	margin-bottom: var(--wiz-spacing-md);
	border: 1px solid var(--wiz-color-border-light);
}

.wiz-category__title {
	font-weight: 700;
	padding: var(--wiz-spacing-sm) var(--wiz-spacing-md);
	cursor: pointer;
	font-size: var(--wiz-font-size-base);
}

.wiz-category__title:hover {
	background: var(--wiz-color-bg-alt);
}

/* --- Service URL --- */
.wiz-service__url {
	display: inline-block;
	margin-top: var(--wiz-spacing-xs);
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-primary);
}

/* --- Location Image --- */
.wiz-location__image {
	flex-shrink: 0;
	align-self: center;
	width: 80px;
	height: 60px;
	object-fit: cover;
	border-radius: 4px;
	border: 1px solid var(--wiz-color-border-light);
}

.wiz-location__image--empty {
	background: var(--wiz-color-bg-alt);
}

/* --- Location Select All --- */
.wiz-location--all {
	background: transparent;
	border: 2px dashed var(--wiz-color-border-light);
}

/* --- Footer Accessibility Button --- */
.wiz-footer__link-btn {
	background: none;
	border: none;
	color: var(--wiz-color-primary);
	text-decoration: underline;
	font-size: var(--wiz-font-size-sm);
	font-family: inherit;
	cursor: pointer;
	padding: 0;
}

.wiz-footer__link-btn:hover {
	color: var(--wiz-color-primary-hover);
}

/* --- Footer Text --- */
.wiz-footer__text {
	margin-top: var(--wiz-spacing-md);
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-text-muted);
}

/* --- Earliest Appointment (location cards) --- */
.wiz-location__earliest {
	flex: 0 0 16rem;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--wiz-font-size-sm);
	color: var(--wiz-color-primary);
	margin-left: auto;
	padding: var(--wiz-spacing-xs) var(--wiz-spacing-sm);
	text-align: center;
}

.wiz-location__earliest-loading {
	font-style: italic;
	color: var(--wiz-color-text-muted);
}

.wiz-location__earliest-none {
	color: var(--wiz-color-text-muted);
}

.wiz-location__earliest .wiz-btn--sm {
	padding: var(--wiz-spacing-sm) var(--wiz-spacing-md);
	font-size: var(--wiz-font-size-sm);
	white-space: normal;
	line-height: 1.3;
	width: 100%;
	height: 100%;
}

/* --- Finish Action Buttons --- */
.wiz-finish-actions {
	display: flex;
	gap: var(--wiz-spacing-md);
	flex-wrap: wrap;
	margin-top: var(--wiz-spacing-lg);
}

/* --- Print Content (hidden on screen) --- */
.wiz-print-content {
	display: none;
}

/* --- Print --- */
@media print {
	.wiz-skip-link,
	.wiz-steps,
	.wiz-actions,
	.wiz-sidebar,
	.wiz-footer,
	.wiz-finish-actions,
	.wiz-finish-cancel {
		display: none !important;
	}

	.wiz-main {
		display: block;
	}

	body {
		font-size: 11pt;
		color: #000;
	}

	.wiz-confirmation {
		border: 1px solid #000;
		background: none;
	}

	.wiz-print-content {
		display: block !important;
	}
}

/* --- Live Slot Updates (SignalR) --- */

.wiz-slot--removed {
	opacity: 0;
	transform: scale(0.95);
	transition: opacity 0.5s ease, transform 0.5s ease;
	pointer-events: none;
}

.wiz-slot--added {
	animation: wiz-slot-fade-in 0.5s ease forwards;
}

@keyframes wiz-slot-fade-in {
	from { opacity: 0; transform: scale(0.95); }
	to   { opacity: 1; transform: scale(1); }
}

/* WCAG 2.3.1: Respect reduced-motion preference */
@media (prefers-reduced-motion: reduce) {
	.wiz-slot,
	.wiz-slot--removed,
	.wiz-slot--added {
		transition: none !important;
		animation: none !important;
	}
}