/* CS業務システム共通デザイントークン(2026-08-15新設)。
   これまで各画面が個別に:rootを持っていたため、cs-dashboard.htmlの値を正として抽出した。
   ダークモード対応は行わない方針(cs-dashboard.htmlの既存コメント参照。端末強制ダークモード時の
   コントラスト崩れが繰り返し発生したため、あえて@media (prefers-color-scheme: dark)を入れない)。
   既存の色分けの意味(担当グループ色・滞留色・チャネル色等)はすべてそのまま維持する。 */
:root {
  --bg: #f7f8fa;
  --panel-bg: #fff;
  --text: #111827;
  --text-muted: #6b7280;
  --text-faint: #9ca3af;
  --border: #e5e7eb;
  --border-light: #eceff2;
  --hover-bg: #fafbfc;
  --shadow: rgba(0,0,0,0.05);
  --active-bg: #1a1a1a;
  --active-fg: #fff;
  --warn-bg: #fee2e2;
  --warn-bg-hover: #fecaca;
  --warn-text: #dc2626;
  --warn-border: #ffd6d6;
  --attention-bg: #fffafa;
  --attention-bg-hover: #fff4f4;
  --kpi-orange: #d97706;
  --kpi-red: #dc2626;
  --aging-normal: #16a34a;
  --aging-warning: #d97706;
  --aging-alert: #ea580c;
  --aging-critical: #dc2626;
  --accent: #06c;
  --accent-bg: #e6f0fb;
  --tag-default-bg: #eef0f2;
  --tag-default-text: #444;
  --tag-channel-bg: #e5eef6;
  --tag-channel-text: #1f3f57;
  --tag-initial-defect-bg: #fdeee0;
  --tag-initial-defect-text: #8a4c14;
  --tag-customer-bg: #f0eefc;
  --tag-customer-text: #4a3d99;
  --tag-wrong-bg: #fbe9ef;
  --tag-wrong-text: #9c2d54;
  --tag-amazon-bg: #fdeee0;
  --tag-amazon-text: #8a4c14;
  --tag-rakuten-bg: #fbe9ec;
  --tag-rakuten-text: #99283f;
  --tag-shopify-bg: #e3f1e8;
  --tag-shopify-text: #1c4630;
  --tag-yahoo-bg: #fdf0e3;
  --tag-yahoo-text: #8a5a14;
  --tag-prepaid-bg: #e6eefc;
  --tag-prepaid-text: #1e4a9e;
  --tag-collect-bg: #f7ead9;
  --tag-collect-text: #5c3410;
  --group-cs-bg: #f0fdf4;
  --group-cs-border: #22c55e;
  --group-kikuchi-bg: #fff7ed;
  --group-kikuchi-border: #f59e0b;
  --group-warehouse-bg: #f5f3ff;
  --group-warehouse-border: #8b5cf6;
  --group-customer-bg: #eff6ff;
  --group-customer-border: #3b82f6;
  --group-done-bg: #f8fafc;
  --group-done-border: #94a3b8;
  --group-watching-bg: #ecfeff;
  --group-watching-border: #06b6d4;

  /* シェル(サイドバー/ヘッダー)用トークン(2026-08-15新設) */
  --shell-sidebar-bg: #14161a;
  --shell-sidebar-text: #c7cad1;
  --shell-sidebar-text-dim: #82868f;
  --shell-sidebar-border: #262a31;
  --shell-sidebar-hover-bg: #1f232a;
  --shell-sidebar-active-bg: #262c36;
  --shell-sidebar-active-text: #fff;
  --shell-sidebar-active-accent: #4d9fff;
  --shell-sidebar-width: 232px;
  --shell-sidebar-width-collapsed: 64px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 12px;
  /* 共通ヘッダーの実測高さ(パンくず表示時の最大値を安全側に見込む)。ページ内でテーブル見出し等を
     sticky化する場合、position:sticky; top: var(--shell-header-height) を使うことで、
     共通ヘッダー(z-index:30)の裏に隠れないようにする(2026-08-15) */
  --shell-header-height: 68px;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic UI", "Noto Sans JP", system-ui, -apple-system, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
}