/* 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; }
}

/* =========================================================
   Recherche de localité (champ avec la classe pl-localite)
   ========================================================= */
.wpforms-container .pl-localite .pl-source-cachee {
  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-recherche { position: relative; }
.wpforms-container .pl-recherche__saisie { width: 100%; max-width: 100%; }
.wpforms-container .pl-recherche__menu {
  position: absolute; z-index: 50; left: 0; right: 0; top: calc(100% + 6px);
  margin: 0; padding: 6px; list-style: none; max-height: 320px; overflow-y: auto;
  background: #fff; border: 1px solid #e6e8ec; border-radius: 12px;
  box-shadow: 0 12px 32px rgba(26, 43, 69, .12);
}
.wpforms-container .pl-recherche__menu[hidden] { display: none; }
.wpforms-container .pl-recherche__option {
  margin: 0; padding: 12px 14px; border-radius: 8px; cursor: pointer;
  color: #1a2b45; font-size: 15px; line-height: 1.3;
}
.wpforms-container .pl-recherche__option:hover,
.wpforms-container .pl-recherche__option--active { background: #fdeef2; }
.wpforms-container .pl-recherche__option--autre { color: #6b7280; font-size: 14px; border-top: 1px solid #f1f2f4; border-radius: 0 0 8px 8px; }

/* =========================================================
   Boutons Précédent / Suivant / Envoyer
   Un seul bouton : centré (pleine largeur sur mobile).
   Deux boutons : Précédent à gauche, l'autre à droite.
   ========================================================= */
.wpforms-container .wpforms-field-pagebreak .wpforms-pagebreak-left,
.wpforms-container .wpforms-field-pagebreak .wpforms-pagebreak-center,
.wpforms-container .wpforms-field-pagebreak .wpforms-pagebreak-right,
.wpforms-container .wpforms-field-pagebreak .wpforms-pagebreak-split,
.wpforms-container .wpforms-submit-container {
  display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; gap: 12px; text-align: initial;
}
.wpforms-container .wpforms-field-pagebreak [class*="wpforms-pagebreak-"]:not(:has(.wpforms-page-prev)),
.wpforms-container .wpforms-submit-container:not(:has(.wpforms-page-prev)) { justify-content: center; }
.wpforms-container .wpforms-page-button,
.wpforms-container .wpforms-submit { margin: 0 !important; }

/* Bouton Précédent : version discrète */
.wpforms-container .wpforms-page-prev {
  background: #fff !important; color: #1a2b45 !important;
  border: 1px solid #d5d9e0 !important; box-shadow: none !important;
}
.wpforms-container .wpforms-page-prev:hover { border-color: #1a2b45 !important; }

@media (max-width: 767px) {
  .wpforms-container .wpforms-field-pagebreak [class*="wpforms-pagebreak-"]:not(:has(.wpforms-page-prev)) .wpforms-page-button,
  .wpforms-container .wpforms-submit-container:not(:has(.wpforms-page-prev)) .wpforms-submit { width: 100%; }
  .wpforms-container .wpforms-field-pagebreak [class*="wpforms-pagebreak-"]:has(.wpforms-page-prev) .wpforms-page-button,
  .wpforms-container .wpforms-submit-container:has(.wpforms-page-prev) .wpforms-page-prev,
  .wpforms-container .wpforms-submit-container:has(.wpforms-page-prev) .wpforms-submit { flex: 1 1 0; }
}

/* Calendrier déplacé sous la rangée « Lieu / Date » */
.wpforms-container .pl-calendrier-zone { width: 100%; margin: 0 0 24px; }

/* Messages d'erreur sous les champs personnalisés (lieu et heures) */
.wpforms-container .wpforms-field.pl-localite,
.wpforms-container .wpforms-field.pl-horaires.pl-horaires--visible {
  display: flex;
  flex-direction: column;
}
.wpforms-container .pl-localite label.wpforms-error,
.wpforms-container .pl-horaires label.wpforms-error,
.wpforms-container .pl-localite em.wpforms-error,
.wpforms-container .pl-horaires em.wpforms-error {
  order: 10;
  margin-top: 6px;
}
