/* styles/views/map-reveal-v1.css — extrait de styles.css L1198-L1330. Map reveal V1. */

/* ================================== MAP REVEAL ====================== */
.map-reveal-overlay{
  position:fixed;inset:0;z-index:200;
  background:rgba(0,0,0,.95);
  display:flex;flex-direction:column;
  opacity:0;
  transition:opacity .35s ease;
}
.map-reveal-overlay.show{opacity:1}

.map-reveal-map{
  flex:1;width:100%;min-height:0;
}

/* Leaflet overrides for dark theme */
.map-reveal-map .leaflet-control-zoom a{
  background:var(--panel);color:var(--fg);border-color:var(--border-strong);
}
.map-reveal-map .leaflet-control-zoom a:hover{
  background:var(--panel-2);
}

/* Station markers */
/* Station markers.
 *
 * `.map-marker-icon` = wrapper Leaflet, taille 1×1 au lat/lng exact.
 * `.map-marker` = contenu (nom + tag + chips), placé en absolute au-dessus
 *                 du point de telle sorte que le DOT soit sur (0,0) Leaflet.
 *
 * Stratégie : le DOT est positionné en `position:absolute; left:0; top:0`
 * avec sa propre translate de centrage, donc sa position ne dépend PAS
 * de la taille du contenu texte (qui peut varier). Le texte flotte
 * au-dessus sans affecter l'ancre. */
.map-marker-icon{
  background:none !important;border:none !important;
  overflow:visible !important;
}
.map-marker{
  position:relative;
  width:0; height:0;
  pointer-events:none;
}
.map-marker::after{
  content:'';
  position:absolute; left:0; top:0;
  width:12px;height:12px;border-radius:50%;
  margin-left:-6px; margin-top:-6px;
  background:var(--mc, #00ffc8);
  border:2px solid #fff;
  box-shadow:0 0 10px var(--mc, #00ffc8);
}
/* Contenu texte : empilé au-dessus du dot, centré horizontalement. */
.map-marker > .map-marker-tag,
.map-marker > .map-marker-name,
.map-marker > .map-marker-lines{
  position:absolute;
  left:0;
  transform:translateX(-50%);
  white-space:nowrap;
}
.map-marker > .map-marker-tag  { bottom:32px; }
.map-marker > .map-marker-name { bottom:10px; }
.map-marker > .map-marker-lines{ top:14px; }
.map-marker-tag{
  font-family:var(--mono);font-size:10px;font-weight:600;
  letter-spacing:.6px;text-transform:uppercase;
  color:var(--mc);
  text-shadow:0 1px 4px rgba(0,0,0,.8);
}
.map-marker-name{
  font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:-.13px;
  color:#fff;white-space:nowrap;
  text-shadow:0 1px 6px rgba(0,0,0,.9), 0 0 20px rgba(0,0,0,.6);
  background:rgba(10,10,10,.7);
  padding:2px 10px;border-radius:var(--r-pill);
  border:1px solid var(--mc, #00ffc8);
}
.map-marker-dep .map-marker-name{border-color:#00ffc8}
.map-marker-arr .map-marker-name{border-color:#22c55e}
.map-marker-corr .map-marker-name{border-color:#f59e0b; font-size:11px}

/* Lignes desservant une station — rendues horizontalement sous le nom */
.map-marker-lines{
  display:flex;flex-wrap:nowrap;gap:3px;justify-content:center;align-items:center;
  margin-top:4px;
  pointer-events:none;
  white-space:nowrap;
}
.map-marker-line-dot{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:16px;height:16px;padding:0 4px;border-radius:8px;
  font-family:var(--mono);font-size:10px;font-weight:700;
  line-height:1;letter-spacing:0;
  box-shadow:0 1px 4px rgba(0,0,0,.6);
  border:1px solid rgba(0,0,0,.35);
  flex-shrink:0;
}

/* Line number badges on route traces */
.map-line-badge-icon{background:none !important;border:none !important}
.map-line-badge{
  display:flex;align-items:center;justify-content:center;
  width:28px;height:28px;border-radius:50%;
  font-family:var(--display, 'Space Grotesk', sans-serif);
  font-size:12px;font-weight:700;
  line-height:1;
  box-shadow:0 0 6px rgba(0,0,0,.6), 0 0 12px rgba(0,0,0,.3);
  border:2px solid rgba(255,255,255,.25);
  pointer-events:none;
}

/* Bottom bar on map — reuses ri- classes */
.map-reveal-bar{
  display:flex;align-items:center;gap:20px;
  padding:14px 24px;
  justify-content:center;
  background:rgba(14,14,14,.92);
  backdrop-filter:blur(12px);
  border-top:1.5px solid var(--rank-color, #00ffc8);
  box-shadow:0 -8px 30px rgba(0,0,0,.5), 0 0 30px -8px var(--rank-color, #00ffc8);
  flex-wrap:wrap;
  opacity:1;
  animation:map-bar-in .4s cubic-bezier(.34,1.56,.64,1) both;
}
@keyframes map-bar-in{
  from { opacity:0; transform:translateY(20px); }
  to   { opacity:1; transform:translateY(0);    }
}
.map-reveal-bar.show{
  opacity:1;
  transform:translateY(0);
}