@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Template: cocoon-master
Version: 1.1.3
*/

/************************************
** 手動ボックス（この記事を読むとわかること／まとめ）
************************************/
.manual-box {
  position: relative;
  border: 3px solid #33b5e5;
  border-radius: 0;
  padding: 1.5em 1.2em;
  margin: 2em 0;
  background: #ffffff;
}
.manual-box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 140px;
  height: 3px;
  background: #ffffff;
}
.manual-title {
  position: absolute;
  top: -0.7em;
  left: 1em;
  background: #ffffff;
  color: rgba(0,155,255,0.9);
  font-weight: 700;
  font-size: 1.05em;
  padding: 0 0.5em;
}

/************************************
** 八雲の考察ポイント／八雲の感想（手動管理版）
************************************/
.yakumo-box {
  position: relative;
  border: 3px solid #33b5e5;
  border-radius: 0;
  padding: 2em 1.2em 1.2em;
  margin: 2.5em 0;
  background: #ffffff;
}

/* タイトル部分（雲アイコン＋文字） */
.yakumo-title {
  position: absolute;
  top: -1.2em;
  left: 1.2em;
  display: flex;
  align-items: center;
  gap: 0.3em;
  background: #ffffff;
  padding: 0 0.6em;
}

/* 雲アイコン画像 */
.yakumo-title img {
  height: 40px;
  width: auto;
  opacity: 0.95;
}

/* タイトル文字 */
.yakumo-title span {
  color: rgba(0,155,255,0.9);
  font-weight: 700;
  font-size: 1.05em;
  line-height: 1.1;
}

.yakumo-title span::before{content:none !important; margin:0 !important; display:none !important;}

/* ==== 導入文（記事冒頭3段落）を太字 ==== */
.entry-content > p:nth-of-type(-n+3) {
  font-weight: 700;
}

/* ==== 導入文（最初の画像が出る前までの段落を太字） ==== */
.entry-content > p {
  font-weight: 700;
}

/* 画像や図の下以降は太字を解除 */
.entry-content img,
.entry-content figure,
.entry-content .wp-block-image {
  font-weight: normal;
}

/* === もくじ画像（全記事共通デザイン） === */
.toc-image {
  width: 240px;
  height: auto;
  display: block;
  margin: 1.5em auto; /* 上下に余白＋中央寄せ */
  opacity: 0.98; /* 少し柔らかく */
}
/* 強制反映版（!important 付き） */
.wakaru-box {
  position: relative !important;
  border: 2px solid #3ab795 !important;
  background: #ffffff !important;
  border-radius: 8px !important;
  padding: 2em 1.2em 1em !important;
  margin: 2em 0 !important;
}
.wakaru-title {
  position: absolute !important;
  top: -1px !important;
  left: -1px !important;
  background: #3ab795 !important;
  color: #ffffff !important;
  font-weight: bold !important;
  font-size: 17px !important;
  padding: 0 12px !important;
  height: 28px !important;
  line-height: 28px !important;
  border-radius: 6px 6px 0 0 !important;
}
.wakaru-box ul {
  margin-top: 2.4em !important;
  margin-bottom: 0 !important;
}

.matome-box {
  position: relative !important;
  border: 2px solid #00a0e9 !important;
  background: #ffffff !important;
  border-radius: 8px !important;
  padding: 2em 1.2em 1em !important;
  margin: 2em 0 !important;
}
.matome-title {
  position: absolute !important;
  top: -1px !important;
  left: -1px !important;
  background: #00a0e9 !important;
  color: #ffffff !important;
  font-weight: bold !important;
  font-size: 17px !important;
  padding: 0 12px !important;
  height: 28px !important;
  line-height: 28px !important;
  border-radius: 6px 6px 0 0 !important;
}
.matome-box ul {
  margin-top: 2.4em !important;
  margin-bottom: 0 !important;
}

// 子テーマのstyle.cssを確実に読み込む
function my_enqueue_child_style() {
    wp_enqueue_style(
        'cocoon-child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array(),
        filemtime(get_stylesheet_directory() . '/style.css')
    );
}
add_action('wp_enqueue_scripts', 'my_enqueue_child_style');

/* この記事を読むとわかること */
.wakaru-box {
  position: relative !important;
  border: 3px solid #33b5e5 !important;
  border-radius: 8px !important;
  padding: 1.5em 1.2em !important;
  margin: 2em 0 !important;
  background: #ffffff !important;
}

.wakaru-title {
  position: absolute !important;
  top: -0.8em !important;
  left: 1em !important;
  background: #33b5e5 !important;
  color: #ffffff !important;
  font-weight: bold !important;
  font-size: 1em !important;
  padding: 0 0.7em !important;
  border-radius: 4px !important;
}

/* この記事のまとめ */
.matome-box {
  position: relative !important;
  border: 3px solid #0099e5 !important;
  border-radius: 8px !important;
  padding: 1.5em 1.2em !important;
  margin: 2em 0 !important;
  background: #ffffff !important;
}

.matome-title {
  position: absolute !important;
  top: -0.8em !important;
  left: 1em !important;
  background: #0099e5 !important;
  color: #ffffff !important;
  font-weight: bold !important;
  font-size: 1em !important;
  padding: 0 0.7em !important;
  border-radius: 4px !important;
}

/* strongタグの背景ラインを削除し、考察ポイント・感想と同じ青系文字に統一 */
.wakaru-box strong,
.matome-box strong {
  background: none !important; /* 背景のラインを削除 */
  color: #33b5e5 !important;   /* 考察ポイント・感想と同じ青系カラー */
  font-weight: 600;            /* やや太字で強調 */
}

/* === 「この記事を読むとわかること」＆「まとめ」強調文字 修正版 === */
body.single .entry-content .wakaru-box strong,
body.single .entry-content .matome-box strong {
  background: none !important;     /* 背景ライン削除 */
  color: #33b5e5 !important;       /* 考察ポイント・感想と同じ青 */
  font-weight: 600 !important;     /* 強調 */
  text-decoration: none !important; /* もし下線等が入っている場合も削除 */
}

/* === 強制修正版：青文字＆白背景、強調文字も青に統一 === */
.wakaru-box,
.matome-box {
  border: 3px solid #33b5e5 !important;
  background: #ffffff !important;
  color: #000000 !important;
  border-radius: 8px !important;
  padding: 1.8em 1em 1em !important;
}

.wakaru-box span,
.matome-box span {
  background: #33b5e5 !important;
  color: #ffffff !important;
  font-weight: bold !important;
  padding: 3px 10px !important;
  border-radius: 4px !important;
}

.wakaru-box strong,
.matome-box strong {
  background: none !important;
  color: #33b5e5 !important;
  font-weight: 600 !important;
}
