/* bubble-map.css — Bubble Map (vue Bulles) + bascule de vue.
   Extrait/adapté de design-system-ref/ui_kits/app/app.css.
   S'appuie sur les tokens de design-system.css (--accent, --bull, --bear,
   --bg-elevated, --bg-void, --border-subtle, --r-md, --r-lg, --font-mono…).
   page-head / eyebrow / bm-bar / bm-filter viennent de calendar-eco.css. */

/* ── Légende (Entrées / Sorties) ── */
.bm-legend { display: flex; gap: 18px; flex-wrap: wrap; }
.bm-legend__item { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 12px; color: var(--text-body); font-variant-numeric: tabular-nums; }
.bm-legend__item i { width: 9px; height: 9px; border-radius: 999px; display: inline-block; }

/* ── Panneau / scène canvas ── */
.panel { background: var(--bg-elevated); border: 1px solid var(--border-subtle); border-radius: var(--r-lg); padding: 22px; }
.bm-stage { position: relative; padding: 0; overflow: hidden; height: calc(100vh - 220px); min-height: 520px; background: var(--bg-void); }
.bm-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.bm-tag { position: absolute; right: 16px; bottom: 12px; font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.14em; color: var(--text-muted); opacity: 0.7; pointer-events: none; }

@media (max-width: 760px) {
  .bm-stage { height: calc(100vh - 240px); min-height: 460px; }
}

/* ── Bascule de vue (segmented control) ── */
.view-toggle { display: inline-flex; gap: 2px; padding: 3px; background: var(--bg-elevated); border: 1px solid var(--border-subtle); border-radius: var(--r-md); }
.vt-btn { font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: 0.04em; padding: 7px 16px; background: transparent; border: none; border-radius: var(--r-sm); color: var(--text-muted); cursor: pointer; transition: color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out); white-space: nowrap; }
.vt-btn:hover { color: var(--text-body); }
.vt-btn.on { background: var(--accent); color: var(--bg-void); }
