:root {
  /* Основные цвета */
  --primary-color: #6200EA;  /* Глубокий фиолетовый */
  --primary-light: #7C4DFF;  /* Светлый фиолетовый */
  --primary-dark: #4A148C;   /* Темный фиолетовый */
  
  --secondary-color: #00BFA5; /* Бирюзовый */
  --secondary-light: #1DE9B6; /* Светлый бирюзовый */
  --secondary-dark: #00897B;  /* Темный бирюзовый */
  
  --accent-color: #FF6D00;    /* Оранжевый */
  --accent-light: #FF9E40;    /* Светлый оранжевый */
  --accent-dark: #E65100;     /* Темный оранжевый */
  
  /* Нейтральные тона */
  --dark-color: #263238;      /* Темно-синий */
  --dark-light: #37474F;
  --dark-dark: #102027;
  
  --light-color: #F9FAFB;
  --light-dark: #ECEFF1;
  
  --white: #FFFFFF;
  
  /* Оттенки серого */
  --gray-100: #F9FAFB;
  --gray-200: #ECEFF1;
  --gray-300: #CFD8DC;
  --gray-400: #B0BEC5;
  --gray-500: #78909C;
  --gray-600: #546E7A;
  --gray-700: #37474F;
  --gray-800: #263238;
  --gray-900: #102027;
  
  /* Функциональные цвета */
  --success-color: #00C853;
  --error-color: #D50000;
  --warning-color: #FFD600;
  --info-color: #2979FF;
  
  /* Текстовые цвета */
  --text-dark: #263238;
  --text-light: #546E7A;
  --text-lighter: #78909C;
  --text-white: #FFFFFF;
  
  /* Граничные цвета */
  --border-color: #ECEFF1;
  --border-light: #F9FAFB;
  --border-dark: #CFD8DC;
  
  /* Цвета фона */
  --background-primary: #FFFFFF;
  --background-secondary: #F9FAFB;
  --background-tertiary: #ECEFF1;
  
  /* Цвета ховера */
  --hover-primary: #7C4DFF;
  --hover-secondary: #1DE9B6;
  --hover-accent: #FF9E40;
  
  /* Тени */
  --shadow-sm: 0 1px 3px rgba(38, 50, 56, 0.1);
  --shadow-md: 0 4px 6px rgba(38, 50, 56, 0.1);
  --shadow-lg: 0 10px 15px rgba(38, 50, 56, 0.1);
  --shadow-xl: 0 20px 25px rgba(38, 50, 56, 0.08);
}

/* Классы фонов */
.bg-primary { background-color: var(--primary-color); }
.bg-secondary { background-color: var(--secondary-color); }
.bg-accent { background-color: var(--accent-color); }
.bg-dark { background-color: var(--dark-color); }
.bg-light { background-color: var(--light-color); }
.bg-white { background-color: var(--white); }

/* Классы текста */
.text-primary { color: var(--primary-color); }
.text-secondary { color: var(--secondary-color); }
.text-accent { color: var(--accent-color); }
.text-dark { color: var(--text-dark); }
.text-light { color: var(--text-light); }
.text-white { color: var(--text-white); }

/* Классы границ */
.border-primary { border-color: var(--primary-color); }
.border-secondary { border-color: var(--secondary-color); }
.border-accent { border-color: var(--accent-color); }
.border-light { border-color: var(--border-light); }
.border-dark { border-color: var(--border-dark); }

/* Классы теней */
.shadow-sm { box-shadow: var(--shadow-sm); }
.shadow-md { box-shadow: var(--shadow-md); }
.shadow-lg { box-shadow: var(--shadow-lg); }
.shadow-xl { box-shadow: var(--shadow-xl); } 