/* ============================================================
   1. STRUCTURE ET MENU DU HAUT
   ============================================================ */
html, body { background-color: #000000 !important; }
body { padding-top: 130px !important; padding-bottom: 100px !important; }

#site-navigation, .main-navigation {
    position: fixed !important; top: 0 !important; left: 0 !important;
    width: 100% !important; background-color: #000000 !important;
    z-index: 9999999 !important; border-bottom: 2px solid #e60000 !important;
}
.main-navigation ul { display: flex !important; justify-content: center !important; margin: 0 auto !important; padding: 15px 0 !important; }

/* ============================================================
   2. RECHERCHE : RÉDUCTION DRASTIQUE ET VISIBILITÉ TOTALE
   ============================================================ */
/* On réduit la barre à 500px pour qu'elle soit compacte */
.mec-search-form { 
    max-width: 500px !important; 
    margin: 20px auto !important; 
    background: #111 !important; 
    padding: 15px !important;
    border: 1px solid #444 !important;
    border-radius: 10px;
}

/* ON FORCE L'AFFICHAGE DES MOTS (Catégorie, Mois, Année) */
/* On supprime toute transparence et on force le blanc */
.mec-search-form label, 
.mec-search-form span, 
.mec-events-search-term,
.mec-dropdown-search .mec-events-search-term,
.mec-search-form .mec-text-input-search {
    color: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    font-weight: bold !important;
    text-shadow: none !important;
}

/* ============================================================
   3. CALENDRIER : FORCE L'ORANGE ET LE VERT (ANTI-BLEU)
   ============================================================ */
/* On cible le lien interne, c'est le seul moyen de battre le bleu de MEC */

/* REUNION -> Orange */
.mec-event-title a[href*="reunion"], 
.mec-event-title a[href*="Reunion"],
.mec-event-title a:contains("REUNION"),
.mec-event-title a:contains("Réunion") { 
    background-color: #ff9800 !important;
    background: #ff9800 !important;
    display: block !important;
    padding: 3px !important;
    border-radius: 4px !important;
}

/* PROJECTION -> Vert */
.mec-event-title a[href*="projection"], 
.mec-event-title a[href*="Projection"],
.mec-event-title a:contains("PROJECTION"),
.mec-event-title a:contains("Projection") { 
    background-color: #4caf50 !important;
    background: #4caf50 !important;
    display: block !important;
    padding: 3px !important;
    border-radius: 4px !important;
}

/* On force tous les titres à être opaques (pas de transparence) */
.mec-event-title, .mec-event-title a {
    opacity: 1 !important;
    visibility: visible !important;
}

/* ============================================================
   4. POPUP : MINIATURE 150px ET FOND BLANC
   ============================================================ */
.mec-modal-result, .mec-modal-inner-single { background-color: #ffffff !important; }
.mec-modal-result h3, .mec-modal-result div { color: #000000 !important; }

.mec-events-event-image img {
    width: 150px !important; 
    max-width: 150px !important;
    height: auto !important; 
    margin: 0 auto 10px auto !important; 
    display: block !important;
}

/* Suppression horaires internationaux */
.mec-event-timezone, .mec-modal-result .mec-single-event-date span { display: none !important; }

/* ============================================================
   5. NETTOYAGE DU JOUR "AUJOURD'HUI"
   ============================================================ */
.mec-calendar-day.mec-today .mec-date, .mec-today:after {
    background: transparent !important;
    border: 1px solid #666 !important;
    color: #fff !important;
}















































.galerie-flip figure {
	position: relative;
	perspective: 1000px;
}

.galerie-flip figure img {
	width: 100%;
	display: block;
	transition: transform .8s ease;
	backface-visibility: hidden;
}

.galerie-flip figure::after {
	content: "CINÉMA";
/* remplace par le mot que tu veux */
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem;
	background: black;
/* couleur du dos */
	color: white;
	transform: rotateY(180deg);
	backface-visibility: hidden;
	transition: transform .8s ease;
}

.galerie-flip figure:hover img {
	transform: rotateY(180deg);
}

.galerie-flip figure:hover::after {
	transform: rotateY(0deg);
}

.page-id-10320 #primary {
	width: 100%;
}

.page-id-13019 #secondary {
	display: none;
}

.page-id-13019 #primary {
	width: 100%;
}

.page-id-12500 #secondary {
	display: none;
}

.page-id-12500 #primary {
	width: 100%;
}

.page-id-12867 #secondary {
	display: none;
}

.page-id-12878 #secondary {
	display: none;
}

.page-id-12878 #primary {
	width: 100%;
}

.page-id-13002 #secondary {
	display: none;
}

.page-id-13002 #primary {
	width: 100%;
}

.mes-4-flips {
	display: flex;
	justify-content: center;
	gap: 20px;
	flex-wrap: wrap;
}

.carte-flip {
	width: 450px;
	height: 450px;
	perspective: 1000px;
}

.interieur-flip {
	width: 100%;
	height: 100%;
	position: relative;
	transition: transform .8s;
	transform-style: preserve-3d;
}

.carte-flip:hover .interieur-flip {
	transform: rotateY(180deg);
}