/* Planning Graine de Lotus — grille hebdomadaire filtrable.
   Conçu mobile d'abord : liste par jour sur téléphone, grille 5 colonnes à partir de 1000 px. */

.gdl-planning {
	--gdl-violet: #47314f;
	--gdl-violet-clair: #f3eff5;
	--gdl-texte: #35415b;
	--gdl-gris: #8a90a3;
	--gdl-bord: #e6e2ea;
	--gdl-rayon: 14px;
	/* Mesurés à l'exécution par front.js : hauteur de l'en-tête collant du thème
	   et hauteur réelle de la barre de filtres. Le plugin ne présume donc rien
	   du menu du site, qui change de hauteur selon le thème et la largeur. */
	--gdl-haut: 0px;
	--gdl-jours-h: 58px;
	font-family: inherit;
	color: var(--gdl-texte);
}

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

/* ------------------------------------------------------------------ Filtres */

/* La barre des jours reste accessible pendant le défilement ; les listes
   déroulantes, trop hautes sur téléphone pour rester à l'écran, défilent. */
.gdl-jours-barre {
	position: sticky;
	top: var(--gdl-haut);
	z-index: 6;
	background: #fff;
	padding: 14px 0 4px;
}

/* Posée par front.js sur les conteneurs du thème dont l'overflow:hidden
   empêcherait le sticky de fonctionner. Voir debloquerSticky(). */
.gdl-sticky-ok {
	overflow-x: clip !important;
	overflow-y: visible !important;
}

.gdl-filtres {
	background: #fff;
	padding: 0 0 10px;
	margin-bottom: 18px;
	border-bottom: 1px solid var(--gdl-bord);
}

.gdl-jours {
	display: flex;
	gap: 8px;
	overflow-x: auto;
	padding-bottom: 6px;
	margin-bottom: 10px;
	scrollbar-width: thin;
	-webkit-overflow-scrolling: touch;
}

.gdl-jour {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	appearance: none;
	border: 1px solid var(--gdl-bord);
	background: #fff;
	color: var(--gdl-texte);
	border-radius: 30px;
	padding: 8px 14px;
	font: inherit;
	font-size: 14px;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.gdl-jour:hover { border-color: var(--gdl-violet); }

.gdl-jour.is-on {
	background: var(--gdl-violet);
	border-color: var(--gdl-violet);
	color: #fff;
}

/* Un jour sans cours disponible n'a pas à rester proposé. */
.gdl-jour.is-vide { display: none; }

.gdl-nb {
	min-width: 18px;
	padding: 0 5px;
	border-radius: 20px;
	background: var(--gdl-violet-clair);
	color: var(--gdl-violet);
	font-size: 11.5px;
	font-weight: 700;
	line-height: 17px;
	text-align: center;
}

.gdl-nb:empty { display: none; }

.gdl-jour.is-on .gdl-nb {
	background: rgba(255, 255, 255, .22);
	color: #fff;
}

.gdl-selects {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
}

.gdl-sel { flex: 1 1 180px; min-width: 0; }

.gdl-sel select {
	width: 100%;
	appearance: none;
	border: 1px solid var(--gdl-bord);
	border-radius: 10px;
	background: #fbfbfd url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath fill='%2347314f' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 14px center;
	padding: 10px 36px 10px 14px;
	font: inherit;
	font-size: 14px;
	color: var(--gdl-texte);
	cursor: pointer;
}

.gdl-sel select:focus {
	outline: none;
	border-color: var(--gdl-violet);
	box-shadow: 0 0 0 3px rgba(71, 49, 79, .12);
}

.gdl-reset {
	appearance: none;
	border: 0;
	background: none;
	color: var(--gdl-violet);
	font: inherit;
	font-size: 14px;
	text-decoration: underline;
	cursor: pointer;
	padding: 8px 4px;
}

.gdl-compte {
	margin: 10px 0 0;
	font-size: 13px;
	color: var(--gdl-gris);
}

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

/* Le nombre de colonnes-jours suit ce qui reste affiché : front.js le recalcule
   à chaque filtrage, les media queries servent de repli sans JavaScript. */
.gdl-grille {
	display: grid;
	grid-template-columns: repeat(var(--gdl-cols, 1), minmax(0, 1fr));
	gap: 26px;
	align-items: start;
}

/* Chaque journée est elle-même une grille : une colonne large se remplit donc
   de plusieurs cartes côte à côte au lieu d'étirer une seule file. */
.gdl-col {
	display: grid;
	/* min() borne la largeur minimale à celle de la colonne : sans lui, une piste
	   de 225 px déborderait d'une colonne-jour plus étroite. */
	grid-template-columns: repeat(auto-fill, minmax(min(225px, 100%), 1fr));
	gap: 12px;
	align-content: start;
	align-items: start;   /* chaque carte garde sa hauteur propre */
}

.gdl-col.is-hidden { display: none; }

.gdl-jour-titre {
	grid-column: 1 / -1;
	position: sticky;
	top: calc(var(--gdl-haut) + var(--gdl-jours-h) + 6px);
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	margin: 0 0 3px;
	padding: 0 16px;
	background: var(--gdl-violet-clair);
	color: var(--gdl-violet);
	border-radius: 30px;
	font-family: inherit;
	font-size: 17px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-align: center;
}

/* Les capitales n'ont pas de jambages : leur tache d'encre se place plus haut
   que le centre de la ligne. Le demi-cadratin de décalage remet le mot au
   milieu optique de la gélule, quelle que soit la taille choisie. */
.gdl-jour-titre > span {
	display: block;
	line-height: 1;
	padding-top: .12em;
}

/* -------------------------------------------------------------------- Carte */

/* Le liséré reprend la couleur de la pratique : on repère une discipline dans
   la grille sans avoir à lire chaque carte. */
.gdl-carte {
	border: 1px solid var(--gdl-bord);
	border-left: 4px solid var(--gdl-accent, var(--gdl-bord));
	border-radius: var(--gdl-rayon);
	padding: 13px 15px 14px;
	background: #fff;
	transition: box-shadow .15s ease, transform .15s ease, border-color .15s ease;
}

.gdl-carte:hover {
	box-shadow: 0 6px 18px rgba(71, 49, 79, .1);
	transform: translateY(-1px);
	border-color: var(--gdl-accent, var(--gdl-violet));
}

.gdl-carte.is-hidden { display: none; }

/* Rythme typographique de la carte, du plus décisif au plus secondaire :
   pratique (pastille colorée) → commune → horaire → enseignante → salle. */

.gdl-commune {
	margin: 9px 0 0;
	font-family: inherit;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--gdl-violet);
}

.gdl-heure {
	margin: 5px 0 0;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--gdl-texte);
}

.gdl-ligne {
	display: flex;
	align-items: baseline;
	gap: 8px;
	margin: 6px 0 0;
	font-size: 14px;
	line-height: 1.4;
}

.gdl-salle {
	font-size: 13.5px;
	color: var(--gdl-gris);
}

.gdl-ico {
	flex: 0 0 15px;
	color: var(--gdl-accent, var(--gdl-violet));
	opacity: .6;
	font-size: 12.5px;
	text-align: center;
}

/* Badge « à partir du … » : sa propre ligne, juste sous l'horaire. */
.gdl-depuis {
	display: inline-block;
	margin: 4px 0 0;
	padding: 1px 8px;
	border-radius: 999px;
	background: #fdf1e9;
	font-size: 12px;
	line-height: 1.5;
	color: #a34f26;
}

/* La pratique devient une pastille colorée : c'est l'information qu'on cherche
   en premier, et elle donne sa couleur à la carte. */
.gdl-pratique {
	display: inline-block;
	margin: 0;
	padding: 4px 11px 5px;
	border-radius: 999px;
	background: var(--gdl-accent-clair, var(--gdl-violet-clair));
	font-size: 13px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: .02em;
}

.gdl-pratique,
.gdl-pratique a {
	color: var(--gdl-accent, var(--gdl-violet));
	text-decoration: none;
	border: 0;
}

.gdl-pratique a:hover { text-decoration: underline; }

.gdl-ligne a {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px solid rgba(71, 49, 79, .25);
}

.gdl-ligne a:hover {
	color: var(--gdl-violet);
	border-bottom-color: var(--gdl-violet);
}

.gdl-note {
	margin: 10px 0 0;
	padding-top: 8px;
	border-top: 1px dashed var(--gdl-bord);
	font-size: 12.5px;
	line-height: 1.4;
	color: var(--gdl-gris);
}

.gdl-aucun {
	padding: 26px 16px;
	text-align: center;
	color: var(--gdl-gris);
}

.gdl-reset-2 {
	appearance: none;
	border: 0;
	background: none;
	color: var(--gdl-violet);
	font: inherit;
	text-decoration: underline;
	cursor: pointer;
}

.gdl-vide { color: #8a90a3; font-style: italic; }

/* ------------------------------------------------------------------- Saison */

.gdl-saison {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
	margin-top: 34px;
	padding-top: 24px;
	border-top: 1px solid var(--gdl-bord);
}

.gdl-bloc {
	background: var(--gdl-violet-clair);
	border-radius: var(--gdl-rayon);
	padding: 16px 18px;
}

.gdl-bloc h4 {
	margin: 0 0 8px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--gdl-violet);
}

.gdl-bloc p, .gdl-bloc li { margin: 0 0 4px; font-size: 14px; line-height: 1.5; }
.gdl-bloc ul { margin: 0; padding-left: 18px; }
.gdl-petit { font-size: 12.5px !important; color: var(--gdl-gris); }

.gdl-mention {
	grid-column: 1 / -1;
	margin: 4px 0 0;
	font-size: 12.5px;
	color: var(--gdl-gris);
	text-align: center;
}

.gdl-mention a { color: var(--gdl-violet); }

/* --------------------------------------------------------------- Tablette */

@media (min-width: 700px) {
	.gdl-saison { grid-template-columns: repeat(2, 1fr); }
	.gdl-planning { --gdl-cols: 2; }
	.gdl-jour-titre { position: static; }
}

/* ---------------------------------------------------------------- Desktop */

@media (min-width: 1000px) {
	.gdl-planning { --gdl-cols: 5; }

	/* Une colonne par journée, toutes sur la même rangée. Le plancher de 175 px
	   garde une colonne lisible : au-delà de six journées elle ne rétrécit plus,
	   la grille défile latéralement — la page, elle, ne bouge pas. */
	.gdl-grille {
		grid-template-columns: repeat(var(--gdl-cols, 5), minmax(175px, 1fr));
		gap: 18px;
		overflow-x: auto;
		padding-bottom: 6px;
		scrollbar-width: thin;
	}
	.gdl-saison { grid-template-columns: repeat(4, 1fr); }
	.gdl-carte { padding: 12px 14px 14px; }
	.gdl-jour-titre { font-size: 16px; min-height: 44px; }
	.gdl-commune { font-size: 17.5px; }
	.gdl-heure { font-size: 15px; }
	.gdl-ligne { font-size: 13.5px; gap: 7px; }
	.gdl-salle { font-size: 13px; }

	/* Sur grand écran la grille tient à l'écran : plus rien n'a besoin de coller. */
	.gdl-jours-barre { position: static; padding-top: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.gdl-carte, .gdl-jour { transition: none; }
	.gdl-carte:hover { transform: none; }
}

/* ------------------------------------------------------------- Impression */

@media print {
	.gdl-filtres, .gdl-jours-barre, .gdl-aucun { display: none !important; }
	.gdl-grille { grid-template-columns: repeat(5, 1fr) !important; gap: 8px; }
	.gdl-col { grid-template-columns: 1fr; gap: 8px; }
	.gdl-jour-titre { position: static; }
	.gdl-carte { break-inside: avoid; box-shadow: none; }
}