/**
 * Chart System Variables
 * 통합 변수 정의 (Colors, Spacing, Typography, Scaling)
 */

:root {
    /* 1. Brand Colors (기존 common.css, patient-chart.css 통합) */
    --primary-color: var(--color-primary);
    --primary-light: #e8f0fb;
    --primary-dark: var(--color-primary-hover);
    --accent-color: #3a9679;

    /* 2. Status Colors */
    --success-color: #28a745;
    --warning-color: #ffc107;
    --danger-color: #dc3545;
    --info-color: #17a2b8;

    /* 3. Text Colors */
    --text-color: #333;
    --text-light: #6c757d;
    --text-muted: #9ca3af;

    /* 4. Backgrounds & Borders */
    --background-color: #f8f9fa;
    --border-color: #e9ecef;
    --card-bg: #ffffff;
    --hover-background: #f1f3f4;

    /* 5. Shadows */
    --card-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    --card-shadow-hover: 0 8px 30px rgba(0, 0, 0, 0.12);

    /* 6. Spacing & Radius */
    --spacing-xs: 0.5rem;
    --spacing-sm: 0.75rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;

    --border-radius-small: 8px;
    --border-radius: 12px;
    --border-radius-lg: 16px;

    /* 7. Transitions */
    --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

    /* 8. Grid & Layout (Constants.js 와 연동) */
    --grid-columns: 12;
    --grid-gap: 2px;
    --row-height-unit: 10px;
    /* GRID_ROW_HEIGHT_UNIT */

    /* 9. Dynamic Scaling (JS에서 주입됨) */
    --v-scale: 1.0;
    /* getResponsiveScale() * COMPRESSION_RATIO * WEIGHT */
    --v-ratio: 1.0;
    /* COMPRESSION_RATIO * WEIGHT */
}