/* ==========================================================================
   UI/UX PRO MAX - 多風格設計系統主題庫 (精選 3 大主力風格)
   1. taiwan-edu     (🌲 全國行政減量風 - 松柏墨綠、暖橘焦糖、精緻圓角膠囊)
   2. warm-editorial (🍵 日系溫潤手帳 - 和紙暖白、炭黑墨色、文具雅致質感)
   3. apple-glass    (🍎 蘋果極簡毛玻璃 - Frosted Glass、20px 大圓角、通透空氣感)
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800;900&family=Noto+Sans+TC:wght@400;500;700;900&display=swap');

/* ==========================================================================
   1. 主題：taiwan-edu (全國高中行政減量風 - 預設主題)
   ========================================================================== */
:root, [data-theme="taiwan-edu"] {
  --color-primary: #1b4d3e;          /* 松柏深墨綠 */
  --color-primary-hover: #133a2e;
  --color-primary-light: #ebf4f0;
  --color-primary-border: #a4c7ba;
  --color-on-primary: #ffffff;

  --color-accent: #d96b27;           /* 暖橘焦糖色 */
  --color-accent-light: #fef4eb;
  --color-accent-border: #fcd3b6;

  --color-group-a: #1b4d3e;          /* A 組：墨綠色 */
  --color-group-a-light: #ebf4f0;
  --color-group-a-border: #a4c7ba;

  --color-group-b: #c2672b;          /* B 組：焦糖赤陶 */
  --color-group-b-light: #fef4eb;
  --color-group-b-border: #fcd3b6;

  --color-duty: #d97706;             /* 值日生：明亮琥珀 */
  --color-duty-light: #fffbeb;
  --color-duty-border: #fde68a;

  --color-officer: #4a5568;          /* 幹部：質感岩灰 */
  --color-officer-light: #f7fafc;
  --color-officer-border: #cbd5e0;

  --color-success: #15803d;
  --color-success-light: #f0fdf4;
  --color-success-border: #bbf7d0;

  --color-warning: #d97706;
  --color-warning-light: #fffbeb;
  --color-warning-border: #fde68a;

  --color-danger: #dc2626;

  --color-bg-app: #f4f7f5;           /* 淺綠調柔和灰底 */
  --color-bg-surface: #ffffff;
  --color-bg-surface-elevated: #ebf1ee;

  --text-primary: #142821;           /* 墨黑綠主文字 */
  --text-secondary: #4a5568;
  --text-muted: #718096;

  --border-color: #e2e8f0;
  --border-color-dark: #cbd5e1;
  --border-width: 1px;

  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  --shadow-sm: 0 1px 2px 0 rgba(20, 40, 33, 0.05);
  --shadow-card: 0 2px 6px 0 rgba(20, 40, 33, 0.06), 0 1px 2px -1px rgba(20, 40, 33, 0.04);
  --shadow-md: 0 6px 12px -2px rgba(20, 40, 33, 0.08), 0 3px 6px -3px rgba(20, 40, 33, 0.04);
  --shadow-lg: 0 12px 20px -3px rgba(20, 40, 33, 0.1), 0 4px 6px -4px rgba(20, 40, 33, 0.04);
  --shadow-xl: 0 24px 30px -5px rgba(20, 40, 33, 0.12);

  --font-family-base: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang TC", "Microsoft JhengHei", sans-serif;
}

[data-theme="taiwan-edu"] .app-header {
  background: linear-gradient(135deg, #1b4d3e, #133a2e);
  color: #ffffff;
  border-color: #1b4d3e;
}

[data-theme="taiwan-edu"] .brand-logo {
  background: #d96b27;
  color: white;
}

[data-theme="taiwan-edu"] .brand-info h1 {
  color: #ffffff;
}

[data-theme="taiwan-edu"] .brand-info p {
  color: #a4c7ba;
}

[data-theme="taiwan-edu"] .header-actions .btn-outline {
  background: rgba(255, 255, 255, 0.15);
  border-color: rgba(255, 255, 255, 0.3);
  color: #ffffff;
}

[data-theme="taiwan-edu"] .header-actions .btn-outline:hover {
  background: rgba(255, 255, 255, 0.25);
}

[data-theme="taiwan-edu"] .header-actions .form-select {
  background-color: rgba(255, 255, 255, 0.95);
  color: #1b4d3e;
}

/* ==========================================================================
   2. 主題：warm-editorial (日系溫潤極簡手帳 - 和紙暖白、炭黑墨色、抹茶綠)
   ========================================================================== */
[data-theme="warm-editorial"] {
  --color-primary: #3d604b;          /* 沉靜抹茶綠 */
  --color-primary-hover: #2d4737;
  --color-primary-light: #eef4f0;
  --color-primary-border: #c8dacd;
  --color-on-primary: #ffffff;

  --color-accent: #b45309;           /* 暖琥珀赤陶 */
  --color-accent-light: #fdf6ec;
  --color-accent-border: #f8dfbe;

  --color-group-a: #2c5282;          /* 日系深青藍 */
  --color-group-a-light: #ebf4ff;
  --color-group-a-border: #c3dafe;

  --color-group-b: #6b46c1;          /* 雅緻藤紫 */
  --color-group-b-light: #faf5ff;
  --color-group-b-border: #e9d8fd;

  --color-duty: #c05621;             /* 柿色 */
  --color-duty-light: #fffaf0;
  --color-duty-border: #feebc8;

  --color-officer: #57534e;          /* 暖灰 */
  --color-officer-light: #f5f5f4;
  --color-officer-border: #d6d3d1;

  --color-success: #2e7d32;
  --color-success-light: #f1f8e9;
  --color-success-border: #c5e1a5;

  --color-warning: #d97706;
  --color-warning-light: #fffbeb;
  --color-warning-border: #fde68a;

  --color-danger: #c53030;

  --color-bg-app: #f9f8f5;           /* 和紙暖白 */
  --color-bg-surface: #ffffff;
  --color-bg-surface-elevated: #f2efe9;

  --text-primary: #282522;           /* 炭黑墨色 */
  --text-secondary: #57534e;
  --text-muted: #78716c;

  --border-color: #e5e2da;
  --border-color-dark: #d5d0c5;
  --border-width: 1px;

  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-xl: 14px;
  --radius-full: 9999px;

  --shadow-sm: 0 1px 2px rgba(40, 37, 34, 0.04);
  --shadow-card: 0 2px 4px rgba(40, 37, 34, 0.05);
  --shadow-md: 0 4px 8px rgba(40, 37, 34, 0.06);
  --shadow-lg: 0 8px 16px rgba(40, 37, 34, 0.07);
  --shadow-xl: 0 16px 24px rgba(40, 37, 34, 0.08);

  --font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", serif;
}

/* ==========================================================================
   3. 主題：apple-glass (蘋果極簡毛玻璃 - Frosted Glass & Diffuse Shadows)
   ========================================================================== */
[data-theme="apple-glass"] {
  --color-primary: #0071e3;          /* Apple Blue */
  --color-primary-hover: #0077ed;
  --color-primary-light: #e8f2fc;
  --color-primary-border: #b8dbfc;
  --color-on-primary: #ffffff;

  --color-accent: #ff9500;
  --color-accent-light: #fff4e6;
  --color-accent-border: #ffd7a8;

  --color-group-a: #0071e3;
  --color-group-a-light: #e8f2fc;
  --color-group-a-border: #b8dbfc;

  --color-group-b: #af52de;          /* Apple Purple */
  --color-group-b-light: #f7eefc;
  --color-group-b-border: #e6c8f7;

  --color-duty: #ff9500;             /* Apple Orange */
  --color-duty-light: #fff4e6;
  --color-duty-border: #ffd7a8;

  --color-officer: #8e8e93;          /* Apple Gray */
  --color-officer-light: #f2f2f7;
  --color-officer-border: #d1d1d6;

  --color-success: #34c759;
  --color-success-light: #ebf9ee;
  --color-success-border: #a8e8b8;

  --color-warning: #ff9500;
  --color-warning-light: #fff4e6;
  --color-warning-border: #ffd7a8;

  --color-danger: #ff3b30;

  --color-bg-app: #f5f5f7;           /* Apple Gray Background */
  --color-bg-surface: rgba(255, 255, 255, 0.85);
  --color-bg-surface-elevated: rgba(242, 242, 247, 0.9);

  --text-primary: #1d1d1f;
  --text-secondary: #515154;
  --text-muted: #86868b;

  --border-color: rgba(0, 0, 0, 0.08);
  --border-color-dark: rgba(0, 0, 0, 0.15);
  --border-width: 1px;

  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-full: 9999px;

  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04);
  --shadow-card: 0 4px 20px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 8px 28px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.1);
  --shadow-xl: 0 24px 60px rgba(0, 0, 0, 0.12);

  --font-family-base: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "PingFang TC", "Microsoft JhengHei", sans-serif;
}

[data-theme="apple-glass"] .card,
[data-theme="apple-glass"] .app-header,
[data-theme="apple-glass"] .projector-container,
[data-theme="apple-glass"] .modal-box {
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

/* ==========================================================================
   全域間距與基礎常數 (8dp Rhythm System)
   ========================================================================== */
:root {
  --space-1: 0.25rem;  /* 4px */
  --space-2: 0.5rem;   /* 8px */
  --space-3: 0.75rem;  /* 12px */
  --space-4: 1rem;     /* 16px */
  --space-5: 1.25rem;  /* 20px */
  --space-6: 1.5rem;   /* 24px */
  --space-8: 2rem;     /* 32px */
  --space-10: 2.5rem;  /* 40px */
  --space-12: 3rem;    /* 48px */

  --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
  --transition-fast: 150ms var(--ease-smooth);
  --transition-normal: 220ms var(--ease-spring);
  --transition-slow: 350ms var(--ease-spring);
}

/* 全域基礎重設 */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font-family-base);
  background-color: var(--color-bg-app);
  color: var(--text-primary);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  min-height: 100vh;
  transition: background-color var(--transition-normal), color var(--transition-normal);
}

/* 無障礙停用動態 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}