/**
 * mod_mjc_agenda — charte MJC de Gex (Lato, #1A6966, fond #F8F6F4)
 * Tout est scopé sous .mjca pour ne rien toucher au reste du site.
 * (C) 2026 Toobeweb — GPL-2.0-or-later
 */
.mjca {
	--mjca-accent: #1A6966;
	--mjca-ink: #1D1C1C;
	--mjca-ink-2: #3D3A36;
	--mjca-muted: #5C5A60;
	--mjca-line: #E4E0DA;
	--mjca-ground: #F8F6F4;
	--mjca-media: #EBE8E5;
	color: var(--mjca-ink);
	font-family: inherit;
}

.mjca [hidden] { display: none !important; }

.mjca-sr {
	position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* Filtres */
.mjca-filters {
	display: flex; flex-wrap: wrap; align-items: flex-end; gap: 16px;
	padding: 20px; margin: 0 0 24px;
	background: #fff; border: 1px solid var(--mjca-line);
}
.mjca-field { display: flex; flex-direction: column; gap: 6px; flex: 1 1 200px; }
.mjca-field label { font-size: 13px; font-weight: 700; color: var(--mjca-ink-2); }
.mjca-field select {
	height: 48px; padding: 0 40px 0 16px; font: inherit; font-size: 16px; color: var(--mjca-ink);
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231D1C1C' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 16px center;
	border: 1.5px solid #CFCAC2; border-radius: 500px; cursor: pointer;
	-webkit-appearance: none; appearance: none;
}
.mjca-reset {
	height: 48px; padding: 0 22px; font: inherit; font-size: 15px; font-weight: 700;
	color: var(--mjca-ink); background: #F1EEE9; border: 1.5px solid #CFCAC2; border-radius: 500px; cursor: pointer;
}
.mjca-field--search { flex: 2 1 280px; }
.mjca-field input[type="search"] {
	height: 48px; padding: 0 18px 0 44px; font: inherit; font-size: 16px; color: var(--mjca-ink);
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%235C5A60' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") no-repeat 16px center;
	border: 1.5px solid #CFCAC2; border-radius: 500px; box-sizing: border-box; width: 100%;
	-webkit-appearance: none; appearance: none;
}
.mjca-field input[type="search"]::placeholder { color: #8A867F; }
.mjca-field input[type="search"]:focus-visible { outline: 3px solid var(--mjca-ink); outline-offset: 2px; }
.mjca-hint { flex: 1 1 100%; margin: 0; font-size: 13px; color: var(--mjca-muted); }
.mjca select:focus-visible, .mjca button:focus-visible, .mjca a:focus-visible {
	outline: 3px solid var(--mjca-ink); outline-offset: 2px;
}

.mjca-count { margin: 0 0 20px; font-size: 15px; color: var(--mjca-ink-2); }

/* Grille */
.mjca-grid {
	display: grid; gap: 24px;
	grid-template-columns: minmax(0, 1fr);
}
/* Colonnes réglables (3, 4 ou 5) sur grand écran, réduites automatiquement en dessous */
@media (min-width: 640px) {
	.mjca .mjca-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 960px) {
	.mjca .mjca-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
	.mjca.mjca--cols-4 .mjca-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.mjca.mjca--cols-5 .mjca-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
}
@media (min-width: 1400px) {
	.mjca.mjca--cols-5 .mjca-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
.mjca.mjca--cols-5 .mjca-body { padding: 16px 16px 18px; }
.mjca.mjca--cols-5 .mjca-title { font-size: 17px; }

.mjca-card {
	display: flex; flex-direction: column; background: #fff;
	border: 1px solid var(--mjca-line); overflow: hidden;
}

/* Cadre identique pour toutes les images, quelle que soit la taille de l'original */
.mjca .mjca-media {
	position: relative; display: block; width: 100%; height: auto;
	aspect-ratio: var(--mjca-ratio, 4 / 3); overflow: hidden; background: var(--mjca-media);
}
@supports not (aspect-ratio: 1) {
	.mjca .mjca-media { height: 0; padding-top: var(--mjca-ratio-pad, 75%); }
}
.mjca .mjca-media img,
.mjca .mjca-media .mjca-media-empty {
	position: absolute; inset: 0; display: block;
	width: 100% !important; height: 100% !important; max-width: none !important;
	margin: 0; object-fit: var(--mjca-fit, cover); object-position: center;
}
.mjca-chip {
	position: absolute; top: 12px; left: 12px; min-width: 52px; padding: 6px 10px;
	text-align: center; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .12);
}
.mjca-chip-day { display: block; font-size: 24px; font-weight: 900; line-height: 1; color: var(--mjca-ink); }
.mjca-chip-mon { display: block; font-size: 11px; font-weight: 700; letter-spacing: .06em; color: var(--mjca-accent); }
.mjca-flag {
	position: absolute; top: 12px; right: 12px; padding: 6px 10px; border-radius: 500px;
	font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
	color: #fff; background: var(--mjca-ink);
}

.mjca-body { display: flex; flex-direction: column; gap: 10px; flex: 1 1 auto; padding: 18px 20px 20px; }
.mjca-type {
	margin: 0; font-size: 13px; font-weight: 700; letter-spacing: .06em;
	text-transform: uppercase; color: var(--mjca-accent);
}
.mjca .mjca-title { margin: 0; font-size: 19px; font-weight: 700; line-height: 1.3; }
.mjca .mjca-title a { color: var(--mjca-ink); text-decoration: none; }
.mjca .mjca-title a:hover { color: var(--mjca-accent); }

.mjca-meta { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 0; list-style: none; font-size: 14px; color: var(--mjca-ink-2); }
.mjca-meta li { display: flex; gap: 8px; align-items: flex-start; }
.mjca-meta svg { flex: 0 0 auto; margin-top: 2px; }

.mjca-badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.mjca-badge {
	padding: 4px 10px; border-radius: 500px; font-size: 13px; font-weight: 700;
	color: var(--mjca-accent); background: #E2EEED;
}
.mjca-badge--all { color: #3F6B36; background: #E8F0E5; }

.mjca-foot {
	display: flex; flex-direction: column; gap: 12px; margin-top: auto;
	padding-top: 12px; border-top: 1px solid #EEEAE4;
}
.mjca-price { margin: 0; font-size: 20px; font-weight: 700; color: var(--mjca-ink); }
.mjca-status { margin: 0; font-size: 13px; color: var(--mjca-ink-2); }

.mjca .mjca-btn {
	display: flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 20px;
	border: 0; border-radius: 500px; font: inherit; font-size: 15px; font-weight: 900;
	color: #fff; background: var(--mjca-accent); text-decoration: none; cursor: pointer;
}
.mjca .mjca-btn:hover { color: #fff; filter: brightness(.9); }
.mjca .mjca-btn--line { color: var(--mjca-ink); background: #fff; border: 1.5px solid var(--mjca-ink); }
.mjca .mjca-btn--line:hover { color: var(--mjca-ink); background: var(--mjca-ground); filter: none; }
.mjca .mjca-btn--off { color: var(--mjca-muted); background: #EEEAE4; cursor: default; }

/* Aucun résultat / Afficher plus */
.mjca-empty {
	display: flex; flex-direction: column; align-items: center; gap: 16px; margin-top: 8px;
	padding: 48px 24px; text-align: center; background: #fff; border: 1px dashed #CFCAC2;
}
.mjca-empty p { margin: 0; font-size: 18px; font-weight: 700; }

.mjca-more { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-top: 40px; }
.mjca-more p { margin: 0; font-size: 14px; color: var(--mjca-muted); }
.mjca-more-btn {
	min-height: 50px; padding: 0 32px; font: inherit; font-size: 16px; font-weight: 900;
	color: var(--mjca-ink); background: #fff; border: 1.5px solid var(--mjca-ink);
	border-radius: 500px; cursor: pointer;
}
.mjca-more-btn:hover { background: var(--mjca-ground); }

@media (max-width: 639px) {
	.mjca-filters { padding: 16px; }
	.mjca-reset { width: 100%; }
}