/**
 * CampusDelia — Page d'accueil (Elementor, thème tutorstarter).
 * Corrige : largeur de conteneur trop étroite (marges latérales excessives),
 * flash gris du hero avant le chargement de l'image, widget « Événements »
 * de The Events Calendar au rendu brut. + responsivité PWA.
 */

:root {
	--home-primary: #4f46e5;
	--home-primary-dark: #3730a3;
	--home-laterite: #b3410f;
	--home-ocre: #e0921f;
	--home-ink: #1e1b4b;
	--home-text: #3f3f52;
	--home-muted: #6b7280;
	--home-border: #e7e7ef;
}

/* ============================================================
 * 1. LARGEUR — moins de vide à gauche/droite
 * Les conteneurs « boxed » Elementor étaient limités à 1240px : sur grand
 * écran, marges énormes. On élargit à 1320px et on resserre le padding mobile.
 * ============================================================ */

.home .elementor-3707 .e-con-boxed {
	--container-max-width: 1320px;
}

.home .elementor-3707 .e-con-boxed > .e-con-inner {
	max-width: 1320px;
}

@media (max-width: 1024px) {
	.home .elementor-3707 .e-con {
		--padding-inline-start: 24px;
		--padding-inline-end: 24px;
	}
}

@media (max-width: 600px) {
	.home .elementor-3707 .e-con {
		--padding-inline-start: 16px;
		--padding-inline-end: 16px;
	}
}

/* ============================================================
 * 2. HERO — l'image de fond est gérée directement dans Elementor.
 * (Ancien override WebP retiré : il pointait vers un chemin XAMPP
 * local inexistant en production et masquait l'image Elementor.)
 * ============================================================ */

/* ============================================================
 * 3. WIDGET « ÉVÉNEMENTS » (TEC) — cartes propres façon billet
 * Cible le widget Elementor tec_elementor_widget_events_list_widget.
 * ============================================================ */

.elementor-widget-tec_elementor_widget_events_list_widget .tribe-events-widget-events-list {
	--we-primary: #4f46e5;
	--we-laterite: #b3410f;
	font-family: "Public Sans", -apple-system, "Segoe UI", sans-serif;
}

/* Neutralise le système de grille interne de TEC (tribe-common-g-row/col)
   qui ajoute des marges/paddings négatifs cassant la mise en page. */
.tribe-events-widget-events-list__events .tribe-common-g-row,
.tribe-events-widget-events-list__events .tribe-common-g-col {
	margin: 0 !important;
	padding: 0 !important;
	max-width: none !important;
	flex: initial;
}

/* Grille responsive : chaque « row » est une carte. */
.tribe-events-widget-events-list__events {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 20px;
	list-style: none;
	margin: 0;
	padding: 0;
}

/* LA CARTE = la ligne d'événement (talon de date + contenu). */
.tribe-events-widget-events-list__event-row {
	position: relative;
	display: flex !important;
	align-items: stretch;
	gap: 0;
	background: #fff;
	border: 1px solid var(--home-border);
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(30, 27, 75, 0.05), 0 6px 18px rgba(30, 27, 75, 0.06);
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.tribe-events-widget-events-list__event-row:hover {
	transform: translateY(-4px);
	border-color: #c7d2fe;
	box-shadow: 0 6px 14px rgba(30, 27, 75, 0.07), 0 20px 40px rgba(79, 70, 229, 0.14);
}

/* Liseré indigo en haut de carte. */
.tribe-events-widget-events-list__event-row::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: linear-gradient(90deg, var(--we-primary), #a5b4fc);
	z-index: 2;
}

/* Talon de date : bloc coloré à gauche. */
.tribe-events-widget-events-list__event-date-tag {
	flex: 0 0 84px !important;
	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2px;
	background: linear-gradient(160deg, #eef2ff, #e0e7ff);
	border-right: 1px solid var(--home-border);
	padding: 18px 8px !important;
}

/* Le wrapper contient l'article : occupe le reste, sans marge parasite. */
.tribe-events-widget-events-list__event-wrapper {
	flex: 1 1 auto !important;
	min-width: 0;
	display: flex;
}

.tribe-events-widget-events-list__event {
	flex: 1;
	min-width: 0;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	background: transparent !important;
	box-shadow: none !important;
}

/* Le <time> enveloppe le mois et le jour : on les empile. */
.tribe-events-widget-events-list__event-date-tag-datetime {
	display: flex !important;
	flex-direction: column;
	align-items: center;
	gap: 2px;
}

.tribe-events-widget-events-list__event-date-tag-month {
	font-size: 0.72rem !important;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--we-primary) !important;
}

.tribe-events-widget-events-list__event-date-tag-daynum {
	font-family: "Libre Bodoni", Georgia, serif !important;
	font-size: 1.9rem !important;
	font-weight: 700;
	line-height: 1 !important;
	color: var(--home-ink) !important;
}

/* Détails. */
.tribe-events-widget-events-list__event-details {
	flex: 1;
	min-width: 0;
	padding: 16px 18px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.tribe-events-widget-events-list__event-datetime {
	font-size: 0.74rem !important;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--we-primary) !important;
	margin: 0 !important;
}

.tribe-events-widget-events-list__event-title {
	margin: 0 !important;
	font-size: 1.08rem !important;
	line-height: 1.3 !important;
}

.tribe-events-widget-events-list__event-title-link {
	font-family: "Libre Bodoni", Georgia, serif;
	color: var(--home-ink) !important;
	text-decoration: none !important;
	font-weight: 700;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.tribe-events-widget-events-list__event-title-link:hover {
	color: var(--we-primary) !important;
}

.tribe-events-widget-events-list__event-venue,
.tribe-events-widget-events-list__event-venue-address {
	font-size: 0.85rem !important;
	color: var(--home-muted) !important;
	font-style: normal !important;
	line-height: 1.4;
}

.tribe-events-widget-events-list__event-cost-price {
	align-self: flex-start;
	margin-top: 4px;
	background: #eef2ff;
	color: var(--we-primary) !important;
	border: 1px solid #c7d2fe;
	border-radius: 999px;
	padding: 3px 12px;
	font-size: 0.78rem !important;
	font-weight: 700;
}

/* « Voir tous les événements ». */
.tribe-events-widget-events-list__view-more {
	grid-column: 1 / -1;
	text-align: center;
	margin-top: 8px;
}

.tribe-events-widget-events-list__view-more-link {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 12px 30px;
	border-radius: 999px;
	background: linear-gradient(135deg, var(--home-primary), var(--home-primary-dark));
	color: #fff !important;
	font-weight: 700;
	text-decoration: none !important;
	box-shadow: 0 8px 20px rgba(79, 70, 229, 0.35);
	transition: transform 0.15s ease, box-shadow 0.2s ease;
}

.tribe-events-widget-events-list__view-more-link:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 26px rgba(79, 70, 229, 0.45);
}

/* Masque le numéro de téléphone brut du lieu et l'icône « mis en avant ». */
.tribe-events-widget-events-list__event-venue-phone,
.tribe-events-widget-events-list__event-datetime-featured-icon {
	display: none !important;
}

/* Masque le titre TEC brut « Événements à venir » du widget s'il fait doublon. */
.elementor-widget-tec_elementor_widget_events_list_widget .tribe-events-header,
.elementor-widget-tec_elementor_widget_events_list_widget .tribe-events-c-top-bar {
	display: none;
}

/* ============================================================
 * 4. RESPONSIVITÉ / PWA
 * ============================================================ */

@media (max-width: 768px) {
	.tribe-events-widget-events-list__events {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	.tribe-events-widget-events-list__event,
	.tribe-events-widget-events-list__view-more-link {
		transition: none;
	}
	.tribe-events-widget-events-list__event:hover {
		transform: none;
	}
}