/*
 Theme Name:   Bootscore Child
 Description:  Bootscore Child Theme
 Author:       Bootscore
 Author URI:   https://bootscore.me
 Template:     bootscore
 Version:      6.0.0
 Requires at least: 5.0
 Tested up to: 6.6
 Requires PHP: 7.4
 License: MIT License
 License URI: https://github.com/bootscore/bootscore-child/blob/main/LICENSE
 Text Domain:  bootscore
*/

/* 
All style editing is done via /assets/scss/_bootscore_custom.scss
*/




:root{
    --couleur-1: #A5A4D2;
    --couleur-2: #F2FFDD;/*EEFFD9*/
    --couleur-3: #289590; 
    --couleur-4: #4C4893;
}

body{font-family: "Poppins", sans-serif;}

.couleur-1{color: var(--couleur-1);}
.couleur-2{color: var(--couleur-2);}
.couleur-3{color: var(--couleur-3);}
.couleur-4{color: var(--couleur-4);}
.bg-couleur-1{background-color: var(--couleur-1);}
.bg-couleur-2{background-color: var(--couleur-2);}
.bg-couleur-3{background-color: var(--couleur-3) !important;}
.bg-couleur-4{background-color: var(--couleur-4);}


/* ------------------------------------ HEADER ------------------------------------ */

.onglet-shadow{
    box-shadow: 5px 0px 10px rgba(0, 0, 0, 0.415);
}

.nav-link{
    margin-left: 30px;
    padding: 5px 10px;
    border-radius: 100px;
    background-color: var(--couleur-1);
    color: white;
    font-weight: 600;
}
/* ------------------------------------ /HEADER ------------------------------------ */

/* 1. Variables (facile à ajuster) ------------------------------ */
:root{
    --bl-height:        72px;
    --bl-padding-x:     2.2rem;
    --bl-radius:        9999px;          /* pilule */
    --bl-bg:            #ffffff;
    --bl-shadow:        0 6px 20px rgba(75, 71, 137, .25); /* lavande + blur */
    --bl-font:          700 1.6rem/1 "Inter", sans-serif;
    --bl-text:          #47407c;
    --bl-gap:           1.4rem;
  }
  
  /* 2. Lien principal ------------------------------------------- */
  .big-link{
    display:inline-flex;
    align-items:center;
    gap:var(--bl-gap);
    padding:0 var(--bl-padding-x);
    height:var(--bl-height);
    background:var(--bl-bg);
    color:var(--bl-text);
    border-radius:var(--bl-radius);
    box-shadow:var(--bl-shadow);
    font:var(--bl-font);
    text-decoration:none;
    transition:transform .18s ease, box-shadow .18s ease;
  }
  .big-link:hover,
  .big-link:focus-visible{
    transform:translateY(-2px);
    box-shadow:0 10px 28px rgba(75, 71, 137, .30);
  }
  .big-link:active{
    transform:translateY(0);
    box-shadow:0 4px 14px rgba(75, 71, 137, .20);
  }
  
  /* 3. Icone ----------------------------------------------------- */
  .big-link__icon{
    width:36px;
    height:36px;
    flex:0 0 auto;
  }
  .big-link__label{
    white-space:nowrap;
  }
  




.scroll-custom {
  scrollbar-width: auto; /* Firefox */
  scrollbar-color: var(--couleur-4) transparent;
  overflow-y: auto;
}

/* Chrome, Edge, Safari */
.scroll-custom::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

.scroll-custom::-webkit-scrollbar-track {
  background: transparent;
}

.scroll-custom::-webkit-scrollbar-thumb {
  background-color: var(--couleur-4);
  border-radius: 6px;
  border: 3px solid transparent;
  background-clip: content-box;
}

.scroll-custom::-webkit-scrollbar-thumb:hover {
  background-color: var(--couleur-4);
  opacity: 0.8;
}


.btn.btn-primary{
  padding: 10px 20px;
  border-radius: 100px;

       background-color: var(--couleur-3);
    border : 1px solid var(--couleur-3);
}
.btn.btn-primary:hover{
    background-color: var(--couleur-1);
    border : 1px solid var(--couleur-1);
}







.btn{
    padding: 10px 20px;
    border-radius: 100px;
    background-color: var(--couleur-3);
    border : 1px solid var(--couleur-3);
}
.btn:hover{
    background-color: var(--couleur-1);
    border : 1px solid var(--couleur-1);
}

.btn.active{
        background-color: var(--couleur-1);
    border : 1px solid var(--couleur-1);

}

.btn-outline-primary{
    color: white;;
}


















.awesomplete{
    width: 100%;
}



.border-radius-lg-custom{
  border-radius :  10px;
}
@media(min-width: 992px){
.border-radius-lg-custom{
  border-radius : 100px 10px 10px 100px;
}
}



.diag-A{--bg:#0096417b;}  /* vert foncé */
.diag-B{--bg:#4eb84881;}
.diag-C{--bg:#a6ce3986;}
.diag-D{--bg:#ffd9007e;}
.diag-E{--bg:#f39d127b;}
.diag-F{--bg:#e7621f77;}
.diag-G{--bg:#d7191f7d;}


.border-bottom-vert {
    border-bottom: 2px solid var(--couleur-3);
}


/* ===== Couleurs (adaptées à ta charte) ===== */


/* ===== Underline fields ===== */
.form-field-underline{
  margin-bottom:2.2rem;
  position:relative;
}

.form-field-underline label{
  display:block;
  font-weight:600;
  color:var(--couleur-4);
  margin-bottom:.4rem;
}

.form-field-underline input,
.form-field-underline select{
  width:100%;
  border:none;
  border-bottom:3px solid var(--couleur-3);
  outline:none;
  background:transparent;
  padding:.2rem 0;
  font-size:1.05rem;
}

.form-field-underline select{
  appearance:none;           /* supprime flèche chrome */
}

/* ===== Checkboxes personnalisées ===== */
.checkbox-vert input[type="checkbox"]{
  appearance:none;
  width:20px;height:20px;
  border:3px solid var(--couleur-4);
  border-radius:2px;
  margin-right:.5rem;
  vertical-align:middle;
  cursor:pointer;
}
.checkbox-vert input[type="checkbox"]:checked{
  background:var(--couleur-3);
  border-color:var(--couleur-3);
}
.checkbox-vert label{
  cursor:pointer;
  font-weight:600;
  color:var(--couleur-4);
}

/* ===== Textarea encadrée avec courbe ===== */
.textarea-vert{
  width:100%;
  height:100%;
  min-height:250px;
  border:3px solid var(--couleur-3);
  border-radius:0 0 0 0;        /* pas de rayon standard */
  outline:none;
  resize:vertical;
  padding:1rem;
  font-size:1.05rem;
}
/* petit arrondi personnalisé en haut */
.textarea-vert:before{content:''}

/* label posé dans l’angle courbé */
.curved-label{
  position:absolute;
  top:-.9rem; left:1.2rem;
  background:#fff;
  padding:0 .4rem;
  color:var(--couleur-3);
  font-weight:600;
}

/* ===== Bouton ===== */
.btn-primary{
  background:#178d8f;border:none;
}
.btn-primary:hover{background:#0e6b6d;}


#footer-menu{
  text-align: center;
  width: fit-content;
  margin: auto;
}

#preloader{
    background-color: var(--couleur-4) !important;
}
#preloader #status{
    color: white !important;
}



@media (max-width: 991px){
  #barre-programme{
    margin-top: 100px;;

  }
}  


@media (max-width: 1399px){

.nav-link{
    margin-bottom: 10px;
    margin-left: 0px !important;
  }
}