/* =========================================================================
 *  投瓶通信サブカテゴリー｜投瓶モード（v2.0）
 *  ----------------------------------------------------------
 *  カテゴリーID 29（投瓶通信）に属する単一記事 / アーカイブページに
 *  body.touhei-mode 経由で適用される。
 *  
 *  読み込み順序：shinen-mode.css → touhei-mode.css （後勝ち上書き）
 *  
 *  外部CSSファイル化日：2026-05-20
 *
 *  含まれるもの：
 *   - 旧 wp-content/themes/tcd083-child/style.css 行527-775（投瓶モード本体）
 *   - 旧 style.css 末尾（行815-851）の投瓶モード時のサイドバー検索ボックス
 *   - 旧 投瓶通信記事の「カスタムCSS（この投稿のみ）」欄にあった
 *     blockquote の群青化（記事ごとに重複コピペされていた分）
 *   - 旧 クラウCSS末尾に誤混入していた touhei-mode の blockquote::before 修正
 *
 *  コンセプト：夜明け前の沖合。深淵ゴールドを灯火として残しつつ、
 *             メインアクセントを薄明ブルーに移す。
 * ========================================================================= */


/* --- A. 全体背景：群青グラデーション（深淵を東に向かわせる） --- */
body.touhei-mode {
  background: linear-gradient(135deg, #0a1028 0%, #121a3a 50%, #1a223f 100%) !important;
  background-attachment: fixed !important;
  color: #b8c2d4 !important;
}


/* --- B. 本文テキスト：朝霧の白へ少しシフト ----------------- */
body.touhei-mode .post_content,
body.touhei-mode .post_content p,
body.touhei-mode .post_content li {
  color: #c8d0e0 !important;
}
body.touhei-mode .post_content h1,
body.touhei-mode .post_content h2,
body.touhei-mode .post_content h3,
body.touhei-mode .post_content h4,
body.touhei-mode .post_title_area h1,
body.touhei-mode .post_title_area h2,
body.touhei-mode .post_title,
body.touhei-mode .post_title_area .post_title,
body.touhei-mode .single_title,
body.touhei-mode .entry-title {
  color: #e8edf5 !important;
}


/* --- C. リンク色：薄明ブルーを基調、ホバーで夜明けクリーム --- */
body.touhei-mode a {
  color: #7da3c8 !important;
}
body.touhei-mode a:hover {
  color: #a8c8e4 !important;
}
/* 区切り線：薄明ブルー薄め */
body.touhei-mode .post_content hr {
  border-color: rgba(125, 163, 200, 0.3) !important;
}


/* --- D. パンくずリスト・メタ情報 --------------------------- */
body.touhei-mode .breadcrumbs,
body.touhei-mode .breadcrumb,
body.touhei-mode #breadcrumb,
body.touhei-mode .post_meta,
body.touhei-mode .meta {
  color: #8a92a8 !important;
}
body.touhei-mode .breadcrumbs a,
body.touhei-mode .breadcrumb a,
body.touhei-mode #breadcrumb a {
  color: #7da3c8 !important;
}


/* --- E. サイドバー：見出し（薄明ブルーへ） ----------------- */
body.touhei-mode #side_col .widget_headline,
body.touhei-mode #side_col .widget_headline span,
body.touhei-mode .widget_headline,
body.touhei-mode .widget_headline span,
html body.touhei-mode #side_col .widget_headline span {
  color: #7da3c8 !important;
}
body.touhei-mode .widget_headline::after,
body.touhei-mode #side_col .widget_headline::after {
  background: rgba(125, 163, 200, 0.25) !important;
}


/* --- F. 記事ナビ（前・次の記事）：群青化 ------------------- */
body.touhei-mode #next_prev_post .item a {
  background: rgba(22, 28, 55, 0.5) !important;
  border: 1px solid rgba(125, 163, 200, 0.2) !important;
  color: #c8d0e0 !important;
}
body.touhei-mode #next_prev_post .item a:hover {
  background: rgba(125, 163, 200, 0.12) !important;
  color: #a8c8e4 !important;
}
body.touhei-mode #next_prev_post .item .title,
body.touhei-mode #next_prev_post .item .nav {
  color: #c8d0e0 !important;
}
body.touhei-mode #next_prev_post .item .title span {
  color: #e8edf5 !important;
}


/* --- G. SNSシェア・コピーURLボタン：群青化 ----------------- */
body.touhei-mode #single_copy_title_url_bottom .copy_btn,
body.touhei-mode .single_copy_title_url button,
body.touhei-mode .copy_title_url_btn {
  background: rgba(22, 28, 55, 0.5) !important;
  border: 1px solid rgba(125, 163, 200, 0.25) !important;
  color: #c8d0e0 !important;
}


/* --- H. サイドバー：おすすめ記事タブ ----------------------- */
body.touhei-mode .widget_tab_post_list_button {
  background: rgba(22, 28, 55, 0.5) !important;
}
body.touhei-mode .widget_tab_post_list_button .tab1,
body.touhei-mode .widget_tab_post_list_button .tab2 {
  background: rgba(22, 28, 55, 0.7) !important;
  color: #8a92a8 !important;
  border-color: rgba(125, 163, 200, 0.2) !important;
}
body.touhei-mode .widget_tab_post_list_button .tab1.active,
body.touhei-mode .widget_tab_post_list_button .tab2.active {
  background: rgba(125, 163, 200, 0.18) !important;
  color: #7da3c8 !important;
}
body.touhei-mode .widget_tab_post_list .title,
body.touhei-mode .widget_tab_post_list .title span {
  color: #c8d0e0 !important;
}
body.touhei-mode .widget_tab_post_list a:hover .title,
body.touhei-mode .widget_tab_post_list a:hover .title span {
  color: #a8c8e4 !important;
}


/* --- I. サイドバー：カテゴリーリスト ----------------------- */
body.touhei-mode .tcd_category_list a {
  border-color: rgba(125, 163, 200, 0.15) !important;
  color: #c8d0e0 !important;
}
body.touhei-mode .tcd_category_list a:hover {
  color: #a8c8e4 !important;
}


/* --- J. サイドバー：最近の記事ウィジェット ----------------- */
body.touhei-mode .styled_post_list1 .title_area {
  background: rgba(22, 28, 55, 0.5) !important;
  border-color: rgba(125, 163, 200, 0.2) !important;
}
body.touhei-mode .styled_post_list1 .title,
body.touhei-mode .styled_post_list1 .title span,
body.touhei-mode .styled_post_list1 .title_area .title {
  color: #c8d0e0 !important;
}
body.touhei-mode .styled_post_list1 a:hover .title,
body.touhei-mode .styled_post_list1 a:hover .title span {
  color: #a8c8e4 !important;
}


/* --- K. サイドバー：アーカイブドロップダウン --------------- */
body.touhei-mode .p-dropdown__title {
  background: rgba(22, 28, 55, 0.5) !important;
  border: 1px solid rgba(125, 163, 200, 0.2) !important;
  color: #c8d0e0 !important;
}
body.touhei-mode .p-dropdown__title.is-active {
  color: #7da3c8 !important;
  border-color: rgba(125, 163, 200, 0.35) !important;
}
body.touhei-mode .p-dropdown__list li a {
  background: rgba(22, 28, 55, 0.5) !important;
  border-color: rgba(125, 163, 200, 0.15) !important;
  color: #c8d0e0 !important;
}
body.touhei-mode .p-dropdown__list li a:hover {
  background: rgba(125, 163, 200, 0.12) !important;
  color: #a8c8e4 !important;
}


/* --- L. サイドバー：ポストスライダー ----------------------- */
body.touhei-mode .post_slider_widget .post_slider {
  background: rgba(22, 28, 55, 0.5) !important;
  border: none !important;
}
body.touhei-mode .post_slider_widget .post_slider .title_area .title,
body.touhei-mode .post_slider_widget .post_slider .title_area .title span,
body.touhei-mode .post_slider_widget .post_slider .title_area p {
  color: #e8edf5 !important;
}
body.touhei-mode .post_slider_widget .post_slider a:hover .title,
body.touhei-mode .post_slider_widget .post_slider a:hover .title span {
  color: #a8c8e4 !important;
}
body.touhei-mode .post_slider_widget .slick-dots li button:before {
  color: rgba(125, 163, 200, 0.4) !important;
}
body.touhei-mode .post_slider_widget .slick-dots li.slick-active button:before {
  color: #7da3c8 !important;
}


/* --- M. サイドバー：投稿カレンダー（深淵紫→深い群青へ） ---- */
body.touhei-mode #wp-calendar tbody a {
  background: #2a3858 !important;
  color: #d4a84a !important;  /* 深淵ゴールドを灯火として残す */
}
body.touhei-mode #wp-calendar tbody a:hover {
  background: #3a4a70 !important;
  color: #f0d68a !important;
}
body.touhei-mode #wp-calendar tbody td {
  color: #c8d0e0 !important;
}
body.touhei-mode #wp-calendar thead th {
  color: #8a92a8 !important;
}
body.touhei-mode #wp-calendar caption {
  color: #7da3c8 !important;
}
body.touhei-mode #wp-calendar-nav a,
body.touhei-mode .wp-calendar-nav a {
  color: #5a7a9a !important;
}
body.touhei-mode #wp-calendar-nav a:hover,
body.touhei-mode .wp-calendar-nav a:hover {
  color: #7da3c8 !important;
}


/* --- N. 関連記事・コメント見出し帯 ------------------------- */
body.touhei-mode #related_post .headline,
body.touhei-mode #comments .headline {
  background: rgba(125, 163, 200, 0.15) !important;
  color: #7da3c8 !important;
}
body.touhei-mode #related_post .title_area {
  border-bottom-color: rgba(125, 163, 200, 0.2) !important;
  border-right-color: rgba(125, 163, 200, 0.2) !important;
}


/* --- O. 書き手アバター：触らない（深淵モードと同じくベージュ維持） --- */
/*    深淵モードで意図的にベージュに保たれている書き手カードは、         */
/*    投瓶モードでもそのまま維持。                                      */


/* ============================================================
 *  サイドバー検索ボックス｜投瓶モード対応
 *  ----------------------------------------------------------
 *  body.shinen-mode かつ body.touhei-mode の場合、
 *  shinen-mode.css の暗色UIを群青系で上書きする。
 *  詳細度を稼ぐため body.shinen-mode.touhei-mode を指定。
 * ============================================================ */

/* 検索フォーム全体の枠とBG：群青系へ */
body.shinen-mode.touhei-mode:not(.shinen-clapus-mode) #searchform {
  background: #0a1530 !important;
  border: 1px solid #2a3858 !important;
  transition: border-color 0.3s ease !important;
}

/* 入力テキストフィールド */
body.shinen-mode.touhei-mode:not(.shinen-clapus-mode) #searchform input[type="text"] {
  background: transparent !important;
  color: #c8d0e0 !important;
  border: none !important;
}

/* プレースホルダー */
body.shinen-mode.touhei-mode:not(.shinen-clapus-mode) #searchform input[type="text"]::placeholder {
  color: #6a7290 !important;
}

/* フォーカス時：枠を夜明けブルーに */
body.shinen-mode.touhei-mode:not(.shinen-clapus-mode) #searchform:focus-within {
  border-color: #7da3c8 !important;
}

/* 虫眼鏡アイコン（::before）：夜明けブルーへ */
body.shinen-mode.touhei-mode:not(.shinen-clapus-mode) #searchform .submit_button::before {
  color: #7da3c8 !important;
}

/* 虫眼鏡ホバー時：より明るい夜明けブルー */
body.shinen-mode.touhei-mode:not(.shinen-clapus-mode) #searchform .submit_button:hover::before {
  color: #a8c8e4 !important;
}


/* ============================================================
 *  引用ブロック（blockquote）｜投瓶モード調整（v1.0）
 *  ----------------------------------------------------------
 *  旧 投瓶通信記事の「カスタムCSS」欄にあった調整を統合。
 *  背景を CF7メッセージ欄と同じ深い濃紺に、開きクォートを
 *  5px右へ移動、薄明ブルー化。
 * ============================================================ */

/* P-1. 引用ブロック本体：背景をCF7メッセージ欄と同じ深い濃紺に */
body.touhei-mode .post_content blockquote {
  background: rgba(12, 16, 35, 0.6) !important;
  border: 1px solid rgba(125, 163, 200, 0.2) !important;
  color: #e8edf5 !important;
}

/* P-2. 引用ブロック内の文字色 */
body.touhei-mode .post_content blockquote p {
  color: #e8edf5 !important;
}

/* P-3. 開きクォーテーション：5px右へ移動＆薄明ブルー化 */
body.touhei-mode .post_content blockquote::before {
  left: 13px !important;
  color: #7da3c8 !important;
}

/* P-4. 閉じクォーテーション：色だけ薄明ブルー化 */
body.touhei-mode .post_content blockquote::after {
  color: #7da3c8 !important;
}


/* === 投瓶モード CSS ここまで（v2.0） ============================ */

/* =========================================================================
   投瓶モード｜引用ブロック（blockquote）調整（v1.0）
   -------------------------------------------------------------------------
   背景を群青寄りに馴染ませ、開きクォーテーションを5px右へ。
   クォーテーションマークの色も薄明ブルーに統一。
   ========================================================================= */

/* P-1. 引用ブロック本体：背景を投瓶世界に溶かす */
body.touhei-mode .post_content blockquote {
  background: rgba(22, 28, 55, 0.5) !important;
  border: 1px solid rgba(125, 163, 200, 0.2) !important;
  color: #e8edf5 !important;
}

/* P-2. 引用ブロック内の文字色 */
body.touhei-mode .post_content blockquote p {
  color: #e8edf5 !important;
}

/* P-3. 開きクォーテーション：5px右へ移動＆薄明ブルー化 */
body.touhei-mode .post_content blockquote::before {
  left: 13px !important;
  color: #7da3c8 !important;
}

/* P-4. 閉じクォーテーション：色だけ薄明ブルー化 */
body.touhei-mode .post_content blockquote::after {
  color: #7da3c8 !important;
}
/* P-1. 引用ブロック本体：背景をCF7メッセージ欄と同じ深い濃紺に */
body.touhei-mode .post_content blockquote {
  background: rgba(12, 16, 35, 0.6) !important;
  border: 1px solid rgba(125, 163, 200, 0.2) !important;
  color: #e8edf5 !important;
}
/* ============================================================
 *  サイドバー：記事の書き手ウィジェット｜投瓶モード（v1.0）
 *  ----------------------------------------------------------
 *  shinen-mode の深淵ゴールド枠線を、投瓶の薄明ブルー薄めに上書き。
 * ============================================================ */

/* タイトル枠：薄明ブルー薄め */
body.touhei-mode #side_col .widget_ut_author_widget .widget_headline {
  border-color: rgba(125, 163, 200, 0.3) !important;
}

/* カード本体の枠：薄明ブルー薄め */
body.touhei-mode #side_col .widget_ut_author_widget .ut-clau-wrap {
  border-color: rgba(125, 163, 200, 0.3) !important;
}