/*
 Theme Name: Divi-Child-theme-Ladies-Night
 Theme URI: 
 Description: Divi Child Theme
 Author: Olivier Rochefort
 Author URI: 
 Template: Divi
 Version: 1.0.1
*/

/* =Theme customization starts here
------------------------------------------------------- */
:root {
	/* Tu définis le nom (commence par --) et la couleur */
	--pk-color-primary: #c62f56; /* Rose/Rouge */
	--pk-color-black: #000000; /* Noir */
	--pk-color-white: #ffffff; /* Blanc */
	--pk-font-rift: "rift", sans-serif;
}
/* --- 1. DÉFINITION DES VARIABLES (LOCALES) --- */
.pk-h1,
.pk-h1-big,
.pk-h2,
.pk-h2-big,
.pk-h2-small,
.pk-h2,
.pk-h3,
.pk-h4,
.pk-h5,
.pk-h6 {
	--pk-font-center: center !important;
}
/* Changer la couleur de fond et de l'icône */
.et_pb_scroll_top.et-pb-icon {
	width: 50px !important;
	background: #eddd53 !important; /* Couleur de fond (exemple: orange) */
	color: #000000 !important; /* Couleur de la flèche (exemple: blanc) */
	border-radius: 5px 0px 0px 5px; /* Optionnel: pour arrondir les coins */
}

/* Changer la couleur au survol de la souris */
.et_pb_scroll_top.et-pb-icon:hover {
	background: #8b602a !important; /* Fond au survol */
	color: #000000 !important; /* Flèche au survol */
}
/* --- 2. STYLES DES TITRES --- */

/* H1 */
.pk-h1 h1 {
	color: var(--pk-color-primary) !important;
	font-family: var(--pk-font-rift) !important;
	font-size: clamp(1.5rem, 5vw, 3rem) !important;
	line-height: 1.2 !important;
	font-weight: 700 !important;
	font-style: normal !important;
	margin-bottom: 0.6em !important;
}

.pk-h1-big h1 {
	color: var(--pk-color-white) !important;
	font-family: var(--pk-font-rift) !important;
	font-size: clamp(1.5rem, 5vw, 4rem) !important;
	line-height: 1.2 !important;
	font-weight: 700 !important;
	font-style: normal !important;
}
.pk-h2-big h2 {
	color: var(--pk-color-white) !important;
	font-family: var(--pk-font-rift) !important;
	font-size: clamp(1.8rem, 5vw, 4rem) !important;
	line-height: 1.2 !important;
	font-weight: 700 !important;
	font-style: normal !important;
}
/* H2*/
.pk-h2 h2 {
	color: var(--pk-color-white) !important;
	font-family: var(--pk-font-rift) !important;
	font-size: clamp(1.35rem, 4vw, 1.75rem) !important;
	line-height: 1.25 !important;
	font-weight: 700 !important;
	font-style: normal !important;
	margin-bottom: 0.55em !important;
}
.pk-h2-small h2 {
	color: var(--pk-color-white) !important;
	font-family: var(--pk-font-rift) !important;
	font-size: clamp(1rem, 5vw, 1.75rem) !important;
	line-height: 1.2 !important;
	font-weight: 700 !important;
	font-style: normal !important;
}

.pk-h2-small h2.dmach-acf-value {
	color: var(--pk-color-white) !important;
	font-family: var(--pk-font-rift) !important;
	font-size: clamp(1rem, 5vw, 1.75rem) !important;
	line-height: 1.2 !important;
	font-weight: 700 !important;
	font-style: normal !important;
}
/* H3 - Utilise le Noir (#000000) */
.pk-h3 h3 {
	font-size: clamp(1.2rem, 3vw, 1.5rem) !important;
	font-family: var(--pk-font-rift) !important;
	line-height: 1.3 !important;
	font-weight: 700 !important;
	font-style: normal !important;
	margin-bottom: 0.5em !important;
}

/* H4 - Utilise le Noir (#000000) */
.pk-h4 h4 {
	color: var(--pk-color-black) !important;
	font-size: clamp(1.1rem, 2.5vw, 1.3rem) !important;
	line-height: 1.35 !important;
	font-weight: 700 !important;
	font-style: normal !important;
	margin-bottom: 0.5em !important;
}

/* H5 - Utilise le Noir (#000000) */
.pk-h5 h5 {
	color: var(--pk-color-black) !important;
	font-size: clamp(1rem, 2vw, 1.15rem) !important;
	line-height: 1.4 !important;
	font-weight: 700 !important;
	font-style: normal !important;
	margin-bottom: 0.5em !important;
}

/* H6 - Utilise le Noir (#000000) */
.pk-h6 h6 {
	color: var(--pk-color-black) !important;
	font-size: clamp(0.9rem, 1.5vw, 1rem) !important;
	line-height: 1.5 !important;
	font-weight: 700 !important;
	font-style: normal !important;
	margin-bottom: 0.5em !important;
}

/* drolement sexy h1 */
.et_pb_fullwidth_header_0 h1 {
	/* Propriétés de la transformation (Rotation) */
	font-family: var(--pk-font-rift) !important;
	transform: rotate(-2deg);
	display: inline-block !important;
	font-size: clamp(1.5rem, 5vw, 4rem) !important;
	line-height: 1.2 !important;
	font-weight: 700 !important;
	font-style: normal !important;

	/* CORRECTION ICI */
	background: linear-gradient(
		180deg,
		rgb(237, 221, 83) 0%,
		/* Départ (Bronze) */ rgb(139, 96, 42) 100% /* Fin (Jaune) */
	) !important;

	/* Propriétés pour le texte dégradé */
	background-clip: text !important;
	-webkit-background-clip: text !important;

	/* On force la transparence du texte */
	text-fill-color: transparent !important; /* Standard futur */
	-webkit-text-fill-color: transparent !important; /* Indispensable pour Chrome/Safari */
	color: transparent !important; /* Fallback de sécurité */
}

.et_pb_module.et_pb_text.h3-distribution-florida .et_pb_text_inner h3 {
	font-size: clamp(1.5rem, 5vw, 2rem) !important;
	line-height: 1.2 !important;
	font-family: "rift", sans-serif !important;
	font-weight: 700 !important;
	font-style: normal !important;
	color: #ffd501 !important;
}

/* end drolement sexy h1 */

/* Menu */
.et_pb_column.col-hero-ld {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding-bottom: 20px !important;
}

/* --- Row Menu General --- */
.row-menu-ld {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background-color: transparent !important;
	padding: 20px 20px !important;
	transition: all 0.4s ease-in-out !important;
	z-index: 99999 !important;
}

/* --- Logo --- */
.logo-ld {
	width: 300px !important;
	transition: width 0.3s ease-in-out !important;
}

/* Logo réduit au scroll */
.logo-ld.logo-small,
.logo-ld.logo-small .et_pb_image_wrap img {
	width: 120px !important;
	max-width: 120px !important;
}

/* Classe helper pour forcer l'alignement à gauche */
.et_pb_image_sticky_left {
	text-align: left !important;
}

.et_pb_image_sticky_left .et_pb_image_wrap {
	justify-content: flex-start !important;
}

/* ========================================================= */
/* EFFET DE SCROLL - DESKTOP UNIQUEMENT (Min 981px)         */
/* ========================================================= */
@media only screen and (min-width: 981px) {
	/* État Scrollé (Ligne, Noir semi-transparent, Petit padding) */
	.row-menu-ld.header-ld-black {
		display: flex;
		flex-direction: row !important; /* Passe en ligne */
		gap: 20px;
		border-radius: 0px !important;
		border-top: 2px solid #e61769 !important ;
		border-bottom: 2px solid #e61769 !important ;
		width: 100% !important;
		background-color: #000000 !important;
		padding: 15px 20px !important;
		box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
	}

	/* Colonne 1 (Logo) -> Alignement GAUCHE */
	.row-menu-ld.header-ld-black .col-menu-ld:first-child {
		display: flex !important;
		justify-content: flex-start !important;
		align-items: center !important;
		width: 15% !important;
		max-width: 15% !important;
	}

	/* Force l'alignement à gauche du module image */
	.row-menu-ld.header-ld-black .col-menu-ld:first-child .logo-ld {
		margin-left: 0 !important;
		margin-right: auto !important;
	}

	/* Force l'alignement à gauche du wrapper de l'image */
	.row-menu-ld.header-ld-black
		.col-menu-ld:first-child
		.logo-ld
		.et_pb_image_wrap {
		display: inline-block !important;
		margin-left: 0 !important;
		margin-right: auto !important;
		text-align: left !important;
	}

	/* Colonne 2 (Milieu) -> Centrée */
	.row-menu-ld.header-ld-black .col-menu-ld:nth-child(2) {
		display: flex;
		justify-content: center !important;
		align-items: center !important;
		width: 70% !important;
	}

	/* Colonne 3 (Bouton) -> Alignement DROITE */
	.row-menu-ld.header-ld-black .col-menu-ld:last-child {
		display: flex !important;
		justify-content: flex-end !important;
		align-items: center !important;
		width: 15% !important;
		max-width: 15% !important;
	}
}
/* ================== fin menu et scroll desktop ===================== */
/* ======================================= */
/* TABLETTE ET MOBILE (<= 980px) */
/* ======================================= */
@media only screen and (max-width: 980px) {
	/* DÉSACTIVATION COMPLÈTE DES EFFETS DE SCROLL SUR MOBILE */

	/* Force tous les éléments à être visibles et interactifs */
	.menu-ld,
	.bouton-billetterie {
		opacity: 1 !important;
		pointer-events: auto !important;
	}

	/* Empêche l'application des classes de scroll sur mobile */
	.menu-small,
	.billetterie-small,
	.logo-small {
		opacity: 1 !important;
		pointer-events: auto !important;
		font-size: inherit !important;
		width: auto !important;
	}

	/* On garde uniquement la couleur de fond du menu mobile pour la lisibilité */
	.menu-bouton .et_mobile_menu {
		z-index: 99999 !important;
		background-color: #000000 !important;
	}

	/* Conteneur principal mobile : On s'assure qu'il ne prend pas le style Flex Desktop */
	.row-menu-ld {
		display: block !important; /* Retour au bloc standard pour laisser Divi gérer */
		padding: 10px 10px !important;
		background-color: transparent !important; /* Pas de fond noir */
	}

	/* Bouton BILLETTERIE mobile - Centré en bas */
	.bouton-billetterie {
		width: 95% !important;
		margin: 10px auto !important;
		display: block !important;
		opacity: 1 !important; /* Force visible */
		pointer-events: auto !important;
	}

	.bouton-billetterie .et_pb_button {
		padding: 12px 0px !important;
		font-size: 16px !important;
		text-align: center !important;
		display: block !important;
		width: 100% !important;
	}

	/* Style des liens du menu mobile */
	.menu-bouton #mobile_menu li a {
		border-bottom: 1px solid rgba(255, 255, 255, 0.1);
		text-transform: uppercase !important;
		padding: 15px 20px !important;
		color: #ffffff !important;
	}

	/* Couleur du hamburger */
	.mobile_menu_bar:before {
		color: #ffffff !important;
	}
}
/* ================== menu Mobile ===================== */
/* --- Menu (Ajout de pointer-events) --- */
.menu-ld {
	opacity: 0;
	/* Empêche de cliquer sur le menu quand il est invisible */
	pointer-events: none;
	transition: opacity 0.3s ease-in-out !important;
}

.menu-small {
	opacity: 1;
	/* Rétablit les clics quand il est visible */
	pointer-events: auto;
}

/* --- Bouton Billetterie (Correction de transition et ajout de pointer-events) --- */
.bouton-billetterie {
	opacity: 0;
	font-size: 1.2rem !important;
	/* Empêche de cliquer sur le bouton quand il est invisible */
	pointer-events: none;
	/* COMBINAISON des transitions pour que les deux soient appliquées */
	transition: font-size 0.3s ease-in-out, opacity 0.3s ease-in-out !important;
}

.billetterie-small {
	opacity: 1;
	font-size: 1rem !important;
	text-align: right !important;
	/* Rétablit les clics quand il est visible */
	pointer-events: auto;
}

/* Effet au survol du bouton.billetterie-small */
.billetterie-small.et_pb_button:hover {
	background-color: #ffffff !important;
	color: #ffffff !important;
	border: 2px solid #000000 !important;
}

/* ======================================= */
/* ÉCRANS MOYENS (981px à 1315px) */
/* ======================================= */
@media only screen and (min-width: 981px) and (max-width: 1315px) {
	/* Compaction maximale des liens */
	.menu-bouton .et_pb_menu__menu > nav > ul > li > a {
		padding: 4px 8px !important;
		margin-right: 4px !important;
		font-size: clamp(11px, 1.3vw, 13px) !important;
	}

	/* Compacter le bouton BILLETTERIE */
	.bouton-billetterie .et_pb_button {
		padding: 6px 12px !important;
		font-size: 13px !important;
	}
}

/* ======================================= */
/* TABLETTE ET MOBILE (<= 980px) */
/* ======================================= */
@media only screen and (max-width: 980px) {
	/* On garde uniquement la couleur de fond du menu mobile pour la lisibilité */
	.menu-bouton .et_mobile_menu {
		z-index: 99999 !important;
		background-color: #000000 !important;
	}

	/* Conteneur principal mobile : On s'assure qu'il ne prend pas le style Flex Desktop */
	.row-menu-ld {
		display: block !important; /* Retour au bloc standard pour laisser Divi gérer */
		padding: 10px 10px !important;
		background-color: transparent !important; /* Pas de fond noir */
	}

	/* Bouton BILLETTERIE mobile - Centré en bas */
	.bouton-billetterie {
		width: 95% !important;
		margin: 10px auto !important;
		display: block !important;
		/* Sur mobile, on veut qu'il soit toujours interactif si Divi le montre */
		pointer-events: auto !important;
	}

	/* Correction: Le JS n'ajoute plus billetterie-small sur mobile.
       On s'assure qu'il est visible si le JS était appliqué par erreur. */
	.billetterie-small {
		opacity: 1 !important;
		pointer-events: auto !important;
		text-align: center !important;
	}

	.bouton-billetterie .et_pb_button {
		padding: 12px 0px !important;
		font-size: 16px !important;
		text-align: center !important;
		display: block !important;
		width: 100% !important;
	}

	/* Style des liens du menu mobile */
	.menu-bouton #mobile_menu li a {
		text-transform: uppercase !important;
		text-align: center !important;
		padding: 15px 20px !important;
		color: #ffffff !important;
	}
	.et_pb_menu .et_mobile_menu {
		text-align: center !important;
	}
	/* Couleur du hamburger */
	.mobile_menu_bar:before {
		color: #ffffff !important;
	}
}

/* ======================================= */
/* MOBILE PAYSAGE (Landscape) */
/* ======================================= */
@media only screen and (max-height: 550px) and (orientation: landscape) {
	#hero-ldhero-ld {
		height: 900px !important;
		min-height: 100vh !important;
		padding-top: 50px !important;
		padding-bottom: 50px !important;
	}

	.section-hero-fix .et_pb_row {
		height: auto !important;
		min-height: 0 !important;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}
}
/* ================== fin menu Mobile ===================== */
/* ======================================= */
/* ÉQUIPE DE PRODUCTION */
/* ======================================= */
#equipe .et_pb_column.equipe-production-name .et_pb_module:last-child {
	padding-bottom: 0 !important;
	margin-bottom: 0 !important;
}

/*.et_pb_column.equipe-production-name div {
	display: flex;
	flex-direction: column;
	align-items: center;
} */

/* ======================================= */
/* FILTRES ET TAXONOMIES */
/* ======================================= */
.tx-ville.dmach-postmeta-value span {
	text-align: center !important;
}

.divi-engine-grid-list-view-switcher {
	display: none !important;
}

/* Paramètres de filtre */
#ma_liste_spectacles.et_pb_module_inner.filter-param-tags .param-ville {
	background-color: #ff0000 !important;
}

/* ======================================= */
/* STATUTS DE SPECTACLES */
/* ======================================= */
/* == Styles pour les modules de statut == */

/* Le module lui-même change */
.et_pb_de_mach_acf_item.statut-select-activator .en_vente {
	display: none !important;
}

.et_pb_de_mach_acf_item.statut-select-activator .prevente {
	border-top: 0.5px solid #ffffff !important;
	border-bottom: 0.5px solid #ffffff !important;
	padding: 1rem 0.6rem !important;
	background: #ffffff !important;
}

.et_pb_de_mach_acf_item.statut-select-activator .a_venir {
	font-size: 1.5rem !important;
	color: #e61769 !important;
	letter-spacing: 0px !important;
	font-family: "Poppins", Helvetica, Arial, Lucida, sans-serif !important;
	padding: 0.6rem 3rem !important;
}

.et_pb_de_mach_acf_item.statut-select-activator .annule {
	border-top: 0.5px solid #494949 !important;
	border-bottom: 0.5px solid #494949 !important;
	padding: 1rem 0.6rem !important;
	background: #f9a5a5 !important;
}
/* ======================================= */
/* FIX POUR LE VISUAL BUILDER DIVI */
/* ======================================= */
.et-fb #hero-ld {
	min-height: auto !important;
}