/* =========================================================
   FIRSTHELD 2027 種目別テーマ設定
   ---------------------------------------------------------
   ここだけ編集すれば、全ページの配色を変更できます。

   --theme-main              ページのメインカラー・背景
   --color-body-text         本文
   --color-heading           h1〜h5
   --color-heading-line      見出し罫線
   --color-dt                dl の dt（項目名）
   --color-dd                dl の dd（内容）
   --color-table-head-text   table の th文字
   --color-table-text        table の td文字
   --color-link              コンテンツ内リンク
   --color-nav-text          左ナビ文字
   --color-nav-line          左ナビ罫線
   --color-button-text       ボタン文字
========================================================= */

:root,
body.theme-100km {
  --theme-main: #F8B500;
  --color-body-text: #000;
  --color-heading: #1A1200;
  --color-spheading: #000;
  --color-nav-toggle: #fff;
  --color-heading-line: #1A1200;
  --color-dt: #1A1200;
  --color-dd: #1A1200;
  --color-table-head-text: #FFFFFF;
  --color-table-text: #1A1200;
  --color-link: #1A1200;
  --color-cont-link: #1A1200;
  --color-nav-text: #1A1200;
  --color-nav-line: #1A1200;
  --color-button-text: #FFFFFF;
}

body.theme-100mile {/*#AE0E16*/
  --theme-main: #FFFFFF;
  --color-body-text: #000;
  --color-heading: #000;
  --color-spheading: #fff;
  --color-nav-toggle: #000;
  --color-heading-line: #000;
  --color-dt: #000;
  --color-dd: #000;
  --color-table-head-text: #000;
  --color-table-text: #000;
  --color-link: #AE0E16;
  --color-cont-link: #AE0E16;
  --color-nav-text: #000;
  --color-nav-line: #AE0E16;
  --color-button-text: #ddd;
}

body.theme-takebi {
  --theme-main: #9EA83A;
  --color-body-text: #000;
  --color-heading: #9EA83A;
  --color-spheading: #000;
  --color-nav-toggle: #9EA83A;
  --color-heading-line: #9EA83A;
  --color-dt: #FFFFFF;
  --color-dd: #000;
  --color-table-head-text: #FFFFFF;
  --color-table-text: #000;
  --color-link: #FFFFFF;
  --color-cont-link: #9EA83A;
  --color-nav-text: #fff;
  --color-nav-line: rgba(255,255,255,.75);
  --color-button-text: #FFFFFF;
}

body.theme-ojima {
  --theme-main: #DC4F03;
  --color-body-text: #000;
  --color-heading: #DC4F03;
  --color-spheading: #000;
  --color-nav-toggle: #DC4F03;
  --color-heading-line: #DC4F03;
  --color-dt: #FFFFFF;
  --color-dd: #000;
  --color-table-head-text: #FFFFFF;
  --color-table-text: #000;
  --color-link: #FFFFFF;
  --color-cont-link: #DC4F03;
  --color-nav-text: #FFFFFF;
  --color-nav-line: rgba(255,255,255,.75);
  --color-button-text: #FFFFFF;
}

body.theme-kinka {
  --theme-main: #6AAD2D;
  --color-body-text: #000;
  --color-heading: #6AAD2D;
  --color-spheading: #000;
  --color-nav-toggle: #6AAD2D;
  --color-heading-line: #6AAD2D;
  --color-dt: #FFFFFF;
  --color-dd: #000;
  --color-table-head-text: #FFFFFF;
  --color-table-text: #000;
  --color-link: #FFFFFF;
  --color-cont-link: #6AAD2D;
  --color-nav-text: #FFFFFF;
  --color-nav-line: rgba(255,255,255,.75);
  --color-button-text: #FFFFFF;
}

/* 既存CSS互換用。通常は変更不要です。 */
body {
  --theme-ink: var(--color-body-text);
  --theme-on-dark: #FFFFFF;
  --theme-line: color-mix(in srgb, var(--color-body-text) 48%, transparent);
  --theme-table-border: color-mix(in srgb, var(--theme-main) 58%, var(--color-body-text) 42%);
  --theme-table-head: color-mix(in srgb, var(--theme-main) 72%, #000 28%);
  --theme-table-alt: color-mix(in srgb, var(--theme-main) 88%, #fff 12%);
  --theme-hover: color-mix(in srgb, var(--theme-main) 72%, #000 28%);
}