/* Visuels des fiches territoire (#263) : chiffres avec picto, carte de situation, comparaisons, anneau, galerie.
   Couleurs : jetons du socle uniquement ; aucune teinte de données sous 3:1 n'est utilisée pour du texte. */
.tv-bloc { margin: 0 0 var(--s-6, 24px); }
.tv-haut { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); align-items: start; margin-bottom: 16px; }
@media (min-width: 768px) { .tv-haut:has(.tv-reperes):has(.tv-situation) { grid-template-columns: minmax(0, 1fr) 200px; } }
.sp-chiffres--tv { margin-bottom: 0; }
.sp-chiffre__i { display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; border-radius: 50%; background: var(--c-brand-soft, #E8F1FB); color: var(--c-brand, #006AB5); }
.tv-situation { margin: 0; padding: 12px; background: #fff; border: 1px solid var(--sp-bord, #E2E8F0); border-radius: var(--r-md, 12px); text-align: center; }
.tv-situation svg { display: block; width: 100%; max-width: 176px; height: auto; margin: 0 auto; }
.tv-situation figcaption { margin-top: 8px; font-size: 13px; line-height: 18px; color: var(--c-text-2, #475569); }
.tv-sit-dept { fill: var(--viz-vide, #E2E8F0); stroke: var(--c-text-muted, #64748B); stroke-width: .8; stroke-linejoin: round; }
.tv-sit-zone { fill: var(--viz-1, #006AB5); stroke: var(--viz-1, #006AB5); stroke-width: .6; stroke-linejoin: round; }
.tv-graphiques { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .tv-graphiques { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.tv-graphique { min-width: 0; }
.tv-graphique .ui-chart { margin: 0; height: 100%; }
.tv-adn { min-width: 0; }
.tv-galerie { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); margin: 0 0 var(--s-6, 24px); padding: 0; list-style: none; }
.tv-photo { min-width: 0; }
.tv-photo figure { margin: 0; height: 100%; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--sp-bord, #E2E8F0); border-radius: var(--r-md, 12px); overflow: hidden; }
.tv-photo img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; background: var(--viz-vide, #E2E8F0); }
.tv-photo figcaption { padding: 8px 12px 12px; font-size: 12px; line-height: 18px; color: var(--c-text-2, #475569); overflow-wrap: anywhere; }
.tv-photo figcaption a { color: var(--c-action, #0B5CAD); text-decoration: underline; }
