/**
 * 合わせ目: カードレイアウト × ライト配色
 *
 * レイアウトは共有部品 layouts/card-grid にある。
 * 記事1件分のマークアップも同じディレクトリにある
 * （presets/_shared/layouts/card-grid/template-parts/post/content-excerpt.php）。
 *
 * ここにあるのは、そのレイアウトをライトで見せたときの「カード面の実値」だけである。
 *
 * なぜこのファイルが要るのか。
 * 旧「カードグリッド」プリセットは layouts/card-grid と palettes/light-blue の
 * 2部品でできており、light-blue が --color-bg-light: #fff / --color-border: #d0d7de /
 * --radius-lg: 1rem を body に当てていた。旧の見え方は
 * 「白いカード（#fff）が、薄灰のページ地（#f6f8fa）の上に乗る」である。
 * light-blue を削除したあと、親テーマ OptiB の :root がそのまま効くため
 * --color-bg-light は #f0f0f0、--color-bg は #fff になり、
 * 「薄灰のカードが白いページ地の上に乗る」という**図と地の反転**が起きた。
 * ここでカード面だけを旧の実値に戻し、その反転を防いでいる。
 *
 * なぜアクセント色を持たないのか。
 * light-blue は --primary-color を青（#1f6feb）に固定しており、
 * カスタマイザーの設定を握り潰していた。それが削除の理由である。
 * ライトのアクセントはカスタマイザーに返す約束なので、
 * --primary-color / --color-primary / --link-color の類をここに一切書かない。
 *
 * なぜサイト全体に効くトークンを持たないのか。
 * レイアウトは「記事一覧の並べ方だけを変える」設定である
 * （inc/settings-page.php の説明文: 「この設定が変えるのは記事一覧の並べ方だけです。
 * 配色は『配色』の側で決まります。」）。
 * --line-height-base / --color-text / --font-family-base / --container-max-width
 * のようなトークンをここで定義すると、レイアウトの選択が単一記事や固定ページまで
 * 染み出し、「4つの設定は互いに干渉しない」という前提と矛盾する。
 * ページ地（--color-bg）を旧の #f6f8fa に戻さないのも同じ理由と、
 * 「ライトは白ベース」という方針による。
 *
 * だから**トークン（--*）の定義は1つも置かない。実値を規則の側に書く。**
 * 流儀は skins/thumb-list-light と同じである。
 * 全組み合わせ共通のトークン（--optib-shadow-*）は
 * 子テーマの style.css の :root にあり、light-blue の削除に影響されないので触らない。
 *
 * ダーク側（card × dark）に合わせ目は無い。
 * layouts/card-grid はトークンで色を書いており、palettes/dark が
 * トークンを差し替えるだけで暗い面が成立するためである。
 * 実値が要るのはライト側だけ、という非対称はここに由来する。
 *
 * すべてのセレクタは .optib-skins-card-grid-light 配下、かつ
 * layouts/card-grid の対応する規則と同じ深さで書いてある。
 * 詳細度が並び、後から読まれるこちらが勝つ
 * （読み込み順は 配色 → レイアウト → 合わせ目）。
 */

/* カード本体の地・枠線・角丸。
 * layouts/card-grid/style.css の .optib-layouts-card-grid .p-post--card にある
 * background-color: var(--color-bg-light) / border: 1px solid var(--color-border) /
 * border-radius: var(--radius-lg) を、旧 light-blue の実値に戻す。
 * border の一括指定は分割しない。幅と線種だけを残すと
 * border-color が currentColor に落ちるためである。
 * box-shadow は触らない（--optib-shadow-* は子テーマの :root にあり、
 * light-blue の削除では動いていない）。 */
.optib-skins-card-grid-light .p-post--card {
  background-color: #fff;
  border: 1px solid #d0d7de;
  border-radius: 1rem;
}

/* メタ情報の上の罫線。カード枠と同じ色に揃える
 * （レイアウト側は border-top: 1px solid var(--color-border)）。 */
.optib-skins-card-grid-light .p-post--card .p-post__meta {
  border-top: 1px solid #d0d7de;
}

/* カード抜粋文の文字色。
 * layouts/card-grid/style.css の
 * .optib-layouts-card-grid .p-post--card .p-post__excerpt にある
 * color: var(--color-text-muted) を、旧 light-blue の実値 #6e7781 に戻す。
 * 旧の見え方に戻すためだけではない。白いカード地（上の #fff）の上で
 * WCAG 2.1 AA（本文 4.5:1）を満たすためである。
 *   旧 #6e7781 on #fff = 4.55:1（4.5 を満たす）
 *   親の既定 #888c8e on #fff = 3.39:1（4.5 を割る）
 * トークン（--color-text-muted）は再定義しない。定義すると記事一覧の外へ
 * 染み出すため、実値を規則の側に書く。 */
.optib-skins-card-grid-light .p-post--card .p-post__excerpt {
  color: #6e7781;
}
