/* =========================================
   テーマカラー定義 (theme-colors.css)
========================================= */
:root {
/* --- キーカラー --- */
--theme-main-color: #06BADB;  /* メインカラー */
--theme-main-color-thin: #DAF5FA; /* メインカラー（薄い） */
--theme-accent-color: #E04516;  /* アクセントカラー */
--theme-accent-color-thin: #FDD5C8;  /* アクセントカラー（薄い） */
--theme-base-color: #F2F2F2;  /* バックグラウンド（ベース）カラー */

/* --- テキストカラー --- */
--theme-text-main: #676969; /* 基本テキスト */
--theme-text-sub: #9EA4A6;  /* サブテキスト */
--theme-text-danger: var(--theme-accent-color);  /* 危険テキスト */
--theme-link-color: #3399CC;  /* リンク */

/* --- ヘッダー --- */
--theme-header-bg: var(--theme-base-color); /* 背景色 */
--theme-header-nav-border: #D5D5D5; /* ヘッダー・下部ナビゲーションバー　線 */

/* --- リスト --- */
--theme-list-separate-line: #D5D5D5; /* カレンダー枠線・リストの区切り線 */

/* --- 下部ナビゲーション --- */
--theme-btn-scan: var(--theme-accent-color);  /* スキャンボタン */
--theme-menu-active: var(--theme-main-color); /* メニュー　アクティブ色 */
--theme-menu-inactive: var(--theme-text-main); /* メニュー　非アクティブ色 */

/* --- ボタンカラー --- */
--theme-btn-primary: var(--theme-main-color); /* メインボタン */
--theme-btn-back: var(--theme-text-sub);  /* 戻るボタン */
--theme-btn-delete: var(--theme-accent-color);  /* 削除ボタン */
--theme-btn-signup: var(--theme-accent-color);  /* ログイン画面　新規登録ボタン */

/* --- エラー状態 --- */
--theme-top-error-bg: var(--theme-accent-color);  /* 上部エラーメッセージ　背景色 */
--theme-top-error-text: #FFFFFF;  /* 上部エラーメッセージ　テキスト*/
--theme-error-color: var(--theme-accent-color); /* エラー時の入力欄枠線・テキスト */
--theme-notice-bg: var(--theme-accent-color-thin);  /* 上部警告　背景色 */
--theme-notice-color: var(--theme-accent-color);  /* 上部警告　テキスト */

/* --- 入力画面 --- */
--theme-label-required: var(--theme-accent-color);  /* 必須ラベル　背景 */
--theme-input-border: #e0e0e0;  /* 通常時の入力欄枠線 */
--theme-input-uneditable: #CFD3D4;  /* 編集不可状態の入力欄 */

/* --- 確認画面 --- */
--theme-confirm-bg: var(--theme-main-color-thin); /* 確認画面の項目名　背景色 */
--theme-confirm-border: #FFFFFF;  /* 確認画面の項目名　枠線 */

/* --- 影 --- */
--theme-shadow-focus: rgba(0, 188, 212, 0.5); /* フォーカス時の影 */
--theme-shadow-nav: rgba(0, 0, 0, 0.1); /* 下部ナビゲーションの影 */

/* リンク　ホバー */
--theme-link-hover-bg: #f8f9fa; /* 背景 */

/* タブ　ホバー */
--theme-tab-hover-bg: #ebebeb; /* 背景 */
}