/* ========================================================================
   news-v2.css — ニュース記事テンプレート B案「Press Desk」
   laravel-site.css の後に読み込む上書き差分 (news 記事/一覧のみで読み込む)。
   狙い: 読みやすさ最優先の編集(エディトリアル)デザイン。
   ① スキャンライン・グロー・ブラケット装飾を全廃、背景をわずかに青みへ
   ② 1 カラム 720px。TOC は inline のみ (右サイドバー廃止)
   ③ 記事冒頭に「要点」ボックス (news-tldr) — blade 側で tldr / summary から生成
   ④ 赤はカテゴリ色 + 重要度のみ。本文はニュートラル
   ⑤ 一覧はカード → 行リスト (スマホで一覧性が高い)
   ======================================================================== */

/* --- カテゴリ別アクセント ------------------------------------------------ */
.news-cat--vulnerability    { --cat: #ff4d6d; }
.news-cat--ransomware       { --cat: #ff7849; }
.news-cat--data-leak        { --cat: #f5a524; }
.news-cat--intrusion        { --cat: #ff00aa; }
.news-cat--ai-security      { --cat: #b794f4; }
.news-cat--supply-chain     { --cat: #22d3ee; }
.news-cat--policy           { --cat: #8da2fb; }
.news-cat--incident-general { --cat: #ff4d6d; }
.news-cat--ai-tech          { --cat: #b794f4; }
.news-cat--it-product       { --cat: #34d399; }
.news-cat--tech-trend       { --cat: #38bdf8; }
.news-cat--dev-tools        { --cat: #a3e635; }

/* ========================================================================
   0. 背景と地の色: スキャンライン/環境光を止め、フラットな #0b0e14 に
   ======================================================================== */
body.news_post { background: #0b0e14; }
body.news_post::before,
body.news_post::after { display: none; }

/* ========================================================================
   1. レイアウト: 1 カラム 720px。右サイドバー TOC は廃止
   ======================================================================== */
body.news_post .with-sidebar--right { display: block; }
body.news_post .sidebar--right { display: none; }
body.news_post .post-detail { max-width: 720px; margin: 0 auto; }

/* inline TOC は控えめな折りたたみに (既定で閉じる) */
body.news_post .toc-card-inline {
    display: block;
    background: none;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 8px;
}
body.news_post .toc-card-inline summary { font-size: .82rem; }
body.news_post .toc-inline-label { color: #8b94a3; text-shadow: none; }

/* パンくず・見出しアンカーを demote */
body.news_post .breadcrumbs { opacity: .7; }
body.news_post .heading-anchor { opacity: 0; transition: opacity .15s; }
body.news_post .post-body h2:hover .heading-anchor,
body.news_post .post-body h3:hover .heading-anchor { opacity: .6; color: #8b94a3; text-shadow: none; }

/* ========================================================================
   2. ヘッダ: kicker 行 (カテゴリ・重要度・日付) → タイトル → 読了時間
   ======================================================================== */
body.news_post .post-header { border-bottom: none; padding-top: 0; }
body.news_post .post-header::before,
body.news_post .post-header::after { display: none; }

.news-kicker {
    display: flex; align-items: center; flex-wrap: wrap; gap: .9rem;
    margin-bottom: 1rem;
    font-family: var(--hl-mono);
    font-size: .74rem; letter-spacing: .5px;
}
.news-kicker .news-cat-chip {
    color: var(--cat, #ff4d6d);
    font-weight: 700; letter-spacing: 1px;
    padding: 0; border: none; background: none;
}
.news-kicker .news-kicker-date { color: #8b94a3; }
.news-kicker .news-kicker-imp { display: inline-flex; align-items: center; gap: .35rem; font-weight: 700; }
.news-kicker .news-kicker-imp::before {
    content: ''; width: .45rem; height: .45rem; border-radius: 50%; background: currentColor;
}
.news-kicker .news-kicker-imp--high   { color: #ff5577; }
.news-kicker .news-kicker-imp--medium { color: #f5a524; }
.news-kicker .news-kicker-imp--low    { color: #34d399; }

body.news_post .post-title-text {
    text-shadow: none;
    font-size: 2.05rem;
    line-height: 1.42;
    letter-spacing: -0.01em;
    color: #f5f7fa;
}
body.news_post .post-stats { font-size: .8rem; color: #77808f; }
body.news_post .post-stats .read-time { color: #77808f; text-shadow: none; background: none; border: none; }
body.news_post .post-stats__log-date { display: none; } /* 日付は kicker へ移動 */
body.news_post .post-stats > span:not([class]) { display: none; } /* view / like は記事下へ */
body.news_post .importance-badge--lg { display: none; } /* 重要度も kicker へ移動 */

/* タグは本文の後ろへ回す前提 (blade で位置変更)。控えめに */
body.news_post .post-tags a { color: #8b94a3; border-color: rgba(255,255,255,0.14); background: none; text-shadow: none; }
body.news_post .post-tags a:hover { color: #fff; border-color: rgba(255,255,255,0.35); }

/* ========================================================================
   3. 要点ボックス (news-tldr) — 記事冒頭 3 行要約
   ======================================================================== */
.news-tldr {
    margin: 1.6rem 0 2.4rem;
    padding: .2rem 0 .2rem 1.3rem;
    border-left: 2px solid var(--cat, #ff4d6d);
}
.news-tldr-label {
    display: block;
    font-family: var(--hl-mono);
    font-size: .7rem; font-weight: 700; letter-spacing: 2px;
    color: #8b94a3;
    margin-bottom: .45rem;
}
.news-tldr ul { list-style: none; margin: 0; padding: 0; }
.news-tldr li {
    position: relative;
    padding-left: 1.1rem;
    margin: .4rem 0;
    font-size: .98rem;
    line-height: 1.8;
    color: #d5dae2;
}
.news-tldr li::before {
    content: '';
    position: absolute; left: 0; top: .78em;
    width: .45rem; height: 2px;
    background: #7c8798;
}

/* ========================================================================
   4. 本文タイポグラフィ: ニュートラル + 大きめ
   ======================================================================== */
body.news_post .post-body {
    font-size: 1.1rem;
    line-height: 2.05;
    color: #d5dae2;
}
body.news_post .post-body p { margin: 1.4em 0; }

/* リード段落の特別扱いを解除 (要点ボックスが役割を担う) */
body.news_post .post-body > p:first-of-type {
    font-size: 1.1rem;
    line-height: 2.05;
    color: #d5dae2;
    background: none;
    border: none;
    border-image: none;
    padding: 0;
}

/* h2: 番号・背景・ボーダー全廃 → 短いカテゴリ色バー + 白見出し */
body.news_post .post-body h2 {
    display: block;
    margin-top: 3.4rem;
    padding: 0;
    background: none;
    border: none;
    color: #f5f7fa;
    font-size: 1.4rem;
    line-height: 1.5;
    text-shadow: none;
    transition: none;
}
body.news_post .post-body h2:hover { background: none; }
body.news_post .post-body h2::before {
    content: '';
    display: block;
    width: 2.4rem; height: 3px;
    background: var(--cat, #ff4d6d);
    border-radius: 2px;
    margin-bottom: .75rem;
    counter-increment: news-h2;
}
body.news_post .post-body h3 {
    border-left: none;
    padding-left: 0;
    color: #e8ecf1;
    font-size: 1.16rem;
    text-shadow: none;
}

/* blockquote: 静かな引用 */
body.news_post .post-body blockquote {
    font-style: normal;
    background: none;
    border-left: 3px solid rgba(255,255,255,0.18);
    padding: .2em 0 .2em 1.3em;
    color: #b9c2cf;
}
body.news_post .post-body blockquote::before { display: none; }

/* inline code: ニュートラル */
body.news_post .post-body code {
    background: rgba(255,255,255,0.08);
    color: #e6edf3;
    border: none;
}

/* リンク: 落ち着いたシアン */
body.news_post .post-body a:not(.heading-anchor) {
    background-image: none;
    color: #7ce7f0;
    text-decoration: underline;
    text-decoration-color: rgba(124,231,240,0.4);
    text-underline-offset: 3px;
    text-shadow: none;
}
body.news_post .post-body a:not(.heading-anchor):hover { color: #fff; text-decoration-color: #7ce7f0; text-shadow: none; }

/* リスト: ニュートラルなマーカー */
body.news_post .post-body ul > li::before { content: '•'; color: #7c8798; text-shadow: none; font-size: 1.1em; }
body.news_post .post-body ol > li::marker { color: #9aa5b4; }

/* table: ニュートラル */
body.news_post .post-body table { box-shadow: none; border-color: rgba(255,255,255,0.1); }
body.news_post .post-body thead { background: #151a23; }
body.news_post .post-body th { color: #e6edf3; text-shadow: none; border-right-color: rgba(255,255,255,0.07); }
body.news_post .post-body td { border-top-color: rgba(255,255,255,0.05); border-right-color: rgba(255,255,255,0.03); }
body.news_post .post-body td:first-child { color: inherit; text-shadow: none; }
body.news_post .post-body tbody tr:nth-child(even) td { background: rgba(255,255,255,0.018); }
body.news_post .post-body tbody tr:hover td { background: rgba(255,255,255,0.04); }

/* ========================================================================
   5. 出典: terminal 窓 → シンプルなカード
   ======================================================================== */
body.news_post .news-source-callout {
    padding: 1rem 1.3rem;
    background: #11151d;
    border: 1px solid rgba(255,255,255,0.09);
    border-left: 3px solid var(--cat, #ff4d6d);
    border-radius: 8px;
    box-shadow: none;
}
body.news_post .news-source-callout::before,
body.news_post .news-source-callout::after { display: none; }
body.news_post .news-source-callout .label {
    display: block;
    color: #8b94a3;
    text-shadow: none;
    font-size: .72rem;
    letter-spacing: 2px;
    margin-bottom: .4rem;
}
body.news_post .news-source-callout a { color: #7ce7f0; text-decoration-color: rgba(124,231,240,0.4); }
body.news_post .news-source-callout a:hover { color: #fff; }

/* av2 図表: 数字グローのみ抑制 */
body.news_post .article-v2 .av2-stat-num,
body.news_post .article-v2 .av2-gauge-num { text-shadow: none; }

/* ========================================================================
   6. 一覧: カードグリッド → 行リスト (スマホの一覧性重視)
   ======================================================================== */
.news-list .post-grid {
    display: block;
    border-top: 1px solid rgba(255,255,255,0.08);
    margin: 1rem 0;
}
.news-list .post-card {
    background: none;
    border: none;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    border-radius: 0;
    box-shadow: none;
    transform: none;
}
.news-list .post-card::before { display: none; }
.news-list .post-card:hover { background: rgba(255,255,255,0.03); box-shadow: none; transform: none; }
.news-list .post-card a.post-card-link {
    flex-direction: row-reverse;
    align-items: flex-start;
    gap: 1.1rem;
    padding: 1.1rem .4rem;
}
.news-list .post-card-thumb {
    width: 148px;
    flex: 0 0 148px;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 8px;
}
.news-list .post-card-body { padding: 0; gap: .35rem; }
.news-list .post-card-title { font-size: 1.04rem; line-height: 1.55; }
.news-list .post-card:hover .post-card-title { color: #fff; }
.news-list .post-card-summary {
    font-size: .84rem; line-height: 1.7; color: #8b94a3;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.news-list .post-card-tag-row { gap: .8rem; font-family: var(--hl-mono); font-size: .7rem; }
.news-list .post-card-type { display: none; } /* 「ニュース」共通チップは一覧では冗長 */
.news-list .news-cat-chip {
    color: var(--cat, #ff4d6d);
    font-weight: 700; letter-spacing: 1.5px;
    background: none; border: none; padding: 0;
}
.news-list .post-card-date { color: #77808f; letter-spacing: .5px; }
.news-list .importance-badge { background: none; border: none; padding: 0; text-shadow: none; letter-spacing: .5px; }
.news-list .importance-badge::before { box-shadow: none; }
.news-list .importance-badge--medium, .news-list .importance-badge--low { display: none; } /* 高のみ表示 */
.news-list .post-card-meta { display: none; } /* 日付は tag-row、view/like は非表示 */
.news-list .card-bookmark { top: .9rem; right: 0; }

@media (max-width: 640px) {
    body.news_post .post-title-text { font-size: 1.5rem; }
    body.news_post .post-body { font-size: 1.02rem; line-height: 1.95; }
    .news-tldr { padding: 1rem 1.1rem; }
    .news-list .post-card-thumb { width: 104px; flex-basis: 104px; }
    .news-list .post-card-summary { display: none; } /* スマホはタイトル + メタのみ */
}