/* =========================================================
   Cours : coachs et créneaux (inc/cours.php)
   S'appuie sur les variables --cbu- de style.css.
   ========================================================= */

/* Page d'un cours : horaires et coachs
   --------------------------------------------------------- */

.cbu-cours-infos {
	display: grid;
	gap: var(--cbu-esp-5);
	margin-top: var(--cbu-esp-5);
	text-align: left;
}

.cbu-cours-infos .cbu-cours-infos__titre {
	margin: 0 0 var(--cbu-esp-3);
	font-size: var(--cbu-taille-h3);
	text-shadow: none;
}

.cbu-horaires__liste,
.cbu-cours-coachs__liste {
	list-style: none;
	margin: 0;
	padding: 0;
}

.cbu-horaires__creneau {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--cbu-esp-1) var(--cbu-esp-4);
	margin-bottom: var(--cbu-esp-2);
	padding: var(--cbu-esp-3) var(--cbu-esp-4);
	background-color: var(--cbu-fond-clair);
	border-left: 3px solid var(--cbu-jaune);
	border-radius: var(--cbu-rayon-s);
}

.cbu-horaires__jour {
	min-width: 11rem;
	font-family: var(--cbu-police-titre);
	font-weight: 700;
	text-transform: uppercase;
}

.cbu-horaires__heure {
	min-width: 13rem;
	font-weight: 700;
	color: var(--cbu-jaune);
	font-variant-numeric: tabular-nums;
}

.cbu-horaires__detail {
	font-size: var(--cbu-taille-s);
	color: var(--cbu-texte);
}

.cbu-cours-coachs__liste {
	display: flex;
	flex-wrap: wrap;
	gap: var(--cbu-esp-3);
}

.cbu-coach {
	display: flex;
	align-items: center;
	gap: var(--cbu-esp-3);
	padding: var(--cbu-esp-2) var(--cbu-esp-4) var(--cbu-esp-2) var(--cbu-esp-2);
	background-color: var(--cbu-fond-clair);
	border-radius: 999px;
}

.simple-page .container .cbu-coach__photo,
.cbu-coach__photo {
	flex: none;
	width: 5.6rem;
	height: 5.6rem;
	border-radius: 50%;
	object-fit: cover;
}

.cbu-coach__photo--initiale {
	display: grid;
	place-items: center;
	background-color: var(--cbu-jaune);
	color: var(--cbu-noir);
	font-family: var(--cbu-police-titre);
	font-size: var(--cbu-taille-l);
	font-weight: 900;
}

.cbu-coach__texte {
	display: flex;
	flex-direction: column;
	line-height: 1.3;
}

.cbu-coach__nom {
	font-weight: 700;
}

.cbu-coach__fonction {
	font-size: var(--cbu-taille-s);
	color: var(--cbu-texte);
}

@media (min-width: 992px) {
	.cbu-cours-infos {
		grid-template-columns: 3fr 2fr;
		align-items: start;
	}

	/* Coachs seuls : toute la largeur. */
	.cbu-cours-coachs:only-child {
		grid-column: 1 / -1;
	}
}

/* Liste des cours : coachs sur la carte
   --------------------------------------------------------- */

.carte .text .cbu-carte-coachs {
	font-size: var(--cbu-taille-s);
	font-weight: 700;
	color: var(--cbu-jaune);
}

/* Planning de la page « Les cours »
   --------------------------------------------------------- */

.cbu-planning-zone {
	clear: both; /* passe sous les colonnes flottantes de Bootstrap (titre, séparateur) */
	display: flex;
	flex-direction: column;
	gap: var(--cbu-esp-4);
	margin-top: var(--cbu-esp-4);
	text-align: left;
}

/* « En ce moment / À venir » */
.cbu-direct {
	display: grid;
	gap: var(--cbu-esp-2);
}

.cbu-direct[hidden] {
	display: none;
}

.cbu-direct__ligne {
	display: flex;
	align-items: center;
	gap: var(--cbu-esp-3);
	margin: 0;
	padding: var(--cbu-esp-3) var(--cbu-esp-4);
	background-color: var(--cbu-fond-carte);
	border: 1px solid var(--cbu-trait);
	border-radius: var(--cbu-rayon-l);
}

.cbu-direct__pastille,
.cbu-en-cours {
	flex: none;
	padding: 0.4rem 1rem;
	border-radius: 999px;
	font-size: var(--cbu-taille-label);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 1.4;
}

.cbu-direct__pastille--maintenant,
.cbu-en-cours {
	background-color: var(--cbu-rouge);
	color: var(--cbu-blanc);
}

.cbu-direct__pastille--ensuite {
	background-color: var(--cbu-jaune);
	color: var(--cbu-noir);
}

.cbu-en-cours {
	display: inline-block;
	margin-left: var(--cbu-esp-1);
	padding: 0.1rem 0.7rem;
	font-size: 1rem;
	vertical-align: 0.15em;
}

.cbu-en-cours[hidden] {
	display: none;
}

.cbu-direct__texte {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	line-height: 1.25;
}

.cbu-direct__cours {
	font-family: var(--cbu-police-titre);
	font-size: var(--cbu-taille-l);
	font-weight: 700;
	text-transform: uppercase;
}

.cbu-direct__detail {
	font-size: var(--cbu-taille-s);
	color: var(--cbu-texte);
}

.cbu-direct__quand {
	flex: none;
	font-weight: 700;
	color: var(--cbu-jaune);
}

@media (min-width: 768px) {
	.cbu-direct {
		grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));
	}
}

/* Mobile : pastille et délai sur une ligne, le cours en dessous. */
@media (max-width: 767px) {
	.cbu-direct__ligne {
		display: grid;
		grid-template-columns: auto 1fr;
		gap: var(--cbu-esp-2) var(--cbu-esp-3);
	}

	.cbu-direct__pastille {
		justify-self: start;
	}

	.cbu-direct__quand {
		grid-column: 2;
		grid-row: 1;
		justify-self: end;
	}

	.cbu-direct__texte {
		grid-column: 1 / -1;
	}
}

/* Onglets des jours (mobile, avec JavaScript) */
.cbu-planning__onglets {
	display: grid;
	grid-template-columns: repeat(var(--cbu-planning-onglets, 7), minmax(0, 1fr));
	gap: 0.4rem;
}

.cbu-planning__onglets[hidden] {
	display: none;
}

.cbu-planning__onglet {
	min-height: 48px;
	padding: 0;
	background-color: var(--cbu-fond-carte);
	border: 1px solid var(--cbu-trait);
	border-radius: var(--cbu-rayon-m);
	color: var(--cbu-texte-doux);
	font-size: var(--cbu-taille-xs);
	font-weight: 700;
}

.cbu-planning__onglet.is-today {
	border-color: var(--cbu-jaune);
}

.cbu-planning__onglet[aria-selected="true"] {
	background-color: var(--cbu-jaune);
	border-color: var(--cbu-jaune);
	color: var(--cbu-noir);
}

.cbu-planning__onglet:focus-visible,
.cbu-suivre:focus-visible,
.cbu-agenda button:focus-visible,
.cbu-agenda a:focus-visible {
	outline: none;
	box-shadow: var(--cbu-anneau);
}

/* Les jours */
.cbu-planning {
	display: grid;
	gap: var(--cbu-esp-3);
}

.cbu-planning__jour {
	padding: var(--cbu-esp-4) var(--cbu-esp-3);
	background-color: var(--cbu-fond-carte);
	border: 1px solid var(--cbu-trait);
	border-radius: var(--cbu-rayon-l);
}

.cbu-planning__jour.is-today {
	border: 2px solid var(--cbu-jaune);
}

.cbu-planning .cbu-planning__titre {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--cbu-esp-2);
	margin: 0 0 var(--cbu-esp-3);
	font-size: var(--cbu-taille-h4);
}

.cbu-planning__aujourdhui {
	display: none;
	padding: 0.2rem 0.8rem;
	background-color: var(--cbu-jaune);
	color: var(--cbu-noir);
	border-radius: 999px;
	font-family: var(--cbu-police);
	font-size: 1.1rem;
	text-transform: none;
}

.is-today .cbu-planning__aujourdhui {
	display: inline-block;
}

.cbu-planning__creneaux {
	list-style: none;
	margin: 0;
	padding: 0;
}

.cbu-planning__creneau {
	display: flex;
	align-items: center;
	gap: var(--cbu-esp-2);
	padding: var(--cbu-esp-3) 0;
	border-top: 1px solid var(--cbu-trait);
	line-height: 1.3;
}

.cbu-planning__creneau.is-premier {
	border-top: 0;
	padding-top: 0;
}

/* Étiquettes « Matin / Midi / Soir » : seulement sur grand écran. */
.cbu-planning__moments {
	display: none;
}

.cbu-planning__texte {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
}

.cbu-planning__heure {
	font-size: var(--cbu-taille-s);
	font-weight: 700;
	color: var(--cbu-jaune);
	font-variant-numeric: tabular-nums;
}

.cbu-planning__cours {
	font-weight: 700;
	color: var(--cbu-blanc);
	overflow-wrap: break-word;
	hyphens: auto;
}

a.cbu-planning__cours {
	text-decoration: underline;
	text-decoration-color: var(--cbu-jaune);
	text-underline-offset: 3px;
}

a.cbu-planning__cours:hover,
a.cbu-planning__cours:focus-visible {
	color: var(--cbu-jaune);
}

.cbu-planning__detail {
	font-size: var(--cbu-taille-xs);
	color: var(--cbu-texte);
}

/* Bouton « ajouter à mon agenda » d'une séance */
.cbu-suivre {
	flex: none;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;
	background: transparent;
	border: 1px solid var(--cbu-trait);
	border-radius: 50%;
	color: var(--cbu-jaune);
	transition: background-color var(--cbu-transition), border-color var(--cbu-transition);
}

.cbu-suivre[hidden] {
	display: none;
}

.cbu-suivre:hover {
	border-color: var(--cbu-jaune);
}

.cbu-suivre[aria-pressed="true"] {
	background-color: var(--cbu-jaune);
	border-color: var(--cbu-jaune);
	color: var(--cbu-noir);
}

.cbu-suivre__ok,
.cbu-suivre[aria-pressed="true"] .cbu-suivre__ajouter {
	display: none;
}

.cbu-suivre[aria-pressed="true"] .cbu-suivre__ok {
	display: block;
}

.cbu-horaires__creneau .cbu-suivre {
	margin-left: auto;
	align-self: center;
}

/* Barre « Vos séances dans votre agenda » */
.cbu-agenda {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--cbu-esp-3);
	padding: var(--cbu-esp-3) var(--cbu-esp-4);
	background-color: var(--cbu-fond-carte);
	border: 1px solid var(--cbu-trait);
	border-radius: var(--cbu-rayon-l);
	text-align: left;
}

.cbu-agenda[hidden] {
	display: none;
}

.cbu-agenda.is-rempli {
	border-color: var(--cbu-jaune);
}

.cbu-cours-infos .cbu-agenda {
	margin-top: var(--cbu-esp-3);
}

.cbu-agenda__icone {
	flex: none;
	color: var(--cbu-jaune);
}

.cbu-agenda__texte {
	flex: 1 1 24rem;
	min-width: 0;
	display: flex;
	flex-direction: column;
	margin: 0;
	line-height: 1.35;
}

.cbu-agenda__texte span {
	font-size: var(--cbu-taille-s);
	color: var(--cbu-texte);
}

.cbu-agenda__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--cbu-esp-2);
}

.cbu-agenda__actions[hidden] {
	display: none;
}

.cbu-agenda__effacer,
.cbu-agenda__ajouter,
.cbu-agenda__autre {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 var(--cbu-esp-4);
	border-radius: 999px;
	font-size: var(--cbu-taille-s);
	font-weight: 700;
	text-decoration: none;
}

.cbu-agenda__effacer,
.cbu-agenda__autre {
	background: transparent;
	border: 1px solid var(--cbu-trait-champ);
	color: var(--cbu-blanc);
}

.cbu-agenda__ajouter {
	background-color: var(--cbu-jaune);
	color: var(--cbu-noir);
}

a.cbu-agenda__ajouter:hover,
a.cbu-agenda__ajouter:focus {
	background-color: var(--cbu-jaune-fonce);
	color: var(--cbu-noir);
	text-decoration: none;
}

a.cbu-agenda__autre:hover,
.cbu-agenda__effacer:hover {
	border-color: var(--cbu-jaune);
	color: var(--cbu-blanc);
	text-decoration: none;
}

.cbu-planning-pdf {
	clear: both;
	margin-top: var(--cbu-esp-4);
}

.cbu-planning-pdf a {
	color: var(--cbu-jaune);
	text-decoration: underline;
}

/* Mobile : un jour à la fois, choisi par les onglets. */
@media (max-width: 599px) {
	.is-onglets .cbu-planning__jour:not(.is-actif) {
		display: none;
	}
}

@media (min-width: 600px) {
	.cbu-planning__onglets {
		display: none;
	}

	.cbu-planning {
		grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
	}
}

/* Grand écran : la semaine sur une ligne, découpée en matin, midi et soir. */
@media (min-width: 1200px) {
	/* Matin en haut, midi au milieu, soir en bas : les trois zones sont alignées d'un
	   jour à l'autre (sous-grille), sans être à l'échelle des heures. */
	.cbu-planning {
		grid-template-columns: 2.8rem repeat(var(--cbu-planning-jours, 7), minmax(0, 1fr));
		grid-template-rows: auto minmax(6.4rem, auto) minmax(5.6rem, auto) minmax(6.4rem, auto);
		gap: 0 var(--cbu-esp-2);
	}

	.cbu-planning__jour,
	.cbu-planning__moments {
		grid-row: 1 / 5;
		display: grid;
		grid-template-rows: subgrid;
	}

	.cbu-planning__jour {
		padding: 0 var(--cbu-esp-2);
		border-radius: var(--cbu-rayon-m);
	}

	.cbu-planning .cbu-planning__titre {
		margin: 0;
		padding: var(--cbu-esp-3) 0 var(--cbu-esp-2);
		font-size: var(--cbu-taille-m);
	}

	.cbu-planning__creneaux {
		display: flex;
		flex-direction: column;
		padding: 0.6rem 0;
	}

	.cbu-planning__creneaux--midi,
	.cbu-planning__creneaux--soir {
		border-top: 1px dashed var(--cbu-trait);
	}

	.cbu-planning__creneaux--midi {
		justify-content: center;
	}

	.cbu-planning__creneaux--soir {
		justify-content: flex-end;
		padding-bottom: var(--cbu-esp-2);
	}

	.cbu-planning__moment {
		display: flex;
		align-items: center;
		justify-content: center;
		border-top: 1px dashed var(--cbu-trait);
		writing-mode: vertical-rl;
		transform: rotate(180deg);
		font-size: 1.1rem;
		font-weight: 700;
		letter-spacing: 0.14em;
		text-transform: uppercase;
		color: var(--cbu-indice);
	}

	/* Le premier de chaque zone n'a pas de trait plein au-dessus. */
	.cbu-planning__creneau,
	.cbu-planning__creneau.is-premier {
		position: relative;
		display: block;
		padding: 0.5rem 0;
		border-top: 1px solid #33383c;
	}

	.cbu-planning__creneau:first-child {
		border-top: 0;
	}

	.cbu-planning__heure {
		display: block;
		min-height: 30px;
		padding-right: 34px;
		font-size: var(--cbu-taille-xs);
	}

	.cbu-planning__cours {
		font-size: var(--cbu-taille-s);
	}

	.cbu-planning__detail {
		font-size: 1.2rem;
	}

	.cbu-planning .cbu-suivre {
		position: absolute;
		top: 0.5rem;
		right: 0;
		width: 30px;
		height: 30px;
	}

	.cbu-planning .cbu-suivre svg {
		width: 14px;
		height: 14px;
	}
}

/* Page « Nos coachs » : cours animés
   --------------------------------------------------------- */

.cbu-coach-cours {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--cbu-esp-1);
	margin: var(--cbu-esp-3) 0;
}

.cbu-coach-cours__libelle {
	margin-right: var(--cbu-esp-1);
	font-size: var(--cbu-taille-s);
	font-weight: 700;
	color: var(--cbu-jaune);
}

.cbu-coach-cours__cours {
	padding: 0.2rem 1rem;
	border: 1px solid var(--cbu-trait-champ);
	border-radius: 999px;
	font-size: var(--cbu-taille-xs);
	text-decoration: none;
}

a.cbu-coach-cours__cours:hover,
a.cbu-coach-cours__cours:focus-visible {
	border-color: var(--cbu-jaune);
	color: var(--cbu-jaune);
	text-decoration: none;
}