/**
 * Curestry Design System - Color Tokens
 *
 * Централизованная система управления цветами для всех страниц сайта.
 * Все цвета определены в одном месте для простоты управления темой.
 *
 * Usage: var(--color-bg-primary)
 * Brand Guide v1.0 - Teal-forward dark theme
 */

:root {
    /* === Background Colors === */
    --color-bg-primary: #0D1110;        /* Основной фон (Main BG) */
    --color-bg-secondary: #111A18;      /* Вторичный фон (Secondary BG - cards, modals) */
    --color-bg-tertiary: #162524;       /* Третичный фон (Tertiary BG - elevated cards) */
    --color-bg-highlight: #0F2320;      /* Фон выделения (chips, code areas, active states) */
    --color-bg-card: rgba(17, 26, 24, 0.7);  /* Фон карточек (полупрозрачный) */
    --color-bg-card-solid: #111A18;     /* Фон карточек (непрозрачный) */
    --color-bg-overlay: rgba(0, 0, 0, 0.8);  /* Фон оверлеев */

    /* === Primary Brand Colors === */
    --color-primary: #2AC8AA;           /* Primary Teal - main brand color */
    --color-primary-hover: #39D8BA;     /* Primary hover state */
    --color-primary-active: #1FA98E;    /* Primary active/pressed state */
    --color-primary-secondary: #16625A; /* Darker accent */
    --color-primary-tertiary: #6FB1A6;  /* Muted accent */

    /* === Secondary Accent Colors === */
    --color-accent-blue: #4CA7E8;       /* Cool Blue - links, charts */
    --color-accent-aqua: #41DECC;       /* Aqua Highlight - complements teal */
    --color-accent-purple: #A68CFF;     /* Soft Purple - AI, metadata */

    /* === Semantic Colors === */
    --color-success: #32D39A;           /* Success - paired to teal family */
    --color-warning: #FFB547;           /* Warning - caution states */
    --color-danger: #FF6B6B;            /* Error - error states */
    --color-info: #3FA6FF;              /* Information - info messages */

    /* === Text Colors (Teal-tinted Neutrals) === */
    --color-text-primary: #F2FFFD;      /* Title text (Neutral 100 - tinted white) */
    --color-text-secondary: #E3F6F4;    /* Subtitle text, H3-H4 (Neutral 200) */
    --color-text-body: #CCE8E4;         /* Primary body text (Neutral 300) */
    --color-text-body-secondary: #B5D7D3; /* Secondary body text (Neutral 400) */
    --color-text-muted: #8FAEAB;        /* Muted text, icons (Neutral 500) */
    --color-text-label: #6D8986;        /* Labels, captions, metadata (Neutral 600) */
    --color-text-disabled: #425A58;     /* Disabled, low-emphasis (Neutral 700) */

    /* === Neutral Dark (Shadows, Deep Layers) === */
    --color-neutral-800: #1A2C2A;       /* Deep surfaces, shadows */
    --color-neutral-900: #0F1A19;       /* Darkest neutral */

    /* === Border Colors === */
    --color-border-primary: rgba(66, 90, 88, 0.3);      /* Основные границы */
    --color-border-secondary: rgba(66, 90, 88, 0.2);    /* Вторичные границы */
    --color-border-accent: rgba(42, 200, 170, 0.3);     /* Акцентные границы (teal) */
    --color-border-hover: rgba(42, 200, 170, 0.5);      /* Границы при наведении */

    /* === Shadow Colors === */
    --color-shadow-sm: rgba(0, 0, 0, 0.2);                 /* Малая тень */
    --color-shadow-md: rgba(0, 0, 0, 0.4);                 /* Средняя тень */
    --color-shadow-lg: rgba(0, 0, 0, 0.6);                 /* Большая тень */
    --color-shadow-neon: rgba(42, 200, 170, 0.2);          /* Неоновое свечение (teal) */
    --color-shadow-neon-intense: rgba(42, 200, 170, 0.4);  /* Интенсивное свечение */

    /* === Gradient Colors === */
    --gradient-primary: linear-gradient(135deg, #2AC8AA 0%, #16625A 100%);
    --gradient-accent: linear-gradient(90deg, #2AC8AA, #41DECC, #4CA7E8);
    --gradient-radial: radial-gradient(circle at top right, rgba(42, 200, 170, 0.1) 0%, rgba(17, 26, 24, 0.95) 60%, #0D1110 100%);
    --gradient-text: linear-gradient(135deg, #F2FFFD 0%, #CCE8E4 100%);

    /* === Interactive States === */
    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-hover);
    --color-button-bg: var(--color-primary);
    --color-button-bg-hover: var(--color-primary-hover);
    --color-button-text: #0D1110;

    /* === Spacing & Layout === */
    --spacing-xs: 0.25rem;    /* 4px */
    --spacing-sm: 0.5rem;     /* 8px */
    --spacing-md: 1rem;       /* 16px */
    --spacing-lg: 1.5rem;     /* 24px */
    --spacing-xl: 2rem;       /* 32px */
    --spacing-2xl: 3rem;      /* 48px */

    /* === Border Radius === */
    --radius-sm: 0.375rem;    /* 6px */
    --radius-md: 0.5rem;      /* 8px */
    --radius-lg: 0.75rem;     /* 12px */
    --radius-xl: 1.25rem;     /* 20px */
    --radius-full: 9999px;    /* Full rounded */

    /* === Transitions === */
    --transition-fast: 150ms ease;
    --transition-base: 200ms ease;
    --transition-slow: 300ms ease;
    --transition-all: all 300ms ease;

    /* === Z-Index === */
    --z-index-dropdown: 1000;
    --z-index-sticky: 1020;
    --z-index-fixed: 1030;
    --z-index-modal: 1040;
    --z-index-popover: 1050;
    --z-index-tooltip: 1060;
}

/* === Dark Theme Overrides (if needed) === */
[data-theme="dark"] {
    /* Уже темная тема по умолчанию */
}

/* === Light Theme (future) === */
[data-theme="light"] {
    --color-bg-primary: #ffffff;
    --color-bg-secondary: #f8fafc;
    --color-bg-card: rgba(255, 255, 255, 0.9);
    --color-text-primary: #0a0e1a;
    --color-text-secondary: #334155;
    --color-text-muted: #64748b;
}

/* === Utility Classes === */
.bg-primary { background-color: var(--color-bg-primary); }
.bg-secondary { background-color: var(--color-bg-secondary); }
.bg-tertiary { background-color: var(--color-bg-tertiary); }
.bg-card { background-color: var(--color-bg-card); }

.text-primary { color: var(--color-text-primary); }
.text-secondary { color: var(--color-text-secondary); }
.text-body { color: var(--color-text-body); }
.text-muted { color: var(--color-text-muted); }
.text-label { color: var(--color-text-label); }

.text-brand { color: var(--color-primary); }
.text-success { color: var(--color-success); }
.text-warning { color: var(--color-warning); }
.text-danger { color: var(--color-danger); }
.text-info { color: var(--color-info); }

.border-primary { border-color: var(--color-border-primary); }
.border-accent { border-color: var(--color-border-accent); }

.transition-fast { transition: var(--transition-fast); }
.transition-base { transition: var(--transition-base); }
.transition-slow { transition: var(--transition-slow); }