:root {
  /* Primary Colors */
  --color-teal: #00d1b2;
  /* --color-teal-dark: #00c4a7; */
  --color-blue-light: #3273dc; /* js*/
  --color-blue-sky: #f0f7ff;

  /* Neutral & Gray Colors */
  --color-gray-light: #f5f5f5;
  --color-gray-border: #dbdbdb;
  --color-gray-dark: #333;
  --color-gray-medium: #999;

  /* Accent & Alert Colors */
  --color-red-alert: #f14668;
  --color-red-delete: #d33;
  --color-green-success: #48c78e;
  --color-green-action: #4caf50;
  --color-blue-confirm: #3085d6;

  /* White */
  --color-white: #fff;

  /* Gradient Combinations */
  --color-gradient-primary: linear-gradient(135deg, #005088 0%, #0083ca 100%);
  --color-gradient-header: linear-gradient(135deg, #4287ce 0%, #185a9d 100%);
  --color-gradient-accent: linear-gradient(135deg, #3273dc 0%, #00d1b2 100%);
  --color-gradient-success: linear-gradient(to right, #00d1b2, #00c4a7);
  --color-gradient-danger: linear-gradient(to right, #ff3860, #ff1443);

  /* --- New Variables Added from Audit --- */

  /* Slate Scale (Dark to Light) */
  --color-slate-50: #f8fafc;
  --color-slate-100: #f1f5f9;
  --color-slate-200: #e2e8f0;
  --color-slate-300: #cbd5e1;
  --color-slate-400: #94a3b8;
  --color-slate-500: #64748b;
  --color-slate-600: #475569;
  --color-slate-700: #334155;
  --color-slate-800: #1e293b;
  --color-slate-900: #0f172a;

  /* Indigo Scale */
  --color-indigo-50: #eef2ff;
  --color-indigo-500: #6366f1;
  --color-indigo-600: #4f46e5;
  --color-indigo-700: #4338ca;

  /* Purple Scale */
  --color-purple-500: #9333ea;
  --color-purple-600: #7c3aed;
  --color-purple-700: #6d28d9;
  --color-purple-800: #5b21b6;
  --color-purple-900: #4c1d95;

  /* Extended Status Colors */
  --color-success-light: #10b981;
  --color-success-emerald: #059669;
  --color-warning: #f59e0b;
  --color-warning-dark: #92400e;
  --color-error: #ef4444;
  --color-error-dark: #dc2626;
  --color-error-darker: #7f1d1d;
  --color-info-cyan: #06b6d4;
  --color-info-purple: #665cac;

  /* Additional Blue Variants */
  --color-blue-primary: #3366ff;
  --color-blue-sky-dark: #1d72aa;
  --color-blue-focus: #4a80f5;
  --color-blue-action: #3569e0;

  /* Additional Accents */
  --color-cyan: #00c4cc;
  --color-rose: #f43f5e;
  --color-rose-dark: #ff3860;
  --color-emerald: #4BB543;

  /* Extended Neutrals */
  --color-gray-50: #f9f9f9;
  --color-gray-100: #f8f9fa;
  --color-gray-200: #eef6fc;
  --color-gray-300: #e8e8e8;
  --color-gray-400: #c6d3e3;
  --color-gray-500: #7a7a7a;
  --color-gray-600: #555;
  --color-gray-700: #495057;
  --color-gray-800: #363636;
  --color-gray-900: #000;
}