/************************************************ 
 *
 * SPECTACLE - TEMPLATE
 *
 ************************************************/

/* Bandeau */
/* .single-spectacle .bandeau {
	background-color:rgba(181,123,0,0.1);
	min-height: 600px;
	padding-bottom: 50px;
} */
.single-spectacle .row-infos-affiche {
	display: flex;
	flex-wrap: wrap;
	width: 80%;
	margin: 0 auto;	
}

/* Par défaut, on masque la version mobile */
.only-mobile { display: none; }

/* Sur mobile (ex. < 768px), on inverse */
@media (max-width: 767px) {
  .only-desktop { display: none !important; }
  .only-mobile { display: block; }
}
.single-spectacle .row-infos-affiche .infos {
	flex: 1; 
	margin-top: -75px;
	background-color: #fff; 
	padding: 40px 50px 45px 50px; 
	box-shadow: 3px 3px 6px rgba(0,0,0,0.1); 
	animation: fade-slide-up 2s ease forwards;
	align-self: flex-start;
}
.single-spectacle .row-infos-affiche .affiche {
	flex: 1;
	position: relative;
}
.single-spectacle .row-infos-affiche .affiche img {
	display: block;
	max-width: 65%;
	margin: -150px 50px 0 auto;
	animation: fade-slide-up 1s ease forwards;
}
@keyframes fade-slide-up {
  from {
    transform: translateY(30px);
/*  opacity: 0; */
  }
  to {
    transform: translateY(0);
/*  opacity: 1; */
  }
}
.single-spectacle .bandeau-titre {
	font-size: 36px;
	line-height:1.2em;
	margin-bottom: 40px;
	padding-bottom: 0;
	letter-spacing:0.5px;
	font-weight:800;
}
.single-spectacle .bandeau-info {
	font-size: 18px;
	padding-bottom: 0;
	margin-bottom:10px;

}
.single-spectacle .bandeau-intitule {
	font-size: 16px;
	margin-right: 6px;
}
.single-spectacle .bandeau-noms {
	font-weight:bold;
}
.single-spectacle .bandeau-dapres {
	font-size: 16px;
}
/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {
	.single-spectacle .bandeau {
		padding-bottom: 20px;
	}
	.single-spectacle .row-infos-affiche .infos {
		flex: auto; 
		padding: 30px 30px 35px 30px;
		margin-top: -100px;
	}
	.single-spectacle .bandeau-titre {
		font-size: 6vw;
		margin-bottom: 20px;
	}
	.single-spectacle .row-infos-affiche .affiche img {
		margin: 50px auto 0;
	}
	.single-spectacle .bandeau-info {
		font-size: 16px;
	}
	.single-spectacle .bandeau-intitule,
	.single-spectacle .bandeau-dapres {
		font-size: 14px;
	}
}


/* Inversion colonnes sur Smartphone ??? */
.single-spectacle .informations {
	display:flex;
}
@media screen and (max-width: 767px) {
	.single-spectacle .informations {
			flex-direction: column;
	}
/*	.infos {
		order: 2;
		padding-top: 30px;
	}
	.textes {
		order: 1;
	} */
}

/* Récurrence, Jusqu'à, Bouton Réserver, Nb représentations restantes */
.single-spectacle .reservation {	
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

/* Dates de calendrier */
.single-spectacle .periode .date-debut {
	padding-bottom: 0;
}
.single-spectacle .periode .date-debut span {
	visibility: hidden;
}
.single-spectacle .periode p {
	font-weight: 700;
	font-size: 23px;
	line-height: 1.6em;
}

/* Récurrence(s) & dates spécifiques */
.single-spectacle .recurrence,
.single-spectacle .dates-specifiques {
	margin-top:20px;
}
.single-spectacle .recurrence p,
.single-spectacle .dates-specifiques p {
	font-weight: 700;
	font-size: 19px;
	line-height: 1.6em;
}
.single-spectacle .dates-specifiques p {
	font-size: 17px;
	margin-bottom: 10px;
}
/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {
	.single-spectacle .periode p {
		font-size: 5vw;
	}
	.single-spectacle .recurrence p {
		font-size: 4.75vw;
	}
	.single-spectacle .dates-specifiques p {
		font-size: 4.25vw;
	}
}

/* Réserver */
.single-spectacle a.reserver {
	background-color:#dd1c1a!important;
	border-color:#dd1c1a!important;
	color:#FFFFFF!important;
	font-size: 19px;
}
.single-spectacle a.reserver:after {
	font-size: 21px;
}
.single-spectacle a.reserver:hover {
	background-color:#FFFFFF!important;
	color:#dd1c1a!important;
}

.single-spectacle .reservation-prochaine {
	text-align: center;
}
.single-spectacle .reservation-prochaine p {
	font-size: 18px;
	display: inline-block;
	border: 1px solid #000000;
	padding: 0.5em 1em!important;	
}
.single-spectacle .representations_restantes {
	font-weight: 700;
	font-size: 23px;
	text-align: center;
	margin-top: 40px!important;
	color: #dd1c1a!important;
	line-height: 1.6em;
}
/* Site Avignon */
.site-avignon .single-spectacle a.reserver {
	background-color:#336699!important;
	border-color:#336699!important;
}
.site-avignon .single-spectacle a.reserver:hover {
	color:#336699!important;
}
.site-avignon .single-spectacle .representations_restantes {
	color: #336699!important;
}

/* Infos 1 & 2 (colonne gauche) */
.single-spectacle .infos1 ul,
.single-spectacle .infos3 ul {
	list-style: none;
	padding:0;
}
.single-spectacle .infos1 ul li,
.single-spectacle .infos3 ul li {
	display:flex;
	padding: 15px 0;
	border-bottom:1px solid #dddddd;
}
/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {
	.single-spectacle .infos3 ul li {
		flex-direction:column;
	}
}
.single-spectacle .infos1 ul li .intitule {
	flex: 0 0 35%;
	color:#a19e9e;
}
.single-spectacle .infos1 ul li.rs a {
	color:#000000;
}
.single-spectacle .infos1 ul li.rs a:hover {
	color:#336699;
	color:#000000;
	text-decoration:underline;
}
.single-spectacle .infos1 ul li.rs .separateur-rs {
	visibility: hidden; /* car passé aux icônes en 09/25 */
	margin: 0 10px;
	color:#dddddd;
}
.single-spectacle .infos2 p.intitule {
	color:#a19e9e;
	padding-bottom: 0em;
}

/* Présentation (colonne droite) */
.single-spectacle .texte-court {
	font-weight:bold;
}

/* Sections avec titre */
.section-titre .row {
	width: 80%;
	max-width: 1080px;
	margin: 0 auto;
}
.section-titre.fond-blanc {
	background-color:#FFFFFF;
}
.section-titre.fond-gris {
	background-color:#F9F9F9;
}
.titre-section {
	font-size:24px;
	padding: 50px 0 40px
}

/* Bande annonce */
.section-photos .video-thumbnail {
	width:327px;
	cursor:pointer;
}

/* Photos (maxi 6) */
.section-photos .et_pb_column {
	min-height:0; /* corrige le min-height:1px par défaut de Divi, si section vide */
}
.single-spectacle .photos {
	padding: 60px 0 60px;
	display: grid;
/*	grid-template-columns: repeat(3, 1fr); WP n'accepte pas */
	/* gap 50px x 2 pour 3 colonnes */
	grid-template-columns: calc((100% - 100px) / 3) calc((100% - 100px) / 3) calc((100% - 100px) / 3);
	grid-template-rows: max-content;
	row-gap: 40px; /* Espace vertical */
	column-gap: 50px; /* Espace horizontal */
}

/*** Responsive Styles Tablet Only ***/
@media all and (min-width: 768px) and (max-width: 980px) {
	.single-spectacle .photos {
		grid-template-columns: calc((100% - 50px) / 2) calc((100% - 50px) / 2);
	}
}
/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {
	.single-spectacle .photos {
		grid-template-columns: 100%;
		row-gap: 40px; /* Espace vertical */
	}
}

/* Presse */
.article.fond-blanc {
	background-color:#FFFFFF!important;
}
.article.fond-gris {
	background-color:#F9F9F9!important;
}
.single-spectacle .presse {
	padding: 0 0 50px 0;
	display: grid;
/*	grid-template-columns: repeat(3, 1fr); WP n'accepte pas */
	/* gap 25px x 2 pour 3 colonnes */
	grid-template-columns: calc((100% - 50px) / 3) calc((100% - 50px) / 3) calc((100% - 50px) / 3);
	grid-template-rows: max-content;
	row-gap: 40px; /* Espace vertical */
	column-gap: 50px; /* Espace horizontal */
}
/*** Responsive Styles Tablet Only ***/
@media all and (min-width: 768px) and (max-width: 980px) {
	.single-spectacle .presse {
		grid-template-columns: calc((100% - 25px) / 2) calc((100% - 25px) / 2);
	}
}
/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {
	.single-spectacle .presse {
		grid-template-columns: 100%;
		row-gap: 40px; /* Espace vertical */
	}
}
.single-spectacle .journal {
	font-size: 20px;
	font-weight:bold;
}
.single-spectacle .article {
	background-color: #FFFFFF;
	padding: 30px;
}

/* Infos 3 - Production (colonne gauche) */
.single-spectacle .infos3 ul li .intitule {
	flex: 0 0 50%;
	color:#a19e9e;
}

/* Infos 4 - Partenaires (colonne droite) */
.single-spectacle .infos4 .intitule {
	color:#a19e9e;
	padding-top: 15px;
}