/* ============================================================
   班级作业公示板 · 主题变量
   ------------------------------------------------------------
   本文件只定义 CSS 变量（:root / [data-theme] 上的 custom
   properties），不含任何选择器逻辑；所有业务样式在 style.css
   中引用这些变量。想调整外观，只改这个文件即可。

   切换主题：给 <html> 设置 data-theme="light" | "dark" | "paper"
   （见 app.js 的 initTheme / cycleTheme，页面右上角按钮循环切换）。

   注意：--breakpoint-mobile 仅供文档参考 —— CSS 变量不能用于
   @media 查询条件，media 里必须写具体像素值（900px）。
   ============================================================ */

/* ---------- light：默认主题，学校公示板风格（清爽浅色） ---------- */
:root {
  /* 颜色 */
  --color-bg: #eef2f7;              /* 页面背景 */
  --color-surface: #ffffff;         /* 卡片 / 面板 */
  --color-surface-2: #e6edf5;       /* 输入框 / 次级背景 */
  --color-border: #d4dde8;          /* 边框 */
  --color-text: #22303f;            /* 主文字 */
  --color-text-muted: #64748b;      /* 次要文字 */
  --color-primary: #2f6fed;         /* 主色（按钮 / 学科徽标） */
  --color-primary-text: #ffffff;    /* 主色上的文字 */
  --color-accent: #f59e0b;          /* 强调色 */
  --color-danger: #dc2626;          /* 危险 / 删除 */
  --color-warning: #d97706;         /* 警示 / 备注 */
  --color-success: #16a34a;         /* 成功 */

  /* 标签：是否需要提交 */
  --tag-submit-bg: #dbeafe;         /* “需要提交”标签背景 */
  --tag-submit-text: #1d4ed8;       /* “需要提交”标签文字 */
  --tag-view-bg: #e9eef5;           /* “仅查看”标签背景 */
  --tag-view-text: #5a6b80;         /* “仅查看”标签文字 */

  /* 截止状态 */
  --status-overdue: #dc2626;        /* 已截止 */
  --status-today: #d97706;          /* 今天截止 */
  --status-soon: #2f6fed;           /* 明天 / 本周截止 */

  /* 字体 */
  --font-family-base: "PingFang SC", "Microsoft YaHei", "Noto Sans SC",
    "Source Han Sans SC", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-size-base: 16px;
  --font-size-title: 20px;
  --font-size-small: 13px;
  --line-height-base: 1.65;

  /* 间距 */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;

  /* 圆角 */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;

  /* 阴影 */
  --shadow-card: 0 1px 2px rgba(34, 48, 63, 0.06), 0 4px 14px rgba(34, 48, 63, 0.08);
  --shadow-hover: 0 4px 10px rgba(34, 48, 63, 0.1), 0 10px 28px rgba(34, 48, 63, 0.14);

  /* 过渡 */
  --transition-fast: 120ms ease;
  --transition-base: 240ms ease;

  /* 布局 */
  --layout-sidebar-width: 320px;    /* 桌面端左栏（录入区）宽度 */
  --layout-gap: 24px;               /* 两栏 / 区块间距 */
  --breakpoint-mobile: 900px;       /* 仅文档：移动端断点，media 里写 900px */
}

/* ---------- dark：深色模式 ---------- */
[data-theme="dark"] {
  /* 颜色 */
  --color-bg: #0f172a;
  --color-surface: #1a2537;
  --color-surface-2: #243147;
  --color-border: #31405a;
  --color-text: #e5ecf5;
  --color-text-muted: #93a4ba;
  --color-primary: #4c8dff;
  --color-primary-text: #0b1526;
  --color-accent: #fbbf24;
  --color-danger: #f87171;
  --color-warning: #fbbf24;
  --color-success: #4ade80;

  /* 标签：是否需要提交 */
  --tag-submit-bg: #1d3a6b;
  --tag-submit-text: #9cc3ff;
  --tag-view-bg: #2a3a54;
  --tag-view-text: #aebfd6;

  /* 截止状态 */
  --status-overdue: #f87171;
  --status-today: #fbbf24;
  --status-soon: #7aa7ff;

  /* 字体 */
  --font-family-base: "PingFang SC", "Microsoft YaHei", "Noto Sans SC",
    "Source Han Sans SC", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-size-base: 16px;
  --font-size-title: 20px;
  --font-size-small: 13px;
  --line-height-base: 1.65;

  /* 间距 */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;

  /* 圆角 */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;

  /* 阴影 */
  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.35), 0 4px 14px rgba(0, 0, 0, 0.35);
  --shadow-hover: 0 4px 10px rgba(0, 0, 0, 0.4), 0 10px 28px rgba(0, 0, 0, 0.5);

  /* 过渡 */
  --transition-fast: 120ms ease;
  --transition-base: 240ms ease;

  /* 布局 */
  --layout-sidebar-width: 320px;
  --layout-gap: 24px;
  --breakpoint-mobile: 900px;       /* 仅文档：移动端断点，media 里写 900px */
}

/* ---------- paper：米黄纸张风格（护眼） ---------- */
[data-theme="paper"] {
  /* 颜色 */
  --color-bg: #f3ecd9;
  --color-surface: #fbf6e7;
  --color-surface-2: #efe5c9;
  --color-border: #d9c9a0;
  --color-text: #453b28;
  --color-text-muted: #8a7a58;
  --color-primary: #9a6b2f;
  --color-primary-text: #fdf8ea;
  --color-accent: #c2410c;
  --color-danger: #b91c1c;
  --color-warning: #b45309;
  --color-success: #4d7c0f;

  /* 标签：是否需要提交 */
  --tag-submit-bg: #e8d9b0;
  --tag-submit-text: #7a5312;
  --tag-view-bg: #efe6cd;
  --tag-view-text: #857450;

  /* 截止状态 */
  --status-overdue: #b91c1c;
  --status-today: #b45309;
  --status-soon: #9a6b2f;

  /* 字体：纸张主题使用衬线字体，更贴近纸质公示 */
  --font-family-base: Georgia, "Times New Roman", "Noto Serif SC", "Songti SC",
    "SimSun", serif;
  --font-size-base: 16px;
  --font-size-title: 20px;
  --font-size-small: 13px;
  --line-height-base: 1.7;

  /* 间距 */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;

  /* 圆角：纸张主题整体更方正 */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;

  /* 阴影 */
  --shadow-card: 0 1px 2px rgba(90, 74, 43, 0.12), 0 4px 14px rgba(90, 74, 43, 0.12);
  --shadow-hover: 0 4px 10px rgba(90, 74, 43, 0.16), 0 10px 26px rgba(90, 74, 43, 0.2);

  /* 过渡 */
  --transition-fast: 120ms ease;
  --transition-base: 240ms ease;

  /* 布局 */
  --layout-sidebar-width: 320px;
  --layout-gap: 24px;
  --breakpoint-mobile: 900px;       /* 仅文档：移动端断点，media 里写 900px */
}