/* 桜台自治会デモ 読みやすさ調整 + 回覧板の見た目
   方針: SWELLのレイアウトは壊さない。文字の大きさ・行間・コントラストと、
   自作パーツ(.skd-*)の見た目だけを担当する。 */

:root{
  --skd-green:#1F4B3F;
  --skd-green2:#2E6B58;
  --skd-sakura:#C4506E;
  --skd-line:#E2E6E8;
  --skd-muted:#5A646D;
}

/* --- 文字サイズ切替（rem基準を動かす） --- */
html[data-skd-fs="l"]  { font-size:118%; }
html[data-skd-fs="xl"] { font-size:136%; }

body{ font-size:1.0625rem; line-height:1.9; }
p, li{ line-height:1.9; }

/* --- 切替バー --- */
.skd-fsbar{
  background:#F4F6F5; border-bottom:1px solid var(--skd-line);
  padding:8px 16px; display:flex; gap:10px; align-items:center; flex-wrap:wrap;
  font-size:.82rem; color:var(--skd-muted);
}
.skd-fsbar button{
  font:inherit; font-size:.86rem; min-width:56px; min-height:44px; padding:0 14px;
  background:#fff; border:1.5px solid var(--skd-line); border-radius:9px;
  color:#1B2025; cursor:pointer;
}
.skd-fsbar button[aria-pressed="true"]{
  background:var(--skd-green); border-color:var(--skd-green); color:#fff; font-weight:700;
}

/* --- デモである旨の帯 --- */
.skd-demobar{
  background:#3A3F45; color:#fff; text-align:center;
  padding:7px 14px; font-size:.8rem; line-height:1.6;
}
.skd-demobar b{ color:#FFD9E2; }

/* --- 回覧板の一覧 --- */
.skd-kairan-list{ list-style:none; margin:0; padding:0; border-top:1px solid var(--skd-line); }
.skd-kairan-item{ border-bottom:1px solid var(--skd-line); }
.skd-kairan-link{
  display:grid; grid-template-columns:auto 1fr auto; gap:6px 16px; align-items:start;
  padding:16px 6px; text-decoration:none; color:inherit;
}
.skd-kairan-link:hover{ background:#F7F8F7; }
.skd-kairan-date{
  font-size:.85rem; color:var(--skd-muted);
  font-variant-numeric:tabular-nums; white-space:nowrap; padding-top:2px;
}
.skd-kairan-title{ display:block; font-weight:700; line-height:1.7; }
.skd-kairan-note{ display:block; font-size:.87rem; color:var(--skd-muted); margin-top:3px; }
.skd-kairan-pdf{
  font-size:.72rem; font-weight:700; color:#B03A3A;
  border:1.5px solid #EFCFCF; background:#FDF4F4;
  border-radius:6px; padding:3px 8px; white-space:nowrap; align-self:center;
}
.skd-kairan-more a{
  display:inline-flex; align-items:center; min-height:48px; padding:0 20px; margin-top:16px;
  background:#EDF3F0; color:var(--skd-green); border-radius:10px;
  text-decoration:none; font-weight:700; font-size:.95rem;
}
.skd-kairan-empty{ color:var(--skd-muted); }

/* --- ブロックパターン側 --- */
.skd-alert{
  border:2px solid #F0CBD5; background:#FCEFF2;
  border-radius:14px; padding:20px 22px; margin:22px 0;
}
.skd-alert__tag{
  display:inline-block; background:var(--skd-sakura); color:#fff;
  font-size:.76rem; font-weight:700; padding:4px 12px; border-radius:999px;
  letter-spacing:.06em; margin:0 0 6px;
}
.skd-alert h2{ margin:8px 0; font-size:1.12rem; }

h2.skd-sec{
  display:flex; align-items:center; gap:11px;
  font-size:1.24rem; color:var(--skd-green); letter-spacing:.04em; margin:36px 0 14px;
}
h2.skd-sec::before{
  content:""; width:9px; height:22px; border-radius:3px;
  background:var(--skd-sakura); flex:none;
}

.skd-tiles .wp-block-column,
.skd-plans .wp-block-column{
  border:1.5px solid var(--skd-line); border-radius:14px; padding:18px 18px;
  background:#fff;
}
.skd-tiles h3{ font-size:1.02rem; margin:0 0 6px; }
.skd-tiles p{ font-size:.87rem; color:var(--skd-muted); margin:0; }
.skd-plans p{ margin:0 0 6px; }
.skd-when{
  display:inline-block; background:var(--skd-green); color:#fff;
  font-size:.8rem; font-weight:700; padding:3px 11px; border-radius:999px;
}

.skd-links{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.skd-links li{
  display:flex; align-items:center; gap:10px; min-height:56px; padding:12px 16px;
  border:1.5px solid var(--skd-line); border-radius:11px; background:#fff;
  font-weight:600; font-size:.96rem;
}
.skd-links li::before{
  content:""; width:7px; height:7px; border-radius:50%;
  background:var(--skd-sakura); flex:none;
}

@media(min-width:768px){
  .skd-links{ grid-template-columns:repeat(3,1fr); }
}
@media(max-width:680px){
  .skd-kairan-link{ grid-template-columns:1fr auto; }
  .skd-kairan-date{ grid-column:1 / -1; }
}

/* デモ帯の中のリンク。文中インラインリンクなのでWCAG 2.5.8の除外対象だが、
   それでも押しやすいよう最低24pxは確保する。 */
.skd-demobar a{ display:inline-block; padding:4px 6px; color:#fff; }
