/*
*
 * NurseLink — tokens.css
 * ============================================================
 * デザイントークン（CSS変数）の唯一の定義元。
 * このファイルだけを変更すれば全ページに反映される。
 *
 * 読み込み順:
 *   1. bootstrap.min.css
 *   2. tokens.css      ← このファイル
 *   3. common.css
 *   4. forms.css       （フォームがあるページのみ）
 *   5. utilities.css   ← 必ず最後
 * ============================================================
 */

@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=M+PLUS+1:wght@400;500;600;700;800&display=swap');

:root {

    /* --------------------------------------------------------
       背景（3層サーフェス）
    -------------------------------------------------------- */
    --ui-bg:        #f5f5f7;   /* ページ背景 */
    --ui-surface:   #ffffff;   /* カード・パネル */
    --ui-surface-2: #f5f5f7;   /* カード内セカンダリ背景 */
    --ui-surface-3: #ebebf0;   /* ホバー・選択状態 */

    /* --------------------------------------------------------
       テキスト
    -------------------------------------------------------- */
    --ui-text:       #1d1d1f;  /* 本文・見出し */
    --ui-text-sub:   #6e6e73;  /* サブテキスト・説明 */

    /*
       補足・説明文。以前は #aeaeb2 だったが、白背景に対して
       コントラスト比 2.21:1 しかなく、小さい文字がほとんど読めなかった
       （WCAG AA は 4.5:1 が必要）。実際この変数は画面の説明文に
       広く使われているので、読める濃さに変更した。
       #6e6e73 は白に対して 5.07:1、ページ背景(#f5f5f7)に対して 4.66:1。
    */
    --ui-text-muted: #6e6e73;

    /*
       入力欄のプレースホルダー専用。
       ここだけは薄いままにする。濃くすると「すでに入力済み」に見えてしまうため。
       （プレースホルダーは入力すると消えるので、本文と同じ基準は適用しない）
    */
    --ui-text-placeholder: #aeaeb2;

    --ui-text-light: #c7c7cc;  /* 最も薄い（区切り・装飾）  ※現在未使用・将来用 */

    /* --------------------------------------------------------
       ボーダー
    -------------------------------------------------------- */
    --ui-border:   #d2d2d7;   /* 通常ボーダー */
    --ui-border-2: #d2d2d7;   /* 強調ボーダー・フォーム */

    /* --------------------------------------------------------
       アクセントカラー（Apple HIG System Colors）
    -------------------------------------------------------- */
    --ui-accent:     #0071e3;  /* Primary Blue  */
    --ui-accent-rgb: 0, 113, 227;
    --ui-accent-hover: #0077ed;
    --ui-accent-lt:  rgba(0, 113, 227, 0.08);
    --ui-danger:  #ff3b30;  /* Red           */
    --ui-warning: #ff9500;  /* Orange        */
    --ui-success: #34c759;  /* Green         */
    --ui-purple:  #af52de;  /* Purple        */
    --ui-indigo:  #5856d6;  /* Indigo  ※現在未使用・将来用 */

    /* --------------------------------------------------------
       シェイプ（角丸）
    -------------------------------------------------------- */
    --ui-radius:      14px;    /* カード */
    --ui-radius-sm:   10px;    /* インプット・小カード */
    --ui-radius-xs:    6px;    /* バッジ・チップ */
    --ui-radius-pill: 100px;   /* ボタン・タグ */

    /* --------------------------------------------------------
       シャドウ
       設計思想: 薄いドロップ + 0.5px アウトライン（Apple質感）
    -------------------------------------------------------- */
    --ui-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
    --ui-shadow:    0 2px 8px rgba(0, 0, 0, 0.06),  0 0 0 0.5px rgba(0, 0, 0, 0.04);
    --ui-shadow-md: 0 4px 20px rgba(0, 0, 0, 0.08), 0 0 0 0.5px rgba(0, 0, 0, 0.04);
    --ui-shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.12), 0 0 0 0.5px rgba(0, 0, 0, 0.06);

    /* --------------------------------------------------------
       アニメーション
    -------------------------------------------------------- */
    --ui-transition: 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);

    /* --------------------------------------------------------
       フォント
    -------------------------------------------------------- */
    --font-sans: "M PLUS 1", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    --font-mono: "DM Mono", "Roboto Mono", monospace;

    /* --------------------------------------------------------
       タイポグラフィスケール（Apple HIG準拠）
       変数名 = Apple のスタイル名で統一（fs-* と混同しない）
    -------------------------------------------------------- */
    --text-large-title:  clamp(1.75rem,   5vw,   2.125rem); /* ページ大見出し        */
    --text-title-1:      clamp(1.375rem,  4vw,   1.75rem);  /* 28pt — セクション大見出し */
    --text-title-2:      clamp(1.125rem,  3vw,   1.375rem); /* 22pt — カード見出し   */
    --text-title-3:      clamp(1.0625rem, 2.5vw, 1.25rem);  /* 20pt — サブ見出し     */
    --text-headline:     1.0625rem; /* 17pt  — 強調本文            */
    --text-body:         1.0625rem; /* 本文  ※現在未使用・将来用 */
    --text-callout:      1rem;      /* 16pt  — コールアウト        */
    --text-subheadline:  0.9375rem; /* 15pt  — 小見出し・説明文    */
    --text-footnote:     0.8125rem; /* 13pt  — 注釈・ラベル        */
    --text-caption-1:    0.75rem;   /* 12pt  — キャプション        */
    --text-caption-2:    0.6875rem; /* 11pt  — 最小・バッジ内文字  */

    /* --------------------------------------------------------
       タイポグラフィ品質
       "palt" — 約物（。、「」など）の字間を詰める（Noto Sans JP 対応済み）
       "kern" — カーニングを有効化
    -------------------------------------------------------- */
    --font-feature: "palt" 1, "kern" 1;
}