/* ========================================
   文字サイズのスケール（全画面共通）

   1.25倍刻みの6段。全画面（公開GIS・現地調査・農地調査・管理者・
   案内ページ・アンケート・ヘルプ）がこのファイルを読み込む。

   現状の実測は tools/audit_type_scale.php を参照。
   ======================================== */

/* :root と body の両方で宣言している。理由は2つ。

   1. html 要素自身にも段が要る。style-base.css の `html, body` が
      font-size に段を使っており、:root に無いと html では未定義になって
      宣言ごと無効化される（rem の基準がブラウザ既定の16pxに戻ってしまう）。
   2. 文字サイズ切替は js/app-onboarding.js が body に fs-large /
      fs-xlarge を付けて切り替える。カスタムプロパティは宣言された要素で
      値が確定するため、body でも同じ式を宣言し直さないと :root の
      --fs-mult = 1 のまま固まり、倍率が反映されない。 */

:root {
  /* 文字サイズ切替（標準 / 大 / 特大）の倍率。
     この1つを変えると6段すべてが連動して拡大する。 */
  --fs-mult: 1;

  --fs-caption: calc(12px * var(--fs-mult)); /* 補助ラベル・単位・件数・注記 */
  --fs-body:    calc(15px * var(--fs-mult)); /* 本文・フォーム・ボタン・一覧 */
  --fs-subhead: calc(19px * var(--fs-mult)); /* カード見出し・パネル見出し */
  --fs-title:   calc(24px * var(--fs-mult)); /* 画面タイトル・モーダル見出し */
  --fs-display: calc(30px * var(--fs-mult)); /* ヒーロー・統計数値 */
  --fs-hero:    calc(38px * var(--fs-mult)); /* 案内ページの大見出し */

  /* アイコンの大きさ。文字ではないので別名にしているが、同じ段に載せて
     --fs-mult で一緒に拡大する。文字だけ大きくなるとアイコンが取り残され、
     拡大機能を使う人ほど状態表示や閉じるボタンが相対的に小さくなってしまう。
     固定サイズの枠に入るアイコン（40pxの角丸・64pxの丸・地図のマーカーなど）は
     枠からあふれるので連動させない。該当箇所にはその旨を書いてある。 */
  --icon-sm:  var(--fs-caption); /* 12px 一覧行の状態表示・小さな装飾 */
  --icon-md:  var(--fs-body);    /* 15px 閉じる・検索などの操作アイコン */
  --icon-lg:  var(--fs-subhead); /* 19px ツールバー・主要な操作 */
  --icon-xl:  var(--fs-title);   /* 24px 案内・強調 */
  --icon-2xl: var(--fs-hero);    /* 38px ロゴ・完了画面・空状態 */
}

/* --fs-mult は :root から継承するので、ここでは段だけを宣言し直す。 */
body {
  --fs-caption: calc(12px * var(--fs-mult));
  --fs-body:    calc(15px * var(--fs-mult));
  --fs-subhead: calc(19px * var(--fs-mult));
  --fs-title:   calc(24px * var(--fs-mult));
  --fs-display: calc(30px * var(--fs-mult));
  --fs-hero:    calc(38px * var(--fs-mult));

  --icon-sm:  var(--fs-caption);
  --icon-md:  var(--fs-body);
  --icon-lg:  var(--fs-subhead);
  --icon-xl:  var(--fs-title);
  --icon-2xl: var(--fs-hero);
}

/* 拡大時の倍率。style-base.css:282-307 に残っている固定値
   （18.9px など12件）を消すのは Phase 04。 */
body.fs-large  { --fs-mult: 1.35; }
body.fs-xlarge { --fs-mult: 1.6; }

/* JS が組み立てるマークアップ用の受け皿。
   fa-check と fa-chevron-down に 11px を直書きしたものが4ファイルに
   13箇所あったので、クラスへ寄せて1箇所で決まるようにした。
   （コメント内に font-size の宣言らしき文字列を書くと
     tools/audit_type_scale.php が宣言として数えてしまうので避ける） */
.icon-sm { font-size: var(--icon-sm); }
