/*
Theme Name: Hello Elementor Enfant
Description: Theme enfant de Hello Elementor.
Author: Pierrick Pralong
Author URI: http://panierdepixels.fr/
Template: hello-elementor
Version: 1.0
*/

/*---------------- Bouton de base ----------------*/
.p9-btn-hover-line a.elementor-button {
  position: relative;
  overflow: hidden;
  background: transparent;
  z-index: 1;
  border-left: 0px solid var(--e-global-color-accent);
  border-right: 0px solid var(--e-global-color-accent);
	border-bottom: 0px solid var(--e-global-color-accent);
  border-top: 0px solid var(--e-global-color-accent);

}

/* Ligne du haut */
.p9-btn-hover-line a.elementor-button::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--e-global-color-accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
}

/* Ligne du bas */
.p9-btn-hover-line a.elementor-button::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 1px;
  background: var(--e-global-color-accent);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.4s ease;
}

/* Animation hover */
.p9-btn-hover-line a.elementor-button:hover::before {
  transform: scaleX(1);
}

.p9-btn-hover-line a.elementor-button:hover::after {
  transform: scaleX(1);
}

/*---------------- Base des liens du menu ----------------*/
.elementor-nav-menu a.elementor-item {
  position: relative;
  text-decoration: none;
}


/* Ligne du haut */
.elementor-nav-menu a.elementor-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--e-global-color-accent);

  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
}

/* Ligne du bas */
.elementor-nav-menu a.elementor-item::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 1px;
  background: var(--e-global-color-accent);

  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.4s ease;
}

/* Hover */
.elementor-nav-menu a.elementor-item:hover::before {
  transform: scaleX(1);
}

.elementor-nav-menu a.elementor-item:hover::after {
  transform: scaleX(1);
}


/*-- Animer les bouton effet defilement gauche droite en hover --*/
/* Btn de base*/
.p9-btn-hover-anime a.elementor-button {
 position: relative; overflow: hidden; background: transparent;
  z-index: 1; transition: color 0.3s ease; border: 1px solid var(--e-global-color-accent);
}
/* Couche rouge animée */
.p9-btn-hover-anime a.elementor-button::before {
  content: ""; position: absolute; inset: 0; background: var(--e-global-color-accent);
  transform: scaleX(0); transform-origin: left; transition: transform 0.4s ease;  z-index: 0;
}
/* On remet le texte au-dessus */
.p9-btn-hover-anime .elementor-button .elementor-button-content-wrapper {
  position: relative; z-index: 2;
}
/* Animation au hover */
.p9-btn-hover-anime a.elementor-button:hover::before {
  transform: scaleX(1);
}

/* Texte en blanc au hover */
.p9-btn-hover-anime a.elementor-button:hover {
  color: #fff !important;
}
/*-- Fin Animer les bouton effet defilement gauche droite en hover --*/

/*-- Animation Hover pour les boutons de formulaire Elementor --*/
/* 1. Bouton de base (on cible le bouton dans le groupe de champ "submit") */
.elementor-field-type-submit button.elementor-button {
 position: relative; overflow: hidden; background: transparent;
  z-index: 1; transition: color 0.3s ease; border: 1px solid var(--e-global-color-accent);
}

/* 2. La couche de couleur animée (le pseudo-élément) */
.elementor-field-type-submit button.elementor-button::before {
    content: ""; 
    position: absolute; 
    inset: 0; 
    background: var(--e-global-color-accent);
    transform: scaleX(0); 
    transform-origin: left; 
    transition: transform 0.4s ease;  
    z-index: -1; /* Placé derrière le texte */
}

/* 3. On s'assure que le contenu du bouton reste au-dessus */
.elementor-field-type-submit button.elementor-button .elementor-button-content-wrapper {
    position: relative; 
    z-index: 2;
}

/* 4. Animation au survol (Scale) */
.elementor-field-type-submit button.elementor-button:hover::before {
    transform: scaleX(1);
}

/* 5. Changement de couleur du texte au survol */
.elementor-field-type-submit button.elementor-button:hover {
    color: #fff !important;
}

/*-- Fin Animation Hover Formulaire --*/

/** HEADER **/
/*-- Fond pour les menus déroulants --*/
/* Menu déroulant desktop */
.elementor-nav-menu .sub-menu {
 background-image: url("https://educanin26.panierdepixels.fr/wp-content/uploads/fond60.jpg");
}

/* Menu mobile */
.elementor-nav-menu--dropdown {
 background-image: url("https://educanin26.panierdepixels.fr/wp-content/uploads/fond60.jpg");
 background-size: cover;
 background-position: center;
}
/*-- Fin fond pour les menus déroulants --*/