/*
Theme Name: Tea World – Crescent Star
Template: Tea-World
Version: 1.0
*/

/* monologページの日付調整 */

body.crescent-world .monologue-footer{
  margin-top: 22px;
  padding-top: 14px;
  border-top: 1px solid rgba(15,26,43,.10);
  color: #888;
  font-size: .95em;
  opacity: .85;
}

/* monolog-archiveページ */
.monologue-excerpt {
  background: #fff;
  border-radius: 14px;
  padding: 14px 16px;
  margin-bottom: 12px;
}

.monologue-excerpt__title {
  margin: 0 0 4px;
  font-size: 1.05rem;
}

.monologue-excerpt__meta {
  font-size: 0.9rem;
  opacity: 0.7;
}


/* monologue アーカイブだけ：カードをやめてリスト化 */
.post-type-archive-monologue article.monologue-excerpt{
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 10px 0 !important;
  margin: 0 !important;
  border-bottom: 1px solid rgba(0,0,0,.08) !important;
}

.post-type-archive-monologue article.monologue-excerpt:first-child{
  padding-top: 0 !important;
}

.post-type-archive-monologue article.monologue-excerpt:last-child{
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.post-type-archive-monologue .monologue-excerpt__title{
  margin: 0 0 4px !important;
}

.post-type-archive-monologue .monologue-excerpt__meta{
  font-size: .9rem !important;
  opacity: .7 !important;
}


/* monologue アーカイブ：リストの色調整 */
/* monologue アーカイブ：読みやすさ＆余白の最終調整 */
.post-type-archive-monologue article.monologue-excerpt{
  padding: 12px 16px !important;  /* ← 左右の余白を増やす（切れて見える問題の解消） */
  border-bottom: 1px solid rgba(255,255,255,.14) !important;
}

.post-type-archive-monologue article.monologue-excerpt a{
  color: rgba(255,255,255,.95) !important;
  text-decoration: none;
}

.post-type-archive-monologue article.monologue-excerpt a:hover{
  color: #fff !important;
  text-decoration: underline;
}

.post-type-archive-monologue .monologue-excerpt__meta{
  color: rgba(255,255,255,.72) !important; /* ← 日付が溶けるのを防ぐ */
  font-size: .9rem;
  margin-top: 2px;
}

/* 念のため：タイトルの行間も少しだけ整える */
.post-type-archive-monologue .monologue-excerpt__title{
  line-height: 1.4;
  margin: 0 0 2px !important;
}

/* monologue アーカイブ：リスト全体に“安全な内側余白”を作る */
.post-type-archive-monologue .site-main{
  padding-left: 16px;
  padding-right: 16px;
}

/* 各リスト行（article） */
.post-type-archive-monologue article.monologue-excerpt{
  padding: 14px 12px !important;   /* ← 左右に余白を確保 */
  margin-left: 0;
  margin-right: 0;
}

/* タイトル（白でくっきり） */
.post-type-archive-monologue article.monologue-excerpt a{
  color: #ffffff !important;
  text-decoration: none;
}

.post-type-archive-monologue article.monologue-excerpt a:hover{
  text-decoration: underline;
}

/* 日付：白＋十分なコントラスト */
.post-type-archive-monologue .monologue-excerpt__meta{
  color: rgba(255,255,255,.85) !important;  /* ← ここが重要 */
  font-size: 0.85rem;
  margin-top: 4px;
}

/* 行間を少しだけ広げて“詰まり感”を消す */
.post-type-archive-monologue .monologue-excerpt__title{
  line-height: 1.45;
}



/* 全体の色設計 */
/* =========================
   Crescent Star palette (scoped)
   ========================= */
body.crescent-world{
  --cs-midnight:   #0F1A2B;
  --cs-midnight-2: #16243D;
  --cs-navy:       #1C2E4A;
  --cs-denim:      #223A5E;

  --cs-bg:         #F5F7FA;
  --cs-star:       #C9B873;

  --cs-text:       var(--cs-midnight);
  --cs-heading:    var(--cs-midnight-2);
  --cs-link:       var(--cs-navy);
  --cs-link-h:     var(--cs-denim);
}

/* Base */
body.crescent-world{
  background: var(--cs-bg);
  color: var(--cs-text);
}

/* Headings */
body.crescent-world h1,
body.crescent-world h2,
body.crescent-world h3,
body.crescent-world h4{
  color: var(--cs-heading);
}

/* Links */
body.crescent-world a{
  color: var(--cs-link);
  text-decoration-thickness: .08em;
  text-underline-offset: .18em;
}
body.crescent-world a:hover{
  color: var(--cs-link-h);
}

/* CTA button utility */
body.crescent-world .cs-cta,
body.crescent-world a.cs-cta{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45em;
  padding: .85em 1.15em;
  border-radius: 999px;
  background: var(--cs-navy);
  color: #fff;
  text-decoration: none;
  border: 1px solid rgba(255,255,255,.14);
}
body.crescent-world .cs-cta:hover,
body.crescent-world a.cs-cta:hover{
  background: var(--cs-denim);
  color: #fff;
}

/* Star accent utility */
body.crescent-world .cs-star{ color: var(--cs-star); }

/* =========================
   Header (Crescent Star)
   ========================= */
body.crescent-world header.site-header{
  background: var(--cs-midnight-2);
  color: #ffffff;
}

/* ヘッダー内リンク */
body.crescent-world header.site-header a{
  color: #ffffff;
  text-decoration: none;
}

body.crescent-world header.site-header a:hover{
  color: var(--cs-star);
}

/* サイトタイトルがリンクの場合 */
body.crescent-world header.site-header .site-title a{
  color: #ffffff;
}

body.crescent-world header.site-header .site-title a:hover{
  color: var(--cs-star);
}

/* =================================================
   Skip link: focus時だけ見せる（ヘッダー上に常時表示しない）
   ================================================= */
body.crescent-world a.skip-link,
body.crescent-world .skip-link{
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  white-space: nowrap;
}

body.crescent-world a.skip-link:focus,
body.crescent-world .skip-link:focus{
  left: 12px;
  top: 12px;
  width: auto;
  height: auto;
  overflow: visible;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--cs-midnight);
  color: #fff;
  z-index: 99999;
  text-decoration: none;
}

body.crescent-world .skip-link:focus{
  top: 72px; /* ヘッダー高さに応じて */
}


/* ヘッダーと本文の間を“夜”でつなぐ */
body.crescent-world .ow-layout{
  background: var(--cs-midnight);
  padding-top: 14px;   /* ここが“間”の量 */
  margin-top: 0;
}

/* 本文とサイドバーの中身は白いカードにする（本文側が白背景なら不要） */
body.crescent-world #primary,
body.crescent-world #sidebar{
  background: transparent;
}

/* =========================
   FIX: 白い帯を消して、カード構造に戻す
   ========================= */

/* ow-layout直下の余計な白背景を消す */
body.crescent-world .ow-layout{
  background: var(--cs-midnight);
}

/* 本文とサイドバーは「カード」として白に */
body.crescent-world #primary,
body.crescent-world #sidebar{
  background: transparent;
}

/* 本文カード */
body.crescent-world #primary > *{
  background: #fff;
  border-radius: 16px;
  padding: 24px;
}

/* サイドバーカード（すでに相談・Externalはカード化済み） */
body.crescent-world #sidebar .cs-sidebar{
  background: transparent;
}


/* =========================
   Footer license (Crescent Star)
   ========================= */
body.crescent-world .footer-license{
  background: var(--cs-midnight);
  color: rgba(255,255,255,.75);
  padding: 1.6em 1em 2em;
  margin-top: 3em;
}

/* テキスト */
body.crescent-world .footer-license p{
  margin: 0;
  font-size: .9em;
  text-align: center;
  letter-spacing: .02em;
}

/* リンクがある場合 */
body.crescent-world .footer-license a{
  color: #ffffff;
  text-decoration: none;
}
body.crescent-world .footer-license a:hover{
  color: var(--cs-star);
}

/* =========================
   Layout: main + sidebar
   ========================= */
body.crescent-world .ow-layout{
  display: flex;
  gap: 28px;
  align-items: flex-start;
}

/* main content */
body.crescent-world .ow-layout #primary{
  flex: 1 1 auto;
  min-width: 0;
}

/* sidebar */
body.crescent-world .ow-layout #sidebar{
  flex: 0 0 320px;
  min-width: 300px;
}

/* =========================
   Responsive: mobile
   ========================= */
@media (max-width: 900px){
  body.crescent-world .ow-layout{
    flex-direction: column;
  }

  body.crescent-world .ow-layout #sidebar{
    flex: 1 1 auto;
    min-width: 0;
  }
}

/* =========================
   Crescent Star Sidebar (final)
   ========================= */

body.crescent-world #sidebar .cs-sidebar{
  display: block;
}

body.crescent-world #sidebar .cs-card{
  background: #fff;
  border: 1px solid rgba(15,26,43,.10);
  border-radius: 16px;
  padding: 16px 18px;
  margin-bottom: 18px;
}

body.crescent-world #sidebar .cs-card:last-child{
  margin-bottom: 0;
}

body.crescent-world #sidebar .cs-card__title{
  margin: 0 0 .8em;
  font-size: 1.05em;
  color: var(--cs-heading);
}

body.crescent-world #sidebar .cs-links{
  margin: 0;
  padding-left: 1.2em;
}

body.crescent-world #sidebar .cs-links__item{
  margin: .35em 0;
}

body.crescent-world #sidebar .cs-links__a{
  color: var(--cs-heading);
  text-decoration: none;
}

body.crescent-world #sidebar .cs-links__a:hover{
  text-decoration: underline;
}

body.crescent-world #sidebar .cs-small{
  margin: 0;
  font-size: .95em;
  line-height: 1.7;
  opacity: .9;
}

/* =========================
   Crescent Star Sidebar TOC
   ========================= */

body.crescent-world #sidebar .cs-toc{
  margin-top: 18px;
}

body.crescent-world #sidebar .cs-toc__title{
  margin: 0 0 .6em;
  font-size: 1.05em;
  color: var(--cs-heading);
}

body.crescent-world #sidebar .cs-toc__note{
  margin: 0 0 .9em;
  font-size: .95em;
  line-height: 1.7;
  opacity: .9;
}

body.crescent-world #sidebar .cs-toc__list{
  margin: 0;
  padding-left: 0;
  list-style: none;
}

body.crescent-world #sidebar .cs-toc__item{
  margin: .35em 0;
}

body.crescent-world #sidebar .cs-toc__item--h3{
  padding-left: 1em;
  opacity: .95;
}

body.crescent-world #sidebar .cs-toc__link{
  color: var(--cs-heading);
  text-decoration: none;
}

body.crescent-world #sidebar .cs-toc__link:hover{
  text-decoration: underline;
}

/* =========================
   Crescent Star Sidebar TOC (stronger)
   ========================= */

body.crescent-world #sidebar .cs-card--toc{
  /* cs-card の白背景が乗るので読みやすくなる */
}

body.crescent-world #sidebar .cs-card--toc .cs-toc,
body.crescent-world #sidebar .cs-card--toc .cs-toc *{
  opacity: 1; /* “薄くなる”のを止める */
}

body.crescent-world #sidebar .cs-card--toc .cs-toc__title{
  color: var(--cs-heading);
  margin: 0 0 .6em;
  font-size: 1.05em;
}

body.crescent-world #sidebar .cs-card--toc .cs-toc__note{
  opacity: .95; /* ここだけ軽く薄めるならこの程度まで */
}

body.crescent-world #sidebar .cs-card--toc .cs-toc__link{
  color: var(--cs-heading);
  text-decoration: underline;
  text-underline-offset: .12em;
  text-decoration-thickness: .08em;
}


/* ===================================
   「オンライン相談」を固定ブロックにする
   =================================== */
body.crescent-world .sidebar-consult{
  background: var(--cs-midnight-2);
  color: #ffffff;
  text-align: center;
}
body.crescent-world .sidebar-consult a{
  color: #ffffff;
}
body.crescent-world .sidebar-consult a:hover{
  color: var(--cs-star);
}


/* =========================
   FIX: sidebar 内は縦積み（横並び禁止）
   ========================= */
body.crescent-world #sidebar{
  display: block !important;
}

body.crescent-world #sidebar > *{
  display: block !important;
  width: 100%;
}

/* 追従 */
@media (min-width: 901px){
  body.crescent-world #sidebar{
    position: sticky;
    top: 110px; /* ヘッダー高さに合わせて調整 */
    align-self: flex-start;
  }
}

/* =========================
   Sidebar cards (force)
   ========================= */
body.crescent-world #sidebar .sidebar-consult,
body.crescent-world #sidebar .sidebar-links{
  background: #fff !important;
  border: 1px solid rgba(15,26,43,.10) !important;
  border-radius: 16px !important;
  padding: 16px 18px !important;
}

/* 相談カードだけは夜にしたい場合（任意） */
body.crescent-world #sidebar .sidebar-consult{
  background: var(--cs-midnight-2) !important;
  color: #fff !important;
  text-align: center;
}

body.crescent-world #sidebar .sidebar-consult a{
  color: #fff !important;
}
body.crescent-world #sidebar .sidebar-consult a:hover{
  color: var(--cs-star) !important;
}

/* =========================
   FORCE 2-column for monologue
   ========================= */
body.crescent-world.single-monologue .ow-layout{
  display: flex !important;
  flex-direction: row !important;
  gap: 28px !important;
  align-items: flex-start !important;
}

body.crescent-world.single-monologue .ow-layout #primary{
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

body.crescent-world.single-monologue .ow-layout #sidebar{
  flex: 0 0 320px !important;
  min-width: 300px !important;
}

/* fallback: monologue 記事っぽい画面なら */
body.crescent-world.single .ow-layout{
  display: flex !important;
  flex-direction: row !important;
}


/* 親テーマ側の自動External（帯）を無効化：Crescent Starでは sidebar.php を正本にする */
body.crescent-world .ow-sidebar-sep,
body.crescent-world .ow-sidebar__nav--external{
  display: none !important;
}

/* =========================
   FORCE: Sidebar visible as white cards
   ========================= */
body.crescent-world #sidebar{
  flex: 0 0 320px !important;
  min-width: 300px !important;
}

body.crescent-world #sidebar .cs-sidebar{
  display: block !important;
}

body.crescent-world #sidebar .cs-card{
  background: #fff !important;
  color: #111 !important;
  border: 1px solid rgba(15,26,43,.12) !important;
  border-radius: 16px !important;
  padding: 16px 18px !important;
  margin-bottom: 18px !important;
}

body.crescent-world #sidebar .cs-card__title{
  color: #0F1A2B !important;
}

body.crescent-world #sidebar a{
  color: #0F1A2B !important;
}

body.crescent-world #sidebar a:hover{
  text-decoration: underline;
}

/* =========================
   Kill auto External band
   ========================= */
body.crescent-world hr.ow-sidebar-sep,
body.crescent-world nav.ow-sidebar__nav--external{
  display: none !important;
}

body.crescent-world .footer-license{
  background: var(--cs-midnight) !important;
}

/* =========================
   Monologue ARCHIVE layout
   ========================= */

body.post-type-archive-monologue .ow-layout{
  display: flex;
  gap: 28px;
  align-items: flex-start;
}

body.post-type-archive-monologue #primary{
  flex: 1 1 auto;
  min-width: 0;
}

body.post-type-archive-monologue #sidebar{
  flex: 0 0 320px;
  min-width: 300px;
}

body.post-type-archive-monologue .monologue-item{
  transition: transform .12s ease, box-shadow .12s ease;
}
body.post-type-archive-monologue .monologue-item:hover{
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(15,26,43,.08);
}

/* 右カラムのカード間隔を統一 */
body.crescent-world #sidebar .cs-card{
  margin-bottom: 16px;
}

/* =========================
   Crescent Star front page fix
   ========================= */

/* 1) front-cards: gapで重なり防止 */
.home .front-cards{
  display: grid;
  gap: 14px;
  margin-top: 12px;
}

/* PC: 2カラム */
@media (min-width: 768px){
  .home .front-cards{
    grid-template-columns: 1fr 1fr;
  }
}

/* 2) front-card: 中身が潰れないように */
.home .front-card{
  display: block;
  border: 1px solid rgba(255,255,255,.12); /* 背景が暗いならこのまま / 明るいなら下の行に変更 */
  /* border: 1px solid rgba(0,0,0,.12); */
  border-radius: 14px;
  padding: 14px 16px;
  background: rgba(255,255,255,.04);        /* 背景が明るいなら 0.02 程度へ */
  text-decoration: none;
}

/* 3) タイトルと説明の表示を強制（古いCSSで消されている可能性に対抗） */
.home .front-card__title{
  display: block !important;
  font-weight: 700;
  margin-bottom: .25em;
  line-height: 1.35;
}

.home .front-card__desc{
  display: block !important;
  opacity: .82;
  font-size: .95em;
  line-height: 1.6;
}

/* 4) ow-card間隔の安定化（重なり・食い込み防止） */
.home .ow-card{
  margin: 18px 0;
}

/* 5) ボタン下の小さな注記 */
.home .ow-small{
  margin-top: .8em;
  font-size: .92em;
  opacity: .8;
}

/* 6) もし過去のCTA帯が残っていたらトップだけ無効化（保険） */
.home .cs-cta{
  display: none !important;
}

/* トップページクレセントスターロゴマーク */
.site-title--with-mark{
  display: flex;
  align-items: center;
  gap: 0.6em;
  margin: 0;
}

.site-mark{
  height: 42px;     /* 少し控えめがworld向き */
  width: auto;
}

.site-name{
  font-size: 1.6rem;
  font-weight: 600;
  letter-spacing: 0.04em;
}