@import url('./brand.css');

/* Charts inherit the same semantic tokens as the Faros platform shell. */
.rv-chart {
  --rv-ink: var(--faros-foreground, #0a0a0a);
  --rv-muted: var(--faros-muted, #737373);
  --rv-rule: var(--faros-border, #e5e5e5);
  --rv-surface: var(--faros-card, #fff);
  --rv-subtle: var(--faros-subtle, #f5f5f5);
  --rv-accent: var(--faros-primary, #e10014);
  --rv-positive: var(--faros-positive, #287f3f);
  --rv-negative: var(--faros-negative, #c03807);
  position: relative;
  min-width: 0;
  color: var(--rv-ink);
  background: var(--rv-surface);
  font: 400 14px/1.5 var(--faros-font-sans, Waldenburg, Arial, sans-serif);
  font-variant-numeric: tabular-nums;
}
.rv-chart *, .rv-chart *::before, .rv-chart *::after { box-sizing: border-box; }
.rv-scroll { width: 100%; overflow: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; }
.rv-svg { display: block; overflow: visible; color: var(--rv-ink); fill: var(--rv-ink); }
.rv-svg text { font-family: var(--faros-font-sans, Waldenburg, Arial, sans-serif); font-size: 13px; }
.rv-svg .rv-tick { fill: var(--rv-muted); font-size: 12px; font-weight: 400; }
.rv-svg .rv-axis-title { fill: var(--rv-muted); font-size: 12px; font-weight: 500; }
.rv-svg .rv-label { font-size: 13px; }
.rv-svg .rv-note { fill: var(--rv-muted); font-size: 12px; }
.rv-axis { stroke: var(--rv-rule); stroke-width: 1; }
.rv-grid { stroke: var(--rv-rule); stroke-width: 1; stroke-dasharray: 2 4; }
.rv-reference { stroke: var(--rv-muted); stroke-width: 1.2; stroke-dasharray: 5 4; }
.rv-mark { transition: opacity 120ms ease-out; }
.rv-mark:focus { outline: none; }
.rv-mark:focus-visible { outline: 2px solid var(--faros-focus, var(--rv-accent)); outline-offset: 4px; }
.rv-mark[role="button"] { cursor: pointer; }
.rv-legend { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 8px 24px 20px; padding: 0; list-style: none; }
.rv-legend li { display: flex; align-items: center; gap: 8px; min-height: 24px; font-size: 12px; }
.rv-swatch { flex: 0 0 10px; width: 10px; height: 10px; border: 1px solid currentColor; border-radius: 50%; }
.rv-tooltip { position: absolute; z-index: 4; max-width: min(360px, calc(100% - 16px)); padding: 12px 16px; background: var(--faros-tooltip-bg, #0a0a0a); color: var(--faros-tooltip-ink, #fafafa); border-radius: var(--faros-radius-control, 6px); box-shadow: 0 4px 12px rgb(0 0 0 / 16%); pointer-events: none; font-size: 13px; }
.rv-tooltip div:first-child { font-weight: 600; }
.rv-tooltip div + div { margin-top: 3px; }
.rv-empty { min-height: 320px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px; text-align: center; background: var(--rv-subtle); }
.rv-empty strong { font-size: 20px; }
.rv-empty p { max-width: 54ch; margin: 12px 0 0; color: var(--rv-muted); }
.rv-data { border-top: 1px solid var(--rv-rule); padding: 0 24px; }
.rv-data summary { cursor: pointer; padding: 16px 0; font-weight: 500; }
.rv-data table { border-collapse: collapse; width: 100%; font-size: 13px; }
.rv-data caption { text-align: left; color: var(--rv-muted); padding: 8px 0 16px; }
.rv-data th, .rv-data td { text-align: left; border-bottom: 1px solid var(--rv-rule); padding: 10px 16px 10px 0; white-space: nowrap; }
.rv-data th { font-weight: 600; }
.rv-data td { font-size: 12px; font-variant-numeric: tabular-nums; }
.rv-footnote { padding: 0 24px 16px; margin: 0; color: var(--rv-muted); font-size: 12px; max-width: 85ch; }
.rv-scroll-hint { margin: 0; padding: 12px 16px 0; color: var(--rv-muted); font-size: 12px; }
.rv-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.rv-scroll:focus-visible, .rv-data summary:focus-visible { outline: 2px solid var(--faros-focus, var(--rv-accent)); outline-offset: -2px; }
@media (prefers-reduced-motion: reduce) { .rv-chart * { transition: none !important; animation: none !important; } }