/* === テーマカラー（デフォルト=オレンジ） === */
:root {
  --primary-color:        #D4881E;   /* ゴールドオレンジ */
  --primary-hover:        #B8741A;   /* 暗めのゴールド */
  --primary-light:        #FAF0E0;   /* 選択済みボタンの背景 */
  --primary-border-light: #F5D9A7;   /* 補助ボーダー */
  --bg-color:             #FFFDF7;   /* ページ背景（クリーム白） */
  --text-color:           #222;
  --text-muted:           #777;
  --border-color:         #e0e0e0;
  --field-bg:             #fafafa;
}

/* === テーマ別オーバーライド（body class で切替） === */
body.theme-blue {
  --primary-color:        #2E86AB;
  --primary-hover:        #1A6A8A;
  --primary-light:        #E8F4F8;
  --primary-border-light: #B5DAE5;
  --bg-color:             #F7FBFD;
}

body.theme-green {
  --primary-color:        #2D8C5F;
  --primary-hover:        #1E6B47;
  --primary-light:        #E8F5EE;
  --primary-border-light: #B5DCC5;
  --bg-color:             #F7FCF9;
}

/* theme-orange はデフォルトと同じだが、明示クラスとしても受け入れる */
body.theme-orange {
  /* :root のデフォルト値を使用 */
}

/* === ロゴヘッダー（全ページ共通） === */
.logo-header {
  background: #ffffff;
  text-align: center;
  padding: 16px 12px;
  border-bottom: 2px solid var(--primary-color);
  margin: -20px -20px 24px -20px;
}
.logo-header img {
  display: inline-block;
  max-width: 300px;
  width: 100%;
  height: auto;
}