/* ================================================================
   法律と政権の年表（houritsu）共通スタイル
   3ページ（トップ / 内閣詳細 / 検索）で共有。tokens.css を継承。
   ================================================================ */

/* ---- サブナビ（subsidy-subnav と同パターン） ---- */
.houritsu-subnav { display:flex; flex-wrap:wrap; gap:var(--s-2); margin:var(--s-4) 0 var(--s-5); padding-bottom:var(--s-4); border-bottom:1px solid var(--c-line); }
.houritsu-subnav a { padding:7px 16px; border:1px solid var(--c-line); border-radius:999px; font-size:var(--t-sm); color:var(--c-ink-soft); text-decoration:none; background:var(--c-surface); transition:background .15s, color .15s, border-color .15s; }
.houritsu-subnav a:hover { border-color:var(--c-brand); color:var(--c-brand); }
.houritsu-subnav a.active { background:var(--c-brand); border-color:var(--c-brand); color:#fff; }

/* ---- 内閣チップ・バッジ ---- */
.cab { display:inline-block; font-size:.905rem; font-weight:700; padding:2px 10px; border-radius:20px; border:1px solid var(--c-line); background:var(--c-paper-2,#e2e8f0); color:var(--c-ink); white-space:nowrap; text-decoration:none; }
a.cab:hover { border-color:var(--c-brand); color:var(--c-brand); }
.cab.enf { background:var(--c-blue); border-color:var(--c-blue); color:#fff; }
a.cab.enf:hover { color:#fff; opacity:.85; }
.badge-cross { font-size:.875rem; font-weight:700; color:#fff; background:var(--c-blue); padding:3px 10px; border-radius:20px; letter-spacing:.04em; }
.badge-kind { font-size:.875rem; font-weight:700; padding:3px 10px; border-radius:20px; letter-spacing:.04em; border:1px solid var(--c-line); color:var(--c-ink-soft); background:var(--c-surface); }
.badge-kind.new { background:var(--c-ink); border-color:var(--c-ink); color:#fff; }
.badge-dead { font-size:.875rem; color:#fff; background:var(--c-ink-mute); padding:3px 8px; border-radius:20px; }
.badge-future { font-size:.875rem; font-weight:700; color:var(--c-teal); border:1px solid var(--c-teal); padding:2px 8px; border-radius:20px; }

/* ---- 成立→公布→施行の行 ---- */
.flow { display:flex; flex-direction:column; gap:6px; margin:0 0 6px; }
.flow-row { display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center; font-size:.94rem; }
.flow-row .k { font-size:.905rem; font-weight:700; color:var(--c-ink-mute); width:6.5em; }
@media (max-width:560px){ .flow-row .k { width:100%; } }
.flow-row .d { font-feature-settings:"tnum"; font-weight:700; }
.flow-row .gap { font-size:.905rem; color:var(--c-blue); font-weight:700; }
.flow-row.enf-row .d { color:var(--c-blue); }

/* ---- 法律カード（検索・内閣詳細の一覧） ---- */
.law-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.law-card { border:1px solid var(--c-line); border-radius:var(--r-md); background:var(--c-surface); padding:12px 14px; }
.law-card h3 { font-family:var(--f-serif); font-weight:800; font-size:.98rem; margin:0 0 2px; line-height:1.5; }
.law-card .no { font-size:.905rem; color:var(--c-ink-mute); margin:0 0 8px; }
.law-card .cats { font-size:.875rem; color:var(--c-ink-mute); margin:6px 0 0; }
.law-card .tags { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-bottom:7px; }
.law-srcline { font-size:.875rem; color:var(--c-ink-mute); margin:8px 0 0; line-height:1.6; }
.law-more { text-align:center; margin-top:14px; }
.law-more button { font-size:.94rem; padding:8px 22px; border:1px solid var(--c-line); border-radius:20px; background:var(--c-surface); color:var(--c-ink-soft); cursor:pointer; }
.res-count { font-size:.94rem; color:var(--c-ink-mute); margin:0 0 10px; }

/* ---- 施行イベント行（内閣詳細の「この内閣で施行」） ----
   ①日付（固定幅＝チップの縦位置が揃う）＋内閣チップ ②法律名 ③正式名・成立・出典 */
.enf-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.enf-item { border:1px solid var(--c-line); border-left-width:4px; border-radius:var(--r-md); background:var(--c-surface); padding:10px 13px; }
.enf-item.cross { border-left-color:var(--c-blue); }
.enf-item .e-head { display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center; }
.enf-item .e-date { display:inline-block; font-feature-settings:"tnum"; font-weight:700; color:var(--c-blue); font-size:.88rem; white-space:nowrap; width:9.5em; flex:none; }
@media (max-width:420px){ .enf-item .e-date { width:auto; } }
.enf-item .e-name { font-family:var(--f-serif); font-weight:800; font-size:.94rem; line-height:1.5; margin:5px 0 0; }
.enf-item .e-sub { font-size:.905rem; color:var(--c-ink-mute); margin:4px 0 0; line-height:1.6; }
.enf-item .e-sub a { color:var(--c-ink-mute); }

/* ---- 内閣スクロール（トップ） ---- */
.cab-scroll { position:relative; margin-top:var(--s-4); }
.cab-scroll::before { content:""; position:absolute; left:8px; top:8px; bottom:8px; width:2px; background:var(--c-line); }
.cab-sec { position:relative; padding:0 0 var(--s-5) 30px; }
.cab-sec::before { content:""; position:absolute; left:1px; top:10px; width:16px; height:16px; border-radius:50%; border:3px solid var(--c-paper,#f1f0e8); background:var(--c-ink-mute); }
.cab-sec.now::before { background:var(--c-brand); }
.cab-year { font-family:var(--f-serif); font-weight:800; font-size:.92rem; color:var(--c-ink-mute); font-feature-settings:"tnum"; margin:0 0 6px; }
.cab-card { border:1px solid var(--c-line); border-radius:var(--r-md); background:var(--c-surface); padding:16px 18px; }
.cab-card.now { border-color:var(--c-brand); }
.cab-head { display:flex; flex-wrap:wrap; gap:4px 14px; align-items:baseline; }
.cab-head h2 { font-family:var(--f-serif); font-weight:800; font-size:1.45rem; margin:0; }
.cab-head .cab-meta { font-size:.905rem; color:var(--c-ink-soft); font-feature-settings:"tnum"; }
.cab-nums { display:flex; flex-wrap:wrap; gap:4px 18px; align-items:baseline; margin:10px 0 4px; }
.cab-nums .n-big { font-family:var(--f-serif); font-weight:800; font-size:2rem; line-height:1.1; font-feature-settings:"tnum"; }
.cab-nums .n-big .u { font-size:max(.45em, 14px); margin-left:2px; }
.cab-nums .n-sub { font-size:.905rem; color:var(--c-ink-soft); font-feature-settings:"tnum"; }
.cab-block { margin-top:12px; }
.cab-block .b-label { font-size:.905rem; font-weight:700; color:var(--c-ink-mute); margin:0 0 6px; }
.cab-block .b-label .b-count { font-weight:500; }
.cab-block ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:5px; }
.cab-block li { font-size:.94rem; line-height:1.55; display:flex; flex-wrap:wrap; gap:4px 8px; align-items:center; }
.cab-block li .h-date { font-size:.905rem; color:var(--c-ink-mute); font-feature-settings:"tnum"; white-space:nowrap; }
.cab-block li .h-name { font-weight:700; }
.cab-block .b-empty { font-size:.905rem; color:var(--c-ink-mute); }
.cab-more { display:inline-flex; align-items:center; gap:6px; margin-top:16px; padding:10px 18px;
  font-size:.95rem; font-weight:700; line-height:1.2; color:#fff; background:var(--c-brand);
  border:2px solid var(--c-brand); border-radius:6px; text-decoration:none;
  transition:background .15s, color .15s; }
.cab-more:hover { background:#fff; color:var(--c-brand); }

/* ---- 内閣詳細ヘッダー ---- */
.cabdetail-head { border-bottom:2px solid var(--c-brand); padding-bottom:var(--s-4); margin-bottom:var(--s-4); }
.cabdetail-head h1 { font-family:var(--f-serif); font-weight:800; font-size:clamp(1.7rem,6vw,2.4rem); margin:0; }
.cabdetail-head .meta { font-size:.94rem; color:var(--c-ink-soft); margin:6px 0 0; font-feature-settings:"tnum"; }
.cab-prevnext { display:flex; justify-content:space-between; gap:10px; margin:var(--s-4) 0; }
.cab-prevnext a { font-size:.94rem; padding:7px 14px; border:1px solid var(--c-line); border-radius:999px; background:var(--c-surface); color:var(--c-ink-soft); text-decoration:none; }
.cab-prevnext a:hover { border-color:var(--c-brand); color:var(--c-brand); }
.stat-row { display:flex; flex-wrap:wrap; gap:10px; margin:var(--s-4) 0; }
.stat-box { border:1px solid var(--c-line); border-radius:var(--r-md); background:var(--c-surface); padding:12px 16px; min-width:8.5em; text-align:center; }
.stat-box .s-label { font-size:.875rem; font-weight:700; color:var(--c-ink-mute); }
.stat-box .s-num { font-family:var(--f-serif); font-weight:800; font-size:1.7rem; line-height:1.2; font-feature-settings:"tnum"; }
.stat-box .s-sub { font-size:.875rem; color:var(--c-ink-soft); font-feature-settings:"tnum"; }

/* ---- 検索コントロール（入力・セレクト・チップの高さと下端を揃える） ---- */
.search-controls { display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end; margin:var(--s-4) 0 6px; }
.search-controls .grp { display:flex; flex-direction:column; gap:6px; }
.search-controls .grp > span { font-size:.905rem; color:var(--c-ink-mute); font-weight:700; }
.search-controls input[type=search],
.search-controls select { height:40px; box-sizing:border-box; font-size:.95rem; padding:0 12px; border:1px solid var(--c-line); border-radius:var(--r-sm); background:var(--c-surface); color:var(--c-ink); }
.search-controls input[type=search] { width:min(22rem,72vw); }
.search-controls select { max-width:74vw; }
.search-controls .chips { min-height:40px; align-items:center; }
.search-note { font-size:.875rem; color:var(--c-ink-mute); margin:0 0 var(--s-4); }
.chips { display:flex; flex-wrap:wrap; gap:6px; }
.chip { font-size:.94rem; height:34px; padding:0 13px; border:1px solid var(--c-line); border-radius:20px; background:var(--c-surface); color:var(--c-ink-soft); cursor:pointer; }
.chip.on { background:var(--c-ink); color:#fff; border-color:var(--c-ink); }

/* ---- 右上固定のシェアボタン（law-card / enf-item 内の .feat-share） ----
   カード本体に position:relative を持たせ、ボタンを右上へ絶対配置する。
   1行目（タグ・日付行）が下に潜らないよう padding-right で逃がす。 */
.law-card, .enf-item, .feat-card { position:relative; }
.law-card .feat-share, .enf-item .feat-share, .feat-card .feat-share { position:absolute; top:8px; right:10px; margin:0; }
.law-card .tags { padding-right:8.5em; }
.enf-item .e-head { padding-right:8.5em; }
.feat-card .tags, .feat-card h3 { padding-right:8.5em; }

/* ---- ヒーロー（トップ） ---- */
.hero-num { text-align:center; padding:var(--s-4) 0 0; }
.hero-num .hn-big { font-family:var(--f-serif); font-weight:800; line-height:1; font-size:clamp(2.8rem,13vw,4.6rem); color:var(--c-emphasis); font-feature-settings:"tnum"; }
.hero-num .hn-big .unit { font-size:max(.32em, 14px); margin-left:4px; }
.hero-num .hn-sub { font-size:.94rem; color:var(--c-ink-soft); margin:8px 0 0; line-height:1.7; }

/* ---- 注目法律カード（内閣詳細で使用） ---- */
.feat-card { border:1px solid var(--c-line); border-left:4px solid var(--c-brand); border-radius:var(--r-md); background:var(--c-surface); padding:14px 16px; margin-bottom:10px; }
.feat-card h3 { font-family:var(--f-serif); font-weight:800; font-size:1.05rem; margin:0 0 2px; }
.feat-card .lawname { font-size:.905rem; color:var(--c-ink-mute); margin:0 0 8px; line-height:1.5; }
.feat-card .note { font-size:.88rem; line-height:1.7; margin:0 0 10px; }
.feat-share { margin-top:10px; }
.feat-share button { font-size:.905rem; padding:5px 12px; border:1px solid var(--c-line); border-radius:20px; background:var(--c-surface); color:var(--c-ink-soft); cursor:pointer; }
.feat-share button:hover { border-color:var(--c-brand); color:var(--c-brand); }
