/* ============================================================
   KaiMono — CSS カスタムプロパティ（テーマ変数）
   ライトモード / ダークモード対応
   ============================================================ */

:root {
  /* ブランドカラー */
  --color-primary:        #2E7D32;
  --color-primary-light:  #4CAF50;
  --color-primary-dark:   #1B5E20;
  --color-accent:         #FF8F00;
  --color-danger:         #C62828;
  --color-warning:        #F9A825;
  --color-success:        #2E7D32;

  /* 背景・サーフェス */
  --color-bg:             #F1F8E9;
  --color-surface:        #FFFFFF;
  --color-surface-2:      #F9FBF7;
  --color-border:         #C8E6C9;

  /* テキスト */
  --color-text:           #1B2E1C;
  --color-text-muted:     #5A7A5C;
  --color-text-on-primary:#FFFFFF;

  /* スワイプフィードバック */
  --color-swipe-add:      #43A047;
  --color-swipe-delete:   #E53935;

  /* 予算警告 */
  --color-budget-warn:    #F9A825;
  --color-budget-over:    #C62828;

  /* スペーシング */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  32px;
  --space-2xl: 48px;

  /* タイポグラフィ */
  --font-sans: 'Hiragino Sans', 'Noto Sans JP', 'Yu Gothic', sans-serif;
  --font-size-xs:   11px;
  --font-size-sm:   13px;
  --font-size-base: 15px;
  --font-size-md:   17px;
  --font-size-lg:   20px;
  --font-size-xl:   24px;

  /* ボーダー半径 */
  --radius-sm:  6px;
  --radius-md:  12px;
  --radius-lg:  18px;
  --radius-full: 9999px;

  /* シャドウ */
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.08);
  --shadow-md:  0 4px 12px rgba(0,0,0,0.10);
  --shadow-lg:  0 8px 24px rgba(0,0,0,0.12);

  /* アニメーション */
  --duration-fast:   150ms;
  --duration-normal: 250ms;
  --duration-slow:   400ms;
  --ease-bounce:     cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ボトムナビの高さ */
  --bottom-nav-height: 64px;
}

/* ダークモード */
@media (prefers-color-scheme: dark) {
  :root {
    --color-bg:         #0F1F10;
    --color-surface:    #1A2E1B;
    --color-surface-2:  #223323;
    --color-border:     #2E4A2F;
    --color-text:       #E8F5E9;
    --color-text-muted: #81A882;
  }
}