html {
  scroll-padding-top: 90px; /* 顶部固定导航高度 */
}

.floating-sidebar-container {
  position: fixed;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  z-index: 9999;
  display: flex;
  align-items: center;
}

/* 展开/折叠按钮 */
.floating-sidebar-container .nav-toggle {
  background-color: #007bff;
  color: white;
  border: none;
  padding: 14px 8px; /* 上下增加，左右减?*/
  cursor: pointer;
  font-size: 18px; /* 可以保持不变，或者适当调小如果文字太挤 */
  border-radius: 8px 0 0 8px;
  margin-right: 2px;
  transition: background-color 0.3s;
  /* 可以尝试调整字体大小，如果调整padding后文字显得拥?*/
  /* font-size: 16px; */
}

.refresh-button {
  padding: 6px 10px;
  font-size: 12px;
  background-color: #f0f0f0;  /* 改为浅灰色背?*/
  color: #333;                /* 深色字体 */
  border: 1px solid #ccc;
  border-radius: 4px;
  cursor: pointer;
  white-space: nowrap;
  transition: background-color 0.2s;
}

.refresh-button:hover {
  background-color: #007bff;  /* 悬停时才蓝色 */
  color: white;
}



.floating-sidebar-container .nav-toggle:hover {
  background-color: #0056b3;
}

/* 整体侧边栏：左导?+ 右设?*/
.floating-sidebar {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  background: #ffffffee;
  border: 1px solid #ccc;
  border-radius: 8px 0 0 8px;
  box-shadow: -1px 1px 6px rgba(0, 0, 0, 0.1);
  padding: 10px 12px;
  gap: 16px;
  transition: max-width 0.3s ease, opacity 0.3s ease;
  max-width: 360px;
  font-size: 13px;
}

/* 左栏主导航：单列 */
.floating-sidebar .nav-links {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.floating-sidebar .nav-links a {
	
	font-size: 12px;       /* 统一字体大小，调小一?*/
  line-height: 1.48;      /* 统一行高，保证高度一?*/
  text-decoration: none;
  color: #007bff;
  background: #e9f5ff;
  padding: 4px 8px;
  border-radius: 4px;
 
  transition: background-color 0.2s;
  white-space: nowrap;
}

.floating-sidebar .nav-links a:hover,
.floating-sidebar .nav-links a.active {
  background-color: #007bff;
  color: white;
}

/* 右侧设置?*/
.effect-selectors-container {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 12px;
  max-width: 120px;
}

/* 子导航链接（例如旁路由等?*/
.effect-selectors-container .sub-nav-links {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.effect-selectors-container .sub-nav-links a {
  text-decoration: none;
  color: #007bff;
  background: #f2f9ff;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  transition: background-color 0.2s;
  white-space: nowrap;
}

.effect-selectors-container .sub-nav-links a:hover {
  background-color: #007bff;
  color: white;
}

/* 所有选择框样?*/
.effect-selectors-container select {
  min-width: 130px;
  max-width: 160px;
  padding: 4px 30px 4px 8px;
  box-sizing: border-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  border-radius: 4px;
  border: 1px solid #ccc;
  appearance: none;
  background: white url('data:image/svg+xml;utf8,<svg fill="%23777" height="16" viewBox="0 0 24 24" width="16" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>') no-repeat right 8px center;
  background-size: 14px 14px;
  cursor: pointer;
}



.effect-selectors-container select:hover,
.effect-selectors-container select:focus {
  border-color: #007bff;
  outline: none;
  box-shadow: 0 0 4px rgba(0, 123, 255, 0.4);
}

/* 折叠状态隐?*/
.floating-sidebar-container.collapsed .floating-sidebar {
  display: none;
}
/* 实时搜索框容?*/
.floating-sidebar .search-in-nav {
    margin-top: 10px; /* 与上方链接的间距 */
    padding-top: 10px; /* 内部上边?*/
    border-top: 1px solid #ddd; /* 分隔?*/
}

/* 实时搜索输入?*/
.floating-sidebar .search-in-nav #realtimeSearchInput {
    width: calc(100% - 16px); /* 宽度适应父容器，减去padding */
    padding: 6px 8px;
    border: 1px solid #007bff; /* 边框颜色与导航链接呼?*/
    border-radius: 4px;
    font-size: 12px;
    box-sizing: border-box; /* 包含padding和border在宽度内 */
}

.floating-sidebar .search-in-nav #realtimeSearchInput::placeholder {
    color: #999;
}

.floating-sidebar .search-in-nav #realtimeSearchInput:focus {
    outline: none;
    border-color: #0056b3;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

/* 原有的高亮样?*/
.highlight {
    background-color: yellow !important; /* <--- 在这里添?!important */
    color: black !important;             /* <--- 确保文本颜色也受?*/
    font-weight: bold !important;        /* <--- 可选：加粗也添?*/
}

/* 当前选中的高亮样?*/
.highlight.current-match {
    background-color: orange !important; /* <--- 橙色也添?*/
    color: white !important;             /* <--- 确保文本颜色也受?*/
    /* 您可以根据需要添加其他样式，例如?*/
    /* border: 2px solid blue !important; */
    /* box-shadow: 0 0 8px rgba(0, 0, 255, 0.5) !important; */
}

/* 搜索框容器，需要设置为相对定位，以便内部的清除按钮可以绝对定位 */
.floating-sidebar .search-in-nav {
    position: relative; /* 添加此行 */
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #ddd;
}

/* 清空搜索按钮 */
.clear-search-button {
    position: absolute; /* 绝对定位 */
    right: 8px; /* 距离右侧 */
    top: 50%; /* 垂直居中 */
    transform: translateY(-50%); /* 精确垂直居中 */
    background: none; /* 无背?*/
    border: none; /* 无边?*/
    color: #999; /* 颜色 */
    font-size: 14px; /* 字体大小 */
    cursor: pointer; /* 鼠标悬停显示手型 */
    padding: 0 4px; /* 内部填充 */
    line-height: 1; /* 行高 */
    display: none; /* 默认隐藏 */
    z-index: 10; /* 确保在搜索框之上 */
}

.clear-search-button:hover {
    color: #333; /* 鼠标悬停时颜色变?*/
}

/* 搜索导航按钮容器 */
.search-in-nav .search-nav-buttons {
    display: flex; /* 让按钮并排显?*/
    gap: 5px; /* 按钮之间间隔 */
    margin-top: 5px; /* 与搜索框的间?*/
    justify-content: flex-end; /* 按钮靠右对齐 */
    position: relative; /* 确保定位上下?*/
    z-index: 10; /* 确保在其他内容之?*/
	
}

/* 搜索导航按钮（上一?下一个）公共样式 */
.search-nav-button {
    background-color: #f0f0f0; /* 浅灰色背?*/
    color: #333; /* 深色字体 */
    border: 1px solid #ccc; /* 边框 */
    border-radius: 4px; /* 圆角 */
    padding: 4px 8px; /* 填充 */
    font-size: 12px; /* 字体大小 */
    cursor: pointer; /* 鼠标手型 */
    transition: background-color 0.2s, border-color 0.2s; /* 过渡效果 */
    white-space: nowrap; /* 防止文本换行 */
    flex-grow: 1; /* 让按钮弹性伸缩，平分空间 */
	 
}




.search-nav-button:hover {
    background-color: #e0e0e0; /* 鼠标悬停时颜色变?*/
    border-color: #bbb;
}

/* 禁用状?*/
.search-nav-button:disabled {
    opacity: 0.5; /* 半透明 */
    cursor: not-allowed; /* 禁用鼠标样式 */
    background-color: #f8f8f8; /* 禁用背景?*/
    border-color: #eee;
}

/* 清除所有输入按钮的样式 */
.clear-all-inputs-button {
    /* 继承 nav-links 内部按钮的通用样式 */
    padding: 6px 10px; /* 根据你其他按钮的样式调整 */
    font-size: 12px;    /* 根据你其他按钮的样式调整 */
    background-color: #f0f0f0; /* 浅灰色背?*/
    color: #333;             /* 深色字体 */
    border: 1px solid #ccc;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s, border-color 0.3s; /* **确保有这一?*，让高亮平滑过渡 */
    white-space: nowrap; /* 防止按钮文本换行 */
}

.clear-all-inputs-button:hover {
    background-color: #007bff;  /* 悬停时才蓝色 */
    color: white;
}

/* 使用 ::before 伪元素添加图?*/
.clear-all-inputs-button::before {
    content: "🧹"; /* 扫帚符号 (或你选择的任何其他符? */
    margin-right: 5px; /* 图标与文本之间的间距 */
}
