/* 記号だけのキャプションを「線のみ」に見せる工夫 */
p.caption[role="heading"]:contains("---") {
    font-size: 0;               /* 文字を消す */
    border-top: 2px double #333; /* 二重線にする */
    margin: 20px 0 10px 0;
}

/* --- サイドメニュー（Navigation Pane）専用のスタイル --- */

/* サイドメニューのキャプション（区切り線）を水色にする */
.wy-menu-vertical p.caption[role="heading"] {
    border-top: 1px solid #ccc; /* 上側に線を引く */
    margin-top: 15px;           /* 上に少し余白を作る */
    padding-top: 10px;          /* 線と文字の間の余白 */
    font-weight: bold;
    color: #00e5ff !important;  /* 強制的に水色にする */
}

/* 記号だけのキャプションを「線のみ」に見せる */
.wy-menu-vertical p.caption[role="heading"]:contains("---") {
    font-size: 0;               /* 文字を消す */
    border-top: 2px double #888; /* 二重線にする */
    margin: 20px 0 10px 0;
}

/* --- メインコンテンツ（Contents Pane）の見出しスタイル --- */

/* 右側のメインエリアの見出しを黒系にする */
.wy-nav-content h1,
.wy-nav-content h2,
.wy-nav-content h3,
.wy-nav-content p.caption[role="heading"] {
    color: #333333 !important;   /* 濃いグレーで視認性を確保 */
    border-top: none;            /* メイン側には上の線を表示しない */
}

/* （オプション）メインの見出しの下に線を引いて読みやすくする */
.wy-nav-content h2 {
    border-bottom: 2px solid #333333;
    padding-bottom: 5px;
}



/* コードブロックの背景と角丸 */
div[class^='highlight'] {
    border-radius: 6px;
    border: 1px solid #e1e4e8;
}

/* dropdown（折りたたみ）の外枠を少し強調 */
.sd-dropdown {
//    border: 1px solid #007bff !important; /* 青い枠線 */
//    margin-bottom: 1em;
}

.sd-dropdown .sd-summary-title {
    background-color: #f8f9fa; /* タイトル部分の背景を薄いグレーに */
//    font-weight: 600;
}

/* インライン数式の前後を少しあける */
span.math {
    padding: 0 2px;
}

/* 外部リンクにアイコンを付与する*/
a.reference.external:after {
    content: "\2197"; /* ↗ */
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 0.8em;
    padding-left: 4px;
}

/* テーブルの外枠を二重線にする */
.wy-table-responsive table.docutils {
    border: 5px double #e1e4e8 !important; /* 3px以上の太さにすると二重線が綺麗に見えます */
    border-collapse: separate !important;   /* 二重線を出すために必要 */
    border-spacing: 0;
}

/* セルの境界線をすべて二重線にする */
.wy-table-responsive table.docutils td,
.wy-table-responsive table.docutils th {
    border: 5px double #e1e4e8 !important;
}

/* テーブル全体の幅を親要素（100%）に固定する */
.wy-table-responsive {
    overflow-x: auto;               /* どうしてもはみ出す場合のみスクロール */
}

/* テーブルの枠を突き抜けて表示させるための設定 */
.wy-table-responsive, 
.wy-table-responsive table.docutils {
    overflow: visible !important; /* hidden や auto を上書き */
}

.wy-table-responsive table {
    width: 100% !important;
    table-layout: fixed;            /* 列幅を :widths: の指定通りに固定 */
}

/* テーブル内のセルの余白（パディング）を小さくする */
.wy-table-responsive table td, 
.wy-table-responsive table th {
    padding: 4px 8px !important; /* 上下を4px、左右を8pxに縮小（デフォルトは10px以上） */
    line-height: 1.2 !important;  /* 行間を詰める */
}

/* 段数などの短いテキストが入る列のフォントサイズを少し小さくしてさらに凝縮する（任意） */
.wy-table-responsive table td {
    font-size: 0.9em;
}

/* テーブル内のラインブロックが持つ独自の余白をゼロにする */
.wy-table-responsive table td .line-block {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    line-height: 1.2 !important; /* 行間もテーブル全体に合わせる */
}

/* ラインブロック内の各行（.line）自体の余白も調整 */
.wy-table-responsive table td .line {
    margin: 0 !important;
    padding: 0 !important;
}

/* 前回の td パディング設定と合わせることで、全てのセルが同じ高さになります */
.wy-table-responsive table td {
    padding: 4px 8px !important;
    vertical-align: middle; /* 改行された時に上下中央に配置したい場合はこれ */
}

/* ホバー用コンテナ */
.hover-text {
    position: relative;
    display: inline-block;
    font-size: 1.1em;
    color: #00e5ff;
    cursor: help;
    margin-left: 5px;
    vertical-align: middle;
}

/* ⓘ マーク */
.hover-text::before {
    content: "ⓘ";
    font-weight: bold;
}

/* 説明文（吹き出し）の初期状態 */
.hover-text .description {
    display: none;
    position: absolute;
    z-index: 99999;     /* 非常に高い値を設定 */
    top: -5px;          /* ⓘ マークの少し上に合わせる */
    left: 120%;         /* ⓘ の右側に配置（テーブル内でのクリップを防ぐ） */
    background-color: #333333;
    color: #ffffff;
    padding: 10px;
    border-radius: 6px;
    width: 250px;       
    white-space: normal;
    font-size: 0.85em;
    line-height: 1.4;
    box-shadow: 0 4px 10px rgba(0,0,0,0.5);
    pointer-events: none; /* マウスが吹き出しに乗っても消えないようにする */
}

/* マウスを乗せた時だけ表示する */
.hover-text:hover .description {
    display: block; /* 表示に切り替え */
}

/* 吹き出しの矢印（左側に変更） */
.hover-text:hover .description::after {
    content: "";
    position: absolute;
    top: 10px;
    right: 100%;        /* 吹き出しの左端に配置 */
    border-width: 5px;
    border-style: solid;
    border-color: transparent #333 transparent transparent;
}


/* 文字を赤色にするための設定 */
.red-text {
    color: red;
    font-weight: bold;
}