/**
 * Epilfit Booking — formulaire côté site.
 * Mobile d'abord ; les media queries élargissent ensuite.
 *
 * Typographie : on réutilise les deux polices déjà chargées par le thème,
 * aucune requête supplémentaire.
 *   — Marcellus (serif, une seule graisse) pour les titres et les noms de prestations ;
 *   — Spartan (sans, graisses complètes) pour l'interface, les chiffres et les boutons.
 * Marcellus n'ayant pas de gras, la hiérarchie se fait par la taille, la couleur
 * et l'interlettrage — jamais par un font-weight qui serait synthétisé.
 *
 * Tout est préfixé par .epf-booking pour ne pas subir les styles du thème.
 */

.epf-booking {
	--epf-taupe: #a1907e;
	--epf-taupe-dark: #85735f;
	--epf-taupe-soft: #c9bcae;
	--epf-cream: #f8f5f1;
	--epf-cream-deep: #efe7de;
	--epf-line: #e8e0d6;
	--epf-ink: #2e2a26;
	--epf-muted: #8b8179;
	--epf-white: #ffffff;
	--epf-danger: #b4534a;

	--epf-display: var(--theme-font-p_font-family, "Marcellus", Georgia, "Times New Roman", serif);
	--epf-ui: "Spartan", var(--theme-font-menu_font-family, ui-sans-serif), -apple-system, "Segoe UI", Roboto, sans-serif;

	--epf-radius: 20px;
	--epf-shadow: 0 24px 50px -38px rgba(46, 42, 38, 0.45);

	box-sizing: border-box;
	max-width: 760px;
	margin: 0 auto;
	font-family: var(--epf-ui);
	color: var(--epf-ink);
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
}

.epf-booking *,
.epf-booking *::before,
.epf-booking *::after {
	box-sizing: border-box;
}

/* Les règles display: de ce fichier ne doivent jamais ré-afficher un [hidden]. */
.epf-booking [hidden] {
	display: none !important;
}

.epf-booking button {
	font-family: var(--epf-ui);
	letter-spacing: 0;
}

/* Hauteur : deux usages, deux règles.
   — Dans une colonne de hero, la carte est bornée et c'est son contenu qui
     défile : elle ne doit ni grandir ni rétrécir d'une étape à l'autre.
   — Sur une page dédiée à la réservation, c'est la page qui défile. Brider la
     carte n'y sert à rien et réduit le nombre de champs visibles. Une hauteur
     minimale suffit à éviter les sauts entre étapes. */
.epf-booking .epf-card {
	display: flex;
	flex-direction: column;
	min-height: min(520px, 76vh);
	background: var(--epf-white);
	border: 1px solid var(--epf-line);
	border-radius: var(--epf-radius);
	box-shadow: var(--epf-shadow);
	overflow: hidden;
}

.epf-booking .epf-head,
.epf-booking .epf-steps {
	flex: 0 0 auto;
}

/* ------------------------------------------------------------------ En-tête */

.epf-booking .epf-head {
	padding: 30px 22px 22px;
	text-align: center;
	background: linear-gradient(180deg, var(--epf-cream) 0%, var(--epf-white) 100%);
	border-bottom: 1px solid var(--epf-line);
}

.epf-booking .epf-eyebrow {
	margin: 0 0 10px;
	font-family: var(--epf-ui);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.3em;
	text-indent: 0.3em;
	text-transform: uppercase;
	color: var(--epf-taupe);
	line-height: 1;
}

.epf-booking .epf-title {
	margin: 0;
	font-family: var(--epf-display);
	font-size: 26px;
	line-height: 1.2;
	font-weight: 400;
	letter-spacing: 0.005em;
	color: var(--epf-ink);
}

.epf-booking .epf-intro {
	margin: 11px auto 0;
	max-width: 44ch;
	font-family: var(--epf-ui);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.7;
	color: var(--epf-muted);
}

/* -------------------------------------------------------------- Indicateurs */

.epf-booking .epf-steps {
	display: flex;
	margin: 0;
	padding: 15px 12px;
	list-style: none;
	gap: 6px;
	background: var(--epf-white);
	border-bottom: 1px solid var(--epf-line);
}

.epf-booking .epf-step {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7px;
	font-family: var(--epf-ui);
	font-size: 10.5px;
	font-weight: 500;
	letter-spacing: 0.06em;
	color: var(--epf-taupe-soft);
	text-align: center;
	line-height: 1.2;
}

.epf-booking .epf-step span {
	display: grid;
	place-items: center;
	width: 27px;
	height: 27px;
	border-radius: 50%;
	border: 1px solid var(--epf-line);
	background: var(--epf-white);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0;
	color: var(--epf-taupe-soft);
	transition: all 0.22s ease;
}

.epf-booking .epf-step.is-active span,
.epf-booking .epf-step.is-done span {
	background: var(--epf-taupe);
	border-color: var(--epf-taupe);
	color: var(--epf-white);
}

.epf-booking .epf-step.is-active {
	color: var(--epf-ink);
	font-weight: 600;
}

/* ----------------------------------------------------------------- Panneaux */

.epf-booking .epf-body {
	flex: 1 1 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.epf-booking .epf-panel {
	display: none;
	animation: epf-fade 0.28s ease;
}

/* Chaque étape : une zone de contenu qui défile, puis une barre d'actions fixe.
   Les boutons ne recouvrent jamais un champ, et la carte ne bouge pas. */
.epf-booking .epf-panel.is-active {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}

.epf-booking .epf-scroll {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-width: thin;
	padding: 20px 18px 6px;
}

.epf-booking .epf-form {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}

@keyframes epf-fade {
	from { opacity: 0; transform: translateY(6px); }
	to   { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
	.epf-booking .epf-panel { animation: none; }
	.epf-booking .epf-step span { transition: none; }
}

/* -------------------------------------------------------------- Prestations */

.epf-booking .epf-cat {
	margin-bottom: 22px;
}

.epf-booking .epf-cat:last-child {
	margin-bottom: 0;
}

.epf-booking .epf-cat-name {
	margin: 0 0 11px;
	font-family: var(--epf-ui);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-indent: 0.2em;
	text-transform: uppercase;
	color: var(--epf-taupe);
	line-height: 1;
}

.epf-booking .epf-service {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	width: 100%;
	padding: 15px 17px;
	margin-bottom: 8px;
	background: var(--epf-white);
	border: 1px solid var(--epf-line);
	border-radius: 14px;
	text-align: left;
	color: var(--epf-ink);
	cursor: pointer;
	transition: border-color 0.18s ease, background 0.18s ease;
	-webkit-tap-highlight-color: transparent;
}

.epf-booking .epf-service:hover,
.epf-booking .epf-service:focus-visible {
	border-color: var(--epf-taupe);
	background: var(--epf-cream);
	outline: none;
}

.epf-booking .epf-service.is-selected {
	border-color: var(--epf-taupe);
	background: var(--epf-cream);
	box-shadow: inset 0 0 0 1px var(--epf-taupe);
}

/* Absorbe l'espace libre : sans cela, space-between laisse flotter le prix
   à une abscisse différente selon la longueur du nom de la prestation. */
.epf-booking .epf-service-main {
	flex: 1 1 auto;
	min-width: 0;
}

.epf-booking .epf-service-name {
	display: block;
	font-family: var(--epf-display);
	font-size: 16.5px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0.005em;
}

.epf-booking .epf-service-meta {
	display: block;
	margin-top: 5px;
	font-family: var(--epf-ui);
	font-size: 11.5px;
	font-weight: 400;
	letter-spacing: 0.02em;
	color: var(--epf-muted);
}

.epf-booking .epf-service-price {
	flex-shrink: 0;
	font-family: var(--epf-ui);
	font-size: 12.5px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--epf-taupe-dark);
	white-space: nowrap;
}

.epf-booking .epf-service-arrow {
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	stroke: var(--epf-taupe-soft);
	stroke-width: 1.8;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.epf-booking .epf-back-link {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	margin-bottom: 14px;
	padding: 0;
	border: 0;
	background: none;
	font-family: var(--epf-ui);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--epf-taupe);
	cursor: pointer;
}

.epf-booking .epf-back-link:hover {
	color: var(--epf-taupe-dark);
}

.epf-booking .epf-back-link svg {
	width: 13px;
	height: 13px;
	stroke: currentColor;
	stroke-width: 2;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* ------------------------------------- Étape 2 en deux écrans (mobile/compact)

   Calendrier et créneaux ne s'affichent jamais ensemble sur une colonne étroite :
   la carte resterait haute de plus d'un écran. On passe de l'un à l'autre, et le
   choix du créneau enchaîne directement sur l'étape suivante. */

.epf-booking .epf-panel[data-step="2"].is-time-view .epf-calendar {
	display: none;
}

.epf-booking .epf-panel[data-step="2"].is-time-view [data-next] {
	display: none;
}

.epf-booking .epf-panel[data-step="2"]:not(.is-time-view) [data-date-back] {
	display: none;
}

/* --------------------------------------------------- Mode compact (colonne) */

.epf-booking.epf-compact {
	max-width: 420px;
}

/* Posée dans une colonne de hero, la carte doit rester plus courte que la
   hauteur d'écran, bandeau du site compris — et strictement stable. */
.epf-booking.epf-compact .epf-card {
	height: clamp(420px, 68vh, 560px);
	min-height: 0;
}

/* Posée sur une photo, la carte a besoin d'un bandeau plein pour se détacher :
   le dégradé crème se confond avec l'image. */
.epf-booking.epf-compact .epf-card {
	box-shadow: 0 30px 60px -30px rgba(30, 26, 22, 0.55);
	border-color: rgba(255, 255, 255, 0.5);
}

.epf-booking.epf-compact .epf-head {
	padding: 20px 20px 18px;
	background: var(--epf-taupe);
	border-bottom: 0;
}

.epf-booking.epf-compact .epf-eyebrow {
	color: rgba(255, 255, 255, 0.72);
	margin-bottom: 7px;
}

.epf-booking.epf-compact .epf-title {
	font-size: 22px;
	color: var(--epf-white);
}

/* En colonne, chaque ligne d'en-tête est prise sur la zone utile : la phrase
   d'introduction est portée par la page autour de la carte, pas par la carte. */
.epf-booking.epf-compact .epf-intro {
	display: none;
}

.epf-booking.epf-compact .epf-steps {
	padding: 10px 8px;
}

.epf-booking.epf-compact .epf-steps {
	padding: 12px 10px;
}

.epf-booking.epf-compact .epf-scroll {
	padding: 16px 16px 6px;
}

.epf-booking.epf-compact .epf-actions {
	padding: 12px 16px 16px;
}

.epf-booking.epf-compact .epf-service {
	padding: 13px 15px;
}

.epf-booking.epf-compact .epf-service-name {
	font-size: 15.5px;
}

.epf-booking.epf-compact .epf-cat-card .epf-service-name {
	font-size: 16px;
}

.epf-booking.epf-compact .epf-calendar {
	padding: 12px 9px;
}

.epf-booking.epf-compact .epf-day {
	min-height: 34px;
	font-size: 12px;
	border-radius: 9px;
}

.epf-booking.epf-compact .epf-slots {
	grid-template-columns: repeat(auto-fill, minmax(68px, 1fr));
	gap: 6px;
}

.epf-booking.epf-compact .epf-slot {
	padding: 10px 4px;
	font-size: 12.5px;
}

.epf-booking.epf-compact .epf-btn {
	font-size: 11.5px;
	letter-spacing: 0.05em;
	padding: 13px 12px;
	min-width: 0;
}

.epf-booking.epf-compact .epf-btn-ghost {
	min-width: 76px;
}

/* En colonne étroite, la vue deux colonnes de l'étape 2 n'a pas sa place. */
@media (min-width: 860px) {
	.epf-booking.epf-compact .epf-panel[data-step="2"].is-active {
		display: block;
	}
	.epf-booking.epf-compact .epf-panel[data-step="2"] .epf-calendar {
		margin-bottom: 18px;
	}
}

/* ------------------------------------------------------------ Récapitulatif */

.epf-booking .epf-recap {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
	padding: 13px 15px;
	margin-bottom: 18px;
	background: var(--epf-cream);
	border-radius: 12px;
}

.epf-booking .epf-recap-item {
	display: flex;
	align-items: center;
	gap: 7px;
	font-family: var(--epf-ui);
	font-size: 12.5px;
	font-weight: 400;
	letter-spacing: 0.01em;
	color: var(--epf-ink);
}

.epf-booking .epf-recap-item strong {
	font-family: var(--epf-display);
	font-size: 14.5px;
	font-weight: 400;
}

.epf-booking .epf-recap-item svg {
	width: 14px;
	height: 14px;
	stroke: var(--epf-taupe);
	stroke-width: 1.7;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
	flex-shrink: 0;
}

/* ---------------------------------------------------------------- Calendrier */

.epf-booking .epf-calendar {
	border: 1px solid var(--epf-line);
	border-radius: 14px;
	padding: 14px 12px;
	margin-bottom: 20px;
}

.epf-booking .epf-cal-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 12px;
}

.epf-booking .epf-cal-month {
	font-family: var(--epf-display);
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 0.01em;
	text-transform: capitalize;
}

.epf-booking .epf-cal-nav {
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 1px solid var(--epf-line);
	background: var(--epf-white);
	cursor: pointer;
	padding: 0;
	transition: background 0.18s ease, border-color 0.18s ease;
}

.epf-booking .epf-cal-nav:hover:not(:disabled) {
	background: var(--epf-cream);
	border-color: var(--epf-taupe);
}

.epf-booking .epf-cal-nav:disabled {
	opacity: 0.3;
	cursor: not-allowed;
}

.epf-booking .epf-cal-nav svg {
	width: 15px;
	height: 15px;
	stroke: var(--epf-taupe-dark);
	stroke-width: 1.9;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.epf-booking .epf-cal-weekdays,
.epf-booking .epf-cal-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 4px;
}

.epf-booking .epf-cal-weekdays {
	margin-bottom: 7px;
}

.epf-booking .epf-cal-weekdays span {
	text-align: center;
	font-family: var(--epf-ui);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--epf-taupe-soft);
	padding: 4px 0;
}

.epf-booking .epf-day {
	position: relative;
	aspect-ratio: 1 / 1;
	min-height: 40px;
	display: grid;
	place-items: center;
	border: 1px solid transparent;
	border-radius: 11px;
	background: transparent;
	font-family: var(--epf-ui);
	font-size: 13px;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	color: var(--epf-ink);
	cursor: pointer;
	padding: 0;
	transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease;
	-webkit-tap-highlight-color: transparent;
}

.epf-booking .epf-day.is-empty {
	visibility: hidden;
	cursor: default;
}

.epf-booking .epf-day.is-available {
	background: var(--epf-cream);
	border-color: var(--epf-cream-deep);
}

.epf-booking .epf-day.is-available:hover,
.epf-booking .epf-day.is-available:focus-visible {
	border-color: var(--epf-taupe);
	outline: none;
}

.epf-booking .epf-day.is-disabled {
	color: var(--epf-taupe-soft);
	cursor: not-allowed;
	font-weight: 400;
	opacity: 0.6;
}

.epf-booking .epf-day.is-selected {
	background: var(--epf-taupe);
	border-color: var(--epf-taupe);
	color: var(--epf-white);
	font-weight: 600;
}

.epf-booking .epf-day.is-today::after {
	content: "";
	position: absolute;
	bottom: 6px;
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: var(--epf-taupe);
}

.epf-booking .epf-day.is-selected.is-today::after {
	background: var(--epf-white);
}

/* ------------------------------------------------------------------ Créneaux */

.epf-booking .epf-slots-title {
	margin: 0 0 11px;
	font-family: var(--epf-ui);
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--epf-taupe);
	line-height: 1.4;
}

.epf-booking .epf-slots {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(78px, 1fr));
	gap: 8px;
}

.epf-booking .epf-slot {
	padding: 12px 6px;
	border: 1px solid var(--epf-line);
	border-radius: 11px;
	background: var(--epf-white);
	font-family: var(--epf-ui);
	font-size: 13px;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	letter-spacing: 0.02em;
	color: var(--epf-ink);
	cursor: pointer;
	transition: all 0.16s ease;
	-webkit-tap-highlight-color: transparent;
}

.epf-booking .epf-slot:hover,
.epf-booking .epf-slot:focus-visible {
	border-color: var(--epf-taupe);
	background: var(--epf-cream);
	outline: none;
}

.epf-booking .epf-slot.is-selected {
	background: var(--epf-taupe);
	border-color: var(--epf-taupe);
	color: var(--epf-white);
	font-weight: 600;
}

.epf-booking .epf-empty {
	grid-column: 1 / -1;
	padding: 18px 14px;
	text-align: center;
	font-family: var(--epf-ui);
	font-size: 12.5px;
	line-height: 1.6;
	color: var(--epf-muted);
	background: var(--epf-cream);
	border-radius: 11px;
}

/* ----------------------------------------------------------------- Formulaire */

.epf-booking .epf-field {
	margin-bottom: 15px;
}

.epf-booking .epf-field label {
	display: block;
	margin-bottom: 7px;
	font-family: var(--epf-ui);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--epf-taupe-dark);
	line-height: 1.3;
}

.epf-booking .epf-optional {
	font-weight: 400;
	letter-spacing: 0.06em;
	text-transform: none;
	color: var(--epf-muted);
}

/* Aide sous un champ : discrète, elle ne doit pas concurrencer l'étiquette. */
.epf-booking .epf-aide {
	display: block;
	margin-top: 6px;
	font-family: var(--epf-ui);
	font-size: 12px;
	font-style: normal;
	color: var(--epf-muted);
}

.epf-booking .epf-field input,
.epf-booking .epf-field textarea {
	width: 100%;
	padding: 13px 15px;
	border: 1px solid var(--epf-line);
	border-radius: 12px;
	background: var(--epf-white);
	font-family: var(--epf-ui);
	font-size: 16px; /* évite le zoom automatique sur iOS */
	font-weight: 400;
	line-height: 1.4;
	color: var(--epf-ink);
	transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

.epf-booking .epf-field input::placeholder,
.epf-booking .epf-field textarea::placeholder {
	color: var(--epf-taupe-soft);
	font-size: 14px;
}

.epf-booking .epf-field input:focus,
.epf-booking .epf-field textarea:focus {
	outline: none;
	border-color: var(--epf-taupe);
	box-shadow: 0 0 0 3px rgba(161, 144, 126, 0.15);
}

.epf-booking .epf-field input.has-error,
.epf-booking .epf-field textarea.has-error {
	border-color: var(--epf-danger);
}

.epf-booking .epf-field textarea {
	resize: vertical;
	min-height: 84px;
}

.epf-booking .epf-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.epf-booking .epf-error {
	margin: 0 0 14px;
	padding: 12px 14px;
	border-radius: 11px;
	background: #fbeeec;
	color: var(--epf-danger);
	font-family: var(--epf-ui);
	font-size: 12.5px;
	line-height: 1.55;
}

/* -------------------------------------------------------------------- Boutons */

/* Barre d'actions : hors de la zone de défilement, toujours au bas de la carte. */
.epf-booking .epf-actions {
	flex: 0 0 auto;
	display: flex;
	gap: 10px;
	margin: 0;
	padding: 14px 18px 18px;
	background: var(--epf-white);
	border-top: 1px solid var(--epf-line);
}

.epf-booking .epf-btn {
	flex: 1;
	padding: 14px 18px;
	border: 1px solid var(--epf-taupe);
	border-radius: 999px;
	background: var(--epf-taupe);
	color: var(--epf-white);
	font-family: var(--epf-ui);
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1.2;
	cursor: pointer;
	transition: background 0.18s ease, opacity 0.18s ease;
	-webkit-tap-highlight-color: transparent;
}

.epf-booking .epf-btn:hover:not(:disabled) {
	background: var(--epf-taupe-dark);
	border-color: var(--epf-taupe-dark);
}

.epf-booking .epf-btn:disabled {
	opacity: 0.4;
	cursor: not-allowed;
}

/* Sur écran étroit, les deux boutons restent côte à côte — les empiler coûterait
   une soixantaine de pixels à une carte dont la hauteur est fixe. Le libellé est
   réduit d'un cran pour tenir sur une ligne. */
@media (max-width: 599px) {
	.epf-booking .epf-btn {
		font-size: 11.5px;
		letter-spacing: 0.05em;
		padding: 13px 12px;
	}

	.epf-booking .epf-btn-ghost {
		min-width: 76px;
	}
}

.epf-booking .epf-btn-ghost {
	flex: 0 0 auto;
	min-width: 88px;
	background: transparent;
	color: var(--epf-taupe-dark);
	border-color: var(--epf-line);
}

.epf-booking .epf-btn-ghost:hover:not(:disabled) {
	background: var(--epf-cream);
	border-color: var(--epf-taupe-soft);
	color: var(--epf-taupe-dark);
}

.epf-booking .epf-btn.is-loading {
	position: relative;
	color: transparent;
}

.epf-booking .epf-btn.is-loading::after {
	content: "";
	position: absolute;
	inset: 0;
	margin: auto;
	width: 16px;
	height: 16px;
	border: 2px solid rgba(255, 255, 255, 0.4);
	border-top-color: var(--epf-white);
	border-radius: 50%;
	animation: epf-spin 0.7s linear infinite;
}

/* ------------------------------------------------------------------ Chargement */

.epf-booking .epf-loading {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 36px 10px;
	font-family: var(--epf-ui);
	font-size: 12.5px;
	letter-spacing: 0.04em;
	color: var(--epf-muted);
}

.epf-booking .epf-spinner {
	width: 17px;
	height: 17px;
	border: 2px solid var(--epf-cream-deep);
	border-top-color: var(--epf-taupe);
	border-radius: 50%;
	animation: epf-spin 0.7s linear infinite;
}

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

/* ---------------------------------------------------------------- Confirmation */

.epf-booking .epf-done .epf-scroll {
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.epf-booking .epf-check {
	display: grid;
	place-items: center;
	width: 62px;
	height: 62px;
	margin: 6px auto 18px;
	border-radius: 50%;
	background: var(--epf-cream);
}

.epf-booking .epf-check svg {
	width: 26px;
	height: 26px;
	stroke: var(--epf-taupe);
	stroke-width: 2.2;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.epf-booking .epf-done-title {
	margin: 0 0 10px;
	font-family: var(--epf-display);
	font-size: 21px;
	font-weight: 400;
	letter-spacing: 0.01em;
	line-height: 1.25;
}

.epf-booking .epf-done-text {
	margin: 0 auto 20px;
	max-width: 40ch;
	font-family: var(--epf-ui);
	font-size: 13px;
	line-height: 1.7;
	color: var(--epf-muted);
}

.epf-booking .epf-done .epf-recap {
	justify-content: center;
	text-align: left;
	margin-bottom: 0;
}

.epf-booking .epf-done .epf-actions .epf-btn-ghost {
	flex: 1 1 auto;
	min-width: 0;
}

/* --------------------------------------------------------------- Écrans larges */

@media (min-width: 600px) {
	.epf-booking .epf-head { padding: 38px 34px 26px; }
	.epf-booking .epf-title { font-size: 31px; }
	.epf-booking .epf-intro { font-size: 13.5px; margin-top: 13px; }
	.epf-booking .epf-scroll { padding: 26px 30px 8px; }
	.epf-booking .epf-actions { padding: 16px 30px 22px; }
	.epf-booking .epf-steps { padding: 17px 26px; gap: 10px; }
	.epf-booking .epf-step { flex-direction: row; gap: 9px; font-size: 11.5px; }
	.epf-booking .epf-slots { grid-template-columns: repeat(auto-fill, minmax(86px, 1fr)); }
	.epf-booking .epf-slot { font-size: 13.5px; }
	.epf-booking .epf-day { min-height: 44px; font-size: 13.5px; }
	.epf-booking .epf-service-name { font-size: 17.5px; }
	.epf-booking .epf-cal-month { font-size: 17px; }
	.epf-booking .epf-done-title { font-size: 24px; }
	.epf-booking .epf-actions { justify-content: flex-end; }
	.epf-booking .epf-btn { flex: 0 0 auto; min-width: 200px; }
}

@media (min-width: 860px) {
	/* Assez large pour montrer le calendrier et les créneaux côte à côte. */
	.epf-booking .epf-panel[data-step="2"] .epf-scroll {
		display: grid;
		grid-template-columns: 1fr 240px;
		grid-template-areas:
			"recap recap"
			"cal   slots";
		align-content: start;
		gap: 0 26px;
	}
	.epf-booking .epf-panel[data-step="2"] .epf-recap { grid-area: recap; }
	.epf-booking .epf-panel[data-step="2"] .epf-calendar { grid-area: cal; margin-bottom: 0; }
	.epf-booking .epf-panel[data-step="2"] .epf-slots-wrap { grid-area: slots; }
	.epf-booking .epf-panel[data-step="2"] .epf-slots { grid-template-columns: repeat(2, 1fr); }
}