/* ==========================================================================
   foursum — デザインシステム + 全画面コンポーネントスタイル
   このファイルが唯一のスタイルソース。使い方は docs/UI-GUIDE.md を参照。
   目次:
   1.  トークン (:root)
   2.  リセット / ベース
   3.  レイアウトユーティリティ
   4.  ヘッダー
   5.  ボタン
   6.  フォーム
   7.  ヒーロー検索バー
   8.  スティッキー検索サマリーバー / 並べ替え / フィルターピル
   9.  バッジ / タグ / 評価 / フェアウェイインジケータ
   10. コースカード + グリッド + 画像テーマ
   11. コース詳細ページ
   12. 統合ビュー「検討リスト＝投票」（コースカード + プラン行）
   13. モーダル（共有 / 名前入力ゲート）
   14. 投票部品（投票ボタン / 投票者チップ）
   15. トースト
   16. 空状態
   17. アニメーション / アクセシビリティ
   18. 詳細フィルターモーダル（プレースタイル / プレー人数オプション / 除外オプション）
   19. 評価内訳（口コミ評価軸）
   20. もっと見る（ページング）
   21. プラン一覧モーダル
   22. アイコン（Lucide）
   ========================================================================== */

/* ==========================================================================
   1. トークン
   ========================================================================== */
:root {
  /* アクセントカラー（ゴルフグリーン） */
  --accent: #0f7b4d;
  --accent-dark: #0b5c3a;
  --accent-darker: #08432a;
  --accent-light: #e6f4ec;
  --accent-light-strong: #cdeadb;
  --accent-contrast: #ffffff;

  /* ニュートラル */
  --ink-900: #14181a;
  --ink-800: #23292b;
  --ink-700: #3c4547;
  --ink-500: #6b7577;
  --ink-400: #8a9294;
  --ink-300: #b3b9ba;
  --border-color: #e6e8e6;
  --border-color-strong: #d3d7d4;
  --surface: #ffffff;
  --surface-sunken: #f4f6f4;
  --bg: #f7f8f6;

  /* セマンティック */
  --danger: #d1453d;
  --danger-light: #fbeceb;
  --star: #f5a623;

  /* 派生サーフェス: 写真・地図・ヘッダー上に浮く白の半透明面（ガラス面）と、
     ドロワー/モーダル共通の全画面オーバーレイ。 */
  --surface-glass: rgba(255, 255, 255, 0.92);
  --overlay: rgba(20, 24, 26, 0.5);
  /* 最も薄いアクセント面（投票済みプラン行の背景。--accent-light より1段淡い） */
  --accent-faint: #f3faf5;
  /* カレンダーの週末色（日曜=赤系・土曜=青系）。彩度を落とした専用色で、
     --danger 等のセマンティック色は流用しない（date-picker 専用の機能色）。 */
  --cal-sun: #b0554e;
  --cal-sat: #4a6fa0;

  /* 角丸 */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-pill: 999px;

  /* 影 */
  --shadow-xs: 0 1px 2px rgba(20, 24, 26, 0.05);
  --shadow-sm: 0 1px 2px rgba(20, 24, 26, 0.06), 0 1px 1px rgba(20, 24, 26, 0.04);
  --shadow-md: 0 12px 28px rgba(20, 24, 26, 0.10), 0 2px 6px rgba(20, 24, 26, 0.04);
  --shadow-lg: 0 24px 56px rgba(20, 24, 26, 0.16), 0 8px 20px rgba(20, 24, 26, 0.08);

  /* 余白スケール */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

  /* フォント */
  --font-sans: system-ui, -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-md: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;
  --text-3xl: 2.25rem;

  --header-height: 64px;
  --container-max: 1200px;
  --transition-fast: 0.15s ease;
  --transition-base: 0.22s cubic-bezier(0.2, 0.6, 0.2, 1);
}