:root {
  /* Colors */
  --bg-color: #f4f6f8;
  --surface-color: #ffffff;
  --primary-color: #2563eb;
  --primary-hover: #1d4ed8;
  --danger-color: #dc2626;
  --danger-hover: #b91c1c;
  --text-primary: #1e293b;
  --text-secondary: #64748b;
  --border-color: #e2e8f0;
  
  /* Role & Status Colors */
  --role-teacher-bg: #dbeafe;
  --role-teacher-text: #1e40af;
  --role-therapist-bg: #ccfbf1;
  --role-therapist-text: #115e59;
  
  --status-active-bg: #dcfce7;
  --status-active-text: #166534;
  --status-banned-bg: #fee2e2;
  --status-banned-text: #991b1b;
  
  /* Validation Colors */
  --valid-color: #10b981;
  --invalid-color: #ef4444;

  /* Typography */
  --font-family: 'Inter', system-ui, -apple-system, sans-serif;
  
  /* Geometry & Spacing */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 9999px;
  
  /* Shadows & Depth */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.04);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.05);
  --shadow-hover: 0 8px 15px -3px rgba(37, 99, 235, 0.15);
  
  /* Transitions */
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-bounce: 300ms cubic-bezier(0.34, 1.56, 0.64, 1);
}