/**
 * Isolation CSS — React booking-form / booking-process uniquement
 *
 * Neutralise les surcharges du thème (Kadence global.min.css, .entry-content, WP blocks)
 * dans les conteneurs React, sans impacter le reste de la page.
 *
 * Hors périmètre (CSS dédié) :
 * - [sp_partner_cta], [sp_partner_price_simulator], [sp_tarif_grid] → partner-catalog.css, partner-sp-tariff-grid.css
 * - Admin React → bundles admin sans isolation thème
 *
 * Conteneurs ciblés : .sp-booking-form-container, .sp-booking-process-container
 * (+ racines React .sp-booking-form, .sp-booking-process)
 */

.sp-booking-shortcode-root,
.sp-booking-form-container,
.sp-booking-form-home-container,
.sp-booking-process-container,
.sp-booking-form-container .sp-booking-form,
.sp-booking-process-container .sp-booking-process {
  position: relative;
  box-sizing: border-box;
  /*
   * Base en px : le thème peut grossir html { font-size } (rem).
   * Tailwind et le design maquette supposent une base ~16px.
   */
  font-size: 16px;
  line-height: 1.5;
  font-family: var(--sp-booking-font-body);
  font-weight: 400;
  color: #1e293b;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.sp-booking-shortcode-root *,
.sp-booking-shortcode-root *::before,
.sp-booking-shortcode-root *::after,
.sp-booking-form-container *,
.sp-booking-form-container *::before,
.sp-booking-form-container *::after,
.sp-booking-form-home-container *,
.sp-booking-form-home-container *::before,
.sp-booking-form-home-container *::after,
.sp-booking-process-container *,
.sp-booking-process-container *::before,
.sp-booking-process-container *::after {
  box-sizing: border-box;
}

/* —— Liens (Kadence .entry-content a, underline, background-image) —— */
.entry-content .sp-booking-form-container a,
.entry-content .sp-booking-process-container a,
.sp-booking-form-container a,
.sp-booking-process-container a {
  color: inherit;
  text-decoration: none;
  text-underline-offset: initial;
  background-image: none;
  background-size: initial;
  background-position: initial;
  background-repeat: initial;
  transition: none;
}

.entry-content .sp-booking-form-container a:hover,
.entry-content .sp-booking-form-container a:focus,
.entry-content .sp-booking-form-container a:active,
.entry-content .sp-booking-process-container a:hover,
.entry-content .sp-booking-process-container a:focus,
.entry-content .sp-booking-process-container a:active,
.sp-booking-form-container a:hover,
.sp-booking-form-container a:focus,
.sp-booking-form-container a:active,
.sp-booking-process-container a:hover,
.sp-booking-process-container a:focus,
.sp-booking-process-container a:active {
  /* color: inherit; */
  text-decoration: none;
  background-image: none;
  background-size: initial;
}

/* —— Titres / paragraphes (marges globales Kadence) —— */
/* .sp-booking-form-container :where(h1, h2, h3, h4, h5, h6),
.sp-booking-process-container :where(h1, h2, h3, h4, h5, h6) {
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  color: inherit;
} */

.sp-booking-form-container :where(p),
.sp-booking-process-container :where(p) {
  margin: 0;
  padding: 0;
}

/* —— Listes —— */
.entry-content .sp-booking-form-container :where(ul, ol, menu),
.entry-content .sp-booking-process-container :where(ul, ol, menu),
.sp-booking-form-container :where(ul, ol, menu),
.sp-booking-process-container :where(ul, ol, menu),
.sp-booking-form :where(ul, ol, menu),
.sp-booking-process :where(ul, ol, menu) {
  list-style: none;
  margin: 0;
  padding: 0;
}

.entry-content .sp-booking-form-container :where(li),
.entry-content .sp-booking-process-container :where(li),
.sp-booking-form-container :where(li),
.sp-booking-process-container :where(li) {
  margin: 0;
  padding: 0;
}

/* —— Boutons / champs (normalize + styles boutons thème) ——
 * Sans !important : ce fichier est chargé avant Tailwind ; les utilitaires React gagnent ensuite. */
/* .entry-content
  .sp-booking-form-container
  :where(button, input, select, textarea),
.entry-content
  .sp-booking-process-container
  :where(button, input, select, textarea),
.sp-booking-form-container :where(button, input, select, textarea),
.sp-booking-process-container :where(button, input, select, textarea) {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  color: inherit;
  margin: 0;
  text-transform: none;
  -webkit-appearance: none;
  appearance: none;
} */

/* .entry-content
  .sp-booking-form-container
  :where(button, [type="button"], [type="submit"], [type="reset"]),
.entry-content
  .sp-booking-process-container
  :where(button, [type="button"], [type="submit"], [type="reset"]),
.sp-booking-form-container
  :where(button, [type="button"], [type="submit"], [type="reset"]),
.sp-booking-process-container
  :where(button, [type="button"], [type="submit"], [type="reset"]) {
  background: unset;
  border: unset;
  border-radius: unset;
  box-shadow: unset;
  padding: unset;
  min-width: unset;
  min-height: unset;
  cursor: pointer;
} */

/* Carousel : exceptions explicites (voir main.css) */
.sp-booking-process
  button.product-booking-carousel-nav.product-booking-carousel-nav {
  padding: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  line-height: 1 !important;
  font-size: 0 !important;
}

/*
 * Barre d’étapes : Kadence force button:hover { color: palette9 (blanc) } sur fond blanc.
 * On garde fond blanc + bordure bleue et on rétablit la couleur de texte par état.
 */
.entry-content
  .sp-booking-process-container
  button.np-step:not(:disabled):not(.np-step--active):hover,
.entry-content
  .sp-booking-process-container
  button.np-step:not(:disabled):not(.np-step--active):focus-visible,
.sp-booking-process-container
  button.np-step:not(:disabled):not(.np-step--active):hover,
.sp-booking-process-container
  button.np-step:not(:disabled):not(.np-step--active):focus-visible,
.sp-booking-process button.np-step:not(:disabled):not(.np-step--active):hover,
.sp-booking-process button.np-step:not(:disabled):not(.np-step--active):focus-visible {
  background-color: color-mix(
    in oklab,
    var(--sp-wp-primary) 10%,
    var(--sp-wp-base)
  ) !important;
  background-image: none !important;
  border-color: var(--sp-wp-primary) !important;
  box-shadow: 0 2px 8px
    color-mix(in oklab, var(--sp-wp-primary) 12%, transparent) !important;
  opacity: 1 !important;
}

.entry-content
  .sp-booking-process-container
  button.np-step--active:not(:disabled):hover,
.entry-content
  .sp-booking-process-container
  button.np-step--active:not(:disabled):focus-visible,
.sp-booking-process-container button.np-step--active:not(:disabled):hover,
.sp-booking-process-container
  button.np-step--active:not(:disabled):focus-visible,
.sp-booking-process button.np-step--active:not(:disabled):hover,
.sp-booking-process button.np-step--active:not(:disabled):focus-visible {
  background-color: color-mix(
    in oklab,
    var(--sp-wp-primary) 12%,
    var(--sp-wp-base)
  ) !important;
  border-color: var(--sp-wp-primary) !important;
  color: var(--sp-wp-contrast) !important;
  box-shadow: 0 2px 10px
    color-mix(in oklab, var(--sp-wp-primary) 14%, transparent) !important;
}

.entry-content
  .sp-booking-process-container
  button.np-step--completed:not(:disabled):hover,
.entry-content
  .sp-booking-process-container
  button.np-step--completed:not(:disabled):focus-visible,
.sp-booking-process-container button.np-step--completed:not(:disabled):hover,
.sp-booking-process-container
  button.np-step--completed:not(:disabled):focus-visible,
.sp-booking-process button.np-step--completed:not(:disabled):hover,
.sp-booking-process button.np-step--completed:not(:disabled):focus-visible {
  color: var(--sp-wp-success) !important;
}

.entry-content
  .sp-booking-process-container
  button.np-step--clickable:not(:disabled):hover,
.entry-content
  .sp-booking-process-container
  button.np-step--clickable:not(:disabled):focus-visible,
.sp-booking-process-container button.np-step--clickable:not(:disabled):hover,
.sp-booking-process-container
  button.np-step--clickable:not(:disabled):focus-visible,
.sp-booking-process button.np-step--clickable:not(:disabled):hover,
.sp-booking-process button.np-step--clickable:not(:disabled):focus-visible {
  color: var(--sp-wp-subtle) !important;
}

/*
 * Liste horaires modale : Kadence force button:hover { color: blanc } sur fond clair.
 */
.sp-date-picker-modal button.sp-date-picker-time-option:not(
    .sp-date-picker-time-option--selected
  ):hover,
.sp-date-picker-modal button.sp-date-picker-time-option:not(
    .sp-date-picker-time-option--selected
  ):focus-visible,
.sp-date-picker-modal button.sp-date-picker-time-option--preview {
  color: var(--sp-wp-contrast) !important;
}

.sp-date-picker-modal button.sp-date-picker-time-option--selected,
.sp-date-picker-modal button.sp-date-picker-time-option--selected:hover,
.sp-date-picker-modal button.sp-date-picker-time-option--selected:focus-visible {
  color: var(--sp-wp-btn-filled-text) !important;
}

/* Bouton secondaire parcours (ex. « Précédent ») — annule hover Kadence (fond/texte blancs) */
.entry-content .sp-booking-process-container button.sp-booking-btn-secondary:hover,
.entry-content .sp-booking-process-container button.sp-booking-btn-secondary:focus,
.entry-content .sp-booking-process-container button.sp-booking-btn-secondary:active,
.sp-booking-process-container button.sp-booking-btn-secondary:hover,
.sp-booking-process-container button.sp-booking-btn-secondary:focus,
.sp-booking-process-container button.sp-booking-btn-secondary:active,
.sp-booking-process button.sp-booking-btn-secondary:hover,
.sp-booking-process button.sp-booking-btn-secondary:focus,
.sp-booking-process button.sp-booking-btn-secondary:active {
  background-color: color-mix(
    in oklab,
    var(--sp-wp-primary) 8%,
    var(--sp-wp-muted)
  ) !important;
  background-image: none !important;
  border-color: color-mix(
    in oklab,
    var(--sp-wp-primary) 30%,
    var(--sp-wp-border)
  ) !important;
  color: var(--sp-wp-contrast) !important;
  opacity: 1 !important;
}

/* Bouton « Panier » barre récap mobile — annule hover Kadence (fond primaire bleu) */
:is(
    .entry-content .sp-booking-process-container,
    .entry-content .sp-booking-form-container,
    .sp-booking-process-container,
    .sp-booking-form-container,
    .sp-booking-process,
    .sp-booking-form,
    .sp-booking-portal,
    #wrapper
  )
  button.sp-mobile-recap-cart-btn:not(:disabled) {
  background: var(--sp-wp-base, #ffffff) !important;
  background-color: var(--sp-wp-base, #ffffff) !important;
  background-image: none !important;
  color: var(--sp-wp-primary) !important;
  border: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
  filter: none !important;
  -webkit-text-fill-color: var(--sp-wp-primary) !important;
}

:is(
    .entry-content .sp-booking-process-container,
    .entry-content .sp-booking-form-container,
    .sp-booking-process-container,
    .sp-booking-form-container,
    .sp-booking-process,
    .sp-booking-form,
    .sp-booking-portal,
    #wrapper
  )
  button.sp-mobile-recap-cart-btn:not(:disabled):is(:hover, :focus, :focus-visible, :active) {
  background: color-mix(
    in oklab,
    var(--sp-wp-contrast) 6%,
    var(--sp-wp-base)
  ) !important;
  background-color: color-mix(
    in oklab,
    var(--sp-wp-contrast) 6%,
    var(--sp-wp-base)
  ) !important;
  background-image: none !important;
  color: var(--sp-wp-primary) !important;
  border: none !important;
  opacity: 1 !important;
  filter: none !important;
  -webkit-text-fill-color: var(--sp-wp-primary) !important;
  box-shadow: 0 4px 14px
    color-mix(in oklab, var(--sp-wp-contrast) 16%, transparent) !important;
}

/* —— Images / figures —— */
.sp-booking-form-container :where(img, svg, video),
.sp-booking-process-container :where(img, svg, video) {
  display: block;
  max-width: 100%;
  height: auto;
  border: 0;
}

.sp-booking-form-container :where(figure),
.sp-booking-process-container :where(figure) {
  margin: 0;
}

/* —— Tableaux —— */
.sp-booking-form-container :where(table),
.sp-booking-process-container :where(table) {
  border-collapse: collapse;
  width: auto;
  margin: 0;
}

.sp-booking-form-container :where(th, td),
.sp-booking-process-container :where(th, td) {
  padding: 0;
  border: 0;
}

/* —— Citations / blockquote WP —— */
.sp-booking-form-container :where(blockquote),
.sp-booking-process-container :where(blockquote) {
  margin: 0;
  padding: 0;
  border: 0;
  quotes: none;
}

/* —— HR —— */
.sp-booking-form-container :where(hr),
.sp-booking-process-container :where(hr) {
  margin: 0;
  border: 0;
  height: 0;
}

/* —— Strong / em héritent sans surcharge italic globale —— */
.sp-booking-form-container :where(strong, b),
.sp-booking-process-container :where(strong, b) {
  font-weight: 600;
}

.sp-booking-form-container :where(em, i:not(.bi)),
.sp-booking-process-container :where(em, i:not(.bi)) {
  font-style: normal;
}

/*
 * Bootstrap Icons dans le parcours public (dashicons réservé à l'admin).
 * Rétablit la police icône : le thème (Kadence) et l’isolation héritent Poppins sur les enfants.
 */
.sp-booking-shortcode-root .sp-stored-icon.bi,
.sp-booking-form-container .sp-stored-icon.bi,
.sp-booking-process-container .sp-stored-icon.bi,
.sp-booking-process .sp-stored-icon.bi {
  font-family: bootstrap-icons !important;
  display: inline-block;
  line-height: 1;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  speak: never;
  -webkit-font-smoothing: antialiased;
  vertical-align: top;
}

/* —— fieldset / legend —— */
.sp-booking-form-container :where(fieldset),
.sp-booking-process-container :where(fieldset) {
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
}

.sp-booking-form-container :where(legend),
.sp-booking-process-container :where(legend) {
  padding: 0;
}
