/* ==========================================================================
   【亮色模式】 Light Mode (scheme: default)
   ========================================================================== */
[data-md-color-scheme="default"] {
  --drake-bg: #ffffff;
  --drake-text: #304455;
  --drake-accent: #d63200;
  --drake-accent-rgb: 214, 50, 0;
  --drake-code-bg: #f6f8fa;
  --drake-border: #e1e4e8;

  --md-default-bg-color: var(--drake-bg);
  --md-default-fg-color: var(--drake-text);
  --md-accent-fg-color: var(--drake-accent);
  --md-code-bg-color: var(--drake-code-bg);
}

[data-md-color-scheme="default"] body {
  background-color: var(--drake-bg);
  background-image: none;
}

/* 引用块：带有主题色的极淡半透明背景 + 左侧实线 */
[data-md-color-scheme="default"] .md-typeset blockquote {
  color: var(--drake-text);
  background-color: rgba(var(--drake-accent-rgb), 0.05);
  border-left: 4px solid var(--drake-accent);
  padding: 10px 16px;
  border-radius: 4px;
  box-shadow: none;
  margin: 1.5em 0;
}
[data-md-color-scheme="default"] .md-typeset blockquote::after { display: none; }

/* 代码块（亮色）：保留 Mac 圆点，但不使用 frosted glass */
[data-md-color-scheme="default"] .md-typeset .highlight {
  background-color: var(--drake-code-bg) !important;
  border: 1px solid var(--drake-border);
  box-shadow: none;
  border-radius: 8px;
  margin: 1em 0;
  /* 给圆点留出顶部空间 */
  padding-top: 32px !important;
  position: relative;
}
[data-md-color-scheme="default"] .md-typeset .highlight::before {
  content: '';
  display: block;
  background: #fc625d;
  box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
  border-radius: 50%;
  left: 16px;
  width: 12px;
  height: 12px;
  position: absolute;
  top: 12px;
  z-index: 10;
}
[data-md-color-scheme="default"] .md-typeset pre { background: transparent !important; }

/* 表格（亮色） */
[data-md-color-scheme="default"] .md-typeset table:not([class]) {
  border: 1px solid var(--drake-border);
  background: transparent;
  display: inline-table;
}
[data-md-color-scheme="default"] .md-typeset table:not([class]) th {
  background-color: #f6f8fa;
  color: #24292e;
  border: 1px solid var(--drake-border);
  font-weight: bold;
}
[data-md-color-scheme="default"] .md-typeset table:not([class]) td {
  border: 1px solid var(--drake-border);
}

/* ==========================================================================
   【暗色模式】 Dark Mode (scheme: slate) - Drake Style (保留 frosted glass)
   ========================================================================== */
[data-md-color-scheme="slate"] {
  --drake-bg: rgb(26, 26, 26);
  --drake-text: rgba(255, 255, 255, 0.75);
  --drake-accent: #42B883;
  --drake-accent-rgb: 66, 184, 131;
  --drake-code-bg: rgba(36, 36, 36, 0.45); /* 透明度略调为 0.45，便于毛玻璃效果 */
  
  --md-default-bg-color: var(--drake-bg);
  --md-default-fg-color: var(--drake-text);
  --md-accent-fg-color: var(--drake-accent);
  --md-code-bg-color: var(--drake-code-bg);
  --md-code-fg-color: #A6ACCD;

  /* 让卡片透明以显示背景光晕 */
  --md-bg-color-secondary: transparent;
}

/* 背景光晕（暗色） */
[data-md-color-scheme="slate"] body {
  background: 
      linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.06) 30%, var(--drake-bg) 100%),
      radial-gradient(circle at 50% calc(90% + 200px), rgba(var(--drake-accent-rgb), 0.18) 0%, rgba(var(--drake-accent-rgb), 0.08) 20%, rgba(0,0,0,0.06) 50%, transparent 75%),
      radial-gradient(circle at 60% calc(70% + 200px), rgba(var(--drake-accent-rgb), 0.12) 0%, rgba(var(--drake-accent-rgb), 0.04) 25%, transparent 60%);
  background-attachment: fixed;
  background-color: var(--drake-bg);
}

/* 透明化容器以显示背景 */
[data-md-color-scheme="slate"] .md-main__inner,
[data-md-color-scheme="slate"] .md-content,
[data-md-color-scheme="slate"] .md-sidebar {
  background: transparent !important;
}

/* 顶部导航栏玻璃效果 */
[data-md-color-scheme="slate"] .md-header {
  background-color: rgba(26,26,26,0.22) !important;
  backdrop-filter: blur(10px) saturate(120%);
  -webkit-backdrop-filter: blur(10px) saturate(120%);
  border-bottom: 1px solid rgba(255,255,255,0.05);
}

/* 引用块（暗色风格） */
[data-md-color-scheme="slate"] .md-typeset blockquote {
  color: #EBEBEB99;
  background-color: rgba(var(--drake-accent-rgb), 0.04);
  padding: 16px 20px 16px 24px;
  border-radius: 8px;
  border-left: none;
  position: relative;
  box-shadow: 0 8px 22px rgba(0,0,0,0.06);
}
[data-md-color-scheme="slate"] .md-typeset blockquote::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 6px;
  height: 100%;
  background: var(--drake-accent);
  border-radius: 4px 0 0 4px;
}

/* 关键：暗色下的代码块保持透明毛玻璃效果 */
[data-md-color-scheme="slate"] .md-typeset .highlight {
  /* 半透明基底以显示背后 glow（保留 frosted glass） */
  background-color: rgba(36,36,36,0.45) !important;
  /* 毛玻璃效果 */
  -webkit-backdrop-filter: blur(12px) saturate(140%) contrast(0.98);
  backdrop-filter: blur(12px) saturate(140%) contrast(0.98);
  border-radius: 10px;
  margin: 1.5rem 0;
  padding-top: 36px !important; /* 留出顶部空间给三个小圆点 */
  position: relative;
  border: 1px solid rgba(255,255,255,0.06);
  color: var(--md-code-fg-color);
  box-shadow: 0 4px 18px rgba(0,0,0,0.6);
  overflow: hidden;
}

/* Mac 风格的红黄绿圆点（暗色） */
[data-md-color-scheme="slate"] .md-typeset .highlight::before {
  content: '';
  background: #fc625d;
  box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
  border-radius: 50%;
  left: 16px;
  width: 12px;
  height: 12px;
  position: absolute;
  top: 12px;
  z-index: 10;
}

/* 保证 pre 的背景透明，使 frosted 背景完整 */
[data-md-color-scheme="slate"] .md-typeset pre {
  background: transparent !important;
  margin: 0;
  padding: 0 1rem 1rem 1rem !important; /* 保持代码内部间距 */
}

/* 表格（暗色玻璃风） */
[data-md-color-scheme="slate"] .md-typeset table:not([class]) {
  background: transparent;
  border: 2px solid rgba(255,255,255,0.18);
  display: inline-table;
}
[data-md-color-scheme="slate"] .md-typeset table:not([class]) th {
  background-color: #242424;
  color: var(--drake-accent);
  border: 2px solid rgba(255,255,255,0.14);
}
[data-md-color-scheme="slate"] .md-typeset table:not([class]) td {
  border: 2px solid rgba(255,255,255,0.14);
}

/* Mermaid（仅暗色时强定制，保留对比与可读性） */
[data-md-color-scheme="slate"] .mermaid text,
[data-md-color-scheme="slate"] .mermaid tspan {
  fill: var(--drake-text) !important;
  font-family: "JetBrains Mono", sans-serif !important;
}
[data-md-color-scheme="slate"] .mermaid rect,
[data-md-color-scheme="slate"] .mermaid polygon,
[data-md-color-scheme="slate"] .mermaid circle.actor {
  fill: rgba(36,36,36,0.56) !important;
  stroke: rgba(255,255,255,0.22) !important;
  stroke-width: 2px !important;
  filter: drop-shadow(0 4px 10px rgba(0,0,0,0.3));
}

/* ========================================================================== */

/* 兼容性小提示：
   - 某些较老的浏览器/平台（如部分移动浏览器）对 backdrop-filter 支持不佳；
     若需完全兼容，请在样式中保留一个不使用 backdrop-filter 的回退（本文件已提供回退背景色）。
   - 若使用 MkDocs 的缓存/压缩插件，请清缓存后重新加载。
*/
code, pre, .md-code, .md-inline {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, "Roboto Mono", "Courier New", monospace;
  font-weight: 700; /* 改为 700 则显示粗体；可用值：100,200,...900，实际以可用字重为准 */
  /* 常用的标准属性（最易读） */
  font-variant-ligatures: contextual common-ligatures discretionary-ligatures;

  /* 各浏览器前缀 / 低级选项，启用常见 OpenType features */
  -webkit-font-feature-settings: "calt" 1, "liga" 1, "dlig" 1;
  -moz-font-feature-settings: "calt" 1, "liga" 1, "dlig" 1;
  font-feature-settings: "calt" 1, "liga" 1, "dlig" 1;

  /* 确保没有额外字距或 display 破坏连字 */
  letter-spacing: normal;
  display: inline; /* 如果主题把它改成 inline-block，尽量改回 inline */
}
/* --------------------------------------------------------- */
/* Header: center search box in navigation bar               */
/* --------------------------------------------------------- */
/* 使用绝对定位将搜索对话框居中，避免修改现有 flex 布局 */
.md-header__inner { position: relative; }
.md-search {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 20;
  /* 保持在合理宽度，移动端自动适配 */
  max-width: 450px;
  width: min(60%, 450px);
}
.md-search .md-search__button { width: 100%; display: block; }
/* 保持内部按钮与输入透明以只显示边框与毛玻璃 */
.md-search .md-search__button,
.md-search input,
.md-search input::placeholder {
  background: transparent !important;
  color: inherit !important;
}
.md-search .md-search__button { border: none; padding: 0; padding-left: 1.9rem; padding-right: 2.2rem; text-align: left; }

/* 统一：为搜索框添加毛玻璃与圆角（在亮/暗色主题下有配色差异） */
.md-search {
  border-radius: 12px;
  padding: 6px;
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  backdrop-filter: blur(14px) saturate(140%);
  border: 1px solid transparent;
}

[data-md-color-scheme="default"] .md-search {
  background-color: transparent;
  border-color: rgba(0,0,0,0.06);
}
[data-md-color-scheme="slate"] .md-search {
  background-color: transparent;
  border-color: rgba(255,255,255,0.06);
}

/* Search hover / focus effects */
.md-search {
  transition: transform 160ms cubic-bezier(.2,.9,.2,1), background-color 160ms ease, box-shadow 200ms ease, border-color 160ms ease;
  transform-origin: center center;
}

.md-search:hover,
.md-search:focus-within {
  transform: translate(-50%, -50%) scale(1.035);
}

[data-md-color-scheme="default"] .md-search:hover,
[data-md-color-scheme="default"] .md-search:focus-within {
  background-color: rgba(0,0,0,0.03);
  border-color: rgba(var(--drake-accent-rgb), 0.06);
  box-shadow: 0 8px 28px rgba(16,24,40,0.06);
}

[data-md-color-scheme="slate"] .md-search:hover,
[data-md-color-scheme="slate"] .md-search:focus-within {
  background-color: rgba(255,255,255,0.02);
  border-color: rgba(var(--drake-accent-rgb), 0.12);
  box-shadow: 0 10px 36px rgba(var(--drake-accent-rgb), 0.06);
}

/* Make inner input and button respond visually on hover/focus */
.md-search input:focus {
  outline: none;
}
.md-search .md-search__button:hover,
.md-search .md-search__button:focus {
  opacity: 1;
  transform: translateY(-1px);
}


/* --------------------------------------------------------- */
/* Tabs: center main navigation tabs under header            */
/* --------------------------------------------------------- */
.md-tabs {
  display: flex;
  justify-content: center;
  position: relative;
  top: 0px;
}
.md-tabs__list {
  display: flex;
  justify-content: center;
  gap: 1rem;
  padding: 0;
  margin: 0;
}
.md-tabs__item { list-style: none; }

/* Prevent vertical scrolling inside the nav area: ensure tabs don't create internal scrollbars */
.md-tabs,
.md-tabs__list,
.md-tabs__item,
.md-header {
  overflow-y: visible !important;
  overflow-x: visible !important;
  max-height: none !important;
}

.md-tabs__list {
  align-items: center; /* vertically center items to avoid unexpected wrapping/scroll */
}

@media (max-width: 768px) {
  .md-tabs__list {
    /* Remove horizontal scrolling on mobile; allow wrapping and center */
    justify-content: center;
    flex-wrap: wrap;
    overflow-x: visible; /* prevent scrollbar */
    -webkit-overflow-scrolling: unset;
    gap: 0.6rem;
    padding-left: 0;
  }
  .md-search { width: 80%; }
}

/* --------------------------------------------------------- */
/* Tabs frosted glass & make header transparent              */
/* --------------------------------------------------------- */
/* 全局：使顶部导航透明（覆盖主题默认背景），并给每个 tab 添加圆角毛玻璃样式 */
.md-header {
  background-color: transparent !important;
  border-bottom: none !important;
}

/* 基础样式：圆角、半透明背景与毛玻璃 */
.md-tabs__link {
  display: inline-block;
  padding: 0.3rem 0.6rem;
  border-radius: 10px;
  color: inherit;
  text-decoration: none;
  -webkit-backdrop-filter: blur(16px) saturate(160%);
  backdrop-filter: blur(16px) saturate(160%);
  transition: background-color 160ms ease, transform 120ms ease, box-shadow 160ms ease;
  border: 0.6px solid rgba(0,0,0,0.05);
  box-sizing: border-box;
  background-clip: padding-box;
  /* inset bottom line to ensure the rounded shape appears closed on all backgrounds */
  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.04) ;
}

/* Light scheme: 使用浅色半透明背景 + 细边框 */
[data-md-color-scheme="default"] .md-tabs__link {
  background-color: transparent;
  color: var(--md-default-fg-color);
  border-color: rgba(0,0,0,0.08);
  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.06);
}
[data-md-color-scheme="default"] .md-tabs__item--active .md-tabs__link,
[data-md-color-scheme="default"] .md-tabs__link--active {
  background-color: transparent;
  /* preserve inset bottom line while adding active elevation shadow */
  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.06), 0 10px 28px rgba(16,24,40,0.12);
}

/* Dark scheme: 使用深色半透明毛玻璃效果 */
[data-md-color-scheme="slate"] .md-tabs__link {
  background-color: transparent;
  color: rgba(255,255,255,0.92);
  border-color: rgba(255,255,255,0.12);
  box-shadow: inset 0 -1px 0 rgba(255,255,255,0.04);
}
[data-md-color-scheme="slate"] .md-tabs__item--active .md-tabs__link,
[data-md-color-scheme="slate"] .md-tabs__link--active {
  background-color: transparent;
  /* preserve inset bottom line while adding active elevation shadow */
  box-shadow: inset 0 -1px 0 rgba(255,255,255,0.04), 0 12px 32px rgba(0,0,0,0.8);
}

/* Hover / focus 效果 */
.md-tabs__link:hover, .md-tabs__link:focus {
  transform: translateY(-2px);
  opacity: 0.98;
}

/* 移动端：减小圆角与内边距，保留滚动 */
@media (max-width: 768px) {
  .md-tabs__link { border-radius: 3px; padding: 0.36rem 0.7rem; }
}

/* --------------------------------------------------------- */
/* Remove default underline / bottom rule under active tab   */
/* --------------------------------------------------------- */
/* 覆盖主题可能在 .md-tabs 或 .md-tabs__list 上设置的边框或伪元素 */
.md-tabs,
.md-tabs__list,
.md-tabs__item {
  border-bottom: none !important;
}
.md-tabs::after,
.md-tabs__list::after,
.md-tabs__link::after,
.md-tabs__link--active::after,
.md-tabs__item--active::after {
  display: none !important;
  content: none !important;
}

/* 如果主题使用 box-shadow 或 outline 作分隔，确保不显示明显白线 */
.md-tabs, .md-header {
  box-shadow: none !important;
}

/* --------------------------------------------------------- */
/* Palette toggle button frosted glass                       */
/* --------------------------------------------------------- */
.md-header__option .md-header__button {
  border-radius: 7px;
  -webkit-backdrop-filter: blur(16px) saturate(160%);
  backdrop-filter: blur(16px) saturate(160%);
  transition: background-color 160ms ease, transform 120ms ease, box-shadow 160ms ease;
  border: 0.6px solid rgba(0,0,0,0.05);
  background-color: transparent;
}

[data-md-color-scheme="default"] .md-header__option .md-header__button {
  border-color: rgba(0,0,0,0.08);
}

[data-md-color-scheme="slate"] .md-header__option .md-header__button {
  border-color: rgba(255,255,255,0.12);
}

.md-header__option .md-header__button:hover,
.md-header__option .md-header__button:focus {
  transform: translateY(-2px);
  opacity: 0.98;
}

