/* Colores: cambialos acá para que coincidan con tu sitio */
:root {
	--ef-accent: #6f9a98;        /* botón "Ver evento" */
	--ef-accent-hover: #5a8280;
	--ef-text: #222;
	--ef-gap: 8px;
}

/* ---------- Carrusel de eventos ---------- */
.ef-eventos { position: relative; padding: 40px 0; }
.ef-heading { text-align: center; font-weight: 700; letter-spacing: .02em; margin: 0 0 16px; color: var(--ef-text); }

.ef-nav { display: flex; justify-content: flex-end; gap: 4px; margin-bottom: 12px; }
.ef-nav button {
	background: none; border: 0; font-size: 28px; line-height: 1; padding: 4px 12px;
	cursor: pointer; color: var(--ef-text);
}
.ef-static .ef-nav, .ef-static .ef-dots { visibility: hidden; }

.ef-track {
	display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 3 * var(--ef-gap)) / 4);
	column-gap: var(--ef-gap); overflow-x: auto; scroll-snap-type: x mandatory;
	scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.ef-track::-webkit-scrollbar { display: none; }

.ef-card { scroll-snap-align: start; display: flex; flex-direction: column; align-items: center; text-align: center; }
.ef-cover { display: block; width: 100%; aspect-ratio: 3 / 2; overflow: hidden; background: #eee; }
.ef-cover img, .ef-noimg { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.ef-card:hover .ef-cover img { transform: scale(1.04); }

.ef-title { font-size: 16px; font-weight: 600; margin: 10px 8px 12px; line-height: 1.2; }
.ef-title a { color: var(--ef-text); text-decoration: none; }
.ef-count { margin-left: 4px; font-weight: 500; }

.ef-btn {
	margin-top: auto; display: inline-block; padding: 9px 20px; background: var(--ef-accent);
	color: #fff !important; font-weight: 600; text-decoration: none; border-radius: 2px; transition: background .2s;
}
.ef-btn:hover, .ef-btn:focus-visible { background: var(--ef-accent-hover); }

.ef-dots { display: flex; justify-content: center; gap: 8px; margin-top: 28px; flex-wrap: wrap; }
.ef-dots button { width: 12px; height: 12px; border-radius: 50%; border: 0; padding: 0; background: #111; cursor: pointer; }
.ef-dots button.is-active { background: var(--ef-accent); }

@media (max-width: 1024px) { .ef-track { grid-auto-columns: calc((100% - var(--ef-gap)) / 2); } }
@media (max-width: 600px)  { .ef-track { grid-auto-columns: 85%; } .ef-nav { display: none; } }

/* ---------- Galería del evento ---------- */
.ef-baterias { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 24px; }
.ef-baterias a {
	padding: 10px 14px; border: 1px solid #ddd; background: #f1f1f1; color: var(--ef-text);
	font-size: 14px; font-weight: 500; text-decoration: none;
}
.ef-baterias a.is-active, .ef-baterias a:hover { background: var(--ef-accent); border-color: var(--ef-accent); color: #fff; }

.ef-filename { font-size: 15px !important; font-weight: 500 !important; word-break: break-all; }
