/*
 * NOVA — personnalisations quotidiennes
 *
 * Ce fichier est chargé en dernier sur les pages du site.
 * Ajoutez ici vos nouvelles corrections CSS manuelles.
 *
 * Conseils :
 * - Préfixez une règle avec body.home, body.page-id-XXX,
 *   body.single-post, body.archive ou body.search lorsqu'elle
 *   ne doit concerner qu'un type de page.
 * - Ajoutez une classe personnalisée dans Elementor plutôt que
 *   de cibler une classe générique comme .elementor-container.
 * - Ne remettez pas ces règles dans style.css : ce fichier contient
 *   uniquement l'en-tête du thème enfant dans cette installation.
 */

/* Exemple de règle globale :
.ma-classe-personnalisee {
    color: #111;
}
*/

/* Exemple de règle uniquement pour l'accueil sur mobile :
@media (max-width: 767px) {
    body.home .ma-classe-personnalisee {
        margin-top: 20px;
    }
}
*/

/*
 * Diagnostic — afficher l'âge à gauche sur mobile.
 * Le script Fluent Forms continue de mettre à jour .ff_range_value.
 */
@media (max-width: 767px) {
  form.nova-diagnostic-form .nova-age-slider .ff_range_value {
    align-self: flex-start !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }
}

/*
 * Garde le site centré sur les grands écrans.
 * Une règle globale antérieure appliquait max-width: 100 % au body,
 * ce qui annulait sa largeur maximale de 1700 px.
 */
body {
  width: 100%;
  max-width: 1700px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  overflow-x: hidden !important;
}

/* NOVA — réaffiche les onglets de procédure sur Greffe de cheveux homme. */
body.page-id-56 .elementor .elementor-element-37a3a2c {
  display: flex !important;
}

/*
 * Procédures Homme et FUE Saphir — couleurs des boutons des étapes.
 * Elementor leur applique sinon sa couleur par défaut bleue (#375EFB).
 * Cette règle reprend la palette des boutons NOVA : noir et blanc.
 */
body.page-id-56 .nova-procedure-tabs button.nova-step-next-btn,
body.page-id-56 .nova-procedure-tabs button.nova-step-prev-btn,
body.page-id-56 .nova-procedure-tabs button.nova-step-next-btn:hover,
body.page-id-56 .nova-procedure-tabs button.nova-step-prev-btn:hover,
body.page-id-56 .nova-procedure-tabs button.nova-step-next-btn:focus,
body.page-id-56 .nova-procedure-tabs button.nova-step-prev-btn:focus,
body.postid-6840 .nova-procedure-tabs button.nova-step-next-btn,
body.postid-6840 .nova-procedure-tabs button.nova-step-prev-btn,
body.postid-6840 .nova-procedure-tabs button.nova-step-next-btn:hover,
body.postid-6840 .nova-procedure-tabs button.nova-step-prev-btn:hover,
body.postid-6840 .nova-procedure-tabs button.nova-step-next-btn:focus,
body.postid-6840 .nova-procedure-tabs button.nova-step-prev-btn:focus {
  background: #000 !important;
  border-color: #000 !important;
  color: #fff !important;
  cursor: pointer !important;
}

/*
 * FUE Saphir est un article : nova-clinical.css ne s'y charge pas.
 * Ces deux règles rétablissent la mécanique du bouton Retour sans
 * importer toute la feuille clinique dans les articles du blog.
 */
body.postid-6840 .nova-procedure-tabs button.nova-step-next-btn,
body.postid-6840 .nova-procedure-tabs button.nova-step-prev-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: inherit !important;
}

body.postid-6840 .nova-procedure-tabs button.nova-step-prev-btn {
  position: relative !important;
  min-width: 48px !important;
  width: 48px !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-indent: -9999px !important;
  overflow: hidden !important;
}