@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}

/* ============================================================
   裏DAHLIA 基本デザイン（黒 × ピンク × ゴールド）
   スマホ最優先
   ============================================================ */
:root{
  --dahlia-bg:      #0c0708;
  --dahlia-panel:   #1a1013;
  --dahlia-line:    #2e1f24;
  --dahlia-pink:    #e5388a;
  --dahlia-pink-dp: #b81f68;
  --dahlia-gold:    #c9a24b;
  --dahlia-ivory:   #f4ecee;
  --dahlia-muted:   #b79aa4;
}

/* 全体の背景と文字 */
body{
  background: var(--dahlia-bg) !important;
  color: var(--dahlia-ivory);
}
#wrapper, #main, .main, #content, .content{
  background: transparent !important;
}

/* リンクはピンク */
a{ color: var(--dahlia-pink); }
a:hover{ color: var(--dahlia-pink-dp); }

/* 見出しにゴールドの下線を効かせる */
.article h1, .article h2, .entry-content h2{
  color: var(--dahlia-ivory);
  border-bottom: 1px solid var(--dahlia-gold);
  padding-bottom: .4em;
}
.article h3, .entry-content h3{ color: var(--dahlia-pink); }

/* 記事本文 */
.entry-content{
  color: var(--dahlia-ivory);
  line-height: 2;
  font-size: 16px;
}

/* ヘッダー・フッターを黒に馴染ませる */
#header, .header-container, #footer, .footer{
  background: var(--dahlia-bg) !important;
}
.logo a, #site-title a{ color: var(--dahlia-pink) !important; }

/* カードやボックスの背景 */
.entry-card, .a-wrap, .widget, .sidebar{
  background: var(--dahlia-panel) !important;
  border-color: var(--dahlia-line) !important;
  color: var(--dahlia-ivory);
}

/* スマホでの読みやすさ（余白と文字サイズ） */
@media screen and (max-width: 600px){
  .entry-content{ font-size: 16px; padding: 0 4px; }
  .article h1{ font-size: 22px; }
}

/* ============================================================
   裏DAHLIA 追加調整（読めない箇所・サイドバー・スマホ）
   ============================================================ */

/* サイドバーの見出しが白背景で白文字になる問題を修正 */
.sidebar h3, .widget-title, .sidebar .widget h3{
  background: var(--dahlia-panel) !important;
  color: var(--dahlia-gold) !important;
  border-left: 3px solid var(--dahlia-pink) !important;
  border-bottom: 1px solid var(--dahlia-line) !important;
  padding: 10px 14px !important;
}

/* サイドバー内の文字・リンク */
.sidebar, .sidebar li, .sidebar a{ color: var(--dahlia-ivory) !important; }
.sidebar a:hover{ color: var(--dahlia-pink) !important; }

/* 検索ボックス */
.search-box input[type="text"], .wp-block-search__input{
  background: var(--dahlia-panel) !important;
  border: 1px solid var(--dahlia-line) !important;
  color: var(--dahlia-ivory) !important;
}
.search-box .search-submit, .wp-block-search__button{
  background: var(--dahlia-pink) !important;
  color: #fff !important;
  border: none !important;
}

/* 記事カードの「NO IMAGE」まわりを黒に馴染ませる */
.entry-card-thumb, .no-image, .card-thumb{
  background: var(--dahlia-panel) !important;
}
.entry-card-title, .card-title{ color: var(--dahlia-ivory) !important; }
.entry-card-snippet, .card-snippet{ color: var(--dahlia-muted) !important; }
.entry-card-meta, .card-meta, .post-date{ color: var(--dahlia-muted) !important; }

/* ヘッダーのロゴを中央で映えさせる */
#site-title a, .logo a{
  color: var(--dahlia-pink) !important;
  letter-spacing: .1em;
}

/* スマホ最優先：サイドバーを本文の下に回して読みやすく */
@media screen and (max-width: 834px){
  #main, .main{ width: 100% !important; }
  #sidebar, .sidebar{ width: 100% !important; margin-top: 24px; }
  .entry-content{ font-size: 16px !important; }
  .article h1{ font-size: 20px !important; }
}

/* ============================================================
   裏DAHLIA サイドバー非表示・1カラム化
   ============================================================ */

/* サイドバーを消す */
#sidebar, .sidebar{ display: none !important; }

/* 本文エリアを全幅に広げる */
#main, .main, #content, .content-in, #wrap, #wrapper{
  width: 100% !important;
  max-width: 100% !important;
}
.main-in, .content-in{
  display: block !important;
}

/* 記事一覧・本文を中央に、読みやすい幅で */
.article, .entry-content, .main-in{
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}

/* ============================================================
   裏DAHLIA 入口ページ 専用デザイン
   ============================================================ */
.dahlia-top{ color: var(--dahlia-ivory); }
.dahlia-top .center{ text-align: center; }
.dahlia-top .pink{ color: var(--dahlia-pink); }

/* 金の細い線 */
.dahlia-rule{
  width: 54px; height: 1px; border: none;
  background: linear-gradient(90deg, transparent, var(--dahlia-gold), transparent);
  margin: 2.4rem auto;
}

/* ヒーロー */
.dahlia-hero{ text-align: center; padding: 2rem 0 1rem; }
.dahlia-hero-brand{
  font-size: 2rem; letter-spacing: .4em; color: var(--dahlia-pink);
  margin-left: .4em;
}
.dahlia-hero-sub{
  letter-spacing: .5em; font-size: .8rem; color: var(--dahlia-gold);
  margin-top: .5rem; margin-left: .5em;
}
.dahlia-hero-lead{ color: var(--dahlia-muted); margin-top: 1.6rem; line-height: 2; }

/* 各セクション見出し（白背景問題も上書き） */
.dahlia-sec{ padding: 2.4rem 0; }
.dahlia-sec h2{
  background: transparent !important;
  color: var(--dahlia-ivory) !important;
  border: none !important;
  border-bottom: 1px solid var(--dahlia-gold) !important;
  font-size: 1.4rem; text-align: center;
  padding-bottom: .6em !important; margin-bottom: 1.4rem;
}
.dahlia-sec p{ line-height: 2; color: #e3d5da; }

/* 不安の吹き出し */
.dahlia-worries{ display: flex; flex-direction: column; gap: .7rem; margin: 1.6rem 0; }
.dahlia-worries .w{
  align-self: flex-start; max-width: 88%;
  background: var(--dahlia-panel); border: 1px solid var(--dahlia-line);
  border-radius: 14px 14px 14px 3px; padding: .7rem 1.1rem;
  color: var(--dahlia-pink); font-size: .95rem;
}
.dahlia-worries .w:nth-child(even){
  align-self: flex-end; border-radius: 14px 14px 3px 14px;
}

/* 大切にしていること */
.dahlia-care{
  background: linear-gradient(160deg, #140d10, var(--dahlia-panel));
  border: 1px solid var(--dahlia-line); border-top: 1px solid var(--dahlia-gold);
  border-radius: 4px; padding: 1.8rem 1.5rem;
}
.dahlia-care .lead{ color: var(--dahlia-gold); font-size: 1.05rem; line-height: 1.9; }

/* CTA（LINE導線） */
.dahlia-cta{ text-align: center; padding: 3rem 1rem 2rem; }
.dahlia-cta h3{ font-size: 1.2rem; color: var(--dahlia-ivory); }
.dahlia-cta .small{ color: var(--dahlia-muted); font-size: .85rem; margin-top: 1rem; }
.dahlia-line-btn{
  display: inline-block; margin-top: 1.4rem;
  background: var(--dahlia-pink) !important; color: #fff !important;
  text-decoration: none; letter-spacing: .1em;
  padding: .95rem 2.4rem; border-radius: 3px;
  box-shadow: 0 6px 24px rgba(229,56,138,.28);
}
.dahlia-line-btn:hover{ background: var(--dahlia-pink-dp) !important; }

/* 入口ページの日付など不要な情報を隠す */
.page .date-tags, .page .post-meta, .page .entry-meta{
  display: none !important;
}

/* ============================================================
   記事ページ：執筆者名・関連記事など不要な表示を隠す
   ============================================================ */

/* 執筆者名（ログイン名が表に出ないように） */
.author-info, .a-author, .post-author, .footer-author, .writer{
  display: none !important;
}

/* 関連記事エリア */
.related-entries, .related-entry-heading, #related-entries{
  display: none !important;
}

/* 記事下のナビ（前後の記事）が必要なければ隠す場合はこの下を有効に */
/* .navi-position, .comment-navigation{ display: none !important; } */

/* トップの「もっと知る」ブロック */
.dahlia-more{ text-align: center; padding: 2.4rem 0; }
.dahlia-more h2{
  background: transparent !important;
  color: var(--dahlia-ivory) !important;
  border: none !important;
  border-bottom: 1px solid var(--dahlia-gold) !important;
  font-size: 1.3rem; padding-bottom: .6em !important; margin-bottom: 1rem;
}
.dahlia-more-links{
  display: flex; flex-direction: column; gap: .8rem;
  max-width: 360px; margin: 1.6rem auto 0;
}
.dahlia-more-links a{
  display: block; text-decoration: none;
  background: var(--dahlia-panel); border: 1px solid var(--dahlia-line);
  border-left: 3px solid var(--dahlia-pink);
  color: var(--dahlia-ivory) !important;
  padding: 1rem; border-radius: 4px; letter-spacing: .05em;
  transition: background .3s;
}
.dahlia-more-links a:hover{ background: #241017; }