.espaco-wizard {
	/*max-width: 80%;*/
	min-height:70vh;
	margin: 2em 0 0 0;
	background: #fff;
	border-radius: 1em;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.08);
	font-family: "Inter", sans-serif;
	overflow: hidden;
}

/* ---- Header: brand, voltar, fases ---- */

.espaco-wizard-header {
	position: sticky;
	top: 0; /* mesmo valor de .main-content padding-top — encosta ao header fixo do site */
	z-index: 10;
	padding: 1.75em 2em 1.5em 2em;
	background: linear-gradient(120deg, #fdf3f2 0%, #fff 60%);
}

.espaco-wizard-header-top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1em;
}

.espaco-wizard-brand {
	display: flex;
	align-items: center;
	gap: 1em;
}

.espaco-wizard-brand-icon {
	flex: 0 0 auto;
	width: 3em;
	height: 3em;
	border-radius: 0.9em;
	background: #b15247;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.4em;
}

.espaco-wizard-brand-text {
	display: flex;
	flex-direction: column;
}

.espaco-wizard-brand-text strong {
	font-size: 1.4em;
	font-weight: 700;
	color: #1a1a1a;
}

.espaco-wizard-brand-text span {
	font-size: 0.9em;
	color: #777;
}

.espaco-wizard-back {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	background: #fff;
	border: 1px solid #e2e2e2;
	border-radius: 2em;
	color: #444;
	cursor: pointer;
	font-size: 0.9em;
	font-weight: 600;
	padding: 0.6em 1.1em;
	white-space: nowrap;
	transition: 0.2s;
}

.espaco-wizard-back:hover {
	border-color: #b15247;
	color: #b15247;
}

/* ---- Indicador de fases (1 2 3 4) ---- */

.espaco-wizard-phases {
	display: flex;
	align-items: center;
	margin-top: 1.75em;
}

.espaco-wizard-phase {
	display: flex;
	align-items: center;
	gap: 0.6em;
	flex: 0 0 auto;
}

.espaco-wizard-phase-circle {
	width: 2em;
	height: 2em;
	border-radius: 50%;
	border: 1px solid #ddd;
	background: #fff;
	color: #999;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.9em;
	font-weight: 700;
	flex: 0 0 auto;
}

.espaco-wizard-phase-label {
	font-size: 0.9em;
	color: #999;
	white-space: nowrap;
}

.espaco-wizard-phase.is-active .espaco-wizard-phase-circle {
	background: #b15247;
	border-color: #b15247;
	color: #fff;
}

.espaco-wizard-phase.is-active .espaco-wizard-phase-label {
	color: #b15247;
	font-weight: 600;
}

.espaco-wizard-phase.is-done .espaco-wizard-phase-circle {
	background: #fdf0ef;
	border-color: #b15247;
	color: #b15247;
}

.espaco-wizard-phase.is-done .espaco-wizard-phase-label {
	color: #444;
}

.espaco-wizard-phase-line {
	flex: 1 1 auto;
	height: 1px;
	min-width: 1.5em;
	background: #e2e2e2;
	margin: 0 0.75em;
}

.espaco-wizard-phase-line.is-done {
	background: #b15247;
}

/* ---- Título do passo atual (ícone + título + subtítulo) ---- */

.espaco-wizard-step-title {
	display: flex;
	align-items: center;
	gap: 1em;
	padding: 1.5em 2em 0 2em;
	margin-bottom: 1.5em;
}

.espaco-wizard-step-title:empty {
	display: none;
}

.espaco-wizard-step-icon {
	flex: 0 0 auto;
	width: 2.75em;
	height: 2.75em;
	border-radius: 50%;
	background: #fdf0ef;
	color: #b15247;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.1em;
}

.espaco-wizard-step-icon.is-success {
	background: #e9f5ea;
	color: #2e7d32;
}

.espaco-wizard-step-heading {
	display: flex;
	flex-direction: column;
}

.espaco-wizard-step-heading strong {
	font-size: 1.3em;
	font-weight: 600;
	color: #1a1a1a;
}

.espaco-wizard-step-heading small {
	font-size: 0.9em;
	color: #777;
	font-weight: 400;
}

.espaco-wizard-step-body {
	display: flex;
	flex-direction: column;
	gap: 0.75em;
	padding: 0 2em 2em 2em;
}

/* ---- Cartões de opção (com ícone + seta) ---- */

.espaco-wizard-card {
	display: flex;
	align-items: center;
	gap: 1em;
	width: 100%;
	text-align: left;
	padding: 0.85em 1.1em;
	border: 1px solid #e2e2e2;
	border-radius: 0.9em;
	background: #fff;
	font-size: 1em;
	cursor: pointer;
	transition: 0.2s;
}

.espaco-wizard-card:hover {
	border-color: #b15247;
	background: #fdf7f6;
}

.espaco-wizard-card-icon {
	flex: 0 0 auto;
	width: 2.5em;
	height: 2.5em;
	border-radius: 50%;
	background: #fdf0ef;
	color: #b15247;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1em;
}

.espaco-wizard-card-label {
	flex: 1 1 auto;
	color: #1a1a1a;
}

.espaco-wizard-card-meta {
	flex: 0 1 auto;
	max-width: 45%;
	text-align: right;
	color: #777;
	font-size: 0.85em;
	line-height: 1.4em;
}

.espaco-wizard-card-arrow {
	flex: 0 0 auto;
	color: #ccc;
	font-size: 0.85em;
}

.espaco-wizard-card:hover .espaco-wizard-card-arrow {
	color: #b15247;
}

/* ---- Estados auxiliares / formulário (inalterado) ---- */

.espaco-wizard-option {
	display: block;
	width: 100%;
	text-align: left;
	padding: 0.9em 1.2em;
	border: 1px solid #ddd;
	border-radius: 0.75em;
	background: #f9fafb;
	font-size: 1em;
	cursor: pointer;
	transition: 0.2s;
}

.espaco-wizard-option:hover {
	border-color: #b15247;
	background: #fbf3f2;
	color: #b15247;
}

.espaco-wizard-submit {
	display: block;
	width: 100%;
	text-align: center;
	padding: 0.9em 1.2em;
	border: none;
	border-radius: 0.75em;
	background: #b15247;
	color: #fff;
	font-size: 1em;
	font-weight: 600;
	cursor: pointer;
	transition: 0.2s;
}

.espaco-wizard-submit:hover {
	background: #96453b;
}

.espaco-wizard-loading,
.espaco-wizard-error {
	color: #777;
}

.espaco-wizard-loading {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.6em;
	padding: 3em 0;
	font-size: 1em;
}

.espaco-wizard-loading i {
	color: #b15247;
	font-size: 1.2em;
}

.espaco-wizard-error {
	color: #a00;
}

.espaco-wizard-form {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 0 1em;
	align-items: start;
}

/* Cada campo é uma célula da grid — a largura vem de is-narrow/is-wide/
   is-full consoante o tamanho típico do que se escreve lá dentro (ex: NIF
   e idade cabem em pouco espaço, nome e morada precisam de mais). */
.espaco-wizard-field {
	display: flex;
	flex-direction: column;
	grid-column: span 6;
}

.espaco-wizard-field.is-narrow { grid-column: span 2; }
.espaco-wizard-field.is-wide   { grid-column: span 4; }
.espaco-wizard-field.is-full   { grid-column: span 6; }

.espaco-wizard-form label {
	font-size: 0.9em;
	font-weight: 600;
	margin-top: 0.6em;
}

.espaco-wizard-form input,
.espaco-wizard-form textarea {
	padding: 0.7em 0.9em;
	border: 1px solid #ddd;
	border-radius: 0.5em;
	font-family: inherit;
	font-size: 1em;
	width: 100%;
}

.espaco-wizard-form-section-title {
	grid-column: span 6;
	margin: 1.2em 0 0 0;
	padding-top: 1em;
	border-top: 1px solid #eee;
	font-size: 1em;
	font-weight: 600;
	color: #b15247;
}

.espaco-wizard-form fieldset {
	grid-column: span 6;
	border: 1px solid #ddd;
	border-radius: 0.5em;
	margin-top: 1em;
	padding: 0.8em 1em;
}

.espaco-wizard-form > .espaco-wizard-notice,
.espaco-wizard-form > .espaco-wizard-submit {
	grid-column: span 6;
}

.espaco-wizard-form fieldset label {
	font-weight: 400;
	display: block;
	margin: 0.3em 0;
}

/* ---- Métodos de pagamento (radio à esquerda, alinhado) ---- */

.espaco-wizard-payment-methods {
	display: flex;
	flex-direction: column;
	gap: 0.6em;
}

.espaco-wizard-form fieldset.espaco-wizard-payment-methods label.espaco-wizard-payment-option {
	display: flex;
	align-items: flex-start;
	gap: 0.7em;
	margin: 0;
	padding: 0.8em 1em;
	border: 1px solid #e2e5ea;
	border-radius: 0.6em;
	cursor: pointer;
	transition: border-color 0.15s, box-shadow 0.15s;
}

.espaco-wizard-payment-option:has(input:checked) {
	border-color: #b15247;
	box-shadow: inset 0 0 0 1px #b15247;
}

.espaco-wizard-payment-option > input[type="radio"] {
	width: auto;
	margin: 0.15em 0 0;
	flex-shrink: 0;
	accent-color: #b15247;
}

.espaco-wizard-payment-option-body {
	display: flex;
	flex-direction: column;
	gap: 0.15em;
}

.espaco-wizard-payment-option-name {
	font-weight: 600;
}

.espaco-wizard-payment-option-desc {
	font-size: 0.85em;
	color: #777;
}

.espaco-wizard-payment-phone {
	margin: -0.1em 0 0.2em;
	padding-left: 0.2em;
}

.espaco-wizard-payment-phone label {
	display: block;
	font-size: 0.85em;
	font-weight: 600;
	margin-bottom: 0.3em;
}

.espaco-wizard-payment-phone input {
	max-width: 16em;
}

.espaco-wizard-payment-status {
	margin: 0.8em 0 0;
	font-weight: 600;
}

.espaco-wizard-payment-status.is-waiting { color: #b9770a; }
.espaco-wizard-payment-status.is-done { color: #2a7a4a; }
.espaco-wizard-payment-status.is-failed { color: #a00; }

.espaco-wizard-notice {
	font-size: 0.85em;
	color: #a00;
	background: #fdf0ef;
	border-radius: 0.5em;
	padding: 0.75em 1em;
}

.espaco-wizard-payment {
	background: #f9fafb;
	border-radius: 0.75em;
	padding: 1em 1.2em;
	margin-top: 1em;
	border:1px solid #a00;
}

/* ---- Resumo da marcação (confirmação final) ---- */

.espaco-wizard-summary {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.6em 1.5em;
	margin-top: 0.5em;
}

/* Título de secção ("Consulta"/"Dados Pessoais"/"Faturação") — mesma
   linguagem visual do título usado no formulário de dados pessoais, para
   as duas telas lerem como parte do mesmo fluxo. */
.espaco-wizard-summary-section-title {
	grid-column: span 2;
	display: flex;
	align-items: center;
	gap: 0.5em;
	font-size: 0.78em;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #b15247;
	margin: 1.3em 0 0.5em 0;
	padding-bottom: 0.4em;
	border-bottom: 1px solid #f0e0de;
}

.espaco-wizard-summary-section-title:first-child {
	margin-top: 0;
}

.espaco-wizard-summary-item {
	display: flex;
	align-items: center;
	background: #fff;
	min-width: 0; /* permite ao texto encolher/quebrar em vez de alargar a coluna */
}

.espaco-wizard-summary-item.is-full {
	grid-column: span 2;
}

.espaco-wizard-summary-text {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.espaco-wizard-summary-text small {
	font-size: 0.72em;
	font-weight: 600;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #999;
}

.espaco-wizard-summary-text strong {
	font-size: 1.02em;
	font-weight: 600;
	color: #1a1a1a;
	line-height: 1.35;
	overflow-wrap: anywhere;
}

/* Nota discreta junto ao Valor (texto por extenso da especialidade) —
   claramente secundária face ao valor em si. */
.espaco-wizard-summary-note {
	font-size: 0.78em;
	font-weight: 400;
	text-transform: none;
	letter-spacing: normal;
	color: #999;
	margin-top: 0.2em;
}

/* ---- Passo do calendário: calendário + lista de horários lado a lado ---- */

.espaco-wizard-calendar {
	display: flex;
	gap: 1.5em;
	align-items: flex-start;
}

.espaco-wizard-calendar-picker {
	flex: 0 0 auto;
}

.espaco-wizard-calendar-picker .flatpickr-calendar {
	box-shadow: none;
	border: 1px solid #eee;
	border-radius: 0.9em;
	width: 100%;
}

.espaco-wizard-calendar-list {
	flex: 1 1 320px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.75em;
}

.espaco-wizard-calendar-list-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1em;
}

.espaco-wizard-calendar-list-header h3 {
	font-size: 1em;
	font-weight: 600;
	color: #1a1a1a;
	margin: 0;
}

.espaco-wizard-calendar-reset {
	flex: 0 0 auto;
	background: none;
	border: none;
	color: #b15247;
	cursor: pointer;
	font-size: 0.85em;
	font-weight: 600;
	padding: 0;
}

.espaco-wizard-calendar-reset:hover {
	text-decoration: underline;
}

.espaco-wizard-calendar-slots {
	display: flex;
	flex-direction: column;
	gap: 0.6em;
	max-height: 22em;
	overflow-y: auto;
	padding-right: 0.25em;
}

/* Flatpickr: cores da marca em vez do azul por omissão */

.espaco-wizard-calendar-picker .flatpickr-day.selected,
.espaco-wizard-calendar-picker .flatpickr-day.selected:hover {
	background: #b15247;
	border-color: #b15247;
}

.espaco-wizard-calendar-picker .flatpickr-day.today {
	border-color: #b15247;
}

.espaco-wizard-calendar-picker .flatpickr-day:not(.flatpickr-disabled):not(.selected):hover {
	background: #fdf0ef;
	border-color: #fdf0ef;
}

/* Dias sem disponibilidade: mais discretos do que o cinza-claro por omissão do flatpickr */
.espaco-wizard-calendar .flatpickr-day.flatpickr-disabled {
	color: rgba(57, 57, 57, 0.3) !important;
}


/* Dias com disponibilidade: destacados a bold na cor da marca (exceto o
   selecionado, que já tem o seu próprio estilo branco sobre fundo salmão). */
.espaco-wizard-calendar .flatpickr-day:not(.flatpickr-disabled):not(.selected) {
	color: #b15247 !important;
	font-weight: 700;
}

@media (max-width: 640px) {
	.espaco-wizard-header-top {
		flex-wrap: wrap;
	}

	.espaco-wizard-phase-label {
		display: none;
	}

	.espaco-wizard-phase-line {
		min-width: 1em;
	}

	.espaco-wizard-calendar {
		flex-direction: column;
	}

	.espaco-wizard-calendar-picker,
	.espaco-wizard-calendar-picker .flatpickr-calendar {
		width: 100%;
	}

	/* Em ecrãs estreitos os campos "curtos" (idade, telefone, NIF) deixam
	   de caber lado a lado com espaço útil — uma coluna só, sempre. */
	.espaco-wizard-field.is-narrow,
	.espaco-wizard-field.is-wide {
		grid-column: span 6;
	}

	.espaco-wizard-summary {
		grid-template-columns: 1fr;
	}

	.espaco-wizard{ margin:0; width:100%;}
	.espaco-wizard-header{ padding: 1em 1.25em 0.75em 1.25em; }
	.espaco-wizard-step-title {padding: 1em 1.25em 0 1.25em;}
	.espaco-wizard-step-body {padding: 0 1em 1em 1em;}
	.espaco-wizard-card{ padding: 0.875em 0.5em; }

}