/* --- theme-civics.css --- */
/* 公民ナビ全体共通設定 & キャラクター定義 */

:root {
  /* デフォルト（公民ナビ・トップページ用：黄色/ゴールド系） */
  /* 社会的「幸福」や「光」、「注意喚起」をイメージ */
  --primary-color: #FBC02D;      /* 濃いイエロー・ゴールド */
  --primary-dark: #F57F17;       /* アンバーに近いオレンジ */
  --primary-light: #FFF9C4;      /* 薄いクリーム色 */
  --accent-color: #4CAF50;       /* わかまるの緑（アクセント） */
  
  --background-light: #FAFAFA;   /* 清潔感のある白に近いグレー */
  --background-main: #ffffff;
  
  --text-color: #263238;         /* 知的なブルーグレー */
  --header-text-color: #ffffff;
  
  --link-color: #0277BD;         /* リンクは信頼の青 */
}

/* --- 基本の上書き --- */
body {
  background-color: var(--background-light);
  color: var(--text-color);
}

header {
  background: linear-gradient(135deg, var(--primary-color), var(--primary-dark));
  color: var(--header-text-color);
  text-shadow: 1px 1px 2px rgba(0,0,0,0.1);
}

/* グローバルナビゲーション */
nav {
  background-color: #37474F; /* 落ち着いたダークグレーで引き締める */
  border-bottom: 4px solid var(--primary-color);
}
nav a {
  color: #ffffff;
}
nav a:hover, nav a.active {
  background-color: rgba(255,255,255,0.15);
  color: #FFD54F;
}

/* --- パンくずリスト --- */
.breadcrumb-container {
  background-color: #ffffff;
  border-bottom: 1px solid #cfd8dc;
}
.breadcrumb a {
  color: #01579B;
  font-weight: bold;
}
.breadcrumb li.current {
  color: #455A64;
}

/* --- 見出し --- */
main h1 {
  color: var(--primary-dark);
  border-bottom: 3px solid var(--primary-color);
}
main h2 {
  color: #333;
  border-left: 8px solid var(--primary-color);
  background-color: var(--primary-light);
  padding: 0.5rem 1rem;
}
main h3 {
  color: var(--primary-dark);
  border-bottom: 2px dashed var(--primary-color);
}

/* --- キャラクターボックス（公民仕様） --- */
.character-box {
  border: 2px solid;
  background-color: #fff;
}
.character-dialog-header {
  font-weight: bold;
}

/* わかまる（若草色・成長） */
.wakamaru-box {
  border-color: #8BC34A; /* 若草色 */
  background-color: #F1F8E9;
}
.wakamaru-box .character-dialog-header {
  background-color: #DCEDC8;
  color: #33691E;
}

/* コレクト（青・論理） */
.collect-lab {
  border-color: #039BE5;
  background-color: #E1F5FE;
}
.collect-lab .character-dialog-header {
  background-color: #B3E5FC;
  color: #01579B;
}

/* まとめボックス（ゴールド・合意） */
.summary-box {
  border-color: #FBC02D;
  background-color: #FFFDE7;
}
.summary-box .character-dialog-header {
  background-color: #FFF9C4;
  color: #F57F17;
}