/*
Theme Name: twentytwenty-child
Description: theme enfant
Author: Surikwat-cd
Template: twentytwenty
Version: 0.1.0
*/
/*--- COLOR ---*/
.blue_cyan{
  color: #21c2d4;
}
.grey{
  color: #838383;
}

:root {
  --textecouleur: #fbb040;
}



/*--- BODY ---*/
body{
  background: #21c2d4 !important;
}
#site-header {
  border-radius: 50px 0;
}
.wrap_all{
  max-width: 1000px;
  width: 100%;
  margin: 50px auto;
  padding: 30px 100px 10px;
  background: white;
  border: solid #21c2d4 5px;
  border-radius: 50px 0;
}
textarea {
  resize: none;
}
a {
  text-decoration: none !important;
}
.bloc_blanc_arrondi{
  background: white;
  padding: 20px;
  border-radius: 50px 0;
}
.container_front_page.bloc_blanc_arrondi{ margin-top: 30px;}
/*--- HEADER ---*/
.header-titles-wrapper{
  margin: auto;
}
.entry-title{display: none;}


/*--- FOOTER ---*/


/*--- FRONT PAGE ---*/
.container_content_home_page .wp-block-cover{
  height: 180px;
  width: 180px;
  background-color: #eeeeee;
  border-bottom: 20px solid #21c2d4;
}
.container_content_home_page .wp-block-cover span{
  display: none;

}
.container_content_home_page .wp-block-cover .logged-out{
  text-align: center;
}
.mairie_name{
  text-align: center;
}
.mairie_name .blue_cyan {
  font-weight: bold;
}
.container_front_page .container_button_front_page{
  margin: 65px auto;
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}
.container_front_page .container_button_front_page .bloc_button{
  height: 120px;
  width: 30%;
  background-color: #eeeeee;
  border-bottom: 20px solid #21c2d4;
  margin-top: 20px;
  border-radius: 20px 0;
}
.container_front_page .container_button_front_page .bloc_button a.lien_page{
  text-decoration: none;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 100%;
}
.lien_page.grey:hover {
  background: #b9b9b9;
  color: white;
}

.container_front_page #form_custom_alert{
/*  background-color: #e6e6e6;
  padding: 2rem 7rem;
  margin: auto;
  width: 70%; */
}
.container_front_page #form_custom_alert .login_submit{
  text-align: center;
}

/*--- PAGE ALERTE ---*/
.container_map{
  margin-bottom: 20px;
}
.container_map img{
  width: 100%;
}
.container_form_alert form {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  grid-column-gap: 5px;
  grid-row-gap: 5px;
}


.container_choix_envoi{
  display: flex;
  background: gray;
  margin-bottom: 20px;
  padding: 10px;
  color: white;
  border-radius: 15px;
  align-items: center;
  flex-wrap: wrap;
}

.container_choix_envoi label{
margin: 0 30px 0 5px ;
}

.container_choix_envoi input {
  height: 20px;
  width: 20px;
}


.container_input_zones {
  display: flex;
  gap: 20px;
  background: gray;
  margin-bottom: 20px;
  padding: 10px;
  color: white;
  border-radius: 15px;
  align-items: center;
  flex-wrap: wrap;
}
.unecase {
  padding: 6px 10px;
  background: #ffffff52;
  border-radius: 8px;
  display: flex;
  align-items: center;
}
.unecase input {
  width: 20px;
  height: 20px;
  font-size: 22px;
  padding-left: 2px;
}
.unecase label{
  margin: auto;
}

.container_form_alert form .container_left {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  grid-area: 1 / 1 / 2 / 2;
}
.container_form_alert form .container_left .container_input_zones, .container_form_alert form .container_left .container_input_zones_all{
  display: flex;
  background-color: #e6e6e6;
  padding:10px;
}
.title_form{
  background-color: #e6e6e6;
  padding: 10px;
  text-decoration: underline;
}
.container_form_alert form .container_left .container_input_zones .content_input_zones{
  display: flex;
  flex-direction: column;
  margin: 5px;
}
.container_form_alert form .container_left p{
  margin-bottom: 0;
}
.container_form_alert form .container_left .container_input_choix{
  display: flex;
  background-color: #e6e6e6;
  justify-content: space-around;
  padding: 20px 10px;
}

.container_form_alert form .container_right {
  grid-area: 1 / 2 / 2 / 3;
  padding: 5px;
  background-color: #e6e6e6;
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.container_form_alert form .container_button {
  grid-area: 2 / 1 / 3 / 3;
  height: max-content;
  display: flex;
  justify-content: end;
}
#button_envoi_alert, #wp-submit{
  background-color: #20c1d3;
  color: #ffff;
}

.home #form_custom_alert {
 /* margin-bottom: 70px; */
}


/* Popup detail administres*/
#envoi_gps input {
  max-width: 150px !important;
  height: 20px !important;
  padding: 15px 8px !important;
}

#envoi_gps {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

#envoi_gps button {
  width: 15px;
  height: 10px;
  margin-left: -10px;
  text-align: center;
  padding: 6px 25px 25px 6px;
}

#envoi_gps button:hover {
background: #84a8dd;

}

#editerCPT {
  margin-top: -30px;
  margin-bottom: 20px;
}


#sujetmail {
  width: 100%;
  max-width: 600px;
  font-size: 16px;
  padding: 10px;
  border: none;
  border-radius: 10px;
}

#lesujet {
  display: flex;
  align-items: center;
  background: gray;
  padding: 10px;
  color: white;
  gap: 10px;
  border-radius: 15px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

/*--- RESPONSIVE ---*/

@media (max-width: 575.98px) {
  .wrap_all{
      padding: 15% 1%;
  }

  .container_form_alert form .container_left .container_input_zones{

  }
}




/****  AJOUT PERSO ****/
@media (max-width: 575.98px)
{
  .wrap_all {
  padding: 15% 1%;
  margin: 0;
  min-height: calc( 100vh - 46px );

  }
  .home .wrap_all {
      min-height: 100vh;
  }
}

@media (max-width: 900px)
{


  .wrap_all {
      padding: 2% 1%;
      margin: 0;
      min-height: calc( 100vh - 46px );
    
      }
      .home .wrap_all {
          min-height: 100vh;
      }


  .container_front_page #form_custom_alert {
      width: 100%;;
      padding: 1rem 1rem;
  }
  body:not(.enable-search-modal) .header-titles-wrapper {
      justify-content: center;
  }
  .site-logo img {
      max-height: inherit;
  }
  .container_form_alert form {
      display: inline-block;
      width: 100%;
      margin-bottom: 3rem;
  }
  .container_form_alert form .container_left .container_input_choix {
      display: inline-block;
    }

    input[type="checkbox"] {
      width: 2.5rem;
      height: 2.5rem;
      padding: 0.5rem;
    }
}



.mairie_name img {
  max-width: 300px;
  margin: 2rem auto;
  width: 60%;
}


/**** ADMINISTRES *****/
.foyers {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
article:nth-child(2n+1) {
  background: #e1dada;
}
.foyer {
  width: 33%;
  margin-bottom: 30px;
  padding: 10px;
}
.foyer .fa-solid {
  margin-right: 10px;
  width: 20px;
}
.foyer .fa-solid::before {
  font-size: 16px;
}
.page-template-template-gestion-administres-2 .wrap_all{
  padding: 30px 20px 10px;
}

#dialog {
  position: fixed;
  top: 70px;
  background: #fdfdfdf7;
  left: 20%;
  right: 20%;
  z-index: 99;
  border: solid 1px;
  border-radius: 20px;
  padding: 20px;
  display: none;
}
#modal-content {
  line-height: 27px;
  max-height: 85vh;
  overflow: auto;
}


#modal-content hr {
  margin: 10px auto;
}
h2#dialog-title {
  margin: 0 auto 30px 10px;
}

.leshabitants {
  display: flex;
  flex-wrap: wrap;
  gap: 50px;
  margin-top: 20px;
}
.foyer .details{
  display: block;
  background: #00000012;
  padding: 10px;
  color: #3274d6;
  margin-top: 10px;
  cursor: pointer;
  border-right: solid 4px #3274d6;
}
.details:hover {
  background: gray;
  color: white;
}

.unhabitant {
  max-width: 500px;
}

.unhabitant div .fa-solid {
  margin-right: 10px;
}
@media (max-width: 768px)
{
  .foyer {
      width: 50%;
  }
  #dialog {
      top: 50px;
      left: 3%;
      right: 3%;
    }
}
@media (max-width: 590px)
{
  .foyer {
      width: 100%;
  }
}




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

#principal_accueil{display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 50px;}
#texte_principal_accueil {max-width: 640px; margin-bottom: 20px;}
.page-template-template-accueil .wrap_all { max-width: 1200px; margin: auto; font-size: 15px;}
#image_principal_accueil{
  display: flex;
  align-items: center;
  justify-content: center;
}
.custom-logo-link img.custom-logo {
  max-height: 90px;
}
.page-template-template-accueil h1, .page-template-template-accueil h2 {
  color: var(--textecouleur);
  font-size: 20px;
  padding: 0;
  margin: 10px 0;
}
.tribloc {
  display: flex;
  width: 100%;
  justify-content: space-between;
  margin: 50px auto 20px auto;
  flex-wrap: wrap;
}

.untier {
  margin-bottom: 50px;
  width: 31%;
}

.page-template-template-accueil #site-header .header-titles-wrapper {
  max-width: none;
  justify-content: space-between;
  display: flex;
  width: 100%;
  color: var(--textecouleur);
  font-style: italic;
  font-size: 19px;
}

.page-template-template-accueil #site-header .header-inner{padding: 5px;}
.page-template-template-accueil .wrap_all {background: transparent; padding-bottom: 0;}
#footer_accueil{padding: 5px 15px; display: flex; flex-wrap: wrap; justify-content:space-around;}
#footer1 img{margin-top: -15px;}
#footer_accueil div {
  width: 32%;
  display: flex;
  justify-content: center;
  align-items: end;
}

@media (max-width: 800px){
  .texte_header { display: none;  }
}

@media (max-width: 630px){
  .untier {
      width: 100%;
    }    

    #footer_accueil div {
      width: 100%;
      display: flex;
      justify-content: center;
      align-items: end;
      text-align: center;
      margin: 20px auto;
    }
    #footer1 {
      margin-top: -80px !important;
    }

}

@media (max-width: 1150px){
  #texte_principal_accueil {
      max-width: none;
    }
  #image_principal_accueil {
  width: 100%;
  }
}





#selectAll {
  color: white;
  background: gray;
  padding: 10px;
  border-radius: 12px;
  margin-bottom: 20px;
  display: inline-block;
}

#selectAll:hover {
  background: #aeaaaa;
}



/******* Page Détails ***********/
.page-template-template-gestion-administres-details .wrap_all {
  max-width: none;
  padding: 0;
}

.page-id-4502 .foyers tr:nth-child(2n) {
  background: #f7ecec;
}
td.intro_hb {
  width: 35%;
}
td.milieu_hb {
  width: 25%;
}
td.details_hb {
  width: 40%;
}
.foyerdetails:hover {
  background: #d8dcdd !important;
}
.page-id-4502 .fa-solid {
  width: 25px;
}
#search-box button {
  font-size: 1.2rem;
}




@media print {
  .filters {
      display: none; /* Cache les filtres lors de l'impression */
  }

  #foyer-list {
      font-size: 12px;
      width: 100%;
  }

  #foyer-table {
      width: 100%;
      border-collapse: collapse;
  }

  #foyer-table th, #foyer-table td {
      border: 1px solid #ddd;
      padding: 8px;
      text-align: left;
  }

  #foyer-table th {
      background-color: #f2f2f2;
  }
}



#filters.lesfiltres input[type="checkbox"] {
  transform: scale(1.2);
  transform-origin: top left;
  -webkit-font-smoothing: antialiased;
  backface-visibility: hidden;
  margin-right: 10px;
  margin-left: 15px;
}


#filters.lesfiltres div {
  display: flex;
  margin-bottom: 20px;
}

.page-template-template-administres-detail-recherche .wrap_all {
  max-width: 98%;
  padding: 20px 20px 10px;
}
.page-template-template-administres-detail-recherche  ul {
  margin: 0;
}