/* =========================================================
   theme.css — デザイントークン定義
   配色テーマ：「通帳の深緑」
   ライト／ダークは端末設定（prefers-color-scheme）に自動追従
   ========================================================= */

:root {
  /* --- 基本色（ライトモード） --- */
  --bg:        #F2F4F3;  /* 画面背景（青みのある紙白） */
  --surface:   #FFFFFF;  /* カード・シート */
  --surface-2: #E9EEEC;  /* 押下時・チップ背景 */
  --ink:       #1A2421;  /* 本文 */
  --sub:       #68776F;  /* 補助テキスト */
  --line:      #E1E7E4;  /* 罫線 */

  /* --- 意味色 --- */
  --accent:    #166B52;  /* 基調＝通帳グリーン（収入・主要ボタン） */
  --accent-soft:#DDEBE5; /* 基調の淡色（バッジ背景など） */
  --expense:   #C7503C;  /* 支出（朱） */
  --expense-soft:#F6E3DF;
  --danger:    #C7503C;

  /* --- タイポグラフィ --- */
  /* 本文：iOSシステムフォント／ 金額：丸ゴシック数字で家計簿らしい柔らかさ */
  --font-body:   -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic UI", sans-serif;
  --font-number: ui-rounded, "SF Pro Rounded", -apple-system, sans-serif;

  /* --- 寸法 --- */
  --radius:   16px;
  --radius-s: 10px;
  --tabbar-h: 62px;
  --shadow: 0 1px 2px rgba(20, 35, 28, .05), 0 6px 20px rgba(20, 35, 28, .06);
}

/* --- ダークモード（端末設定に追従） --- */
@media (prefers-color-scheme: dark) {
  :root {
    --bg:        #0F1513;
    --surface:   #19211D;
    --surface-2: #232D28;
    --ink:       #ECF2EE;
    --sub:       #8DA197;
    --line:      #29332D;

    --accent:    #4CC79A;  /* 暗所では明るい緑に持ち上げる */
    --accent-soft:#1C3A2F;
    --expense:   #F07B67;
    --expense-soft:#3C221D;
    --danger:    #F07B67;

    --shadow: 0 1px 2px rgba(0,0,0,.3), 0 6px 20px rgba(0,0,0,.25);
  }
}

/* アニメーションを減らす設定の端末を尊重 */
@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}