/* ============================================================
   Numeris — Color tokens
   Brand: dark canvas (#1B1D25) · electric green (#00DB78) · white
   ============================================================ */

:root {
  /* ---- Brand primitives ------------------------------------ */
  --color-ink-900: #14151B;   /* deepest — page void / overlays */
  --color-ink-800: #1B1D25;   /* BRAND canvas / background      */
  --color-ink-700: #22242E;   /* raised surface                 */
  --color-ink-600: #2A2D38;   /* card / panel                   */
  --color-ink-500: #343745;   /* hover surface / inset          */
  --color-ink-400: #434656;   /* strong border / divider hi     */

  --color-green-600: #00B863; /* pressed / active green         */
  --color-green-500: #00DB78; /* BRAND highlight                */
  --color-green-400: #2BE894; /* hover green                    */
  --color-green-300: #6FF2B7; /* soft accent                    */
  --color-green-tint: rgba(0, 219, 120, 0.12); /* green wash    */
  --color-green-tint-strong: rgba(0, 219, 120, 0.22);

  --color-white: #FFFFFF;

  /* ---- Neutral text ramp (white at alpha) ------------------ */
  --color-text-100: #FFFFFF;                  /* primary       */
  --color-text-200: rgba(255, 255, 255, 0.72);/* secondary     */
  --color-text-300: rgba(255, 255, 255, 0.52);/* tertiary      */
  --color-text-400: rgba(255, 255, 255, 0.36);/* disabled/hint */

  /* ---- Lines & borders (white at alpha) -------------------- */
  --color-border-subtle: rgba(255, 255, 255, 0.08);
  --color-border-default: rgba(255, 255, 255, 0.14);
  --color-border-strong: rgba(255, 255, 255, 0.24);

  /* ---- Semantic status ------------------------------------- */
  --color-success: #00DB78;
  --color-info: #4DA6FF;
  --color-warning: #FFC24D;
  --color-danger: #FF5C6C;
  --color-info-tint: rgba(77, 166, 255, 0.14);
  --color-warning-tint: rgba(255, 194, 77, 0.14);
  --color-danger-tint: rgba(255, 92, 108, 0.14);

  /* ============================================================
     Semantic aliases — reach for these in components
     ============================================================ */
  --bg-base: var(--color-ink-800);
  --bg-void: var(--color-ink-900);
  --surface-raised: var(--color-ink-700);
  --surface-card: var(--color-ink-600);
  --surface-hover: var(--color-ink-500);
  --surface-inset: var(--color-ink-900);

  --text-primary: var(--color-text-100);
  --text-secondary: var(--color-text-200);
  --text-muted: var(--color-text-300);
  --text-disabled: var(--color-text-400);
  --text-on-accent: #06231A;   /* near-black-green on green     */

  --accent: var(--color-green-500);
  --accent-hover: var(--color-green-400);
  --accent-pressed: var(--color-green-600);
  --accent-wash: var(--color-green-tint);

  --border-subtle: var(--color-border-subtle);
  --border-default: var(--color-border-default);
  --border-strong: var(--color-border-strong);

  --focus-ring: rgba(0, 219, 120, 0.55);
}