/* ============================================================
   栀云互联 会员中心 - 内页白色主题覆盖样式
   参照 cloud2.divcloud.cn (Hezi) 的 header.css（白色主题）
   仅覆盖外观，不改动任何功能逻辑
   ============================================================ */

:root {
  --borderRadius: 0;
  --transition: all 0.2s ease-in-out;
  --Hui-padding: 20px;
  --ten: 10px;
}

/* 统一主色为 Hezi 蓝（覆盖各主题色） */
:root[theme] {
  --color-primary: #0056ff;
}

body {
  overflow-x: hidden;
}

/* 开关直角 */
.Hui-main .el-switch__core,
.Hui-main .el-switch__core:after,
.Hui-main .el-switch.is-checked .el-switch__core,
.Hui-main .el-switch.is-checked .el-switch__core::after {
  border-radius: var(--borderRadius);
}
.Hui-main .el-switch__core:after {
  left: 2px;
  top: 50%;
  transform: translateY(-50%);
  width: 15px;
  height: 15px;
}

/* ============ 侧边栏（白色） ============ */
.el-aside {
  background-color: #fff !important;
  box-shadow: none;
  border-right: 1px solid #eef0f3;
  box-sizing: border-box;
  top: 0;
  padding: 0;
  padding-top: 60px;
}
.menu-top {
  margin-top: 0 !important;
  display: flex;
  flex-direction: column;
  width: 196px;
  background: transparent !important;
}
.el-menu--collapse {
  width: 64px;
}
.menu-top .el-menu-item {
  background: transparent !important;
  border-radius: 0;
  padding: 0 10px !important;
}
.drawer-menu-list-top {
  padding: 0;
}
.line {
  border: 1px solid #eef0f3 !important;
  margin: 5px auto;
}
.aside-menu-text {
  color: rgba(30, 28, 28, 0.9);
  font-size: 14px;
  margin-left: 5px;
}
.el-menu-item i {
  color: rgba(30, 28, 28, 0.9) !important;
  font-size: 15px;
  width: 16px;
}
/* 激活项：实心蓝 */
.menu-top .el-menu-item.is-active {
  background-color: #0056ff !important;
  box-sizing: border-box;
  border-width: 0;
}
.el-menu-item.is-active span {
  color: #fff !important;
  font-size: 14px;
}
.menu-top .el-menu-item.is-active i {
  color: #fff !important;
}
.menu-top .el-menu-item.is-active::after {
  display: none;
}
/* hover 浅灰 */
.menu-top .el-menu-item:hover {
  background-color: #f5f5f5 !important;
}
.menu-top .el-menu-item:hover span,
.menu-top .el-menu-item:hover i {
  color: rgba(30, 28, 28, 0.9) !important;
}

/* 侧栏顶部隐藏的旧 logo */
.ali-logo {
  display: none;
}

/* 二级菜单 */
.menu-top .el-submenu__title i {
  color: #909399 !important;
}
.iconfont {
  font-size: 15px;
}
.menu-top .el-submenu__title .aside-menu-text {
  color: rgba(129, 129, 129, 0.9) !important;
}
.menu-top .el-submenu a .el-menu-item:hover {
  background-color: #f5f5f5 !important;
  color: rgba(30, 28, 28, 0.9) !important;
}
.menu-top .el-submenu a .el-menu-item.is-active {
  background-color: #0056ff !important;
  color: #fff !important;
}
.el-submenu__title {
  padding: 0 10px !important;
}
.menu-top .el-submenu__title:hover {
  background-color: transparent !important;
}
.menu-top .el-submenu .el-menu-item {
  padding-left: 20px !important;
  line-height: 40px !important;
  height: 40px;
  color: #979797 !important;
}
.Heziyun-aside-menu .el-submenu .el-menu,
.Heziyun-aside-menu .el-menu {
  display: block !important;
}
.Heziyun-aside-menu .el-submenu__icon-arrow {
  display: none;
}
.Heziyun-aside-menu .menu-top .el-submenu__title {
  pointer-events: none;
}

/* 折叠后弹出的二级浮层 */
.el-menu--vertical {
  background-color: #fff;
}
.el-menu--vertical .el-menu-item {
  color: rgba(0, 0, 0, 0.8) !important;
}
.el-menu--vertical .el-menu-item:focus,
.el-menu--vertical .el-menu-item:hover {
  background-color: #f5f5f5 !important;
}
.el-tooltip__popper.is-dark .aside-menu-text {
  color: #1e1c1ce6 !important;
}

/* ============ 顶部导航（白色） ============ */
.el-header {
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.05);
  height: 60px !important;
  width: 100% !important;
  left: 0;
  padding: 0 !important;
  background-color: #fff !important;
  border-bottom: 1px solid #eef0f3;
  border-radius: 0;
}

/* Logo 区，与 190px 侧栏对齐 */
.Hui-gai {
  height: 100%;
  width: 190px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}
.Hui-gai .Hui-logo {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 0 0.1rem;
  box-sizing: border-box;
}

/* 控制台按钮 */
.header-left .Heziyun-console {
  font-size: 13px;
  cursor: pointer;
  color: rgba(30, 28, 28, 0.9);
  display: flex;
  align-items: center;
  gap: 4px;
  height: 100%;
  padding: 0 10px;
  transition: var(--transition);
}
.header-left .Heziyun-console:hover {
  background-color: #f5f5f5;
}

/* 顶部右侧 */
.header-right {
  margin: 0;
}
.header-right .header-right-item {
  height: 100%;
  color: rgba(30, 28, 28, 0.9);
}
.header-right .hg-24 {
  display: flex;
  align-items: center;
}
.header-right .el-dropdown {
  height: 100%;
  display: flex;
  align-items: center;
}
.header-right .hg-24 .el-dropdown .el-dropdown-country,
.header-right .header-right-item .el-dropdown-header,
.header-right .car-item .el-badge {
  transition: var(--transition);
  height: 100%;
  padding: 0 15px;
  color: rgba(30, 28, 28, 0.9);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
}
.header-right .hg-24 .el-dropdown .el-dropdown-country:hover,
.header-right .header-right-item .el-dropdown-header:hover,
.header-right .car-item .el-badge:hover,
.header-right .header-right-item .un-login:hover {
  background-color: #f5f5f5;
}
.header-right .car-item {
  margin: 0;
}
.header-right .car-item .right-item {
  height: 100%;
}
.header-right .hg-24 img {
  width: 32px;
  height: 20px;
  object-fit: cover;
  margin-right: 5px;
  border-radius: 2px;
}
.header-right .header-right-item .un-login {
  height: 100%;
  font-size: 13px;
  padding: 0 15px;
  display: flex;
  align-items: center;
}
.header-right .header-right-item .un-login img {
  width: 20px;
  height: 20px;
}
.header-right .header-right-item .el-dropdown-header .head-box {
  width: auto;
  background-color: transparent;
  color: rgba(30, 28, 28, 0.9);
  font-size: 14px;
}
.el-dropdown-menu {
  border-radius: var(--borderRadius);
}
.el-dropdown-menu__item {
  padding: 0 15px;
  display: flex;
  align-items: center;
}
.el-dropdown-menu__item i {
  font-size: 18px;
}
.el-dropdown-menu__item:focus,
.el-dropdown-menu__item:not(.is-disabled):hover {
  background-color: #f5f5f5;
}
.header-right .el-badge__content.is-fixed {
  top: 16px !important;
  right: 16px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  height: 16px;
  width: 16px;
  line-height: initial;
  padding: initial;
}

/* 主内容区留出顶部固定导航高度 */
.el-container:nth-child(2) > .el-main {
  margin: 80px 0.3rem 0.3rem 0.3rem !important;
  border-radius: 0;
}
.el-main {
  overflow-x: hidden;
}

/* 文字省略工具类 */
.Hui-textEllipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* ===================== 移动端 ===================== */
@media screen and (max-width: 768px) {
  .header-right .hg-24 span,
  .header-right .header-right-item .cloum-line,
  .header-right .cloum-line-item,
  .header-right .header-right-item .el-dropdown-header .head-box {
    display: none;
  }
  .header-right {
    gap: 0;
  }
  .header-right .car-item {
    margin-right: 0;
  }
  .header-right .car-item img {
    width: 6vw;
    height: 6vw;
  }
  .header-right .car-item .el-badge {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .header-right .el-badge__content.is-fixed {
    font-size: 8px;
    height: 13px;
    width: 13px;
    top: 12px !important;
    right: 12px;
  }
  .Hui-gai {
    display: none !important;
  }
  .el-header {
    height: 15vw !important;
    padding: 0 0 0 5vw !important;
  }
  .el-main {
    padding: 20vw 5vw 5vw 5vw !important;
  }
  .header-right .header-right-item .un-login {
    font-size: 3.3vw;
    padding: 0 3vw;
  }
  .el-drawer__body {
    background-color: #fff;
  }
  .drawer-menu-logo {
    height: 100%;
    max-width: 80%;
    margin: 0 auto;
    width: 100%;
    display: block;
  }
  .drawer-menu-top {
    width: 100%;
    height: auto;
  }
  .drawer-menu-list-top {
    margin-top: 0;
  }
  .header-right .hg-24 .el-dropdown .el-dropdown-country {
    padding: 0 3vw;
  }
  /* 弹窗 */
  .com-auto-renew .common-renew-dialog .el-dialog__body {
    padding: 5vw;
  }
  .com-auto-renew .common-renew-dialog .el-dialog__body .dialog-title {
    white-space: initial;
    font-size: 4vw;
  }
  .com-auto-renew .common-renew-dialog .el-dialog__body .con .label {
    font-size: 3.5vw;
    text-align: left !important;
    min-width: 26vw;
    margin-right: 1vw;
  }
  .com-auto-renew .common-renew-dialog .el-dialog__body .con .item {
    font-size: 3.2vw;
  }
  .com-auto-renew .common-renew-dialog .el-dialog__body .con .value {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .dialog-footer .btn-ok,
  .dialog-footer .btn-no {
    min-width: 18vw;
    padding: 0.5vw;
    font-size: 3.5vw;
  }
}