/* ==========================================================================
   FD Stratégies — Calendrier de réservation (section Contact)

   Deux états, une seule carte de verre :
     .fds-booking--live      le shortcode Fluent Booking, une fois configuré
     .fds-booking--preview   l'aperçu du mois en cours, tant que rien ne l'est
   ========================================================================== */

.fds-booking {
  position: relative;
  border-radius: var(--fds-radius-xl);
  background: var(--fds-glass-bg-strong);
  border: 1px solid var(--fds-glass-border);
  -webkit-backdrop-filter: blur(var(--fds-glass-blur)) saturate(var(--fds-glass-saturate));
  backdrop-filter: blur(var(--fds-glass-blur)) saturate(var(--fds-glass-saturate));
}

/* --------------------------------------------------------------------------
   État réel : le widget Fluent Booking prend toute la place disponible.
   On ne prescrit qu'un plancher de hauteur, le temps que son propre script
   se charge, pour éviter un saut de mise en page.
   -------------------------------------------------------------------------- */

.fds-booking--live {
  padding: clamp(.5rem, .3rem + .8vw, 1rem);
  min-height: 32rem;
  /* `auto`, jamais `hidden` : si le widget rendait un jour plus large que la
     carte, un overflow masqué le couperait en silence plutôt que de laisser
     défiler. */
  overflow-x: auto;
  /* Centrage défensif : couvre le cas où Fluent Booking choisirait, sur un
     très petit écran, un rendu plus étroit que la carte. */
  display: flex;
  justify-content: center;
}
.fds-booking--live iframe { border-radius: var(--fds-radius-lg); }

/* --------------------------------------------------------------------------
   Aperçu — calendrier du mois réel en cours
   -------------------------------------------------------------------------- */

.fds-booking--preview {
  padding: clamp(1.5rem, 1.2rem + 1.4vw, 2.25rem);
  display: grid;
  gap: var(--fds-space-md);
}

/* Repère visible uniquement des comptes pouvant gérer le personnalisateur :
   jamais montré à un visiteur, ne dépend d'aucun script. */
.fds-booking__admin-flag {
  position: absolute;
  top: -.75rem;
  right: clamp(1rem, .6rem + 1vw, 1.5rem);
  display: inline-flex;
  align-items: center;
  padding: .4rem .875rem;
  background: var(--fds-orange);
  color: #fff;
  font-size: .6875rem;
  font-weight: 700;
  letter-spacing: .02em;
  border-radius: var(--fds-radius-pill);
  box-shadow: var(--fds-shadow-md);
  z-index: 2;
}
.fds-booking__admin-flag:hover { background: var(--fds-orange-deep); color: #fff; }

.fds-booking__head { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; }
.fds-booking__month {
  font-family: var(--fds-font-title);
  font-weight: var(--fds-weight-title);
  font-size: 1.125rem;
  color: #fff;
  margin: 0;
  text-transform: capitalize;
}

.fds-booking__calendar { display: grid; gap: .5rem; }

.fds-booking__weekdays,
.fds-booking__days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: .3rem;
}

.fds-booking__weekdays span {
  text-align: center;
  font-size: .6875rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: rgba(255, 255, 255, .5);
}

.fds-booking__day {
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .8125rem;
  font-weight: 600;
  color: rgba(255, 255, 255, .78);
  border-radius: var(--fds-radius-sm);
  /* Décoratif : jamais un <button>/<a>, pour ne jamais laisser croire que
     ces cases répondent au clic tant que le vrai calendrier n'est pas
     branché (voir booking-widget.php). */
}
.fds-booking__day--blank { visibility: hidden; }
.fds-booking__day--past  { color: rgba(255, 255, 255, .28); }

.fds-booking__day--today {
  background: var(--fds-orange);
  color: #fff;
}

.fds-booking__day--available {
  position: relative;
  color: var(--fds-orange-light);
  border: 1.5px solid rgba(242, 101, 34, .4);
}
.fds-booking__day--available::after {
  content: "";
  position: absolute;
  bottom: 4px;
  left: 50%;
  transform: translateX(-50%);
  width: 3px;
  height: 3px;
  background: var(--fds-orange-light);
  border-radius: 50%;
}

.fds-booking__slots-label {
  margin: 0 0 .625rem;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .5);
}

.fds-booking__slot-list { display: flex; flex-wrap: wrap; gap: .5rem; }

.fds-booking__slot {
  padding: .55rem 1rem;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: var(--fds-radius-sm);
  font-size: .8125rem;
  font-weight: 600;
  color: rgba(255, 255, 255, .82);
}

@media (max-width: 400px) {
  .fds-booking__slot-list { justify-content: space-between; }
  .fds-booking__slot { flex: 1 1 auto; text-align: center; padding-inline: .5rem; }
}
