/*
 * Styles des blocs de la page événement (oa-ecl/event-image,
 * oa-ecl/event-categories, oa-ecl/event-dates). Mêmes variables que
 * blocks/events-list/style.scss pour rester visuellement cohérent avec les
 * cartes de la liste d'événements.
 */

.oa-event-visual {
	margin: 0 0 var( --wp--preset--spacing--40, 1.5rem );
}

.oa-event-visual img {
	width: 100%;
    /* max-height: 480px; */
    /* object-fit: cover; */
    border-radius: 2rem;
    display: block;
    transform: rotate(-1deg);
    transition: transform 0.2s ease-out;
}

/* Le tilt interactif (event-single.js) est desactive dans ce cas :
   l'inclinaison statique ci-dessus reste la seule appliquee. */
@media ( prefers-reduced-motion: reduce ) {
	.oa-event-visual img {
		transition: none;
	}
}

.oa-event-categories {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin: 0 0 var( --wp--preset--spacing--20, 1rem );
}

.oa-event-categories__badge {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	padding: 0.25rem 0.65rem;
	border-radius: 999px;
	background: var( --wp--preset--color--accent-2, #d91a60 );
	color: #fff;
}

.oa-event-dates {
	font-family: var( --wp--preset--font-family--basilar, sans-serif );
	font-weight: 700;
	font-size: 1.1rem;
	color: var( --wp--preset--color--accent-2, #d91a60 );
	margin: 0 0 var( --wp--preset--spacing--30, 1.25rem );
}

/* Infos pratiques : conditions + outils d'inscription (oa-ecl/event-practical). */
.oa-event-practical {
	display: grid;
	gap: var( --wp--preset--spacing--40, 1.5rem );
	margin-top: var( --wp--preset--spacing--50, 2rem );
	padding: var( --wp--preset--spacing--40, 1.5rem );
	border: 2px solid var( --wp--preset--color--accent-2, #d91a60 );
	border-radius: 2rem;
}

@media ( min-width: 782px ) {
	.oa-event-practical {
		grid-template-columns: repeat( auto-fit, minmax( 16rem, 1fr ) );
	}
}

.oa-event-practical__title {
	font-size: 1.1rem;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var( --wp--preset--color--accent-2, #d91a60 );
	margin: 0 0 0.5rem;
}

.oa-event-practical__conditions > :first-child {
	margin-top: 0;
}

.oa-event-practical__conditions > :last-child {
	margin-bottom: 0;
}

.oa-event-practical__tools {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.6rem;
}

.oa-event-practical__label {
	font-weight: 700;
}

.oa-event-practical__button {
	display: inline-block;
	text-decoration: none;
}

.oa-event-practical .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect( 0, 0, 0, 0 );
	white-space: nowrap;
	border: 0;
}
