/* ============================================================
 * 顶部导航 - 复刻 yutu.cn 风格（v5：自适应栏数版）
 * 变更：下拉面板改为自适应栏数，有几个分类排几栏，右侧不留空白
 * ============================================================ */
/* ---------- 1. 导航条整体：深色背景 ---------- */
@media (min-width: 992px) {
  .site-header {
    background-color: #313131 !important;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .3) !important;
    color: #ebebeb !important;
  }
  .site-header .navbar {
    height: 60px;
  }
  /* ---------- 2. 一级菜单项：白字 + 悬停亮灰 ---------- */
  .site-header .navbar .nav-list > .menu-item > a {
    color: #ebebeb !important;
    font-size: 14px;
    font-weight: 400;
    padding: 0 16px;
    height: 60px;
    line-height: 60px;
    margin: 0;
    display: inline-block;
    transition: background-color .3s;
  }
  .site-header .navbar .nav-list > .menu-item {
    height: 60px;
    line-height: 60px;
    position: static;
  }
  .site-header .navbar .nav-list > .menu-item:hover {
    background-color: #515151;
  }
  .site-header .navbar .nav-list > .menu-item:hover > a {
    color: #ffffff !important;
  }
  .site-header .navbar .nav-list > .menu-item.current-menu-item,
  .site-header .navbar .nav-list > .menu-item.current-menu-parent,
  .site-header .navbar .nav-list > .menu-item.current-menu-ancestor {
    background-color: #515151;
  }
  .site-header .navbar .nav-list > .menu-item.current-menu-item > a,
  .site-header .navbar .nav-list > .menu-item.current-menu-parent > a,
  .site-header .navbar .nav-list > .menu-item.current-menu-ancestor > a {
    color: #ffffff !important;
    font-weight: 600;
  }
  /* ---------- 3. 下拉箭头 ---------- */
  .site-header .navbar .nav-list > .menu-item.menu-item-has-children > a:after {
    content: "";
    display: inline-block;
    position: relative;
    top: -3px;
    margin-left: 6px;
    padding: 3px;
    border: solid #ebebeb;
    border-width: 0 1px 1px 0;
    transform: rotate(45deg);
    font-family: inherit;
    font-size: 0;
    transition: transform .3s, top .3s;
  }
  .site-header .navbar .nav-list > .menu-item.menu-item-has-children:hover > a:after {
    top: 1px;
    transform: rotate(-135deg);
  }
  /* ---------- 4. 巨型下拉面板（v2：居中固定宽度 + 收紧） ---------- */
  .site-header .navbar .nav-list > .menu-item.menu-item-has-children {
    position: static;
  }
  .site-header .navbar .nav-list > .menu-item > .sub-menu {
    position: absolute !important;
    /* 居中显示，宽度自适应内容，最大 900px */
    left: 50% !important;
    right: auto !important;
    top: 60px !important;
    transform: translateX(-50%) !important;
    width: auto !important;
    max-width: 95vw !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 14px 22px !important;
    background: #fff !important;
    border: none !important;
    border-radius: 0 0 4px 4px !important;
    box-shadow: 0 3px 6px 0 rgba(40, 40, 40, .3) !important;
    opacity: 0;
    visibility: hidden;
    max-height: 0;
    overflow: hidden;
    transition: opacity .3s, visibility .3s;
    display: grid !important;
    /* 4 栏，栏距 28px */
    grid-template-columns: repeat(auto-fit, minmax(88px, max-content));
    gap: 4px 14px;
    box-sizing: border-box;
    z-index: 999;
  }
  .site-header .navbar .nav-list > .menu-item:hover > .sub-menu {
    opacity: 1 !important;
    visibility: visible !important;
    max-height: 600px;
    transform: translateX(-50%) !important;
  }
  /* ---------- 5. 面板内部：收紧间距 ---------- */
  /* 二级分类（格子） */
  .site-header .navbar .nav-list > .menu-item > .sub-menu > .menu-item {
    display: block !important;
    padding: 6px 0 10px 0 !important;
    position: relative;
    height: auto !important;
    line-height: 1.4 !important;
  }
  /* 二级分类标题：加粗黑字，紧凑 */
  .site-header .navbar .nav-list > .menu-item > .sub-menu > .menu-item > a {
    display: inline-block !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #333 !important;
    padding: 0 0 5px 0 !important;
    line-height: 1.3 !important;
    margin: 0 0 6px 0 !important;
    border-bottom: 1px solid #f0f0f0;
    height: auto !important;
  }
  .site-header .navbar .nav-list > .menu-item > .sub-menu > .menu-item > a:hover {
    color: #f3793d !important;
  }
  .site-header .navbar .nav-list > .menu-item > .sub-menu > .menu-item > a:after {
    display: none !important;
  }
  /* 三级分类：竖排列表，行距收紧 */
  .site-header .navbar .nav-list > .menu-item > .sub-menu > .menu-item > .sub-menu {
    position: static !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    box-shadow: none !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-height: none !important;
  }
  .site-header .navbar .nav-list > .menu-item > .sub-menu > .menu-item > .sub-menu > .menu-item {
    display: block !important;
    padding: 0 !important;
    margin: 0 0 3px 0 !important;
    height: auto !important;
    line-height: 1.6 !important;
  }
  .site-header .navbar .nav-list > .menu-item > .sub-menu > .menu-item > .sub-menu > .menu-item > a {
    display: inline-block !important;
    font-size: 13px !important;
    color: #666 !important;
    padding: 0 !important;
    line-height: 1.6 !important;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-radius: 0;
    height: auto !important;
    background: transparent !important;
  }
  .site-header .navbar .nav-list > .menu-item > .sub-menu > .menu-item > .sub-menu > .menu-item > a:hover {
    color: #f3793d !important;
    background: transparent !important;
  }
  .site-header .navbar .nav-list > .menu-item > .sub-menu .menu-item-has-children > a:after {
    display: none !important;
  }
  /* ---------- 6. 右侧按钮区：白色圆底，图标清晰可见 ---------- */
  /* 所有 actions 内的图标按钮，统一加白色半透明圆底 */
  .site-header .navbar .actions > a,
  .site-header .navbar .actions > span,
  .site-header .navbar .actions > li {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, .92) !important;
    border-radius: 50% !important;
    width: 34px !important;
    height: 34px !important;
    padding: 0 !important;
    margin-left: 8px !important;
    transition: background .25s, transform .25s;
    overflow: hidden;
    flex: 0 0 auto;
  }
  /* 悬停：变纯白 + 轻微放大 */
  .site-header .navbar .actions > a:hover,
  .site-header .navbar .actions > span:hover,
  .site-header .navbar .actions > li:hover {
    background: #ffffff !important;
    transform: scale(1.06);
  }
  /* SVG 图标：限制尺寸，居中 */
  .site-header .navbar .actions svg {
    width: 18px !important;
    height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
    margin: 0 !important;
  }
  /* VIP 那个长条 SVG 单独处理：用胶囊形而不是圆形 */
  .site-header .navbar .actions > a[title*="VIP"] {
    width: auto !important;
    min-width: 64px !important;
    height: 30px !important;
    border-radius: 15px !important;
    padding: 0 8px !important;
  }
  .site-header .navbar .actions > a[title*="VIP"] svg {
    width: 52px !important;
    height: 20px !important;
    max-width: 52px !important;
    max-height: 20px !important;
  }
  /* ---------- 登录按钮（未登录状态）：白色胶囊底 + 深色文字 ---------- */
  .site-header .navbar .actions a.login-link,
  .site-header .navbar .actions a.bookmarkBtn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    width: auto !important;
    min-width: 0 !important;
    height: 32px !important;
    padding: 0 14px 0 10px !important;
    margin-left: 8px !important;
    border-radius: 16px !important;
    background: #ffffff !important;
    border: none !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .15) !important;
    overflow: visible !important;
    transform: none !important;
    transition: background .25s, transform .25s !important;
  }
  .site-header .navbar .actions a.login-link:hover,
  .site-header .navbar .actions a.bookmarkBtn:hover {
    background: #f0f0f0 !important;
    transform: translateY(-1px) !important;
  }
  /* 图标容器：正常尺寸，不隐藏 */
  .site-header .navbar .actions a.login-link .IconContainer,
  .site-header .navbar .actions a.bookmarkBtn .IconContainer {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    /* 强制正圆：宽高相等 + 50% 圆角 */
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
    border-radius: 50% !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    transition: none !important;
  }
  /* 禁止悬停时把图标容器拉宽（这是变椭圆的元凶） */
  .site-header .navbar .actions a.login-link:hover .IconContainer,
  .site-header .navbar .actions a.bookmarkBtn:hover .IconContainer {
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    height: 22px !important;
    border-radius: 50% !important;
    transition: none !important;
  }
  .site-header .navbar .actions a.login-link .IconContainer svg,
  .site-header .navbar .actions a.bookmarkBtn .IconContainer svg {
    width: 13px !important;
    height: 13px !important;
    max-width: 13px !important;
    max-height: 13px !important;
    margin: 0 !important;
    display: block !important;
  }
  /* 图标填充改为深色，白底上清晰可见 */
  .site-header .navbar .actions a.login-link .IconContainer svg path,
  .site-header .navbar .actions a.bookmarkBtn .IconContainer svg path {
    fill: #333333 !important;
  }
  /* 「登录」文字：深色、正常显示，禁止被隐藏 */
  .site-header .navbar .actions a.login-link .text,
  .site-header .navbar .actions a.bookmarkBtn .text,
  .site-header .navbar .actions a.login-link p2,
  .site-header .navbar .actions a.bookmarkBtn p2 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    height: 32px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 32px !important;
    color: #333333 !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    overflow: visible !important;
    vertical-align: middle !important;
    float: none !important;
    position: static !important;
    top: auto !important;
    bottom: auto !important;
  }
  /* 图标容器与文字垂直对齐 */
  .site-header .navbar .actions a.login-link .IconContainer,
  .site-header .navbar .actions a.bookmarkBtn .IconContainer {
    vertical-align: middle !important;
    position: static !important;
    top: auto !important;
  }
  /* 纯文字按钮（如已登录的登录样式）保持蓝色胶囊 */
  .site-header .navbar .actions .action-btn.login-btn {
    width: auto !important;
    height: auto !important;
    border-radius: 20px !important;
    padding: .35rem .9rem !important;
    color: #fff !important;
    background: linear-gradient(135deg, #3b6ff5, #325ed0) !important;
  }
  /* Logo 文字适配 */
  .site-header .navbar .logo-wrapper .logo.text {
    color: #ffffff !important;
  }
}
/* ---------- 7. 移动端不受影响 ---------- */
@media (max-width: 991.98px) {
  .site-header {
    background-color: #313131 !important;
  }
  .site-header .navbar .logo-wrapper .logo.text {
    color: #ffffff !important;
  }
  .site-header .navbar .actions > a,
  .site-header .navbar .actions > span,
  .site-header .navbar .actions > li {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, .92) !important;
    border-radius: 50% !important;
    width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
    overflow: hidden;
  }
  .site-header .navbar .actions svg {
    width: 17px !important;
    height: 17px !important;
    max-width: 17px !important;
    max-height: 17px !important;
  }
  /* 移动端登录按钮同样白底深字 */
  .site-header .navbar .actions a.login-link,
  .site-header .navbar .actions a.bookmarkBtn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    width: auto !important;
    height: 30px !important;
    padding: 0 10px 0 8px !important;
    border-radius: 15px !important;
    background: #ffffff !important;
  }
  .site-header .navbar .actions a.login-link .text,
  .site-header .navbar .actions a.bookmarkBtn .text,
  .site-header .navbar .actions a.login-link p2,
  .site-header .navbar .actions a.bookmarkBtn p2 {
    color: #333333 !important;
    font-size: 12px !important;
    display: inline-block !important;
    width: auto !important;
  }
  .site-header .navbar .actions a.login-link .IconContainer svg path,
  .site-header .navbar .actions a.bookmarkBtn .IconContainer svg path {
    fill: #333333 !important;
  }
  /* 移动端图标容器同样保持正圆 */
  .site-header .navbar .actions a.login-link .IconContainer,
  .site-header .navbar .actions a.bookmarkBtn .IconContainer,
  .site-header .navbar .actions a.login-link:hover .IconContainer,
  .site-header .navbar .actions a.bookmarkBtn:hover .IconContainer {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    border-radius: 50% !important;
    transition: none !important;
  }
}
/* ============================================================
 * 分类筛选栏 - 选中态可读性修复
 * 问题：主题自带 .filter-link.active>a { color: var(--is-element) !important }
 *       主色与选中背景撞色，文字看不清
 * 方案：显式指定选中态文字色 + 背景色，覆盖主题变量
 * ============================================================ */
/* ---------- 筛选区整体：浅灰圆角卡片 ---------- */
.filter-warp {
  background: #f7f8fa !important;
  border-radius: 12px !important;
  padding: 8px 0 !important;
  margin: 16px 0 !important;
}
.filter-warp .container {
  padding: 0 20px !important;
}
/* ---------- 每一行：横向流式排列 ---------- */
.filter-warp .filter-item {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 8px 0 !important;
  border-bottom: 1px dashed #ececec !important;
}
.filter-warp .filter-item:last-child {
  border-bottom: none !important;
}
/* ---------- 前缀（分类：/ 大类名 / 内容：）---------- */
.filter-warp .filter-item .filter-name {
  flex: 0 0 auto !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #333333 !important;
  margin: 0 18px 0 0 !important;
  padding: 4px 0 !important;
  white-space: nowrap !important;
}
/* ---------- 未选中：深灰文字，无底色 ---------- */
.filter-warp .filter-item .filter-link {
  margin: 0 10px 0 0 !important;
  padding: 0 !important;
}
.filter-warp .filter-item .filter-link > a {
  display: inline-block !important;
  font-size: 14px !important;
  color: #444444 !important;
  background: transparent !important;
  padding: 4px 12px !important;
  border-radius: 16px !important;
  line-height: 1.5 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: color .2s, background .2s !important;
}
/* 去掉主题的下划线动效，避免干扰 */
.filter-warp .filter-item .filter-link > a::after {
  display: none !important;
  content: none !important;
}
/* 悬停：橙色文字，无底色 */
.filter-warp .filter-item .filter-link:hover > a {
  color: #f3793d !important;
  background: transparent !important;
}
/* ---------- 选中：浅橙底 + 深橙字（关键修复）---------- */
.filter-warp .filter-item .filter-link.active > a,
.filter-warp .filter-item .filter-link.active > a:hover,
.filter-warp .filter-item .filter-link.active > a:focus {
  color: #d9600f !important;
  background: #ffe8d6 !important;
  font-weight: 600 !important;
  border-radius: 16px !important;
  padding: 4px 12px !important;
}
/* 选中项里的文章数量徽标 */
.filter-warp .filter-item .filter-link > a span,
.filter-warp .filter-item .filter-link > a em,
.filter-warp .filter-item .filter-link > a .badge {
  color: #999999 !important;
  font-size: 12px !important;
  font-style: normal !important;
  margin-left: 3px !important;
  background: transparent !important;
}
.filter-warp .filter-item .filter-link.active > a span,
.filter-warp .filter-item .filter-link.active > a em,
.filter-warp .filter-item .filter-link.active > a .badge {
  color: #d9600f !important;
}
/* ---------- 移动端适配 ---------- */
@media (max-width: 768px) {
  .filter-warp .filter-item {
    padding: 6px 0 !important;
  }
  .filter-warp .filter-item .filter-name {
    font-size: 13px !important;
    margin-right: 10px !important;
  }
  .filter-warp .filter-item .filter-link > a {
    font-size: 13px !important;
    padding: 3px 10px !important;
  }
}

/* ============================================================
 * 隐藏分类页顶部标题横幅（当前分类名大标题区）
 * 结构：.archive-hero（深色背景图 + .archive-title 分类名）
 * 只隐藏归档页（分类/标签），不影响首页和其他页面
 * ============================================================ */
body.archive .archive-hero {
  display: none !important;
}

/* ============================================================
 * 隐藏筛选栏前缀旁的图标（分类/筛选小图标）
 * 结构：<li class="filter-name"><i class="fa-duotone fa-layer-group"></i>分类</li>
 * ============================================================ */
.filter-warp .filter-item .filter-name > i,
.filter-warp .filter-item .filter-name > svg,
.filter-warp .filter-item .filter-name > .icon {
  display: none !important;
}
/* 图标隐藏后，前缀文字左侧留白归零 */
.filter-warp .filter-item .filter-name {
  padding-left: 0 !important;
  margin-left: 0 !important;
}

/* ============================================================
 * 隐藏顶部菜单项右侧的下拉箭头（悬停时看起来像斜杠）
 * 结构：.menu-item-has-children > a:after（45deg 旋转的边框箭头）
 * ============================================================ */
@media (min-width: 992px) {
  .site-header .navbar .nav-list > .menu-item.menu-item-has-children > a:after,
  .site-header .navbar .nav-list > .menu-item.menu-item-has-children:hover > a:after {
    display: none !important;
    content: none !important;
  }
}

/* ============================================================
 * 会员套餐卡片 - 修复重复显示
 * 问题：.widget-slider 使用 owl-carousel 且 loop:true，
 *       套餐条目少时（2条）会自动复制填充，导致卡片重复出现
 * 方案：套餐卡片区改为普通 flex 网格，不再走轮播复制
 * ============================================================ */
/* 套餐卡片容器：整体居中 */
.card-body .widget-slider.owl-carousel {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
  justify-content: center !important;
  align-items: stretch !important;
  width: 100% !important;
  margin: 0 auto !important;
}
/* 轨道整体居中：覆盖 owl JS 设置的固定宽度和左对齐 */
.card-body .widget-slider.owl-carousel .owl-stage-outer {
  width: 100% !important;
  margin: 0 auto !important;
}
.card-body .widget-slider.owl-carousel .owl-stage {
  display: flex !important;
  width: 100% !important;
  margin: 0 auto !important;
  justify-content: center !important;
  gap: 20px !important;
  transform: none !important;
  left: 0 !important;
}
/* owl-item 同步：一半减去间隙 */
.card-body .widget-slider.owl-carousel .owl-item {
  width: calc(50% - 10px) !important;
  max-width: calc(50% - 10px) !important;
  flex: 0 0 calc(50% - 10px) !important;
  margin: 0 !important;
}
/* 关闭 owl 的舞台/轨道结构影响 */
.card-body .widget-slider.owl-carousel .owl-stage-outer,
.card-body .widget-slider.owl-carousel .owl-stage,
.card-body .widget-slider.owl-carousel .owl-item {
  display: contents !important;
}
/* 隐藏 owl 的导航点和箭头（不再需要轮播） */
.card-body .widget-slider.owl-carousel .owl-nav,
.card-body .widget-slider.owl-carousel .owl-dots {
  display: none !important;
}
/* 每张卡片：占满所在轨道（轨道已是一半宽），卡片宽度翻倍 */
.card-body .widget-slider.owl-carousel .price-card {
  flex: 1 1 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}
/* 隐藏 owl 克隆出来的重复卡片 */
.card-body .widget-slider.owl-carousel .owl-item.cloned {
  display: none !important;
}
@media (max-width: 768px) {
  .card-body .widget-slider.owl-carousel {
    justify-content: center !important;
  }
  .card-body .widget-slider.owl-carousel .price-card,
  .card-body .widget-slider.owl-carousel .owl-item {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ============================================================
 * 右上角头像下拉菜单 - 菜单项圆角美化
 * 结构：.action-hover-menu > .hover-warp
 *       > .hover-warp .hover-item（菜单项容器）
 *       > .hover-warp a（后台管理/退出登录/我的推广等）
 * ============================================================ */
/* 下拉面板：确保圆角裁切生效 */
.action-hover-menu .hover-warp {
  border-radius: 16px !important;
  overflow: hidden !important;
}
/* 菜单项容器：左右留边，让圆角背景不贴边 */
.action-hover-menu .hover-warp .hover-item {
  padding: 4px 10px !important;
  margin: 0 !important;
}
/* 菜单项链接：圆角 + 悬停圆角背景 */
.action-hover-menu .hover-warp .hover-item > a,
.action-hover-menu .hover-warp .hover-item .hover-link > a,
.action-hover-menu .hover-warp ul > li > a,
.action-hover-menu .hover-warp .hover-warp-list > li > a {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 9px 12px !important;
  margin: 2px 0 !important;
  border-radius: 10px !important;
  transition: background .22s ease, color .22s ease !important;
  background: transparent !important;
}
/* 悬停：浅色圆角背景 */
.action-hover-menu .hover-warp .hover-item > a:hover,
.action-hover-menu .hover-warp .hover-item .hover-link > a:hover,
.action-hover-menu .hover-warp ul > li > a:hover,
.action-hover-menu .hover-warp .hover-warp-list > li > a:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-radius: 10px !important;
}
/* 菜单项里的图标容器也圆角 */
.action-hover-menu .hover-warp .hover-item .hover-link > a > i,
.action-hover-menu .hover-warp .hover-item > a > i {
  border-radius: 10px !important;
}
/* 分隔线：左右留边，不贴边 */
.action-hover-menu .hover-warp hr {
  margin: 6px 14px !important;
  border-radius: 2px !important;
}
/* 底部按钮区（如退出登录按钮）圆角 */
.action-hover-menu .hover-warp .hover-item:last-child,
.action-hover-menu .hover-warp > a:last-child {
  border-bottom-left-radius: 16px !important;
  border-bottom-right-radius: 16px !important;
}
/* 深色模式下悬停背景更明显 */
[data-bs-theme=dark] .action-hover-menu .hover-warp .hover-item > a:hover,
[data-bs-theme=dark] .action-hover-menu .hover-warp ul > li > a:hover {
  background: rgba(255, 255, 255, 0.1) !important;
}

/* ============================================================
 * 头像下拉菜单 - 「退出登录」「我的推广」按钮圆角美化
 * 结构：.abstop-item > a（这两个按钮在独立容器里）
 * ============================================================ */
.action-hover-menu .abstop-item {
  padding: 4px 10px !important;
}
.action-hover-menu .abstop-item > a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 8px 14px !important;
  margin: 2px 0 2px 6px !important;
  /* 四角全圆：分角写法 + 整体写法双保险 */
  border-radius: 10px 10px 10px 10px !important;
  border-top-left-radius: 10px !important;
  border-top-right-radius: 10px !important;
  border-bottom-left-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
  -webkit-border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #e0e0e0 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  transition: background .22s ease, color .22s ease, border-color .22s ease !important;
  white-space: nowrap !important;
  overflow: visible !important;
  clip-path: none !important;
}
/* 悬停态同样四角全圆 */
.action-hover-menu .abstop-item > a:hover {
  border-radius: 10px 10px 10px 10px !important;
  border-top-left-radius: 10px !important;
  border-top-right-radius: 10px !important;
  border-bottom-left-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
  -webkit-border-radius: 10px !important;
}
.action-hover-menu .abstop-item > a:hover {
  background: rgba(255, 255, 255, 0.16) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}
.action-hover-menu .abstop-item > a > i {
  font-size: 13px !important;
  border-radius: 0 !important;
  background: none !important;
}
/* 退出登录按钮：红色系提示 */
.action-hover-menu .abstop-item > a[href*="logout"],
.action-hover-menu .abstop-item > a[href*="login?action=logout"] {
  color: #ff8a8a !important;
}
.action-hover-menu .abstop-item > a[href*="logout"]:hover,
.action-hover-menu .abstop-item > a[href*="login?action=logout"]:hover {
  background: rgba(255, 90, 90, 0.15) !important;
  border-color: rgba(255, 90, 90, 0.3) !important;
  color: #ffb3b3 !important;
}

/* ============================================================
 * 头像下拉菜单 - 全部链接元素四角圆角兜底
 * ============================================================ */
.action-hover-menu .hover-warp a,
.action-hover-menu .abstop-item a {
  border-radius: 10px 10px 10px 10px !important;
  border-top-left-radius: 10px !important;
  border-top-right-radius: 10px !important;
  border-bottom-left-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
}

/* ============================================================
 * 头像下拉菜单底部按钮 - 四角全圆（最终修复）
 * 问题：主题自带样式
 *   .hover-warp .abstop-item a:first-child { border-radius: 0 0 0 20px }
 *   .hover-warp .abstop-item a:last-child  { border-radius: 0 0 20px 0 }
 *   且按钮 flex:1 平分整行、容器有深色底，看起来是"贴底一整条"
 * 修复：提高选择器优先级 + 覆盖 first/last-child + 改为独立胶囊按钮（已拉长）
 * ============================================================ */
/* 容器：去掉整条深色底，改为留白 */
.navbar .action-hover-menu .hover-warp .abstop-item,
.hover-warp .abstop-item {
  background: transparent !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
  gap: 10px !important;
  padding: 10px 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
/* 按钮：改为独立胶囊，四角全圆 */
.navbar .action-hover-menu .hover-warp .abstop-item a,
.navbar .action-hover-menu .hover-warp .abstop-item a:first-child,
.navbar .action-hover-menu .hover-warp .abstop-item a:last-child,
.hover-warp .abstop-item a,
.hover-warp .abstop-item a:first-child,
.hover-warp .abstop-item a:last-child {
  flex: 0 1 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 8px 32px !important;
  color: rgba(255, 255, 255, 0.75) !important;
  font-size: 13px !important;
  background: rgba(255, 255, 255, 0.07) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  /* 四角全圆：整体 + 分角 + 兼容 三重保险 */
  border-radius: 18px !important;
  border-top-left-radius: 18px !important;
  border-top-right-radius: 18px !important;
  border-bottom-left-radius: 18px !important;
  border-bottom-right-radius: 18px !important;
  -webkit-border-radius: 18px !important;
  transition: background .22s ease, color .22s ease, border-color .22s ease !important;
  overflow: visible !important;
}
/* 悬停：四角依然全圆 */
.navbar .action-hover-menu .hover-warp .abstop-item a:hover,
.navbar .action-hover-menu .hover-warp .abstop-item a:first-child:hover,
.navbar .action-hover-menu .hover-warp .abstop-item a:last-child:hover,
.hover-warp .abstop-item a:hover,
.hover-warp .abstop-item a:first-child:hover,
.hover-warp .abstop-item a:last-child:hover {
  border-radius: 18px !important;
  border-top-left-radius: 18px !important;
  border-top-right-radius: 18px !important;
  border-bottom-left-radius: 18px !important;
  border-bottom-right-radius: 18px !important;
  background: rgba(255, 255, 255, 0.14) !important;
  color: #ffffff !important;
}
/* 退出登录：红色系 */
.navbar .action-hover-menu .hover-warp .abstop-item a:first-child:hover,
.hover-warp .abstop-item a:first-child:hover {
  color: #ff9a9a !important;
  background: rgba(255, 90, 90, 0.15) !important;
  border-color: rgba(255, 90, 90, 0.3) !important;
}
/* 去掉主题的底部下划线动效 */
.navbar .action-hover-menu .hover-warp .abstop-item a::after,
.hover-warp .abstop-item a::after {
  display: none !important;
  content: none !important;
}
