// Design tokens for the /trade-in/v2 "МЕРА Оценка" HUD/blueprint port.
// Faithful colour palette extracted from the pixel design (МЕРА Оценка.dc.html).
// This file is the shared colour contract for every v2 component — import from
// here instead of hardcoding hex literals (one-off SVG stroke/opacity may stay
// inline). NOTE: this is an isolated design port, so it intentionally does NOT
// reuse the global GenDesign analytics tokens (different visual language).

// Page background behind the 1536×1024 artboard.
export const pageBg = "#dde6ef";

export const tokens = {
  // Brand / accent
  accent: "#2e8bff",
  accentDeep: "#0d6fd6",
  accentLite: "#46a8ff",
  onAccent: "#fff", // opaque white text/glyph on accent-coloured surfaces (avatar initials)

  // Ink / headings
  ink: "#1c2c40",
  ink2: "#17263a",

  // Body text
  body: "#39506a",
  body2: "#46586c",

  // Muted text (light → lighter)
  muted: "#6f8195",
  muted2: "#91a1b4",
  muted3: "#9aaabb",
  muted4: "#b3c0cf",
  hint: "#8a9aac", // small helper / caption text

  // Borders & hairlines (strong → soft)
  line: "#c2d3e3",
  line2: "#c8d7e6",
  line3: "#b8c8d8", // photo/card edge, chart axes
  lineSoft: "#d3dfeb",
  lineSoft2: "#e2e9f1",
  lineSoft3: "#eef3f8",
  lineSoft4: "#eaf0f6", // pale-blue hairline — house-sales row separator (design line 462)
  lineGradient: "#cbd7e3", // decorative gradient line fade stops (footer hairline)

  // HUD corner brackets
  bracket: "#9bbce0",
  bracket2: "#8fb4dd",

  // Semantic
  success: "#1baa6b",
  successBorder: "#b6e0cc", // soft green border for success badges (В РАСЧЁТЕ)
  warn: "#b58a3e",
  gold: "#c79a3e",
  danger: "#cd6868",

  // Info-soft panel (data-quality box)
  infoSoftBg: "rgba(233,242,252,.5)", // translucent blue panel fill
  infoSoftBorder: "#d3e0ec", // soft blue panel border
  surfaceTint: "rgba(238,244,250,.5)", // translucent blue-tinted surface — KPI band + table footer (design lines 471, 487)

  // Data-viz tints (mini histograms / range bars / scatter)
  barLo: "#cfddec",
  barMid: "#a9cef5",
  track: "#dbe6f1", // range track + donut track
  scatterDeal: "#9aafc4", // grey "сделки" dots (price×time scatter charts)
  dealDot: "#8fa3b8", // grey "сделки" marker — map dot + legend (design 186, 203); darker than scatterDeal
  dotStroke: "#fff", // white outline ring around map marker dots (design 185-187)

  // Solid backgrounds
  photoBg: "#e7eef6", // hero photo container fill behind building image
  mapBg: "#e4ebf3", // map container fill behind blueprint SVG (design 156)
  badgeTint: "#eaf1f8", // opaque pale-blue fill — source badge ("Яндекс") chip (design line 484)

  // Disabled / no-data source card (02 RESULT · inactive source tile, design lines 366-384)
  disabledBorder: "#d8e2ec", // inactive source card edge
  disabledValue: "#c2cdd9", // greyed-out "—" count value
  disabledLabel: "#aab7c5", // greyed-out "нет данных" caption

  // Accent glow (range-marker dot halo, design lines 303/341)
  accentGlow: "rgba(46,139,255,.5)",

  // Translucent white surfaces (glass cards / overlays)
  surface: {
    w25: "rgba(255,255,255,.25)",
    w40: "rgba(255,255,255,.4)",
    w50: "rgba(255,255,255,.5)",
    w55: "rgba(255,255,255,.55)",
    w60: "rgba(255,255,255,.6)",
    w62: "rgba(255,255,255,.62)",
    w65: "rgba(255,255,255,.65)",
    w70: "rgba(255,255,255,.7)",
    w72: "rgba(255,255,255,.72)",
    w80: "rgba(255,255,255,.8)",
    w85: "rgba(255,255,255,.85)",
    w98: "rgba(255,255,255,.98)",
    w99: "rgba(255,255,255,.99)",
  },

  // Font CSS variables (provided by app/trade-in/v2/layout.tsx via next/font)
  font: {
    sans: "var(--font-manrope), sans-serif",
    mono: "var(--font-plex-mono), monospace",
  },

  // Artboard background (radial glows + blueprint grid + base gradient).
  // Ported verbatim from the design root div (lines 23-29).
  gradientBg: [
    "radial-gradient(620px 320px at 78% 16%, rgba(46,139,255,.07), transparent 60%)",
    "radial-gradient(560px 360px at 24% 64%, rgba(46,139,255,.055), transparent 60%)",
    "radial-gradient(480px 300px at 60% 92%, rgba(46,139,255,.04), transparent 60%)",
    "repeating-linear-gradient(0deg, rgba(120,150,180,.045) 0 1px, transparent 1px 38px)",
    "repeating-linear-gradient(90deg, rgba(120,150,180,.045) 0 1px, transparent 1px 38px)",
    "linear-gradient(160deg,#f4f8fc 0%,#eaf1f8 55%,#e6eef7 100%)",
  ].join(", "),

  pageBg,
};