/* Bloc cnd/sessions (v0.5.0) — maquette ACACED « Prochaines sessions » : tableau dans une carte
   blanche bordée sur ordinateur, cartes empilées sous 720 px. Statut : pastille de couleur
   sémantique + texte encre (le texte coloré --warn / --danger ne tient pas 4,5:1 à 12 px). */
.cnd.cnd-sessions {
	color: var(--ink);
	font-family: var(--font-body);
}
.cnd.cnd-sessions .cnd-sessions__empty {
	font-family: var(--font-body);
	font-size: var(--t-small);
	color: var(--ink-3);
	margin: 0;
}
.cnd.cnd-sessions table.cnd-sessions__table {
	width: 100%;
	margin: 0;
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	border-collapse: separate;
	border-spacing: 0;
	background: var(--surface);
	overflow: hidden;
	font-size: var(--t-small);
	line-height: 1.45;
	table-layout: auto;
}
/* Le thème (Hello reset.css) pose bordure, fond alterné et padding sur th/td : remis à plat. */
.cnd.cnd-sessions .cnd-sessions__table :is(th, td) {
	padding: var(--s-3) var(--s-4);
	border: 0;
	border-top: 1px solid var(--line);
	background: none;
	text-align: left;
	vertical-align: middle;
	font-family: var(--font-body);
	font-size: var(--t-small);
	font-weight: 400;
	color: var(--ink);
}
.cnd.cnd-sessions .cnd-sessions__table thead :is(th, td) {
	border-top: 0;
	font-size: var(--t-caption);
	font-weight: 500;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ink-3);
	background: var(--surface-2);
}
.cnd.cnd-sessions .cnd-sessions__table tbody tr:nth-child(odd) > * {
	background: none;
}
.cnd.cnd-sessions .cnd-sessions__table th.cnd-sessions__dates {
	font-weight: 500;
}
.cnd.cnd-sessions .cnd-sessions__note {
	display: block;
	font-size: var(--t-caption);
	color: var(--ink-3);
}
.cnd.cnd-sessions .cnd-sessions__action {
	text-align: right;
	white-space: nowrap;
}
.cnd.cnd-sessions .cnd-sessions__chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--font-body);
	font-size: var(--t-caption);
	font-weight: 500;
	line-height: 1.2;
	color: var(--ink);
	padding: 4px 10px;
	border-radius: var(--r-pill);
	white-space: nowrap;
}
.cnd.cnd-sessions .cnd-sessions__chip::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	flex: none;
}
.cnd.cnd-sessions .cnd-sessions__chip--ok { background: var(--ok-tint); color: var(--ok-deep); }
.cnd.cnd-sessions .cnd-sessions__chip--ok::before { background: var(--ok); }
.cnd.cnd-sessions .cnd-sessions__chip--warn { background: var(--warn-tint); }
.cnd.cnd-sessions .cnd-sessions__chip--warn::before { background: var(--warn); }
.cnd.cnd-sessions .cnd-sessions__chip--danger { background: var(--danger-tint); }
.cnd.cnd-sessions .cnd-sessions__chip--danger::before { background: var(--danger); }
/* Session commencée (v0.10.0) : statut neutre, plus réservable. */
.cnd.cnd-sessions .cnd-sessions__chip--neutral { background: var(--surface-2); }
.cnd.cnd-sessions .cnd-sessions__chip--neutral::before { background: var(--ink-4); }

/* Mobile : une carte par session, libellé de colonne repris devant chaque valeur. */
@media (max-width: 719px) {
	.cnd.cnd-sessions table.cnd-sessions__table,
	.cnd.cnd-sessions .cnd-sessions__table tbody {
		display: block;
		border: 0;
		background: none;
		overflow: visible;
	}
	.cnd.cnd-sessions .cnd-sessions__table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		clip-path: inset(50%);
		white-space: nowrap;
	}
	.cnd.cnd-sessions .cnd-sessions__table tr.cnd-sessions__row {
		display: flex;
		flex-direction: column;
		gap: var(--s-2);
		padding: var(--s-4);
		margin: 0 0 var(--s-3);
		background: var(--surface);
		border: 1px solid var(--line);
		border-radius: var(--r-md);
	}
	.cnd.cnd-sessions .cnd-sessions__table tr.cnd-sessions__row > :is(th, td) {
		display: block;
		padding: 0;
		border: 0;
		text-align: left;
	}
	.cnd.cnd-sessions .cnd-sessions__table tr.cnd-sessions__row > td[data-label]::before {
		content: attr(data-label) " · ";
		color: var(--ink-3);
	}
	.cnd.cnd-sessions .cnd-sessions__table th.cnd-sessions__dates {
		font-family: var(--font-display);
		font-size: var(--t-h4);
	}
	.cnd.cnd-sessions .cnd-sessions__action {
		padding-top: var(--s-1);
	}
}

/* Lien fléché (v0.24.0, maquette Éducateur « Réserver ma place → »). */
.cnd.cnd-sessions .cnd-sessions__arrow {
	font-family: var(--font-body);
	font-weight: 500;
	font-size: var(--t-small);
	color: var(--brand-strong);
	text-decoration: none;
	white-space: nowrap;
}
.cnd.cnd-sessions .cnd-sessions__arrow:is(:hover, :focus-visible) {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ---------- Affichage « cartes » (v0.34.0, maquette de la landing ACACED) : les prochaines sessions en cartes
   blanches bordées (rayon 12), statut, dates en titre, lieu et options ; 4 de front sur ordinateur, défilement
   horizontal sous 900 px. Ajout seul : le tableau reste l'affichage par défaut. ---------- */
.cnd.cnd-sessions .cnd-sessions__cartes {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: var(--s-3);
	margin: 0;
	padding: 0;
	list-style: none;
}
.cnd.cnd-sessions .cnd-sessions__carte {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	margin: 0;
	padding: 16px 18px;
	border: 1px solid var(--line);
	border-radius: 12px;
	background: var(--surface);
}
.cnd.cnd-sessions .cnd-sessions__carte-dates {
	margin: 4px 0 0;
	font-family: var(--font-display);
	font-size: 16px;
	font-weight: 500;
	color: var(--ink);
}
.cnd.cnd-sessions .cnd-sessions__carte-lieu {
	margin: 0;
	font-size: var(--t-small);
	color: var(--ink-3);
}
.cnd.cnd-sessions .cnd-sessions__carte .cnd-sessions__arrow {
	margin-top: auto;
	padding-top: 6px;
}
@media (max-width: 899px) {
	.cnd.cnd-sessions .cnd-sessions__cartes {
		grid-template-columns: none;
		grid-auto-flow: column;
		grid-auto-columns: minmax(240px, 80%);
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		padding-bottom: 6px;
	}
	.cnd.cnd-sessions .cnd-sessions__carte {
		scroll-snap-align: start;
	}
}

/* Session complète (v0.37.1) : « Être prévenu d’une prochaine session », libellé long, retour à la ligne permis. */
.cnd.cnd-sessions .cnd-sessions__notify {
	white-space: normal;
}
