@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){
  /*必要ならばここにコードを書く*/
}

/* ヘッダーテキスト以外の文字色 */
header .tagline,
header .skinadd-topmv-scroll__txt,
header .skinadd-topmv-scroll
{
    color: #ffffff !important;
}



/* フッター全体の背景色を珈琲色（ダークブラウン）にする */
#footer, .footer {
  background-color: #3b2314 !important; /* 深い珈琲色のカラーコード */
  color: #f5f0eb !important;           /* フッター内の文字色を明るいミルク色にする場合 */
}

/* フッター内のリンク文字の色 */
#footer a, .footer a {
  color: #d4bda8 !important;           /* リンクを落ち着いたブラウンベージュにする場合 */
}

/* マウスを合わせた（ホバーした）ときのリンクの色 */
#footer a:hover, .footer a:hover {
  color: #ffffff !important;           /* ホバー時は白く光らせる */
}

/* AI Cafe Club : Mermaid 統一表示（修正版）
   方針：文字サイズ・フォントはCSSで上書きせず、Mermaid側の設定(init)で14pxに統一。
   CSSは「枠・色・線」だけを担当し、SVGの拡大縮小(width/max-width)には触らない。 */

/* 1. 外枠（図が大きい場合は横スクロール） */
.entry-content .mermaid,
.entry-content pre.mermaid,
.entry-content .wp-block-merpress-mermaidjs {
  background: #faf7f2;
  border: 1px solid #e8ded2;
  border-radius: 12px;
  padding: 24px 16px;
  margin: 32px auto;
  box-shadow: 0 4px 12px rgba(60, 42, 30, .04);
  overflow-x: auto;
  overflow-y: hidden;
  text-align: center;
  -webkit-overflow-scrolling: touch;
}

/* 2. SVG：サイズ指定は一切しない（width / max-width / font-size を触らない） */
.entry-content .mermaid svg {
  display: block;
  margin: 0 auto;
  height: auto;
}

/* 3. 文字色（サイズは触らない） */
.entry-content .mermaid .nodeLabel,
.entry-content .mermaid .node text,
.entry-content .mermaid .label text {
  color: #3e2a1b !important;
  fill: #3e2a1b !important;
  font-weight: 500;
}
.entry-content .mermaid .edgeLabel,
.entry-content .mermaid .edgeLabel span,
.entry-content .mermaid .edgeLabel p {
  background-color: #faf7f2 !important;
  color: #5c4331 !important;
}
.entry-content .mermaid .cluster-label,
.entry-content .mermaid .cluster text,
.entry-content .mermaid .cluster span {
  color: #5c4331 !important;
  fill: #5c4331 !important;
  font-weight: 700;
}

/* 4. ノード */
.entry-content .mermaid .node rect,
.entry-content .mermaid .node circle,
.entry-content .mermaid .node ellipse,
.entry-content .mermaid .node polygon,
.entry-content .mermaid .node path {
  fill: #fff !important;
  stroke: #8a6a50 !important;
  stroke-width: 1.8px !important;
}

/* 5. Subgraph */
.entry-content .mermaid .cluster rect { stroke-width: 1.5px !important; rx: 8px !important; ry: 8px !important; }
.entry-content .mermaid g.cluster:nth-of-type(odd)  rect { fill: #f4eee6 !important; stroke: #d8c8b8 !important; }
.entry-content .mermaid g.cluster:nth-of-type(even) rect { fill: #eae1d3 !important; stroke: #c2ad99 !important; }
.entry-content .mermaid g.cluster:nth-of-type(3n)   rect { fill: #f9f5ef !important; stroke: #ded3c5 !important; }

/* 6. 接続線・矢印 */
.entry-content .mermaid .edgePath path,
.entry-content .mermaid .flowchart-link { stroke: #8a6a50 !important; stroke-width: 1.8px !important; }
.entry-content .mermaid marker path { fill: #8a6a50 !important; stroke: #8a6a50 !important; }

/* 7. はみ出し防止（日本語ラベル用） */
.entry-content .mermaid foreignObject { overflow: visible; }

/* --- Mermaid 図表タイトル --- */
.entry-content .mermaid-title {
    text-align: center !important;
    font-size: 14.5px !important;
    font-weight: 700 !important;
    color: #5c4331 !important;              /* カフェモカブラウン */
    margin-top: 36px !important;
    margin-bottom: -20px !important;        /* 図の上の余白と引き締めて一体化 */
    letter-spacing: 0.03em !important;
}

/* --- 自動生成グラフ（アプローチ2）のスタイル --- */
.entry-content figure.wp-block-image.cafe-chart-figure {
    background: #faf7f2 !important;
    border: 1px solid #e8ded2 !important;
    border-radius: 12px !important;
    padding: 20px 16px 14px 16px !important;
    margin: 32px auto !important;
    box-shadow: 0 4px 12px rgba(60, 42, 30, 0.04) !important;
    text-align: center !important;
    max-width: 640px !important;
}

.entry-content figure.wp-block-image.cafe-chart-figure img {
    border-radius: 8px !important;
    height: auto !important;
    box-shadow: 0 2px 8px rgba(60, 42, 30, 0.06) !important;
}

.entry-content figure.wp-block-image.cafe-chart-figure figcaption {
    margin-top: 12px !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: #5c4331 !important;
    letter-spacing: 0.03em !important;
}


/* ==========================================================
   カテゴリー一覧：親・子カテゴリー表示
   ハイフン改行対策版
   ========================================================== */


/* ----------------------------------------------------------
   1. カテゴリー一覧の基本
   ---------------------------------------------------------- */

.wp-block-categories {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* ----------------------------------------------------------
   2. 親カテゴリー
   ---------------------------------------------------------- */

.wp-block-categories > li {
    font-weight: 700 !important;
    margin-bottom: 6px !important;
}


/* ----------------------------------------------------------
   3. 子カテゴリー
   ---------------------------------------------------------- */

.wp-block-categories > li > ul {
    margin: 4px 0 10px 0 !important;
    padding-left: 18px !important;
    list-style: none !important;
}


/* 子カテゴリー */

.wp-block-categories > li > ul > li {
    font-weight: 400 !important;
    margin: 3px 0 !important;
    padding: 0 !important;

    /*
     * 改行を防止
     */
    white-space: nowrap !important;
}


/* ----------------------------------------------------------
   4. 子カテゴリーの「-」
   ---------------------------------------------------------- */

.wp-block-categories > li > ul > li::before {
    content: "-" !important;

    /*
     * ハイフンと文字を同じ行に固定
     */
    display: inline !important;

    margin-right: 6px !important;

    white-space: nowrap !important;
}


/* 子カテゴリーのリンクもインライン固定 */

.wp-block-categories > li > ul > li > a {
    display: inline !important;

    white-space: nowrap !important;
}


/* ----------------------------------------------------------
   5. 孫カテゴリー
   ---------------------------------------------------------- */

.wp-block-categories > li > ul > li > ul {
    margin: 3px 0 6px 0 !important;
    padding-left: 18px !important;
    list-style: none !important;
}


.wp-block-categories > li > ul > li > ul > li {
    font-weight: 400 !important;
    margin: 2px 0 !important;
    padding: 0 !important;
}


/* 孫カテゴリー */

.wp-block-categories > li > ul > li > ul > li::before {
    content: "--" !important;
    display: inline !important;
    margin-right: 6px !important;
}


/* ----------------------------------------------------------
   6. カテゴリーリンク
   ---------------------------------------------------------- */

.wp-block-categories a {
    text-decoration: none !important;
}


/* ----------------------------------------------------------
   7. カテゴリー数
   ---------------------------------------------------------- */

.wp-block-categories .cat-item .count {
    font-weight: 400 !important;
}