/**
 * 特価記事(/deals/{slug}/)の差分スタイル。
 *
 * 2026-08-07 に一覧(/deals/)を廃止したので、このファイルが読まれるのは個別記事だけ。
 * 土台は news.css(body.is-newsmode)と共有し、ここでは特価固有の要素だけを持つ。
 * すべて body.is-dealmode でスコープして、ニュース面に影響させない。
 *
 * 配色は news.css の CSS 変数を経由する(--nx-cat-sale = #15803d)。
 * ハードコードしないこと(CLAUDE.md のデザイン規約)。
 */

/* NOTE: 特価カード(.dealcard__lead / .nxbadge--pr 等)のスタイルは news.css にある。
   ニュース面(/news/)の特価セクションでも同じカードを使うが、deal.css は /deals/
   配下でしか enqueue されないため(functions.php)、ここに置くと素の表示になる。 */

/* 記事末尾の注意書き。価格・在庫の変動と、価格の数値を出していないことの補足。
   景表法の有利誤認対策として必ず出す(テンプレート側で常時描画) */
.is-dealmode .dealnote {
    margin: 20px 0 0;
    padding: 12px 14px;
    border-left: 3px solid var(--nx-line-strong);
    background: var(--nx-soft);
    font-size: 12px;
    line-height: 1.8;
    color: var(--nx-muted);
}

/* 特価記事では商品リンクが記事の主目的なので、ニュースより少し強く見せる */
.is-dealmode .nxarticle--deal .nxbuy {
    margin-top: 28px;
    border-left-width: 4px;
}

/* 価格。**楽天など API から正規に取得できたものだけ**表示される(Amazon は規約上出せない)。
   数値なので --f-mono + tabular-nums を通す(CLAUDE.md のデザイン規約) */
.is-dealmode .nxbuy__price {
    font-family: var(--f-mono);
    font-variant-numeric: tabular-nums;
    font-size: 15px;
    font-weight: 500;
    color: var(--nx-ink);
}