/* v24 : sens de parcours (flèches, repères Départ / Arrivée, bandeau « sens conseillé », inversion) */

/* flèches de sens le long du tracé : discrètes (blanches, liseré sombre), jamais cliquables */
.fleche-sens { background: none !important; border: 0 !important; pointer-events: none !important; }
.fleche-sens svg { display: block; width: 16px; height: 16px; overflow: visible; filter: drop-shadow(0 0 1px rgba(17, 26, 36, .9)); }
.fleche-sens path { fill: #fff; stroke: #111A24; stroke-width: 1.4; stroke-linejoin: round; }

/* repères Départ / Arrivée étiquetés */
.repere-sens { background: none !important; border: 0 !important; pointer-events: none !important; }
.repere-sens i { position: absolute; inset: 0; border-radius: 50%; border: 3px solid #fff; box-shadow: 0 1px 5px rgba(0, 0, 0, .55); background: var(--ok); }
.repere-sens.arrivee i { background: var(--alerte); }
.repere-sens span { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); white-space: nowrap; padding: 2px 8px; border-radius: var(--rayon);
  background: var(--ok); color: #fff; font-size: 11.5px; font-weight: 800; letter-spacing: .01em; box-shadow: 0 1px 4px rgba(0, 0, 0, .45); }
.repere-sens.arrivee span { background: var(--alerte); }

/* bandeau du sens conseillé (fiche parcours) */
.bandeau-sens { display: flex; gap: 12px; align-items: flex-start; margin: 12px 0 4px; padding: 12px 14px; border-radius: var(--rayon); background: var(--surface); border: 1px solid var(--bord); }
.bandeau-sens .bs-ico { flex: 0 0 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; color: var(--ok); background: color-mix(in srgb, var(--ok) 16%, transparent); }
.bandeau-sens .bs-ico .ico { width: 22px; height: 22px; }
.bandeau-sens.autre .bs-ico { color: var(--accent); background: var(--accent-doux); }
.bandeau-sens.neutre .bs-ico { color: var(--texte2); background: var(--surface2); }
.bandeau-sens .bs-corps { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.bandeau-sens .bs-corps b { font-size: 1rem; line-height: 1.25; }
.bandeau-sens .bs-etat { font-size: .88rem; font-weight: 600; color: var(--ok); }
.bandeau-sens.autre .bs-etat { color: var(--accent); }
.bandeau-sens small { color: var(--texte2); font-size: .84rem; line-height: 1.35; }
.bandeau-sens #inverser { align-self: flex-start; margin-top: 6px; }
.bandeau-sens .info-sens { display: flex; gap: 6px; align-items: flex-start; margin: 4px 0 0; font-size: .82rem; line-height: 1.35; color: var(--texte2); }
.bandeau-sens .info-sens .ico { flex: 0 0 15px; width: 15px; height: 15px; margin-top: 1px; color: var(--ok); }
.bandeau-sens .info-sens.alerte { color: var(--texte); }
.bandeau-sens .info-sens.alerte .ico { color: var(--alerte); }
.pastille-info.sens-inverse { color: var(--accent); background: var(--accent-doux); }
.pastille-info.sens-inverse .ico { color: var(--accent); }