/* Fiche rivière : le fil de la rivière, de la source à l'embouchure. */
.mm-fil-ariane { font-size: .9rem; }
.mm-fil-ariane a { color: var(--wp--preset--color--accent); text-decoration: none; }
.mm-fil-verdict {
	margin: 0 0 1.4rem; padding: .9rem 1.1rem; font-size: 1.05rem; color: var(--wp--preset--color--blanc);
	background: var(--wp--preset--color--dore-pale); border-left: 4px solid var(--wp--preset--color--accent); border-radius: 6px;
}

.mm-fil-liste { list-style: none; margin: 0; padding: 0 0 0 2.2rem; position: relative; }
/* La rivière : un trait bleu-vert qui s'élargit vers l'aval. */
.mm-fil-liste::before {
	content: ""; position: absolute; left: .55rem; top: .6rem; bottom: .6rem; width: 6px; border-radius: 3px;
	background: linear-gradient(to bottom, #6fa3a8 0%, #4a8a99 55%, #2f6f86 100%);
	clip-path: polygon(30% 0, 70% 0, 100% 100%, 0 100%);
}
.mm-fil-liste li { position: relative; }

.mm-fil-station {
	display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1.2fr); gap: 1rem; align-items: center;
	margin: 0 0 .8rem; padding: .9rem 1.1rem;
	background: var(--wp--preset--color--brume); border: 1px solid var(--wp--preset--color--trait); border-radius: 8px;
}
.mm-fil-point {
	position: absolute; left: -2.05rem; top: 50%; width: 1.1rem; height: 1.1rem; margin-top: -.55rem; border-radius: 50%;
	background: var(--wp--preset--color--fond); border: 3px solid var(--wp--preset--color--gris);
}
.mm-fil-station.hausse .mm-fil-point { border-color: var(--wp--preset--color--ocre); background: var(--wp--preset--color--ocre); }
.mm-fil-station.baisse .mm-fil-point { border-color: var(--wp--preset--color--olive-clair); background: var(--wp--preset--color--olive-clair); }
.mm-fil-station.stable .mm-fil-point { border-color: var(--wp--preset--color--accent); background: var(--wp--preset--color--accent); }
.mm-fil-station.hausse { border-left: 3px solid var(--wp--preset--color--ocre); }
.mm-fil-station.baisse { border-left: 3px solid var(--wp--preset--color--olive-clair); }
.mm-fil-station.stable { border-left: 3px solid var(--wp--preset--color--accent); }

.mm-fil-nom h3 { margin: 0; font-size: 1.15rem; }
.mm-fil-nom p { margin: .2rem 0 0; font-size: .8125rem; color: var(--wp--preset--color--gris); }
.mm-fil-mesure p { margin: 0; }
.mm-fil-mesure .mm-riv-valeur { font-size: 1.7rem; }
.mm-fil-mesure .mm-riv-tendance { margin: .1rem 0 0; font-size: .875rem; }
.mm-fil-mesure .mm-riv-tendance.stable { color: var(--wp--preset--color--gris); }
.mm-fil-mesure .mm-riv-debit { margin: .1rem 0 0; font-size: .8125rem; color: var(--wp--preset--color--gris); }
.mm-fil-courbe .mm-riv-graphique { height: 54px; }

.mm-fil-repere { margin: -.2rem 0 .6rem; padding: .1rem 0 .1rem .2rem; font-size: .875rem; font-style: italic; color: var(--wp--preset--color--sauge); }
.mm-fil-repere::before {
	content: ""; position: absolute; left: -1.75rem; top: 50%; width: 1.4rem; height: 2px; background: #6fa3a8; opacity: .7;
}
.mm-fil-repere span { display: inline-block; padding-left: .3rem; }

.mm-fil-legende { margin: .4rem 0 0; font-size: .8125rem; color: var(--wp--preset--color--gris); }
.mm-fil-l { display: inline-flex; align-items: center; gap: .35rem; margin-right: .9rem; }
.mm-fil-l::before { content: ""; width: .7rem; height: .7rem; border-radius: 50%; }
.mm-fil-l.hausse::before { background: var(--wp--preset--color--ocre); }
.mm-fil-l.baisse::before { background: var(--wp--preset--color--olive-clair); }
.mm-fil-l.stable::before { background: var(--wp--preset--color--accent); }

.mm-fil-carnet {
	display: flex; gap: 1.4rem; align-items: center; padding: 1.3rem 1.5rem;
	background: var(--wp--preset--color--brume); border: 1px solid var(--wp--preset--color--sauge); border-radius: 12px;
}
.mm-fil-carnet-chiffre { margin: 0; font-size: 3.2rem; line-height: 1; font-weight: 700; color: var(--wp--preset--color--accent); }
.mm-fil-carnet p { margin: 0 0 .4rem; }
.mm-fil-carnet p:last-child { margin: 0; }

.mm-fil-fiches { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .6rem; }
.mm-fil-fiches a {
	display: inline-block; padding: .55rem 1.1rem; border: 1px solid var(--wp--preset--color--accent); border-radius: 999px;
	color: var(--wp--preset--color--blanc); text-decoration: none; font-weight: 600;
}
.mm-fil-fiches a:hover { background: var(--wp--preset--color--dore-pale); }

@media (max-width: 700px) {
	.mm-fil-liste { padding-left: 1.8rem; }
	.mm-fil-point { left: -1.65rem; }
	.mm-fil-repere::before { left: -1.35rem; width: 1rem; }
	.mm-fil-station { grid-template-columns: 1fr 1fr; }
	.mm-fil-nom { grid-column: 1 / -1; }
	.mm-fil-carnet { flex-direction: column; align-items: flex-start; gap: .6rem; }
}