/**
 * RK Spordikool Design Tokens
 * Base design system variables for consistent styling
 */

:root {
  /* Text & Surface Colors */
  --rk-text: #0f172a;          /* dark slate */
  --rk-muted: #64748b;         /* slate-500 */
  --rk-surface: #ffffff;
  --rk-surface-alt: #f8fafc;
  --rk-border: #eef2f7;

  /* Brand Colors - Updated to match style.css unified system */
  --rk-brand: #0066CC;         /* Updated to match style.css --rk-blue */
  --rk-brand-700: #0052a3;     /* Darker shade for hover states */
  --rk-brand-50: #e6f2ff;      /* Light blue background */

  --rk-primary: #FFD600;       /* Updated to match style.css --bright-yellow */
  --rk-primary-ink: #0f172a;   /* text on yellow */

  --rk-success: #28B946;       /* Updated to match style.css --rk-green */
  --rk-focus: #0066CC;         /* Updated to match --rk-brand */

  /* Legacy aliases for backward compatibility */
  --rk-green: #28B946;         /* Updated to match style.css */
  --rk-green-600: #1e9a3f;
  --rk-yellow: #FFD600;        /* Updated to match style.css */
  --rk-blue: #0066CC;          /* Updated to match style.css */
  --rk-bg: #f7fafc;
  --rk-text-soft: #475569;

  /* Shadows & radii */
  --rk-shadow-sm: 0 1px 2px rgba(15, 23, 42, .08);
  --rk-shadow-md: 0 8px 24px rgba(15, 23, 42, .10);
  --rk-radius-lg: 16px;
  --rk-radius-xl: 20px;

  /* Spacing scale */
  --rk-space-1: .25rem;
  --rk-space-2: .5rem;
  --rk-space-3: .75rem;
  --rk-space-4: 1rem;
  --rk-space-6: 1.5rem;
  --rk-space-8: 2rem;
  --rk-space-12: 3rem;
  --rk-space-16: 4rem;
  --rk-space-24: 6rem;

  /* Transitions */
  --rk-ease: cubic-bezier(.22,1,.36,1);
}