/* =========================================================
 *  THEME B — ブルー × オレンジ × ホワイト（添付コンプ寄せ）
 *  style.css の後に読み込み、カラートークンと FV を上書きする。
 *  内容・構成は赤テーマ版（ai-system-260623）と同一。色味のみ差し替え。
 * ========================================================= */

:root {
  /* primary → ブルー */
  --c-main: #2563EB;
  --c-main-dark: #1E40AF;
  --c-main-light: #93C5FD;
  --c-main-grad-from: #3B82F6;
  --c-main-grad-to: #1D4ED8;
  --c-main-bg-soft: #EFF6FF;
  --c-main-bg-soft-2: #DBEAFE;
  --c-main-border-soft: #BFDBFE;
  /* CTA → ブルー */
  --c-accent: #2563EB;
  --c-accent-dark: #1D4ED8;
  /* 価格・限定の強調 → オレンジ（旧 gold 枠を流用） */
  --c-gold: #F97316;
  --c-gold-light: #FB923C;
  --c-gold-dark: #C2410C;
  /* セクション背景に薄い青み */
  --c-bg-soft: #F4F8FE;
}

/* CTA の影をブルーに */
.btn { box-shadow: 0 12px 28px rgba(37, 99, 235, 0.34); }
.btn:hover { box-shadow: 0 16px 34px rgba(37, 99, 235, 0.44); }

/* ---- FV: 明るい背景＋濃色テキスト ---- */
.fv {
  background:
    radial-gradient(120% 95% at 50% -8%, #ffffff, transparent 62%),
    linear-gradient(168deg, #EFF6FF 0%, #DBEAFE 58%, #C7DEFF 100%);
  color: var(--c-ink);
}
.fv::before { background-image: radial-gradient(rgba(37, 99, 235, 0.07) 1px, transparent 1px); opacity: 0.7; }
.fv-pill { background: #fff; border-color: #BFDBFE; color: var(--c-main); box-shadow: 0 2px 10px rgba(37, 99, 235, 0.14); }
.fv-title { color: var(--c-ink); }
.fv-price-inline { color: #EA580C; text-shadow: 0 2px 0 rgba(0, 0, 0, 0.06); }
.fv-sub { color: var(--c-text); }
.fv-sub .nope { color: #EA580C; font-weight: 600; }
.fv-merit { background: #fff; color: var(--c-text); box-shadow: 0 2px 8px rgba(17, 20, 25, 0.07); }
.fv-merit::before { color: var(--c-main); }
.fv-visual-note { color: var(--c-text-light); }
.fv-offer { border: 1px solid #DBEAFE; }
.fv-offer-limit { color: var(--c-main); }
.fv-offer-new, .fv-offer-arrow { color: #EA580C; }
.fv-offer-old { text-decoration-color: #EA580C; }

/* ---- 価格の数字をオレンジに（青の中で価格だけ際立たせる） ---- */
.price-amount-new, .price-headline .accent, .price-limit-note { color: #EA580C; }
.price-row--new { background: linear-gradient(180deg, #FFF7ED, #FFEDD5); }
.price-row--new .price-row-label { color: #C2410C; }
.price-amount-old { text-decoration-color: #EA580C; }

/* ---- 残枠を赤背景に（現行本番のトンマナに寄せる） ---- */
.scarcity { background: linear-gradient(168deg, #C2253A 0%, #8A1622 100%); }
.scarcity-alert {
  background: rgba(255, 255, 255, 0.08);
  border: 2px solid rgba(255, 255, 255, 0.30);
  color: #fff;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.35);
}
.scarcity-ribbon { background: #fff; color: #B11C2E; }
.scarcity-title { color: #fff; }
.scarcity-title .num, .scarcity-title .hot { color: #FBBF24; }
.slot { background: rgba(255, 255, 255, 0.12); border-color: rgba(255, 255, 255, 0.45); color: #fff; }
.slot-cap { color: rgba(255, 255, 255, 0.92); }
.slot-cap strong { color: #FBBF24; }
.scarcity-body { color: rgba(255, 255, 255, 0.94); }
.scarcity-body .hot { color: #FBBF24; }
.scarcity-alert .btn-note { color: rgba(255, 255, 255, 0.82); }