/**
Theme Name: boza
Author: jean-michel web
Author URI: http://wpastra.com/about/
Description: theme enfant d\'atsra
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: boza
Template: astra
*/

body, p {
    font-family: "londrina", sans-serif !important;
	font-size: 20px;
}

 /* ------------------ MENU HAUT ---------------------   */ 

.html {
font-size: 18px; /* 1 rem = 18px */
}

html, body {
    margin: 0;
    padding: 0;
    overflow-x: hidden; /* Évite tout débordement horizontal */
}

@media (max-width: 768px) {
    .site-content, .ast-container {
        margin: 0 auto; /* Centrage correct */
        padding: 0; /* Supprime les marges internes */
        width: 100%; /* Assure une pleine largeur */
    }
}


		
 /* ------------------ MENU HAUT ---------------------   */ 

.ast-primary-header-bar {
    display: block;
    background-color: rgba(39, 9, 73, 1.0);
    position: fixed;
    width: 100%;
    border: 0;
}

.main-header-menu > .menu-item > .menu-link, #astra-footer-menu > .menu-item > .menu-link {
    font-family: "Gaegu", sans-serif;
    font-style: normal;
	font-weight: 400;
    font-size: 1rem;
    color: white;
}

.main-navigation.ast-inline-flex:hover {
  color: #270949;
 }



/* ------------------ SOUS MENU (sous 'les propositions') ---------------------   */ 

.ast-builder-menu-1 .main-header-menu > .menu-item > .sub-menu, .ast-builder-menu-1 .main-header-menu > .menu-item > .astra-full-megamenu-wrapper {
    margin-top: 15px;
}


.ast-builder-menu-1 .sub-menu, .ast-builder-menu-1 .inline-on-mobile .sub-menu {
    color: #270949;
    border-style: solid;
    width: auto;
	font-family: "Gaegu", sans-serif;
	font-size:20px;
	text-align:center;
	padding: 10px; /* Réduit l'espace interne */
    background-color: white; /* Conserve un fond blanc */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Ajoute un ombrage subtil */
    border-radius: 5px; /* Adoucit les angles */
	padding: 1px 1px; /* Ajuste l'espacement interne */
}
 


/* ------------------ POUR CENTRER PHOTOS en HEADER (desktop et mobile) ---------------------   */ 



.header-theme {
    background-size: contain; /* L'image couvre entièrement l'élément sans déformation */
    background-position: center center; /* Centrer l'image */
    background-repeat: no-repeat; /* Pas de répétition */
    width: 100%; /* Largeur 100% */
	margin-top: 80px;
}

@media (max-width: 800px) {
    .header-theme {
        background-size: contain; /* L'image s'adapte sans découpe */
        background-position: center center; /* Centre l'image */
        height: auto; /* Adapte la hauteur en fonction de l'image */
    }
}



/* --- Tablette / mobile --- */
@media (max-width: 768px) {
  header {
    height: 60px; /* menu plus petit sur mobile */
  }

  body {
    padding-top: 60px; /* même valeur que le header */
  }
}

/* --- Très petits écrans --- */
@media (max-width: 480px) {
  header {
    height: 50px; /* encore plus petit */
  }

  body {
    padding-top: 50px;
  }
}


/* ------------------ RESPONSIVE : MENU ------------------ */

/* Adapte le menu pour les écrans mobiles */
@media (max-width: 768px) {
    .ast-primary-header-bar {
        position: static; /* Le menu devient non fixe */
        text-align: center; /* Centre le menu */
    }

    .main-header-menu > .menu-item {
        display: block; /* Les items s'empilent */
        margin: 10px 0; /* Ajoute des espaces entre les items */
    }
}
 


 
/* ------------------ HEADER  PAGES et PAGE 'ACTIVITES' ---------------------   */ 

/* caractéristiques header pour 1page, et son bandeau  , puis son H1 *  */ 
body.page .header-theme{
    background-color: white;
    height: 700px;
    display: flex;
    align-items: center;
    justify-content: center;
	width: 100%;
}

.page .header-theme h1{
    color:white;
    font-weight: 950;
    font-family: "gaegu", sans-serif;
    text-align: center;
    margin:2% 0;
    font-size: 50px;
    text-shadow: 4px 8px 8px #270949 ;
	margin-bottom: -200px;
} 

/* RESPONSIVE : Réduit la taille du header et du texte sur mobile */
@media (max-width: 768px) {
    body.page .header-theme {
        height: 400px; /* Réduit la hauteur du header */
    }

    body.page .header-theme h1 {
        font-size: 45px; /* Diminue la taille du texte */
    }
}




/* ------------------ caractéristiques header pour 1catégory   :page 'activités' et son bandeau violet en margintop  , puis son H1 ------------------ */ 

body.category .header-theme{
    background-color: #270949;
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover;
    margin-top: 0px;
}

 .header-theme h1{
    color:white;
    font-weight: 400;
    font-family: "londrina solid", sans-serif;
    text-align: center;
    margin:10% 0;
    font-size: 50px;
margin-top: 50px;
    text-shadow: 4px 8px 8px #270949 ;
}




/* ------------------ PAGE ACCUEIL------------------ */

/* SOUS PHOTO */

.wp-block-heading.has-text-align-center{
	text-align: center;
    color: #270949;
    font-family: "Gaegu", sans-serif;
}

.has-text-align-center {
  text-align: center;
  color: #270949;
  font-family: "Gaegu", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-size: 22px;
}

/* PARAGRAPHE 'la compagnie' */

.compagnie {
    background-color: #270949;
    margin: 50px;
    font-family: "Gaegu", sans-serif;
}
.wp-block-heading.has-text-align-center {
	color:white;
}
.compagnie h2 {
color: white;
font-size: 40px;
}

.compagnie h3 {
color: white;
font-size: 26px;
list-style-type: 35px;
}

/* ------------Les icones sur les cotés du CAROUSSEL ICONES ------------ */

.wp-block-cb-carousel .slick-next:before, .wp-block-cb-carousel .slick-prev:before {
    color: #270949;
    font-size: 65px;
}

.entry-content ul, .entry-content ol {
    margin-bottom: -15px;
}

/* ------------Le CAROUSSEL LA COMPAGNIE  ------------ */

.slidercompagnie {
	background-color: #270949;
	padding-top:20px;
	padding-bottom:20px;
	font-family: "Gaegu", sans-serif;
	font-size: 1rem;
}

.has-text-align-center has-ast-global-color-5-color has-text-color has-background has-link-color {
	font-family: "Gaegu", sans-serif;
}

.ast-plain-container.ast-no-sidebar .entry-content > .alignfull, .ast-page-builder-template .ast-no-sidebar .entry-content > .alignfull {
    padding-bottom: 20px;
}

.wp-block-cover,
.wp-block-cover-image {
  border-radius: 50%; /* Rend le bloc ou l'image ronde */
  overflow: hidden; /* Assure que tout dépassement est masqué */
}

.wp-block-cover__background,
.wp-block-cover__gradient-background {
  object-fit: cover; /* Adapte le contenu à l'intérieur de la forme ronde */
  border-radius: 50%; /* Rend aussi les arrière-plans ronds */
}


/* ----------CONFIG MODELE PAGE DES ACTIVITES -- acti ----SINGLE PHP ----------*/ 

.ast-narrow-container .site-content > .ast-container {
    max-width: 1300px;
}

.acti {
    margin-top: 20px;
}

/* --le titre de l'acti--*/ 
h1, .acti h1 {
font-family: "londrina solid", sans-serif;
font-weight: 400;
font-size: 40px;
color: #270949;
text-align: center;
}

 
.acti ul{
    background-color: #D1D5DB;
    margin:5% 0;
	text-align: center;
	align-content: center;
}

.acti p {
    font-size: 20px;
}

.acti ul li {
    display: inline-block;
    list-style: none;
    padding: 0 2%;
    color:black;
    font-family: "londrina solid", sans-serif;
    font-weight: 400;
    font-size: 1.5rem;
}

#page .site-content {
    flex-grow: 1;
    margin-top: -33px;
}


/* ----------LES EVENEMENTS ----CATEGORY-EVENEMENTS.PHP */ 

.entry-content[data-ast-blocks-layout] > *  {
    max-width: var(--wp--custom--ast-content-width-size);
    margin-left: auto;
    margin-right: auto;
    font-family: "gaegu", sans-serif;
    color: #270949;
}

/* -- titre : LES ACTIVITES A VENIR--*/ 
.ast-separate-container .entry-content[data-ast-blocks-layout] > .alignwide, .ast-plain-container .entry-content[data-ast-blocks-layout] > .alignwide {
    font-size: 40px;
    }
 
/* -- titre : LES BLOCS DES ACTIVITES A LA SUITE DAN SLA PAGE ACTI --*/
.actisavenir{
    display: flex;
    margin-top: 20px;
	flex-wrap: wrap; /* Ajuste les blocs sur plusieurs lignes si nécessaire */
    gap: 1px; /* Ajoute des espaces entre les blocs */
    justify-content: center;
	margin-bottom: 20px;
}



.bloc-date {
    color: white;
    background-color: #270949;
    font-family: "londrina solid", sans-serif;
    font-weight: 400;
    margin : 1% 6%;
    padding: 1% 10%;
    border-radius: 10px;
}

/* RESPONSIVE : Ajuste les blocs sur mobile */
@media (max-width: 768px) {
    .bloc-acti {
        width: 100%; /* Les blocs prennent toute la largeur sur mobile */
    }
}

/* Images dans les blocs */
.bloc-image {
    width: 250px; /* Réduction des visuels */
    height: 300px;
    border: 5px solid #270949;
    border-radius: 10px;
}


.actisavenir h2 {
font-family: "londrina solid", sans-serif;
font-weight: 400;
font-size: 40px;
color: black;
text-align: center;
width: 100%;
}

/* Style des blocs individuels */
.bloc-acti {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 15px; /* Marges internes réduites */
    background-color: white;
    width: 28%; /* Diminue légèrement la largeur des blocs */
    border: 2px solid #270949;
    border-radius: 10px;
	text-align:center;
	margin:25px;  /* Marges externes augmentées */
}

/* RESPONSIVE : Ajuste les blocs sur mobile */
@media (max-width: 768px) {
    .bloc-acti {
        width: 100%; /* Les blocs prennent toute la largeur sur mobile */
    }
}

/* Images dans les blocs */
.bloc-image {
    width: 250px; /* Réduction des visuels */
    height: 300px;
    border: 5px solid #270949;
    border-radius: 10px;
}
 

/* -------------le CTA EN SAVOIR PLUS --------------*/ 

.bloc-acti a  {
    background-color: #270949;
    font-size: 25px;
    color: white;
    font-weight: 400;
    font-family: "londrina solid", sans-serif;
    padding: 3px 10px 3px 10px;
    border-radius: 35px;
	text-align: center; /* Centrer le texte */
    display: inline-block; /* Empêche les débordements sur plusieurs lignes */
}


.bloc-acti a:hover {
    color: #270949;
    background-color: #f1883a;
    font-family: "londrina solid", sans-serif;
}

/* -- CTA pour les petits écrans (ex. iPhone 13) --*/
@media (max-width: 390px) {
    .bloc-acti a {
        font-size: 18px; /* Réduit la taille du texte */
        padding: 5px 8px; /* Ajuste les marges internes */
        border-radius: 25px; /* Réduit l'arrondi pour une apparence plus compacte */
    }
}

/* --------------------------le titre de l'acti-----------------------*/ 

.bloc-acti h3 {
    font-size: 30px;
    color: #270949;
    font-weight: 400;
    font-family: "londrina solid", sans-serif;
    margin-bottom: 20px;
}

/* --le p de l'acti--*/ 
.bloc-acti p {
    font-size: 20px;
    color: #270949;
    font-family: "londrina solid", sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
}
 
.site-content {
    background-color: white;
}

/* --le bouton VOIR TOUTES LES ACTIVITES---   */
 
.wp-block-button .wp-block-button__link {
    border-color: #270949;
    background-color: #270949;
    color: #ffffff;
    font-family: inherit;
    font-weight: 900;
    font-size: 22px;
    padding: 15px 30px;
    margin-top: 50px; /* Augmente l'espace au-dessus pour l'éloigner */
    display: inline-block;
    text-align: center;
    border-radius: 10px;
    transition: all 0.3s ease-in-out;
}

.wp-block-button .wp-block-button__link:hover {
    background-color: #f1883a; /* Fond orange au survol */
    color: #270949; /* Texte violet */
}


/* ----------PAGE TROP TARD ------   */


.actisfinies {
    display: flex;
    margin-top: 20px;
	flex-wrap: wrap; /* Ajuste les blocs sur plusieurs lignes si nécessaire */
    gap: 1px; /* Ajoute des espaces entre les blocs */
    justify-content: center;
	margin-bottom: 20px;
}

/* ----------INSTAGRAM-------   */
 
.insta { 
    background: #270949;
    width: 100% ;
   }

 .insta h2 { 
    font-size: 40px;
    font-family: "Montserrat", sans-serif;
    padding-bottom: 0px;
   }

.sb_instagram_header.sbi_header_outside {
    margin-bottom: -19px;
    margin-top: -35px;
}


/* ---- FOOTER ---- */ 


footer a {
color: #270949;
font-family: "gaegu", sans-serif;
font-weight: 950;
font-size: 22px;
vertical-align: baseline;
}

footer a:hover {
color:#f1883a;}

.social-item-label:hover {
color:#f1883a;}

.site-below-footer-wrap[data-section="section-below-footer-builder"] {
    background-color: #270949;
    border: 0;
}

.site-primary-footer-wrap[data-section="section-primary-footer-builder"] {
    margin-top: -15px;
margin-bottom: -45px;
}

.site-footer {
background-color: #f5f5f5 !important; /* Gris clair */
border-top: 2px solid #ccc; /* Bordure grise de 2px en haut */
border-color: #270949;
}

.site-above-footer-wrap[data-section="section-above-footer-builder"] {
    margin-bottom: -20px;
    margin-left: 0px;
    margin-right: 0px;
    padding-top: 10px;
	background-color: #F0F5FA;
}


/* --------------- FORMULAIRE NINJA POUR LA PAGE  CONTACTEZ NOUS --------------- */ 

.forms{
background-color: white;
width: 100%;
border-block: 2px;
}

.ninja-forms-form-wrap {
    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    color: #270949;
}

.nf-form-content .list-select-wrap .nf-field-element>div, .nf-form-content input:not([type=button]), .nf-form-content textarea {
    background: #grey;!important;
    border: 1px solid #270949!important;
    border-radius: 8!important;
    font-family: "Montserrat", sans-serif!important;
    font-color: #270949!important;
    font-size: 16px;
}

.label{
    color: #270949;
    font-size: 14px;
    font-style: normal;
    font-weight: 100;
    line-height: 1px;
    font-family: "Montserrat", sans-serif;
}

.nf-form-content button, .nf-form-content input[type=button], .nf-form-content input[type=submit] {
    background: #270949!important;
    font-family: "Montserrat", sans-serif!important;
    font-size: 20px!important;
    font-weight: 700!important;
    color: #ffffff!important;
    border-radius:10px!important;
    display: flex!important;
    text-align: center!important;
    align-items: center!important;
    transition: all .5s;
    color: #ffffff!important;;
}


/* ---------------   PAGE  MENTIONS LEGALES ------- */ 


.ast-plain-container.ast-no-sidebar #primary {
    margin-top: 0px;
    margin-bottom: 0;
    font-size: 20px;
	font-family: "Montserrat", sans-serif!important;
}