user-help-docs/assets/stylesheets/extra.css

abbr[title] {
  border-bottom: 1px dotted;
  cursor: help;
  position: relative;
}

abbr[title]::after {
  content: attr(title);
  position: absolute;
  left: 0;
  bottom: 125%;
  background-color: #ffffff;   /* 白色背景 */
  color: #1B85E3;              /* 腾讯蓝字体 */
  padding: 3px 6px;            /* 调整内边距，使弹窗小巧 */
  border-radius: 4px;
  white-space: nowrap;
  font-size: 12px;             /* 字体变小 */
  line-height: 1.2;            /* 行高紧凑 */
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s;
  z-index: 100;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

abbr[title]:hover::after {
  opacity: 1;
}
/* =========================
   全局主题颜色修改为 #0183fa
   ========================= */

/* 导航栏菜单文字 */
.md-header-nav__link,
.md-header-nav__link:hover,
.md-header-nav__link--active {
  color: #0183fa !important;
}

/* 所有章节标题 H1-H6 */
.md-content h1,
.md-content h2,
.md-content h3,
.md-content h4,
.md-content h5,
.md-content h6 {
  color: #0183fa !important;
}

/* 底部 footer */
.custom-footer {
  color: #0183fa !important;
}

/* 如果 footer 内有链接，也改颜色 */
.custom-footer a {
  color: #0183fa !important;
  text-decoration: none;
}
.custom-footer a:hover {
  text-decoration: underline;
}
/* =========================
   右侧目录选中条目颜色
   ========================= */
.md-nav--secondary .md-nav__link--active {
  color: #0183fa !important;       /* 文字颜色 */
  font-weight: 600;                /* 加粗显示，可选 */
}

/* 鼠标悬停右侧目录条目颜色 */
.md-nav--secondary .md-nav__link:hover {
  color: #0183fa !important;
}


/* =====================================
   顶部 Tabs：选中项文字变蓝（无下划线）
   ===================================== */

/* 当前激活的 Tab 文本 */
.md-tabs__item--active > .md-tabs__link {
  color: #0183FA !important;
  font-weight: 600;
}

/* Hover 状态也统一为蓝色 */
.md-tabs__link:hover {
  color: #0183FA;
}

/* ❌ 移除默认的底部横线 */
.md-tabs__item--active .md-tabs__link::after {
  display: none !important;
}

/* 有些版本是 border-bottom 方式，也一并清掉 */
.md-tabs__item--active .md-tabs__link {
  border-bottom: none !important;
}
/* =====================================
   左侧导航（Sidebar）选中 & Hover 蓝色化
   ===================================== */

/* 1️⃣ 当前页面（选中态，最关键） */
.md-nav__link--active {
  color: #0183FA !important;
  font-weight: 600;
}

/* 2️⃣ 当前展开的父级节点 */
.md-nav__item--active > .md-nav__link {
  color: #0183FA !important;
}

/* 3️⃣ 鼠标 Hover（覆盖默认的 accent 紫色） */
.md-nav__link:hover {
  color: #0183FA !important;
}

/* 4️⃣ 左侧折叠/展开箭头 */
.md-nav__item--active > .md-nav__link .md-nav__icon,
.md-nav__link:hover .md-nav__icon {
  color: #0183FA;
}

/* 5️⃣ 防止 Material 用 accent 色反向覆盖 */
.md-nav__link:focus {
  color: #0183FA !important;
}

:root { --system-primary: #0183FA; }

/* “更多”作为 tab 项在最右侧 */
.md-tabs__item--more{
  margin-left: auto;
  position: relative;
  display: flex;
  align-items: stretch; /* 让内部能撑满 tab 行高度 */
}

/* 关键：按钮撑满 tab 行高度 + flex 垂直居中 + 去基线影响 */
.md-tabs__more-link{
  height: 100% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 12px !important;
  line-height: 0 !important;        /* ✅ 防止贴底 */
  border: 0 !important;
  background: transparent !important;

  cursor: pointer !important;
  pointer-events: auto !important;  /* ✅ 确保可点 */
}

/* 三角本体 */
.md-tabs__more-triangle{
  display: block;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 10px solid var(--system-primary);
}

/* 下拉面板（JS 用 style.display 控制显示） */
.md-tabs__item--more .md-tabs__more-panel{
  position: absolute;
  right: 0;
  top: 100%;
  margin-top: 6px;

  min-width: 240px;
  max-width: 420px;
  max-height: 60vh;
  overflow: auto;
  padding: 6px;

  display: none;
  z-index: 9999;

  background: #fff;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 10px;
  box-shadow: 0 10px 30px rgba(0,0,0,.18);
}

[data-md-color-scheme="slate"] .md-tabs__item--more .md-tabs__more-panel{
  background:#1e1e1e;
  border-color: rgba(255,255,255,.12);
}

/* 面板条目 */
.md-tabs__more-item{
  display:block;
  padding: 8px 10px;
  border-radius: 8px;
  text-decoration:none;
  color: inherit;
  white-space: nowrap;
}
.md-tabs__more-item:hover{
  color: var(--system-primary);
  background: rgba(1,131,250,0.08);
}
.md-tabs__more-item.is-active{
  color: var(--system-primary);
  font-weight: 600;
  background: rgba(1,131,250,0.10);
}

:root { --system-primary: #0183FA; }

/* 让整个 Tabs 行按 flex 布局，垂直居中所有 tab */
.md-tabs__list{
  display: flex !important;
  align-items: center !important;   /* ✅ 关键：整体垂直居中 */
}

/* 每个 tab 项也用 flex，避免基线对齐把内容压到底 */
.md-tabs__item{
  display: flex !important;
  align-items: center !important;
}

/* “更多”tab 放最右侧 */
.md-tabs__item--more{
  margin-left: auto !important;
}

/* 更多按钮：去掉基线影响，保证居中 */
.md-tabs__more-link{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 12px !important;

  line-height: 1 !important;        /* ✅ 不要用 0，0 在某些字体下会贴底 */
  border: 0 !important;
  background: transparent !important;
  cursor: pointer !important;
}

/* 实心蓝色倒三角 */
.md-tabs__more-triangle{
  display: block;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 10px solid var(--system-primary);
}
/* 防止第 10 个 tab 露出一截：Tabs 行裁剪 */
.md-tabs__list{
  overflow: hidden !important;
}