/* ===================================================================
   FarmStack Design System — design-tokens.css
   docs/12 §2.1 (라이트) + §2.2 (다크) 그대로.
   외부 연계 시스템 (영농일지·제품구매·컨설팅·AS) 도 본 파일을 동일 복제.
   =================================================================== */

:root {
    color-scheme: light;

    /* Brand colors */
    --color-primary:        #2E7D32;
    --color-primary-light:  #4CAF50;
    --color-primary-dark:   #1B5E20;
    --color-secondary:       #1565C0;
    --color-secondary-light: #1976D2;
    --color-danger:  #D32F2F;
    --color-warning: #F57C00;
    --color-success: #388E3C;

    --color-background: #F5F5F5;
    --color-card:       #FFFFFF;
    --color-surface:    #FAFAFA;
    --color-text:           #212121;
    --color-text-secondary: #757575;
    --color-border:         #E0E0E0;

    /* Layout */
    --sidebar-width:           220px;
    --sidebar-collapsed-width: 64px;
    --header-height:           64px;

    /* Spacing */
    --spacing-xs: 4px;
    --spacing-sm: 8px;
    --spacing-md: 16px;
    --spacing-lg: 24px;
    --spacing-xl: 32px;

    /* Border radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;

    /* Shadows */
    --shadow-sm: 0 1px 3px  rgba(0, 0, 0, 0.12);
    --shadow-md: 0 2px 6px  rgba(0, 0, 0, 0.15);
    --shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.15);

    /* Transitions */
    --transition-fast:   0.15s ease;
    --transition-normal: 0.30s ease;

    /* Font scale */
    --font-scale: 1;
    --base-font-size: calc(14px * var(--font-scale));
}

/* Dark theme override (docs/12 §2.2) */
:root[data-theme="dark"] {
    color-scheme: dark;

    --color-primary:        #4CAF50;
    --color-primary-light:  #66BB6A;
    --color-primary-dark:   #388E3C;
    --color-secondary:       #42A5F5;
    --color-secondary-light: #64B5F6;
    --color-danger:  #EF5350;
    --color-warning: #FFB74D;
    --color-success: #66BB6A;

    --color-background: #0d1117;
    --color-card:       #161b22;
    --color-surface:    #21262d;
    --color-text:           #e6edf3;
    --color-text-secondary: #8b949e;
    --color-border:         #30363d;

    --shadow-sm: 0 1px 3px  rgba(0, 0, 0, 0.40);
    --shadow-md: 0 2px 6px  rgba(0, 0, 0, 0.50);
    --shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.50);
}

:root[data-theme="dark"] select,
:root[data-theme="dark"] input,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] button { color-scheme: dark; }