@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
*/

/* ============================================================
   カラーパレット
   ============================================================ */
:root {
  --paper:      #f5efe0;   /* 古紙クリーム */
  --ink:        #1e1408;   /* 濃い墨色 */
  --forest:     #1e3d2b;   /* アパラチアン山の森 */
  --rust:       #8b2020;   /* 革・錆 */
  --tan:        #c4a060;   /* 真鍮・枯草 */
  --wood:       #5c3d1e;   /* 古い木 */
  --mist:       #d4cfc4;   /* 山の霧 */
  --header-bg:  #0f1e14;   /* ヘッダー深緑 */
}

/* ============================================================
   全体
   ============================================================ */
body {
  background-color: var(--paper) !important;
  color: var(--ink) !important;
  font-family: 'Libre Baskerville', Georgia, 'Times New Roman', serif !important;
  /* 古い紙のノイズテクスチャ（CSSのみ） */
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E") !important;
}

#wrapper {
  background-color: transparent !important;
}

/* ============================================================
   ヘッダー
   ============================================================ */
#header,
.header-container,
.header-container-in {
  background-color: var(--header-bg) !important;
  background-image:
    linear-gradient(
      to bottom,
      rgba(15, 30, 20, 0.78) 0%,
      rgba(15, 30, 20, 0.65) 50%,
      rgba(15, 30, 20, 0.82) 100%
    ),
    url('https://upload.wikimedia.org/wikipedia/commons/9/94/1903_Boston_vs_Chicago_at_Huntington_Avenue_Grounds.jpg') !important;
  background-size: cover !important;
  background-position: center 40% !important;
  background-repeat: no-repeat !important;
  border-bottom: 3px solid var(--tan) !important;
  padding: 16px 0 14px !important;
  position: relative;
}

/* 1903年 ボストン vs シカゴ パノラマ写真（パブリックドメイン） */

/* 横罫線の装飾 */
#header::before,
#header::after {
  content: '';
  display: block;
  height: 1px;
  background: linear-gradient(to right, transparent, var(--tan), transparent);
  position: absolute;
  left: 10%;
  right: 10%;
}
#header::before { top: 6px; }
#header::after  { bottom: 6px; }

/* サイトタイトル */
.site-name,
#site-name,
.site-name-text,
#site-name a {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 1.7rem !important;
  font-weight: 900 !important;
  color: var(--paper) !important;
  text-shadow: 1px 2px 8px rgba(0,0,0,0.6) !important;
  letter-spacing: 0.04em !important;
  text-decoration: none !important;
}

/* キャッチフレーズ */
.tagline,
#tagline {
  font-family: 'Libre Baskerville', Georgia, serif !important;
  font-style: italic !important;
  color: var(--tan) !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.1em !important;
  margin-top: 3px !important;
}

/* ============================================================
   ナビゲーション
   ============================================================ */
#navi,
.navi-in,
.global-navi {
  background-color: var(--forest) !important;
  border-top: 2px solid var(--tan) !important;
  border-bottom: 2px solid var(--tan) !important;
}

#navi a,
.navi-in a,
.global-navi a {
  color: var(--paper) !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.08em !important;
  text-decoration: none !important;
}

#navi a:hover,
.global-navi a:hover {
  color: var(--tan) !important;
  background-color: rgba(255,255,255,0.08) !important;
}

/* ============================================================
   コンテンツエリア
   ============================================================ */
#container,
#main,
.entry-content {
  background-color: transparent !important;
}

/* サイト全体幅・メインカラム幅を拡張 */
.wrap {
  width: 1440px !important;
}

/* メインとサイドバーの間隔を固定 */
.content-in {
  justify-content: flex-start !important;
  align-items: flex-start !important;
  gap: 0 !important;
}

.main {
  width: 1010px !important;
  padding-top: 0 !important;
  padding-right: 16px !important;
}

/* サイドバーなしページはフル幅 */
.no-sidebar .main {
  width: 100% !important;
  max-width: 1400px !important;
}

/* サイドバー・ウィジェットのパディング */
.sidebar {
  padding: 0 12px 12px !important;
}

#sidebar .widget,
#sidebar aside {
  padding: 14px !important;
  margin-bottom: 16px !important;
  background-color: rgba(255,255,255,0.7) !important;
  border-top: 3px solid var(--forest) !important;
}

/* 記事カード */
.a-wrap,
.cat-label ~ .a-wrap,
article.post {
  background-color: rgba(255,255,255,0.55) !important;
  border: 1px solid var(--mist) !important;
  border-top: 3px solid var(--forest) !important;
  box-shadow: 2px 3px 10px rgba(30,20,8,0.08) !important;
  border-radius: 2px !important;
  margin-bottom: 2em !important;
  padding: 1.4em !important;
}

/* 記事タイトル */
.entry-title,
.entry-title a,
h1.entry-title {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 700 !important;
  color: var(--ink) !important;
  letter-spacing: 0.02em !important;
  border-bottom: 2px solid var(--tan) !important;
  padding-bottom: 8px !important;
}

.entry-title a:hover {
  color: var(--rust) !important;
}

/* 本文見出し */
.entry-content h2 {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 700 !important;
  color: var(--forest) !important;
  border-left: 5px solid var(--rust) !important;
  border-bottom: 1px solid var(--mist) !important;
  padding: 6px 0 6px 14px !important;
  margin-top: 2em !important;
  background: none !important;
}

.entry-content h3 {
  font-family: 'Playfair Display', Georgia, serif !important;
  color: var(--wood) !important;
  border-bottom: 1px dashed var(--tan) !important;
  padding-bottom: 4px !important;
  background: none !important;
}

/* 本文テキスト */
.entry-content p {
  line-height: 1.95 !important;
  font-size: 0.95rem !important;
}

/* リンク */
.entry-content a {
  color: var(--rust) !important;
  text-decoration: underline !important;
  text-decoration-color: var(--tan) !important;
}

/* ============================================================
   サイドバー
   ============================================================ */
#sidebar {
  background-color: transparent !important;
}

.widget,
.widget-wrap {
  background-color: rgba(255,255,255,0.5) !important;
  border: 1px solid var(--mist) !important;
  border-top: 3px solid var(--wood) !important;
  border-radius: 2px !important;
  box-shadow: 1px 2px 6px rgba(30,20,8,0.06) !important;
}

.widget-title,
.widgettitle {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 700 !important;
  color: var(--paper) !important;
  background-color: var(--wood) !important;
  padding: 8px 14px !important;
  margin: 0 0 12px !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.06em !important;
}

/* ============================================================
   フッター
   ============================================================ */
#footer,
.footer-container {
  background-color: var(--header-bg) !important;
  border-top: 3px solid var(--tan) !important;
  color: var(--mist) !important;
  font-family: 'Libre Baskerville', Georgia, serif !important;
  font-size: 0.8rem !important;
}

#footer a {
  color: var(--tan) !important;
}

/* ============================================================
   カテゴリラベル・タグ
   ============================================================ */
.cat-label,
.category-label {
  background-color: var(--forest) !important;
  color: var(--paper) !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.1em !important;
  border-radius: 1px !important;
}

/* ============================================================
   パンくずリスト
   ============================================================ */
#breadcrumb,
.breadcrumb {
  background-color: rgba(196,160,96,0.12) !important;
  border-bottom: 1px solid var(--tan) !important;
  font-family: 'Libre Baskerville', Georgia, serif !important;
  font-size: 0.78rem !important;
  color: var(--wood) !important;
  padding: 6px 16px !important;
}

/* ============================================================
   ページネーション
   ============================================================ */
.pagination .current,
.page-numbers.current {
  background-color: var(--rust) !important;
  color: var(--paper) !important;
  border-radius: 1px !important;
}

.pagination a,
.page-numbers a {
  color: var(--forest) !important;
  border: 1px solid var(--mist) !important;
  border-radius: 1px !important;
}

/* ============================================================
   区切り線・装飾
   ============================================================ */
hr {
  border: none !important;
  border-top: 1px dashed var(--tan) !important;
  margin: 2em 0 !important;
}


/* ============================================================
   レスポンシブ
   ============================================================ */
@media screen and (max-width: 1023px) {
  .site-name,
  #site-name,
  .site-name-text,
  #site-name a {
    font-size: 1.5rem !important;
  }
}

@media screen and (max-width: 834px) {
  .site-name,
  #site-name,
  .site-name-text,
  #site-name a {
    font-size: 1.3rem !important;
  }

  #header,
  .header-container {
    padding: 12px 0 10px !important;
  }
}

@media screen and (max-width: 480px) {
  .site-name,
  #site-name,
  .site-name-text,
  #site-name a {
    font-size: 1.1rem !important;
  }
}

/* チーム成績の旧3階層ドロップダウンを非表示 */
#menu-item-30 > .sub-menu { display: none !important; }

/* ── フロントページ ── */
.fp-intro {
  background: linear-gradient(135deg, var(--forest) 0%, var(--header-bg) 100%);
  border: 2px solid var(--tan);
  border-radius: 4px;
  padding: 24px 28px;
  margin-bottom: 2em;
  text-align: center;
}

.fp-tagline {
  color: var(--mist);
  font-family: 'Libre Baskerville', serif;
  font-size: 1.05em;
  line-height: 1.8;
  margin: 0;
  letter-spacing: 0.03em;
}

.fp-section-title {
  font-family: 'Playfair Display', serif !important;
  color: var(--forest) !important;
  font-size: 1.3em !important;
  border-left: 4px solid var(--tan) !important;
  border-bottom: none !important;
  padding: 4px 0 4px 12px !important;
  margin: 1.8em 0 0.6em !important;
}

/* ============================================================
   サブメニュー（ドロップダウン・3階層対応）
   ============================================================ */

/* 全レベルの .sub-menu に共通スタイル */
.navi-in > ul .sub-menu,
.navi-in > ul .sub-menu .sub-menu {
  background-color: var(--forest) !important;
  border: 1px solid var(--tan) !important;
  border-top: 2px solid var(--tan) !important;
  width: 200px !important;
}

/* 第3・4レベル：右側にフライアウト */
.navi-in > ul .sub-menu .sub-menu {
  position: absolute !important;
  top: 0 !important;
  left: 200px !important;
}

/* 全レベルのリンク */
.navi-in > ul .sub-menu li a {
  color: var(--paper) !important;
  font-size: 0.82rem !important;
  padding: 8px 14px !important;
  border-bottom: 1px solid rgba(196,160,96,0.15) !important;
}

.navi-in > ul .sub-menu li a:hover {
  background-color: rgba(255,255,255,0.1) !important;
  color: var(--tan) !important;
}

/* リーグ・地区ヘッダー（href="#"）は少し薄く区別 */
.navi-in > ul .sub-menu li.menu-item-has-children > a {
  font-weight: bold !important;
  color: var(--tan) !important;
  letter-spacing: 0.04em !important;
}

/* 右矢印アイコンの色 */
.navi-in > ul .sub-menu .sub-has-sub {
  color: var(--tan) !important;
}

/* ============================================================
   チーム詳細ページ — テーマh2スタイルの上書き
   ============================================================ */
.td-header h2.td-team-name {
  color: #fff !important;
  border: none !important;
  border-left: none !important;
  border-bottom: none !important;
  padding: 0 !important;
  margin: 0 0 4px !important;
  background: none !important;
  font-size: 1.5em !important;
}
.td-header .td-team-meta,
.td-header .td-splits {
  color: #a0b8d0 !important;
}
.td-header .td-record {
  color: #fff !important;
}
.td-header .td-pct,
.td-header .td-streak {
  color: #c8a415 !important;
}
.td-header .td-gb {
  color: #a0b8d0 !important;
}