/*
 * TheOne Fonts - Google Fonts Only Version
 * 使用 Google Fonts Noto Serif TC 系列
 * 已移除本地字體依賴
 */

/* ==========================================
   Google Fonts 導入
   ========================================== */

/* 導入 Noto Serif TC - 繁體中文專用 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@200;300;400;500;600;700;900&display=swap');

/* 導入 Noto Serif SC - 簡體中文專用 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@200;300;400;500;600;700;900&display=swap');

/* 導入 Noto Serif JP - 日文專用 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');

/* 導入 Noto Serif KR - 韓文專用 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200;300;400;500;600;700;900&display=swap');

/* ==========================================
   字體族設定 (Font Family Stacks)
   ========================================== */

/* 主要字體族 - 以繁體中文為主，系統字體作為備用 */
.font-primary,
:root {
    --font-primary: 'Noto Serif TC', 'Noto Serif SC', 'Noto Serif JP', 'Noto Serif KR', 
                    -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang TC', 
                    'Hiragino Sans GB', 'Microsoft YaHei', serif;
}

/* 語言專用字體族 */

/* 繁體中文專用 */
.font-tc {
    font-family: 'Noto Serif TC', 'PingFang TC', 'Hiragino Sans GB', 'Microsoft YaHei', serif;
}

/* 簡體中文專用 */
.font-sc {
    font-family: 'Noto Serif SC', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', serif;
}

/* 日文專用 */
.font-jp {
    font-family: 'Noto Serif JP', 'Hiragino Sans', 'Meiryo', serif;
}

/* 韓文專用 */
.font-kr {
    font-family: 'Noto Serif KR', 'Apple SD Gothic Neo', 'Malgun Gothic', serif;
}

/* ==========================================
   字重工具類別 (Font Weight Utilities)
   ========================================== */

.font-extralight { font-weight: 200; }
.font-light { font-weight: 300; }
.font-normal { font-weight: 400; }
.font-medium { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold { font-weight: 700; }
.font-black { font-weight: 900; }

/* ==========================================
   全域字體設定
   ========================================== */

/* 應用主要字體到整個網站 */
body {
    font-family: var(--font-primary);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
}

/* 標題字體優化 */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-primary);
    font-feature-settings: "kern" 1, "liga" 1, "dlig" 1;
}

/* 段落文字優化 */
p {
    font-family: var(--font-primary);
    line-height: 1.8;
    letter-spacing: 0.02em;
}

/* ==========================================
   性能優化設定
   ========================================== */

/* 字體顯示優化 */
* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* 避免字體閃爍 */
.font-loading {
    font-display: swap;
    visibility: hidden;
}

.font-loaded {
    visibility: visible;
    transition: visibility 0s linear 0s;
}

/* ==========================================
   響應式字體大小
   ========================================== */

/* 桌面版字體大小 */
@media (min-width: 1024px) {
    :root {
        --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: 1.875rem;
        --font-size-4xl: 2.25rem;
        --font-size-5xl: 3rem;
    }
}

/* 平板版字體大小 */
@media (min-width: 768px) and (max-width: 1023px) {
    :root {
        --font-size-xs: 0.7rem;
        --font-size-sm: 0.8rem;
        --font-size-base: 0.95rem;
        --font-size-lg: 1.1rem;
        --font-size-xl: 1.2rem;
        --font-size-2xl: 1.4rem;
        --font-size-3xl: 1.7rem;
        --font-size-4xl: 2rem;
        --font-size-5xl: 2.5rem;
    }
}

/* 手機版字體大小 */
@media (max-width: 767px) {
    :root {
        --font-size-xs: 0.65rem;
        --font-size-sm: 0.75rem;
        --font-size-base: 0.9rem;
        --font-size-lg: 1rem;
        --font-size-xl: 1.1rem;
        --font-size-2xl: 1.3rem;
        --font-size-3xl: 1.6rem;
        --font-size-4xl: 1.8rem;
        --font-size-5xl: 2.2rem;
    }
}

/* ==========================================
   字體載入優化
   ========================================== */

/* 預載入關鍵字體 */
@supports (font-display: swap) {
    @font-face {
        font-family: 'Noto Serif TC';
        font-display: swap;
    }
}

/* 字體載入失敗時的備用方案 */
@media (prefers-reduced-data: reduce) {
    /* 在低數據模式下使用系統字體 */
    :root {
        --font-primary: -apple-system, BlinkMacSystemFont, 'Segoe UI', 
                        'PingFang TC', 'Hiragino Sans GB', 'Microsoft YaHei', serif;
    }
}

/* ==========================================
   可訪問性增強
   ========================================== */

/* 高對比度模式支援 */
@media (prefers-contrast: high) {
    body {
        font-weight: 500; /* 增加字重提高可讀性 */
    }
    
    h1, h2, h3, h4, h5, h6 {
        font-weight: 700;
    }
}

/* 減少動畫偏好支援 */
@media (prefers-reduced-motion: reduce) {
    .font-loaded {
        transition: none;
    }
}

/* ==========================================
   調試工具 (開發模式)
   ========================================== */

/* 字體載入狀態指示器 */
.font-debug::before {
    content: "Font: " attr(data-font-family);
    position: fixed;
    top: 10px;
    left: 10px;
    background: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 5px 10px;
    font-size: 12px;
    z-index: 10000;
    border-radius: 3px;
}