/*
=====================================================
 ndesign-tokens.css  v1.0
 北見工大生協ルームガイド – 共通デザイントークン
 -----------------------------------------------------
 役割：
   ・全 n系ページ（nlist5 / ndetail4 / nform 等）で共有する
     色・角丸・影のCSS変数を一箇所にまとめたもの。
   ・各ページ専用CSSの一番上で読み込み、
     ページ側の :root では「この値を使う」エイリアスだけ
     定義する（ページ側の構造は変更しない）。
   ・主役は「部屋探し」。情報を素早く見つけられることを優先し、
     原色は使わず、視認性を保ったやさしいパステルにしている。
=====================================================
*/

:root {
  /* ---------- ベースグリーン（生協ブランドカラーを起点） ---------- */
  --n-green-700: #1f6b3a;   /* 最も濃い・本文の強調や深いアクセント */
  --n-green-600: #2f8a4d;   /* ボタン・hover時の濃色 */
  --n-green-500: #4caf6e;   /* メインカラー（ボタン・タイトル帯） */
  --n-green-400: #7ccB9a;   /* 補助強調 */
  --n-green-300: #a8dfc0;   /* 枠線・薄いアクセント */
  --n-green-200: #d2f0e0;   /* カード背景の薄緑 */
  --n-green-100: #eaf7f0;   /* 見出し帯の背景など */
  --n-green-50:  #f5fbf7;   /* ページ全体のうっすら背景 */

  /* ---------- パステル・アクセント（種別バッジ・設備タグ用） ---------- */
  --n-pastel-peach:    #ffe3c2;  --n-pastel-peach-tx:  #b5650a; /* 食事系 */
  --n-pastel-rose:     #ffd6da;  --n-pastel-rose-tx:   #b8455a; /* 価格・注意 */
  --n-pastel-sky:      #d4e8fb;  --n-pastel-sky-tx:    #2c6ca8; /* インターネット系 */
  --n-pastel-mint:     #d2f0e0;  --n-pastel-mint-tx:   #1f7a4d; /* 家具・家電系 */
  --n-pastel-lavender: #e6dcf5;  --n-pastel-lavender-tx:#6b4ba3; /* セキュリティ系 */
  --n-pastel-aqua:     #d2eeec;  --n-pastel-aqua-tx:   #19796f; /* 水回り系 */
  --n-pastel-amber:    #fdeec2;  --n-pastel-amber-tx:  #8a6a0a; /* 暖房系 */

  /* 物件種別（4タイプ）に対応するパステルカラー */
  --n-type1: #6fa8d8; /* 生協オリジナルマンション：ソフトブルー */
  --n-type2: #e8a358; /* 食事付下宿：ソフトオレンジ */
  --n-type3: #5fbfae; /* アパート・マンション：ソフトティール */
  --n-type4: #e07b8f; /* 食事付アパート：ソフトローズ */

  /* ---------- ニュートラル ---------- */
  --n-gray-50:  #f7f9f8;
  --n-gray-100: #eef2f0;
  --n-gray-200: #dbe3df;
  --n-gray-400: #8d9a93;
  --n-gray-600: #54615a;
  --n-gray-800: #2c332e;
  --n-white:    #ffffff;

  /* ---------- 警告・満室・動画など機能色（パステル化） ---------- */
  --n-alert:        #e8838f; /* 満室バッジなど */
  --n-alert-bg:     #fdecee;
  --n-movie:        #e8838f; /* 動画ありバッジ */

  /* ---------- 角丸 ---------- */
  --n-r-sm:  8px;
  --n-r-md:  12px;
  --n-r-lg:  18px;
  --n-r-xl:  24px;
  --n-r-pill: 999px;

  /* ---------- 影（やわらかめ） ---------- */
  --n-shadow-sm: 0 1px 4px rgba(31, 107, 58, 0.08);
  --n-shadow-md: 0 4px 14px rgba(31, 107, 58, 0.10);
  --n-shadow-lg: 0 8px 24px rgba(31, 107, 58, 0.14);

  /* ---------- フォント ---------- */
  --n-font: 'Noto Sans JP', Verdana, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
}
