/* ========================================
   教育業｜家長客訴治理系統

   Global Design Variables
   全站設計變數
======================================== */

:root {

    /* ====================================
       1. 品牌主色
    ==================================== */

    --color-primary: #173f5f;
    --color-primary-light: #245b83;
    --color-primary-dark: #102f47;

    --color-secondary: #287f7a;
    --color-secondary-light: #e8f5f3;


    /* ====================================
       2. 背景色
    ==================================== */

    --color-background: #f5f7f9;
    --color-surface: #ffffff;
    --color-surface-soft: #f8fafb;


    /* ====================================
       3. 文字顏色
    ==================================== */

    --color-text: #263238;
    --color-text-secondary: #455a64;
    --color-text-muted: #78909c;

    --color-white: #ffffff;


    /* ====================================
       4. 邊框
    ==================================== */

    --color-border: #dce5ea;
    --color-border-light: #edf1f3;


    /* ====================================
       5. 系統狀態色
    ==================================== */

    --color-success: #2e7d32;
    --color-success-bg: #eaf5eb;

    --color-warning: #a45b00;
    --color-warning-bg: #fff4df;

    --color-danger: #b3261e;
    --color-danger-bg: #fdecea;

    --color-info: #246b8e;
    --color-info-bg: #e9f4f9;


    /* ====================================
       6. 字體
    ==================================== */

    --font-family:
        "Noto Sans TC",
        "Microsoft JhengHei",
        Arial,
        sans-serif;

    --font-size-xs: 0.75rem;
    --font-size-sm: 0.875rem;
    --font-size-base: 1rem;
    --font-size-lg: 1.125rem;
    --font-size-xl: 1.25rem;
    --font-size-2xl: 1.5rem;
    --font-size-3xl: 2rem;


    /* ====================================
       7. 間距
    ==================================== */

    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;
    --space-12: 48px;
    --space-16: 64px;
    --space-20: 80px;


    /* ====================================
       8. 圓角
    ==================================== */

    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --radius-pill: 999px;


    /* ====================================
       9. 陰影
    ==================================== */

    --shadow-sm:
        0 2px 6px rgba(23, 63, 95, 0.06);

    --shadow-md:
        0 4px 16px rgba(23, 63, 95, 0.08);

    --shadow-lg:
        0 8px 24px rgba(23, 63, 95, 0.12);


    /* ====================================
       10. 頁面尺寸
    ==================================== */

    --container-width: 1100px;


    /* ====================================
       11. 動畫速度
    ==================================== */

    --transition-fast: 150ms ease;

    --transition-normal: 250ms ease;
}