/*
 * DOAE HRCS design tokens for Blade components and shared UI.
 * References docs/design-system/spec.md § 2 and ADR-004 token namespace policy.
 * Do not edit values without updating the design system spec.
 */
:root {
    /* Brand */
    --ds-color-primary: #1976D2;
    --ds-color-primary-hover: #1565C0;
    --ds-color-secondary: #6C757D;

    /* Semantic */
    --ds-color-success: #28A745;
    --ds-color-success-bg: #D4EDDA;
    --ds-color-warning: #FFC107;
    --ds-color-warning-bg: #FFF3CD;
    --ds-color-danger: #DC3545;
    --ds-color-danger-bg: #F8D7DA;
    --ds-color-info: #17A2B8;
    --ds-color-info-bg: #D1ECF1;

    /* Neutrals */
    --ds-color-text: #212529;
    --ds-color-text-muted: #6C757D;
    --ds-color-border: #DEE2E6;
    --ds-color-bg: #FFFFFF;
    --ds-color-bg-alt: #F8F9FA;

    /* HRCS status code colors */
    --ds-color-status-draft: #6C757D;
    --ds-color-status-pending: #FFC107;
    --ds-color-status-approved: #28A745;
    --ds-color-status-rejected: #DC3545;
    --ds-color-status-canceled: #6C757D;

    /* Spacing */
    --ds-space-xxs: 2px;
    --ds-space-xs: 4px;
    --ds-space-sm: 8px;
    --ds-space-md: 16px;
    --ds-space-lg: 24px;
    --ds-space-xl: 32px;
    --ds-space-xxl: 48px;

    /* Border radius */
    --ds-radius-sm: 2px;
    --ds-radius-md: 4px;
    --ds-radius-lg: 8px;
    --ds-radius-pill: 9999px;

    /* Shadow */
    --ds-shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
    --ds-shadow-md: 0 4px 6px rgba(0,0,0,0.1);
    --ds-shadow-lg: 0 10px 15px rgba(0,0,0,0.1);

    /* Typography */
    --ds-font-family-sans-th: "Sarabun", "Noto Sans Thai", "Tahoma", sans-serif;
    --ds-font-family-sans-en: "Open Sans", "Inter", system-ui, sans-serif;
    --ds-font-family-serif: "Sarabun", serif;
    --ds-font-family-mono: "Sarabun", monospace;
    --ds-font-size-xs: 12px;
    --ds-font-size-sm: 14px;
    --ds-font-size-base: 16px;
    --ds-font-size-lg: 18px;
    --ds-font-size-xl: 20px;
    --ds-font-size-2xl: 24px;
    --ds-font-size-3xl: 30px;
    --ds-line-height-tight: 1.25;
    --ds-line-height-normal: 1.5;
    --ds-line-height-loose: 1.75;
    --ds-font-weight-regular: 400;
    --ds-font-weight-medium: 500;
    --ds-font-weight-bold: 700;

    /* Z-index */
    --ds-z-dropdown: 1000;
    --ds-z-sticky: 1020;
    --ds-z-fixed: 1030;
    --ds-z-modal-bg: 1040;
    --ds-z-modal: 1050;
    --ds-z-popover: 1060;
    --ds-z-tooltip: 1070;
    --ds-z-toast: 1080;

    /* Breakpoints */
    --ds-bp-sm: 576px;
    --ds-bp-md: 768px;
    --ds-bp-lg: 992px;
    --ds-bp-xl: 1200px;

    /* === Aliases for backward compat with session theme — see ADR-004 === */
    --color-primary: var(--ds-color-primary);
    --color-primary-hover: var(--ds-color-primary-hover);
    --color-secondary: var(--ds-color-secondary);
    --color-success: var(--ds-color-success);
    --color-success-bg: var(--ds-color-success-bg);
    --color-warning: var(--ds-color-warning);
    --color-warning-bg: var(--ds-color-warning-bg);
    --color-danger: var(--ds-color-danger);
    --color-danger-bg: var(--ds-color-danger-bg);
    --color-info: var(--ds-color-info);
    --color-info-bg: var(--ds-color-info-bg);
    --color-text: var(--ds-color-text);
    --color-text-muted: var(--ds-color-text-muted);
    --color-border: var(--ds-color-border);
    --color-bg: var(--ds-color-bg);
    --color-bg-alt: var(--ds-color-bg-alt);
}