/*
 * リンクの青を、明るい配色でも読めるようにする（記録 20-55）。
 *
 * **本体（elastic）には触らない。** ここは `extends: elastic` の子の皮で、
 * 足りない決まりは親から降りてくる。この file だけが足し物である。
 *
 * ──────────────────────────────────────────────────────────
 * なぜ要るか
 * ──────────────────────────────────────────────────────────
 * Elastic は `a { color: #00acff }` を**明暗で同じまま**使っている。
 *
 *     #00acff   明るい地（白）  2.52 : 1   ← WCAG 2.2 AA の 4.5 に届かない
 *               暗い地          5.88 : 1   ok
 *
 * **明るい配色が初期値**なので、ふだん目にしているのは落ちているほうである。
 * ルール名も「ルールを追加」も一覧の件名も、画面じゅうのリンクが当たる。
 *
 * C6 の赤とまったく同じ形で、**1 つの青では両方をまかなえない**。
 * 明るい地で 4.5 を取るには暗い青が要り、その青は暗い地で 3 を切る。
 *
 *     #008acc（本体の hover 色）  明 3.81 / 暗 3.88
 *     #0080bf                     明 4.34 / 暗 3.41
 *     #0074ad                     明 5.12 / 暗 2.89
 *
 * so **明るい配色の側だけ**を入れ替える。暗い配色は本体のままでよい。
 *
 * ──────────────────────────────────────────────────────────
 * 重みと順番
 * ──────────────────────────────────────────────────────────
 * **`a` のままにして、重みを上げない。** 本体の `a` と同じ (0,0,1) で、
 * 読み込む順だけを後ろにしてある（`templates/includes/layout.html` で
 * 本体の様式の次に置いた）。重みを上げると、`.menu a` のように
 * **本体がわざと色を決めている場所まで塗り替えてしまう**。
 *
 * 実機で確かめた。この決まりを当てて `<a>` の色を全部測り直すと、
 * 変わったのは**素の青だったものだけ**だった。
 *
 *     受信箱 155 件中 14 件 / 設定 20 中 1 / 振り分け 24 中 4 /
 *     雛形 21 中 3 / フォルダの並び 19 中 1 / 連絡先 65 中 1 / 書く画面 61 中 1
 *
 * **暗い配色では 1 件も変わらない**（155・24・65・61 件すべて 0）。
 */
a { color: #0074ad; }                   /* 明るい地で 5.12 : 1 */
a:hover { color: #00527a; }             /* 同 8.44 : 1。本体にならって 10% 暗く */

/*
 * **`.btn-link` も同じ青である。**
 * 本体で素の青を**字の色**に使っているのは、`a`・`.btn-link`・
 * TinyMCE の作り付けの窓の 3 か所だけだった（`styles.min.css` を数えた）。
 * `.btn-link` は (0,1,0) なので上の `a` では届かない。
 *
 * 画面を数えたら、当たるのは**書く画面の「新しいウィンドウで開く」1 つだけ**
 * （受信箱 0 件・連絡先 0 件）。中身も `<a>` なので、見た目が散らばる心配は無い
 */
.btn-link { color: #0074ad; }
.btn-link:hover { color: #00527a; }

/*
 * 暗い配色は本体の青に戻す。**上の `a` がこちらまで効いてしまうため。**
 * `html.dark-mode a` は (0,1,2) で、本体で色を決めている所はどれも
 * id 付き（`#taskmenu a` など）かそれ以上なので、ここで食う物は無い。
 * これも実機で測って確かめてある。
 *
 * **hover は本体のままにしない。** `#008acc` は暗い地で 3.88 しか無く、
 * しかも**暗い地の上でさらに暗くなる**ので向きが逆である。
 * 同じ 10% を明るい側へ動かした
 */
html.dark-mode a { color: #00acff; }      /* 暗い地で 5.88 : 1（本体と同じ値） */
html.dark-mode a:hover { color: #33bdff; } /* 同 6.96 : 1。本体は 3.88 だった */

html.dark-mode .btn-link { color: #00acff; }
html.dark-mode .btn-link:hover { color: #33bdff; }
