/*
Theme Name: 神戸大学ホームカミングデイ2026 特設サイト
Theme URI: https://github.com/moeko-yamada/kobe-hcd-2026
Description: 第20回 神戸大学ホームカミングデイ 2026 特設サイトのオリジナルテーマ。静的HTML（制作: TONARI DESIGN）をWordPress化したもの。
Author: CHERISH LABO
Version: 0.3.0
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 8.0
Text Domain: kobe-hcd-2026
*/

/*
 * ページのスタイルは assets/inline/ 配下（静的HTMLの <style> をそのまま格納）で管理する。
 * このファイルには、WordPress化にあたって必要になった最小限の調整のみを書く。
 */

/* ログイン中は管理バー（32px / スマホ46px）とヘッダーが重なるため下げる */
body.admin-bar .header {
  top: 32px;
}
@media screen and (max-width: 782px) {
  body.admin-bar .header {
    top: 46px;
  }
}

/* ================================================================
   お知らせ本文（ブロックエディタ）
   静的HTMLの本文は手書きHTMLで、リストには .article__routes が付いていた。
   クライアントはブロックエディタで書くため、ブロックが出力するクラス
   （.wp-block-*）に対してスタイルを当てる。
   既存のクラシック投稿に影響しないよう、セレクタはブロック専用に限定する。
================================================================ */

/* 段落・リスト・見出しの間隔（* { margin: 0 } で全て潰れているため補う） */
.article__body .wp-block-heading {
  font-family: 'Zen Antique', serif;
  font-size: 22px;
  line-height: 1.6;
  color: var(--ink);
  margin: 40px 0 16px;
}
.article__body .wp-block-heading:first-child {
  margin-top: 0;
}

.article__body .wp-block-list {
  margin: 0 0 26px;
  padding-left: 1.4em;
  list-style: disc;
}
.article__body .wp-block-list li {
  font-size: 16px;
  line-height: 1.9;
  margin-top: 6px;
}
.article__body .wp-block-list li::marker {
  color: var(--yellow-deep);
}

/* 本文中のリンクは色で分かるようにする（サイト全体は a { color: inherit }）。
   記事下の申込ボタンも .article__body の中にあるため、ボタンは対象から外す。 */
.article__body a:not(.btn) {
  color: var(--red);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* 「申込導線リスト」スタイル … 静的HTMLの .article__routes と同じ見た目 */
.article__body .wp-block-list.is-style-hcd-routes {
  list-style: none;
  margin: 8px 0 26px;
  padding: 24px 28px;
  background: var(--red-pale);
  border-radius: 16px;
}
.article__body .wp-block-list.is-style-hcd-routes li {
  display: flex;
  align-items: baseline;
  gap: 12px;
  font-size: 15.5px;
  line-height: 1.8;
  padding: 8px 0;
  margin-top: 0;
}
.article__body .wp-block-list.is-style-hcd-routes li::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--yellow);
  flex-shrink: 0;
  transform: translateY(-1px);
}

/* 「ベージュの囲み」スタイル … 任意のブロックをまとめて囲む */
.article__body .wp-block-group.is-style-hcd-box {
  margin: 8px 0 26px;
  padding: 24px 28px;
  background: var(--red-pale);
  border-radius: 16px;
}
.article__body .wp-block-group.is-style-hcd-box > *:last-child {
  margin-bottom: 0;
}

@media (max-width: 620px) {
  .article__body .wp-block-list.is-style-hcd-routes,
  .article__body .wp-block-group.is-style-hcd-box {
    padding: 20px 18px;
    border-radius: 12px;
  }
}

/* ================================================================
   オンライン配信（YouTubeライブ配信の埋め込み）
   チャンネルIDが設定されているときだけ、静止画に代えてiframeを出す。
   静止画には ::after で再生ボタン風の装飾が乗っているため、
   埋め込み時は装飾を消す（iframeの再生ボタンを覆ってしまうため）。
   このファイルはインラインCSSより先に読み込まれるので、
   .access__video::after と同じ詳細度では勝てない。クラスを2つ重ねて上回らせる。
================================================================ */
.access__video.access__video--embed::after {
  content: none;
}
.access__video--embed iframe {
  display: block;
  width: 100%;
  height: 260px;
  border: 0;
}
@media (max-width: 560px) {
  .access__video--embed iframe {
    height: auto;
    aspect-ratio: 16 / 9;
  }
}