/* Rubrique ETF (etf-ui.js) */
.etf-filtres { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: end; margin: 18px 0; }
.etf-filtres .champ { min-width: 180px; }
.etf-case { display: flex; gap: 8px; align-items: center; font-size: .9rem; color: var(--doux); padding-bottom: 8px; }
.etf-grille { display: grid; gap: 14px; }
.etf-carte, .etf-panier { border: 1px solid var(--trait-fort); border-radius: 14px; padding: 18px 20px; display: grid; gap: 12px; min-width: 0; }
.etf-tete { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 16px; align-items: start; }
.etf-tete h3 { font-size: 1.12rem; font-weight: 600; margin: 2px 0 4px; }
.etf-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.etf-badge { font: 500 .7rem var(--f-mono); text-transform: uppercase; letter-spacing: .07em; padding: 4px 9px; border-radius: 999px; border: 1px solid var(--trait-fort); color: var(--doux); white-space: nowrap; }
.etf-badge.paris { border-color: var(--accent); color: var(--accent); }
.etf-faits { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px 18px; margin: 0; }
.etf-faits div { min-width: 0; }
.etf-faits dt { font: 500 .68rem var(--f-mono); text-transform: uppercase; letter-spacing: .08em; color: var(--pale); }
.etf-faits dd { margin: 2px 0 0; font-size: .92rem; }
.etf-plus summary { cursor: pointer; color: var(--accent); font-size: .9rem; }
.etf-plus p { margin: 10px 0 0; font-size: .92rem; color: var(--doux); }
.etf-plus p strong { color: var(--texte); }
.etf-fermes { margin-top: 18px; }
.etf-region { margin: 28px 0 10px; font-size: 1.05rem; font-weight: 600; }
.etf-tableau-cadre { overflow-x: auto; }
.etf-tableau td { white-space: normal; font-family: var(--f-texte); font-size: .88rem; vertical-align: top; }
.etf-tableau td:first-child { min-width: 220px; }
.etf-cellule-texte { min-width: 160px; }
.etf-note { color: var(--rouge); font-size: .82rem; }
.etf-barre { display: flex; height: 14px; border-radius: 7px; overflow: hidden; background: color-mix(in srgb, var(--trait-fort) 60%, transparent); }
.etf-barre i { display: block; height: 100%; background: var(--c); }
.etf-legende { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0; padding: 0; list-style: none; font-size: .88rem; color: var(--doux); }
.etf-legende i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--c); margin-right: 6px; vertical-align: middle; }
.etf-lignes { font-size: .9rem; }
.etf-lignes .pastille { margin-left: 4px; }
@media (min-width: 900px) { .etf-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } }