/* ============================================================
   ONLYLIFE 就活支援プロダクト 共通デザイントークン
   brand: ONLYLIFE / service: 就活ノート・SPIトレーニング・面接対策ノート
   ※ブランド名・配色は差し替え前提のプレースホルダーです
   ============================================================ */

:root {
  /* --- Brand colors ---------------------------------------- */
  --primary:        #0f4c81;   /* ネイビーブルー：信頼・人材業界 */
  --primary-dark:   #0b3a63;
  --primary-light:  #3a76ad;
  --accent:         #00a884;   /* グリーン：CTA・正解 */
  --accent-dark:    #00855f;

  /* --- Surfaces -------------------------------------------- */
  --bg-light:       #f4f8fc;
  --bg-white:       #ffffff;
  --bg-soft:        #eef3f8;
  --heading-bg:     #dbe9f7;   /* H2 帯の背景（参考サイトの #ffdccc に相当） */
  --code-bg:        #f6f6f6;   /* NG例・生データ用グレー */
  --cream-bg:       #fffdf2;   /* OK例・ティップス用クリーム */

  /* --- Text ------------------------------------------------ */
  --text-main:      #1a2733;
  --text-body:      #566472;   /* 本文 p の色（参考サイトの #666 に相当） */
  --text-muted:     #7d8b99;
  --text-invert:    #ffffff;

  /* --- Lines / shadows ------------------------------------- */
  --border-color:   #e2e8ef;
  --border-strong:  #c7d4e2;
  --shadow-card:    0 2px 10px rgba(15, 76, 129, .07);
  --shadow-float:   0 14px 40px rgba(15, 76, 129, .12);

  /* --- Semantic -------------------------------------------- */
  --ok:             #137a54;
  --ok-bg:          #e8f6f0;
  --ng:             #e0334c;
  --ng-dark:        #b81f36;
  --ng-bg:          #fff0f2;
  --warn:           #d98200;
  --warn-bg:        #fff7e8;

  /* --- Typography ------------------------------------------ */
  --font-base: "Noto Sans JP", "Hiragino Sans", "Yu Gothic UI", Meiryo, system-ui, sans-serif;
  --font-num:  "Roboto", "Noto Sans JP", system-ui, sans-serif;
  --fs-body:   16px;
  --lh-body:   1.85;
  --lh-ui:     1.6;

  /* --- Radius / spacing ------------------------------------ */
  --radius-sm:  6px;
  --radius:    10px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --gap-xs:  4px;
  --gap-sm:  8px;
  --gap:    16px;
  --gap-md: 24px;
  --gap-lg: 40px;
  --gap-xl: 64px;

  /* --- Layout ---------------------------------------------- */
  --header-height: 68px;
  --container:  1140px;
  --content-max: 1100px;
  --article-width: 760px;
  --aside-width:   300px;

  /* --- Phase badge colors（面接フェーズ） ------------------- */
  --phase-all:   #5b6b7a;
  --phase-1st:   #0f4c81;
  --phase-2nd:   #6a3fb5;
  --phase-final: #c2410c;
}

/* ブレークポイント（設計値・メディアクエリで使用）
   1024px : 2カラム→サイドバー縮小
    900px : サイドバー解体・目次差し替え・CTA全幅
    768px : ハンバーガー全画面オーバーレイ・見出し縮小
    600px : 1カラム・カード縦積み
*/

[data-theme="dark"] {
  --bg-light:      #12181f;
  --bg-white:      #1a2230;
  --bg-soft:       #212b3a;
  --heading-bg:    #22354a;
  --code-bg:       #1e2530;
  --cream-bg:      #242015;
  --text-main:     #eef3f8;
  --text-body:     #b9c5d1;
  --text-muted:    #8a97a5;
  --border-color:  #2c3846;
  --border-strong: #3c4a5a;
  --ok-bg:         #10291f;
  --ng-bg:         #2b1319;
  --warn-bg:       #2b2212;
}