/*
Theme Name: tomoplusgogo
Author: tomoplusgogo
Author URI: https://wordpress.org
Description: Ttomoplusgogo.
*/

/* =========================================================
   blog.css  —  「お知らせ」一覧 / 詳細 用追加スタイル
   - 既存の style.css / reset.css を前提に最小限の上書きと拡張
   - 色: 文字 #4C4B4A / グリーン #479A54 / ブルー #19b5e9 / ベースBG #FFFBF3
   ========================================================= */

/* ========== 共通: セクションの調整（一覧/詳細共通） ========== */

.news {
  /* style.css の .news をベースに必要に応じて微調整 */
}

.news__title {
  /* c-header-title が効いているため余白のみ追記 */
  margin-top: 0;
  margin-bottom: 24px;
}

.news__list {
  margin-top: 32px; /* 再確認のため明示 */
}

.news__item {
  padding-bottom: 10px;
  border-bottom: 1px solid #4C4B4A;
  display: flex;
  gap: 24px;
  align-items: baseline;
}

.news__date {
  white-space: nowrap;
  font-weight: 700;
  letter-spacing: 0;
  color: #4C4B4A;
}

.news__text {
  line-height: 1.7;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.news__text:hover {
  opacity: 0.9;
}

/* 空表示 */
.news__empty {
  text-align: center;
  padding: 40px 0;
  color: #4C4B4A;
}

/* SP 最適化 */
@media screen and (max-width: 767px) {
  .news__item {
    gap: 12px;
    padding-bottom: 12px;
  }
  .news__date {
    font-size: 14px;
  }
  .news__text {
    font-size: 15px;
  }
}

/* ========== 一覧: ページネーション ========== */

.pagination {
  margin-top: 32px;
  display: flex;
  justify-content: center;
}

.pagination .nav-links {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.pagination .page-numbers {
  display: inline-flex;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  justify-content: center;
  align-items: center;
  border: 1px solid #479A54;
  border-radius: 6px;
  color: #479A54;
  background: #fff;
  text-decoration: none;
  font-weight: 700;
}

.pagination .page-numbers.current {
  background: #479A54;
  color: #fff;
}

.pagination .page-numbers.prev,
.pagination .page-numbers.next {
  min-width: 56px;
}

/* SP */
@media screen and (max-width: 767px) {
  .pagination .page-numbers {
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    font-size: 14px;
  }
}

/* ========== 詳細: ヘッダー/メタ/本文 ========== */

.post-header {
  margin-top: 8px;
  margin-bottom: 16px;
  text-align: center;
}

.post-title {
  /* c-header-title が当たる想定。詳細ページでは少し小さく */
  font-size: 28px;
  line-height: 1.5;
  font-weight: 800;
  letter-spacing: 0;
  margin-bottom: 8px;
}

.post-meta {
  display: inline-flex;
  gap: 12px;
  align-items: center;
  color: #4C4B4A;
  font-weight: 700;
}

.post-cat {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 10px;
  background: #FFFBF3;
  border: 1px solid #479A54;
  color: #479A54;
  border-radius: 999px;
  font-size: 13px;
  line-height: 1.6;
}

/* SP */
@media screen and (max-width: 767px) {
  .post-title {
    font-size: 22px;
    line-height: 1.45;
  }
  .post-meta {
    font-size: 14px;
  }
}

/* 記事本体 */
.post-article {
  background: #fff;
  border-radius: 12px;
  padding: 24px;
  box-shadow: 0 0 2px rgba(0,0,0,0.12);
}

.post-thumb {
  margin: 0 0 16px 0;
  border-radius: 8px;
  overflow: hidden;
}
.post-thumb img {
  display: block;
  width: 100%;
  height: auto;
}

/* 本文タイポグラフィ（reset.cssで初期化されているため復元） */
.post-content {
  color: #4C4B4A;
  font-size: 16px;
  line-height: 1.9;
  letter-spacing: 0;
}

.post-content p + p {
  margin-top: 1em;
}

.post-content h2,
.post-content h3,
.post-content h4 {
  font-weight: 800;
  color: #479A54;
  line-height: 1.5;
  margin-top: 2em;
  margin-bottom: .6em;
}

.post-content h2 {
  font-size: 22px;
  border-bottom: 2px solid #479A54;
  padding-bottom: 6px;
}
.post-content h3 { font-size: 19px; }
.post-content h4 { font-size: 17px; }

/* リスト（resetでlist-styleが消えているため復元） */
.post-content ul,
.post-content ol {
  margin: .8em 0 .8em 1.2em;
}
.post-content ul { list-style: disc; }
.post-content ol { list-style: decimal; }
.post-content li + li { margin-top: .3em; }

/* 画像（WP のブロック/クラスにも配慮） */
.post-content img {
  height: auto;
  max-width: 100%;
}
.post-content .aligncenter,
.post-content .wp-block-image .aligncenter { display: block; margin: 1em auto; }
.post-content .alignleft,
.post-content .wp-block-image .alignleft { float: left; margin: .2em 1em .8em 0; }
.post-content .alignright,
.post-content .wp-block-image .alignright { float: right; margin: .2em 0 .8em 1em; }
.post-content figcaption {
  text-align: center;
  font-size: 14px;
  color: #777;
  margin-top: .4em;
}

/* 引用 */
.post-content blockquote {
  border-left: 4px solid #19b5e9;
  background: #F5FCFF;
  padding: 12px 16px;
  margin: 1.2em 0;
  border-radius: 4px;
}
.post-content blockquote p:last-child { margin-bottom: 0; }

/* 表 */
.post-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.2em 0;
  font-size: 15px;
}
.post-content th,
.post-content td {
  border: 1px solid #E4E4E4;
  padding: 10px 12px;
  vertical-align: top;
}
.post-content th {
  background: #FFFBF3;
  font-weight: 700;
  color: #4C4B4A;
}

/* コード */
.post-content pre,
.post-content code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
}
.post-content pre {
  background: #f7f7f7;
  border-radius: 6px;
  padding: 14px;
  overflow: auto;
  border: 1px solid #eee;
}

/* ページ分割（<!--nextpage-->） */
.post-pager {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 24px;
}
.post-pager__link {
  display: inline-flex;
  min-width: 40px;
  height: 40px;
  justify-content: center;
  align-items: center;
  border: 1px solid #479A54;
  border-radius: 6px;
  color: #479A54;
  background: #fff;
  font-weight: 700;
}

/* 浮動解除（alignleft/right使用時） */
.post-content::after {
  content: "";
  display: table;
  clear: both;
}

/* ========== 詳細: 前後記事ナビ/一覧へ戻る ========== */

.u-separate { margin: 32px 0; }

.post-nav {
  margin-top: 8px;
  margin-bottom: 16px;
}
.post-nav a {
  display: block;
  padding: 12px 14px;
  border: 1px solid #E4E4E4;
  border-radius: 8px;
  background: #fff;
}
.post-nav a + a { margin-top: 8px; }

.post-nav__label {
  display: block;
  font-size: 12px;
  color: #777;
  margin-bottom: 2px;
}
.post-nav__title {
  font-weight: 700;
  color: #4C4B4A;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.post-back {
  text-align: center;
  margin-top: 16px;
}
.post-back__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: #479A54;
  border-radius: 999px;
  color: #fff;
  font-weight: 800;
}
.post-back__link:hover { opacity: .9; }

/* SP */
@media screen and (max-width: 767px) {
  .post-article {
    padding: 16px;
  }
  .post-nav a {
    padding: 10px 12px;
  }
}

/* ========== 補助（アクセシビリティ／微調整） ========== */

.post-article a {
  color: #19b5e9;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.post-article a:hover { opacity: .9; }

.post-content strong { font-weight: 800; }
.post-content em { font-style: italic; }

.post-content .is-style-rounded img {
  border-radius: 12px;
}

/* Gutenberg のスペーサー緩衝 */
.wp-block-spacer { display: block; }

/* 余白ユーティリティ（必要なら） */
.mt-24 { margin-top: 24px !important; }
.mb-24 { margin-bottom: 24px !important; }
