/* ============================================================
   Paymeter · iPark — Color tokens
   Cherry Red (#ea1744) accent · Deep Blue (#031927) ground
   MIA lime (#d4ff3a) is reserved for MIA contexts ONLY.
   ============================================================ */
:root {
  /* ---- Brand base ---- */
  --cherry: #ea1744;          /* primary accent — the single brand red */
  --cherry-hover: #c2113a;    /* darker red for hover (never red-on-red) */
  --deep-blue: #031927;       /* brand ground — text, dark surfaces */

  /* ---- Cherry red scale ---- */
  --red-50:  #fff1f4;
  --red-100: #ffe0e7;
  --red-200: #ffc2cf;
  --red-300: #fb8ea4;
  --red-500: #ea1744;
  --red-600: #c41440;

  /* ---- Deep blue scale ---- */
  --blue-900: #020f18;
  --blue-800: #051825;
  --blue-700: #0a2438;
  --blue-600: #15334a;
  --blue-500: #1f4660;
  --blue-400: #3a6285;
  --blue-300: #6088a8;
  --blue-200: #a6bccf;
  --blue-100: #d8e3ec;
  --blue-50:  #f1f5f9;

  /* ---- MIA sub-brand (Mobility Intelligence Agent) ---- */
  --mia-ink: #0C1116;         /* near-black ground for MIA logo, dark cards, check circles */
  --mia-ground: #0C1116;
  --mia-bg: #f6f7f9;          /* MIA surface (slightly cooler/lighter) */
  --mia-active: #BFEA5A;      /* MIA online/active status indicator ONLY — not a success color */
  --mia-active-bg: #e6f9ef;
  --mia-lime: #d4ff3a;        /* legacy MIA accent — superseded; MIA-only if used */

  /* ---- Neutrals / surfaces ---- */
  --bg: #ffffff;
  --surface: #f4f6fa;         /* Paymeter B2C soft surface */
  --surface-2: #f7f9fb;       /* iPark B2B soft surface */
  --border: #e6ebf0;
  --border-strong: #cfd7df;
  --border-dark: rgba(255, 255, 255, .12);

  /* ---- Text ---- */
  --fg: #031927;
  --fg-muted: #5c6a7a;
  --fg-subtle: #8a94a0;
  --fg-on-dark: #ffffff;
  --fg-on-dark-muted: rgba(255, 255, 255, .7);

  /* ---- Status ---- */
  --success: #0e8a4a;
  --success-bg: #e8f7ee;
  --success-border: #a8e0bd;
  --warning: #b25a00;
  --warning-bg: #fff3e0;
  --warning-border: #ffd6a0;
  --error: #d92b3a;          /* distinct from cherry — validation / failed payment */
  --error-bg: #fff1f2;
  --info: #1554b5;
  --info-bg: #e6f0ff;
  --info-border: #b8d0f5;

  /* ---- Warm beige (testimonials, physical-iPark / footer accents) ---- */
  --beige: #faf3dd;

  /* ---- Semantic aliases ---- */
  --accent: var(--cherry);
  --accent-hover: var(--cherry-hover);
  --accent-soft: var(--red-50);
  --accent-border: var(--red-100);
  --text-body: var(--fg);
  --text-muted: var(--fg-muted);
  --surface-card: var(--bg);
  --surface-dark: var(--deep-blue);

  /* ---- Brand gradients ---- */
  --grad-accent-text: linear-gradient(120deg, #ff5577, #ea1744, #c41440);  /* @kind color */
  --grad-dark: linear-gradient(135deg, #031927 0%, #0a2438 100%);          /* @kind color */
  --grad-red: linear-gradient(135deg, #ff5577 0%, #ea1744 60%, #c41440 100%); /* @kind color */
}