/* ============================================================
 * SECOURS MapLibre MINIMAL : seulement le POSITIONNEMENT (pas de taille
 * forcée : c'est MapLibre qui dimensionne son canvas en JS, on ne doit PAS
 * l'écraser). Ces règles ne servent que si le vrai maplibre-gl-5.24.0.css
 * n'a pas pu se charger ; sans !important, le vrai CSS reprend le dessus.
 * ============================================================ */
.maplibregl-map { position: relative; overflow: hidden; }
.maplibregl-canvas-container { position: absolute; top: 0; left: 0; }
.maplibregl-canvas { position: absolute; top: 0; left: 0; }
.maplibregl-ctrl-top-left, .maplibregl-ctrl-top-right, .maplibregl-ctrl-bottom-left, .maplibregl-ctrl-bottom-right { position: absolute; z-index: 2; pointer-events: none; }
.maplibregl-ctrl-top-left { top: 0; left: 0; } .maplibregl-ctrl-top-right { top: 0; right: 0; }
.maplibregl-ctrl-bottom-left { bottom: 0; left: 0; } .maplibregl-ctrl-bottom-right { bottom: 0; right: 0; }
.maplibregl-ctrl { pointer-events: auto; }

/* ============================================================
 * RU Atlas 3D · atlas-fullscreen.css (v1.1.0)
 * Habillage plein écran. Chargé après atlas-public.css. Portée :
 * body.ru-atlas-standalone. La bande du site est masquée par le JS.
 * ============================================================ */
:root { --rua-top-safe: 0px; }

/* Héros (titre + sous-titre + CTA) : colonne gauche, CENTRÉE verticalement
   (le logo est séparé, en haut à gauche, dans #rua-fs-tl). */
body.ru-atlas-standalone #ru-atlas-app .rua-header {
  top: 50% !important; bottom: auto !important; left: 24px !important; right: auto !important;
  transform: translateY(-50%) !important;
  display: flex !important; flex-direction: column !important; align-items: flex-start !important;
  gap: 4px !important; max-width: 480px; z-index: 6 !important;
}
/* Logo + Le Hub : bloc fixe en haut à gauche */
#rua-fs-tl {
  position: fixed; top: calc(var(--rua-top-safe,0px) + 16px); left: 24px; z-index: 6;
}
.rua-fs-brand { display: flex; align-items: center; gap: 14px; }
.rua-fs-logo { height: 40px; width: auto; display: block; filter: drop-shadow(0 2px 8px rgba(0,0,0,.55)); }
.rua-fs-hub {
  display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600;
  color: rgba(255,255,255,.72); text-decoration: none; background: rgba(10,12,18,.7);
  border: 1px solid rgba(255,255,255,.12); border-radius: 999px; padding: 7px 12px;
}
.rua-fs-hub:hover { border-color: var(--rua-yellow,#FFD941); color: #fff; }
.rua-fs-cta { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 18px; }
.rua-fs-btn {
  appearance: none; border: 0; cursor: pointer; font: inherit; font-weight: 800; font-size: 13px;
  border-radius: 12px; padding: 12px 16px; white-space: nowrap; text-decoration: none;
  display: inline-flex; flex-direction: column; align-items: flex-start; line-height: 1.1;
}
.rua-fs-btn small { font-weight: 500; font-size: 11px; opacity: .8; margin-top: 3px; }
.rua-fs-btn.gold { color: #171100; background: linear-gradient(180deg,#FFE97A,#FFD941 58%,#E9BE1F);
  box-shadow: 0 6px 20px rgba(255,217,65,.26); }
.rua-fs-btn.gold:hover { filter: brightness(1.05); }
.rua-fs-btn.ghost { color: #fff; background: rgba(10,12,18,.72); border: 1px solid rgba(255,255,255,.16); }
.rua-fs-btn.ghost:hover { border-color: #FFD941; }

/* Onglets L'Atlas / Légendes : haut-centre */
body.ru-atlas-standalone #ru-atlas-app .rua-view-switcher {
  top: calc(var(--rua-top-safe) + 16px) !important; left: 50% !important; right: auto !important;
  transform: translateX(-50%) !important; margin: 0 !important; z-index: 7 !important;
  display: flex !important; flex-direction: row !important; align-items: center !important; gap: 8px !important;
}
/* Recherche + filtres : BAS-DROITE (ne cache plus le globe au zoom) */
body.ru-atlas-standalone #ru-atlas-app .rua-filters {
  top: auto !important; bottom: 22px !important; right: 16px !important; left: auto !important;
  transform: none !important; z-index: 7 !important;
}

/* Cluster haut-droite : Partager · Plein écran · Roue (EMPILES verticalement) */
#rua-fs-tr {
  position: fixed; top: calc(var(--rua-top-safe,0px) + 16px); right: 16px; z-index: 2147483000;
  display: flex; flex-direction: column; align-items: flex-end; gap: 8px;
}
#rua-fs-tr > * { margin: 0 !important; }
#rua-fs-tr .rua-share-btn, #rua-fs-tr .rua-fullscreen-btn, #rua-fs-tr .rua-fullscreen-arrow, #rua-fs-gear {
  width: 42px; height: 42px; border-radius: 11px; border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(10,12,18,.72) !important; color: #fff !important; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
#rua-fs-tr .rua-share-btn:hover, #rua-fs-tr .rua-fullscreen-btn:hover, #rua-fs-gear:hover { border-color: #FFD941 !important; }
#rua-fs-gear { color: #151004; }
#rua-fs-gear { background: linear-gradient(180deg,#FFE97A,#FFD941 60%,#E9BE1F) !important; border: 0 !important; color: #171100 !important; box-shadow: 0 6px 20px rgba(255,217,65,.26); }
#rua-fs-tr .rua-fullscreen-wrap { display: flex; align-items: center; gap: 6px; background: none; border: 0; }
/* le menu déroulant du plein écran reste correctement positionné sous le bouton */
#rua-fs-tr .rua-fullscreen-menu { top: 52px !important; }

/* Ciel étoilé en canvas, derrière la carte */
body.ru-atlas-standalone #ru-atlas-app .rua-stage { position: absolute; background: #04060d !important; }
#rua-fs-sky { position: absolute; inset: 0; z-index: 0; pointer-events: none; display: block; }
body.ru-atlas-standalone #ru-atlas-app #rua-carte,
body.ru-atlas-standalone #ru-atlas-app #rua-map { position: absolute; inset: 0; z-index: 1; }

/* Tiroir d'options (glisse depuis la droite) */
#rua-fs-scrim { position: fixed; inset: 0; z-index: 2147483200; background: rgba(4,5,7,.45);
  opacity: 0; pointer-events: none; transition: opacity .25s; }
#rua-fs-scrim.on { opacity: 1; pointer-events: auto; }
#rua-fs-drawer { position: fixed; top: 0; right: 0; height: 100%; width: 340px; max-width: 88vw;
  z-index: 2147483400; display: flex; flex-direction: column; transform: translateX(102%);
  transition: transform .28s ease; background: rgba(9,10,13,.97); backdrop-filter: blur(16px);
  border-left: 1px solid rgba(255,255,255,.14); box-shadow: -16px 0 50px rgba(0,0,0,.55);
  font-family: 'Inter',-apple-system,'Segoe UI',sans-serif; color: #fff; }
#rua-fs-drawer.open { transform: none; }
.rua-fs-dhd { display: flex; align-items: center; justify-content: space-between;
  padding: calc(22px + env(safe-area-inset-top,0px)) 22px 16px; border-bottom: 1px solid rgba(255,255,255,.10); }
.rua-fs-dhd b { font-size: 14px; letter-spacing: .7px; text-transform: uppercase; color: #FFD941; }
.rua-fs-dhd #rua-fs-close { width: 34px; height: 34px; border-radius: 9px; border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.05); color: #fff; font-size: 20px; line-height: 1; cursor: pointer; }
.rua-fs-dbody { padding: 6px 22px 32px; overflow-y: auto; flex: 1; }
.rua-fs-row { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 11px 0; border-bottom: 1px solid rgba(255,255,255,.06); font-size: 13.5px; }
.rua-fs-row:last-child { border-bottom: 0; }
.rua-fs-lab { font-size: 13.5px; color: #e6e8ec; white-space: nowrap; }
.rua-fs-ctl { display: inline-flex !important; align-items: center; margin: 0 !important; }
/* Rien de géant dans le tiroir : les SVG des contrôles restent petits */
#rua-fs-drawer .rua-fs-row svg { width: 15px; height: 15px; flex: 0 0 auto; }
#rua-fs-drawer .rua-filter-rotate, #rua-fs-drawer .rua-filter-tour { white-space: nowrap; }

/* Boîte de pilules (Luminosité, Étoiles, Halo, ...) */
#rua-fs-drawer .rua-fs-pillbox {
  display: inline-flex !important; gap: 3px !important;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12);
  border-radius: 11px; padding: 3px;
}
#rua-fs-drawer .rua-fs-pill {
  border: 0; background: transparent; color: rgba(255,255,255,.75);
  font: 700 12px 'Inter',sans-serif; padding: 6px 10px; border-radius: 8px; cursor: pointer;
  white-space: nowrap;
}
#rua-fs-drawer .rua-fs-pill:hover { color: #fff; }
#rua-fs-drawer .rua-fs-pill.active { background: #FFD941; color: #171100; }

@media (max-width: 820px) {
  body.ru-atlas-standalone #ru-atlas-app .rua-view-switcher { display: none !important; }
  body.ru-atlas-standalone #ru-atlas-app .rua-header {
    left: 16px !important; right: 16px !important; max-width: none;
    top: calc(var(--rua-top-safe,0px) + 72px) !important; transform: none !important;
  }
  body.ru-atlas-standalone #ru-atlas-app .rua-header .rua-subtitle { display: none; }
  body.ru-atlas-standalone #ru-atlas-app .rua-filters { top: auto !important; bottom: 18px !important; left: 12px !important; right: 12px !important; transform: none !important; }
  #rua-fs-tr { top: calc(var(--rua-top-safe,0px) + 10px); right: 10px; }
  #rua-fs-drawer { width: 86%; }
}

/* ============================================================
 * v1.0.0 - Habillage AU NIVEAU DE LA MAQUETTE : gros titre, boutons
 * modernes, onglets en pilules, tiroir propre, modale de partage
 * restylée, et le héros qui s'efface au zoom.
 * ============================================================ */

/* --- Héros : GROS titre net, comme la maquette --- */
body.ru-atlas-standalone #ru-atlas-app .rua-title {
  font-size: clamp(34px, 5vw, 58px) !important; font-weight: 900 !important;
  line-height: .98 !important; letter-spacing: -.5px !important; margin: 0 !important;
  text-wrap: balance;
}
body.ru-atlas-standalone #ru-atlas-app .rua-title em {
  color: #FFD941 !important; font-weight: 900 !important; font-style: normal !important;
}
body.ru-atlas-standalone #ru-atlas-app .rua-subtitle {
  font-size: 15px !important; line-height: 1.55 !important; color: rgba(255,255,255,.78) !important;
  max-width: 400px; margin: 14px 0 0 !important;
}

/* --- Le héros (titre + sous-titre + CTA) s'efface au zoom ; logo reste --- */
body.ru-atlas-standalone #ru-atlas-app .rua-title,
body.ru-atlas-standalone #ru-atlas-app .rua-subtitle,
body.ru-atlas-standalone #ru-atlas-app .rua-fs-cta {
  transition: opacity .4s ease, transform .4s ease;
}
body.ru-atlas-standalone #ru-atlas-app.rua-fs-zoomed .rua-title,
body.ru-atlas-standalone #ru-atlas-app.rua-fs-zoomed .rua-subtitle,
body.ru-atlas-standalone #ru-atlas-app.rua-fs-zoomed .rua-fs-cta {
  opacity: 0 !important; transform: translateY(-8px); pointer-events: none;
}

/* --- Onglets L'Atlas / Légendes : pilules modernes --- */
body.ru-atlas-standalone #ru-atlas-app .rua-view-switcher {
  background: rgba(10,12,18,.72) !important; border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 13px !important; padding: 4px !important;
}
body.ru-atlas-standalone #ru-atlas-app .rua-view-toggle { display: flex; gap: 4px; }
body.ru-atlas-standalone #ru-atlas-app .rua-view-btn {
  border: 0 !important; background: transparent !important; color: rgba(255,255,255,.6) !important;
  font-weight: 700 !important; font-size: 13px !important; padding: 9px 14px !important;
  border-radius: 9px !important; cursor: pointer;
}
body.ru-atlas-standalone #ru-atlas-app .rua-view-btn.active {
  background: #FFD941 !important; color: #171100 !important;
}

/* --- Recherche + filtres : conteneur arrondi propre --- */
body.ru-atlas-standalone #ru-atlas-app .rua-filters {
  background: rgba(10,12,18,.72) !important; border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 14px !important; padding: 6px 8px !important;
}
body.ru-atlas-standalone #ru-atlas-app .rua-filter-pill {
  border-radius: 9px !important; font-weight: 700 !important;
}
body.ru-atlas-standalone #ru-atlas-app .rua-filter-pill.active { background: #FFD941 !important; color: #171100 !important; }

/* --- Contrôles du tiroir : modernes (fini le look années 90) --- */
#rua-fs-drawer .rua-map-theme-switch {
  display: inline-flex !important; background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.12) !important; border-radius: 11px !important; padding: 3px !important;
}
#rua-fs-drawer .rua-theme-btn {
  border: 0 !important; background: transparent !important; color: #fff !important;
  padding: 7px 11px !important; border-radius: 8px !important; cursor: pointer; font-size: 15px !important;
}
#rua-fs-drawer .rua-theme-btn.active { background: #FFD941 !important; }
#rua-fs-drawer .rua-filter-rotate,
#rua-fs-drawer .rua-filter-tour {
  border: 1px solid rgba(255,255,255,.12) !important; background: rgba(255,255,255,.05) !important;
  color: #fff !important; border-radius: 10px !important; padding: 8px 13px !important;
  font: inherit !important; font-size: 13px !important; font-weight: 600 !important; cursor: pointer;
}
#rua-fs-drawer .rua-filter-rotate:hover,
#rua-fs-drawer .rua-filter-tour:hover { border-color: #FFD941 !important; }

/* --- Modale (fiche + PARTAGER/INTÉGRER) : carte moderne --- */
/* Le WRAP est un simple conteneur transparent : SURTOUT pas de background ni
   d'overflow:hidden (sinon le bouton X, posé en dehors du coin, est coupé et
   ne montre qu'un morceau doré). La vraie carte, c'est .rua-sheet-box. */
body.ru-atlas-standalone .rua-sheet-wrap {
  background: transparent !important; border: 0 !important; overflow: visible !important;
  font-family: 'Inter',-apple-system,'Segoe UI',sans-serif !important;
}
body.ru-atlas-standalone .rua-sheet-box {
  background: rgba(12,13,17,.98) !important; border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 18px !important; box-shadow: 0 30px 80px rgba(0,0,0,.6) !important;
}
/* Bouton X : propre, dans le coin de la carte (ni coupé, ni qui dépasse) */
body.ru-atlas-standalone .rua-sheet-close {
  top: 14px !important; right: 14px !important; width: 34px !important; height: 34px !important;
  border-radius: 50% !important; background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.22) !important; color: #fff !important;
  font-size: 20px !important; box-shadow: none !important;
}
body.ru-atlas-standalone .rua-sheet-close:hover {
  background: #FFD941 !important; color: #171100 !important; border-color: #FFD941 !important;
  transform: none !important;
}
body.ru-atlas-standalone .rua-sheet-wrap textarea,
body.ru-atlas-standalone .rua-sheet-wrap input[type=text] {
  background: #0d1017 !important; border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 10px !important; color: #cfd3d8 !important; font-size: 12.5px !important; padding: 10px 12px !important;
}
body.ru-atlas-standalone .rua-sheet-wrap a.rua-btn {
  border-radius: 11px !important; font-weight: 700 !important;
}

/* ============================================================
 * v1.0.1 - Interface épurée : tout dans la roue, rien qui cache le globe.
 * ============================================================ */

/* La bande « Aide-nous a cartographier... / Ajouter ma fiche » faisait
   doublon avec les CTA du héros et se superposait en haut. Retirée. */
body.ru-atlas-standalone #ru-atlas-app .rua-footer { display: none !important; }

/* La barre d'onglets haut-centre est vidée (tout est passé dans la roue). */
body.ru-atlas-standalone #ru-atlas-app .rua-view-switcher { display: none !important; }

/* Haut-droite : Partager + Roue seulement, deux carrés parfaitement alignés. */
#rua-fs-tr .rua-share-btn, #rua-fs-tr #rua-fs-gear { width: 42px; height: 42px; }

/* --- Filtres : compacts, discrets, bas-droite --- */
body.ru-atlas-standalone #ru-atlas-app .rua-filters {
  gap: 6px !important; padding: 5px 6px !important; max-width: 420px;
}
body.ru-atlas-standalone #ru-atlas-app .rua-filter-pill {
  font-size: 12px !important; padding: 6px 10px !important;
}
body.ru-atlas-standalone #ru-atlas-app .rua-filter-search input#rua-search {
  font-size: 12.5px !important; padding: 6px 8px !important; width: 150px !important; max-width: 34vw;
}
/* Réinitialiser en icône seule (le texte prenait de la place) */
body.ru-atlas-standalone #ru-atlas-app .rua-filter-reset {
  padding: 6px !important; font-size: 0 !important; gap: 0 !important;
}
body.ru-atlas-standalone #ru-atlas-app .rua-filter-reset svg { margin: 0 !important; }

/* --- Contrôles fraîchement déplacés dans le tiroir --- */
/* Sélecteur de vue (L'Atlas / Légendes) en pilules dans la rangée */
#rua-fs-drawer .rua-view-toggle {
  display: inline-flex !important; gap: 4px !important; background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.12) !important; border-radius: 11px !important; padding: 3px !important;
}
#rua-fs-drawer .rua-view-btn {
  border: 0 !important; background: transparent !important; color: rgba(255,255,255,.7) !important;
  font-weight: 700 !important; font-size: 12px !important; padding: 7px 10px !important;
  border-radius: 8px !important; cursor: pointer; display: inline-flex; align-items: center; gap: 6px;
  white-space: nowrap;
}
#rua-fs-drawer .rua-view-btn svg { width: 14px; height: 14px; }
#rua-fs-drawer .rua-view-btn.active { background: #FFD941 !important; color: #171100 !important; }
/* Bouton musique + mode Légendes (Ange/Esprit) : mêmes carrés que le thème */
#rua-fs-drawer #rua-audio-btn {
  width: 40px; height: 36px; border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.05) !important; color: #fff !important; border-radius: 10px !important;
  font-size: 16px !important; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
}
#rua-fs-drawer #rua-audio-btn.playing { color: #FFD941 !important; }
#rua-fs-drawer .rua-galaxy-mode-switch {
  display: inline-flex !important; gap: 3px !important; background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.12) !important; border-radius: 11px !important; padding: 3px !important;
}
#rua-fs-drawer .rua-galaxy-mode-btn {
  border: 0 !important; background: transparent !important; padding: 7px 11px !important;
  border-radius: 8px !important; cursor: pointer; font-size: 15px !important;
}
#rua-fs-drawer .rua-galaxy-mode-btn.active { background: #FFD941 !important; }
/* Plein écran dans le tiroir : son menu s'ouvre vers le HAUT pour rester visible */
#rua-fs-drawer .rua-fullscreen-wrap { position: relative !important; display: inline-flex !important; gap: 6px; }
#rua-fs-drawer .rua-fullscreen-btn, #rua-fs-drawer .rua-fullscreen-arrow {
  width: 40px; height: 36px; border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.05) !important; color: #fff !important; border-radius: 10px !important; cursor: pointer;
}
#rua-fs-drawer .rua-fullscreen-menu {
  top: auto !important; bottom: 44px !important; right: 0 !important; left: auto !important;
}

/* ============================================================
 * v1.0.2 - Zoom à droite, Le Hub lisible, stats verticales, Filtres en popover.
 * ============================================================ */

/* Zoom +/- de MapLibre : déplacé À DROITE, sous la roue (n'est plus caché
   par le titre en haut à gauche). */
body.ru-atlas-standalone #ru-atlas-app .maplibregl-ctrl-top-left {
  top: calc(var(--rua-top-safe,0px) + 118px) !important; left: auto !important; right: 16px !important;
}
body.ru-atlas-standalone #ru-atlas-app .maplibregl-ctrl-top-left .maplibregl-ctrl { margin: 0 !important; }

/* Le Hub : OR sur noir, lisible au repos (fini le texte foncé sur foncé) */
.rua-fs-hub {
  color: #FFD941 !important; background: rgba(8,9,12,.92) !important;
  border-color: rgba(255,217,65,.5) !important; font-weight: 700 !important;
}
.rua-fs-hub:hover { background: #FFD941 !important; color: #171100 !important; border-color: #FFD941 !important; }

/* --- Les 4 cases (PINS / INDIVIDUS / ENTREPRISES / MEDIAS) + Filtres :
       à DROITE, au MILIEU de l'image (entre le globe et la roue) par défaut.
       Au zoom, le titre à gauche disparaît et ce groupe le REMPLACE à gauche.
       Accroché au body ; le fondu est piloté par le JS. --- */
#rua-fs-bl {
  position: fixed; top: 56%; right: 16px; left: auto; bottom: auto; transform: translateY(-50%); z-index: 8;
  display: flex; flex-direction: column; align-items: flex-end; gap: 10px; max-width: 46vw;
  transition: opacity .3s ease;
}
body.rua-fs-zoomed #rua-fs-bl {
  right: auto; left: 24px; top: calc(var(--rua-top-safe,0px) + 96px); transform: none; align-items: flex-start;
}
body.ru-atlas-standalone #rua-fs-bl > * {
  position: static !important; inset: auto !important; margin: 0 !important;
}

/* Chaque stat = une VRAIE case (boîte), les 4 empilées verticalement */
body.ru-atlas-standalone #rua-fs-bl #rua-stats {
  flex-direction: column !important; align-items: stretch !important; gap: 8px !important;
  background: transparent !important; border: 0 !important; padding: 0 !important; backdrop-filter: none !important;
}
body.ru-atlas-standalone #rua-fs-bl #rua-stats .rua-stat {
  display: flex !important; flex-direction: row !important; align-items: center !important;
  justify-content: flex-start !important; gap: 12px !important; width: 190px; box-sizing: border-box;
  background: rgba(10,12,18,.82) !important; border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 12px !important; padding: 11px 16px !important; backdrop-filter: blur(6px);
}
body.ru-atlas-standalone #rua-fs-bl #rua-stats .rua-stat-num {
  font-size: 21px !important; font-weight: 900 !important; color: #FFD941 !important;
  width: 32px; text-align: right; flex: 0 0 auto;
}
body.ru-atlas-standalone #rua-fs-bl #rua-stats .rua-stat-lbl {
  font-size: 11px !important; letter-spacing: .8px !important; text-transform: uppercase;
  color: rgba(255,255,255,.82) !important;
}
/* La case « ? » : petite pastille CLIQUABLE (zone plus large que le rond
   visible pour ne pas rater le survol). */
body.ru-atlas-standalone #rua-fs-bl #rua-stats .rua-stat-help {
  min-width: 0 !important; width: auto !important; align-self: flex-end !important;
  background: transparent !important; border: 0 !important; padding: 8px !important;
  position: relative !important; cursor: pointer !important;
}
body.ru-atlas-standalone #rua-fs-bl #rua-stats .rua-stat-help-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 50%; font-size: 13px; font-weight: 800; line-height: 1;
  border: 1px solid rgba(255,255,255,.5) !important; color: #fff !important;
  background: rgba(10,12,18,.9); backdrop-filter: blur(6px);
  transition: border-color .15s, color .15s, background .15s;
}
body.ru-atlas-standalone #rua-fs-bl #rua-stats .rua-stat-help:hover .rua-stat-help-icon,
body.ru-atlas-standalone #rua-fs-bl #rua-stats .rua-stat-help.rua-tip-open .rua-stat-help-icon {
  border-color: #FFD941 !important; color: #171100 !important; background: #FFD941 !important;
}
/* Infobulle stylée (remplace le title natif moche). Elle s'ouvre sur le CÔTÉ
   (vers le globe) pour ne jamais recouvrir les 4 cases. */
.rua-fs-tip {
  position: absolute; right: calc(100% + 12px); left: auto; top: 50%; transform: translateY(-50%);
  width: 264px; max-width: 72vw;
  background: rgba(12,13,17,.98); border: 1px solid rgba(255,255,255,.16); border-radius: 12px;
  box-shadow: 0 16px 44px rgba(0,0,0,.55); padding: 12px 14px;
  color: rgba(255,255,255,.9); font-size: 12.5px; line-height: 1.5; font-weight: 400; text-align: left;
  font-family: 'Inter',-apple-system,'Segoe UI',sans-serif;
  opacity: 0; pointer-events: none; transition: opacity .18s;
  z-index: 2147483500;
}
.rua-stat-help:hover .rua-fs-tip,
.rua-stat-help:focus .rua-fs-tip,
.rua-stat-help:focus-within .rua-fs-tip,
.rua-stat-help.rua-tip-open .rua-fs-tip {
  opacity: 1; pointer-events: auto;
}
/* Au zoom (bloc à gauche), l'infobulle s'ouvre vers la droite */
body.rua-fs-zoomed .rua-fs-tip { right: auto; left: calc(100% + 12px); }

/* Bouton « Filtres » */
#rua-fs-filterbtn {
  display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
  background: rgba(10,12,18,.72); border: 1px solid rgba(255,255,255,.14); color: #fff;
  border-radius: 11px; padding: 10px 14px; font-weight: 700; font-size: 13px;
  font-family: 'Inter',-apple-system,'Segoe UI',sans-serif; backdrop-filter: blur(6px);
}
#rua-fs-filterbtn:hover { border-color: #FFD941; }
#rua-fs-filterbtn svg { color: #FFD941; }

/* Popover des filtres : même côté que le bouton (droite par défaut, gauche au zoom) */
#rua-fs-filterpop {
  position: fixed; top: calc(var(--rua-top-safe,0px) + 210px); right: 16px; left: auto; bottom: auto;
  z-index: 2147483300; width: 300px; max-width: 88vw;
  background: rgba(10,12,18,.97); border: 1px solid rgba(255,255,255,.14); border-radius: 14px;
  box-shadow: 0 20px 60px rgba(0,0,0,.55); backdrop-filter: blur(14px);
  transform: translateY(10px); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s;
  font-family: 'Inter',-apple-system,'Segoe UI',sans-serif;
}
body.rua-fs-zoomed #rua-fs-filterpop { right: auto; left: 16px; top: calc(var(--rua-top-safe,0px) + 118px); }
#rua-fs-filterpop.open { transform: none; opacity: 1; pointer-events: auto; }
.rua-fs-pophd { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px 6px; }
.rua-fs-pophd b { color: #FFD941; font-size: 12.5px; letter-spacing: .6px; text-transform: uppercase; }
.rua-fs-pophd #rua-fs-popclose {
  width: 28px; height: 28px; border-radius: 8px; border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.05); color: #fff; font-size: 18px; line-height: 1; cursor: pointer;
}
/* Filtres dans le popover : composant AUTONOME. Comme il vit sur le body,
   les styles #ru-atlas-app du moteur ne s'appliquent plus : on redéclare TOUT
   (sinon le SVG de la loupe et de reset n'ont pas de taille et remplissent
   tout l'espace). */
body.ru-atlas-standalone #rua-fs-filterpop .rua-filters {
  position: static !important; inset: auto !important; transform: none !important;
  display: flex !important; flex-direction: column !important; align-items: stretch !important;
  gap: 10px !important; background: transparent !important; border: 0 !important;
  padding: 4px 14px 16px !important; max-width: none !important;
}
#rua-fs-filterpop .rua-filter-pills {
  display: flex !important; flex-wrap: wrap; gap: 6px !important;
  background: transparent !important; border: 0 !important; padding: 0 !important;
}
body.ru-atlas-standalone #rua-fs-filterpop .rua-filter-pill {
  flex: 1 1 auto; text-align: center; white-space: nowrap;
  font-size: 12.5px !important; padding: 8px 12px !important; border-radius: 10px !important;
  font-weight: 700 !important; border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.05) !important; color: rgba(255,255,255,.8) !important; cursor: pointer;
}
body.ru-atlas-standalone #rua-fs-filterpop .rua-filter-pill.active {
  background: #FFD941 !important; color: #171100 !important; border-color: #FFD941 !important;
}
/* Champ de recherche : loupe à gauche, TAILLE FIXE de l'icône */
#rua-fs-filterpop .rua-filter-search {
  position: relative !important; display: flex !important; align-items: center !important; width: 100% !important;
}
#rua-fs-filterpop .rua-filter-search-ico {
  position: absolute !important; left: 12px !important; top: 50% !important; transform: translateY(-50%) !important;
  width: 16px !important; height: 16px !important; flex: 0 0 auto;
  color: rgba(255,255,255,.5) !important; pointer-events: none;
}
body.ru-atlas-standalone #rua-fs-filterpop #rua-search {
  width: 100% !important; max-width: none !important; box-sizing: border-box;
  padding: 10px 12px 10px 38px !important; font-size: 13px !important;
  background: #0d1017 !important; border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 10px !important; color: #fff !important; outline: none;
}
#rua-fs-filterpop #rua-search:focus { border-color: #FFD941 !important; }
#rua-fs-filterpop #rua-search::placeholder { color: rgba(255,255,255,.4) !important; }
/* Réinitialiser : bouton pleine largeur, icône petite */
body.ru-atlas-standalone #rua-fs-filterpop .rua-filter-reset {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  gap: 8px !important; width: 100%; padding: 9px 12px !important;
  font-size: 12.5px !important; font-weight: 700 !important; font-family: 'Inter',sans-serif !important;
  background: rgba(255,255,255,.05) !important; border: 1px solid rgba(255,255,255,.14) !important;
  color: rgba(255,255,255,.85) !important; border-radius: 10px !important; cursor: pointer;
}
#rua-fs-filterpop .rua-filter-reset:hover { border-color: #FFD941 !important; color: #fff !important; }
/* GARDE-FOU : aucun SVG géant dans le popover, quoi qu'il arrive */
#rua-fs-filterpop svg { width: 16px !important; height: 16px !important; flex: 0 0 auto; max-width: 16px; max-height: 16px; }

@media (max-width: 820px) {
  #rua-fs-bl { max-width: 60vw; }
  #rua-fs-filterpop, body.rua-fs-zoomed #rua-fs-filterpop { width: auto; left: 12px !important; right: 12px !important; }
}

/* ---------- Sélecteur de langue RU Translator sur la page atlas ----------
   Toujours visible au-dessus de la carte (mais sous le tiroir « Affichage »),
   et, à sa place par défaut (haut droite), décalé à gauche de la colonne
   Partager / engrenage / zoom pour ne jamais se cacher derrière. */
body.ru-atlas-standalone #rutr-sw-float { z-index: 2147483100 !important; }
body.ru-atlas-standalone #rutr-sw-float.rutr-sw-float--top-right {
  top: calc(var(--rua-top-safe, 0px) + 18px); right: 82px;
}
body.ru-atlas-standalone #rutr-sw-float.rutr-sw-float--top-left {
  top: calc(var(--rua-top-safe, 0px) + 18px); left: 250px;
}

/* Standard mobile RU (coque mobile, livraison 1, 2026-10-09) : champs à 16 px
   sur écran tactile (sous 16 px, certains téléphones zooment la page au
   toucher d'un champ). Ordinateur (souris) : rien ne change. */
@media (pointer:coarse){
  #rua-fs-filterpop :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea),
  body.ru-atlas-standalone .rua-sheet-wrap :is(input[type=text],textarea){font-size:16px !important}
}
