/**
 * variables.css 
 */

:root {
    /* ================================================================
     1. 品牌核心調色盤 (換專案主題修改此區) #408A71 疾管綠, #E66F51公衛橘
     ================================================================ */
    --color-primary: #E66F51;
    --color-primary-hover: color-mix(in srgb, var(--color-primary), #000000 15%);
    --color-primary-light: color-mix(in srgb, var(--color-primary) 15%, transparent);
    --color-selected-bg: var(--color-primary-light);
    --color-accent: #F3A41D;
    --color-accent-hover: color-mix(in srgb, var(--color-accent), #000000 15%);
    --color-accent-light: color-mix(in srgb, var(--color-accent) 15%, transparent);
    --btn-back-bg: #B5B5B5;
    --btn-back-text: #FFF;
    --btn-next-bg: var(--color-primary);
    --btn-next-text: #FFF;
    /* 首頁漸層背景與主視覺 
        漸層頂部 --homepage-gradient-start
        漸層底部 --homepage-gradient-end
        薄荷綠 #58bd9d 
        灰藍色 #6488bf
        香檳黃 #FFE6A2
        珊瑚橘 #FF9F54
    */
    --homepage-gradient-start: #FFE6A2;
    --homepage-gradient-end: #FF9F54;
    --homepage-sidebar-gradient: linear-gradient(180deg, var(--homepage-gradient-start) 0%, var(--homepage-gradient-end) 100%);
    --homepage-mobile-gradient: linear-gradient(180deg, var(--homepage-gradient-start) 0%, var(--homepage-gradient-end) 100%);
    --homepage-background-url: url('../Image/背景3.png') no-repeat center top / cover var(--color-primary-light);
    /* 首頁背景圖 */
    --qs-bg-img-main: var(--homepage-sidebar-gradient);
    /* ================================================================
     2. 互動狀態與邊框 (Interactive & Borders)
     ================================================================ */
    --focus-ring-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 15%, transparent);
    --border-color: #CCCCCC;
    /*    --border-shadow: rgba(70, 150, 113, 0.25);*/
    /* ================================================================
     3. 背景與容器 (Backgrounds)
     ================================================================ */
    --bg-main: #f5f5f5;
    /* ================================================================
     4. 表單驗證與狀態提示 (Form Validation & Status)
     ================================================================ */
    --color-danger: #cc0000;
    --color-danger-form: #dc3545;
    --color-danger-form-ring: rgba(220, 53, 69, 0.2);
    --color-danger-form-soft: #fff8f8;
    /* ================================================================
     5. 多語系字體 (Typography)
     ================================================================ */
    --font-primary: "Noto Sans", "Noto Sans Thai", "Noto Sans TC", "Noto Sans JP", "Noto Sans KR", sans-serif;
    --header-height: 160px;
    /* ================================================================
     6. Default 頁面顏色變數
     ================================================================ */
    --default-page-system-title: #000000;
    /* ================================================================
     7. Default 語言選擇器顏色
     ================================================================ */
    --default-lang-title-color: #000000;
    --default-lang-icon-color: #000000;
    /* ================================================================
     8. Main 頁面顏色變數
     ================================================================ */
    --main-upload-bg: #FFD70066;
}