/* ==========================================================================
   投稿ページ (Single Post)
   ========================================================================== */

/* --------------------------------------------------------------
   メインコンテナと記事全体のレイアウト
-------------------------------------------------------------- */
.single-post .site-main {
    max-width: 73.25rem; /* 1172px - .container-standardと同じ */
    margin-inline: auto;
    padding: var(--spacing-lg) var(--spacing-sm);
}

.single-post article.post {
    margin-bottom: var(--spacing-lg);
}


/* --------------------------------------------------------------
   記事ヘッダー
-------------------------------------------------------------- */
.single-post .entry-header {
    flex-direction: column;
}

.single-post .entry-header .jp {
    font-size: clamp(var(--fz20), 4vw, var(--fz40));
    line-height: unset;
}

/* --------------------------------------------------------------
    記事コンテンツ（日付、タイトル、本文、カテゴリー）
-------------------------------------------------------------- */
.single-post .entry-content .container-standard {
    max-width: 100%;
    padding: 0;
}

/* 投稿日 */
.single-post .entry-content p:first-of-type {
    color: #777;
    font-size: var(--fz15);
    margin-bottom: 0.5em;
}

/* 投稿タイトル */
.single-post h1.entry-title {
    font-size: var(--fz40);
    font-weight: bold;
    line-height: 1.4;
    padding-bottom: 0.5em;
    margin-bottom: 1em;
    border-bottom: 2px solid #a46eb1;
}

/* 投稿本文の段落 */
.single-post .entry-content p {
    margin-bottom: 1.5em;
    font-size: var(--fz18);
}
.single-post .entry-categories {
    display: flex;
    flex-wrap: wrap;
    align-items: center; 
    gap: 0.5rem 0.8rem;
    margin-top: 3rem; 
    padding-top: 1.5rem;
    border-top: 1px solid #e0e0e0;
}

.single-post .categories-label {
    font-size: var(--fz15);
    font-weight: bold;
    color: var(--color-text-secondary);
    margin-right: 0.5rem;
}

.single-post .entry-categories a {
    display: inline-block;
    padding: 0.3em 1em;
    border: 1px solid #a46eb1;
    border-radius: 999px;
    background-color: #ffffff;
    color: #a46eb1;
    font-size: var(--fz14);
    font-weight: bold;
    text-decoration: none;
    line-height: 1.5;
    transition: background-color 0.3s, color 0.3s;
}

.single-post .entry-categories a:hover {
    background-color: #a46eb1;
    color: #ffffff;
}


/* --------------------------------------------------------------
   投稿ナビゲーション（前後の記事へのリンク）
-------------------------------------------------------------- */
.post-navigation {
    margin-block: var(--spacing-lg);
    padding-block: var(--spacing-md);
    border-top: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
}

.post-navigation .nav-links {
    display: flex;
    justify-content: space-between;
    gap: var(--spacing-md);
}

.post-navigation .nav-previous,
.post-navigation .nav-next {
    flex: 1 1 0;
    min-width: 0;
}

@supports not selector(:has(*)) {
    .post-navigation .nav-previous:only-child {
        margin-right: auto;
    }
    .post-navigation .nav-next:only-child {
        margin-left: auto;
    }
}

.post-navigation a {
    position: relative;
    display: block;
    height: 100%;
    padding: 1.5rem 2rem;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    text-decoration: none;
    transition: background-color 0.3s, border-color 0.3s, transform 0.3s;
}

.post-navigation a:hover {
    background-color: #fafafa;
    border-color: #a46eb1;
    transform: translateY(-4px);
}

/* 矢印アイコン */
.post-navigation .nav-previous a { padding-left: 3.5rem; }
.post-navigation .nav-next a { padding-right: 3.5rem; text-align: right; }

.post-navigation a::before {
    content: '';
    position: absolute;
    top: 50%;
    width: 0.75rem;
    height: 0.75rem;
    border-top: 2px solid #a46eb1;
    border-left: 2px solid #a46eb1;
    transform: translateY(-50%) rotate(-45deg);
}
.post-navigation .nav-previous a::before { left: 1.5rem; }
.post-navigation .nav-next a::before {
    right: 1.5rem;
    transform: translateY(-50%) rotate(135deg);
}

.post-navigation .nav-subtitle {
    display: block;
    font-size: var(--fz14);
    color: #777;
    margin-bottom: 0.5em;
}

.post-navigation .nav-title {
    color: var(--color-text-secondary);
    font-weight: bold;
    font-size: var(--fz16);
    line-height: 1.5;
}

/* --------------------------------------------------------------
   9-5. 一覧へ戻るリンク
-------------------------------------------------------------- */
.single-post .site-main > p:last-of-type > a,
.single-post .site-main > a:last-of-type {
    /* 既存の.btn-moreスタイルを参考に作成 */
    position: relative;
    display: block;
    max-width: 22rem; /* 352px */
    margin-inline: auto;
    margin-top: var(--spacing-lg);
    overflow: hidden;
    border-radius: 1.5rem; /* 24px */
    box-shadow: 0 8px 16px rgba(0, 0, 0, .1);
    background: linear-gradient(90deg, #a46eb1 0%, #cb7fde 100%);
    color: #ffffff;
    font-size: var(--fz19);
    line-height: 2.4;
    text-align: center;
    text-decoration: none;
    transition: transform .3s ease;
}

.single-post .site-main > p:last-of-type > a:hover,
.single-post .site-main > a:last-of-type:hover {
    transform: translateY(-2px);
}


/* --------------------------------------------------------------
   9-6. レスポンシブ対応 (768px以下)
-------------------------------------------------------------- */
@media (max-width: 768px) {
    .single-post .site-main {
        padding-top: var(--spacing-md);
    }
    
    .single-post h1.entry-title {
        font-size: var(--fz28);
    }
    
    .single-post .entry-content p {
        font-size: var(--fz16);
    }

    .post-navigation .nav-links {
        flex-direction: column;
        gap: var(--spacing-sm);
    }
    
    .post-navigation a {
        padding: 1rem 1.5rem;
    }
    .post-navigation .nav-previous a { padding-left: 3rem; }
    .post-navigation .nav-next a { padding-right: 3rem; }
    .post-navigation a::before {
        width: 0.6rem;
        height: 0.6rem;
    }
    .post-navigation .nav-previous a::before { left: 1rem; }
    .post-navigation .nav-next a::before { right: 1rem; }


    .single-post .site-main > p:last-of-type > a,
    .single-post .site-main > a:last-of-type {
        font-size: var(--fz16);
        max-width: 17rem;
    }
}

/* 見出し */
.post-content h1,
.post-content h2,
.post-content h3,
.post-content h4,
.post-content h5,
.post-content h6 {
  margin: 1.2em 0 0.5em;
  line-height: 1.25;
  font-weight: 700;
  color: #111;
}
.post-content h1 { font-size: 2.0rem; }
.post-content h2 { font-size: 1.6rem; }
.post-content h3 { font-size: 1.35rem; }
.post-content h4 { font-size: 1.15rem; }
.post-content h5 { font-size: 1.05rem; }
.post-content h6 { font-size: 0.95rem; }

/* 段落・テキスト */
.post-content p { margin: 0 0 1em; word-break: break-word; }
.post-content small { font-size: 0.9em; }
.post-content em { font-style: italic; }
.post-content strong { font-weight: 700; }

/* リンク */
.post-content a { color: #0073aa; text-decoration: underline; }
.post-content a:hover { color: #005770; }

/* 引用（blockquote） */
.post-content blockquote {
  margin: 0 0 1em;
  padding: 0.9em 1.1em;
  border-left: 4px solid rgba(0,0,0,0.08);
  background: rgba(0,0,0,0.02);
}
.post-content blockquote p { margin: 0 0 0.6em; }
.post-content blockquote cite { display:block; text-align:right; color:#666; font-size:0.95em; }

/* テーブル */
.post-content table { width:100%; border-collapse:collapse; margin:0 0 1.25em; font-size:0.95rem; }
.post-content .wp-block-table thead { border-bottom: unset; }
.post-content thead th { background:#f7f7f7; font-weight:700; padding:0.6em 0.75em; border-bottom:2px solid #e6e6e6; text-align:left; }
.post-content td, .post-content th { padding:0.6em 0.75em; border:1px solid #e9e9e9; vertical-align:top; }
.post-content tbody tr:nth-child(odd) td { background: rgba(0,0,0,0.01); }

/* 定義リスト */
.post-content dl { margin:0 0 1em; }
.post-content dt { font-weight:700; margin-top:0.6em; }
.post-content dd { margin:0 0 0.8em 1.2em; }

/* リスト（テーマによる list-style:none を上書き） */
.post-content ul, .post-content ol {
  margin: 0 0 1em 1.6rem;
  padding: 0;
}
.post-content li { display: list-item; margin: 0.35em 0; list-style-position: outside; }

/* ネストしたリストのマーカー */
.post-content ul { list-style-type: disc; }
.post-content ul ul { list-style-type: circle; margin-left: 1.2rem; }
.post-content ul ul ul { list-style-type: square; margin-left: 1.2rem; }
.post-content ol { list-style-type: decimal; }
.post-content ol ol { list-style-type: lower-alpha; margin-left: 1.2rem; }

/* ::marker（近代ブラウザ） */
.post-content ul li::marker { font-size: 1em; color: inherit; }

/* code, kbd, pre */
.post-content code,
.post-content kbd,
.post-content samp,
.post-content pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, "Roboto Mono", "Noto Sans Mono", monospace;
  font-size: 0.95em;
}
.post-content code { background: rgba(0,0,0,0.04); padding:0.08em 0.35em; border-radius:4px; white-space:pre-wrap; }
.post-content kbd { border:1px solid rgba(0,0,0,0.12); padding:0.08em 0.3em; border-radius:4px; background:#fafafa; }
.post-content pre { background:#f6f6f6; padding:0.9em; border-radius:6px; overflow:auto; margin:0 0 1em; line-height:1.45; }

/* address */
.post-content address { display:block; font-style:normal; margin:0 0 1em; color:#444; }

/* 画像 */
.post-content img { max-width:100%; height:auto; display:block; }

/* 小部品 */
.post-content .entry-categories { margin:1em 0 0; font-size:0.95rem; color:#666; }
.post-content .entry-categories a { color:#0073aa; text-decoration:none; }

/* hr */
.post-content hr { border:0; border-top:1px solid #e6e6e6; margin:1.2em 0; }

/* Gutenberg ブロック補正（ページでも投稿でも同じように見せる） */
.post-content .wp-block-quote { margin: 0 0 1em; padding-left: 1em; border-left: 4px solid rgba(0,0,0,0.08); }
.post-content .wp-block-image figcaption { font-size:0.9rem; color:#666; margin-top:0.5em; }

/* カラー / フォントサイズスラッグ（必要ならスラッグを追加） */
.post-content .has-primary-color { color: #0073aa; }
.post-content .has-accent-color  { color: #ff6b6b; }
.post-content .has-muted-color   { color: #6b6b6b; }

.post-content .has-primary-background-color { background-color: #0073aa; color:#fff; padding:0.2em 0.35em; border-radius:3px; }
.post-content .has-accent-background-color  { background-color: #ff6b6b; color:#fff; padding:0.2em 0.35em; border-radius:3px; }

.post-content .has-small-font-size  { font-size: 13px; }
.post-content .has-normal-font-size { font-size: 16px; }
.post-content .has-large-font-size  { font-size: 20px; }
.post-content .has-huge-font-size   { font-size: 28px; }

/* モバイル */
@media (max-width: 600px) {
  .post-content { padding: 0 1rem; font-size: 15px; }
  .post-content h1 { font-size: 1.6rem; }
  .post-content h2 { font-size: 1.35rem; }
}