/* Form Front End 
.select2-container--open .select2-dropdown--below {
  margin-top: 35px;
}
*/
/* ************** CALENDRIER **************** */
/*
#calendrier_des_evenements {
  background-color: var(--contrast);
  color: rgb(255, 255, 255);
  border-radius: 0 0 1em 1em;
  text-align: center;
}
tbody{
  font-size: 0.9em;
}
thead {
  background-color: var(--fbc-secondary-text);
}

#calendrier_des_evenements a {
  text-decoration: none;
}

.jour_meme {
  background: var(--couleur-1-foncee);
  border-radius: 0.2em;
}

#calendrier_des_evenements .hors_du_mois a {
    color: rgb(150, 150, 150);
}
#calendrier_des_evenements .jours_anciens a {
	color: var(--couleur-1-foncee);
	  color: var(--blanc-pale);
}
#calendrier_des_evenements .jour_meme a {
  color: var(--blanc);
}
#calendrier_des_evenements .jours_futurs a {
	color: var(--couleur-3-claire);
  color: var(--blanc);
}
*/

.wrapper{
  background: var(--blanc);
  color: var(--contrast);
  border-radius: 10px;
  box-shadow: 0 15px 40px rgba(0,0,0,0.12);
  padding: 0.5em;
}
.calendar ol, .calendar ul {
  margin: 0;
}
.wrapper header{
  display: flex;
  align-items: center;
  padding: 0.5em 1em;
  justify-content: space-between;
}
header .icons{
  display: flex;
}
header .icons span{
  /* height: 38px; */
  /* width: 38px; */
  margin: 0 1px;
  cursor: pointer;
  color: #878787;
  text-align: center;
  /* line-height: 38px; */
  /* font-size: 1.9rem; */
  user-select: none;
  /* border-radius: 50%; */
}
.icons span:last-child{
  margin-right: -10px;
}
header .icons span:hover{
  background: #f2f2f2;
}
header .current-date{
  /* font-size: 1.45rem; */
  font-weight: 600;
}



.calendar{
  padding: 5px;
}
.calendar ul{
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  text-align: center;
}
.calendar .days{
  /* margin-bottom: 20px; */
}
.calendar li {
  color: #333;
  width: calc(100% / 7);
  font-size: 0.8em;
}

.calendar .weeks li{
  font-weight: 500;
  cursor: default;
}
.calendar .days li{
  z-index: 1;
  /* cursor: pointer; */
  position: relative;
  /* margin-top: 30px; */
}
.calendar .days li a{
  cursor: pointer;

}
.calendar li a {
  color: var(--contrast);
  text-decoration: none;
  display: inline-block;
  width: 100%;
  border-radius: 10px;
}
.days li.active a {
  color: var(--blanc-pale);
  font-weight: bold;
  background: var(--couleur-1-foncee);
}
.days li:not(.active) a:hover {
    background: var(--couleur-3-claire);
}
.days li:nth-child(7n+6) a:hover {
    background: var(--couleur-1-claire);
}
.days li.active a{
	color: var(--blanc);
}
.days li.inactive a {
    opacity: 0.7;
}

.days li:not(.active):hover::before{
  background: var(--blanc-pale);
}
.calendar li:nth-child(7n+1), .calendar li:nth-child(7n+3), .calendar li:nth-child(7n+5) {
background: var(--blanc-pale);
}
.calendar li:nth-child(7n+6) {
  background: var(--couleur-3-claire);
}
 .calendar li:nth-child(7n+7) {
background: var(--couleur-1-claire);
}


/* Formulaire de recherche */

/* COMMUN */
.recherche_evenements .bloc_date {
  border-width: 1px;
  border-style: solid;
  margin: 0.05em 0.2em;
}
span.event-choix {
  background: var(--blanc);
}
.titre-formulaire-recherche::before {
  font-size: 1.4em;
  font-weight: 900;
  font-family: "Font Awesome 6 Free";
  float: left;
  border-radius: 100em;
  width: 2em;
  height: 2em;
  text-align: center;
  margin: 0.3em 0.5em 0 0.1em;
  padding: 0.2em;
}

.recherche_evenements .even-choix,
.recherche_evenements input[type="text"], .recherche_evenements .bloc_date {
	padding: 0.7em 0.5em;
}
.even-choix {
	padding: 0.7em 0.5em;
	display: inline-block;
	margin: 0.2em;
	border-width: 1px;
	border-style: solid;
	border-radius: 2px;
	flex: auto;
	text-align: center;
	cursor: pointer;
}
.recherche_evenements .even-choix:hover,
.recherche_evenements .even-choix.selected,
.recherche_evenements .checked,
.recherche_evenements .selected{
  border-color: var(--couleur-1-foncee);
  background: var(--couleur-1-foncee);
  color: var(--blanc-pale);
}

.recherche_evenements .bloc_date.checked  input[type="date"]{
  color: var(--blanc-pale);
}
.titre-formulaire-recherche.date::before {
  content: "\f073";
}
.titre-formulaire-recherche.localisation::before {
  content: "\f5a0";
}
.titre-formulaire-recherche {
  border-top: 2px dashed var(--couleur0);
  margin-top: 0.2em;
  padding-top: 0.1em;
}
label.even {
  display: flex;
}
label.even input {
  flex: auto;
  margin: 0.2em;
    height: auto;
}
.entry-content .titre-formulaire-recherche {
  font-weight: bold;
  margin: 0.5em 0 0 0;
  display: block;
  font-size: 1.1em;
}

input[type="submit"].even-recherche-validation {
  font-size: 1.1em;
  width: 100%;
  margin-top: 0.2em;
} 
/* FOND COLORE */

/* FOND BLANC */
.titre-formulaire-recherche::before {
  color: var(--couleur-1-foncee);
  background: var(--couleur0);
}
form.recherche_evenements.fond_blanc {
  background: var(--blanc-pale);
  padding: 0.5em;
  border: 2px solid var(--couleur0);
}
.recherche_evenements.fond_blanc .even-choix:not(.checked):not(.selected):not(:hover),
.recherche_evenements.fond_blanc input[type="text"]:not(.checked):not(.selected):not(:hover):not(:focus):not(:active),
.recherche_evenements.fond_blanc .bloc_date:not(.checked):not(.selected):not(:hover) {
  background: var(--blanc);
  border-color: var(--couleur0);
}
.recherche_evenements.fond_blanc input[type="date"] {
	background: none;
	border: none;
}
.recherche_evenements.fond_blanc .selected input[type="date"] {
  color: var(--blanc);
}
.recherche_evenements.complet input[type="text"]:focus,
.recherche_evenements.complet input[type="text"]:active,
.bloc_date input[type="date"]:focus,
.bloc_date input[type="date"]:active 
{
    background: var(--couleur-1-foncee);
	color: var(--blanc);
}


@media screen and (max-width: 950px) {
	label.even {
	  flex-direction: column;
	}
}



.search-container {
	display: flex;
	align-items: center;
	margin: 20px;
}

.search-input {
	padding-left: 30px; /* Ajustez la valeur selon la taille de votre icône et l'espace désiré */
	width: 300px; /* Ajustez la largeur selon vos besoins */
	height: 30px; /* Ajustez la hauteur selon vos besoins */
	border: 1px solid #ccc; /* Ajoutez une bordure si nécessaire */
	border-radius: 5px; /* Ajustez le rayon de la bordure si nécessaire */
}

.search-icon::before {
	content: '\f002'; /* Code Unicode de l'icône (fa-search dans FontAwesome) */
	font-family: 'Font Awesome 5 Free'; /* Police de caractères FontAwesome */
	position: absolute;
	margin-left: 10px; /* Ajustez la position selon vos besoins */
	color: #555; /* Couleur de l'icône */
}


.rappel-partage {
  display: flex;
  margin: 1em 0;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
}
button.partage, button.rappel {
  background: var(--couleur-1-claire);
  color: var(--blanc);
  border-radius: 4px;
  padding: 0.2em 1.2em;
}
button.rappel {
  margin: 0 0.5em;
}
button.partage::before , button.rappel::before {
	font-weight: 800;
  font-family: 'Font Awesome 6 Free';
  margin-right: 0.5em;
}
button.rappel::before {
	content: '\f0f3';
}
button.partage::before {
	content: '\f14d';
}

.encart {
  display: block;
  background: var(--blanc-pale);
  padding: 1em;
  border: 2px solid var(--couleur-1-claire);
  margin: 0.5em 0;
}
.encart form {
  display: flex;
  flex-wrap: wrap;
}
.encart form > * {
  flex: auto;
  margin-right: 0.4em; /* Applique la marge uniquement à droite */
  margin-top: 0.2em
}

.encart form > *:last-child {
  margin-right: 0; /* Supprime la marge à droite du dernier élément */
}

.bouton_croix {
  float: right;
  cursor: pointer;
}

.show-optional-fields {
  display: block;
  border: 1px solid var(--couleur-2-foncee);
  cursor: pointer;
  margin: 0.9em;
  border-radius: 1em 0;
}
.show-optional-fields .fa-solid {
  padding: 0.5em;
  font-size: 1.4em;
  position: revert;
  color: var(--blanc);
  vertical-align: -0.1em;
  background: var(--couleur-2-foncee);
  margin-right: 0.5em;
  border-radius: 0.5em 0;
}

.leaflet-popup-content h3 {
	font-size: var(--wp--preset--font-size--medium);
}
.leaflet-popup-content-wrapper {
	background: var(--couleur-1-foncee);
	color: var(--blanc);
}
.leaflet-popup-tip {
	background: var(--couleur-1-foncee);
}
.leaflet-popup-content a {
	color: var(--blanc-pale);
	text-decoration: none;
}
.leaflet-popup-content a:hover {
	color: var(--blanc);
}
.leaflet-popup-content-wrapper {
	text-align: center;
}

.leaflet-control-zoom.leaflet-bar.leaflet-control > * {
background: var(--couleur-2-claire);
color: var(--blanc);
border-color: var(--blanc);
}
back {
}
.leaflet-control-zoom.leaflet-bar.leaflet-control {
background: var(--blanc-pale);
border-color: var(--blanc-pale);
}
.leaflet-control-zoom.leaflet-bar.leaflet-control > :hover {
background: var(--couleur-2-foncee);
}
.leaflet-popup.leaflet-zoom-animated {
	margin-bottom: 2.6em;
}

.leaflet-marker-icon.marker-cluster-mb.leaflet-zoom-animated.leaflet-interactive > div {
  background-size: contain;
  display: flex;
  justify-content: center;
  padding-top: 0.5em;
  font-weight: 800;
  color: var(--couleur-1-foncee);
}

.leaflet-container a.leaflet-popup-close-button {
  color: var(--blanc-pale);
}
.leaflet-container a.leaflet-popup-close-button:hover {
  color: var(--blanc);
}





/* Styles de base pour le conteneur des termes */
.types-sorties-terms {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    padding: 20px;
    background-color: var(--blanc-pale);
}

/* Styles pour chaque terme */
.types-sorties-term {
    background-color: var(--blanc);
    border-radius: 10px;
    box-shadow: 0 4px 8px var(--couleur7);
    margin: 10px;
    flex: 1 1 200px; /* Minimum width of 200px, will grow to fill available space */
    max-width: 300px;
    text-align: center;
    overflow: hidden;
    transition: transform 0.3s, box-shadow 0.3s;
    min-width: 200px;
}

/* Hover effect for each term */
.types-sorties-term:hover {
    transform: translateY(-10px);
    box-shadow: 0 8px 16px var(--transparent-fonce);
}

/* Styles for the term link */
.types-sorties-term a {
    color: var(--contrast);
    text-decoration: none;
    display: block;
    height: 100%;
}

/* Styles for the term image */
.types-sorties-term img {
    width: 100%;
    height: 15em;
    object-fit: cover;
    background: var(--couleur-3-claire);
}

/* Styles for the term title */
.types-sorties-term h2 {
    margin: 0;
    font-size: 1.2em;
    color: var(--couleur-2-foncee);
    background-color: var(--transparent-clair);
    padding: 0.5em;
    border-radius: 5px;
}