/**
 * Alexeo Calendar — styles publics.
 *
 * Le calendrier reste lisible sans JavaScript et sans thème : les couleurs
 * dérivent d'une seule variable, la grille disparaît sous 720 px au profit de
 * la liste, qui porte de toute façon l'intégralité de l'information.
 */

.acal,
.acal-fiche-page {
	--acal-accent: #257fa9;
	--acal-texte: #2b2b2b;
	--acal-doux: #7c7c7c;
	--acal-trait: #e3e6e8;
	--acal-fond: #ffffff;
	--acal-fond-doux: #f5f7f8;
	--acal-radius: 6px;

	color: var(--acal-texte);
	margin: 0 0 2.5rem;
}

.acal *,
.acal *::before,
.acal *::after {
	box-sizing: border-box;
}

.acal__titre {
	margin: 0 0 1rem;
}

/* Repli : tous les thèmes ne définissent pas la classe d'accessibilité de
   WordPress, et le calendrier s'appuie dessus pour ses libellés vocaux. */
.acal .screen-reader-text,
.acal-fiche .screen-reader-text,
.acal-inscription .screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	white-space: nowrap;
	width: 1px;
}

/* ------------------------------------------------------------- Navigation */

.acal__nav {
	align-items: center;
	border-bottom: 1px solid var(--acal-trait);
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: space-between;
	margin-bottom: 1.25rem;
	padding-bottom: 0.75rem;
}

.acal__nav-periode {
	align-items: center;
	display: flex;
	gap: 0.5rem;
}

.acal__periode {
	font-size: 1.25rem;
	line-height: 1.2;
	margin: 0;
	min-width: 9em;
	text-align: center;
	text-transform: capitalize;
}

.acal__nav-vues {
	display: flex;
	flex-wrap: wrap;
	gap: 0.375rem;
}

.acal__bouton {
	background: var(--acal-fond);
	border: 1px solid var(--acal-trait);
	border-radius: var(--acal-radius);
	color: inherit;
	display: inline-block;
	font-size: 0.875rem;
	line-height: 1.4;
	padding: 0.4rem 0.75rem;
	text-decoration: none;
}

.acal__bouton:hover,
.acal__bouton:focus {
	border-color: var(--acal-accent);
	color: var(--acal-accent);
}

.acal__bouton.is-actif,
.acal__bouton[aria-current] {
	background: var(--acal-accent);
	border-color: var(--acal-accent);
	color: #fff;
}

.acal__bouton--fleche {
	font-size: 1rem;
	padding: 0.4rem 0.7rem;
}

.acal__corps[aria-busy="true"] {
	opacity: 0.5;
	transition: opacity 0.15s ease-in-out;
}

/* ----------------------------------------------------------------- Grille */

.acal-grille {
	border-collapse: collapse;
	margin: 0 0 1.5rem;
	table-layout: fixed;
	width: 100%;
}

.acal-grille th {
	color: var(--acal-doux);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	padding: 0.35rem 0.25rem;
	text-align: center;
	text-transform: uppercase;
}

.acal-grille td {
	border: 1px solid var(--acal-trait);
	height: 6.5rem;
	padding: 0.3rem;
	vertical-align: top;
}

.acal-grille__vide {
	background: var(--acal-fond-doux);
}

.acal-grille__num {
	color: var(--acal-doux);
	display: block;
	font-size: 0.8125rem;
	font-weight: 600;
	margin-bottom: 0.25rem;
	text-align: right;
}

.acal-grille__jour.is-aujourdhui {
	box-shadow: inset 0 0 0 2px var(--acal-accent);
}

.acal-grille__jour.is-aujourdhui .acal-grille__num {
	color: var(--acal-accent);
}

.acal-grille__sessions {
	list-style: none;
	margin: 0;
	padding: 0;
}

.acal-grille__session,
.acal-grille__reste {
	margin: 0 0 0.2rem;
}

.acal-grille__session a,
.acal-grille__reste a {
	background: var(--acal-accent);
	border-radius: 4px;
	color: #fff;
	display: block;
	font-size: 0.75rem;
	line-height: 1.3;
	overflow: hidden;
	padding: 0.2rem 0.35rem;
	text-decoration: none;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.acal-grille__session.is-complet a {
	background: var(--acal-doux);
}

.acal-grille__reste a {
	background: transparent;
	color: var(--acal-accent);
	font-weight: 600;
	padding-left: 0.35rem;
}

/* ------------------------------------------------------------ Vue annuelle */

.acal-annee {
	display: grid;
	gap: 1.25rem;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	margin-bottom: 2rem;
}

.acal-grille--mini td {
	height: auto;
	padding: 0;
	text-align: center;
}

.acal-grille--mini .acal-grille__num {
	font-weight: 400;
	margin: 0;
	padding: 0.3rem 0;
	text-align: center;
}

.acal-grille--mini .acal-grille__num--lien {
	background: var(--acal-accent);
	color: #fff;
	font-weight: 700;
	text-decoration: none;
}

.acal-grille__legende {
	caption-side: top;
	font-weight: 700;
	padding-bottom: 0.4rem;
	text-align: left;
	text-transform: capitalize;
}

.acal-grille__legende a {
	color: inherit;
	text-decoration: none;
}

.acal-grille__legende a:hover,
.acal-grille__legende a:focus {
	color: var(--acal-accent);
}

/* ------------------------------------------------------------------ Liste */

.acal-liste__titre {
	font-size: 1.1rem;
	margin: 0 0 1rem;
	text-transform: capitalize;
}

.acal-liste__jour,
.acal-liste__mois {
	border-top: 1px solid var(--acal-trait);
	font-size: 1rem;
	margin: 1.5rem 0 0.75rem;
	padding-top: 0.75rem;
	text-transform: capitalize;
}

.acal-cartes {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	list-style: none;
	margin: 0;
	padding: 0;
}

.acal-carte {
	background: var(--acal-fond);
	border: 1px solid var(--acal-trait);
	border-radius: var(--acal-radius);
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.acal-carte.is-complet,
.acal-carte.is-passee {
	opacity: 0.8;
}

.acal-carte__media {
	display: block;
	line-height: 0;
}

.acal-carte__image {
	aspect-ratio: 16 / 9;
	height: auto;
	object-fit: cover;
	width: 100%;
}

.acal-carte__corps {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 1rem;
}

.acal-carte__date {
	color: var(--acal-accent);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	margin: 0;
	text-transform: uppercase;
}

.acal-carte__titre {
	font-size: 1.0625rem;
	line-height: 1.3;
	margin: 0;
}

.acal-carte__titre a {
	color: inherit;
	text-decoration: none;
}

.acal-carte__titre a:hover,
.acal-carte__titre a:focus {
	color: var(--acal-accent);
	text-decoration: underline;
}

.acal-carte__categories {
	display: flex;
	flex-wrap: wrap;
	gap: 0.3rem;
	margin: 0;
}

.acal-carte__categorie {
	background: var(--acal-fond-doux);
	border-radius: 999px;
	color: var(--acal-doux);
	display: inline-block;
	font-size: 0.75rem;
	padding: 0.15rem 0.6rem;
	text-decoration: none;
}

.acal-carte__categorie:hover,
.acal-carte__categorie:focus {
	color: var(--acal-accent);
}

.acal-carte__extrait {
	font-size: 0.9375rem;
	margin: 0;
}

.acal-carte__meta {
	color: var(--acal-doux);
	font-size: 0.8125rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.acal-carte__meta li + li {
	margin-top: 0.15rem;
}

.acal-carte__lien {
	align-self: flex-start;
	border-bottom: 2px solid var(--acal-accent);
	color: var(--acal-accent);
	font-weight: 600;
	margin-top: auto;
	padding-top: 0.35rem;
	text-decoration: none;
}

.acal-vide {
	background: var(--acal-fond-doux);
	border-radius: var(--acal-radius);
	color: var(--acal-doux);
	margin: 0;
	padding: 1.25rem;
	text-align: center;
}

/* ------------------------------------------------------ Fiche et inscription */

.acal-fiche__media {
	margin: 0 0 1.5rem;
}

.acal-fiche__img {
	border-radius: 6px;
	display: block;
	height: auto;
	max-width: 100%;
	width: 100%;
}

.acal-fiche__legende {
	color: #7c7c7c;
	font-size: 0.8125rem;
	margin-top: 0.5rem;
}

.acal-fiche {
	background: var(--acal-fond-doux, #f5f7f8);
	border-left: 4px solid var(--acal-accent, #257fa9);
	border-radius: 4px;
	margin: 0 0 1.5rem;
	padding: 1rem 1.25rem;
}

.acal-fiche__liste {
	display: grid;
	gap: 0.5rem 1.5rem;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	margin: 0;
}

.acal-fiche__ligne dt {
	color: #7c7c7c;
	font-size: 0.75rem;
	letter-spacing: 0.04em;
	margin: 0;
	text-transform: uppercase;
}

.acal-fiche__ligne dd {
	font-weight: 600;
	margin: 0;
}

.acal-inscription {
	margin: 2rem 0 0;
}

.acal-inscription__titre {
	margin: 0 0 1rem;
}

.acal-inscription__avis {
	background: #f5f7f8;
	border-left: 4px solid #7c7c7c;
	margin: 0;
	padding: 1rem 1.25rem;
}

/* --------------------------------------------------- Modèles de fiche */

/*
 * Les trois modèles partent de la même colonne unique et n'ajoutent leur
 * disposition qu'au-delà d'un seuil : sur mobile, tout est empilé sans qu'une
 * seule règle ait à être annulée. Le `minmax(0, 1fr)` est indispensable — sans
 * lui, un tableau ou un bloc de code long dans le contenu force la colonne à
 * déborder au lieu de se réduire.
 */

.acal-fiche-page__contenu > *:first-child {
	margin-top: 0;
}

.acal-retour {
	margin: 0 0 1rem;
}

.acal-retour__lien {
	align-items: center;
	color: var(--acal-doux);
	display: inline-flex;
	font-size: 0.875rem;
	gap: 0.4rem;
	text-decoration: none;
}

.acal-retour__lien:hover,
.acal-retour__lien:focus {
	color: var(--acal-accent);
}

.acal-retour__fleche {
	transition: transform 0.15s ease-in-out;
}

.acal-retour__lien:hover .acal-retour__fleche {
	transform: translateX(-3px);
}

@media (prefers-reduced-motion: reduce) {
	.acal-retour__fleche {
		transition: none;
	}

	.acal-retour__lien:hover .acal-retour__fleche {
		transform: none;
	}
}

.acal-fiche-page--colonnes {
	display: grid;
	gap: 2rem;
	grid-template-columns: minmax(0, 1fr);
}

.acal-fiche-page__principal,
.acal-fiche-page__lateral {
	min-width: 0;
}

.acal-fiche-page__lateral .acal-inscription {
	background: var(--acal-fond-doux);
	border: 1px solid var(--acal-trait);
	border-radius: var(--acal-radius);
	margin: 0;
	padding: 1.25rem;
}

@media (min-width: 900px) {
	.acal-fiche-page--colonnes {
		align-items: start;
		grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
	}

	/* Le programme d'une formation est long : le formulaire reste à portée
	   de regard pendant toute la lecture. */
	.acal-fiche-page__collant {
		position: sticky;
		top: var(--acal-decalage-collant, 2rem);
	}
}

.acal-bandeau {
	display: grid;
	gap: 1.5rem;
	grid-template-columns: minmax(0, 1fr);
	margin-bottom: 2rem;
}

.acal-bandeau__media .acal-fiche__media {
	margin: 0;
}

.acal-bandeau__media .acal-fiche__img {
	aspect-ratio: 16 / 10;
	object-fit: cover;
}

.acal-bandeau__infos {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	justify-content: center;
	min-width: 0;
}

.acal-fiche--compacte {
	background: transparent;
	border-left: 0;
	padding: 0;
}

.acal-fiche--compacte .acal-fiche__liste {
	gap: 0.75rem;
	grid-template-columns: minmax(0, 1fr);
}

.acal-bandeau__cta {
	align-self: flex-start;
	background: var(--acal-accent);
	border-radius: var(--acal-radius);
	color: #fff;
	font-weight: 600;
	padding: 0.7rem 1.4rem;
	text-decoration: none;
}

.acal-bandeau__cta:hover,
.acal-bandeau__cta:focus {
	color: #fff;
	filter: brightness(0.92);
}

@media (min-width: 860px) {
	.acal-bandeau {
		align-items: center;
		grid-template-columns: minmax(0, 1.4fr) minmax(260px, 1fr);
	}
}

/* Ancre du formulaire : sans marge de défilement, un en-tête fixe recouvre
   le haut du formulaire quand on arrive par le bouton d'inscription. */
.acal-inscription {
	scroll-margin-top: var(--acal-decalage-collant, 2rem);
}

/*
 * Rappel d'inscription en bas d'écran, mobile uniquement. En `sticky` plutôt
 * qu'en `fixed` : l'élément reste dans le flux, il ne recouvre donc jamais le
 * pied de page et n'oblige pas à réserver une marge sur le corps du document.
 */
.acal-barre-mobile {
	display: none;
}

@media (max-width: 720px) {
	.acal-barre-mobile {
		bottom: 0.75rem;
		display: block;
		position: sticky;
		z-index: 20;
	}

	.acal-barre-mobile__lien {
		align-items: baseline;
		background: var(--acal-accent);
		border-radius: 999px;
		box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
		color: #fff;
		display: flex;
		flex-wrap: wrap;
		font-weight: 700;
		gap: 0.5rem;
		justify-content: center;
		padding: 0.85rem 1.25rem;
		text-decoration: none;
	}

	.acal-barre-mobile__date {
		font-size: 0.75rem;
		font-weight: 400;
		opacity: 0.85;
	}
}

/* ------------------------------------------------------------- Responsive */

@media (max-width: 720px) {
	.acal-grille:not(.acal-grille--mini) {
		display: none;
	}

	.acal__periode {
		min-width: 7em;
	}
}

@media (prefers-reduced-motion: reduce) {
	.acal__corps {
		transition: none;
	}
}
