/* ============================================
   CSS CUSTOM PROPERTIES (VARIABLES)
   Global Design Tokens for Sportrak
   ============================================ */

/* Color Palette - Neutral Grays (Slate Scale) */
:root {
    --slate-50: #f8fafc;
    --slate-100: #f1f5f9;
    --slate-200: #e2e8f0;
    --slate-300: #cbd5e1;
    --slate-400: #94a3b8;
    --slate-500: #64748b;
    --slate-600: #475569;
    --slate-700: #334155;
    --slate-800: #1e293b;
    --slate-900: #0f172a;

    /* Semantic Colors - Success (Green Scale) */
    --green-50: #f0fdf4;
    --green-100: #dcfce7;
    --green-300: #86efac;
    --green-500: #22c55e;
    --green-600: #16a34a;
    --green-700: #15803d;

    /* Semantic Colors - Danger (Red Scale) */
    --red-50: #fef2f2;
    --red-100: #fee2e2;
    --red-200: #fecaca;
    --red-500: #ef4444;
    --red-600: #dc2626;
    --red-700: #b91c1c;

    /* Semantic Colors - Warning (Amber Scale) */
    --amber-50: #fffbeb;
    --amber-100: #fef3c7;
    --amber-500: #f59e0b;
    --amber-600: #d97706;
    --amber-700: #b45309;

    /* Semantic Colors - Info (Cyan Scale) */
    --cyan-50: #ecfeff;
    --cyan-100: #cffafe;
    --cyan-500: #06b6d4;
    --cyan-600: #0891b2;
    --cyan-700: #0e7490;
}

/* Future: You can add more variables here */
/* - Typography scales */
/* - Spacing scales */
/* - Border radius values */
/* - Shadow values */
/* - Z-index layers */