/* ==================================================
   共通（どのテーマでも崩れないベース）
================================================== */

.md-grid {
  max-width: 1600px;
}

/* ヘッダー */
.md-header {
  box-shadow: 0 2px 6px rgba(0,0,0,.18);
}

/* テーブル */
.md-typeset table:not([class]) {
  font-size: 0.9rem;
}

/* ==================================================
   ダークモード（艦これUI本体）
================================================== */

[data-md-color-scheme="slate"] {

  --kancolle-bg: #071423;
  --kancolle-panel: #0b1b2b;
  --kancolle-text: #cfe6ff;
  --kancolle-accent: #3aa6d6;
  --kancolle-accent2: #2f6f9f;

}

/* サイドバー背景（ダーク） */
[data-md-color-scheme="slate"] .md-sidebar__scrollwrap {
  background: linear-gradient(180deg, #071423 0%, #0b1b2b 100%);
}

/* ナビ */
[data-md-color-scheme="slate"] .md-nav__link {
  color: #cfe6ff;
}

/* hover */
[data-md-color-scheme="slate"] .md-nav__link:hover {
  color: #3aa6d6;
  background: rgba(58,166,214,0.06);
}

/* active */
[data-md-color-scheme="slate"] .md-nav__link--active {
  color: #7fcfff;
  background: rgba(58,166,214,0.10);
  border-left: 2px solid #3aa6d6;
  font-weight: 600;
}

/* 見出し */
[data-md-color-scheme="slate"] .md-content h1,
[data-md-color-scheme="slate"] .md-content h2 {
  border-bottom: 1px solid rgba(58,166,214,0.35);
}

[data-md-color-scheme="slate"] .md-content h3 {
  border-left: 3px solid #3aa6d6;
}

/* 画像（ダーク） */
[data-md-color-scheme="slate"] .md-content img {
  border: 2px solid rgba(31, 79, 115, 0.7);
  border-radius: 6px;
  padding: 3px;
  background: linear-gradient(180deg, rgba(20,40,60,0.25), rgba(10,20,35,0.15));
  box-shadow: 0 3px 10px rgba(0,0,0,0.35);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

[data-md-color-scheme="slate"] .md-content img:hover {
  border-color: rgba(58, 166, 214, 0.75);
  box-shadow: 0 6px 14px rgba(0,0,0,0.4);
  transform: scale(1.01);
}

[data-md-color-scheme="slate"] .md-content img:active {
  transform: scale(0.995);
  box-shadow: 0 2px 8px rgba(0,0,0,0.35);
}


/* ==================================================
   ライトモード（読みやすさ最優先）
================================================== */

[data-md-color-scheme="default"] {

  --kancolle-bg: #f7f9fc;
  --kancolle-panel: #ffffff;
  --kancolle-text: #1f2a37;
  --kancolle-accent: #2f6f9f;
  --kancolle-accent2: #4aa3d8;

}

/* サイドバー背景（ライト） */
[data-md-color-scheme="default"] .md-sidebar__scrollwrap {
  background: #f2f6fb;
}

/* ナビ */
[data-md-color-scheme="default"] .md-nav__link {
  color: #1f2a37;
}

/* hover */
[data-md-color-scheme="default"] .md-nav__link:hover {
  color: #2f6f9f;
  background: rgba(47,111,159,0.08);
}

/* active */
[data-md-color-scheme="default"] .md-nav__link--active {
  color: #1f4f73;
  background: rgba(47,111,159,0.12);
  border-left: 2px solid #2f6f9f;
}

/* 見出し */
[data-md-color-scheme="default"] .md-content h1,
[data-md-color-scheme="default"] .md-content h2 {
  border-bottom: 1px solid rgba(47,111,159,0.25);
}

[data-md-color-scheme="default"] .md-content h3 {
  border-left: 3px solid #2f6f9f;
}

/* 画像（ライト） */
[data-md-color-scheme="default"] .md-content img {
  border: 2px solid rgba(31, 79, 115, 0.45);
  border-radius: 6px;
  padding: 3px;
  background: rgba(255, 255, 255, 0.6);
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

[data-md-color-scheme="default"] .md-content img:hover {
  border-color: rgba(58, 166, 214, 0.65);
  box-shadow: 0 6px 12px rgba(0,0,0,0.12);
  transform: scale(1.01);
}

[data-md-color-scheme="default"] .md-content img:active {
  transform: scale(0.995);
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

/* =========================
   サイドバー セクション強調
========================= */

/* セクション見出し（例: EO攻略 / 通常海域など） */
.md-nav__item--section > .md-nav__link {
  font-weight: 700;
  font-size: 0.85rem;
  color: #4aa3df;
  letter-spacing: 0.03em;

  /* ちょいカード化 */
  background: rgba(74, 163, 223, 0.08);
  border-radius: 6px;
  padding: 6px 10px;
  margin: 6px 0;

  border-left: 3px solid rgba(74, 163, 223, 0.6);
}

/* ホバー */
.md-nav__item--section > .md-nav__link:hover {
  background: rgba(74, 163, 223, 0.14);
  border-left: 3px solid #3aa6d6;
  color: #7dd3ff;
}

/* 子リスト（中身）を少し見やすく */
.md-nav__item--section .md-nav__list {
  padding-left: 10px;
  border-left: 1px dashed rgba(74, 163, 223, 0.25);
  margin-left: 6px;
}