/* ======================================
   Minimal Dev Docs — Final Polish
   less is more: neutral, crisp, readable
   ====================================== */

/* --- Neutral palette & spacings --- */
:root {
  /* Base text/background */
  --c-bg: #FFFFFF;
  --c-text: #1A1A1A;          /* main body text */
  --c-muted: #555555;         /* secondary text */
  --c-border: #E5E7EB;        /* light border */
  --c-hover: rgba(0,0,0,0.04);/* hover bg */

  /* Links (neutral, no brand jump) */
  --c-link: #1F1F1F;
  --c-link-hover: #0A0A0A;

  /* Left nav hierarchy (black → gray) */
  --nav-l1: #121212;          /* level 1 */
  --nav-l2: #2C2C2C;          /* level 2 */
  --nav-l3: #4A4A4A;          /* level 3 */
  --nav-l4: #6B6B6B;          /* level 4+ */

  /* Active state */
  --nav-active-bg: rgba(0,0,0,0.06);
  --nav-active-border: #111111;

  /* Header/Footer — Light scheme (enabled) */
  --header-light-bg: #F7F8FA;
  --header-light-fg: #111111;

  /* Footer follows header style */
  --footer-bg: #F7F8FA;
  --footer-fg: #1A1A1A;

  /* Structure */
  --radius: 8px;
  --pad-xy: 8px;
  --content-max: 1100px;      /* comfortable reading width */
}

/* --- Typography --- */
:root { --md-text-font: "Helvetica Neue", Arial, sans-serif; }

.md-typeset,
.md-typeset h1, .md-typeset h2, .md-typeset h3,
.md-typeset h4, .md-typeset h5, .md-typeset h6,
.md-nav__title {
  font-family: "Helvetica Neue", Arial, sans-serif;
  color: var(--c-text);
}

.md-typeset { font-size: 16px; line-height: 1.6; }
.md-typeset h1 { font-size: 30px; line-height: 1.3;  margin: 0.7em 0 0.45em; }
.md-typeset h2 { font-size: 24px; line-height: 1.35; margin: 1.0em 0 0.55em; }
.md-typeset h3 { font-size: 20px; line-height: 1.4;  margin: 0.9em 0 0.5em; }
.md-typeset h4 { font-size: 18px; line-height: 1.45; margin: 0.8em 0 0.4em; }

/* Comfortable line length */
.md-grid { max-width: calc(var(--content-max) + 48px); } /* include gutters */

/* --- Header (Light) --- */
.md-header {
  background: var(--header-light-bg) !important;
  color: var(--header-light-fg) !important;
  box-shadow: none;
  border-bottom: 1px solid var(--c-border);
}
.md-header .md-header__title,
.md-header .md-header__button,
.md-header .md-icon,
.md-header a { color: var(--header-light-fg) !important; }

/* --- Footer --- */
.md-footer {
  background: var(--footer-bg) !important;
  color: var(--footer-fg);
  border-top: 1px solid var(--c-border);
}

/* --- Left nav: hierarchy, alignment, spacing --- */
/* Level 1 */
.md-nav--primary > .md-nav__list > .md-nav__item > .md-nav__link {
  color: var(--nav-l1);
  font-weight: 600;
  padding: 6px 10px;
  border-radius: var(--radius);
}
/* Level 2 */
.md-nav--primary .md-nav__item > nav > .md-nav__list > .md-nav__item > .md-nav__link {
  color: var(--nav-l2);
  padding: 6px 10px 6px 22px;  /* indent */
  border-radius: var(--radius);
}
/* Level 3 */
.md-nav--primary .md-nav__item > nav > .md-nav__list .md-nav__item > nav
  > .md-nav__list > .md-nav__item > .md-nav__link {
  color: var(--nav-l3);
  padding: 5px 10px 5px 34px;
}
/* Level 4+ */
.md-nav--primary .md-nav__item > nav > .md-nav__list .md-nav__item > nav
  > .md-nav__list .md-nav__item > nav > .md-nav__list > .md-nav__item > .md-nav__link {
  color: var(--nav-l4);
  padding: 4px 10px 4px 46px;
}

/* Ensure label text aligns nicely */
.md-nav__link .md-ellipsis { margin-left: 0; }

/* 父级目录选中 */
.md-nav__item--active > .md-nav__link {
  font-weight: 700;
  background: var(--nav-active-bg); /* 原来的选中背景色 */
  border-left: 2px solid var(--nav-active-border);
  border-radius: var(--radius);
}

/* 子目录选中（第二层及更深的 nav link） */
.md-nav__item .md-nav__item--active > .md-nav__link {
  background: #f8f8f8; /* 更浅的灰色 */
  border-left: none;   /* 去掉黑色边框 */
  box-shadow: inset 2px 0 4px rgba(0, 0, 0, 0.05); /* 浅阴影 */
  padding-left: 12px;  /* 缩进，让背景看起来窄一点 */
}


/* Hover state: soft, neutral */
.md-nav__link:hover,
.md-nav__link:focus {
  background: var(--c-hover);
  border-radius: var(--radius);
}

/* --- Links in content --- */
.md-typeset a {
  color: var(--c-link);
  text-decoration: none;
  border-bottom: 1px solid rgba(0,0,0,0.15);
}
.md-typeset a:hover {
  color: var(--c-link-hover);
  border-bottom-color: rgba(0,0,0,0.35);
  text-decoration: underline;
}

/* --- Code & code blocks: soft light theme --- */
.md-typeset code {
  background: #F8FAFC;
  color: #0F172A;             /* readable dark text */
  padding: 0.15em 0.4em;
  border: 1px solid var(--c-border);
  border-radius: 6px;
}
.md-typeset pre > code {
  display: block;
  background: #F8FAFC;
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 14px;
  overflow-x: auto;
}

/* Gentle syntax hints (neutral, low-saturation) */
.highlight .c    { color: #6B7280; } /* comments */
.highlight .k    { color: #0B7285; } /* keywords */
.highlight .s    { color: #0369A1; } /* strings */
.highlight .m    { color: #7C3AED; } /* numbers */
.highlight .na,
.highlight .nf   { color: #1E293B; } /* names */
.highlight .o    { color: #334155; } /* operators */

/* --- Search --- */
.md-search__form {
  background: #FFFFFF;
  border: 1px solid var(--c-border);
  border-radius: 10px;
}
.md-search__input { height: 40px; }

/* --- Tables & block elements --- */
.md-typeset table        { border-color: rgba(0,0,0,0.08); }
.md-typeset blockquote   { color: var(--c-muted); border-left: 3px solid var(--c-border); }
.md-typeset hr           { border-color: var(--c-border); }

/* --- Responsive tweaks --- */
@media (min-width: 1200px) {
  .md-content { padding-top: 6px; }            /* tighter header/content rhythm */
}
@media (max-width: 959px) {
  .md-typeset { font-size: 15.5px; }           /* a touch more compact on small screens */
  .md-search__input { height: 38px; }
}
