/**
 * [base] Agenda : liste en lignes + colonne de filtres, fiche d'un événement.
 */

/* --- Mise en page : filtres à gauche, liste à droite --- */
.m-agenda { display: grid; gap: 1.5rem 2.5rem; align-items: start; }
@media (min-width: 900px) {
	.m-agenda { grid-template-columns: 16.5rem minmax(0, 1fr); }
	.m-agenda__filtres { position: sticky; top: calc(var(--m-sticky-top, 0px) + 1.5rem); }
	.m-agenda__ouvrir { display: none !important; }
}

/* --- Filtres --- */
.m-agenda__details { border-radius: var(--rayon); background: var(--c-fond); border: 1px solid var(--c-bordure); }
.m-agenda__ouvrir {
	display: flex; align-items: center; justify-content: space-between; gap: 0.5rem;
	padding: 0.85rem 1.1rem; cursor: pointer; list-style: none;
	font-family: var(--f-titres); font-weight: 700; color: var(--c-primaire);
}
.m-agenda__ouvrir::-webkit-details-marker { display: none; }
.m-agenda__ouvrir::after { content: "▾"; margin-left: auto; transition: transform var(--transition); }
.m-agenda__details[open] .m-agenda__ouvrir::after { transform: rotate(180deg); }
.m-agenda__ouvrir:focus-visible { outline: var(--focus); outline-offset: var(--focus-offset); border-radius: var(--rayon); }
.m-agenda__nb-filtres[hidden], .m-agenda__reinit[hidden] { display: none !important; }
.m-agenda__nb-filtres { display: inline-grid; place-items: center; min-width: 1.4rem; height: 1.4rem; border-radius: 999px; background: var(--c-secondaire); color: #fff; font-size: 0.75rem; }
.m-agenda__panneau { display: grid; gap: 1.25rem; padding: 1.1rem; }
@media (max-width: 899px) { .m-agenda__panneau { padding-top: 0; } }
.m-agenda__groupe { margin: 0; padding: 0; border: 0; display: flex; flex-wrap: wrap; gap: 0.4rem; }
.m-agenda__groupe legend { width: 100%; margin-bottom: 0.5rem; font-size: var(--t-xs); font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--c-texte-doux); }

.m-puce { position: relative; display: inline-flex; margin: 0; cursor: pointer; }
.m-puce input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.m-puce span {
	display: inline-flex; align-items: center; min-height: 2.25rem; padding: 0.3rem 0.85rem;
	border: 1px solid var(--c-bordure); border-radius: var(--rayon-pilule); background: var(--c-fond);
	font-size: var(--t-s); line-height: 1.2; color: var(--c-texte);
	transition: background-color var(--transition), border-color var(--transition), color var(--transition);
}
.m-puce:hover span { border-color: var(--c-primaire); color: var(--c-primaire); }
.m-puce input:checked + span { background: var(--c-primaire); border-color: var(--c-primaire); color: #fff; }
.m-puce input:focus-visible + span { outline: var(--focus); outline-offset: var(--focus-offset); }
.m-agenda__reinit { justify-self: start; padding: 0; border: 0; background: none; color: var(--c-secondaire); font: inherit; font-size: var(--t-s); font-weight: 600; text-decoration: underline; cursor: pointer; }
.m-agenda__autre { margin: 0.75rem 0 0; font-size: var(--t-s); }
.m-agenda__autre a { font-weight: 600; }

/* --- Liste --- */
.m-agenda__statut { margin: 0 0 0.5rem; font-size: var(--t-s); color: var(--c-texte-doux); }
.m-agenda__vide { padding: 2rem 0; color: var(--c-texte-doux); }
.m-agenda__mois + .m-agenda__mois { margin-top: 2rem; }
.m-agenda__titre-mois {
	position: sticky; top: var(--m-sticky-top, 0px); z-index: 2;
	margin: 0 0 0.5rem !important; padding: 0.6rem 0; background: var(--c-fond-page);
	font-size: var(--t-l) !important; border-bottom: 2px solid var(--c-primaire);
}
.m-agenda__evenements { list-style: none; margin: 0; padding: 0; }

.m-ev {
	position: relative;
	display: grid; grid-template-columns: 4.25rem 10.5rem minmax(0, 1fr); gap: 1.1rem; align-items: start; /* affiche plus grande : réglage de Sébastien */
	margin: 0; padding: 1.1rem 0.75rem; border-bottom: 1px solid var(--c-bordure);
	transition: background-color var(--transition);
}
.m-ev:hover { background: var(--c-fond); }
.m-ev[hidden] { display: none; }

.m-ev__date {
	display: grid; justify-items: center; padding: 0.5rem 0.25rem; border-radius: var(--rayon-s);
	background: var(--c-primaire); color: #fff; line-height: 1.05; text-align: center;
}
.m-ev__jsem, .m-ev__m { font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.m-ev__j { font-family: var(--f-titres); font-size: 1.75rem; font-weight: 800; }
.m-ev__au { margin-top: 0.35rem; padding-top: 0.3rem; border-top: 1px solid rgb(255 255 255 / 0.35); font-size: 0.6875rem; font-weight: 600; }

/* Affiche A4 verticale : même proportion, rien n'est coupé d'important */
.m-ev__affiche { display: block; aspect-ratio: 210 / 297; min-height: 230px; border-radius: 6px; overflow: hidden; background: var(--c-fond-alt); box-shadow: var(--ombre); }
.m-ev__affiche img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 400ms ease; }
.m-ev:hover .m-ev__affiche img { transform: scale(1.04); }
.m-ev__sans-affiche { display: grid; place-items: center; width: 100%; height: 100%; font-size: 1.75rem; }

.m-ev__corps > * { margin: 0 0 0.35rem; }
.m-ev__cats { display: flex; flex-wrap: wrap; gap: 0.3rem; }
.m-ev__cat { padding: 0.1rem 0.55rem; border-radius: var(--rayon-pilule); background: var(--c-primaire-clair); color: var(--c-primaire); font-size: var(--t-xs); font-weight: 700; }
.m-ev__titre { font-size: var(--t-l) !important; line-height: 1.25; }
.m-ev__titre a { color: var(--c-titres); text-decoration: none; }
.m-ev__titre a::after { content: ""; position: absolute; inset: 0; } /* ligne entière cliquable */
.m-ev__titre a:hover { text-decoration: underline; }
.m-ev__titre a:focus-visible { outline: none; }
.m-ev:has(.m-ev__titre a:focus-visible) { outline: var(--focus); outline-offset: -3px; border-radius: var(--rayon-s); }
.m-ev__infos { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 1rem; font-size: var(--t-s); color: var(--c-texte); }
.m-ev__info::before { margin-right: 0.3rem; }
.m-ev__info--heure::before, .m-ev__info--quand::before { content: "🕗"; }
.m-ev__info--lieu::before { content: "📍"; }
.m-ev__tarif { padding: 0.05rem 0.55rem; border-radius: var(--rayon-s); font-size: var(--t-xs); font-weight: 700; }
.m-ev__tarif--gratuit { background: var(--c-tertiaire-clair); color: var(--c-tertiaire); }
.m-ev__tarif--payant { background: var(--c-fond-alt); color: var(--c-texte); }
.m-ev__desc { font-size: var(--t-s); color: var(--c-texte-doux); }
.m-ev__publics { font-size: var(--t-xs); color: var(--c-texte-doux); }

@media (min-width: 601px) and (max-width: 899px) {
	.m-ev { grid-template-columns: 4.25rem 8rem minmax(0, 1fr); }
	.m-ev__affiche { min-height: 0; }
}
@media (max-width: 600px) {
	.m-ev { grid-template-columns: 3.5rem minmax(0, 1fr) 4.25rem; gap: 0.75rem; padding-inline: 0.25rem; }
	.m-ev__affiche { grid-column: 3; grid-row: 1; min-height: 0; }
	.m-ev__corps { grid-column: 2; grid-row: 1; }
	.m-ev__j { font-size: 1.4rem; }
	.m-ev__desc { display: none; }
}

/* --- Agenda compact de l'accueil : titres cliquables --- */
.m-agenda-compact a { color: inherit; text-decoration: none; }
.m-agenda-compact a:hover { color: var(--c-primaire); text-decoration: underline; }

/* --- Fiche d'un événement --- */
.m-evenement { display: grid; gap: 2rem; padding-block: 1rem 2.5rem; }
@media (min-width: 900px) { .m-evenement { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); align-items: start; } }
.m-evenement__affiche { display: block; border-radius: var(--rayon); overflow: hidden; background: var(--c-fond-alt); box-shadow: var(--ombre-forte); }
.m-evenement__affiche img { display: block; width: 100%; height: auto; }
.m-evenement__agrandir { display: inline-block; margin-top: 0.5rem; font-size: var(--t-s); }
.m-evenement__dl { display: grid; gap: 1rem; margin: 0 0 1.5rem; }
.m-evenement__dl div { display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: 0.25rem 0.75rem; }
.m-evenement__dl dt { grid-row: span 2; font-size: 1.4rem; line-height: 1.2; }
.m-evenement__dl dd { margin: 0; }
.m-evenement__dl .m-evenement__lib { font-size: var(--t-xs); font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--c-texte-doux); }
.m-evenement__dl .m-evenement__val { font-weight: 600; font-size: var(--t-m); }
.m-evenement__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 1.5rem; }
.m-evenement__actions .m-lien-action--plein { background: var(--c-primaire); color: #fff; }
.m-evenement__actions .m-lien-action--plein:hover { background: var(--c-primaire-f); border-color: var(--c-primaire-f); }
.m-evenement__texte { max-width: var(--largeur-texte); }
.m-acte__retour { padding-bottom: 2rem; }

.m-agenda__proposer { margin: 1rem 0 0; }