/* Grille des programmes (site). Reprend les variables du thème RCM, avec des valeurs de repli. */

.rcm-prog {
	--rcm-prog-accent: var(--orange, #eb662b);
	--rcm-prog-now: var(--green, #00795d);
	--rcm-prog-now-text: var(--green-light, #2ba88a);
	--rcm-prog-text: var(--white, #fff);
	--rcm-prog-muted: var(--gray-400, #aaa);
	--rcm-prog-faint: #8f8f8f; /* 4.6:1 minimum sur les fonds de la grille (#777 du thème : 3.3 à 4.1) */
	--rcm-prog-line: rgba(255,255,255,0.08);
	--rcm-prog-radius: var(--radius, 6px);
	color: var(--rcm-prog-text);
}

.rcm-prog-empty,
.rcm-prog-notice {
	color: var(--rcm-prog-muted);
}

/* Texte réservé aux lecteurs d'écran */
.rcm-prog-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------------------------------------------------------------- Onglets (semaine, jours) */

.rcm-prog [role="tab"] {
	padding: 0;
	background: none;
	border: 0;
	font-family: inherit;
	color: var(--rcm-prog-muted);
	cursor: pointer;
	transition: color 0.2s ease;
}
.rcm-prog [role="tab"]:hover { color: var(--rcm-prog-text); }
.rcm-prog [role="tab"].is-active { color: var(--rcm-prog-accent); cursor: default; }
.rcm-prog [role="tab"]:focus-visible { outline: 2px solid var(--rcm-prog-accent); outline-offset: 4px; border-radius: 2px; }

.rcm-prog-weektabs {
	display: flex;
	flex-wrap: wrap; /* 320 px : les onglets passent à la ligne plutôt que de déborder */
	row-gap: 8px;
	gap: var(--space-lg, 24px);
	margin-bottom: var(--space-md, 16px);
}
.rcm-prog-weektab {
	font-size: clamp(1rem, 4vw, 1.3rem);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.rcm-prog-weeklabel {
	margin: 0 0 var(--space-md, 16px);
	color: var(--rcm-prog-muted);
}

.rcm-prog-daytabs {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: 4px;
	margin-bottom: var(--space-lg, 24px);
}
.rcm-prog-daytab {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 8px 2px !important;
	border-radius: var(--rcm-prog-radius) !important;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.rcm-prog-daytab.is-active { background: rgba(255,255,255,0.05) !important; }
.rcm-prog-daytab-name { font-size: 1.05rem; font-weight: 700; }
.rcm-prog-daytab-date { font-size: 0.8rem; }
.rcm-prog-short { display: none; }
@media (max-width: 767px) {
	/* Nom complet masqué visuellement seulement : c'est lui que lisent les lecteurs d'écran (l'abrégé est aria-hidden) */
	.rcm-prog-long { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.rcm-prog-short { display: inline; }
}

/* ---------------------------------------------------------------- Liste d'une journée */

.rcm-prog-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.rcm-prog-item {
	display: flex;
	align-items: flex-start;
	gap: var(--space-md, 16px);
	padding: 12px 10px;
	border-radius: var(--rcm-prog-radius);
}
.rcm-prog-time {
	flex: 0 0 120px;
	font-variant-numeric: tabular-nums;
	font-size: 1.05rem;
	color: var(--rcm-prog-text);
	padding-top: 2px;
}
.rcm-prog-time-end { color: var(--rcm-prog-faint); }
.rcm-prog-thumb {
	flex: 0 0 56px;
	width: 56px;
	height: 56px;
	object-fit: cover;
	border-radius: 4px;
}
/* Sans vignette (titre libre, plage musicale) : on réserve la place pour garder les titres alignés */
.rcm-prog-thumb--empty { height: 0; }
.rcm-prog-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.rcm-prog-title { font-size: 1.15rem; font-weight: 500; line-height: 1.25; }
.rcm-prog-title a { color: inherit; text-decoration: none; transition: color 0.2s ease; }
.rcm-prog-title a:hover { color: var(--rcm-prog-accent); }
.rcm-prog-desc { color: var(--rcm-prog-muted); font-size: 0.95rem; }

/* Plages sans émission */
.rcm-prog-item--gap { padding-top: 6px; padding-bottom: 6px; }
.rcm-prog-item--gap .rcm-prog-time,
.rcm-prog-item--gap .rcm-prog-title {
	font-size: 0.95rem;
	color: var(--rcm-prog-faint);
}
.rcm-prog-item--gap .rcm-prog-time-end { color: var(--rcm-prog-faint); }

/* Badges */
.rcm-prog-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.rcm-prog-badges:not(:has(.rcm-prog-badge:not([hidden]))) { display: none; }
.rcm-prog-badge {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	padding: 1px 8px;
	border-radius: 999px;
	border: 1px solid var(--rcm-prog-muted);
	color: var(--rcm-prog-muted);
}
.rcm-prog-badge[hidden] { display: none; }
.rcm-prog-badge--now { background: var(--rcm-prog-now); border-color: var(--rcm-prog-now); color: #fff; }

/* Émission en cours / passées */
.rcm-prog-item.is-now,
.rcm-prog-card.is-now { background: rgba(0,121,93,0.15); }
.rcm-prog-item.is-now .rcm-prog-time { color: var(--rcm-prog-now-text); }
/* Émissions passées : estompées par la couleur (pas l'opacité, qui ferait tomber le contraste sous 4.5:1) */
.rcm-prog-item.is-past .rcm-prog-thumb { opacity: 0.45; }
.rcm-prog-item.is-past .rcm-prog-time,
.rcm-prog-item.is-past .rcm-prog-title,
.rcm-prog-item.is-past .rcm-prog-desc { color: var(--rcm-prog-faint); }
.rcm-prog-item.is-past .rcm-prog-badge { color: var(--rcm-prog-faint); border-color: var(--rcm-prog-faint); }
/* Bandeau du jour : les émissions terminées disparaissent */
.rcm-prog-card.is-past { display: none; }

@media (max-width: 575px) {
	.rcm-prog-item { flex-wrap: wrap; gap: 8px 12px; }
	.rcm-prog-time { flex-basis: 100%; }
	.rcm-prog-thumb { flex-basis: 44px; width: 44px; height: 44px; }
	.rcm-prog-thumb--empty { height: 0; }
}

/* ---------------------------------------------------------------- Bandeau « Aujourd'hui » (accueil) */

.rcm-prog-strip-scroll {
	padding: 0 0 8px;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scrollbar-width: thin;
}
.rcm-prog-strip {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 12px;
}
.rcm-prog-card {
	flex: 0 0 220px;
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 14px 16px;
	background: rgba(255,255,255,0.04);
	border-radius: var(--rcm-prog-radius);
}
.rcm-prog-card .rcm-prog-time { flex: none; font-size: 0.95rem; padding: 0; }
.rcm-prog-card .rcm-prog-title { font-size: 1.1rem; }
.rcm-prog-card.is-now .rcm-prog-time { color: var(--rcm-prog-now-text); }

.rcm-prog-item,
.rcm-prog-card { position: relative; }
