/* My Home Estimate design tokens, exposed as CSS custom properties on :root.
   Scoped to :root (not a wrapper id like the firm dashboard's #firm_dashboard)
   because this stylesheet is only ever loaded on my-home-est pages.
   home.css should reference these instead of hardcoded hex values. */
:root {
  /* Ink / navy (text, dark surfaces) */
  --hve-navy: #10303f;
  --hve-navy-rgb: 16, 48, 63;
  --hve-ink: #17213d;
  --hve-slate-900: #1f3f4e;
  --hve-slate-700: #3b4a63;
  --hve-teal-900: #336579;

  /* Slate (body copy / meta) - slate-600, slate-400 and line/canvas below
     are the same brand tokens as the firm dashboard's design guide */
  --hve-slate-600: #5c6b80;
  --hve-slate-500: #7e93aa;
  --hve-slate-400: #94a3b8;
  --hve-slate-300: #afc0d2;

  /* Teal / blue brand accent */
  --hve-teal-600: #0e7fa8;
  --hve-teal-500: #12688a;
  --hve-teal-400: #619ab9;
  --hve-teal-300: #74a5bc;

  /* Green (trend / positive) */
  --hve-green-600: #15803d;
  --hve-green-100: #d3f0de;
  --hve-green-50: #f0fdf4;

  /* Borders */
  --hve-line: #e3e8ef;
  --hve-border: #cbd5e1;
  --hve-border-light: #dceaf1;

  /* Surfaces */
  --hve-canvas: #f3f5f8;
  --hve-surface: #f8fafc;
  --hve-surface-tint: #f1f7fa;
  --hve-surface-accent: #e9f1f6;
  --hve-surface-muted: #eef2f7;
  --hve-surface-empty: #e6eaf0;

  --hve-white: #fff;
  --hve-white-rgb: 255, 255, 255;
}
