/* Calendrier intégré du formulaire WPForms (champ avec la classe pl-calendrier) */
.wpforms-container .pl-calendrier { --pl-framboise: #EE3466; --pl-marine: #1a2b45; }

/* Le champ texte reste visible : il affiche la date choisie */

.wpforms-container .pl-calendrier .flatpickr-calendar.inline {
	width: 100% !important; max-width: 100%; box-shadow: none; border: 1px solid #e6e8ec;
	border-radius: 12px; padding: 16px; background: #fff; top: 0;
}
.wpforms-container .pl-calendrier .flatpickr-calendar.inline::before,
.wpforms-container .pl-calendrier .flatpickr-calendar.inline::after { display: none; }
.wpforms-container .pl-calendrier .flatpickr-innerContainer,
.wpforms-container .pl-calendrier .flatpickr-rContainer,
.wpforms-container .pl-calendrier .flatpickr-days,
.wpforms-container .pl-calendrier .dayContainer { width: 100%; min-width: 100%; max-width: 100%; }

.wpforms-container .pl-calendrier .flatpickr-months { margin-bottom: 8px; }
.wpforms-container .pl-calendrier .flatpickr-current-month { font-size: 17px; font-weight: 600; color: var(--pl-marine); }
.wpforms-container .pl-calendrier .flatpickr-prev-month svg,
.wpforms-container .pl-calendrier .flatpickr-next-month svg { fill: var(--pl-marine); }
.wpforms-container .pl-calendrier .flatpickr-prev-month:hover svg,
.wpforms-container .pl-calendrier .flatpickr-next-month:hover svg { fill: var(--pl-framboise); }
.wpforms-container .pl-calendrier span.flatpickr-weekday { color: #6b7280; font-weight: 500; font-size: 13px; }

.wpforms-container .pl-calendrier .dayContainer { gap: 6px; justify-content: space-between; }
.wpforms-container .pl-calendrier .flatpickr-day {
	flex-basis: calc((100% - 36px) / 7); max-width: none; height: 46px; line-height: 44px;
	border: 1px solid #e6e8ec; border-radius: 8px; color: var(--pl-marine); font-size: 15px; margin: 0;
}
.wpforms-container .pl-calendrier .flatpickr-day:hover,
.wpforms-container .pl-calendrier .flatpickr-day:focus { background: #fff; border-color: var(--pl-framboise); }
.wpforms-container .pl-calendrier .flatpickr-day.today { border-color: var(--pl-marine); }
.wpforms-container .pl-calendrier .flatpickr-day.selected,
.wpforms-container .pl-calendrier .flatpickr-day.selected:hover { background: var(--pl-framboise); border-color: var(--pl-framboise); color: #fff; }

/* Jours passés et jours d'un autre mois */
.wpforms-container .pl-calendrier .flatpickr-day.flatpickr-disabled,
.wpforms-container .pl-calendrier .flatpickr-day.prevMonthDay,
.wpforms-container .pl-calendrier .flatpickr-day.nextMonthDay { border-color: transparent; color: #c7cbd1; background: transparent; }

/* Jours complets : barrés, sur fond gris */
.wpforms-container .pl-calendrier .flatpickr-day.pl-complet,
.wpforms-container .pl-calendrier .flatpickr-day.pl-complet:hover {
	background: #f3f4f6; border-color: #f3f4f6; color: #9ca3af; text-decoration: line-through; cursor: not-allowed;
}

/* Horaires masqués tant qu'aucune date n'est choisie */
.wpforms-container .pl-horaires:not(.pl-horaires--visible) { display: none !important; }

@media (max-width: 480px) {
	.wpforms-container .pl-calendrier .flatpickr-calendar.inline { padding: 10px; }
	.wpforms-container .pl-calendrier .dayContainer { gap: 4px; }
	.wpforms-container .pl-calendrier .flatpickr-day { flex-basis: calc((100% - 24px) / 7); height: 40px; line-height: 38px; font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
	.wpforms-container .pl-calendrier .flatpickr-calendar { animation: none; }
}

/* Champ date en lecture seule : il affiche la date choisie dans le calendrier */
.wpforms-container .pl-calendrier input[readonly] { cursor: default; }

/* Note « la soirée se termine le lendemain » sous l'heure de fin */
.wpforms-container .pl-horaires-note {
	display: flex; align-items: center; gap: 10px; width: 100%; box-sizing: border-box;
	margin: 4px 0 20px; padding: 12px 16px; border-radius: 10px;
	background: #fdeef2; color: #1a2b45; font-size: 15px; line-height: 1.4;
}
.wpforms-container .pl-horaires-note::before {
	content: ""; flex: 0 0 8px; height: 8px; border-radius: 50%; background: #EE3466;
}
.wpforms-container .pl-horaires-note:empty { display: none; }

/* Le petit bouton d'effacement de WPForms n'a plus d'utilité avec le calendrier intégré */
.wpforms-container .pl-calendrier .wpforms-datepicker-clear { display: none !important; }

/* Heures : le champ WPForms reste présent pour l'envoi, mais invisible ; la liste déroulante le remplace */
.wpforms-container .pl-horaires .pl-heure-source {
  position: absolute !important; width: 1px !important; height: 1px !important;
  padding: 0 !important; border: 0 !important; opacity: 0 !important; pointer-events: none !important;
}
.wpforms-container .pl-horaires .pl-heure-liste { width: 100%; max-width: 100%; cursor: pointer; }
.wpforms-container .pl-horaires .pl-heure-liste:disabled { cursor: not-allowed; opacity: .6; }
.wpforms-container .pl-horaires .wpforms-field-date-time-time-picker-icon,
.wpforms-container .pl-horaires .wpforms-datepicker-clear { display: none !important; }

/* Indicateur d'étapes : s'adapte à la largeur du formulaire (3 étapes) */
.wpforms-container { container-type: inline-size; }
.wpforms-container .wpforms-page-indicator.circles {
  display: flex; flex-wrap: nowrap; justify-content: center; align-items: center; gap: 16px;
}
.wpforms-container .wpforms-page-indicator.circles .wpforms-page-indicator-page {
  display: flex; align-items: center; margin: 0 !important; min-width: 0; width: auto !important;
}
.wpforms-container .wpforms-page-indicator.circles .wpforms-page-indicator-page-title { white-space: nowrap; }

/* Formulaire étroit (smartphone, colonne) : seul le titre de l'étape en cours reste affiché */
@container (max-width: 640px) {
  .wpforms-page-indicator.circles { gap: 10px; }
  .wpforms-page-indicator.circles .wpforms-page-indicator-page:not(.active) .wpforms-page-indicator-page-title { display: none !important; }
}