/**
 * YunTech SA - CSS Custom Properties (Design Tokens)
 *
 * 最後修改：2026-02-12 | 修改者：kaicat
 * 建立時間：2026-02-12
 * 檔案功能：定義全站設計系統的 CSS 變數 (色彩/字型/間距/圓角/陰影/過渡)
 * 依賴：無 (最底層)
 */

:root {
  /* ==========================================
     品牌核心色彩
     ========================================== */
  --sa-primary: #6782ae;
  --sa-primary-rgb: 103, 130, 174;
  --sa-secondary: #606e93;
  --sa-secondary-rgb: 96, 110, 147;
  --sa-accent: #7a91b3;
  --sa-accent-rgb: 122, 145, 179;
  --sa-dark: #1e293b;
  --sa-dark-rgb: 30, 41, 59;

  /* 品牌色階 */
  --sa-primary-50: #f0f4f8;
  --sa-primary-100: #dce4ef;
  --sa-primary-200: #b8c9de;
  --sa-primary-300: #7a91b3;
  --sa-primary-400: #6782ae;
  --sa-primary-500: #606e93;
  --sa-primary-600: #4a5578;
  --sa-primary-900: #1e293b;

  /* 語義色 */
  --sa-success: #10b981;
  --sa-success-rgb: 16, 185, 129;
  --sa-danger: #ef4444;
  --sa-danger-rgb: 239, 68, 68;
  --sa-warning: #f59e0b;
  --sa-warning-rgb: 245, 158, 11;
  --sa-info: #3b82f6;
  --sa-info-rgb: 59, 130, 246;

  /* ==========================================
     Bootstrap 5 主色覆寫
     ========================================== */
  --bs-primary: #6782ae;
  --bs-primary-rgb: 103, 130, 174;
  --bs-secondary: #606e93;
  --bs-secondary-rgb: 96, 110, 147;
  --bs-success: #10b981;
  --bs-success-rgb: 16, 185, 129;
  --bs-danger: #ef4444;
  --bs-danger-rgb: 239, 68, 68;
  --bs-warning: #f59e0b;
  --bs-warning-rgb: 245, 158, 11;
  --bs-info: #3b82f6;
  --bs-info-rgb: 59, 130, 246;
  --bs-body-font-family:
    "Inter", "Noto Sans TC", system-ui, -apple-system, sans-serif;
  --bs-body-bg: #f8fafc;
  --bs-body-color: #1e293b;

  /* ==========================================
     字型系統
     ========================================== */
  --sa-font-sans: "Inter", "Noto Sans TC", system-ui, -apple-system, sans-serif;
  --sa-font-mono: "JetBrains Mono", "Fira Code", ui-monospace, monospace;

  /* 字重 */
  --sa-fw-normal: 400;
  --sa-fw-medium: 500;
  --sa-fw-semibold: 600;
  --sa-fw-bold: 700;
  --sa-fw-extrabold: 800;
  --sa-fw-black: 900;

  /* ==========================================
     圓角系統
     ========================================== */
  --sa-radius-sm: 0.375rem; /* 6px */
  --sa-radius-md: 0.5rem; /* 8px */
  --sa-radius-lg: 0.75rem; /* 12px */
  --sa-radius-xl: 1rem; /* 16px */
  --sa-radius-2xl: 1.5rem; /* 24px */
  --sa-radius-pill: 50rem;
  --sa-radius-circle: 50%;

  /* ==========================================
     陰影系統
     ========================================== */
  --sa-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
  --sa-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --sa-shadow-lg: 0 10px 25px rgba(103, 130, 174, 0.1);
  --sa-shadow-xl: 0 20px 40px rgba(0, 0, 0, 0.12);
  --sa-shadow-premium:
    0 10px 25px -5px rgba(103, 130, 174, 0.1),
    0 8px 10px -6px rgba(103, 130, 174, 0.1);
  --sa-shadow-brand: 0 4px 14px rgba(103, 130, 174, 0.3);

  /* ==========================================
     過渡動畫
     ========================================== */
  --sa-transition-fast: 150ms ease;
  --sa-transition-base: 300ms ease;
  --sa-transition-slow: 500ms ease;

  /* ==========================================
     佈局
     ========================================== */
  --sa-sidebar-width: 260px;
  --sa-navbar-height: 64px;
  --sa-topbar-height: 64px;
}