/* Gabarit observatoire (phase 5, lot 0). Dépend de gabarits.css (chargé avant).
   Graphique à intervalles horizontal (design system §6) : une ligne par circuit,
   segment min-max, extrémités arrondies 4px, couleur = circuit (slots fixes),
   jamais de double axe, jamais la couleur seule pour porter l'information. */

.echelle {
	margin: 2rem 0;
	padding: 1rem 0;
}

.echelle-ligne {
	display: grid;
	grid-template-columns: 9rem 1fr 7rem;
	align-items: center;
	gap: 0.75rem;
	padding: 0.4rem 0;
}

.echelle-nom {
	font-size: var(--taille-s);
	color: var(--couleur-encre-2);
}

.echelle-piste {
	position: relative;
	height: 0.5rem;
	background: var(--couleur-fond-2);
	border-radius: 4px;
}

.echelle-segment {
	position: absolute;
	top: 0;
	left: var(--min);
	width: calc(var(--max) - var(--min));
	height: 100%;
	background: var(--c);
	border-radius: 4px;
}

.echelle-valeurs {
	font-size: var(--taille-s);
	text-align: right;
	white-space: nowrap;
}

/* Tableau des relevés du mois */
.tableau-releve {
	width: 100%;
	border-collapse: collapse;
	margin: 1.5rem 0;
	font-size: var(--taille-s);
}

.tableau-releve th,
.tableau-releve td {
	text-align: left;
	padding: 0.6rem 0.75rem;
	border-bottom: 1px solid var(--couleur-trait);
	vertical-align: top;
}

.tableau-releve th {
	font-family: var(--fonte-texte);
	font-weight: 600;
	color: var(--couleur-encre);
}

.tableau-releve .mono {
	font-family: var(--fonte-donnees);
}

/* Liste des archives */
.liste-archives {
	list-style: none;
	margin: 1rem 0;
	padding: 0;
}

.liste-archives li {
	padding: 0.4rem 0;
	border-bottom: 1px solid var(--couleur-trait);
}

@media (max-width: 640px) {
	.echelle-ligne {
		grid-template-columns: 1fr;
		row-gap: 0.25rem;
	}
	.echelle-valeurs {
		text-align: left;
	}
	.tableau-releve {
		display: block;
		overflow-x: auto;
	}
}