body {
    color: #333333;
background: #f7f8fc;
font-size: 13px;
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
}
[v-cloak] {
  display: none !important;
}
a{
  color: #7255ff;
}
.table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th {
    vertical-align: inherit;
}

ol,
ul {
    list-style: none;
}

ol ol,
ol ul,
ul ol,
ul ul {
    margin-bottom: 0;
}
.text-primary {
color: #7255ff!important;
}
select {
    /*Chrome和Firefox里面的边框是不一样的，所以复写了一下*/
    border-radius: 2px;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
}
/* 顶部加载颜色 */
.pace .pace-activity {
border-top-color: #5839fc !important;
border-left-color: #c694fa !important;
}
.pace-progress {
background: linear-gradient(to right, #5839fc, #c694fa) !important;
}
.btn-link{
  color: #7255ff;
}
.backDataDisplay{display:flex;align-items:center;gap:10px}

.btn {
/* border-radius: 6px !important; */
/* padding: 6px 13px !important; */
border-radius: 10px;
}
.btn-xs {
padding: 3px 10px !important;;
}
.btn-group-lg>.btn, .btn-lg {
padding: 10px 25px !important;;
border-radius: 10px !important;;
}
.top-menu {
background: #100620 !important;
}
.dark .top-menu{
  background: #09090a !important;
}
.top-menu .nav>li:focus>a, .top-menu .nav>li:hover>a, .top-menu .nav>li>a:focus, .top-menu .nav>li>a:hover {
background: #19171f !important;
}
.top-menu .nav .sub-menu {
background: #19171f !important;
padding: 5px 0;
}
.top-menu .sub-menu>li>a {
padding: 8px 20px;
}
.top-menu .nav>li>a .caret.pull-right{
  content: "";
width: 6px;
height: 6px;
border-top: 1px solid #666666;
border-right: 1px solid #666666;
transform: rotate(135deg);
transition: all .3s linear;
border-left: none;
margin-top: 6px;
}
.top-menu .nav>li.active>a .caret.pull-right{
border-top: 1px solid #ffffff;
border-right: 1px solid #ffffff;
}
/* 针对Chrome自动填充的样式覆盖 */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  /* 改成你界面的背景色（比如这里的浅蓝） */
  -webkit-box-shadow: 0 0 0 30px rgba(255, 255, 255, 1) inset !important;
  /* 文字颜色也可以统一设置 */
  -webkit-text-fill-color: #333 !important;
  /* 去掉边框高亮 */
  outline: none;
  box-shadow: none;
}
th{
  white-space: nowrap;
}
.content {
margin-left: 238px !important;
}
.sidebar, .sidebar-bg {
width: 238px !important;
}
.sidebar .sub-menu {
background: #fcfbff !important;
}
/* .btn.btn-danger {
color: #f65964 !important;
background: #fff2f3 !important;
border-color: #fcd4d5 !important;
box-shadow: 0 0 5px #ffcbcb inset;
}
.btn-danger:hover {
background: #fff !important;
border-color: #fee9eb !important;
}
.btn.btn-warning{
  color: #ff9414 !important;
  background: #fef7ea !important;
  border-color: #fbe4b4 !important;
  box-shadow: 0 0 5px #ffe3b4 inset;

}
.btn.btn-success {
  color: #33d06b !important;
  background: #effcf1 !important;
  border-color: #c1e7d1 !important;
  box-shadow: 0 0 5px #b9ffb8 inset;
}
.btn.btn-info {
color: #3866ff !important;
background: #ebf1ff !important;
border-color: #dbe6ff !important;
box-shadow: 0 0 5px #deebff inset;
}
.btn.btn-warning:hover,
.btn.btn-success:hover,
.btn.btn-info:hover{

  background: #fff !important;
} */
/* primary 紫色 */

/* warning 金橙色 */
.btn.btn-warning {
    color: #fff !important;
    background: linear-gradient(to right, rgb(255, 160, 41), rgb(255, 193, 78)) !important;
    border-color: transparent !important;
    box-shadow: 0 8px 18px rgba(255, 174, 73, 0.24);
}

.btn.btn-warning:hover {
    color: #fff !important;
    background: linear-gradient(to right,  rgb(255, 193, 78), rgb(255, 160, 41)) !important;
    border-color: transparent !important;
    box-shadow: 0 10px 22px rgba(255, 174, 73, 0.34);
}


/* success 青绿色 */
.btn.btn-success {
    color: #fff !important;
    background: linear-gradient(to right, rgb(6, 196, 147), rgb(57, 222, 172)) !important;
    border-color: transparent !important;
    box-shadow: 0 8px 18px rgba(38, 194, 154, 0.24);
}

.btn.btn-success:hover {
    color: #fff !important;
    background: linear-gradient(to right, rgb(57, 222, 172), rgb(6, 196, 147)) !important;
    border-color: transparent !important;
    box-shadow: 0 10px 22px rgba(38, 194, 154, 0.34);
}


/* danger 玫红 */
.btn.btn-danger {
    color: #fff !important;
    background: linear-gradient(to right, rgb(255, 91, 124), rgb(255, 126, 156)) !important;
    border-color: transparent !important;
    box-shadow: 0 8px 18px rgba(255, 91, 124, 0.24);
}

.btn.btn-danger:hover {
    color: #fff !important;
    background: linear-gradient(to right, rgb(242, 69, 105), rgb(255, 107, 141)) !important;
    border-color: transparent !important;
    box-shadow: 0 10px 22px rgba(255, 91, 124, 0.34);
}


/* info 清透蓝 */
.btn.btn-info {
    color: #fff !important;
    background: linear-gradient(to right, rgb(83, 151, 255), rgb(125, 186, 255)) !important;
    border-color: transparent !important;
    box-shadow: 0 8px 18px rgba(83, 151, 255, 0.24);
}

.btn.btn-info:hover {
    color: #fff !important;
    background: linear-gradient(to right, rgb(60, 132, 245), rgb(103, 172, 255)) !important;
    border-color: transparent !important;
    box-shadow: 0 10px 22px rgba(83, 151, 255, 0.34);
}


/* 统一交互 */
.btn.btn-primary,
.btn.btn-warning,
.btn.btn-success,
.btn.btn-danger,
.btn.btn-info {
    transition: all 0.22s ease;
}

.btn.btn-primary:hover,
.btn.btn-warning:hover,
.btn.btn-success:hover,
.btn.btn-danger:hover,
.btn.btn-info:hover {
    transform: translateY(-1px);
}
.hk-5{
  width: 5%;
}
.hk-10{
  width: 10%;
}
.hk-15{
  width: 15%;
}
.hk-20{
  width: 20%;
}
.hk-25{
  width: 25%;
}
.hk-30{
  width: 30%;
}
.hk-35{
  width: 35%;
}
.hk-40{
  width: 40%;
}
.hk-45{
  width: 45%;
}
.hk-50{
  width: 50%;
}
.hk-55{
  width: 55%;
}
.hk-60{
  width: 60%;
}
.hk-65{
  width: 65%;
}
.hk-70{
  width: 70%;
}
.hk-75{
  width: 75%;
}
.hk-80{
  width: 80%;
}
.hk-85{
  width: 85%;
}
.hk-90{
  width: 90%;
}
.hk-95{
  width: 95%;
}
.hk-100{
  width: 100%;
}
.lookTips{
  background: #ffead0;
  color: #8a6d3b;
  padding: 5px 10px;
  font-size: 11px;
  border-radius: 100px;
  margin-left: 10px;
  display: inline-block;
  font-weight: 300;
  line-height: 1;
}
.createAnimation{
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1100;
  background: rgba(0, 0, 0, 0.2);
}
.createAnimation .loading {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  width: 100%;
  z-index: 10000;
  animation-duration: 0.3s;
  animation-name: wakeUpAnimation;
  animation-fill-mode: forwards;
  text-align: center;
}
.createAnimation .loading .dataLoad {
  width: 35px;
  height: 35px;
  border: 2px solid #ffffff;
  border-bottom-color: #7255ff;
  border-radius: 50%;
  display: inline-block;
  -webkit-animation: circulate 1s linear infinite;
  animation: circulate 1s linear infinite;
}
/* 录课室管理 */
.lksNum{
    border: 1px solid #f2f2f2;
    border-radius: 15px;
    padding: 15px;
    display: inline-block;
    box-shadow: 0 0 10px 1px rgba(35, 50, 50, 0.07);
    margin-right: 20px;
    cursor: pointer;
  	/* 禁止复制 */
  	user-select: none;
  	-moz-user-select: none;
  	-webkit-user-select: none;
  	-ms-user-select: none;
    transition: all .3s;
-moz-transition: all .3s;
-webkit-transition: all .3s;
-o-transition: all .3s;
}
.lksNum:hover{
  background: #f9fcff;
}
.lksNum.active{
  background: #000;
  background: linear-gradient(80deg,  #5839fc, #a693fa);
  box-shadow: 0 6px 10px rgba(76, 33, 251, 0.33);
}
.lksNum .title{
    text-align: center;
    font-size: 15px;
    width: 100%;
    font-weight: bold;
    margin: 0;


    cursor: pointer; /* 增加鼠标指针提示 */
    pointer-events: none;/* 确保点击事件可触发，为了实现空白有提示 */
}
.lksNum.active .title.active span{
  color: #7255ff;
  color: #ffffff;
    background: transparent;
    border: none;
}
.lksNum .title span:hover{
  background: transparent;
}
.lksNum .title span{
    color: #333333;
    font-weight: bold;
    background: transparent;
    border: none;
    cursor: auto;
    position: relative;
    transition: all .3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
}
.lksNum .title.active span:after {
content: "";
border-radius: 50%;
border: 3px solid #a6ff2f;
border: 3px solid #fff;
background: #5839fc;
width: 11px;
height: 11px;
position: absolute;
left: 26px;
top: 50%;
transform: translateY(-50%);
/* transition: all .3s;
-moz-transition: all .3s;
-webkit-transition: all .3s;
-o-transition: all .3s; */
}
.lksNum .block{
    display: block;
    margin: 10px 0;
    text-align: center;
}
.lksNum label{
    /* border: 1px solid #e6e4e4; */
    border-radius: 5px;
    margin: 0;
    /* padding: 5px; */
}
.manyStyle{
    margin: 0 25px 0 0
}

.page-sidebar-minified .sidebar .nav-header, .page-sidebar-minified .sidebar .nav-profile, .page-sidebar-minified .sidebar .nav>li>a>span, .page-sidebar-minified .sidebar .nav>li>a>b {
display: none;
}
.ant-switch-checked {
background: linear-gradient(to right, rgb(106, 91, 250), rgb(133, 129, 253)) !important;
}

/* 定义录课室选中后的样式 */
.hklks li {
    display: inline-block;
    position: relative;
    list-style: none;
}
.hklks input[type="radio"] {
    display: none;
}
.hklks span {
    padding: 5px 12px;
    display: inline-block;
    background: #f2f5fa;
    border: 1px solid #ebeff6;
    line-height: normal;
    text-align: center;
    color: #666666;
    cursor: pointer;
    width: 100%;
    border-radius: 100px;
    font-weight: normal;
    transition: all .3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
}
.hklks .lksNum.active span {
    background: #ffffff;
    border: 1px solid #000000;
    color: #666666;

    background: rgba(0, 0, 0, 0.5);
border: 1px solid rgba(0, 0, 0, 0.09);
color: #ffffff;
}
.hklks span:hover{
  background: #d5deec;
}
.hklks .lksNum.active input:checked+span {
    background: #a6ff2f;
    border-color: #000;
    color: #000;

    border-color: #fff;
    background: linear-gradient(80deg, #f1c4ff 0.42%, #dcfeff);
}
/* 列表中的录课室样式 */
.lksList.hklks.row{
  margin: 0 -5px;
}
.lksList.hklks.row>[class*=col-]{
  padding: 0 5px;
}
.lksList.hklks .lksNum{
    margin-right: 0;
    width: 100%;
    padding: 10px;
    text-align: center;
    box-shadow: 0 0 10px 1px rgba(10, 94, 212, 0.05);
}
.lksList.hklks .lksNum .title.active span:after{
  display: none;
}
.lksList.hklks .lksNum .block{
  width: 100%;
}
.lksList.hklks .col-md-6 label{
  width: 32%;
}
.emptySel{
    height: 34px;
    padding: 6px 12px;
}
.emptySel input {
    display: none;
}
.emptySel label{
    position: relative;
    padding-left: 28px;
  	cursor: pointer;
  	/* 禁止复制 */
  	user-select: none;
  	-moz-user-select: none;
  	-webkit-user-select: none;
  	-ms-user-select: none;
}
.emptySel label i {
    display: block;
    position: absolute;
    top: -1px;
    left: 0;
    width: 19px;
    height: 19px;
    outline: 0;
    border: 1px solid #ccd0d4;
    border-radius: 4px;
    transition: all .3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
}
.emptySel label input:checked+i {
    border-color: #7255ff;
}
/* 使用 :has() 选择器让父级支持颜色 */
.emptySel label:has(input:checked) {
    color: #7255ff;
}

.emptySel label input+i:after {
    position: absolute;
    content: '';
    top: 6px;
    left: 6px;
    width: 5px;
    height: 5px;
    border-radius: 1px;
    background-color: #7255ff;
    opacity: 0;
    transition: all .3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
}
.emptySel label input:checked+i:after {
  opacity: 1;
}
/* 录课室管理 */
.feelNone {
    pointer-events: none;
}
.papaerNum{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.spinner,
.spinner-small {
    border: 2px solid #fff !important;
    border-top: 2px solid #7255ff !important;
}
.sidebar .nav>li>a {
padding: 10px 10px !important;
margin: 0 10px !important;
color: #1f1f1f !important;
}
.homeBanner img {
    width: 100%;
    height: 100px;
    object-fit: cover;
    object-position: center;
}

/* 按钮 */
input:checked+.hkSwtichHideSlider.tender {
  background: linear-gradient(to right, #a6ff2f, #4eff2f);
  border: 1px solid #000;
}
.hkSwtichHideSlider.tender{
  border: 1px solid #afa9cb;
}
.hkSwtichHideSlider.tender:before {
  bottom: 2px;
}
.hkSwtichHideBtn {
    position: relative;
    display: inline-block;
    /* width: 45px;
    height: 26px; */
    width: 43px;
    height: 23px;
    min-width: 43px;
    max-width: 43px;
    overflow: hidden;
    vertical-align: middle;
    margin: 0 !important;
}

.hkSwtichHideBtn input {
    opacity: 0;
    width: 0;
    height: 0;
    display: none;
}

.hkSwtichHideSlider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 43px;
    height: 23px;
    background-color: #cccccc;
    /* -webkit-transition: .4s;
    transition: .4s; */
}

.hkSwtichHideSlider:before {
    position: absolute;
    content: "";
    /* height: 22px;
    width: 22px;
    left: 3px;
    bottom: 2px; */;
    height: 17px;
    width: 17px;
    left: 4px;
    bottom: 3px;
    background-color: white;
    /* -webkit-transition: .5s; */
    transition: all 0.5s;
}
input:checked+.hkSwtichHideSlider {
    background-color: #7255ff;
    background: linear-gradient(to right, #3397ff, #7255ff);
    background: linear-gradient(to right, #5839fc, #d92eff);

      background: linear-gradient(to right, #6a5bff, #8581ff);
}

input:checked+.hkSwtichHideSlider.green {
    background-color: #00c983;
    background: linear-gradient(to right, #00c983, #86e200);
    background: linear-gradient(to right, #00c37e, #00d91e);
}
input:checked+.hkSwtichHideSlider.pink {
    background-color: #ff88cc;
    background: linear-gradient(to right, #ff88cc, #eb0c7e);
}
input:checked+.hkSwtichHideSlider.purple{
    background-color: #813ffc;
    background: linear-gradient(to right, #ac85f5, #813ffc);
}
input:checked+.hkSwtichHideSlider:before {
    -webkit-transform: translateX(17px);
    -ms-transform: translateX(17px);
    transform: translateX(17px);
}
.input-group-addon {
border-radius: 10px;
}
.bwizard-steps {
  display: grid!important;
  width: 100%!important;
  /* 保留均分逻辑：适配任意数量子盒子 */
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr))!important;
  grid-column-gap: 15px!important;
  overflow: initial !important;
  /* 关键：让伪元素脱离 Grid 布局流 */
  position: relative !important;
  background: transparent !important;
}

.bwizard-steps li.active, .bwizard-steps li.active:focus, .bwizard-steps li.active:hover {
background: linear-gradient(to right, #5839fc, #c694fa) !important;
box-shadow: 0 6px 10px rgba(62, 33, 251, 0.2);
}
.bwizard-steps li.active small {
color: rgba(255, 255, 255, 0.65)!important;
}
.bwizard-steps li {
background: #f6f7fa!important;
}
.bwizard-steps::before,
.bwizard-steps::after {
  grid-column: unset!important;
  grid-row: unset!important;
  position: absolute!important; /* 脱离文档流，不占用 Grid 列 */
  display: none!important; /* 直接隐藏（如果伪元素无实际作用），或仅用 position */
  width: 0!important;
  height: 0!important;
  content: ""!important;
}

.bwizard-steps li {
  width: 100%!important;
  box-sizing: border-box!important;
border-radius: 10px !important;
box-shadow: 0 6px 10px rgba(15, 0, 101, 0.08);
}
.hkSwtichHideSlider.hkSwtichHideRound {
    border-radius: 28px;
}

.hkSwtichHideSlider.hkSwtichHideRound:before {
    border-radius: 50%;
    box-shadow: 1px 1px 5px rgba(6, 0, 0, 0.2);
}
.hkTypeXxk.block label{
  display: block;
}
.hkTypeXxk.block label:not(:last-of-type) {
margin-right: 0;
}
.hkTypeXxk.sm span{
  padding: 3px 10px 3px 21px;
  border-radius: 10px;
}
.hkTypeXxk.sm span:after{
left: 5px;
}
.hkTypeXxk {
    margin-bottom: -15px;
    /* 禁止复制 */
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

.hkTypeXxk label {
    display: inline-block;
    margin-bottom: 15px;
}

.hkTypeXxk label:not(:last-of-type) {
    margin-right: 15px;
}

.hkTypeXxk input[type="radio"],
.hkTypeXxk input[type="checkbox"] {
    display: none;
}

.hkTypeXxk span {
    position: relative;
    padding: 8px 15px 8px 31px;
    display: inline-block;
    background: #f2f5fa;
    border: 1px solid #ebeff6;
    text-align: center;
    color: #33363e;
    cursor: pointer;
    width: auto;
    border-radius: 10px;
    font-weight: normal;
    line-height: normal;
    transition: all .3s;
  -moz-transition: all .3s;
  -webkit-transition: all .3s;
  -o-transition: all .3s;
}
.hkTypeXxk span:hover{
  background: #d5deec;
}
.hkTypeXxk span:hover:after {
  border: 3px solid #f6f7f9;
  background: #d5deec;
}
.hkTypeXxk input:checked+span {
    /* background: #f1f7ff;
      border-color: #7255ff;
      color: #7255ff; */
    background: #7255ff;
    background: linear-gradient(to right, #3397ff, #7255ff) !important;
    background: linear-gradient(to right, #5839fc, #c694fa) !important;
    color: #ffffff;
    border: 1px solid #735fe4;
}

.hkTypeXxk span:after {
    content: "";
    border-radius: 50%;
    border: 3px solid #d9dce3;
    background: #f2f5fa;
    width: 11px;
    height: 11px;
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    transition: all .3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
}

.hkTypeXxk input:checked+span:after {
    background: #7255ff;

    background: linear-gradient(to right, #5839fc, #c694fa) !important;
    border: 3px solid #fff;
}

.dark .hkTypeXxk input:checked+span:after {
    border: 3px solid #000;
}

/* 录课室选项卡 */

.hkLksCityXxk {
    margin-bottom: -15px;
    /* 禁止复制 */
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

.hkLksCityXxk label {
    display: inline-block;
    margin-bottom: 15px;
}

.hkLksCityXxk label:not(:last-of-type) {
    margin-right: 20px;
}

.hkLksCityXxk input[type="radio"],
.hkLksCityXxk input[type="checkbox"] {
    display: none;
}

.hkLksCityXxk .name {
  width: 150px;
  padding: 5px;
    position: relative;
    display: inline-block;
    background: #777f8c;
    background: linear-gradient(70deg, #797f8c, #8a97b1);
    border: 3px solid #ebeff6;
    text-align: center;
    color: #33363e;
    cursor: pointer;
    border-radius: 15px;
    line-height: 1;
    box-shadow: 0 5px 15px 0 rgba(6, 9, 38, 0.1);

  flex-shrink: 0;
border-width: 1px;
border-style: solid;
border-image: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.36) 30%, transparent) 1;
}
.hkLksCityXxk input:checked+.name{
  background: linear-gradient(to right, #0054ff, #7255ff);
  transition: background .3s;
  -moz-transition: background .3s;
  -webkit-transition: background .3s;
  -o-transition: background .3s;
      color: #ffffff;
      box-shadow: 0 5px 15px 0 rgba(51, 75, 255, 0.61);
      border: 3px solid #7255ff;
      flex-shrink: 0;
    border-width: 1px;
    border-style: solid;
    background: linear-gradient(44deg, #0054ff, #21a1fb);
    border-image: linear-gradient(to right, transparent, #ffffff 30%, transparent) 1;
        /* border: 3px solid #ffffff; */

        background: linear-gradient(80deg,  #5839fc, #a693fa);
        box-shadow: 0 6px 10px rgba(76, 33, 251, 0.33);
}

.hkLksCityXxk .name span{
  display: inline-block;
  color: #ffffff;
  padding: 15px 15px 10px 15px;
  font-size: 15px;
  /* position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 16px;
  color: #ffffff;
  background: rgba(0, 0, 0, 0.45);
  padding: 2px 10px;
  font-weight: 200;
  border-radius: 5px; */
}
.hkLksCityXxk .name img{
  pointer-events: none;
  vertical-align: bottom;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  max-width: 100%;
border-radius: 10px;
border: 1px solid rgba(255, 255, 255, 0.3);
}
.hkLksCityXxk .name:hover{
  background: linear-gradient(70deg, #4f5560, #6d7990);
}
.hkLksCityXxk .name:hover:after {
  border: 3px solid #f6f7f9;
  background: linear-gradient(70deg, #4f5560, #6d7990);
}

.hkLksCityXxk .name:after {
    content: "";
    border-radius: 50%;
    border: 3px solid #d9dce3;
    background: #f2f5fa;
    width: 11px;
    height: 11px;
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    transition: all .3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
    -o-transition: all .3s;

    opacity: 0;
}

/* 录课室选项卡 */
.dataThumb{
  width: 50px;
  height: 50px;
  display: inline-block;
}
.navbar-inverse .navbar-toggle .icon-bar {
background-color: #111;
}
.eloq-bulk-bar{
  box-shadow: 0 -5px 30px rgba(35, 42, 65, 0.08);
border-radius: 10px;
z-index: 100;
padding: 10px 15px;
margin-top: 10px;
}
.eloq-bulk-page{
  display: flex;
align-items: center;
justify-content: space-between;
}
.dark .navbar-inverse .navbar-toggle .icon-bar {
background-color: #fff;
}

.formData{
  border-bottom: 1px solid #eee;
padding-bottom: 20px;
margin-bottom: 20px;
}

      .ttsContent {
        border:1px solid #e5e8f0;
        display: flex;
justify-content: space-between;
align-items: flex-start;
border-radius: 10px;

        background:#fff}
      .ttsContent .ttsType{
        padding: 15px;
        background: #f8f6fb;
border-right: 1px solid #e8e5f0;
        max-height:360px;overflow-y:auto;flex-shrink: 0;
width: 186px;}

		.ttsContent .ttsType	.name {
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 10px 13px;
				color: #3b4256;
				color: #2e3446;
				cursor: pointer;
        font-weight: normal;
        font-size: 13px;
        font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
			}
      .ttsContent .ttsType 	.name:hover{
        background: rgba(0, 0, 0, 0.05);
        border-radius: 10px;
      }
			.ttsContent .name.active,
      .ttsContent .name.active:hover {
        background: linear-gradient(to right, rgb(133, 129, 253), rgb(106, 91, 250));
color: #fff;
border-radius: 10px;
			}
    .ttsContent .name.active .count  {
        color: rgba(255, 255, 255, 0.58);
      }

		.ttsContent 	.name .count {
				color: #a49ab5;
				font-weight: 500
			}

    .ttsContent   .ttsTimbre{display: grid;
grid-template-columns: repeat(2,minmax(0,1fr));
gap: 20px;
padding: 20px;
max-height: 360px;
overflow: auto;
width: 100%;}

.ttsContent 	.card {
    position: relative;
    border: 2px solid #e3e7ef;
    padding: 9px 12px;
    border-radius: 10px;
    cursor: pointer;
    background: #fff;
  }

  .ttsContent 	.card .info {
      background: #fff;
      display: flex;
      /* align-items: center; */
      gap: 10px;
    }

			.ttsContent .card:hover,
      .ttsContent .card.active {
				border-color: #8f7cff
			}
		.ttsContent 	.card .audio{
      margin-top: 8px;
      padding: 8px 10px;
      border: 1px solid #edf0f7;
      border-radius: 6px;
      background: #f8f9fc;
      color: #667085;
      font-size: 12px;
      line-height: 1.6;
}
.ttsTimbre .card .audio .rowx {
display: flex;
gap: 6px;
margin-bottom: 4px;
}
.ttsTimbre .card .audio .labelx {
flex: 0 0 auto;
color: #8a94a6;
font-weight: 600;
}
.ttsTimbre .card .audio .demo {
max-height: 38px;
overflow: hidden;
}
		.ttsContent 	.card .active {
				border-color: #6b4df6;
				box-shadow: 0 0 0 1px #6b4df6 inset
			}

		.ttsContent 	.card.active:after {
				content: "✓";
				position: absolute;
				right: 8px;
				top: 7px;
				width: 20px;
				height: 20px;
				border-radius: 50%;
				background: #5b3ae2;
				color: #fff;
				text-align: center;
				line-height: 20px;
				font-weight: 800;
				font-size: 12px
			}
      .ttsContent .avatar{
        position: relative;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	overflow: hidden;
	flex: 0 0 50px;
	background: #f2f4fb;
	border: 1px solid #eef1f7;
	box-sizing: border-box;
      }
    .ttsContent .avatar  .go{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 15px;
	line-height: 15px;
	padding: 0;
	background: rgba(0, 0, 0, 0.48);
	text-align: center;
	color: #fff0da;
	font-size: 10px;
	font-weight: 500;
      }
        .ttsContent .avatar  .go:hover{
        background: rgba(0, 0, 0, 0.89);

        }
			.ttsContent .avatar img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
			}

      .ttsContent .ttsTimbre	.name .year{
        border: 1px solid #edf0f7;
      border-radius: 6px;
      background: #f8f9fc;
      color: #667085;
      font-size: 13px;
      font-weight: normal;
      font-size: 10px;
      padding: 3px 5px;
      margin-left: 5px;
      }
		.ttsContent  .ttsTimbre	.item {
				min-width: 0;
			}

		.ttsContent .ttsTimbre	.name {
				font-size: 14px;
				font-weight: 800;
				color: #2e3446;
				margin-bottom: 3px;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap
			}

		.ttsContent  .ttsTimbre	.desc {
				font-size: 12px;
				color: #8a93a8;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap
			}

		.ttsContent 	.preview {
				margin-left: auto;
				flex: 0 0 auto
			}

    .ttsContent .ttsTimbre .sample{
        /* position: absolute;
width: calc(100% - 30px);
left: 15px;
bottom: 15px;
right: 20px; */
      }
      .ttsContent .ttsTimbre .card .audio .hk-audio-player{
        max-width: 100%;
        min-width: 100%
      }

/* 按钮 */
.helpTips {
    margin-top: 15px;
    color: #666666;
}

.successStatus{
  background: #000000;
  color: #85ffcf;
  padding: 3px 10px;
  font-size: 11px;
  border-radius: 100px;
  line-height: normal;
  display: inline-block;
  font-weight: 400;
}
.progressStatus{
  background: #000000;
  color: #ffc58c;
  padding: 3px 10px;
  font-size: 11px;
  border-radius: 100px;
  line-height: normal;
  display: inline-block;
  font-weight: 400;
}
.emptyStatus{
  background: #a1a1a1;
  color: #ffffff;
  padding: 3px 10px;
  font-size: 11px;
  border-radius: 100px;
  line-height: normal;
  display: inline-block;
  font-weight: 400;
}


/* 让弹窗在中间 */
/* pointer-events: none; */
/* .modal-dialog{
  height: 100vh;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  margin: 0;
  }
  .modal-content{
    left: 50%;
  position: absolute;
  top: 50%;
  width: 600px;
  transform: translate(-50%, -50%);
  z-index: 1000000;
  } */
/* 让弹窗在中间 */

/* 加载动画 */

/* 蓝色动画加载 */
@-webkit-keyframes circulate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.loadingAnimation .loading .dataLoad {
    width: 55px;
    height: 55px;
    border: 4px solid #ffffff;
    border-bottom-color: #7255ff;
    border-radius: 50%;
    display: inline-block;
    -webkit-animation: circulate 1s linear infinite;
    animation: circulate 1s linear infinite;
}

.maskBg {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1100;
    background: rgba(0, 0, 0, 0.5);
}

.loadingAnimation .loading {
    position: fixed;
    left: 50%;
    top: 40%;
    transform: translate(-50%, -40%);
    opacity: 0;
    width: 100%;
    z-index: 10000;
    animation-duration: 0.3s;
    animation-name: wakeUpAnimation;
    animation-fill-mode: forwards;
    text-align: center;
}


@keyframes wakeUpAnimation {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.8);
    }

    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}

.loadingAnimation .loading .loadTitle span {
    font-size: 13px;
    display: inline-block;
    padding-top: 10px;
    color: #eaecee;
    /* font-weight: bold; */
}

/* 加载动画结束 */

.btn.btn-primary {
    color: #fff;
    background: #317cfe !important;
    border-color: transparent !important;
    background: linear-gradient(to right, #3397ff, #7255ff) !important;
    background: linear-gradient(to right, #5839fc, #c694fa) !important;
    background: linear-gradient(to right, rgb(106, 91, 250), rgb(133, 129, 253)) !important;
}

.btn-primary:hover {
    background: linear-gradient(to right, #1263ee, #2583e6) !important;
    background: linear-gradient(to right, #ff7865, #5839fc) !important;
    background: linear-gradient(to right, rgb(133, 129, 253), rgb(106, 91, 250)) !important;
}
.table > tbody > tr.info > td, .table > tbody > tr.info > th,
.table > tbody > tr > td.info, .table > tbody > tr > th.info,
.table > tfoot > tr.info > td, .table > tfoot > tr.info > th,
.table > tfoot > tr > td.info, .table > tfoot > tr > th.info,
.table > thead > tr.info > td, .table > thead > tr.info > th,
.table > thead > tr > td.info, .table > thead > tr > th.info {
background: rgb(232, 236, 241) !important;
border-color: #e2e7eb;
}

/* .btn.btn-success{
    background: #1ac185 !important;
  border-color: #0fbf80 !important;
  }
  .btn.btn-success:hover{
  background: linear-gradient(to right, #009c64, #07a56c) !important;
  } */
.bootstrap-dialog .bootstrap-dialog-title {
    color: #000000 !important;
}
.bootstrap-dialog.type-danger .bootstrap-dialog-title {
  /* color: #ffffff !important; */
}
.modal-dialog .modal-body {
padding: 20px 30px;
}
.bootstrap-dialog.type-info .modal-header{
  background-color: transparent !important;
padding: 20px 30px !important;
background: linear-gradient(#d4f9ff, #ffffff) !important;
border-bottom-color: #ecf2f5 !important;
font-weight: 700;
}
.bootstrap-dialog.type-warning .modal-header{
  background-color: transparent !important;
padding: 20px 30px !important;
background: linear-gradient(#ffe7d4, #ffffff) !important;
border-bottom-color: #f5f1ec !important;
font-weight: 700;
}
.bootstrap-dialog.type-primary .modal-header {
    background-color: transparent !important;
    padding: 20px 30px !important;
    background: linear-gradient(#d8d4ff, #ffffff) !important;
  border-bottom-color: #edecf5 !important;
  font-weight: 700;
}
.modal-footer {
border-top-color: #f5f0ed !important;
}
.modal-content {
border-radius: 10px !important;
}
.bootstrap-dialog .modal-header {
border-top-left-radius: 10px !important;
border-top-right-radius: 10px !important;
}
.modal-header .close {
margin-top: 0 !important;
}
.bootstrap-dialog.type-danger .modal-header {
    background-color: transparent !important;
    padding: 20px 30px !important;
background: linear-gradient(#ffcbcb, #ffffff) !important;
border-bottom-color: #f6eff3;
font-weight: 700;
}
.form-control:focus,
textarea:focus,
select:focus {
    border-color: #7255ff !important;
    box-shadow: 0 0 0 2px rgba(106,53,255,.12) !important;
}
.parsley-success,
select:focus  {
background: #f8f6ff!important;
border-color: #7255ff!important;
box-shadow: 0 0 0 2px rgba(106,53,255,.12) !important;
}

input,
select{
  transition: all .3s;
  color:#172033;
}
input:hover{
  border-color: #7255ff !important;
  box-shadow: 0 0 0 2px rgba(106,53,255,.12) !important;
}
img{
  /* pointer-events: none;
vertical-align: bottom;
user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none; */
}
.backSuccessStar{
  background: #deffe4;
  color: #1ecb58;
  border: 1px solid #89f19b;
  padding: 3px 10px;
  font-size: 10px;
  border-radius: 100px;
}
.backBlackStar{
  background: #000000;
  color: #ffcc9f;
  border: 1px solid #000000;
  padding: 3px 10px;
  font-size: 10px;
  border-radius: 100px;
}
.backAppStar{
  background: #eeecff;
  color: #3b14ff;
  border: 1px solid #c2b6fb;
  padding: 3px 10px;
  font-size: 10px;
  border-radius: 100px;
}
.backStopStar {
background: #ffd9e4;
color: #eb1e58;
border: 1px solid #ffb0c6;
padding: 3px 10px;
font-size: 10px;
border-radius: 100px;
}
.backWarningStar{
  background: #fff7ec;
color: #ff9814;
border: 1px solid #f4d3a3;
padding: 3px 10px;
font-size: 10px;
border-radius: 100px;
}
.dark .backSuccessStar{
  background: #0f2914;
  border: 1px solid #1a5925;
}
.dark .backWarningStar{
  background: #381a22;
  border: 1px solid #401e27;
}
.dark .backStopStar{
  background: #130e07;
border: 1px solid #382408;
}
.backErrorStar{
  background: #ffecec;
  color: #fa2f2f;
  border: 1px solid #f4a3a3;
  padding: 3px 10px;
  font-size: 10px;
  border-radius: 100px;
}
.orderChart{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(320px,.8fr);gap:16px;align-items:stretch;margin-bottom:16px}
.chartCard{background:#fff;border:1px solid rgba(238,241,247,.92);border-radius:14px;box-shadow:0 8px 24px rgba(34,45,80,.06);min-height:420px;overflow:hidden;padding:24px;display:flex;flex-direction:column;transition:transform .22s ease,box-shadow .22s ease}
.chartTitle{display:flex;justify-content:space-between;align-items:center;gap:12px;color:#1f2937;font-size:20px;font-weight:800;margin-bottom:18px;flex:0 0 auto}
.chartTitle span{white-space:nowrap}
.chartTitle small{color:#9aa3b5;font-size:13px;font-weight:normal;white-space:nowrap}
.orderChart  .chartBox{height:280px;position:relative;flex:0 0 auto}
.trendCard .chartBox{height:auto;min-height:334px;flex:1}
.analysis .chartBox{height:175px;flex:0 0 175px}
.analysisList{margin-top:20px;display:flex;flex:1;min-height:0;flex-direction:column;justify-content:space-between;gap:10px}
.analysisList .item{display:grid;grid-template-columns:82px 1fr 58px;align-items:center;gap:10px;font-size:13px;color:#596274}
.analysisList .analysis{height:10px;background:#edf1f7;border-radius:999px;overflow:hidden}
.analysisList  .analysis span{display:block;height:100%;background:linear-gradient(90deg,#5839fc,#c694fa);border-radius:999px}



@media (max-width: 1200px){
    .orderChart{grid-template-columns:1fr}
}

.dark .chartCard {
background: #09090a;
border: 1px solid #252e3d;
box-shadow: 0 8px 24px rgba(39, 9, 74, 0.31);
}
.dark .chartTitle {
color: #fff;
}
.dark .analysisList .analysis {
background: rgba(255, 255, 255, 0.12);
}

    #content .modal{padding:0!important;text-align:center;}
    /* #content .modal:before{content:'';display:inline-block;height:100%;vertical-align:middle;margin-right:-4px;} */
    #content .modal .modal-dialog{display:inline-block;float:none;text-align:left;vertical-align:middle;margin:20px auto;}
    #content .modal .modal-content{display:flex;flex-direction:column;max-height:95vh;}
    #content .modal .modal-header,
    #content .modal .modal-footer{flex:0 0 auto;}
    #content .modal .modal-body{flex:1 1 auto;max-height:calc(95vh - 120px);overflow-y:auto;}
    @media (max-width:767px){
        #content .modal:before{display:none;}
        #content .modal .modal-dialog{display:block;margin:10px;}
        #content .modal .modal-content{max-height:calc(100vh - 20px);}
        #content .modal .modal-body{max-height:calc(100vh - 150px);}
    }
.payWrap {
display: inline-flex;
align-items: center;
gap: 5px;
}

.payWrap .payIcon {
width: 18px;
height: 18px;
display: inline-block;
vertical-align: middle;
}
.tikuXxkData{
  border: 1px solid #e2e7eb;
}
.tikuXxkData .head {
background: #ffffff;
}
.tikuXxkData .head {
border-bottom: 2px solid #e2e7eb;
}
.tikuXxkData .head, .tikuXxkData .tbody .mk {
display: flex;
flex-direction: row;
/* justify-content: space-between; */
align-items: stretch;
}
.tikuXxkData .head .mk.title,
.tikuXxkData .tbody .mk .title {
width: 30%;
}
.tikuXxkData .head .mk.name,
.tikuXxkData .tbody .mk .name {
width: 70%;
}
.tikuXxkData .head .mk:not(:last-of-type), .tikuXxkData .tbody .mk .td:not(:last-of-type) {
border-right: 1px solid #e2e7eb;
}
.tikuXxkData .head .mk {
padding: 10px 15px;
font-weight: bold;
display: inline-block;
}
.tikuXxkData .tbody {
overflow-y: auto;
margin-right: -4px;
padding-right: 2px;
max-height: 280px;
}
.tikuXxkData .tbody .mk:not(:last-of-type) {
border-bottom: 1px solid #e2e7eb;
}
.tikuXxkData .tbody .mk:nth-of-type(odd) {
background-color: #f0f3f5;
}

.tikuXxkData .tbody .mk .title{
  display: flex;
  align-items: center;
}

.tikuXxkData .tbody .mk .td{
  /* display: flex; */
  /* justify-content: center; */
  align-items: center;
  /* text-align: center; */
  padding: 10px 15px;
}

.tikuXxkData .tbody::-webkit-scrollbar {
    overflow: visible;
    width: 2px;
    height: 8px;
}

.tikuXxkData .tbody::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.6);
	   background: #424b58;
    border-radius: 100px;
    min-height: 15px;
}

.tikuXxkData .tbody::-webkit-scrollbar-track {
    border-radius: 0;
    background-color: transparent;
}


/* 表格实现滚动条，并且滚动条在盒子外显示，不影响样式 */
.courseXxkData .head,
.courseXxkData .tbody .mk{
  /* display: grid;
  grid-template-columns: repeat(5, 1fr);
  cursor: pointer; */
  display: flex;
  flex-direction: row;
  /* justify-content: space-between; */
  /* 居中让线条不变 */
  align-items: stretch;
}
.courseXxkData .head .mk:not(:last-of-type),
.courseXxkData .tbody .mk .td:not(:last-of-type) {
  border-right: 1px solid #e2e7eb;
}
.courseXxkData .head{
  border-bottom: 2px solid #e2e7eb;
}
.courseXxkData .tbody .mk:not(:last-of-type) {
  border-bottom: 1px solid #e2e7eb;
}
.courseXxkData .tbody .mk .td{
  display: flex;
  /* justify-content: center; */
  align-items: center;
  /* text-align: center; */
  padding: 10px 15px;
}
.courseXxkData{
  border: 1px solid #e2e7eb;
}
.courseXxkData .head{
  background: #ffffff;
}
.courseXxkData .head .mk{
  padding: 10px 15px;
  font-weight: bold;
  display: inline-block;
}
.courseXxkData .head .mk.ok,
.courseXxkData .tbody .mk .td.ok{
  width: 15%;
}
.courseXxkData .head .mk.img,
.courseXxkData .tbody .mk .td.img{
  width: 15%;
}
.courseXxkData .head .mk.title,
.courseXxkData .tbody .mk .td.title{
  width: 30%;
}
.courseXxkData .head .mk.name,
.courseXxkData .tbody .mk .td.name{
  width: 15%;
}
.courseXxkData .head .mk.num,
.courseXxkData .tbody .mk .td.num{
  width: 25%;
}

.head, .tbody {
    /* 确保 padding 和 border 不改变盒子大小 */
    /* box-sizing: border-box;  */
}

.courseXxkData .tbody .mk:nth-of-type(odd) {
background-color: #f0f3f5;
}

.courseXxkData .tbody::-webkit-scrollbar {
    overflow: visible;
    width: 2px;
    height: 8px;
}

.courseXxkData .tbody::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.6);
	   background: #424b58;
    border-radius: 100px;
    min-height: 15px;
}

.courseXxkData .tbody::-webkit-scrollbar-track {
    border-radius: 0;
    background-color: transparent;
}
.courseXxkData .tbody {
    overflow-y: auto; /* 仅垂直方向滚动 */
    /* 为滚动条留出空间 */
    margin-right: -4px;
    /* 防止内容与滚动条重叠 */
    padding-right: 2px;
    max-height: 280px;
}
.backHead{
  display:flex;gap:10px;align-items:center;min-width:170px
}
.backHead img{
  width:38px;height:38px;border-radius:50%;object-fit:cover;background:#f3f4f8
}
.backImgAdd {
border: 1px dashed #feebe3;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
display: inline-block;
transition: border-color 0.3s ease;
}
.backImgAdd:hover {
border-color: #7255ff;
}
/* #page-container .content {
  overflow: hidden;
} */
.width-full{
  padding-bottom: 10px;
}

/* 避免刷新时候出现滚动条 */
.dataTables_wrapper{
  overflow: auto;
}
.dataTables_wrapper::-webkit-scrollbar {
    overflow: visible;
    width: 0;
    height: 0;
}
.dataTables_wrapper::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.6);
	background: #424b58;
    border-radius: 100px;
    min-height: 0;
}
.dataTables_wrapper::-webkit-scrollbar-track {
    border-radius: 0;
    background-color: transparent;
}
/* 避免刷新时候出现滚动条 */
.classTeacherXxk{
	/* 禁止复制 */
	user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
  cursor: pointer;
}
.classTeacherXxk .fm{
  display: inline-block;
  flex-shrink: 0;
  font-size: 0;
  position: relative;
  border-radius: 200px;
  overflow-x: hidden;
  overflow-y: hidden;
  cursor: pointer;
}
.classTeacherXxk .fm img{
  pointer-events: none;
}
.classTeacherXxk input:checked+span {
  position: absolute;
  bottom: 0px;
  color: #ffffff;
  text-align: center;
  height: 20px;
  line-height: 20px;
  cursor: pointer;
  font-weight: bold;
  background-color: rgba(33, 113, 251, 0.88);
  background: linear-gradient(to right, rgba(120, 51, 255, 0.88), rgba(70, 46, 255, 0.83));
  width: 100%;
  opacity: 0.9;
  font-size: 10px;
  left: 0;
}
.classTeacherXxk input{
  display: none;
}
.classTeacherXxk:hover .img-thumbnail{
  border: 1px solid #7255ff;
}
.classTeacherXxk input:checked~h6 {
    color: #7255ff;
}
.classTeacherXxk .active{
  color: #7255ff
}
.classTeacherXxk .fm .active{
  position: absolute;
  bottom: 0px;
  color: #ffffff;
  text-align: center;
  height: 20px;
  line-height: 20px;
  cursor: pointer;
  font-weight: bold;
  background-color: rgba(33, 113, 251, 0.88);
  background: linear-gradient(to right, rgba(120, 51, 255, 0.88), rgba(70, 46, 255, 0.83));
  width: 100%;
  opacity: 0.9;
  font-size: 10px;
  left: 0;
}
.domainXxk {
  display: inline-block;
  margin-bottom: 0;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  white-space: nowrap;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background: #7255ff;
  color: #ffffff;
  border-radius: 4px 0 0 4px;
}

.domainXxk .caret {
  color: #ffffff;
}

.domainList.dropdown-menu {
  padding: 0;
  border: none;
}

.domainList.dropdown-menu>li>a {
  padding: 10px 20px;
}
.helpTitle {
  display: block;
  color: #000000;
  margin: 0 0 10px 0;
  font-weight: bold;
  font-size: 12px;
}
.prohibitedWords textarea{
  font-size: 15px;
  padding: 10px 20px;
  border-radius: 10px;
  line-height: 25px;
  width: 100%;
  margin-top: 10px;
  font-weight: 350;
  color: #333333;
	border: 2px solid #dadeeb;
	transition: border-color 0.5s ease;
  box-sizing: border-box;
}
.prohibitedWords textarea[type="text"] {
  border: 2px solid #eee;
  transition: border-color 0.3s ease;
}
.prohibitedWords textarea:focus {
  border: 2px solid #7255ff;
}
.prohibitedWords textarea:hover{
  border: 2px solid #7255ff;
}
.prohibitedWords textarea::-webkit-scrollbar {
  width: 6px;
}
.prohibitedWords textarea::-webkit-scrollbar-thumb {
  background-color: #000000;
  border-radius: 100px;
}
.prohibitedWords textarea::-webkit-scrollbar-track {
  background-color: rgba(0, 0, 0, 0.1);
  border-radius: 100px;
}

/* 创建分享卡片预览 */
.hkBackCardShareDemo {
display: inline-block;
}
.hkBackCardShareDemo h3 {
font-size: 14px;
/* font-weight: normal; */
color: #333333;
margin-bottom: 3rem;
}
.hkBackCardShareDemo .demo {
display: flex;
justify-content: flex-start;
align-items: flex-start;
background: #f0f5fd;
padding: 3rem;
box-sizing: border-box;
border-radius: 1rem;
}
.hkBackCardShareDemo .head {
margin-right: 1.5rem;
width: 4rem;
height: 4rem;
border-radius: 0.5rem;
}
.hkBackCardShareDemo .info {
/* margin-top: 2rem; */
background: #ffffff;
padding: 2rem;
border-radius: 0.6rem;
width: 280px;
display: flex;
justify-content: space-between;
align-items: flex-start;
box-shadow: 3px 3px 15px 0 rgba(2, 37, 70, 0.09);
/* border: 1px solid #7255ff; */
/* border: 1px solid #99caff; */
position: relative;
}
.hkBackCardShareDemo .title {
text-align: left;
margin-right: 2rem;
box-sizing: border-box;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
max-width: 100%;
display: inline-block;
}
.hkBackCardShareDemo .info ::before {
position: absolute;
top: 1rem;
content: '';
border: 0.6rem solid transparent;
border-right-color: #ffffff;
left: -1.2rem;
/* box-shadow: 3px 3px 15px 0 rgba(2, 37, 70, 0.09); */
}
.hkBackCardShareDemo .title .title-text {
color: #3a424d;
font-size: 1.6rem;
font-weight: bold;
vertical-align: middle;
word-break: keep-all;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 100%;
display: inline-block;
}
.hkBackCardShareDemo .title .desc-text {
padding: 1rem 0 0 0;
margin: 0;
color: #a8b2c6;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
text-overflow: ellipsis;
}
.hkBackCardShareDemo img {
width: 5rem;
height: 5rem;
border-radius: 0.5rem;
}
/* 创建分享卡片预览结束 */

.courseXxkDataHead{
  border-radius: 3px 3px 0 0;
  background: #242a30;
  padding: 10px 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.courseXxkDataHead .name{
  display: flex;
  /* justify-content: space-between; */
  align-items: center;
  width: 100%;
}
.courseXxkDataHead .name code{
  margin-right: 10px;
}
.delIco{
  position: relative;
}
.delIco .ico{
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
}
.blackHead{
  background: #242a30;
  padding: 10px 15px;
  display: flex;
justify-content: space-between;
align-items: center;
border-radius: 2px;
}
.whiteText{
  color: #fff;
  margin: 0;
  padding: 0;
}




select.form-control, select[multiple].form-control {
border-color: #007fff;
border-radius: 10px;
height: 36px;
line-height: 36px;
padding: 0 20px;
background: #f2f5fa;
border: 1px solid #ebeff6;

cursor: pointer;
color: #000000;
}
.daterangepicker td.active, .daterangepicker td.active:hover {
background: #7255ff!important;
}
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
opacity: 1;
border-radius: 10px;
/* height: 40px; */
color: #000000;
line-height: 20px;
padding: 10px 20px;
background: #f2f5fa;
border: 1px solid #ebeff6;

cursor: pointer;
}
.form-control.date[disabled], .form-control.date[readonly], fieldset[disabled] .form-control.date {
height: 40px;
}
.form-control {
border: 1px solid #e6e0eb;
border-radius: 10px;
font-weight: normal;
font-size: 13px;
resize: vertical;
padding: 2px 15px;
line-height: 1.5;
font-size: inherit;
height: 38px;
line-height: 38px;
cursor: pointer;
color:#172033;
}
textarea.form-control{
  /* line-height: normal; */
}
.btn-group-sm>.btn, .btn-sm {
/* padding: 7px 15px !important; */
}


.hkDialog {
padding: 0px 20px;
}
.hkDialog .num input{
  border: 1px solid #d9dadd;
  padding: 10px 20px;
  border-radius: 10px;
  width: 100%;
  font-size: 16px;
    margin-top: 10px;
  color: #000000;
	border: 2px solid #dadeeb;
	transition: border-color 0.5s ease;
  box-sizing: border-box;
  height: 47px;
}
textarea{
  border: 1px solid #d9dadd;
  padding: 10px 20px;
  border-radius: 10px;
  width: 100%;
  font-size: 16px;
  color: #000000;
	border: 2px solid #dadeeb;
	transition: border-color 0.5s ease;
  box-sizing: border-box;
}
.hkDialog .switch{
	align-items: center;
	display: flex;
	justify-content: space-between;
	padding: 10px 0;
}
textarea, input:focus {
  outline: none;
  box-shadow: none;
}
.hkDialog .num input[type="text"],
.hkDialog .num textarea[type="text"] {
  border: 2px solid #eee;
  transition: border-color 0.3s ease;
}
.hkDialog .num input:focus,
input:not(:empty) {
  border: 2px solid #7255ff;
}
.hkDialog .num textarea:focus,
.hkDialog .num textarea:not(:empty) {
  border: 2px solid #7255ff;
}

.hkDialog .num input:hover, .hkDialog .num textarea:hover{
  border: 2px solid #7255ff;
}
.fmImg {
width: 30px;
height: 30px;
border-radius: 5px;
margin-right: 5px;
}
.hkDialog .titleTips{
  font-weight: 500;
  color: #242a30;
  font-size: 14px;
  margin: 10px 0;
  border-bottom: 1px solid #eee;
padding-bottom: 20px;
}
.hkDialog .titleTips .color{
  background: linear-gradient(to right, #ff88cc, #eb0c7e);
color: #fff;
padding: 2px 5px;
margin: 0 5px;
border-radius: 5px;
line-height: normal;
font-weight: normal;
}

/* 右上角暗黑主体切换效果 */
.drakSwtich .hkSwtichHideSlider:before{
    display: none;
}
.drakSwtich input:checked+.hkSwtichHideSlider,
.dark .drakSwtich input:checked+.hkSwtichHideSlider {
    -webkit-transform: translateX(17px);
    -ms-transform: translateX(17px);
    transform: translateX(17px);
        background-color: #f0e68c;
        background: linear-gradient(to right, #fffef5, #f0e68c);
}
.drakSwtich .hkSwtichHideSlider {
    position: relative;
    width: 17px;
    height: 17px;
    background-color: #a6a6a6;
    border-radius: 50%;
    display: block;
    transition: all 0.5s;
    top: 2px;
    left: 4px;
    /* box-shadow: 0 0 60px #fffacd, 0 0 30px #fffacd inset; */
}
.hkSwtichHideBtn.drakSwtich {
  background: #16202a;
    background: #fff;
  border: 1px solid #eee;
  border-radius: 100px;
  overflow: hidden;
}
.drakSwtich .hkSwtichHideSlider::after {
    content: '';
    position: absolute;
    top: -2px;
    right: -4px;
    width: 17px;
    height: 17px;
    background-color: #16202a;
    background-color: #fff;
    border-radius: 50%;
}
.drakSwtich input:checked+.hkSwtichHideSlider::after{
    left: -5px;
    right: auto;
}
.dark .helpTips {
color: #a6a6a6;
}
.dark .bootstrap-dialog.type-primary .modal-header {
border-bottom-color: #202020 !important;
}
.dark .modal-footer {
border-top-color: #202020 !important;
}
.dark .table > tbody > tr.info > td,
.dark .table > tbody > tr.info > th,
.dark .table > tbody > tr > td.info,
.dark .table > tbody > tr > th.info,
.dark .table > tfoot > tr.info > td,
.dark .table > tfoot > tr.info > th,
.dark .table > tfoot > tr > td.info,
.dark .table > tfoot > tr > th.info,
.dark .table > thead > tr.info > td,
.dark .table > thead > tr.info > th,
.dark .table > thead > tr > td.info,
.dark .table > thead > tr > th.info {
background: rgb(35, 37, 42) !important;
}
.dark .table-hover>tbody>tr:hover>td, .table-hover>tbody>tr:hover>th {
background: #2b3541!important;
}
.dark .hkSwtichHideBtn.drakSwtich {
    background: #0e1112;
    border: 1px solid rgba(255, 255, 255, 0.25);
}
.dark .drakSwtich .hkSwtichHideSlider::after {
    background-color: #0e1112;
}
/* 右上角暗黑主体切换效果 */
.content.content-full-width .page-header{
  margin: 0 0 20px !important;
}
.backPadding{
  padding: 20px 25px 0 25px;
}
.backPapaerNum{
  border-top: 1px solid #e2e7eb;
  /* bottom: 0; */
  box-shadow: 0 -1px 5px 0 rgba(0, 243, 255, 0.1);
  background: #ffffff;
  padding: 15px 25px;
}
.backPapaerNum .pagination{
  margin: 0
}
.blackTitle{
  font-weight: bold;
font-size: 13px;
padding-bottom: 5px;
color: rgb(0, 0, 0);
}
.btn-scroll-to-top {
bottom: 55px !important;
}
.page-content-full-height .content {
  /* 设置吸底页码后必须设置这个，否则页面的弹窗在下层 */
-webkit-transform: none !important;
/* 必须为0，默认是-1，-1会导致页面整体有滚动条 */
bottom: 0 !important;
}
.middleBorder{
  border-left: 1px solid #eee;
  border-right: 1px solid #eee;
}
.thumbnail {
border-radius: 10px !important;
}

.form-inline .btn.btn-primary,
.form-inline .btn.btn-white,
.form-inline .btn.btn-success,
.form-inline .btn.btn-info,
.form-inline .btn.btn-warning,
.form-inline .btn.btn-danger{
  padding: 6px 15px;
  border-radius: 10px !important;
}

.form-inline .table .btn.btn-primary,
.form-inline .table .btn.btn-white,
.form-inline .table .btn.btn-success,
.form-inline .table .btn.btn-info,
.form-inline .table .btn.btn-warning,
.form-inline .table .btn.btn-danger{
  padding: 5px 10px;
  border-radius: 10px;
}

.toast.toast-success,
.toast.toast-error {
  background-color: #ffffff !important;
  border: 2px solid #ffffff !important;
  color: #000000 !important;
}
.contentBox{
  border: 1px solid #e6e0eb;
  padding: 10px;
  border-radius: 5px;
  line-height: 1;
}

/* 阿里云视频列表的三级分类展开 */
.hkAliyunVodType{
  display: inline-block;
  position: relative;
  /* 居中 */
  vertical-align: middle;
}
.hkAliyunVodType .name{
  display: inline-block;
  border-radius: 10px;
  height: 38px;
  line-height: 38px;
  padding: 0 20px;
  /* background: #faf7f2; */
  border: 1px solid #ebeff6;
  cursor: pointer;
  color: #000000;
  transition: all 0.3s linear;

	/* 禁止复制 */
	user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}
.videoTypeData.active {
  opacity: 1;
  visibility: visible;
  transform: translate(0);
}
.videoTypeData {
  font-size: 14px;
  position: absolute;
  top: 38px;
  left: 0;
  /* 核心调整：摆脱父级宽度限制 */
  width: auto;               /* 宽度由内容决定 */
  min-width: 0;              /* 清除可能的最小宽度继承 */
  max-width: none;           /* 取消最大宽度限制 */
  white-space: nowrap;       /* 防止文本换行（可选，根据内容需求） */
  /* 如果内容需要换行，用这个替代white-space */
  /* white-space: normal; */
  /* display: inline-block; */
  border: 1px solid #eaeaec;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease, transform .3s ease;
  box-sizing: border-box;
  transform: translateY(-10%);
  background: #fff;
  line-height: normal;
  border-radius: 5px;
  font-size: 12px;
  text-align: left;
  padding: 10px 0;
  /* 关键：确保不受父级overflow影响 */
  z-index: 10;

  max-height: 400px;
  overflow-y: auto;
}

.videoTypeData::-webkit-scrollbar {
    overflow: visible;
    width: 6px;
    height: 8px;
}

.videoTypeData::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.8);
	background-color: #7255ff;
    border-radius: 100px;
    min-height: 15px;
}

.videoTypeData::-webkit-scrollbar-track {
    border-radius: 0;
    background-color: transparent;
}
.vipTextIco{
  background: linear-gradient(233deg, rgb(81, 51, 4), rgb(0, 0, 0));
  color: #fff;
  font-size: 10px;
  padding: 3px 10px;
  border-radius: 100px;
  color: #ffc76a;
  line-height: 1;
}
.freeTextIco{
  background: linear-gradient(233deg, rgb(242, 246, 255), rgb(228, 231, 254));
  color: #fff;
  font-size: 10px;
  padding: 3px 10px;
  border-radius: 100px;
  color: #9798aa;
  line-height: 1;
}
.categoryText{
  height: 35px;
  line-height: 35px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  /* padding: 0 20px; */
}
.categoryText.active{
  background: #e5efff;
  color: #7255ff;
}
.categoryText .horn{
	cursor: pointer;
  position: relative;
  /* margin-left: 20px; */
  /* 为了让点击面积变大 */
  width: 40px;
  height: 20px;
  display: inline-block;
}
.categoryText .horn::after {
  content: '';
  position: absolute;
  right: 20px;
  top: 6px;
  width: 8px;
  height: 8px;
  border-top: 1px solid #000000;
  border-right: 1px solid #000000;
  transform: rotate(45deg);
  transition: all 0.3s linear;
	cursor: pointer;
}
.categoryText .horn.active::after {
  transform: rotate(135deg);
  top: 3px;
}
.videoTypeData .subset{
  /* padding-left: 20px; */
  /* 想给展开后的盒子加一个过渡平滑动画，这样不生效，因为是none的效果盒子 */
  transition: all 0.3s linear;
}
.categoryText span{
  display: block;
  /* margin-right: 20px; */
  padding-right: 20px;
  padding: 0 20px;
  width: 100%;
  position:relative;
}
.categoryText.one span{
  padding-left: 40px;
}
.categoryText.two span{
  padding-left: 60px;
}
.categoryText:hover{
  background: #f2f3fb;
}


.categoryText.active span::after {
  content: '';
  position: absolute;
  right: 5px;
  top: 10px;
  width: 6px;
  height: 12px;
  border: solid #7255ff;
  border-width: 0 2px 2px 0; /* 只保留右侧和底部边框形成线条 */
  transform: rotate(45deg); /* 旋转45度形成对勾角度 */
  transition: opacity 0.3s ease; /* 显示动画 */
    opacity: 1; /* 显示对勾 */
}

/* 下面更精准的写法（推荐）：直接定位父元素下的关系 */
.hkAliyunVodType .videoTypeData.active ~ .name,
.hkAliyunVodType:has(.videoTypeData.active) .name,
.hkAliyunVodType .name:hover {
  color: #7255ff;
border: 1px solid #7255ff;
}
.hkAliyunVodType:has(.videoTypeData.active) {
  /* border: 1px solid #7255ff; */
}



/* 阿里云视频列表的三级分类展开结束 */

/* 自定义每页xxx条UI */
.hk-form-control {
    position: relative;
    display: inline-block;
    margin: 0 20px 0 10px;
}
.hk-form-control::after {
    content: "\f078"; /* Font Awesome 向下箭头图标 */
    font-family: "FontAwesome";
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none; /* 确保点击箭头也能触发select */
    color: #666;
}
select.form-control:hover {
    border-color: #888;
}
select.form-control:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(65, 24, 230, 0.3);
}
.alivideoListHeightAuto{
    height: auto !important;
    overflow: initial !important;
}

.navbar.navbar-inverse {
background: #ffffff;
box-shadow: 0 3px 12px rgba(32,44,70,.05);
}
.gradient-enabled .header.navbar.navbar-inverse .navbar-header .navbar-brand {
color: #000000 !important;
 background: #fff !important;
 border-radius: 0;
 box-shadow: none;
}
.has-sub.active a i {
color: #fff !important;
}
.text-theme, .sidebar .sub-menu > li.active > a:before{
color: #5947ea !important;
}
.sidebar .active .pull-right.fa.fa-angle-right {
color: #fff !important;
}
.navbar.navbar-inverse .navbar-brand, .navbar.navbar-inverse .navbar-nav>li>a {
color: #000000 !important;
}
.dark .navbar.navbar-inverse .navbar-brand, .dark .navbar.navbar-inverse .navbar-nav>li>a {
color: #fff !important;
}
.dark .sidebar .nav>li.nav-header {
color: #595b5c;
}
.sidebar .nav>li.nav-profile {
background: #ffffff;
/* background: #f0f3f4; */
color: #111;
}
#page-container .sidebar, #page-container .sidebar-bg, .sidebar, .sidebar-bg {
background: #ffffff !important;
}
.sidebar .nav>li>a {
color: #000;
}
.gradient-enabled .navbar.navbar-inverse .navbar-brand,
.gradient-enabled .sidebar .nav > li.active > a,
.gradient-enabled .sidebar .nav > li.active > a:focus,
.gradient-enabled .sidebar .nav > li.active > a:hover,
.gradient-enabled.page-sidebar-minified .sidebar .nav > li.has-sub.active:focus > a,
.gradient-enabled.page-sidebar-minified .sidebar .nav > li.has-sub.active:hover > a,
.gradient-enabled.page-sidebar-minified .sidebar .nav > li.has-sub.active > a,
.gradient-enabled .label.label-theme,
.gradient-enabled .btn.btn-scroll-to-top{
background: #ffffff !important;
background: #f2f3f6 !important;
color: #7255ff !important;

background: #7255ff !important;
background: linear-gradient(to right,#7255ff,#0054ff) !important;
color: #fff !important;;
font-weight: normal;
border-radius: 10px;
box-shadow: 0 6px 10px rgba(33, 113, 251, 0.33);

background: linear-gradient(to right, #5839fc, #c694fa) !important;
box-shadow: 0 6px 10px rgba(62, 33, 251, 0.33);
}


.gradient-enabled .top-menu .nav > li.active > a,
.gradient-enabled .top-menu .nav > li.active > a:focus,
.gradient-enabled .top-menu .nav > li.active > a:hover {

color: #fff !important;;
font-weight: normal;
border-radius: 0;

background: linear-gradient(to right, #5839fc, #c694fa) !important;
box-shadow: 0 6px 10px rgba(62, 33, 251, 0.33);
}
.gradient-enabled .sidebar .nav > li.active > a:hover i{
  /* color: #fff !important; */
}

.sidebar .nav .sub-menu .has-sub {
  position: relative;
}
.sidebar .nav .sub-menu .has-sub.active .sub-menu .has-sub.active .caret.pull-right{
  transform: rotate(135deg);
}
.sidebar .nav .sub-menu .caret.pull-right {
  content: "";
  position: absolute;
  right: 30px;
  top: 6px;
  width: 6px;
  height: 6px;
  border-top: 1px solid #666666;
  border-right: 1px solid #666666;
  transform: rotate(45deg);
  transition: all .3s linear;
  border-left: none;
}
.sidebar .nav>li>a {
padding: 10px 20px;
}
#page-container .sidebar.sidebar-grid .nav>li>a, sidebar.sidebar-grid .nav>li>a {
border-bottom: 1px solid transparent !important;
border-top: 1px solid transparent !important;
transition: all 0.3s;
}
.sidebar .nav>li.expand>a, .sidebar .nav>li>a:focus, .sidebar .nav>li>a:hover {
background: #eff1f4;
color: #7255ff;
border-radius: 10px;
background: #fff;
box-shadow: 0 0 14px rgba(47, 62, 180, 0.28);
position: relative;
z-index: 1;
color: #5947ea;
}
.sidebar .nav>li.expand>a i, .sidebar .nav>li>a:focus i, .sidebar .nav>li>a:hover i {
color: #7255ff !important;
color: #5947ea !important;
color: #5947ea !important;
}
.sidebar .has-sub.active.expand i{
  color: #fff !important;
}
.sidebar .nav>li.active>a:hover i{
  color: #fff !important;
}
.sidebar .sub-menu {
background: #fafafa;

}
.sidebar .nav>li li.has-sub.active>a {
color: #5947ea;
background: linear-gradient(to right, #f2f2fe, #fcfbff);
}
.sidebar .has-sub.active>.sub-menu {
padding: 10px 0 10px 30px;
}
.sidebar .nav>li.nav-profile .info{
  color: #000;
}
.sidebar .sub-menu>li>a {
color: #595959;
padding: 8px 20px;
font-weight: normal;
}
.sidebar .sub-menu>li>a:before {
color: #b8bccf;
content: '\f10c' !important;
}
.sidebar .sub-menu:before {
background: #ececec;
}
.sidebar .sub-menu>li.active>a, .sidebar .sub-menu>li.active>a:focus, .sidebar .sub-menu>li.active>a:hover, .sidebar .sub-menu>li>a:focus, .sidebar .sub-menu>li>a:hover {
color: #7255ff;
color: #5947ea;
background: #f2f2fe;
background: linear-gradient(to right, #f2f2fe, #fcfbff) ;
}
.sidebar-minify-btn {
background: #ebebeb;
}
.sidebar .nav>li>a i {
color: #000;
}
.pull-right.fa.fa-angle-right{
  font-size: 18px;
color: #c6c6c6;
}
.sidebar .nav>li.nav-profile .info small {
color: #a2a2a2;
font-size: 10px;
padding-top: 5px;
}
.slimScrollBar, .slimScrollRail{
  opacity: 0.1 !important;
}
.hideClassCourseSwtich{
  padding: 15px 0px;
display: flex;
align-items: center;
border-bottom: 1px solid #eee;
border-top: 1px solid #eee;
margin: 20px 0;
}
.backDataChart {
  display: grid;
  grid-template-columns: repeat(5,1fr);
  gap: 15px;
  margin-bottom: 15px;
}
.backDataChart .mk {
background: #fff;
/* border: 1px solid #e8edf5; */
border-radius: 16px;
padding: 17px 18px;
box-shadow: 0 3px 12px rgba(32,44,70,.05);
display: flex;
/* justify-content: space-between; */
align-items: center;
}
.backDataChart .mk .title{
display: block;
color: #6b7688;
font-size: 13px;
font-weight: normal;
margin: 0;
text-align: left;
padding: 0;
}
.backDataChart .mk .num {
display: block;
font-size: 23px;
color: #18233a;
font-weight: 700;
margin-top: 5px;
height: 30px;
}
.backDataChart .mk .num .unit{
  font-size: 13px;
font-weight: normal;
color: #6b7688;
}
.backDataChart .mk .ico{
margin-right: 15px;
}
.backDataChart .mk .ico img{
width: 50px;
height: 50px;
}



/* 加载容器 */
.backDataChart .mk   .loadingDot {
  display: flex;
  gap: 6px;
  margin-top: 5px;
  height: 30px;
  display: flex;
justify-content: center;
align-items: center;
}
/* 单个圆点 */
.backDataChart .mk   .loadingDot span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: linear-gradient(135deg, #6547ff, #9271ff);
  animation: bounce 1.4s infinite ease-in-out both;
}
/* 依次延迟动画 */
.backDataChart .mk .loadingDot span:nth-child(1) { animation-delay: -0.32s; }
.backDataChart .mk   .loadingDot span:nth-child(2) { animation-delay: -0.16s; }

@keyframes bounce {
  0%, 80%, 100% { transform: scale(0.7); opacity: 0.5; }
  40% { transform: scale(1); opacity: 1; }
}

.dark .bootstrap-dialog.type-danger .modal-header{
  background: linear-gradient(#1a0000, #0d0b0b) !important;
  border-bottom-color: #161313;
}
.dark .type-danger .modal-footer{
  border-top-color: #161313;
}
.dark .modal-body {
color: #fff;
}
.dark .type-danger .modal-content {
background-color: #080707;
}
.dark .hkDialog .titleTips {
color: #fff;
border-bottom: 1px solid #282828;
}
.dark .hkDialog .num input,
.dark .hkDialog .num textarea {
border: 2px solid #252935;
background: #1e2329;
color: #fff;
}
.dark .emptyStatus {
background: #000000;
color: #e3e3e3;
}
.dark .parsley-error {
background: rgba(0, 0, 0, 0)!important;
}
.dark .form-control:focus {
border-color: #7255ff !important;
}
.dark input:checked+.hkSwtichHideSlider{
  background: linear-gradient(to right, #ff8e48, #ff2eb3);
}
.dark .hkSwtichHideSlider:before {
background-color: rgba(255, 255, 255, 0.87);
}
.dark .contentBox {
border: 1px solid #282828;
}

.dark .sidebar .sub-menu>li.active>a,
.dark .sidebar .sub-menu>li.active>a:focus,
.dark .sidebar .sub-menu>li.active>a:hover,
.dark .sidebar .sub-menu>li>a:focus,
.dark .sidebar .sub-menu>li>a:hover,
.dark .sidebar .nav>li li.has-sub.active>a {
color: #8a71ff;
background: linear-gradient(to right, #231f36, rgba(48, 36, 85, 0));
}
.dark .hideClassCourseSwtich{
border-bottom: 1px solid #282828;
border-top: 1px solid #282828;
}
.dark .classTeacherXxk input:checked+span,
.dark .classTeacherXxk .fm .active {
background: linear-gradient(to right, #ffd448, #ff2eb3) !important;
background: linear-gradient(to right, rgba(255, 212, 72, 0.78), rgba(255, 46, 179, 0.81)) !important;
color: #000;
}
.dark .classTeacherXxk input:checked~h6,
.dark .classTeacherXxk .active {
color: #7255ff;
}
.dark .classTeacherXxk:hover .img-thumbnail {
border: 1px solid #7255ff;
}
.dark .gradient-enabled .header.navbar.navbar-inverse .navbar-header .navbar-brand {
color: #ffffff !important;
background: #0e1112 !important;
}
.dark .sidebar .nav>li.nav-profile .info {
color: #fff;
}
.dark .sidebar .nav>li>a,
.dark .sidebar .nav>li>a i {
color: #ebebeb;
}
.dark .sidebar .nav .active i {
color: #fff !important;
}
.dark .sidebar .nav>li.expand>a i,
.dark .sidebar .nav>li>a:focus i,
.dark .sidebar .nav>li>a:hover i,
.dark .sidebar .nav .active a:hover i {
color: #fff !important;
}
.dark .sidebar .nav>li>a {
color: #fff !important;
}
.dark .sidebar .sub-menu {
background: #0e0e0e !important;
}

.dark .gradient-enabled .navbar.navbar-inverse .navbar-brand,
.dark .gradient-enabled .sidebar .nav > li.active > a,
.dark .gradient-enabled .sidebar .nav > li.active > a:focus,
.dark .gradient-enabled .sidebar .nav > li.active > a:hover,
.dark .gradient-enabled.page-sidebar-minified .sidebar .nav > li.has-sub.active:focus > a,
.dark .gradient-enabled.page-sidebar-minified .sidebar .nav > li.has-sub.active:hover > a,
.dark .gradient-enabled.page-sidebar-minified .sidebar .nav > li.has-sub.active > a,
.dark .gradient-enabled .label.label-theme,
.dark .gradient-enabled .btn.btn-scroll-to-top,
.dark .gradient-enabled .top-menu .nav > li.active > a,
.dark .gradient-enabled .top-menu .nav > li.active > a:focus,
.dark .gradient-enabled .top-menu .nav > li.active > a:hover,
.dark .sidebar .nav>li.expand>a,
.dark .sidebar .nav>li>a:focus,
.dark .sidebar .nav>li>a:hover {
background: linear-gradient(to right, #5b3fff, #933fff) !important;
    color: #fff !important;
}

.dark .sidebar .sub-menu:before {
background: #181717;
}
.dark .sidebar .sub-menu>li>a:before {
color: #c7c7c7;
}
.dark .sidebar .sub-menu>li>a {
color: #e2e2e2;
}
.dark .sidebar-minify-btn {
background: #000000;
}

/* 暗黑主题 */

body.dark{
  background: #101113;
}
/* 页面加载的时候会有一个白色背景，改为黑背景色 */
/* 不过这样还是无效，页面会先渲染，页面的速度高于渲染dark接口的速度 */
/* 只能是改成下面那种了，无论是否暗黑都是黑色加载，改成透明后也不好 */
.dark #page-loader {
  background: #161a1b;
}
#page-loader {
  /* background: transparent;
  background: #161a1b; */
}
.dark .panel-inverse>.panel-heading {
  background: #282d31;
}

body.dark .page-header {
  color: #ffffff;
}
.dark .blackTitle {
  color: #ffffff;
}
.dark .toast-success,
.dark .toast-error {
  background-color: #0d0d0d;
  border: 2px solid #121212;
}
.dark .backPapaerNum {
  border-top: 1px solid #0e0f12;
  box-shadow: 0 -1px 5px 0 rgba(1, 5, 75, 0.1);
  background: #0e0f12;
}
.dark .breadcrumb>li a {
  color: #cfcfcf;
}
.dark .panel{
  background: #111518;
}
.dark .papaerNum {
  color: #979aa2;
}
.dark .table>thead>tr>th {
  color: #fff;
  border-bottom: 2px solid rgba(0, 0, 0, 0.15)!important;
}
.dark .alert.alert-info {
  background: #070f12;
  color: #5981be;
}
/* 右上角刷新元素暗黑模式下 */
.dark .panel.panel-loading .panel-body .panel-loader {
  background: #161a1b !important;
}
.dark .form-control {
  border: 1px solid #252935;
  background: #1e2329;
  color: #cfcfcf;
  border-radius: 10px;
}
.dark .middleBorder{
  border-left: 1px solid #1f2328;
  border-right: 1px solid #1f2328;
}
.dark .table {
  border-color: rgba(255, 255, 255, 0.05);
}
.dark .table>tbody>tr>td,
.dark .table>tbody>tr>th,
.dark .table>tfoot>tr>td,
.dark .table>tfoot>tr>th,
.dark .table>thead>tr>td,
.dark .table>thead>tr>th {
  border-color: rgba(0, 0, 0, 0.14);
  color: #bcbcc6;
}
.dark .pagination>.active>a,
.dark .pagination>.active>a:focus,
.dark .pagination>.active>a:hover,
.dark .pagination>.active>span,
.dark .pagination>.active>span:focus,
.dark .pagination>.active>span:hover {
  background: #7255ff!important;
  border-color: #7255ff!important;
  color: #000;
}
.dark .pagination>.disabled>a,
.dark .pagination>.disabled>a:focus,
.dark .pagination>.disabled>a:hover,
.dark .pagination>.disabled>span,
.dark .pagination>.disabled>span:focus,
.dark .pagination>.disabled>span:hover {
  color: #797e85;
  background-color: #242a32;
  border-color: #ddd;
}
.dark .pager>.disabled>a,
.dark .pager>.disabled>span,
.dark .pagination>.disabled>a,
.dark .pagination>.disabled>a:focus,
.dark .pagination>.disabled>a:hover, .pagination>.disabled>span,
.dark .pagination>.disabled>span:focus,
.dark .pagination>.disabled>span:hover {
  border-color: #353a40;
}
.dark .pagination>li>a,
.dark .pagination>li>span {
  background-color: #13161d;
}
.dark #page-container .sidebar.sidebar-grid .nav>li>a,
.dark sidebar.sidebar-grid .nav>li>a {
  border-bottom: 1px solid #13191b !important;
  border-top: 1px solid #17181d !important;
  /* background: #0e0f12; */
}
.dark #page-container .sidebar,
.dark #page-container .sidebar-bg,
.dark .sidebar, .sidebar-bg {
  background: #0e0f12 !important;
  /* width: 220px; */
}
.dark .sidebar .sub-menu {
  background: #000000;
}
.dark .pager li>a, .pager li>span,
.dark .pagination>li>a {
  border-color: #353a40;
}
.dark .pagination>li>a {
  color: #5f666e;
}
.dark .table-striped>tbody>tr:nth-child(odd)>td,
.dark .table-striped>tbody>tr:nth-child(odd)>th {
  background: #1e2329;
}
.dark .navbar.navbar-inverse {
  background: #0e1112;
}
.dark .sidebar .nav>li.nav-profile {
  background: #101113;
}
.dark .dropdown-menu {
  background-color: #0e1112;
}
.dark .dropdown-menu>li>a {
  color: #cfcfcf;
}
.dark .navbar-nav>li>.dropdown-menu {
  border-top: 1px solid #1c1c1c;
}
.dark .dropdown-menu .divider {
  border-color: #1c1c1c;
}
.dark .dropdown-menu .divider {
  background-color: #1c1c1c;
}
.dark .dropdown-menu>li>a:focus, .dark .dropdown-menu>li>a:hover {
  background: #1e2329;
}
.dark .nav>li>a:focus,
.dark .nav>li>a:hover {
  color: #e1e1e1;
  background: #3a424a;
}
.dark .btn-group-sm>.btn,
.dark .btn-sm {
  border-radius: 10px;
}
.dark #content .dataTables_wrapper::-webkit-scrollbar-thumb {
background: rgba(255, 255, 255, 0.09);
}
.dark #content .dataTables_wrapper::-webkit-scrollbar-track {
background: rgba(0, 0, 0, 0);
}
.dark .btn.btn-default {
  background: #3c5555;
  border-color: #3c5555;
}
.dark .btn.btn-success {
  color: #c7e9da;
  background: #043c3c;
  border-color: #003939;
}
/* .dark .btn.btn-primary {
  color: #fff;
background: linear-gradient(to right, rgb(106, 91, 250), rgb(133, 129, 253)) !important;
}
.dark .btn.btn-primary:hover{
background: linear-gradient(to right, #ffb300, #fff) !important;
} */
.dark .ttsContent .card .info {
background: rgba(255, 255, 255, 0);
}
.dark .ttsContent .card .audio {
border: 1px solid rgba(237, 240, 247, 0.22);
background: rgba(249, 250, 252, 0);
color: #c6c3e0;
}
.dark .ttsContent {
border: 1px solid #252935;
background: rgba(0, 0, 0, 0);
}
.dark .ttsContent .card {
border: 1px solid #252935;
background: linear-gradient(to right, rgb(35, 31, 54), rgba(48, 36, 85, 0));
}
.dark .ttsContent .ttsType {
background: linear-gradient(to right, rgb(35, 31, 54), rgba(48, 36, 85, 0));
border-right-color: #2d3337;
}
.dark .ttsContent .ttsType .name:hover {
background: rgba(255, 255, 255, 0.05);
}
.dark .ttsContent .card:hover {
border-color: #8f7cff;
}
.dark .ttsContent .name {
color: #fff;
}
.dark .ttsContent .ttsType .name {
color: rgba(255, 255, 255, 0.88);
}
.dark .btn.btn-white {
  font-weight: 400;
  color: #c2c2c2;
  background: #111518;
  border-color: #2d3337;

  color: rgba(255, 255, 255, 0.9);
background: rgba(17, 21, 24, 0);
border-color: rgba(255, 255, 255, 0.16);
}
.dark .btn-white.active,
.dark .btn-white:active,
.dark .btn-white:focus,
.dark .btn-white:hover,
.dark .open .dropdown-toggle.btn-white {
  background: #2a3034;
}
.dark .nav-tabs {
  background: #191d20;
}
.dark .nav-tabs.nav-justified>.active>a,
.dark .nav-tabs.nav-justified>.active>a:focus,
.dark .nav-tabs.nav-justified>.active>a:hover,
.dark .nav-tabs>li.active>a,
.dark .nav-tabs>li.active>a:focus,
.dark .nav-tabs>li.active>a:hover {
  color: #ffffff;
}
.dark .nav-tabs>li.active>a,
.dark .nav-tabs>li.active>a:focus,
.dark .nav-tabs>li.active>a:hover {
  background-color: #0e1012;
}
.dark .well {
  background: #111518;
  background: rgba(17, 21, 24, 0);
  border: 1px solid #1f2328;
}
.dark textarea {
  border: 2px solid #252935;
  background: #1e2329;
  color: #cfcfcf;
  border-radius: 10px;
}
.dark #content .btn.btn-white {
border: 1px solid #252935;
border-color: #252935;
}
.dark .ant-input {
border-color: #252935;
color: #fff;
background-color: rgba(0, 0, 0, 0);
}
.dark .ant-select-selection--single {
border-color: #252935;
color: #ffffff;
background: rgba(0, 0, 0, 0);
}
.dark .form-horizontal.form-bordered .form-group>div {
  border-left: 1px solid #1f2328;
}
.dark .ant-select-dropdown-menu-item {
color: rgba(255, 255, 255, 0.65);
}
.dark .ant-select-dropdown-menu-item-selected{
background: #7451d5!important;
color: #fff!important;

}
.dark .ant-select-dropdown{
  background-color: #1f2328;
}
.dark .ant-select-dropdown-menu-item-active, .dark .ant-select-dropdown-menu-item:hover {
background: #7451d5!important;
color: #ffffff!important;
}
.dark .ant-select-selection-selected-value {
color: #fff;
}
.dark #content .form-group {
border-color: #1f2328;
}
.dark .backDataChart .mk{
  background: rgba(0, 0, 0, 0);
border: 1px solid #252935;
box-shadow: 0 3px 12px rgba(78, 6, 232, 0.15);
}
.dark .backDataChart .mk .title {
color: rgba(255, 255, 255, 0.7);
}
.dark .backDataChart .mk .num {
color: #fff;
}
.dark .form-horizontal.form-bordered .form-group {
  border-bottom: 1px solid #1f2328;
}
.dark legend {
  color: #fff;
  border-bottom: 1px solid #1f2328;
}
.dark .form-horizontal.form-bordered .form-group>.control-label {
  border-right: 1px solid #1f2328;
  color: #cccccc;
}
.dark .hkTypeXxk span {
  background: rgba(49, 32, 131, 0.08);
  border: 1px solid #252935;
  color: #f6f2ff;
}
.dark .hkTypeXxk span:after {
  border: 3px solid #7255ff;
    border: 3px solid #0e151b;
  background: #0e151b;
border: 3px solid #c694fa;
}
.dark .hkTypeXxk span:hover {
  background: #1b1b1b;
}
.dark .hkTypeXxk input:checked+span{
  color: #000;
}
.dark .hkTypeXxk span:hover:after {
  border: 3px solid #7255ff;
  background: #1c252e;
    border: 3px solid #c694fa;
  background: #000000;
}
.dark .hkTypeXxk input:checked+span:hover:after {
    border: 3px solid #000000;
}
.dark .hkSwtichHideSlider {
  background-color: #272e33;
}
.dark .img-thumbnail {
  background-color: #1e1e29;
  border: 1px solid #252935;
}
.dark h1, .dark h2, .dark h3, .dark h4, .dark h5, .dark h6 {
  font-weight: 500;
  color: #c9c9c9;
}
.dark .panel-title{
  color: #dadada;
}
.dark .thumbnail {
  background-color: #111518;
  border: 1px solid #272e33;
}
.dark hr {
  border-top: 1px solid #272e33;
}
.dark .bwizard-steps li {
  background: #19181f!important;
  box-shadow: 0 6px 10px rgba(115, 115, 115, 0.05);
}
.dark .bwizard-steps li.active,
.dark .bwizard-steps li.active:focus,
.dark .bwizard-steps li.active:hover {
  background: linear-gradient(#3397ff,#7255ff)!important;
  background: linear-gradient(to right, #ffd448, #ff2eb3) !important;
  background: linear-gradient(to right, #5839fc, #c694fa) !important;
}
.dark .bwizard-steps .active a {
color: #fff;
}
.dark .bwizard-steps li.active small {
color: rgba(255, 255, 255, 0.49)!important;
}
.dark .bwizard-steps a{
  color: #7c7e82;
}
.dark .tab-content {
  background: #111518;
}
.dark .hklks span {
  border: 1px solid #252935;
  background: #1e2329;
  color: #bcbcc1;
}
.dark .lksNum {
  border: 1px solid #252935;
}
.dark .hklks span:hover {
  background: #2c3742;
}
.dark .jumbotron {
  background: #111518;
  background: rgba(17, 21, 24, 0);
}
.dark .hkSwtichHideSlider.tender {
  border: 1px solid #323849;
}
.dark .jumbotron p {
  color: rgba(255, 255, 255, 0.24);
}
.dark .btn.btn-warning {
  color: #fff9f5;
  background: #6e4305;
  border-color: #704403;
}
.dark .parsley-success {
  background: #1e2329!important;
  background: rgba(0, 0, 0, 0) !important;
}
.dark .btn.btn-danger {
  color: #fff1f1;
  background: #782321;
  border-color: #691f1d;
}
.dark .btn-info.active,
.dark .btn-info:active,
.dark .btn-info:focus,
.dark .btn-info:hover,
.dark .open .dropdown-toggle.btn-info {
  background: #045b74;
  border-color: #00475c;
}
.dark .emptySel label {
  color: #fff;
}
.dark .lksNum .title span{
  color: #cfcfcf;
  background: transparent;
  border: none;
}
.dark .lksNum.active .title.active span {
  color: #ffffff;
  background: transparent;
  border: none;
}
.dark .hklks .lksNum.active span{
  color: #bcbcc1;
  border: 1px solid #252935;
  background: #1e2329;
}
.dark .bwizard-steps.clickable li:focus:not(.active) a,
.dark .bwizard-steps.clickable li:hover:not(.active) a,
.dark .parsley-error,
.dark .parsley-success {
  color: #fff!important;
}
.dark .pager li>a,
.dark .pager li>span {
  border: 1px solid #252935;
  background: #1e2329;
}
.dark .pager li>a,
.dark .pager li>span,
.dark .pagination>li>a {
  color: #c4cad0;
}
.dark .modal-content {
  background-color: #111518;
}
.dark .modal-footer {
  border-top-color: #111518;
}
.dark .bootstrap-dialog.type-warning .modal-header {
background: linear-gradient(#362a21, #09090a) !important;
border-bottom-color: #1e262b !important;
}
.dark .bootstrap-dialog.type-info .modal-header {
background: linear-gradient(#00323a, #09090a) !important;
border-bottom-color: #1e262b !important;
}
.dark .bootstrap-dialog.type-primary .modal-header {
  background: linear-gradient(#1e172b, #09090a) !important;
}
.dark .modal-header {
  border-bottom-color: #1e262b;
}
.dark .bootstrap-dialog .bootstrap-dialog-title {
  color: #ffffff !important;
}
.dark .form-control-static {
  color: #bdbdbd;
}
.dark .courseXxkData .tbody .mk:nth-of-type(odd) {
  background-color: #1b1d25;
}
.dark .courseXxkData .tbody .mk:not(:last-of-type) {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.dark .courseXxkData {
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.dark .courseXxkData .head .mk:not(:last-of-type),
.dark .courseXxkData .tbody .mk .td:not(:last-of-type) {
  border-right: 1px solid rgba(255, 255, 255, 0.08);
}
.dark .courseXxkData .tbody .mk .td {
  color: #bcbcc6;
}
.dark .tikuXxkData .tbody .mk .td label {
  color: #bcbcc6;
}
.dark .tikuXxkData .tbody .mk:not(:last-of-type) {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.dark .tikuXxkData .head .mk:not(:last-of-type), .tikuXxkData .tbody .mk .td:not(:last-of-type) {
  border-right: 1px solid rgba(255, 255, 255, 0.08);
}
.dark .tikuXxkData .tbody .mk:nth-of-type(odd) {
  background-color: #1e2329;
}
.dark .tikuXxkData {
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.dark .tikuXxkData .head {
  border-bottom: 2px solid rgba(0, 0, 0, 0.14);
}
.dark .tikuXxkData .head {
  background: #111518;
  color: #bcbcc6;
}
.dark .courseXxkData .head {
  background: #111518;
  border-color: rgba(0, 0, 0, 0.14);
  color: #bcbcc6;
}
.dark .helpTitle {
  color: #d0d0d0;
}
.dark .input-group-addon {
  background: #171d22;
  color: #afafaf;
}
.dark .bg-blue {
  background: #35414e!important;
}

.dark .edui-default .edui-editor {
  border: 1px solid #464f55 !important;
  background-color: #464f55;
}
.dark .edui-default .edui-editor-toolbarboxouter {
  border-bottom: 1px solid #464f55;
  background-color: #464f55;
  background: #464f55;
}
.dark .hk-vod-stat{
  background: rgba(0, 0, 0, 0);
border: 1px solid #252935;
box-shadow: 0 3px 12px rgba(78, 6, 232, 0.15);
}
.dark .hk-vod-stat .label {
color: rgba(255, 255, 255, 0.7);
}
.dark .hk-vod-stat .value {
color: #ffffff;
}
.dark .categoryText{
  color: #cfcfcf;
}
.dark .hkAliyunVodType .name {
  border: 1px solid #252935;
  background: rgba(0, 0, 0, 0);
  color: #fff;
  border-radius: 10px;
}
.dark .videoTypeData{
  border: 1px solid #252935;
  background: #1e1e29;
  border-radius: 10px;
}
.dark .hkAliyunVod-parent{
  color: #cfcfcf;
}
.dark .ztree li a {
  color: #cfcfcf;
}
.dark .checkbox-inline,
.dark #jstree-list,
.dark .jstree-anchor,
.dark .jstree-anchor:link,
.dark .jstree-anchor:visited,
.dark .jstree-anchor:hover,
.dark .jstree-anchor:active {
  color: #cfcfcf;
}
.dark .list-group-item {
  background-color: #1e2329;
  border: 1px solid #252935;
  color: #cfcfcf;
  border-radius: 10px;
}
.dark .alert.alert-warning {
  background: #2e2419;
  color: #b9a89f;
}
.dark code {
  color: #dfb5c0;
  background-color: #2e1b21;
}
.dark p {
  margin: 0 0 10px;
  color: #7c7c7c;
}
.dark .ztree li a.curSelectedNode {
  background-color: #552806;
  color: #ffe9c8;
  border: 1px #ff9700 solid;
}
.dark .hkAliyunVod-parent:hover{
  color: #7255ff;
}
.dark .categoryText:hover {
  background: #0e1112;
}
.dark .categoryText .horn::after{
  border-top: 1px solid #cfcfcf;
  border-right: 1px solid #cfcfcf;
}
.dark .categoryText.active{
  background: #384966;
  color: #dbe4f5;
}
.dark .backImgAdd {
  border: 1px dashed #555c66;
}
.dark .backImgAdd:hover {
  border: 1px solid #7255ff;
}
.dark input:-webkit-autofill,
.dark input:-webkit-autofill:hover,
.dark input:-webkit-autofill:focus,
.dark input:-webkit-autofill:active {
  /* 改成你界面的背景色（比如这里的浅蓝） */
  -webkit-box-shadow: 0 0 0 30px #1c1c1c inset !important;
  /* 文字颜色也可以统一设置 */
  -webkit-text-fill-color: #ffffff !important;
  /* 去掉边框高亮 */
  outline: none;
  box-shadow: none;
}
/* 暗黑模式下全局选中样式 */
::selection {
  background-color: #3a5585;
  color: #a5a8ba;
}
/* 暗黑模式下全局选中样式 针对 Firefox 的兼容写法 */
::-moz-selection {
  background-color: #3a5585;
  color: #a5a8ba;
}

/* 暗黑主题结束 */

.hkSelect{
  border-radius: 5px !important;
height: 36px;
line-height: 36px;
padding: 0 20px;
background: #f2f5fa;
border: 1px solid #ebeff6;
cursor: pointer;
display: inline-block;
vertical-align: middle;
width: auto !important;
font-size: 12px;
color: #000;
}
.hkSelect.open{
  border: 1px solid #7255ff;
}

@media (max-width: 768px) {
.content, .page-sidebar-minifed .content {
margin-left: 0!important;
}
.sidebar, .sidebar-bg {
width: auto!important;
}
#sidebar .slimScrollDiv, #sidebar [data-scrollbar="true"] {
width: auto!important;
height: 100vh!important;
max-height: 100vh!important;
overflow: auto!important;
}
  .navbar-inverse .navbar-header {
  border-bottom: 1px solid #e8e8e8;
  }
  .dark .navbar-inverse .navbar-header {
  border-bottom: 1px solid #292929;
  }
}
.hk-ant-time-range{
  display: flex;
justify-content: space-between;
align-items: center;
}
.hk-ant-time-range .hk-ant-time-separator{
  margin: 0 10px;
}

    .ant-select-selection__rendered{line-height: 36px;padding:0 10px;color:#172033;}
    .ant-select-selection-selected-value{color:#172033;}
    .ant-select-focused .ant-select-selection,
    .ant-select-selection:focus,
    .ant-select-selection:active,
    .ant-calendar-picker:hover .ant-calendar-picker-input,
    .ant-calendar-picker-input:focus{border-color:#6a35ff;box-shadow:0 0 0 2px rgba(106,53,255,.12)}
    .ant-select-dropdown-menu-item-active,
    .ant-select-dropdown-menu-item:hover{background:#f4f0ff!important;color:#5b2de6!important}
    .ant-select-dropdown-menu-item-selected{background:#efe8ff!important;color:#5b2de6!important;font-weight:500}
    .ant-select-dropdown-menu-item-selected.ant-select-dropdown-menu-item-active{background:#efe8ff!important;color:#5b2de6!important}
    .hk-ant-time-dropdown .ant-select-dropdown-menu{max-height:320px;overflow-y:auto;overflow-anchor:none;scroll-behavior:auto}
    .hk-ant-time-dropdown .ant-select-dropdown-menu-item{height:38px;line-height:23px;padding:8px 18px}
    .hk-ant-time-dropdown .ant-select-dropdown-menu-item-hidden{display:none!important}
    .ant-calendar-selected-day .ant-calendar-date,
    .ant-calendar-date:hover{background:#6a35ff!important;color:#fff!important}
    .ant-calendar-today .ant-calendar-date{border-color:#6a35ff;color:#6a35ff}
    .ant-calendar-header a:hover,
    .ant-calendar-today-btn{color:#6a35ff}
    .ant-calendar-column-header .ant-calendar-column-header-inner{font-size:0}
    .ant-calendar-column-header:nth-child(1) .ant-calendar-column-header-inner:after{content:"日"}
    .ant-calendar-column-header:nth-child(2) .ant-calendar-column-header-inner:after{content:"一"}
    .ant-calendar-column-header:nth-child(3) .ant-calendar-column-header-inner:after{content:"二"}
    .ant-calendar-column-header:nth-child(4) .ant-calendar-column-header-inner:after{content:"三"}
    .ant-calendar-column-header:nth-child(5) .ant-calendar-column-header-inner:after{content:"四"}
    .ant-calendar-column-header:nth-child(6) .ant-calendar-column-header-inner:after{content:"五"}
    .ant-calendar-column-header:nth-child(7) .ant-calendar-column-header-inner:after{content:"六"}
    .ant-calendar-column-header .ant-calendar-column-header-inner:after{font-size:14px}
    .ant-input{
      height: 38px;border-color: #dfe4ee;padding: 2px 15px;width: 170px;border-radius: 10px;
    }
    .ant-input:hover{
      border-color: #7255ff !important;
    }
    .ant-select-selection:hover {
border-color: #7255ff !important;
}

/* 后台页面统一新版列表/选项卡视觉 */
#content.content {
  height: calc(100vh - 94px);
  min-height: calc(100vh - 94px);
  box-sizing: border-box;
  background: #f5f6fb;
  padding: 20px 20px;
  color: #232936;
}
#page-container.page-content-full-height #content.content {
  height: calc(100vh - 54px);
  min-height: 0;
  overflow: hidden;


  /* background: radial-gradient(circle at 82% 0%, rgba(219, 203, 255, 0.05), rgba(225, 207, 255, 0) 28%),
  radial-gradient(circle at 65% 8%, rgba(214, 203, 255, 0.05), transparent 26%),
  linear-gradient(#f7f5ff, #f8f9ff 28%, #ffffff);
  overflow: hidden; */


}
#page-container.page-content-full-height #content.content::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 620px;
  height: 210px;
  pointer-events: none;
  /* background:
    radial-gradient(circle at 70% 20%, rgba(124, 92, 255, 0.22), transparent 42%),
    linear-gradient(135deg, rgba(139, 92, 246, 0.16), rgba(255, 255, 255, 0)); */
  border-bottom-left-radius: 80px;
  filter: blur(0.2px);
  z-index: 0;
}


#page-container.page-content-full-height #content.content > .vertical-box,
#page-container.page-content-full-height #content.content .vertical-box-column,
#page-container.page-content-full-height #content.content .vertical-box-row,
#page-container.page-content-full-height #content.content .vertical-box-cell,
#page-container.page-content-full-height #content.content .vertical-box-inner-cell {
  min-height: 0;
}
#page-container.page-content-full-height #content.content .vertical-box-column,
#page-container.page-content-full-height #content.content .vertical-box,
#page-container.page-content-full-height #content.content .vertical-box-row,
#page-container.page-content-full-height #content.content .vertical-box-cell,
#page-container.page-content-full-height #content.content .vertical-box-inner-cell {
  height: 100%;
}
#page-container.page-content-full-height #content.content > .vertical-box {
  height: 100%;
}
#content .backPadding {
  padding: 0 0 20px;
}
#page-container.page-content-full-height #content.content .backPadding {
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
}
#content .page-header {
  margin: 0 0 20px;
  padding: 0;
  border: 0;
  font-size: 30px;
  font-weight: 800;
  color: #202632;
  letter-spacing: 0;
}
#content .page-header small {
  margin-left: 10px;
  font-size: 16px;
  color: #8a91a1;
  font-weight: 400;
}
#content .row {
  margin-left: -8px;
  margin-right: -8px;
}
#content .col-md-12,
#content .col-md-12.ui-sortable {
  padding-left: 8px;
  padding-right: 8px;
}
#content .panel.panel-inverse {
  border: 0;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(35, 42, 65, .08);
  overflow: hidden;
  margin: 0;
}
#content .panel-heading {
  height: auto;
  padding: 20px 20px 0 20px;
  margin-bottom: 20px;
  border: 0;
  background: #fff;
}
#content .panel-title {
  font-size: 20px;
  line-height: 1.4;
  color: #202632;
  font-weight: 800;
  letter-spacing: 0;
}
#content .panel-heading-btn .btn {
  border-radius: 9px;
  border: 0;
  box-shadow: none;
}
#content .nav-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 0 10px;
  margin: 20px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
#content .nav-tabs > li {
  margin: 0;
}
#content .nav-tabs > li > a {
  /* min-width: 100px; */
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 14px;
  padding: 0 20px;
  margin-right: 0;
  color: #687184;
  font-weight: 800;
  background: rgba(255, 255, 255, .62);
  transition: .15s ease;
}
#content .nav-tabs > li > a:hover {
  color: #6047ef;
  background: #fff;
  box-shadow: 0 8px 18px rgba(35, 42, 65, .06);
}
#content .nav-tabs > li.active > a,
#content .nav-tabs > li.active > a:focus,
#content .nav-tabs > li.active > a:hover {
  color: #fff;
  background: linear-gradient(135deg, #6547ff, #9271ff);
  box-shadow: 0 12px 24px rgba(101, 71, 255, .24);
}
#content .panel-body,
#content .tab-content {
  margin: 0 24px 24px;
  padding: 18px;
  border: 1px solid #edf0f6;
  border-radius: 14px;
  background: #fff;
}
#content .tab-pane {
  padding-top: 0;
}
#content .chart-container {
  margin-top: 0;
  border: 1px solid #edf0f6;
  border-radius: 14px;
  background: #fbfcff;
  box-shadow: none;
}
#content h3,
#content h4 {
  color: #202632;
  font-weight: 800;
  letter-spacing: 0;
}
#content .widget.widget-stats {
  border-radius: 14px;
  border: 1px solid #edf0f6;
  background: #fff !important;
  color: #202632;
  box-shadow: 0 10px 24px rgba(35, 42, 65, .07);
  overflow: hidden;
}
#content .widget-stats .stats-title {
  color: #798294;
  font-weight: 700;
}
#content .widget-stats .stats-number {
  color: #202632;
  font-weight: 900;
}
#content .widget-stats .stats-link a {
  color: #6b55f6;
  background: #f4f0ff;
}
#content .widget-stats .stats-icon {
  color: rgba(107, 85, 246, .16);
}
#content .form-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
#content .form-inline .form-control {
  width: 170px;
  height: 38px;
  font-size: 14px;
}
#content .form-group {
  margin-left: 0;
  margin-right: 0;
  padding: 5px 0;
  border-color: #edf0f6;
}
#content .form-control,
#content input[type="text"],
#content input[type="number"],
#content textarea,
#content select {
  border-color: #dfe4ee;
  border-radius: 10px;
  box-shadow: none;
}
#content .btn {
  border-radius: 10px;
  border: 0;
  font-weight: 700;
  box-shadow: none;
}
#content .btn.btn-white{
  border: 1px solid #e2e7eb;
  border-color: #e2e7eb;
}
#content .btn-sm {
  padding: 8px 14px;
}
#content .btn-primary {
  background: #6b55f6;
}
#content .btn-danger {
  background: #ff5d6c;
}
#content .btn-warning {
  background: #ffb342;
}
#content .dataTables_wrapper {
  position: relative;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0 18px;
  border: 1px solid #eef1f7;
  border-radius: 14px;
  background: #fbfcff;
  overscroll-behavior: auto;
  overscroll-behavior-x: auto;
  overscroll-behavior-y: auto;
  margin-bottom: 0;
  touch-action: auto;
}
#content .dataTables_wrapper::-webkit-scrollbar {
  width: 10px;
  height: 6px;
}
#content .dataTables_wrapper::-webkit-scrollbar-thumb {
  min-height: 20px;
  border-radius: 100px;
  background: rgba(91, 103, 128, .38);
}
#content .dataTables_wrapper::-webkit-scrollbar-track {
  border-radius: 100px;
  background: #eef1f7;
  background: transparent;
}
#content table.table {
  width: 100% !important;
  margin: 0;
  border-collapse: separate !important;
  border-spacing: 0 8px;
  border: 0 !important;
  background: transparent;
}
#content table.table thead th {
  border: 0 !important;
  padding: 14px 16px;
  color: #667085;
  font-size: 13px;
  font-weight: 800;
  background: #f0f3fa;
  white-space: nowrap;
}
#content table.table thead th:first-child {
  border-radius: 12px 0 0 12px;
}
#content table.table thead th:last-child {
  border-radius: 0 12px 12px 0;
}
#content table.table thead th.hk-action-head,
#content table.table tbody td.hk-action-cell {
  position: sticky;
  right: 0;
  z-index: 20;
  width: 1%;
  min-width: max-content;
  max-width: none;
  background: #fff;
  background-clip: padding-box;
  box-shadow: none;
}
#content table.table thead th.hk-action-head {
  z-index: 30;
  background: #f0f3fa;
  text-align: revert;
  box-shadow: none;
}
#content table.table tbody tr {
background: transparent;
  box-shadow: 0 6px 16px rgba(33, 39, 58, .045);

  transition: all 0.3s ease;

}
#content table.table tbody tr:hover {
  /* transform: translateY(-1px); */
  box-shadow: 0 10px 24px rgba(33, 39, 58, .08);
  background: linear-gradient(360deg, #e4e7fc, #f9f8fd, #f3f1fc);
  transition: all 0.3s ease;
}
#content table.table tbody td {
  border: 0 !important;
  border-top: 1px solid #eef1f7 !important;
  border-bottom: 1px solid #eef1f7 !important;
  padding: 5px 16px;
  vertical-align: middle;
  color: #333b4d;
  background: #fff;
  white-space: nowrap;
  background: transparent;

}
#content table.table tbody td:first-child {
  border-left: 1px solid #eef1f7 !important;
  border-radius: 12px 0 0 12px;
}
#content table.table tbody td:last-child {
  border-right: 1px solid #eef1f7 !important;
  border-radius: 0 12px 12px 0;
}
#content .fmImg {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  object-fit: cover;
  margin-right: 10px;
  border: 2px solid #f0edff;
}
#content .backPapaerNum {
  position: sticky;
  bottom: 0;
  background: linear-gradient(180deg, rgba(245, 246, 251, 0), #f5f6fb 28%);
  border: none;
  box-shadow: 0 -5px 30px rgba(35, 42, 65, 0.08);
margin: 0;
padding: 0;
border-radius: 16px;
z-index: 100;
}
#content .backPapaerNum > .papaerNum {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 18px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(35, 42, 65, .08);

  border-radius: 16px;
}
#content .pagination {
  margin: 0;
}
#content .pagination > li > a {
  margin-left: 6px;
  /* border: 0; */
  border-radius: 9px;
  /* color: #6b55f6; */
}
#content .pagination > .active > a {
  background: #6b55f6;
  color: #fff;
}
#content .modal-content {
  border: 0;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 18px 48px rgba(31, 38, 65, .22);
}
#content .hkTypeXxk label span {
  border-radius: 10px;
}
#content .thumbnail {
  border-color: #edf0f6;
  border-radius: 12px;
  box-shadow: none;
}
#content .hk-action-cell {
  position: sticky !important;
  right: 0;
  z-index: 20;
  width: 1% !important;
  min-width: max-content !important;
  max-width: none !important;
  white-space: nowrap;
  background: #fbfcff !important;
  padding-left: 18px !important;
  padding-right: 18px !important;
}

#content table.table tbody tr:hover .hk-action-cell{
  background: linear-gradient(360deg, #e4e7fc, #f9f8fd, #f3f1fc) !important;;
}
#content .hk-action-head,
#content .hk-action-cell {
  text-align: right;
}
#content .hk-action-head {
  text-align: left;
}
#content .dataTables_wrapper.hk-table-has-x .hk-action-head::before,
#content .dataTables_wrapper.hk-table-has-x .hk-action-cell::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -18px;
  width: 18px;
  background: transparent;
  pointer-events: none;
}
#content .dataTables_wrapper.hk-table-has-x .hk-action-head::before {
  background: transparent;
}
#content .dataTables_wrapper.hk-table-has-x .hk-action-head::after,
#content .dataTables_wrapper.hk-table-has-x .hk-action-cell::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -1px;
  width: 1px;
  background: #eef1f7;
  pointer-events: none;
}
#content .hk-action-inner {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 160px;
  white-space: nowrap;
}
#content .hk-action-inner .btn {
  flex: 0 0 auto;
}
#content .hk-course-item-table-wrap {
  margin-bottom: 15px;
}
#content .hk-course-item-table {
  min-width: 1360px;
}
#content .hk-course-item-table .input-group {
  min-width: 260px;
}
#content .hk-more-actions {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}
#content .hk-more-trigger {
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 10px;
  background: #f5f7fb;
  color: #303746;
  font-size: 22px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: 1px;
}
#content .hk-more-trigger:hover,
#content .hk-more-actions.open .hk-more-trigger {
  color: #6047ef;
  background: #f0edff;
}
#content .hk-more-panel {
  position: fixed;
  z-index: 9999;
  display: none;
  width: 226px;
  padding: 14px;
  border: 1px solid #edf0f6;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(31, 38, 65, .18);
  pointer-events: auto;
}
#content .hk-more-panel.hk-more-floating {
  display: block;
}
#content .hk-more-item {
  height: 36px;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  border: 0;
  border-radius: 9px;
  background: #f7f8fb;
  color: #333b4d;
  text-align: left;
  padding: 0 14px;
  font-weight: 700;
  white-space: nowrap;
}
#content .hk-more-item + .hk-more-item {
  margin-top: 6px;
}
#content .hk-more-item i {
  width: 18px;
  text-align: center;
  color: #566074;
  font-size: 15px;
}
#content .btn-icon.btn-xs {
width: 30px;
height: 30px;
font-size: 10px;
line-height: 30px;
border-radius: 100px;
margin: 0;
padding: 0 !important;
}
#content .hk-more-item:hover {
  background: #f0edff;
  color: #6047ef;
}
#content .hk-more-item:hover i {
  color: #6047ef;
}
#content .hk-more-divider {
  height: 1px;
  margin: 12px 4px;
  background: #edf0f6;
}
#content .hk-more-item.danger-soft {
  color: #333b4d;
  background: #f7f2ff;
}
#content .hk-more-item.danger-soft i {
  color: #566074;
}
#content .hk-more-item.danger-soft:hover {
  color: #6047ef;
  background: #efe9ff;
}
#content .hk-more-item.danger {
  color: #ff4f62;
  background: #fff;
}
#content .hk-more-item.danger i {
  color: #ff4f62;
}
#content .hk-more-item.danger:hover {
  color: #fff;
  background: #ff5d6c;
}
#content .hk-more-item.danger:hover i {
  color: #fff;
}

/* 后台新版视觉暗黑模式 */
.dark #content.content {
  background: #101113;
  color: #dce2ee;
}
.dark #content .page-header,
.dark #content .panel-title,
.dark #content h3,
.dark #content h4 {
  color: #f2f5fb;
}
.dark #content .page-header small {
  color: #8d96a8;
}
.dark #content .panel.panel-inverse,
.dark #content .panel-heading,
.dark #content .panel-body,
.dark #content .tab-content,
.dark #content .modal-content,
.dark #content .backPapaerNum > .papaerNum {
  background: #09090a;
  border-color: #24222b;


  box-shadow: 0 12px 32px rgba(0, 0, 0, .25);
}
.dark #content table.table tbody tr:hover,
.dark #content table.table tbody tr:hover td,
.dark #content table.table tbody tr:hover .hk-action-cell,
.dark #content table.table tbody tr:hover .hk-action-cell td{
background: linear-gradient(360deg, #0c0e10, #29244e, #0c0808)!important;
}
.dark #content .nav-tabs {
  box-shadow: none;
  background: #09090a;
}
.dark #content .nav-tabs > li > a {
  color: #aab3c4;
  background: rgba(255, 255, 255, .04);
}
.dark #content .nav-tabs > li > a:hover {
  color: #d8d1ff;
  background: rgba(255, 255, 255, .08);
  box-shadow: none;
}
.dark #content .nav-tabs > li.active > a,
.dark #content .nav-tabs > li.active > a:focus,
.dark #content .nav-tabs > li.active > a:hover {
  color: #fff;
  background: linear-gradient(135deg, #6d55ff, #8b6eff);
  box-shadow: 0 12px 24px rgba(88, 69, 220, .32);
}
.dark #content .chart-container,
.dark #content .form-inline,
.dark #content .dataTables_wrapper,
.dark #content .widget.widget-stats {
  background: #0e0e11 !important;
  border-color: #242632;
  color: #dce2ee;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
}
.dark #content .widget-stats .stats-title,
.dark #content table.table thead th {
  color: #9da7ba;
}
.dark #content .widget-stats .stats-number {
  color: #f2f5fb;
}
.dark #content .widget-stats .stats-link a {
  color: #c9c0ff;
  background: rgba(109, 85, 255, .16);
}
.dark #content .widget-stats .stats-icon {
  color: rgba(142, 115, 255, .18);
}
.dark #content .form-control,
.dark #content input[type="text"],
.dark #content input[type="number"],
.dark #content textarea,
.dark #content select {
  color: #e4e5f7;
  background: rgba(0, 0, 0, 0);
  border-color: #2e2d3d;
}
.dark #content .form-control::placeholder,
.dark #content input::placeholder,
.dark #content textarea::placeholder {
  color: #687386;
}
.dark #content table.table thead th {
  background: #21202b;
}
.dark #content table.table thead th.hk-action-head,
.dark #content table.table tbody td.hk-action-cell {
  background: #21202b;
  box-shadow: none;
}
.dark #content .dataTables_wrapper.hk-table-has-x .hk-action-head::before {
  background: transparent;
}
.dark #content .dataTables_wrapper.hk-table-has-x .hk-action-cell::before {
  background: transparent;
}
.dark #content .dataTables_wrapper.hk-table-has-x .hk-action-head::after,
.dark #content .dataTables_wrapper.hk-table-has-x .hk-action-cell::after {
  background: #2a3342;
  border-left-color: #2a3342;
}
.dark #content .dataTables_wrapper.hk-table-has-x .hk-action-head::after {
  background: #202838;
}
.dark #content .dataTables_wrapper.hk-table-has-x .hk-action-cell::after {
  background: #1a202b;
}
.dark #content table.table tbody tr {
  background: transparent;
  box-shadow: 0 6px 16px rgba(0, 0, 0, .18);
}
.dark #content table.table tbody tr:hover {
  box-shadow: 0 10px 24px rgba(0, 0, 0, .28);
}
.dark #content table.table tbody td {
  color: #d3d0ec;
  background: #0f1012;
  border-color: #2a2a33 !important;
}
.dark #content .fmImg {
  border-color: rgba(142, 115, 255, .34);
}
.dark #content .backPapaerNum {
  background: linear-gradient(180deg, rgba(17, 21, 29, 0), #11151d 28%);
}
.dark #content .pagination > li > a {
  color: #c9c0ff;
  background: #1a202b;
}
.dark #content .pagination > .active > a {
  color: #fff;
  background: #6d55ff;
}
.dark #content .thumbnail {
  background: rgba(0, 0, 0, 0);
  border-color: #252935;
}
.dark #content .hk-action-cell {
  background: #0f1012 !important;
}
.dark #content .hk-more-trigger {
  color: #dce2ee;
  background: #222a38;
}
.dark #content .hk-more-trigger:hover,
.dark #content .hk-more-actions.open .hk-more-trigger {
  color: #d8d1ff;
  background: rgba(109, 85, 255, .18);
}
.dark #content .hk-more-item {
  color: #dce2ee;
  background: #151b25;
}
.dark #content .hk-more-panel {
  background: #1a202b;
  border-color: #2a3342;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .38);
}
.dark #content .hk-more-divider {
  background: #2a3342;
}
.dark #content .hk-more-item i {
  color: #9da7ba;
}
.dark #content .hk-more-item:hover {
  color: #d8d1ff;
  background: rgba(109, 85, 255, .18);
}
.dark #content .hk-more-item:hover i {
  color: #d8d1ff;
}
.dark #content .hk-more-item.danger-soft {
  color: #dce2ee;
  background: rgba(109, 85, 255, .12);
}
.dark #content .hk-more-item.danger {
  color: #ff8795;
  background: transparent;
}
.dark #content .hk-more-item.danger i {
  color: #ff8795;
}
.dark #content .hk-more-item.danger:hover {
  color: #fff;
  background: #ff5d6c;
}

.backNodalUserDetail{
  display: flex;
align-items: center;
gap: 15px;
padding: 15px;
border-radius: 12px;
background: #f7f8ff;
margin-bottom: 15px;
}
.backNodalUserDetail img{
  width: 54px;
height: 54px;
border-radius: 50%;
object-fit: cover;
}
.backNodalUserDetail .name{
  font-size: 18px;
font-weight: 800;
color: #000;
}
.backNodalUserDetail .mobile{
  color: #3d3c47;
margin-top: 4px;
}
.dark .backNodalUserDetail{
  background: #21202b;

}
.dark .backNodalUserDetail .name{
  color: #fff;
}
.dark .backNodalUserDetail .mobile{
  color: rgba(255, 255, 255, 0.5);
}

/* 通用音频播放器 */
.hk-audio-player {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-width: 260px;
  margin-top: 15px;
  padding: 10px 14px;
  border: 1px solid #e8e4ff;
  border-radius: 14px;
  background: linear-gradient(135deg, #f7f4ff, #eef3ff);
  box-shadow: 0 8px 22px rgba(91, 67, 232, .10);
}
.hk-audio-play {
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(135deg, #7d6bff, #5438e8);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 16px rgba(91, 67, 232, .25);
  transition: all .2s ease;
}
.hk-audio-play:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 20px rgba(91, 67, 232, .32);
}
.hk-audio-play i {
  font-size: 15px;
  margin-left: 2px;
}
.hk-audio-play.playing i {
  margin-left: 0;
}
.hk-audio-time {
  min-width: 42px;
  color: #667085;
  font-weight: 700;
  font-size: 12px;
  text-align: center;
}
.hk-audio-range {
  flex: 1;
  height: 4px;
  appearance: none;
  -webkit-appearance: none;
  border-radius: 999px;
  background: linear-gradient(90deg, #755cff var(--progress, 0%), #d9dff2 var(--progress, 0%));
  outline: none;
}
.hk-audio-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 14px;
  height: 14px;
  border: 3px solid #725cff;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 3px 8px rgba(91, 67, 232, .22);
  cursor: pointer;
}
.hk-audio-range::-moz-range-thumb {
  width: 14px;
  height: 14px;
  border: 3px solid #725cff;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 3px 8px rgba(91, 67, 232, .22);
  cursor: pointer;
}
.dark #content .hk-audio-player {
  border-color: rgba(125, 107, 255, .26);
  background: linear-gradient(135deg, #171d28, #20263a);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .28);
}
.dark #content .hk-audio-time {
  color: #aeb7c8;
}
.dark #content .hk-audio-range {
  background: linear-gradient(90deg, #8d7cff var(--progress, 0%), #3a4254 var(--progress, 0%));
}

.hk-table-scroll {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}

.hk-table-scroll > table {
  width: max-content;
  min-width: 100%;
}

.hk-line-2 {
  display: -webkit-box;
  max-width: 360px;
  white-space: normal;
  line-height: 1.55;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.hk-line-2.wide {
  max-width: 520px;
}

.hk-line-2.compact {
  max-width: 260px;
}


/* 直播课表开始 */
.hkLivePage {
    height: 100%;
    display: flex;
    flex-direction: column;
    color: #202336;
}


.hkSchedule {
    min-height: 0;
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 14px;
}

  .hkSchedule .mainPane,
  .hkSchedule .sidePane {
    min-height: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid #edf0f7;
    border-radius: 10px;
    box-shadow: 0 8px 22px rgba(31, 38, 65, .04);
}

  .hkSchedule .mainPane {
    display: flex;
    flex-direction: column;
}

  .hkSchedule .filterBox {
    flex: 0 0 auto;
    padding: 16px 18px 12px;
    border-bottom: 1px solid #eef1f6;
}

  .hkSchedule .filterRow {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 12px;
}

  .hkSchedule .filterRow:last-child {
    margin-bottom: 0;
}

  .hkSchedule .fLabel {
    color: #555b6c;
    font-weight: 600;
    margin-right: 2px;
}

.hkSchedule .quickBtn {
    border: 1px solid #e3e6ef;
    background: #fff;
    border-radius: 6px;
    padding: 7px 14px;
    color: #363a48;
}

.hkSchedule .quickBtn.active {
    background: #6738e8;
    color: #fff;
    border-color: #6738e8;
    box-shadow: 0 8px 18px rgba(103, 56, 232, .18);
}

  .hkSchedule .fInput,
  .hkSchedule .fSelect {
    height: 34px;
    border: 1px solid #e2e6ef;
    border-radius: 6px;
    padding: 0 12px;
    background: #fff;
    min-width: 150px;
}

.hkSchedule .search {
    width: 280px;
}

.hkSchedule .gridScroll {
    min-height: 0;
    flex: 1 1 auto;
    overflow: auto;
}

.hkSchedule .calGrid {
    min-width: 980px;
    display: grid;
    grid-template-columns: 58px repeat(7, minmax(124px, 1fr));
}

.hkSchedule .corner,
.hkSchedule .dayHead {
    position: sticky;
    top: 0;
    z-index: 50;
    height: 48px;
    background: #fff;
    border-bottom: 1px solid #edf0f7;
}

  .hkSchedule .corner {
    left: 0;
    z-index: 6;
}

.hkSchedule .dayHead {
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    color: #303447;
    border-left: 1px solid #edf0f7;
}

  .hkSchedule .timeCol {
    position: sticky;
    left: 0;
    z-index: 4;
    background: #fff;
}

.hkSchedule .timeCell {
    height: 64px;
    border-bottom: 1px solid #f0f2f7;
    padding: 6px 8px 0 0;
    text-align: right;
    color: #6e7482;
    font-size: 12px;
}

.hkSchedule .dayCol {
    position: relative;
    height: 960px;
    border-left: 1px solid #edf0f7;
    background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 63px, #f0f2f7 63px, #f0f2f7 64px);
}

.hkSchedule .event {
    position: absolute;
    min-height: 58px;
    border-radius: 10px;
    border: 1px solid;
    padding: 9px 10px;
    cursor: pointer;
    overflow: hidden;
    transition: .15s;
    box-shadow: 0 10px 20px rgba(31, 38, 65, .08);
}

.hkSchedule .event:hover,
.hkSchedule .event.active {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(72, 64, 120, .12);
}

.hkSchedule .event h4 {
    margin: 0 0 5px;
    font-size: 13px;
    line-height: 1.25;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hkSchedule .event p {
    margin: 0 0 3px;
    font-size: 12px;
    color: #4f5667;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hkSchedule .eventSt {
    position: absolute;
    right: 8px;
    bottom: 7px;
    font-size: 12px;
    border-radius: 12px;
    padding: 2px 8px;
    background: rgba(255, 255, 255, .78);
    font-weight: 700;
}

.hkSchedule .stackMore {
    position: absolute;
    left: 50%;
    bottom: -1px;
    transform: translateX(-50%);
    min-width: 52px;
    height: 18px;
    line-height: 18px;
    border-radius: 10px 10px 0 0;
    background: rgba(255, 255, 255, .92);
    color: #111425;
    text-align: center;
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 -2px 8px rgba(31, 38, 65, .08);
}

.hkSchedule .stackMask {
    position: absolute;
    inset: 0;
    border-radius: 10px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, .16));
    pointer-events: none;
}

.hkSchedule .t0 {
    background: #f0ecff;
    border-color: #8b73e8;
    color: #5f38dd;
}

.hkSchedule .t1 {
    background: #eef7ff;
    border-color: #85c4ff;
    color: #1e7ed8;
}

  .hkSchedule .t2 {
    background: #fff5e5;
    border-color: #ffd18a;
    color: #d98800;
}

.hkSchedule .t3 {
    background: #effbf7;
    border-color: #9be8ce;
    color: #11966b;
}

.hkSchedule .t4 {
    background: #fff0f5;
    border-color: #ffb8cc;
    color: #e34875;
}

.hkSchedule .t5 {
    background: #f0fbff;
    border-color: #8adff4;
    color: #1687a7;
}

.hkSchedule .stPending {
    color: #6b55d9;
    background: #f1edff;
}

.hkSchedule .stSoon {
    color: #d97706;
    background: #fff2d8;
}

.hkSchedule .stLive {
    color: #0f8a61;
    background: #dff8ed;
}

.hkSchedule .stEnded {
    color: #7c8798;
    background: #eef1f5;
}

  .hkSchedule .stBadge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 700;
}

.hkSchedule .sidePane {
    display: flex;
    flex-direction: column;
}

.hkSchedule .detail {
    flex: 0 0 auto;
    padding: 18px;
    border-bottom: 1px solid #edf0f7;
}

.hkSchedule .detailHead {
    display: flex;
    gap: 14px;
}

.hkSchedule .cover {
    width: 126px;
    height: 86px;
    border-radius: 8px;
    background: linear-gradient(135deg, #6940eb, #8b6cff);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 700;
    overflow: hidden;
}

.hkSchedule .cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hkSchedule .detailTitle {
    flex: 1;
    min-width: 0;
}

.hkSchedule .detailTitle h3 {
    margin: 0 0 8px;
    font-size: 18px;
    line-height: 1.35;
    font-weight: 700;
}

.hkSchedule .badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 12px;
    background: #f0ecff;
    color: #6738e8;
}

  .hkSchedule .detailList {
    margin-top: 16px;
    display: grid;
    gap: 10px;
}

.hkSchedule .detailLine {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 8px;
    font-size: 13px;
    color: #303447;
}

.hkSchedule .detailLine span {
    color: #7a8090;
}

  .hkSchedule .enterBtn {
    width: 100%;
    height: 38px;
    margin-top: 18px;
    border: 0;
    border-radius: 6px;
    color: #fff;
    background: #6738e8;
    font-weight: 700;
}

.hkSchedule .soonBox {
    min-height: 0;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    padding: 16px 18px;
}

.hkSchedule .soonBox h3 {
    margin: 0 0 12px;
    font-size: 16px;
    font-weight: 700;
}

.hkSchedule .soonList {
    min-height: 0;
    overflow: auto;
}

.hkSchedule .soonItem {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 52px;
    gap: 10px;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid #f0f2f7;
}

.hkSchedule .soonItem .time {
    font-size: 15px;
    font-weight: 700;
    color: #101422;
}

.hkSchedule .soonItem .name {
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

  .hkSchedule .soonItem .meta {
    color: #7a8090;
    font-size: 12px;
    margin-top: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hkSchedule .miniBtn {
    border: 1px solid #d8ceff;
    background: #fff;
    color: #6738e8;
    border-radius: 5px;
    height: 28px;
}

.hkSchedule .empty {
    color: #9aa0ad;
    text-align: center;
    padding: 30px 0;
}

.hkSchedule .dlgMask {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(20, 24, 36, .32);
}

.hkSchedule .dlg {
    width: 560px;
    max-width: calc(100vw - 40px);
    max-height: calc(100vh - 80px);
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 20px 60px rgba(31, 38, 65, .18);
    overflow: hidden;
}

.hkSchedule .dlgFade-enter-active,
.hkSchedule .dlgFade-leave-active {
    transition: opacity .18s ease;
}

.hkSchedule .dlgFade-enter-active .dlg,
.hkSchedule .dlgFade-leave-active .dlg {
    transition: transform .18s ease, opacity .18s ease;
}

.hkSchedule .dlgFade-enter,
.hkSchedule .dlgFade-leave-to {
    opacity: 0;
}

.hkSchedule .dlgFade-enter .dlg,
.hkSchedule .dlgFade-leave-to .dlg {
    opacity: 0;
    transform: translateY(10px) scale(.96);
}

.hkSchedule .dlgHead {
    flex: 0 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 20px;
    border-bottom: 1px solid #edf0f7;
}

.hkSchedule .dlgHead h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: #202336;
}

.hkSchedule .dlgClose {
    border: 0;
    background: #f5f6fa;
    color: #778092;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    font-size: 18px;
    line-height: 30px;
}

.hkSchedule .dlgBody {
    min-height: 0;
    overflow: auto;
    padding: 16px 18px;
}

.hkSchedule .choice {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 14px;
    margin-bottom: 12px;
    border: 1px solid #edf0f7;
    border-radius: 12px;
    background: #fbfcff;
    cursor: pointer;
    transition: .15s;
}

.hkSchedule .choice:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(72, 64, 120, .1);
    border-color: #d8ceff;
    background: #fff;
}

.hkSchedule .choice .time {
    font-size: 16px;
    font-weight: 800;
    color: #6738e8;
}

.hkSchedule .choice .title {
    font-size: 15px;
    font-weight: 700;
    color: #252a36;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hkSchedule .choice .meta {
    margin-top: 5px;
    color: #7a8090;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}



.dark .hkLivePage {
    color: #f3f5fb;
}

.dark .hkSchedule .mainPane,
.dark .hkSchedule .sidePane {
    background: #111518;
    border-color: #252935;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .18);
}

.dark .hkSchedule .filterBox,
.dark .hkSchedule .detail,
.dark .hkSchedule .dlgHead {
    border-color: #252935;
}

.dark .hkSchedule .fLabel {
    color: rgba(255, 255, 255, .72);
}

.dark .hkSchedule .filterRow span:not(.fLabel) {
    color: rgba(255, 255, 255, .6);
}

.dark .hkSchedule .quickBtn {
    color: rgba(255, 255, 255, .82);
    background: rgba(0, 0, 0, 0);
    border-color: #252935;
}

.dark .hkSchedule .quickBtn:hover {
    border-color: rgba(198, 148, 250, .65);
    background: rgba(114, 85, 255, .1);
    color: #fff;
}

.dark .hkSchedule .quickBtn.active {
    color: #fff;
    background: linear-gradient(to right, rgb(106, 91, 250), rgb(133, 129, 253));
    border-color: transparent;
    box-shadow: 0 8px 18px rgba(106, 91, 250, .22);
}

.dark .hkSchedule .fInput,
.dark .hkSchedule .fSelect {
    background: #1e2329;
    border-color: #252935;
    color: #cfcfcf;
}

.dark .hkSchedule .fInput::placeholder {
    color: rgba(255, 255, 255, .38);
}

.dark .hkSchedule .gridScroll::-webkit-scrollbar,
.dark .hkSchedule .soonList::-webkit-scrollbar,
.dark .hkSchedule .dlgBody::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.dark .hkSchedule .gridScroll::-webkit-scrollbar-thumb,
.dark .hkSchedule .soonList::-webkit-scrollbar-thumb,
.dark .hkSchedule .dlgBody::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .12);
    border-radius: 100px;
}

.dark .hkSchedule .gridScroll::-webkit-scrollbar-track,
.dark .hkSchedule .soonList::-webkit-scrollbar-track,
.dark .hkSchedule .dlgBody::-webkit-scrollbar-track {
    background: transparent;
}

.dark .hkSchedule .corner,
.dark .hkSchedule .dayHead,
.dark .hkSchedule .timeCol {
    background: #111518;
    border-color: #252935;
}

.dark .hkSchedule .dayHead {
    color: #fff;
}

.dark .hkSchedule .timeCell {
    color: rgba(255, 255, 255, .5);
    border-color: #1f2328;
}

.dark .hkSchedule .dayCol {
    border-color: #252935;
    background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 63px, rgba(255, 255, 255, .06) 63px, rgba(255, 255, 255, .06) 64px);
}

.dark .hkSchedule .event {
    box-shadow: 0 10px 20px rgba(0, 0, 0, .2);
}

.dark .hkSchedule .event:hover,
.dark .hkSchedule .event.active {
    box-shadow: 0 10px 24px rgba(0, 0, 0, .28);
}

.dark .hkSchedule .event h4 {
    color: inherit;
}

.dark .hkSchedule .event p {
    color: rgba(255, 255, 255, .68);
}

.dark .hkSchedule .eventSt,
.dark .hkSchedule .stackMore {
    background: rgba(14, 17, 18, .82);
}

.dark .hkSchedule .stackMore {
    color: #fff;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, .26);
}

.dark .hkSchedule .stackMask {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, .18));
}

.dark .hkSchedule .t0 {
    background: linear-gradient(135deg, rgba(106, 91, 250, .28), rgba(51, 41, 105, .52));
    border-color: rgba(139, 115, 232, .78);
    color: #d9d1ff;
}

.dark .hkSchedule .t1 {
    background: linear-gradient(135deg, rgba(30, 126, 216, .24), rgba(22, 48, 78, .58));
    border-color: rgba(133, 196, 255, .65);
    color: #b9dcff;
}

.dark .hkSchedule .t2 {
    background: linear-gradient(135deg, rgba(217, 136, 0, .22), rgba(75, 51, 15, .58));
    border-color: rgba(255, 209, 138, .6);
    color: #ffd596;
}

.dark .hkSchedule .t3 {
    background: linear-gradient(135deg, rgba(17, 150, 107, .22), rgba(16, 64, 50, .58));
    border-color: rgba(155, 232, 206, .58);
    color: #a8efd9;
}

.dark .hkSchedule .t4 {
    background: linear-gradient(135deg, rgba(227, 72, 117, .22), rgba(75, 30, 47, .58));
    border-color: rgba(255, 184, 204, .58);
    color: #ffc0d1;
}

.dark .hkSchedule .t5 {
    background: linear-gradient(135deg, rgba(22, 135, 167, .22), rgba(16, 61, 75, .58));
    border-color: rgba(138, 223, 244, .58);
    color: #abecfb;
}

.dark .hkSchedule .stPending {
    color: #d8ceff;
    background: rgba(114, 85, 255, .18);
}

.dark .hkSchedule .stSoon {
    color: #ffd596;
    background: rgba(217, 119, 6, .16);
}

.dark .hkSchedule .stLive {
    color: #a8efd9;
    background: rgba(15, 138, 97, .18);
}

.dark .hkSchedule .stEnded {
    color: #b5bbc6;
    background: rgba(255, 255, 255, .08);
}

.dark .hkSchedule .detailTitle h3,
.dark .hkSchedule .soonBox h3,
.dark .hkSchedule .dlgHead h3,
.dark .hkSchedule .soonItem .time,
.dark .hkSchedule .soonItem .name,
.dark .hkSchedule .detailLine,
.dark .hkSchedule .choice .title {
    color: #fff;
}

.dark .hkSchedule .detailLine span,
.dark .hkSchedule .soonItem .meta,
.dark .hkSchedule .choice .meta,
.dark .hkSchedule .text-muted {
    color: rgba(255, 255, 255, .5) !important;
}

.dark .hkSchedule .cover {
    background: linear-gradient(135deg, #3f2ea1, #765cff);
    color: #fff;
}

.dark .hkSchedule .badge {
    background: rgba(114, 85, 255, .16);
    color: #d8ceff;
}

.dark .hkSchedule .enterBtn {
    background: linear-gradient(to right, rgb(106, 91, 250), rgb(133, 129, 253));
    box-shadow: 0 8px 18px rgba(106, 91, 250, .22);
}

.dark .hkSchedule .soonItem {
    border-color: #1f2328;
}

.dark .hkSchedule .miniBtn {
    color: #d8ceff;
    background: rgba(0, 0, 0, 0);
    border-color: rgba(198, 148, 250, .34);
}

.dark .hkSchedule .miniBtn:hover {
    color: #fff;
    border-color: rgba(198, 148, 250, .65);
    background: rgba(114, 85, 255, .12);
}

.dark .hkSchedule .empty {
    color: rgba(255, 255, 255, .42);
}

.dark .hkSchedule .dlgMask {
    background: rgba(0, 0, 0, .56);
}

.dark .hkSchedule .dlg {
    background: #111518;
    border: 1px solid #252935;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .42);
}

.dark .hkSchedule .dlgClose {
    color: rgba(255, 255, 255, .68);
    background: rgba(255, 255, 255, .06);
}

.dark .hkSchedule .dlgClose:hover {
    color: #fff;
    background: rgba(255, 255, 255, .1);
}

.dark .hkSchedule .choice {
    background: linear-gradient(to right, rgb(35, 31, 54), rgba(48, 36, 85, 0));
    border-color: #252935;
}

.dark .hkSchedule .choice:hover {
    background: rgba(114, 85, 255, .1);
    border-color: rgba(198, 148, 250, .55);
    box-shadow: 0 10px 22px rgba(0, 0, 0, .24);
}

.dark .hkSchedule .choice .time {
    color: #cfc6ff;
}
/* 直播课表结束 */

/* 直播互动管理 */
.hkLiveMsgPage .tools {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
    flex: 0 0 auto;
    margin-bottom: 0;
}

.hkLiveMsgPage .endBtns {
  display: inline-flex;
  flex-direction: column;
  gap: 6px;
  margin-left: 10px;
  vertical-align: top;
}

.hkLiveMsgPage .endBtns .btn {
  margin: 0 !important;
  min-width: 92px;
}

.hkLiveMsgPage .pushBox {
  display: grid;
  gap: 12px;
}

.hkLiveMsgPage .pushRow label {
  display: block;
  margin-bottom: 5px;
  color: #6b7480;
  font-size: 12px;
  font-weight: 700;
}

.hkLiveMsgPage .pushRow pre {
  min-height: 42px;
  max-height: 118px;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid #e3e8ef;
  border-radius: 8px;
  background: #f8fafc;
  color: #27313f;
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
  font-size: 12px;
  line-height: 1.55;
  white-space: pre-wrap;
  word-break: break-all;
  overflow: auto;
}

.hkLiveMsgPage,
.hkLiveMsgPage #page-container {
  height: 100%;
  overflow: hidden;
}

.hkLiveMsgPage #content.content {
  height: calc(100vh - 54px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.hkLiveMsgPage #content .page-header {
  flex: 0 0 auto;
}

.hkLiveMsgPage #content .panel {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  margin-bottom: 0;
}

.hkLiveMsgPage #content .panel-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.hkLiveMsgPage .liveBox {
  display: grid;
  grid-template-columns: 330px minmax(0, 1fr);
  gap: 16px;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
}

.hkLiveMsgPage .side,
.hkLiveMsgPage .chatBox {
  min-height: 0;
  overflow: hidden;
}

.hkLiveMsgPage .side {
  display: flex;
  flex-direction: column;
}

.hkLiveMsgPage .sideHead {
  padding: 18px;
  border-radius: 15px;
  border: 1px solid #edeff4;
  background: #fff;
  margin-bottom: 15px;
}

.hkLiveMsgPage .sideHead h3 {
  margin: 0 0 8px;
  font-size: 18px;
  font-weight: 700;
  color: #242a31;
}

.hkLiveMsgPage .sideHead p {
  margin: 0;
  color: #707b88;
  line-height: 1.7;
}

.hkLiveMsgPage .statsRow {
  display: flex;
  gap: 8px;
  margin-top: 14px;
}

.hkLiveMsgPage .stat {
  flex: 1;
  padding: 10px;
  border: 1px solid #e6ebf0;
  background: #fff;
  text-align: center;
  border-radius: 10px;
}

.hkLiveMsgPage .stat strong {
  display: block;
  font-size: 20px;
  color: #242a31;
}

.hkLiveMsgPage .stat span {
  display: block;
  margin-top: 3px;
  color: #87909c;
  font-size: 12px;
}

.hkLiveMsgPage .userBox {
  border-radius: 15px;
  border: 1px solid #edeff4;
  background: #fff;
  padding: 18px;
  min-height: 0;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}

.hkLiveMsgPage .userBox .video {

  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 10px;
  background: #0f1318;
  /* 宽度随父容器 */
  padding-top: 56.25%;
  /* 16:9 固定比例核心代码 */
}

.hkLiveMsgPage .userBox .video video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #0f1318;
  display: block;
  /* 画面完整显示，不裁切溢出 */
}

.hkLiveMsgPage .userBox h4 {
  margin: 0 0 12px;
  font-size: 15px;
  font-weight: 700;
}

.hkLiveMsgPage .live-user-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}

/* .live-user-item {border:1px solid #edf0f4;background:#fbfcfe;margin-bottom:10px;padding:10px;} */
/* .live-user-name {font-weight:700;color:#242a31;word-break:break-all;} */
/* .live-user-meta {margin:4px 0 9px;color:#8b96a3;font-size:12px;} */
.hkLiveMsgPage .userSt {
  display: inline-block;
  margin-left: 5px;
  padding: 1px 6px;
  border-radius: 2px;
  background: #eef4ff;
  color: #348fe2;
  font-size: 12px;
}

.hkLiveMsgPage .userSt.danger {
  background: #fff1f0;
  color: #d9534f;
}

.hkLiveMsgPage .userActs {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.hkLiveMsgPage .chatBox {
  padding: 18px;
  border-radius: 15px;
  display: flex;
  flex-direction: column;
  border: 1px solid #edeff4;
  background: #fff;
}

.hkLiveMsgPage .adminSend .ico img {
  width: 20px;
  height: 20px;
  margin-right: 5px;
}

.hkLiveMsgPage .adminSend .ico {
  font-size: 15px;
  font-weight: 700;
  margin: 15px 0;
}

.hkLiveMsgPage .adminSend textarea {
  width: 100%;
  height: 72px;
  resize: vertical;
  background: #fff;
}

.hkLiveMsgPage .adminSend .sendRow {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
}

.hkLiveMsgPage .msgStream {
  display: grid;
  gap: 16px;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
}

.hkLiveMsgPage .msgList {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}

.hkLiveMsgPage .msgCard {
  padding: 18px;
  border-radius: 15px;
  border: 1px solid #edeff4;
  background: #fff;
  display: flex;
  gap: 10px;
  margin-bottom: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.hkLiveMsgPage .msgCard.admin {
  background: linear-gradient(to top, #ffffff, #f5efff) !important;
  box-shadow: 0 1px 5px rgba(171, 159, 232, 0.1);
  border: 1px solid #d9d6ff;
}

.hkLiveMsgPage .msgCard .tool {
  display: flex;
  /* justify-content: space-between; */
  flex-shrink: 0;
  margin-left: 20px;
  align-items: center;
}

.hkLiveMsgPage .msgActs {
  display: flex;
  /* justify-content: space-between; */
  align-items: center;

}

.hkLiveMsgPage .msgActs .ico {
  margin-left: 10px;
  /* padding: 5px; */
  border-radius: 101px;
  width: 25px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.hkLiveMsgPage .msgActs .ico img {
  width: 15px;
  height: 15px;
}

.hkLiveMsgPage .msgActs .ico:hover {
  background: #f2efef;
}

.hkLiveMsgPage .msgMeta {
  margin-bottom: 10px;
  font-weight: 700;
  font-size: 13px;
}

.hkLiveMsgPage .msgCard .tool .time {
  margin-right: 10px;
  color: #84859b;
}

.hkLiveMsgPage .msgText {
  color: #5e6371;
}

.hkLiveMsgPage .avatar {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  margin-right: 15px;
  flex-shrink: 0;
  background: #ccd5df;
  color: #fff;
  text-align: center;
  line-height: 34px;
  font-weight: 700;
}

.hkLiveMsgPage .avatar img {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  pointer-events: none;
}

.hkLiveMsgPage .bubble {
  /* box-shadow:0 1px 2px rgba(0,0,0,.04); */

  display: flex;
  /* justify-content: space-between; */
  align-items: center;
}

.hkLiveMsgPage .bubble.hidden {
  opacity: .52;
  text-decoration: line-through;
}

.hkLiveMsgPage .chatMain {
  display: grid;
  /* grid-template-columns: 330px minmax(0,1fr); */
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 16px;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
}

.hkLiveMsgPage .msgMeta .start {
  background: #e9e3fe;

  color: #7e6fe1;
  font-size: 10px;
  padding: 3px 5px;
  border-radius: 5px;
  margin-left: 10px;
}

.hkLiveMsgPage .msgCard.admin .msgMeta {
  color: #5611ff;
}

.hkLiveMsgPage .msgCard.admin .msgMeta .start {
  color: #ffffff;
  background: linear-gradient(to right, #5839fc, #c694fa) !important;
  box-shadow: 0 6px 5px rgba(62, 33, 251, 0.13);
}

.hkLiveMsgPage .onlineWrap {


  /* 关键：让子元素垂直排列 */
  display: flex;
  flex-direction: column;

  /* 父盒子必须给高度，否则无法自适应！ */
  height: 100%;
  /* 如果你需要固定高度，就写死：height: 500px; */
  overflow: hidden;
  /* 隐藏溢出，交给子元素滚动 */

}

.hkLiveMsgPage .onlineBox {
  border-radius: 15px;
  border: 1px solid #edeff4;
  background: #fff;
  padding: 18px;





  display: grid;
  gap: 16px;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;


  grid-template-rows: auto 1fr;
  /* 关键！第一行自适应，第二行占满剩余 */

}

.hkLiveMsgPage .onlineBox .boxTitle {

  grid-row: 1;
  /* 第一行 */
}

.hkLiveMsgPage .onlineBox .stuList {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}

.hkLiveMsgPage .onlineBox .stu {

  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
}

.hkLiveMsgPage .onlineBox .head {

  display: flex;
  align-items: center;
  /* justify-content: center; */
}

.hkLiveMsgPage .onlineBox .head img {
  width: 35px;
  height: 35px;
  margin-right: 10px;
  border-radius: 100px;
  flex-shrink: 0;
  pointer-events: none;
}

.hkLiveMsgPage .onlineBox .name {
  color: #011111;
}

.hkLiveMsgPage .onlineBox .name .num {
  color: #b8bbc2;
  padding-top: 5px;
}

.hkLiveMsgPage .quickBox {
  border-radius: 15px;
  border: 1px solid #edeff4;
  background: #fff;
  padding: 18px;

  flex-shrink: 0;
  /* 防止被压缩 */
  margin-top: 15px;


}

.hkLiveMsgPage .quickBox .info {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  margin-top: 20px;
}

.hkLiveMsgPage .quickBox .info .mk {
  text-align: center;
}

.hkLiveMsgPage .quickBox .info .mk img {
  width: 35px;
  height: 35px;
  border-radius: 10px;
  pointer-events: none;
}

.hkLiveMsgPage .quickBox .info .mk .text {
  margin-top: 10px;
  color: #6e707d;
}

.hkLiveMsgPage .boxTitle {

  display: flex;
  justify-content: space-between;
  align-items: center;
}

.hkLiveMsgPage .boxTitle .title {
  font-size: 15px;

  font-weight: 700;
}

.hkLiveMsgPage .boxTitle .title span {
  background: #f6f6f6;
  color: #acaebf;
  font-weight: normal;
  font-size: 10px;
  margin-left: 10px;
  padding: 3px 5px;
}

.hkLiveMsgPage .topBar {

  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
}

.hkLiveMsgPage .statCards {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-column-gap: 15px;
}

.hkLiveMsgPage .statCards .mk {
  position: relative;
  background-color: #fff;
  padding: 20px 20px 50px 20px;
  border-radius: 15px;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: 0 3px 10px rgba(15, 0, 101, 0.08);

}

.hkLiveMsgPage .statCards .mk .ico {
  margin-left: 50px;
  position: relative;
  z-index: 1;
}

.hkLiveMsgPage .statCards .mk .ico img {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  pointer-events: none;
}

.hkLiveMsgPage .statCards .bg {
  pointer-events: none;
  width: auto;
  height: 50px;
  bottom: 0;
  left: 0;
  border-radius: 0 0 15px 15px;
  width: 100%;
  position: absolute;
}

.hkLiveMsgPage .statCards .mk .title {
  position: relative;
  z-index: 1;
}

.hkLiveMsgPage .statCards .mk .num {
  position: relative;
  z-index: 1;
  font-weight: 700;
  font-size: 18px;
}

.hkLiveMsgPage .records {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 2px 2px 12px;
}

.hkLiveMsgPage .record {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 16px 18px;
  margin-bottom: 12px;
  border: 1px solid #edeff4;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 3px 10px rgba(15, 0, 101, 0.04);
}

.hkLiveMsgPage .record.report {
  border-color: #ffd8d2;
  background: linear-gradient(to right, #fff, #fff7f5);
}

.hkLiveMsgPage .record.hidden {
  opacity: .65;
}

.hkLiveMsgPage .recAvatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: linear-gradient(135deg, #d6dcf7, #aeb8db);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  overflow: hidden;
}

.hkLiveMsgPage .recAvatar img {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  pointer-events: none;
}

.hkLiveMsgPage .recTitle {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 7px;
  font-weight: 700;
  color: #252a36;
}

.hkLiveMsgPage .recTitle .tag {
  padding: 2px 7px;
  border-radius: 10px;
  background: #f0ecff;
  color: #6738e8;
  font-size: 12px;
  font-weight: 700;
}

.hkLiveMsgPage .recMeta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  color: #8a91a0;
  font-size: 12px;
  margin-bottom: 7px;
}

.hkLiveMsgPage .recText {
  color: #5e6371;
  line-height: 1.6;
  word-break: break-all;
  white-space: pre-wrap;
}

.hkLiveMsgPage .recActs {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.hkLiveMsgPage .logCard {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 14px;
  padding: 16px 18px;
  margin-bottom: 12px;
  border: 1px solid #edeff4;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 3px 10px rgba(15, 0, 101, 0.04);
}

.hkLiveMsgPage .logIcon {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #6738e8;
  background: #f0ecff;
  font-size: 18px;
}
</style>

<style media="screen">
.hkLiveMsgPage #page-container .content .panel-body {
  padding: 0;
}

.hkLiveMsgPage #page-container .content .nav-tabs {
  background: transparent;
}

.hkLiveMsgPage #page-container .content .panel {
  background-color: transparent;
  box-shadow: none;
}

.hkLiveMsgPage #content table.table,
.hkLiveMsgPage #content table.table thead th,
.hkLiveMsgPage #content table.table tbody td,
.hkLiveMsgPage #content .dataTables_wrapper {
  position: static;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  border-spacing: 0 !important;
  box-shadow: none !important;
}

.hkLiveMsgPage #content .dataTables_wrapper {
  overflow: visible;
  padding: 0;
  border: 0;
  background: transparent;
}

.hkLiveMsgPage .userBox {
  display: flex;
  flex-direction: column;
  gap: 14px;
  overflow: hidden;
}

.hkLiveMsgPage .userBox .video {
  flex: 0 0 auto;
  min-height: 0;
  height: auto;
  padding-top: 0;
  aspect-ratio: 16 / 9;
  max-height: none;
}

.hkLiveMsgPage .adminSend {
  position: sticky;
  bottom: 0;
  z-index: 5;
  padding-top: 4px;
  background: #fff;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.hkLiveMsgPage .adminSend .ico {
  margin: 0 0 10px;
}

.hkLiveMsgPage .adminSend textarea {
  min-height: 64px;
  max-height: none;
  flex: 1 1 auto;
  resize: none;
}

.hkLiveMsgPage.dark .adminSend {
  background: #161c26;
}

.hkLiveMsgPage #content .panel-body,
.hkLiveMsgPage #content .tab-content {
margin: 0;
border: none;
border-radius: 0;
background: transparent;
}
.hkLiveMsgPage #content .nav-tabs {
gap: 0;
padding: 0;
margin: 0;
border: 0;
border-radius: 0;
box-shadow: none;
}
.hkLiveMsgPage #content .nav-tabs > li > a {
min-width: auto;
height: 38px;
border: 0;
}
.hkLiveMsgPage #content .page-header {
margin: 0px 0px 15px;
}

/* 暗黑模式 - 本页 */
.hkLiveMsgPage.dark,
.hkLiveMsgPage.dark #page-container,
.hkLiveMsgPage.dark #content.content {
  background: #0f141d;
  color: #d9deea;
}

.hkLiveMsgPage.dark #content .panel,
.hkLiveMsgPage.dark #content .panel-body,
.hkLiveMsgPage.dark #content .tab-content {
  background: transparent;
  box-shadow: none;
}

.hkLiveMsgPage.dark .page-header {
  color: #f3f5fb;
}

.hkLiveMsgPage.dark .page-header small,
.hkLiveMsgPage.dark .helpTitle,
.hkLiveMsgPage.dark .text-muted {
  color: #8f98aa !important;
}

.hkLiveMsgPage.dark .sideHead,
.hkLiveMsgPage.dark .userBox,
.hkLiveMsgPage.dark .chatBox,
.hkLiveMsgPage.dark .onlineBox,
.hkLiveMsgPage.dark .quickBox,
.hkLiveMsgPage.dark .record,
.hkLiveMsgPage.dark .logCard,
.hkLiveMsgPage.dark .statCards .mk,
.hkLiveMsgPage.dark .msgCard {
  background: #161c26;
  border-color: #252d3a;
  box-shadow: 0 10px 26px rgba(0, 0, 0, .18);
}

.hkLiveMsgPage.dark .sideHead h3,
.hkLiveMsgPage.dark .sideHead p,
.hkLiveMsgPage.dark .stat strong,
.hkLiveMsgPage.dark .boxTitle .title,
.hkLiveMsgPage.dark .onlineBox .name,
.hkLiveMsgPage.dark .recTitle,
.hkLiveMsgPage.dark .pushRow label {
  color: #eef2fb;
}

.hkLiveMsgPage.dark .stat {
  background: #111823;
  border-color: #263143;
}

.hkLiveMsgPage.dark .stat span,
.hkLiveMsgPage.dark .statCards .mk .title,
.hkLiveMsgPage.dark .quickBox .info .mk .text,
.hkLiveMsgPage.dark .onlineBox .name .num,
.hkLiveMsgPage.dark .recMeta,
.hkLiveMsgPage.dark .msgCard .tool .time {
  color: #8d97aa;
}

.hkLiveMsgPage.dark .adminSend {
  background: #161c26;
}

.hkLiveMsgPage.dark .adminSend textarea,
.hkLiveMsgPage.dark textarea.form-control,
.hkLiveMsgPage.dark input.form-control {
  background: #101722 !important;
  border-color: #2b3545 !important;
  color: #e8ecf6 !important;
}

.hkLiveMsgPage.dark .adminSend textarea::placeholder,
.hkLiveMsgPage.dark textarea.form-control::placeholder,
.hkLiveMsgPage.dark input.form-control::placeholder {
  color: #697487;
}

.hkLiveMsgPage.dark .msgCard.admin {
  background: linear-gradient(to top, #171b29, #211b36) !important;
  border-color: #3c3470;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .2);
}

.hkLiveMsgPage.dark .msgCard.admin .msgMeta {
  color: #b7a7ff;
}

.hkLiveMsgPage.dark .msgText,
.hkLiveMsgPage.dark .recText {
  color: #c1c8d7;
}

.hkLiveMsgPage.dark .msgMeta,
.hkLiveMsgPage.dark .record .tag,
.hkLiveMsgPage.dark .recTitle .tag {
  color: #a998ff;
}

.hkLiveMsgPage.dark .avatar {
  background: #2a3444;
  color: #dfe6f3;
}

.hkLiveMsgPage.dark .msgActs .ico:hover {
  background: #232c3a;
}

.hkLiveMsgPage.dark .record.report {
  background: linear-gradient(to right, #1b1d27, #2a2020);
  border-color: #5b342d;
}

.hkLiveMsgPage.dark .record.hidden,
.hkLiveMsgPage.dark .bubble.hidden {
  opacity: .5;
}

.hkLiveMsgPage.dark .logIcon,
.hkLiveMsgPage.dark .recTitle .tag,
.hkLiveMsgPage.dark .record .tag,
.hkLiveMsgPage.dark .boxTitle .title span,
.hkLiveMsgPage.dark .msgMeta .start,
.hkLiveMsgPage.dark .userSt {
  background: #241f3d;
  color: #a998ff;
}

.hkLiveMsgPage.dark .userSt.danger {
  background: #3a1d21;
  color: #ff8a91;
}

.hkLiveMsgPage.dark .empty {
  color: #7e8798;
}

.hkLiveMsgPage.dark .pushRow pre {
  background: #101722;
  border-color: #2b3545;
  color: #dfe6f3;
}

.hkLiveMsgPage.dark .modal-content {
  background: #161c26;
  color: #d9deea;
}

.hkLiveMsgPage.dark .modal-body,
.hkLiveMsgPage.dark .modal-footer {
  background: #161c26;
  border-color: #252d3a !important;
}

.hkLiveMsgPage.dark .bootstrap-dialog-title,
.hkLiveMsgPage.dark .bootstrap-dialog-message,
.hkLiveMsgPage.dark .modal-header .close {
  color: #f2f5fb !important;
}

.hkLiveMsgPage.dark .bootstrap-dialog.type-primary .modal-header {
  background: linear-gradient(#24203f, #161c26) !important;
  border-bottom-color: #252d3a !important;
}

.hkLiveMsgPage.dark .bootstrap-dialog.type-danger .modal-header {
  background: linear-gradient(#3b1f27, #161c26) !important;
  border-bottom-color: #342632 !important;
}

.hkLiveMsgPage.dark .nav-tabs > li > a {
  color: #aeb7c8;
  background: transparent;
}

.hkLiveMsgPage.dark .nav-tabs > li.active > a,
.hkLiveMsgPage.dark .nav-tabs > li.active > a:focus,
.hkLiveMsgPage.dark .nav-tabs > li.active > a:hover {
  color: #fff;
  background: linear-gradient(to right, rgb(106, 91, 250), rgb(133, 129, 253)) !important;
  border-color: transparent;
}

.hkLiveMsgPage.dark .papaerNum,
.hkLiveMsgPage.dark .dataTables_info {
  color: #aeb7c8;
}

.hkLiveMsgPage.dark .pagination > li > a {
  background: #161c26;
  border-color: #2b3545;
  color: #c8cfdd;
}

.hkLiveMsgPage.dark .pagination > .disabled > a {
  background: #111722;
  border-color: #242d3b;
  color: #596376;
}

/* .hkLiveMsgPage.dark ::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.hkLiveMsgPage.dark ::-webkit-scrollbar-thumb {
  background: #3d4658;
  border-radius: 100px;
}

.hkLiveMsgPage.dark ::-webkit-scrollbar-track {
  background: transparent;
} */


@media (max-height: 760px)  {
  .hkLiveMsgPage .sideHead {
    padding: 12px;
    margin-bottom: 10px;
  }

  .hkLiveMsgPage .statsRow {
    margin-top: 8px;
  }

  .hkLiveMsgPage .userBox {
    padding: 12px;
  }

  .hkLiveMsgPage .userBox .video {
    max-height: none;
  }
}
/* 直播互动管理 */

/* 社群直播控制台 */
.hkCommunityLivePage,.hkCommunityLivePage #page-container{height:100%;overflow:hidden}
.hkCommunityLivePage #content.community-console{height:calc(100vh - 54px);overflow:hidden;background:#f6f8fc;padding:16px 18px 18px}
.hkCommunityLivePage .console-shell{height:100%;display:flex;flex-direction:column;gap:12px;min-width:1180px}
.hkCommunityLivePage .console-top{height:42px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.hkCommunityLivePage .console-title{display:flex;align-items:center;gap:10px;min-width:0}
.hkCommunityLivePage .console-title h1{font-size:20px;font-weight:800;color:#172033;margin:0;white-space:nowrap}
.hkCommunityLivePage .status-pill{height:26px;line-height:26px;padding:0 10px;border-radius:13px;background:#ede7ff;color:#6738f5;font-weight:700}
.hkCommunityLivePage .console-actions{display:flex;gap:8px}
.hkCommunityLivePage .metric-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;flex-shrink:0}
.hkCommunityLivePage .metric-card{height:96px;background:#fff;border:1px solid #e9edf6;border-radius:8px;box-shadow:0 8px 22px rgba(31,45,78,.05);display:flex;align-items:center;justify-content:space-between;padding:16px 18px;position:relative;overflow:hidden}
.hkCommunityLivePage .metric-card:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#6d48ff,#2f7bff,#22c783);opacity:.92}
.hkCommunityLivePage .metric-card .label{font-size:12px;color:#748095;margin-bottom:8px;font-weight:700}
.hkCommunityLivePage .metric-card .value{font-size:24px;line-height:1;font-weight:800;color:#172033;letter-spacing:0}
.hkCommunityLivePage .metric-card .sub{font-size:12px;color:#19b675;margin-top:7px}
.hkCommunityLivePage .metric-icon{width:48px;height:48px;border-radius:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.hkCommunityLivePage .metric-icon svg{width:26px;height:26px;display:block}
.hkCommunityLivePage .main-grid{display:grid;grid-template-columns:408px minmax(520px,1fr) 330px;gap:12px;min-height:0;flex:1}
.hkCommunityLivePage .panel{background:#fff;border:1px solid #e9edf6;border-radius:8px;box-shadow:0 8px 22px rgba(31,45,78,.04);min-height:0;overflow:hidden}
.hkCommunityLivePage .left-panel{display:flex;flex-direction:column}
.hkCommunityLivePage .preview-wrap{padding:14px 14px 12px;flex-shrink:0}
.hkCommunityLivePage .preview-title{height:30px;display:flex;align-items:center;justify-content:space-between;color:#172033;font-weight:800}
.hkCommunityLivePage .preview-title span{color:#6c768c;font-weight:600;font-size:12px}
.hkCommunityLivePage .video-card{position:relative;height:226px;border-radius:8px;overflow:hidden;background:linear-gradient(135deg,#111827,#26344b);color:#fff}
.hkCommunityLivePage .video-card video,.hkCommunityLivePage .video-card img{width:100%;height:100%;object-fit:cover;display:block;opacity:.88}
.hkCommunityLivePage .video-empty{height:100%;display:flex;align-items:center;justify-content:center;color:#cbd5e1}
.hkCommunityLivePage .live-badge{position:absolute;left:12px;top:12px;height:28px;line-height:28px;padding:0 10px;background:#ff6542;border-radius:4px;font-weight:800}
.hkCommunityLivePage .close-mark{position:absolute;right:12px;top:12px;width:24px;height:24px;line-height:22px;border-radius:50%;background:rgba(255,255,255,.2);text-align:center;color:#fff}
.hkCommunityLivePage .video-info{position:absolute;left:12px;right:12px;bottom:12px;padding:11px 12px;background:rgba(15,23,42,.78);border-radius:8px}
.hkCommunityLivePage .video-info h3{font-size:17px;margin:0 0 6px;color:#fff;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hkCommunityLivePage .video-info p{margin:0;color:#dbe3ef;font-size:12px}
.hkCommunityLivePage .tool-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:0 14px 12px;flex-shrink:0}
.hkCommunityLivePage .tool-tab{border:1px solid #edf0f7;background:#fff;border-radius:8px;padding:10px 4px;text-align:center;color:#505b71;font-weight:700;cursor:pointer}
.hkCommunityLivePage .tool-tab.active{border-color:#6738f5;background:#f6f2ff;color:#6738f5;box-shadow:0 6px 15px rgba(103,56,245,.12)}
.hkCommunityLivePage .tool-icon{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 7px}
.hkCommunityLivePage .tool-icon svg{width:20px;height:20px}
.hkCommunityLivePage .tool-box{border-top:1px solid #edf0f7;padding:14px;min-height:0;overflow:auto}
.hkCommunityLivePage .tool-box h4{font-size:16px;margin:0 0 12px;color:#172033;font-weight:800}
.hkCommunityLivePage .field-row{margin-bottom:12px}
.hkCommunityLivePage .field-row label{display:block;font-size:13px;color:#6c768c;margin-bottom:7px;font-weight:700}
.hkCommunityLivePage .field-row textarea{resize:none;height:86px}
.hkCommunityLivePage .btn-purple{background:#6738f5;border-color:#6738f5;color:#fff}
.hkCommunityLivePage .btn-purple:hover,.hkCommunityLivePage .btn-purple:focus{background:#5b2de6;border-color:#5b2de6;color:#fff}
.hkCommunityLivePage .class-preview{border:1px solid #edf0f7;border-radius:8px;padding:10px;display:flex;gap:10px;align-items:center;background:#fbfcff;margin-bottom:12px}
.hkCommunityLivePage .class-preview img{width:92px;height:58px;object-fit:cover;border-radius:6px;background:#eef2f7}
.hkCommunityLivePage .class-preview h5{font-size:14px;color:#172033;margin:0 0 5px;font-weight:800;line-height:1.4}
.hkCommunityLivePage .class-preview p{margin:0;color:#ff4d35;font-size:18px;font-weight:900}
.hkCommunityLivePage .mute-state{height:76px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:#fff7ed;color:#c2410c;font-weight:800;margin-bottom:12px}
.hkCommunityLivePage .middle-panel{display:flex;flex-direction:column}
.hkCommunityLivePage .work-head{height:58px;padding:12px 14px;border-bottom:1px solid #edf0f7;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.hkCommunityLivePage .work-title{display:flex;align-items:center;gap:8px;color:#172033;font-size:16px;font-weight:900}
.hkCommunityLivePage .work-title span{height:22px;line-height:22px;border-radius:11px;background:#f0ecff;color:#6738f5;padding:0 8px;font-size:12px}
.hkCommunityLivePage .work-search{display:flex;gap:8px;align-items:center}
.hkCommunityLivePage .work-search input{width:220px}
.hkCommunityLivePage .middle-stack{display:grid;grid-template-rows:42% 58%;gap:12px;padding:14px;min-height:0;flex:1}
.hkCommunityLivePage .section-block{min-height:0;display:flex;flex-direction:column;border:1px solid #edf0f7;border-radius:8px;background:#fbfcff;overflow:hidden}
.hkCommunityLivePage .section-head{height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-bottom:1px solid #edf0f7;background:#fff;color:#172033;font-weight:900}
.hkCommunityLivePage .section-head span{color:#8a94a8;font-size:12px;font-weight:700}
.hkCommunityLivePage .interaction-area,.hkCommunityLivePage .student-area{padding:10px;min-height:0;overflow:auto}
.hkCommunityLivePage .interaction-row{display:grid;grid-template-columns:30px minmax(140px,1fr) auto auto;gap:9px;align-items:center;padding:8px 9px;border:1px solid #edf0f7;border-radius:7px;background:#fff;margin-bottom:7px}
.hkCommunityLivePage .interaction-row.withdrawn{background:#f8fafc;color:#94a3b8}
.hkCommunityLivePage .interaction-main strong{display:block;color:#172033;font-size:13px;margin-bottom:2px}
.hkCommunityLivePage .interaction-main p{margin:0;color:#59657a;line-height:1.35;word-break:break-word;font-size:12px}
.hkCommunityLivePage .interaction-row.withdrawn .interaction-main p{text-decoration:line-through;color:#9aa4b2}
.hkCommunityLivePage .interaction-time{font-size:12px;color:#98a2b3;text-align:right;white-space:nowrap}
.hkCommunityLivePage .withdraw-tag{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:9px;background:#eef2f7;color:#64748b;font-size:12px;font-weight:700}
.hkCommunityLivePage .material-btn{border:0;border-radius:11px;height:22px;padding:0 8px;font-weight:800;background:#fff2e5;color:#f97316;font-size:12px;margin-top:4px}
.hkCommunityLivePage .material-btn.done{background:#e9fbf1;color:#12a86b}
.hkCommunityLivePage .student-row{min-height:64px;border:1px solid #edf0f7;border-radius:7px;background:#fff;display:grid;grid-template-columns:34px minmax(160px,1.4fr) minmax(58px,.5fr) minmax(58px,.5fr) minmax(68px,.6fr) minmax(76px,.65fr) minmax(118px,.8fr);gap:8px;align-items:center;padding:8px 9px;margin-bottom:7px;cursor:pointer;transition:.15s;min-width:0}
.hkCommunityLivePage .student-row:hover,.hkCommunityLivePage .student-row.active{border-color:#6738f5;background:#faf8ff;box-shadow:0 8px 20px rgba(103,56,245,.08)}
.hkCommunityLivePage .avatar{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#5f48ff,#2f7bff);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;overflow:hidden;font-size:12px}
.hkCommunityLivePage .avatar img{width:100%;height:100%;object-fit:cover}
.hkCommunityLivePage .student-row>div{min-width:0}
.hkCommunityLivePage .student-main strong{display:block;color:#172033;font-size:13px;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hkCommunityLivePage .student-main p{margin:0;color:#8a94a8;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hkCommunityLivePage .cell-label{display:block;color:#98a2b3;font-size:12px;margin-bottom:2px}
.hkCommunityLivePage .cell-val{color:#172033;font-weight:800;font-size:12px}
.hkCommunityLivePage .tag{display:inline-block;padding:3px 7px;border-radius:11px;font-size:12px;font-weight:700}
.hkCommunityLivePage .tag.buy{background:#e9fbf1;color:#12a86b}
.hkCommunityLivePage .tag.wait{background:#fff2e5;color:#ff8b22}
.hkCommunityLivePage .tag.unpaid{background:#fff7ed;color:#f97316}
.hkCommunityLivePage .tag.material{background:#e9fbf1;color:#10b981}
.hkCommunityLivePage .tag.hot{background:#fff0f3;color:#f43f5e}
.hkCommunityLivePage .tag.muted{background:#f1f5f9;color:#64748b}
.hkCommunityLivePage .row-actions{display:flex;gap:4px;justify-content:flex-end;flex-wrap:wrap;min-width:0;max-width:112px;justify-self:end}
.hkCommunityLivePage .row-actions button{height:24px;padding:0 6px;border-radius:4px;font-size:12px}
.hkCommunityLivePage .class-push-list{display:flex;flex-direction:column;gap:8px;margin-bottom:12px;max-height:210px;overflow:auto}
.hkCommunityLivePage .class-push-item{border:1px solid #edf0f7;border-radius:8px;padding:8px;display:grid;grid-template-columns:20px 58px 1fr;gap:8px;align-items:center;background:#fbfcff;cursor:pointer}
.hkCommunityLivePage .class-push-item.active{border-color:#6738f5;background:#f7f3ff}
.hkCommunityLivePage .class-push-item img{width:58px;height:42px;object-fit:cover;border-radius:6px;background:#eef2f7}
.hkCommunityLivePage .class-push-item h5{font-size:13px;color:#172033;margin:0 0 4px;font-weight:800;line-height:1.3}
.hkCommunityLivePage .class-push-item p{margin:0;color:#ff4d35;font-size:15px;font-weight:900}
.hkCommunityLivePage .message-area{height:100%;min-height:0;overflow:auto;padding:14px;background:#fbfcff}
.hkCommunityLivePage .chat-item{display:flex;gap:10px;margin-bottom:12px}
.hkCommunityLivePage .chat-item.admin .avatar{background:#ff8b22}
.hkCommunityLivePage .bubble{max-width:72%;border:1px solid #edf0f7;background:#fff;border-radius:8px;padding:8px 10px}
.hkCommunityLivePage .bubble .meta{font-size:12px;color:#98a2b3;margin-bottom:4px}
.hkCommunityLivePage .bubble .text{color:#172033;line-height:1.5;word-break:break-word}
.hkCommunityLivePage .right-panel{display:flex;flex-direction:column}
.hkCommunityLivePage .detail-card{padding:18px;border-bottom:1px solid #edf0f7;flex-shrink:0}
.hkCommunityLivePage .detail-head{display:flex;gap:12px;align-items:center;margin-bottom:14px}
.hkCommunityLivePage .detail-head .avatar{width:58px;height:58px;font-size:22px}
.hkCommunityLivePage .detail-head h3{font-size:18px;margin:0 0 5px;color:#172033;font-weight:900}
.hkCommunityLivePage .detail-head p{margin:0;color:#8a94a8}
.hkCommunityLivePage .intent{display:inline-block;padding:4px 9px;border-radius:13px;background:#fff0f3;color:#f43f5e;font-size:12px;font-weight:800;margin-top:6px}
.hkCommunityLivePage .detail-row{height:30px;display:flex;align-items:center;justify-content:space-between;color:#6c768c}
.hkCommunityLivePage .detail-row strong{color:#172033}
.hkCommunityLivePage .detail-tabs{display:flex;border-bottom:1px solid #edf0f7;flex-shrink:0}
.hkCommunityLivePage .detail-tabs button{flex:1;height:42px;border:0;background:#fff;color:#6c768c;font-weight:800}
.hkCommunityLivePage .detail-tabs button.active{color:#6738f5;border-bottom:3px solid #6738f5}
.hkCommunityLivePage .detail-body{padding:14px 18px;min-height:0;overflow:auto}
.hkCommunityLivePage .summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.hkCommunityLivePage .summary-item{background:#fbfcff;border:1px solid #edf0f7;border-radius:8px;padding:10px}
.hkCommunityLivePage .summary-item span{display:block;color:#98a2b3;margin-bottom:5px}
.hkCommunityLivePage .summary-item strong{color:#172033}
.hkCommunityLivePage .tag-row{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.hkCommunityLivePage .tag-row span{padding:5px 9px;border-radius:13px;background:#eef6ff;color:#2c72ff;font-weight:700}
.hkCommunityLivePage .tag-row span.warn{background:#fff2e5;color:#ff8b22}
.hkCommunityLivePage .tag-row span.danger{background:#fff0f3;color:#f43f5e}
.hkCommunityLivePage .detail-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.hkCommunityLivePage .remark-list{display:flex;flex-direction:column;gap:10px}
.hkCommunityLivePage .remark-item{border:1px solid #edf0f7;border-radius:8px;background:#fbfcff;padding:10px}
.hkCommunityLivePage .remark-item p{margin:0 0 6px;color:#172033;line-height:1.5;word-break:break-word}
.hkCommunityLivePage .remark-item span{font-size:12px;color:#98a2b3}
.hkCommunityLivePage .remark-modal-mask{position:fixed;left:0;right:0;top:0;bottom:0;background:rgba(15,23,42,.38);z-index:9999;display:flex;align-items:center;justify-content:center}
.hkCommunityLivePage .remark-modal{width:420px;background:#fff;border-radius:8px;box-shadow:0 20px 60px rgba(15,23,42,.22);padding:18px}
.hkCommunityLivePage .remark-modal h3{margin:0 0 12px;color:#172033;font-size:18px;font-weight:900}
.hkCommunityLivePage .remark-modal textarea{height:120px;resize:none}
.hkCommunityLivePage .remark-modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}
.hkCommunityLivePage .hk-confirm-mask{position:fixed;left:0;right:0;top:0;bottom:0;z-index:10000;background:rgba(15,23,42,.42);display:flex;align-items:center;justify-content:center}
.hkCommunityLivePage .hk-confirm-modal{width:420px;background:#fff;border-radius:8px;box-shadow:0 22px 66px rgba(15,23,42,.24);overflow:hidden}
.hkCommunityLivePage .hk-confirm-head{height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;border-bottom:1px solid #edf0f7;color:#172033;font-weight:900;font-size:17px}
.hkCommunityLivePage .hk-confirm-close{border:0;background:transparent;color:#98a2b3;font-size:22px;line-height:1}
.hkCommunityLivePage .hk-confirm-body{padding:22px 18px;color:#344054;font-size:15px;line-height:1.7}
.hkCommunityLivePage .hk-confirm-actions{display:flex;justify-content:flex-end;gap:8px;padding:0 18px 18px}
.hkCommunityLivePage .empty-state{height:100%;min-height:120px;display:flex;align-items:center;justify-content:center;color:#98a2b3}
@media(max-width:1500px){.hkCommunityLivePage .main-grid{grid-template-columns:380px minmax(500px,1fr) 310px}
.hkCommunityLivePage .student-row{grid-template-columns:44px minmax(130px,1fr) 82px 80px 82px 82px 110px}
}

        .hkCommunityLivePage.dark,
        .hkCommunityLivePage.dark #page-container,
        .hkCommunityLivePage.dark #content.community-console{
            background:#0f141d;
            color:#d8deea;
        }
        .hkCommunityLivePage.dark #content.community-console{
            background:radial-gradient(circle at 18% 0, rgba(103,56,245,.16), transparent 28%), #0f141d;
        }
        .hkCommunityLivePage.dark .console-title h1,
        .hkCommunityLivePage.dark .preview-title,
        .hkCommunityLivePage.dark .tool-box h4,
        .hkCommunityLivePage.dark .work-title,
        .hkCommunityLivePage.dark .section-head,
        .hkCommunityLivePage.dark .interaction-main strong,
        .hkCommunityLivePage.dark .student-main strong,
        .hkCommunityLivePage.dark .cell-val,
        .hkCommunityLivePage.dark .detail-head h3,
        .hkCommunityLivePage.dark .detail-row strong,
        .hkCommunityLivePage.dark .summary-item strong,
        .hkCommunityLivePage.dark .remark-item p,
        .hkCommunityLivePage.dark .remark-modal h3,
        .hkCommunityLivePage.dark .hk-confirm-head,
        .hkCommunityLivePage.dark .bubble .text{
            color:#f1f5ff;
        }
        .hkCommunityLivePage.dark .status-pill,
        .hkCommunityLivePage.dark .work-title span{
            background:#241d45;
            color:#bcaaff;
        }
        .hkCommunityLivePage.dark .metric-card,
        .hkCommunityLivePage.dark .panel,
        .hkCommunityLivePage.dark .tool-tab,
        .hkCommunityLivePage.dark .tool-box,
        .hkCommunityLivePage.dark .section-block,
        .hkCommunityLivePage.dark .section-head,
        .hkCommunityLivePage.dark .interaction-row,
        .hkCommunityLivePage.dark .student-row,
        .hkCommunityLivePage.dark .class-preview,
        .hkCommunityLivePage.dark .class-push-item,
        .hkCommunityLivePage.dark .summary-item,
        .hkCommunityLivePage.dark .remark-item,
        .hkCommunityLivePage.dark .bubble,
        .hkCommunityLivePage.dark .remark-modal,
        .hkCommunityLivePage.dark .hk-confirm-modal{
            background:#161c26;
            border-color:#263142;
            box-shadow:0 8px 22px rgba(0,0,0,.22);
        }
        .hkCommunityLivePage.dark .message-area,
        .hkCommunityLivePage.dark .interaction-area,
        .hkCommunityLivePage.dark .student-area,
        .hkCommunityLivePage.dark .section-block,
        .hkCommunityLivePage.dark .summary-item,
        .hkCommunityLivePage.dark .class-preview,
        .hkCommunityLivePage.dark .class-push-item{
            background:#121823;
        }
        .hkCommunityLivePage.dark .metric-card .label,
        .hkCommunityLivePage.dark .preview-title span,
        .hkCommunityLivePage.dark .field-row label,
        .hkCommunityLivePage.dark .interaction-main p,
        .hkCommunityLivePage.dark .interaction-time,
        .hkCommunityLivePage.dark .student-main p,
        .hkCommunityLivePage.dark .cell-label,
        .hkCommunityLivePage.dark .detail-head p,
        .hkCommunityLivePage.dark .detail-row,
        .hkCommunityLivePage.dark .summary-item span,
        .hkCommunityLivePage.dark .remark-item span,
        .hkCommunityLivePage.dark .bubble .meta,
        .hkCommunityLivePage.dark .empty-state,
        .hkCommunityLivePage.dark .hk-confirm-body,
        .hkCommunityLivePage.dark .text-muted{
            color:#8e9aad !important;
        }
        .hkCommunityLivePage.dark .metric-card .value,
        .hkCommunityLivePage.dark .class-preview h5,
        .hkCommunityLivePage.dark .class-push-item h5{
            color:#f1f5ff;
        }
        .hkCommunityLivePage.dark .form-control,
        .hkCommunityLivePage.dark textarea,
        .hkCommunityLivePage.dark input{
            background:#101722 !important;
            border-color:#293547 !important;
            color:#e8edf8 !important;
        }
        .hkCommunityLivePage.dark .form-control::placeholder,
        .hkCommunityLivePage.dark textarea::placeholder,
        .hkCommunityLivePage.dark input::placeholder{
            color:#657287;
        }
        .hkCommunityLivePage.dark .form-control:focus,
        .hkCommunityLivePage.dark textarea:focus,
        .hkCommunityLivePage.dark input:focus{
            border-color:#7c63ff !important;
            box-shadow:0 0 0 2px rgba(124,99,255,.18) !important;
        }
        .hkCommunityLivePage.dark .tool-tab.active,
        .hkCommunityLivePage.dark .student-row:hover,
        .hkCommunityLivePage.dark .student-row.active,
        .hkCommunityLivePage.dark .class-push-item.active{
            background:#211b3b;
            border-color:#7c63ff;
            box-shadow:0 8px 22px rgba(103,56,245,.18);
            color:#c8bbff;
        }
        .hkCommunityLivePage.dark .message-area{
            border-color:#263142;
        }
        .hkCommunityLivePage.dark .interaction-row.withdrawn{
            background:#111720;
            color:#6f7b8f;
        }
        .hkCommunityLivePage.dark .interaction-row.withdrawn .interaction-main p{
            color:#687489;
        }
        .hkCommunityLivePage.dark .withdraw-tag,
        .hkCommunityLivePage.dark .tag.muted{
            background:#242d3a;
            color:#a5b1c3;
        }
        .hkCommunityLivePage.dark .tag.buy,
        .hkCommunityLivePage.dark .tag.material,
        .hkCommunityLivePage.dark .material-btn.done{
            background:#123829;
            color:#5af2a8;
        }
        .hkCommunityLivePage.dark .tag.wait,
        .hkCommunityLivePage.dark .tag.unpaid,
        .hkCommunityLivePage.dark .material-btn,
        .hkCommunityLivePage.dark .tag-row span.warn{
            background:#3a2814;
            color:#ffbd77;
        }
        .hkCommunityLivePage.dark .tag.hot,
        .hkCommunityLivePage.dark .intent,
        .hkCommunityLivePage.dark .tag-row span.danger{
            background:#3b1722;
            color:#ff8faa;
        }
        .hkCommunityLivePage.dark .tag,
        .hkCommunityLivePage.dark .tag-row span,
        .hkCommunityLivePage.dark .recTitle .tag{
            background:#202c3f;
            color:#9ec5ff;
        }
        .hkCommunityLivePage.dark .mute-state{
            background:#3a2814;
            color:#ffbd77;
        }
        .hkCommunityLivePage.dark .detail-tabs,
        .hkCommunityLivePage.dark .detail-card,
        .hkCommunityLivePage.dark .work-head,
        .hkCommunityLivePage.dark .section-head,
        .hkCommunityLivePage.dark .hk-confirm-head{
            border-color:#263142;
        }
        .hkCommunityLivePage.dark .detail-tabs button{
            background:#161c26;
            color:#8e9aad;
        }
        .hkCommunityLivePage.dark .detail-tabs button.active{
            color:#bcaaff;
            border-bottom-color:#7c63ff;
        }
        .hkCommunityLivePage.dark .remark-modal-mask,
        .hkCommunityLivePage.dark .hk-confirm-mask{
            background:rgba(0,0,0,.58);
        }
        .hkCommunityLivePage.dark .hk-confirm-close{
            color:#8e9aad;
        }
        .hkCommunityLivePage.dark .btn.btn-white,
        .hkCommunityLivePage.dark .btn-white{
            background:#202938 !important;
            border-color:#334155 !important;
            color:#d9e2f3 !important;
        }
        .hkCommunityLivePage.dark .btn.btn-white:hover,
        .hkCommunityLivePage.dark .btn-white:hover{
            background:#283449 !important;
            border-color:#42526b !important;
            color:#fff !important;
        }
        .hkCommunityLivePage.dark ::-webkit-scrollbar-thumb{
            background:#38475d;
        }
        .hkCommunityLivePage.dark ::-webkit-scrollbar-track{
            background:transparent;
        }
        /* 社群直播控制台 */
/* 直播社群监控 */
.hkCommunityMonitorPage,.hkCommunityMonitorPage #page-container{height:100%;overflow:hidden}
.hkCommunityMonitorPage{background:#f7f9fc}
.hkCommunityMonitorPage #content.content{height:calc(100vh - 54px);overflow:hidden;display:flex;flex-direction:column;padding-bottom:14px}
.hkCommunityMonitorPage .page-header{flex-shrink:0}
.hkCommunityMonitorPage .monitor-tabs{display:flex;gap:26px;padding:14px 18px;background:#fff;border:1px solid #edf0f5;border-radius:8px;margin-bottom:14px;flex-shrink:0}
.hkCommunityMonitorPage .monitor-tabs a{font-size:16px;color:#111;text-decoration:none}
.hkCommunityMonitorPage .monitor-tabs a.active{color:#6a35ff;font-weight:700}
.hkCommunityMonitorPage .metric-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;margin-bottom:14px;flex-shrink:0}
.hkCommunityMonitorPage .metric-card{background:#fff;border:1px solid #e8edf5;border-radius:8px;padding:17px 18px;box-shadow:0 3px 12px rgba(32,44,70,.04)}
.hkCommunityMonitorPage .metric-card span{display:block;color:#6b7688;font-size:13px}
.hkCommunityMonitorPage .metric-card strong{display:block;font-size:25px;color:#18233a;margin-top:8px}
.hkCommunityMonitorPage .metric-card em{display:block;font-style:normal;color:#15b66d;font-size:12px;margin-top:8px}
.hkCommunityMonitorPage .filter-bar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;background:#fff;border:1px solid #edf0f5;border-radius:8px;padding:14px;margin-bottom:14px;flex-shrink:0}
.hkCommunityMonitorPage .filter-bar .form-control{min-width:160px}
.hkCommunityMonitorPage .monitor-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:14px;min-height:0;flex:1}
.hkCommunityMonitorPage .track-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:14px;min-height:0;flex:1}
.hkCommunityMonitorPage .monitor-panel{background:#fff;border:1px solid #edf0f5;border-radius:8px;padding:14px;min-height:0;overflow:auto}
.hkCommunityMonitorPage .monitor-panel h4{font-size:15px;font-weight:700;margin:0 0 12px}
.hkCommunityMonitorPage .table td{vertical-align:middle!important;word-break:break-word}
.hkCommunityMonitorPage .tag{display:inline-block;padding:3px 8px;border-radius:2px;background:#f3f5fb;color:#546078;margin-right:4px}
.hkCommunityMonitorPage .tag.hot{background:#fff0f2;color:#ff4d6d}
.hkCommunityMonitorPage .tag.ok{background:#e9fff5;color:#16a765}
.hkCommunityMonitorPage .track-row{cursor:pointer}
.hkCommunityMonitorPage .track-row.active{background:#f5f1ff!important}
.hkCommunityMonitorPage .user-card-head{display:flex;gap:12px;align-items:center}
.hkCommunityMonitorPage .user-card-head img{width:58px;height:58px;border-radius:50%;object-fit:cover}
.hkCommunityMonitorPage .user-card-head h3{font-size:18px;margin:0 0 5px}
.hkCommunityMonitorPage .user-meta-row{display:flex;justify-content:space-between;padding:6px 0;color:#566176}
.hkCommunityMonitorPage .user-summary{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.hkCommunityMonitorPage .user-summary div{background:#f8f9fc;padding:8px;border-radius:4px}
.hkCommunityMonitorPage .user-progress{height:5px;background:#e7e9f2;border-radius:10px;overflow:hidden;margin-top:8px}
.hkCommunityMonitorPage .user-progress span{display:block;height:100%;background:#6a35ff}
.hkCommunityMonitorPage .rank-list{list-style:none;margin:0;padding:0}
.hkCommunityMonitorPage .rank-list li{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid #f0f2f6}
.hkCommunityMonitorPage .rank-no{display:inline-block;width:22px;height:22px;line-height:22px;text-align:center;border-radius:4px;background:#edf1f8;color:#526079;margin-right:8px}
.hkCommunityMonitorPage .rank-no.top{background:#6a35ff;color:#fff}
.hkCommunityMonitorPage .funnel{margin-top:12px}
.hkCommunityMonitorPage .funnel div{height:34px;line-height:34px;color:#fff;text-align:center;margin:0 auto 4px;font-weight:700}
.hkCommunityMonitorPage .funnel div:nth-child(1){width:100%;background:#663dff}
.hkCommunityMonitorPage .funnel div:nth-child(2){width:86%;background:#2f7bff}
.hkCommunityMonitorPage .funnel div:nth-child(3){width:72%;background:#16bd83}
.hkCommunityMonitorPage .funnel div:nth-child(4){width:58%;background:#ffb21a}
.hkCommunityMonitorPage .funnel div:nth-child(5){width:44%;background:#ff663d}
@media(max-width:1300px){.hkCommunityMonitorPage .metric-grid{grid-template-columns:repeat(3,1fr)}.hkCommunityMonitorPage .monitor-layout,.hkCommunityMonitorPage .track-layout{grid-template-columns:1fr}}

/* 页面暗黑模式 */
.hkCommunityMonitorPage.dark {
    background: #0f141d;
    color: #d9e0ea;
}
.hkCommunityMonitorPage.dark #page-container {
    background: #0f141d;
}
.hkCommunityMonitorPage.dark #content.content {
    background: #0f141d;
}
.hkCommunityMonitorPage.dark .page-header {
    color: #eef3fb;
}
.hkCommunityMonitorPage.dark .page-header small,
.hkCommunityMonitorPage.dark .text-muted {
    color: #7f8ca1 !important;
}
.hkCommunityMonitorPage.dark .monitor-tabs,
.hkCommunityMonitorPage.dark .metric-card,
.hkCommunityMonitorPage.dark .filter-bar,
.hkCommunityMonitorPage.dark .monitor-panel {
    background: #151c27;
    border-color: #263142;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .18);
}
.hkCommunityMonitorPage.dark .monitor-tabs a {
    color: #dce4ef;
}
.hkCommunityMonitorPage.dark .monitor-tabs a.active {
    color: #9c8cff;
}
.hkCommunityMonitorPage.dark .metric-card span,
.hkCommunityMonitorPage.dark .filter-bar,
.hkCommunityMonitorPage.dark .user-meta-row,
.hkCommunityMonitorPage.dark .metric-card .label {
    color: #93a0b3;
}
.hkCommunityMonitorPage.dark .metric-card strong,
.hkCommunityMonitorPage.dark .monitor-panel h4,
.hkCommunityMonitorPage.dark .user-card-head h3,
.hkCommunityMonitorPage.dark .user-meta-row strong,
.hkCommunityMonitorPage.dark .user-summary strong {
    color: #edf3fb;
}
.hkCommunityMonitorPage.dark .metric-card em {
    color: #3bdd9a;
}
.hkCommunityMonitorPage.dark .table {
    color: #d6deea;
    background: transparent;
}
.hkCommunityMonitorPage.dark .table > thead > tr > th,
.hkCommunityMonitorPage.dark .table > tbody > tr > td {
    border-color: #263142;
}
.hkCommunityMonitorPage.dark .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #182130;
}
.hkCommunityMonitorPage.dark .table-striped > tbody > tr:nth-of-type(even) {
    background-color: #151c27;
}
.hkCommunityMonitorPage.dark .track-row:hover,
.hkCommunityMonitorPage.dark .track-row.active {
    background: #241f3a !important;
}
.hkCommunityMonitorPage.dark .tag {
    background: #222d3d;
    color: #aebbd0;
}
.hkCommunityMonitorPage.dark .tag.hot {
    background: rgba(244, 63, 94, .16);
    color: #ff8fa5;
}
.hkCommunityMonitorPage.dark .tag.ok {
    background: rgba(22, 167, 101, .16);
    color: #56e0a1;
}
.hkCommunityMonitorPage.dark .user-summary div {
    background: #101722;
    border: 1px solid #263142;
}
.hkCommunityMonitorPage.dark .user-progress {
    background: #263142;
}
.hkCommunityMonitorPage.dark .rank-list li {
    border-bottom-color: #263142;
}
.hkCommunityMonitorPage.dark .rank-no {
    background: #222d3d;
    color: #aebbd0;
}
.hkCommunityMonitorPage.dark .rank-no.top {
    background: #7c63ff;
    color: #fff;
}
.hkCommunityMonitorPage.dark .form-control,
.hkCommunityMonitorPage.dark input,
.hkCommunityMonitorPage.dark select,
.hkCommunityMonitorPage.dark textarea,
.hkCommunityMonitorPage.dark .ant-select-selection {
    background: #101722 !important;
    border-color: #2a3547 !important;
    color: #dfe6f1 !important;
}
.hkCommunityMonitorPage.dark .form-control::placeholder,
.hkCommunityMonitorPage.dark input::placeholder,
.hkCommunityMonitorPage.dark textarea::placeholder {
    color: #667389 !important;
}
.hkCommunityMonitorPage.dark .ant-select-selection__placeholder,
.hkCommunityMonitorPage.dark .ant-select-selection-selected-value,
.hkCommunityMonitorPage.dark .ant-select-arrow {
    color: #dfe6f1 !important;
}
.hkCommunityMonitorPage.dark .pagination > li > a,
.hkCommunityMonitorPage.dark .pagination > li > span {
    background: #151c27;
    border-color: #263142;
    color: #d6deea;
}
.hkCommunityMonitorPage.dark .pagination > .active > a,
.hkCommunityMonitorPage.dark .pagination > .active > span {
    background: #7255ff;
    border-color: #7255ff;
    color: #fff;
}
.hkCommunityMonitorPage.dark .dataTables_info {
    color: #93a0b3;
}
.hkCommunityMonitorPage.dark .monitor-panel::-webkit-scrollbar,
.hkCommunityMonitorPage.dark .track-layout::-webkit-scrollbar,
.hkCommunityMonitorPage.dark .monitor-layout::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
.hkCommunityMonitorPage.dark .monitor-panel::-webkit-scrollbar-thumb,
.hkCommunityMonitorPage.dark .track-layout::-webkit-scrollbar-thumb,
.hkCommunityMonitorPage.dark .monitor-layout::-webkit-scrollbar-thumb {
    background: #3b4658;
    border-radius: 99px;
}
.hkCommunityMonitorPage.dark .monitor-panel::-webkit-scrollbar-track,
.hkCommunityMonitorPage.dark .track-layout::-webkit-scrollbar-track,
.hkCommunityMonitorPage.dark .monitor-layout::-webkit-scrollbar-track {
    background: transparent;
}
/* 直播社群监控 */
/* 我的业绩 */

    .hkSalesPage{background:#f6f8fc;color:#172033}
    .hkSalesPage #content.content{min-height:calc(100vh - 54px);padding:16px 18px;background:#f6f8fc}
    .hkSalesPage .sales-shell{background:#fff;border:1px solid #e8edf6;border-radius:8px;box-shadow:0 10px 26px rgba(31,45,78,.05);overflow:hidden}
    .hkSalesPage .sales-top{height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;border-bottom:1px solid #edf1f6}
    .hkSalesPage .sales-tabs{display:flex;gap:28px;height:100%;align-items:center}
    .hkSalesPage .sales-tab{height:100%;display:flex;align-items:center;color:#536077;font-weight:800;cursor:pointer;position:relative}
    .hkSalesPage .sales-tab.active{color:#6545ff}
    .hkSalesPage .sales-tab.active:after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:#6545ff;border-radius:3px}
    .hkSalesPage .sales-actions{display:flex;gap:10px;align-items:center}
    .hkSalesPage .date-input{height:38px;border:1px solid #dfe6f1;border-radius:6px;padding:0 12px;color:#172033;font-weight:700;background:#fff}
    .hkSalesPage .summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:16px}
    .hkSalesPage .summary-card{height:105px;border:1px solid #e7ecf5;border-radius:8px;padding:18px 18px;display:flex;align-items:center;justify-content:space-between;background:#fff}
    .hkSalesPage .summary-card span{display:block;color:#69758a;font-weight:700;font-size:13px}
    .hkSalesPage .summary-card strong{display:block;font-size:25px;color:#172033;margin-top:8px;font-weight:900;letter-spacing:0}
    .hkSalesPage .summary-card em{font-style:normal;color:#1dbb72;font-size:12px;font-weight:700}
    .hkSalesPage .sum-icon{width:44px;height:44px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:900}
    .hkSalesPage .i-purple{background:#efe8ff;color:#6545ff}
    .hkSalesPage .i-blue{background:#eaf3ff;color:#2478ff}
    .hkSalesPage .i-green{background:#e8fbf1;color:#17b870}
    .hkSalesPage .i-orange{background:#fff0dc;color:#ff8a16}
    .hkSalesPage .chart-row{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(360px,.95fr);gap:14px;padding:0 16px 16px}
    .hkSalesPage .panel{border:1px solid #e7ecf5;border-radius:8px;background:#fff;padding:16px}
    .hkSalesPage .panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
    .hkSalesPage .panel-title{font-size:16px;font-weight:900;color:#172033;margin:0}
    .hkSalesPage .select-sm{height:32px;border:1px solid #dfe6f1;border-radius:6px;background:#fff;color:#536077;padding:0 10px}
    .hkSalesPage .chart-box{height:240px;position:relative}
    .hkSalesPage .bottom-row{display:grid;grid-template-columns:minmax(360px,.95fr) minmax(0,1.55fr);gap:14px;padding:0 16px 16px}
    .hkSalesPage .table{margin-bottom:0}
    .hkSalesPage .table>thead>tr>th{background:#f4f6fb;border-bottom:0;color:#6b7588;font-weight:800}
    .hkSalesPage .table>tbody>tr>td{vertical-align:middle;border-color:#eef1f6;color:#263348}
    .hkSalesPage .rank-no{display:inline-block;width:18px;height:18px;line-height:18px;border-radius:4px;text-align:center;background:#e9edf5;color:#7a8496;font-size:12px;font-weight:900;margin-right:8px}
    .hkSalesPage .rank-no.top1{background:#f43f5e;color:#fff}
    .hkSalesPage .rank-no.top2{background:#ff8a16;color:#fff}
    .hkSalesPage .rank-no.top3{background:#ffb020;color:#fff}
    .hkSalesPage .order-user{display:flex;align-items:center;gap:8px}
    .hkSalesPage .avatar{width:28px;height:28px;border-radius:50%;background:#d8eef1;overflow:hidden;display:flex;align-items:center;justify-content:center;color:#557;font-weight:900}
    .hkSalesPage .avatar img{width:100%;height:100%;object-fit:cover}
    .hkSalesPage .muted{color:#8993a5;font-size:12px}
    .hkSalesPage .status-paid{display:inline-block;padding:3px 8px;border-radius:12px;background:#e8fbf1;color:#13ad68;font-weight:800}
    .hkSalesPage .table-panel{display:none;padding:0 16px 16px}
    .hkSalesPage .table-panel.active{display:block}
    .hkSalesPage .pagination-wrap{display:flex;justify-content:space-between;align-items:center;margin-top:12px}
    .hkSalesPage .ant-select-selection,
    .hkSalesPage .form-control{border-color:#dfe6f1;background:#fff;color:#172033}
    .hkSalesPage .ant-select-selection-selected-value{color:#172033}

    .hkSalesPage.dark{background:#0e1117;color:#d9deea}
    .hkSalesPage.dark #content.content{background:#0e1117}
    .hkSalesPage.dark .sales-shell{background:#161c26;border-color:#252d3a;box-shadow:0 10px 26px rgba(0,0,0,.22)}
    .hkSalesPage.dark .sales-top{border-bottom-color:#252d3a}
    .hkSalesPage.dark .sales-tab{color:#9aa5b8}
    .hkSalesPage.dark .sales-tab.active{color:#a99cff}
    .hkSalesPage.dark .sales-tab.active:after{background:#8b7cff}
    .hkSalesPage.dark .summary-card,
    .hkSalesPage.dark .panel{background:#1a2230;border-color:#2b3442;box-shadow:none}
    .hkSalesPage.dark .summary-card span,
    .hkSalesPage.dark .muted{color:#8f9aad}
    .hkSalesPage.dark .summary-card strong,
    .hkSalesPage.dark .panel-title{color:#edf1f8}
    .hkSalesPage.dark .summary-card em{color:#44d391}
    .hkSalesPage.dark .i-purple{background:rgba(101,69,255,.18);color:#b9afff}
    .hkSalesPage.dark .i-blue{background:rgba(36,120,255,.16);color:#8eb9ff}
    .hkSalesPage.dark .i-green{background:rgba(23,184,112,.16);color:#70e3ac}
    .hkSalesPage.dark .i-orange{background:rgba(255,138,22,.16);color:#ffc278}
    .hkSalesPage.dark .table>thead>tr>th{background:#202938;border-color:#2b3442;color:#a5afc0}
    .hkSalesPage.dark .table>tbody>tr>td{background:#1a2230;border-color:#2b3442;color:#dbe2ee}
    .hkSalesPage.dark .table-striped>tbody>tr:nth-of-type(odd)>td{background:#18202d}
    .hkSalesPage.dark .rank-no{background:#2a3445;color:#aeb8c9}
    .hkSalesPage.dark .avatar{background:#2a3445;color:#c9d2e3}
    .hkSalesPage.dark .status-paid{background:rgba(19,173,104,.16);color:#69e0a8}
    .hkSalesPage.dark .ant-select-selection,
    .hkSalesPage.dark .form-control,
    .hkSalesPage.dark .date-input,
    .hkSalesPage.dark .select-sm{background:#121822!important;border-color:#2b3442!important;color:#e5eaf3!important}
    .hkSalesPage.dark .ant-select-selection-selected-value,
    .hkSalesPage.dark .ant-select-arrow,
    .hkSalesPage.dark input{color:#e5eaf3!important}
    .hkSalesPage.dark .btn.btn-white{background:#1a2230!important;border-color:#2b3442!important;color:#dbe2ee!important}
    .hkSalesPage.dark .btn.btn-white:hover{background:#202938!important;border-color:#384456!important;color:#fff!important}
    @media(max-width:1300px){.hkSalesPage .summary-grid{grid-template-columns:repeat(2,1fr)}.hkSalesPage .chart-row,.hkSalesPage .bottom-row{grid-template-columns:1fr}}
    /* 我的业绩 */

/* 提词器用户 */
@keyframes hkTiciqiRegionPulse {
        0%, 100% { opacity: .45; transform: translateY(0); }
        50% { opacity: 1; transform: translateY(-2px); }
    }

.hkTiciqiUserPage .region-distribution-panel{
  margin-bottom: 20px;
}
    .hkTiciqiUserPage .region-distribution-panel.loading:before{
        background: rgba(255, 255, 255, .52);
        border-radius: 14px;
        content: "";
        inset: 0;
        pointer-events: none;
        position: absolute;
        z-index: 2;
    }
    .hkTiciqiUserPage .region-distribution-panel.loading:after{
        animation: hkTiciqiRegionPulse 1s ease-in-out infinite;
        background: rgba(109, 77, 246, .88);
        border-radius: 999px;
        box-shadow: 12px 0 0 rgba(109, 77, 246, .42), 24px 0 0 rgba(109, 77, 246, .18);
        content: "";
        height: 10px;
        position: absolute;
        width: 10px;
        z-index: 3;

        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
    }

    .hkTiciqiUserPage .region-panel-head{
        align-items: center;
        display: flex;
        justify-content: space-between;
    }
    .hkTiciqiUserPage .region-filter{
        background: #f6f8fc;
        border-radius: 12px;
        display: flex;
        padding: 4px;
        position: relative;
        margin-right: 18px;
    }
    .hkTiciqiUserPage .region-filter button{
        background: transparent;
        border: 0;
        border-radius: 9px;
        color: #7b8498;
        font-weight: 700;
        min-width: 72px;
        padding: 8px 18px;
        position: relative;
        transition: background .2s ease, box-shadow .2s ease, color .2s ease, transform .2s ease;
        z-index: 1;
    }
    .hkTiciqiUserPage .region-filter button:hover{
        background: rgba(109, 77, 246, .08);
        color: #6248de;
    }
    .hkTiciqiUserPage .region-filter button:focus{
        outline: none;
    }
    .hkTiciqiUserPage .region-filter button.active{
        background: linear-gradient(135deg, #6d4df6, #8064ff);
        box-shadow: 0 8px 18px rgba(109, 77, 246, .26);
        color: #fff;
    }
    .hkTiciqiUserPage .region-filter button.active:hover{
        color: #fff;
        transform: translateY(-1px);
    }
    .hkTiciqiUserPage .region-panel-body{
        padding: 0 25px 18px 25px;
        align-items: stretch;
        display: grid;
        gap: 26px;
        grid-template-columns: minmax(500px, .92fr) minmax(620px, 1.08fr);
        grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    }
    .hkTiciqiUserPage .region-chart-wrap{
        border-left: 1px solid #eef1f6;
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-width: 0;
        padding-left: 30px;
    }
    .hkTiciqiUserPage .region-chart-area{
        align-items: center;
        display: grid;
        gap: 28px;
        grid-template-columns: 260px 1fr;
        min-height: 260px;
    }
    .hkTiciqiUserPage .region-donut{
        align-items: center;
        border-radius: 50%;
        display: flex;
        height: 240px;
        justify-content: center;
        position: relative;
        transition: transform .24s ease, filter .24s ease;
        width: 240px;
    }
    .hkTiciqiUserPage .region-donut:hover{
        filter: drop-shadow(0 12px 24px rgba(109, 77, 246, .18));
        transform: scale(1.025);
    }
    .hkTiciqiUserPage .region-donut:after{
        background: #fff;
        border-radius: 50%;
        box-shadow: inset 0 0 0 1px #eef1f7;
        content: "";
        height: 132px;
        position: absolute;
        width: 132px;
    }
    .hkTiciqiUserPage .region-donut-center{
        color: #172033;
        font-size: 38px;
        font-weight: 800;
        line-height: 1;
        position: relative;
        text-align: center;
        z-index: 1;
    }
    .hkTiciqiUserPage .region-donut-center span{
        color: #8a94a8;
        display: block;
        font-size: 15px;
        font-weight: 600;
        margin-top: 10px;
    }
    .hkTiciqiUserPage .region-legend{
        display: flex;
        flex-direction: column;
        gap: 13px;
    }
    .hkTiciqiUserPage .region-legend-row{
        align-items: center;
        border-radius: 10px;
        color: #566176;
        display: grid;
        font-size: 15px;
        font-weight: 700;
        grid-template-columns: 16px 1fr 64px 58px;
        gap: 10px;
        margin-left: -8px;
        padding: 5px 8px;
        transition: background .2s ease, transform .2s ease;
    }
    .hkTiciqiUserPage .region-legend-row:hover{
        background: #f7f8fd;
        transform: translateX(3px);
    }
    .hkTiciqiUserPage .region-dot{
        border-radius: 50%;
        display: inline-block;
        height: 12px;
        width: 12px;
    }
    .hkTiciqiUserPage .region-legend-count{
        color: #222b3f;
        text-align: right;
    }
    .hkTiciqiUserPage .region-legend-percent{
        color: #9aa3b5;
        text-align: right;
    }
    .hkTiciqiUserPage .region-rank-area{
        min-width: 0;
    }
    .hkTiciqiUserPage .region-rank-columns{
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 50px;
    }
    .hkTiciqiUserPage .region-rank-title{
        color: #566176;
        font-size: 16px;
        font-weight: 800;
        margin-bottom: 14px;
    }
    .hkTiciqiUserPage .region-rank-list{
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .hkTiciqiUserPage .region-rank-row{
        align-items: center;
        border-radius: 12px;
        display: grid;
        gap: 10px;
        grid-template-columns: 28px 58px 1fr 52px 48px;
        margin: 0 -10px;
        padding: 4px 10px;
        transition: background .2s ease, transform .2s ease;
    }
    .hkTiciqiUserPage .region-rank-row:hover{
        background: #f8f9fd;
        transform: translateX(4px);
    }
    .hkTiciqiUserPage .region-rank-no{
        align-items: center;
        border-radius: 8px;
        color: #fff;
        display: flex;
        font-size: 12px;
        font-weight: 800;
        height: 22px;
        justify-content: center;
        transition: transform .2s ease, box-shadow .2s ease;
        width: 22px;
    }
    .hkTiciqiUserPage .region-rank-row:hover .region-rank-no{
        box-shadow: 0 6px 14px rgba(35, 45, 76, .16);
        transform: scale(1.08);
    }
    .hkTiciqiUserPage .region-rank-name{
        color: #344055;
        font-weight: 800;
    }
    .hkTiciqiUserPage .region-rank-track{
        background: #edf1f7;
        border-radius: 999px;
        display: block;
        height: 8px;
        overflow: hidden;
        position: relative;
        z-index: 1;
    }
    .hkTiciqiUserPage .region-rank-fill{
        border-radius: 999px;
        display: block;
        height: 100%;
        min-width: 4px;
        transition: width .38s ease;
    }
    .hkTiciqiUserPage .region-rank-count{
        color: #344055;
        font-weight: 800;
        text-align: right;
    }
    .hkTiciqiUserPage .region-rank-percent{
        color: #9aa3b5;
        font-weight: 700;
        text-align: right;
        transition: color .2s ease;
    }
    .hkTiciqiUserPage .prompter-rank-row{
        display: grid;
        grid-template-columns: 28px 36px minmax(135px, 1.45fr) minmax(64px, .8fr) 53px 20px;
        gap: 8px;
        align-items: center;
        position: relative;
        padding-bottom: 8px;
        padding-right: 58px;
        border-bottom: 1px solid rgba(226, 232, 240, .8);
        border-radius: 12px;
        transition: all .25s ease;
    }
    .hkTiciqiUserPage .prompter-rank-row:last-child{
        border-bottom: 0;
    }
    .hkTiciqiUserPage .prompter-rank-row:hover{
        background: rgba(109, 77, 246, .06);
        box-shadow: 0 10px 24px rgba(86, 75, 175, .12);
        transform: translateX(6px);
        padding-left: 8px;
    }
    .hkTiciqiUserPage .prompter-rank-avatar{
        width: 34px;
        height: 34px;
        border-radius: 50%;
        object-fit: cover;
        background: #f1f5f9;
    }
    .hkTiciqiUserPage .prompter-rank-user{
        min-width: 0;
        position: relative;
        z-index: 5;
        overflow: visible;
    }
    .hkTiciqiUserPage .prompter-rank-name{
        display: flex;
        align-items: center;
        gap: 6px;
        color: #273142;
        font-weight: 800;
        white-space: nowrap;
        overflow: visible;
        position: relative;
        z-index: 20;
    }
    .hkTiciqiUserPage .prompter-rank-name-text{
        display: inline-block;
        min-width: 0;
        max-width: 112px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .hkTiciqiUserPage .prompter-vip-tag{
        flex: 0 0 auto;
        padding: 1px 6px;
        border-radius: 999px;
        font-size: 11px;
        color: #8a5a00;
        background: #fff2c7;
        position: relative;
        z-index: 30;
        box-shadow: 0 2px 8px rgba(255, 194, 71, .25);
    }
    .hkTiciqiUserPage .prompter-rank-mobile{
        margin-top: 2px;
        color: #8b95a7;
        font-size: 12px;
    }
    .hkTiciqiUserPage .prompter-rank-count{
        color: #5f49f2;
        font-weight: 900;
        text-align: right;
    }
    .hkTiciqiUserPage .prompter-rank-percent{
        color: #8b95a7;
        font-size: 12px;
        text-align: right;
    }
    .hkTiciqiUserPage .prompter-rank-detail{
        position: absolute;
        right: -10px;
        top: 50%;
        transform: translateY(-50%) translateX(8px);
        opacity: 0;
        pointer-events: none;
        border: 0;
        border-radius: 999px;
        padding: 5px 10px;
        color: #fff;
        font-size: 12px;
        font-weight: 800;
        z-index: 10;
        background: linear-gradient(135deg, #7b61ff, #5f49f2);
        box-shadow: 0 8px 18px rgba(95, 73, 242, .22);
        transition: all .22s ease;
    }
    .hkTiciqiUserPage .prompter-rank-row:hover .prompter-rank-detail{
        opacity: 1;
        pointer-events: auto;
        transform: translateY(-50%) translateX(0);
    }
    .hkTiciqiUserPage .vip-source-tags{
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        margin-top: 5px;
    }
    .hkTiciqiUserPage .vip-source-tag{
        display: inline-flex;
        align-items: center;
        height: 20px;
        padding: 0 7px;
        border-radius: 999px;
        background: rgba(109, 77, 246, .1);
        color: #6d4df6;
        font-size: 11px;
        font-weight: 800;
    }
    .hkTiciqiUserPage .ticiqi-detail-modal .modal-dialog{
        width: 920px;
        max-width: calc(100vw - 40px);
    }
    .hkTiciqiUserPage .ticiqi-detail-head{
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 12px 14px;
        border-radius: 12px;
        background: #f7f8ff;
        margin-bottom: 16px;
    }
    .hkTiciqiUserPage .ticiqi-detail-head img{
        width: 54px;
        height: 54px;
        border-radius: 50%;
        object-fit: cover;
    }
    .hkTiciqiUserPage .ticiqi-detail-grid{
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }
    .hkTiciqiUserPage .ticiqi-detail-card{
        border: 1px solid #eef1f7;
        border-radius: 12px;
        padding: 14px;
        background: #fff;
    }
    .hkTiciqiUserPage .ticiqi-detail-card h5{
        margin: 0 0 12px;
        font-size: 16px;
        font-weight: 800;
        color: #1f2937;
    }
    .hkTiciqiUserPage .ticiqi-detail-table{
        width: 100%;
        border-collapse: collapse;
    }
    .hkTiciqiUserPage .ticiqi-detail-table th,
    .hkTiciqiUserPage .ticiqi-detail-table td{
        padding: 9px 6px;
        border-bottom: 1px solid #f0f2f7;
        color: #4b5563;
    }
    .hkTiciqiUserPage .ticiqi-detail-table th{
        color: #697386;
        font-weight: 700;
        background: #f8fafc;
    }
    .hkTiciqiUserPage .ticiqi-mini-page{
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-top: 12px;
        color: #6b7280;
    }
    .hkTiciqiUserPage .region-side-cards{
        display: grid;
        gap: 14px;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        margin-top: 26px;
    }
    .hkTiciqiUserPage .region-side-card{
        align-items: center;
        border: 1px solid #edf0f7;
        border-radius: 14px;
        display: flex;
        gap: 16px;
        min-height: 96px;
        padding: 18px;
        transition: border-color .22s ease, box-shadow .22s ease, transform .22s ease;
    }
    .hkTiciqiUserPage .region-side-card:hover{
        border-color: #e3e7f2;
        box-shadow: 0 10px 24px rgba(34, 45, 80, .08);
        transform: translateY(-2px);
    }
    .hkTiciqiUserPage .region-side-icon{
        align-items: center;
        border-radius: 50%;
        display: flex;
        flex: 0 0 58px;
        font-size: 30px;
        height: 58px;
        justify-content: center;
        transition: transform .24s ease;
        width: 58px;
    }
    .hkTiciqiUserPage .region-side-card:hover .region-side-icon{
        transform: rotate(-4deg) scale(1.06);
    }
    .hkTiciqiUserPage .region-side-icon.purple{ background: #f1ecff; color: #7355f5; }
    .hkTiciqiUserPage .region-side-icon.orange{ background: #fff2e8; color: #ff9148; }
    .hkTiciqiUserPage .region-side-icon.blue{ background: #eef5ff; color: #4f8df7; }
    .hkTiciqiUserPage .region-side-label{
        color: #818ba0;
        font-size: 13px;
    }
    .hkTiciqiUserPage .region-side-value{
        color: #172033;
        font-size: 25px;
        font-weight: 850;
        margin-top: 4px;
    }
    .hkTiciqiUserPage .region-side-value small{
        color: #98a1b3;
        font-size: 13px;
        font-weight: 700;
    }
    .hkTiciqiUserPage .region-empty{
        align-items: center;
        color: #9aa3b5;
        display: flex;
        font-weight: 700;
        justify-content: center;
        min-height: 100px;
    }
    @media (max-width: 1400px) {
        .hkTiciqiUserPage .region-panel-body{
            grid-template-columns: 1fr;
        }
        .hkTiciqiUserPage .region-chart-wrap{
            border-left: 0;
            border-top: 1px solid #eef1f6;
            padding-left: 0;
            padding-top: 24px;
        }
        .hkTiciqiUserPage .region-rank-area{
            padding: 0;
        }
        .hkTiciqiUserPage .region-side-cards{
            grid-template-columns: repeat(3, 1fr);
        }
    }


    /* 页面唯一父级作用域暗黑样式 */

    .hkTiciqiUserPage.dark .page-header,
    .hkTiciqiUserPage.dark .blackTitle,
    .hkTiciqiUserPage.dark .panel-title,
    .hkTiciqiUserPage.dark .bootstrap-dialog-title,
    .hkTiciqiUserPage.dark .region-donut-center,
    .hkTiciqiUserPage.dark .region-side-value,
    .hkTiciqiUserPage.dark .region-rank-name,
    .hkTiciqiUserPage.dark .region-rank-count,
    .hkTiciqiUserPage.dark .region-legend-count,
    .hkTiciqiUserPage.dark .prompter-rank-name,
    .hkTiciqiUserPage.dark .ticiqi-detail-card h5 {
        color: #eef3ff !important;
    }

    .hkTiciqiUserPage.dark .region-distribution-panel.loading:before {
        background: rgba(15, 19, 26, .58);
    }
    .hkTiciqiUserPage.dark .region-filter {
        background: #101721;
        border: 1px solid #252e3d;
    }
    .hkTiciqiUserPage.dark .region-filter button {
        color: #98a4b8;
    }
    .hkTiciqiUserPage.dark .region-filter button:hover,
    .hkTiciqiUserPage.dark .region-filter button.active {
        color: #fff;
    }
    .hkTiciqiUserPage.dark .region-chart-wrap,
    .hkTiciqiUserPage.dark .region-panel-body,
    .hkTiciqiUserPage.dark .region-rank-row,
    .hkTiciqiUserPage.dark .prompter-rank-row,
    .hkTiciqiUserPage.dark .ticiqi-detail-table th,
    .hkTiciqiUserPage.dark .ticiqi-detail-table td {
        border-color: #252e3d !important;
    }
    .hkTiciqiUserPage.dark .region-rank-row:hover,
    .hkTiciqiUserPage.dark .prompter-rank-row:hover,
    .hkTiciqiUserPage.dark .region-legend-row:hover,
    .hkTiciqiUserPage.dark .region-side-card:hover {
        background: #1b2431;
        box-shadow: 0 10px 24px rgba(0, 0, 0, .24);
    }
    .hkTiciqiUserPage.dark .region-rank-track {
        background: #243044;
    }
    .hkTiciqiUserPage.dark .region-donut:after {
        background: #151c26;
        box-shadow: inset 0 0 0 1px #283244;
    }
    .hkTiciqiUserPage.dark .region-empty,
    .hkTiciqiUserPage.dark .empty,
    .hkTiciqiUserPage.dark .dataTables_info {
        color: #8d98ac !important;
    }
    .hkTiciqiUserPage.dark .vip-source-tag {
        background: rgba(122, 97, 255, .18);
        color: #b7a7ff;
    }
    .hkTiciqiUserPage.dark .prompter-vip-tag {
        background: rgba(255, 201, 83, .18);
        color: #ffd782;
    }
    .hkTiciqiUserPage.dark .region-side-icon.purple { background: rgba(115, 85, 245, .18); color: #b3a2ff; }
    .hkTiciqiUserPage.dark .region-side-icon.orange { background: rgba(255, 145, 72, .16); color: #ffc08f; }
    .hkTiciqiUserPage.dark .region-side-icon.blue { background: rgba(79, 141, 247, .16); color: #9fc3ff; }
    .hkTiciqiUserPage.dark .ticiqi-detail-table th {
        background: #111821 !important;
        color: #a7b2c6 !important;
    }
    .hkTiciqiUserPage.dark .ticiqi-detail-head {
        background: #111821 !important;
    }
    .hkTiciqiUserPage.dark .ticiqi-detail-card pre,
    .hkTiciqiUserPage.dark pre {
        background: #101721 !important;
        border-color: #252e3d !important;
        color: #d8deea !important;
    }

    .hkTiciqiUserPage.dark .pagination > li > a,
    .hkTiciqiUserPage.dark .pagination > li > span {
        background: #151c26;
        border-color: #273247;
        color: #9aa6bb;
    }
    .hkTiciqiUserPage.dark .pagination > .active > a,
    .hkTiciqiUserPage.dark .pagination > .active > span {
        background: #6a5bfa;
        border-color: #6a5bfa;
        color: #fff;
    }
    /* 提词器用户 */

/* 主播管理 */

    .hkTiciqiAnchorPage .anchor-dashboard-head {
        align-items: center;
        display: flex;
        justify-content: space-between;
        margin-bottom: 18px;
    }
    .hkTiciqiAnchorPage .anchor-dashboard-head .refresh-info {
        color: #8c96aa;
        font-weight: 700;
    }
    .hkTiciqiAnchorPage .anchor-refresh-btn {
        background: #fff;
        border: 1px solid #e9edf5;
        border-radius: 10px;
        box-shadow: 0 6px 18px rgba(34,45,80,.06);
        color: #6d4df6;
        font-weight: 800;
        padding: 8px 18px;
        transition: transform .2s ease, box-shadow .2s ease;
    }
    .hkTiciqiAnchorPage .anchor-refresh-btn:hover {
        box-shadow: 0 10px 24px rgba(34,45,80,.12);
        transform: translateY(-1px);
    }
    .hkTiciqiAnchorPage .anchor-stat-cards {
        display: grid;
        gap: 16px;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        margin-bottom: 18px;
    }
    .hkTiciqiAnchorPage .anchor-stat-card {
        align-items: center;
        background: #fff;
        border: 1px solid #eef1f7;
        border-radius: 14px;
        box-shadow: 0 8px 24px rgba(34,45,80,.06);
        display: flex;
        min-height: 118px;
        overflow: hidden;
        padding: 22px;
        position: relative;
        transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
    }
    .hkTiciqiAnchorPage .anchor-stat-card:hover {
        border-color: #e5e8f2;
        box-shadow: 0 14px 30px rgba(34,45,80,.11);
        transform: translateY(-2px);
    }
    .hkTiciqiAnchorPage .anchor-stat-card .ico {
        flex: 0 0 58px;
        margin-right: 18px;
    }
    .hkTiciqiAnchorPage .anchor-stat-card .ico img {
        display: block;
        height: 58px;
        object-fit: contain;
        width: 58px;
    }
    .hkTiciqiAnchorPage .anchor-stat-title {
        color: #7f8aa0;
        font-weight: 800;
        margin-bottom: 8px;
    }
    .hkTiciqiAnchorPage .anchor-stat-num {
        color: #172033;
        font-size: 28px;
        font-weight: 850;
        line-height: 1;
    }
    .hkTiciqiAnchorPage .anchor-stat-num small {
        color: #667085;
        font-size: 14px;
        font-weight: 700;
    }
    .hkTiciqiAnchorPage .anchor-stat-sub {
        color: #69758c;
        font-size: 13px;
        font-weight: 700;
        margin-top: 10px;
    }
    .hkTiciqiAnchorPage .anchor-stat-sub .up { color: #f36b55; }
    .hkTiciqiAnchorPage .anchor-stat-sub .down { color: #5cc69a; }
    .hkTiciqiAnchorPage .anchor-card-ring {
        border-radius: 50%;
        height: 76px;
        margin-left: auto;
        position: relative;
        width: 76px;
    }
    .hkTiciqiAnchorPage .anchor-card-ring:after {
        background: #fff;
        border-radius: 50%;
        content: "";
        inset: 12px;
        position: absolute;
    }
    .hkTiciqiAnchorPage .anchor-card-ring span {
        color: #6d4df6;
        font-size: 13px;
        font-weight: 850;
        left: 50%;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
        z-index: 1;
    }
    .hkTiciqiAnchorPage .anchor-mini-line {
        bottom: 16px;
        height: 42px;
        opacity: .8;
        position: absolute;
        right: 18px;
        width: 130px;
    }
    .hkTiciqiAnchorPage .anchor-charts {
        display: grid;
        gap: 18px;
        grid-template-columns: minmax(520px, 1.05fr) minmax(520px, 1.1fr) minmax(420px, .95fr);
        margin-bottom: 18px;
    }
    .hkTiciqiAnchorPage .anchor-chart-card {
        background: #fff;
        border: 1px solid #eef1f7;
        border-radius: 14px;
        box-shadow: 0 8px 24px rgba(34,45,80,.06);
        min-height: 340px;
        overflow: hidden;
        padding: 24px;
        transition: transform .22s ease, box-shadow .22s ease;
    }
    .hkTiciqiAnchorPage .anchor-chart-card:hover {
        box-shadow: 0 14px 30px rgba(34,45,80,.1);
        transform: translateY(-1px);
    }
    .hkTiciqiAnchorPage .anchor-chart-title {
        color: #1f2937;
        font-size: 20px;
        font-weight: 850;
        margin-bottom: 18px;
    }
    .hkTiciqiAnchorPage .anchor-status-layout {
        align-items: center;
        display: grid;
        gap: 26px;
        grid-template-columns: 230px minmax(260px, 1fr);
    }
    .hkTiciqiAnchorPage .anchor-donut {
        align-items: center;
        border-radius: 50%;
        display: flex;
        height: 220px;
        justify-content: center;
        position: relative;
        transition: transform .22s ease, filter .22s ease;
        width: 220px;
    }
    .hkTiciqiAnchorPage .anchor-donut:hover {
        filter: drop-shadow(0 12px 22px rgba(109,77,246,.18));
        transform: scale(1.02);
    }
    .hkTiciqiAnchorPage .anchor-donut:after {
        background: #fff;
        border-radius: 50%;
        box-shadow: inset 0 0 0 1px #eef1f7;
        content: "";
        height: 124px;
        position: absolute;
        width: 124px;
    }
    .hkTiciqiAnchorPage .anchor-donut-center {
        color: #172033;
        font-size: 34px;
        font-weight: 850;
        position: relative;
        text-align: center;
        z-index: 1;
    }
    .hkTiciqiAnchorPage .anchor-donut-center span {
        color: #8993a8;
        display: block;
        font-size: 14px;
        font-weight: 700;
        margin-top: 8px;
    }
    .hkTiciqiAnchorPage .anchor-legend {
        display: flex;
        flex-direction: column;
        gap: 18px;
        min-width: 0;
    }
    .hkTiciqiAnchorPage .anchor-legend-row {
        align-items: center;
        border-radius: 12px;
        color: #566176;
        display: grid;
        font-weight: 800;
        gap: 12px;
        grid-template-columns: 12px minmax(150px, 1fr) 52px 68px;
        padding: 7px 10px;
        transition: background .2s ease, transform .2s ease;
        white-space: nowrap;
    }
    .hkTiciqiAnchorPage .anchor-legend-row:hover {
        background: #f8f9fd;
        transform: translateX(3px);
    }
    .hkTiciqiAnchorPage .anchor-dot {
        border-radius: 50%;
        height: 12px;
        width: 12px;
    }
    .hkTiciqiAnchorPage .anchor-trend-head {
        align-items: center;
        display: flex;
        justify-content: space-between;
    }
    .hkTiciqiAnchorPage .anchor-trend-legend {
        color: #79849a;
        display: flex;
        font-weight: 800;
        gap: 18px;
    }
    .hkTiciqiAnchorPage .anchor-trend-legend span:before {
        border-radius: 50%;
        content: "";
        display: inline-block;
        height: 8px;
        margin-right: 6px;
        width: 8px;
    }
    .hkTiciqiAnchorPage .anchor-trend-legend .new:before { background: #6d4df6; }
    .hkTiciqiAnchorPage .anchor-trend-legend .active:before { background: #797cff; }
    .hkTiciqiAnchorPage .anchor-trend-board {
        background:
            linear-gradient(to bottom, transparent 0, transparent 24%, #edf1f7 24.5%, transparent 25%),
            linear-gradient(to bottom, transparent 0, transparent 49%, #edf1f7 49.5%, transparent 50%),
            linear-gradient(to bottom, transparent 0, transparent 74%, #edf1f7 74.5%, transparent 75%);
        display: grid;
        gap: 10px;
        grid-template-columns: repeat(7, minmax(0, 1fr));
        height: 230px;
        margin-top: 14px;
        padding: 12px 10px 0;
    }
    .hkTiciqiAnchorPage .anchor-trend-day {
        align-items: center;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        min-width: 0;
        position: relative;
    }
    .hkTiciqiAnchorPage .anchor-trend-bars {
        align-items: flex-end;
        display: flex;
        gap: 7px;
        height: 168px;
        justify-content: center;
        width: 100%;
    }
    .hkTiciqiAnchorPage .anchor-trend-bar {
        border-radius: 999px 999px 4px 4px;
        min-height: 6px;
        transition: height .25s ease, transform .2s ease;
        width: 10px;
    }
    .hkTiciqiAnchorPage .anchor-trend-day:hover .anchor-trend-bar {
        transform: translateY(-2px);
    }
    .hkTiciqiAnchorPage .anchor-trend-bar.new {
        background: linear-gradient(180deg, #7d61ff, #6d4df6);
    }
    .hkTiciqiAnchorPage .anchor-trend-bar.active {
        background: linear-gradient(180deg, #85b1ff, #797cff);
    }
    .hkTiciqiAnchorPage .anchor-trend-label {
        color: #8d96aa;
        font-size: 12px;
        font-weight: 800;
        margin-top: 12px;
        white-space: nowrap;
    }
    .hkTiciqiAnchorPage .anchor-trend-tooltip {
        background: rgba(24, 31, 45, .94);
        border-radius: 8px;
        bottom: 194px;
        box-shadow: 0 10px 24px rgba(20, 26, 40, .18);
        color: #fff;
        left: 50%;
        min-width: 126px;
        opacity: 0;
        padding: 10px 12px;
        pointer-events: none;
        position: absolute;
        transform: translateX(-50%) translateY(6px);
        transition: opacity .18s ease, transform .18s ease;
        z-index: 5;
    }
    .hkTiciqiAnchorPage .anchor-trend-tooltip:after {
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: 6px solid rgba(24, 31, 45, .94);
        bottom: -6px;
        content: "";
        left: 50%;
        position: absolute;
        transform: translateX(-50%);
    }
    .hkTiciqiAnchorPage .anchor-trend-day:hover .anchor-trend-tooltip {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
    .hkTiciqiAnchorPage .anchor-tooltip-date {
        color: #d7dbea;
        font-size: 12px;
        font-weight: 800;
        margin-bottom: 7px;
    }
    .hkTiciqiAnchorPage .anchor-tooltip-row {
        align-items: center;
        display: flex;
        font-size: 12px;
        font-weight: 800;
        justify-content: space-between;
        line-height: 1.8;
    }
    .hkTiciqiAnchorPage .anchor-tooltip-row span:first-child:before {
        border-radius: 50%;
        content: "";
        display: inline-block;
        height: 7px;
        margin-right: 6px;
        width: 7px;
    }
    .hkTiciqiAnchorPage .anchor-tooltip-row.new span:first-child:before { background: #7d61ff; }
    .hkTiciqiAnchorPage .anchor-tooltip-row.active span:first-child:before { background: #85b1ff; }
    .hkTiciqiAnchorPage .anchor-code-gauge {
        align-items: center;
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-height: 250px;
    }
    .hkTiciqiAnchorPage .anchor-gauge-wrap {
        height: 160px;
        margin-top: 8px;
        overflow: visible;
        position: relative;
        width: 280px;
    }
    .hkTiciqiAnchorPage .anchor-gauge-canvas {
        height: 150px;
        left: 0;
        position: absolute;
        top: 0;
        width: 280px;
    }
    .hkTiciqiAnchorPage .anchor-gauge-scale {
        bottom: 0;
        color: #8d96aa;
        display: flex;
        font-size: 12px;
        font-weight: 800;
        justify-content: space-between;
        left: 18px;
        position: absolute;
        width: 244px;
        z-index: 2;
    }
    .hkTiciqiAnchorPage .anchor-gauge-value {
        color: #172033;
        font-size: 32px;
        font-weight: 850;
        margin-top: -34px;
        position: relative;
        z-index: 1;
    }
    .hkTiciqiAnchorPage .anchor-gauge-value small {
        color: #566176;
        font-size: 18px;
    }
    .hkTiciqiAnchorPage .anchor-gauge-label {
        color: #8b95a9;
        font-weight: 800;
        margin-top: 6px;
    }
    .hkTiciqiAnchorPage .anchor-gauge-rate {
        color: #6d4df6;
        font-size: 18px;
        font-weight: 850;
        margin-top: 18px;
    }
    @media (max-width: 1500px) {
        .hkTiciqiAnchorPage .anchor-stat-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        .hkTiciqiAnchorPage .anchor-charts { grid-template-columns: 1fr; }
    }

    .hkTiciqiAnchorPage {
        background: #f6f8fc;
    }

    .hkTiciqiAnchorPage.dark .page-header {
        color: #eef3ff;
    }
    .hkTiciqiAnchorPage.dark .page-header small,
    .hkTiciqiAnchorPage.dark .refresh-info,
    .hkTiciqiAnchorPage.dark .anchor-stat-title,
    .hkTiciqiAnchorPage.dark .anchor-stat-sub,
    .hkTiciqiAnchorPage.dark .anchor-donut-center span,
    .hkTiciqiAnchorPage.dark .anchor-trend-legend,
    .hkTiciqiAnchorPage.dark .anchor-trend-label,
    .hkTiciqiAnchorPage.dark .anchor-gauge-scale,
    .hkTiciqiAnchorPage.dark .anchor-gauge-label {
        color: #8f9aaf;
    }
    .hkTiciqiAnchorPage.dark .anchor-refresh-btn,
    .hkTiciqiAnchorPage.dark .anchor-stat-card,
    .hkTiciqiAnchorPage.dark .anchor-chart-card,
    .hkTiciqiAnchorPage.dark .panel,
    .hkTiciqiAnchorPage.dark .modal-content {
        background: #161c26;
        border-color: #263141;
        box-shadow: 0 10px 28px rgba(0,0,0,.28);
        color: #d8dfec;
    }
    .hkTiciqiAnchorPage.dark .anchor-refresh-btn {
        color: #a998ff;
    }
    .hkTiciqiAnchorPage.dark .anchor-refresh-btn:hover,
    .hkTiciqiAnchorPage.dark .anchor-stat-card:hover,
    .hkTiciqiAnchorPage.dark .anchor-chart-card:hover {
        border-color: #344158;
        box-shadow: 0 16px 34px rgba(0,0,0,.34);
    }
    .hkTiciqiAnchorPage.dark .anchor-stat-num,
    .hkTiciqiAnchorPage.dark .anchor-chart-title,
    .hkTiciqiAnchorPage.dark .anchor-donut-center,
    .hkTiciqiAnchorPage.dark .anchor-gauge-value,
    .hkTiciqiAnchorPage.dark .panel-title,
    .hkTiciqiAnchorPage.dark .bootstrap-dialog-title,
    .hkTiciqiAnchorPage.dark .form-group label,
    .hkTiciqiAnchorPage.dark .table>thead>tr>th,
    .hkTiciqiAnchorPage.dark .table>tbody>tr>td {
        color: #eef3ff;
    }
    .hkTiciqiAnchorPage.dark .anchor-stat-num small,
    .hkTiciqiAnchorPage.dark .anchor-gauge-value small,
    .hkTiciqiAnchorPage.dark .helpTips,
    .hkTiciqiAnchorPage.dark .text-muted {
        color: #9ca7ba !important;
    }
    .hkTiciqiAnchorPage.dark .anchor-card-ring:after,
    .hkTiciqiAnchorPage.dark .anchor-donut:after {
        background: #161c26;
        box-shadow: inset 0 0 0 1px #2b3546;
    }
    .hkTiciqiAnchorPage.dark .anchor-legend-row,
    .hkTiciqiAnchorPage.dark .anchor-tooltip-row,
    .hkTiciqiAnchorPage.dark .anchor-tooltip-date {
        color: #d8dfec;
    }
    .hkTiciqiAnchorPage.dark .anchor-legend-row:hover {
        background: #202938;
    }
    .hkTiciqiAnchorPage.dark .anchor-trend-board {
        background:
            linear-gradient(to bottom, transparent 0, transparent 24%, #2a3343 24.5%, transparent 25%),
            linear-gradient(to bottom, transparent 0, transparent 49%, #2a3343 49.5%, transparent 50%),
            linear-gradient(to bottom, transparent 0, transparent 74%, #2a3343 74.5%, transparent 75%);
    }
    .hkTiciqiAnchorPage.dark .anchor-trend-tooltip {
        background: rgba(5, 8, 13, .96);
        box-shadow: 0 10px 26px rgba(0,0,0,.42);
    }
    .hkTiciqiAnchorPage.dark .anchor-trend-tooltip:after {
        border-top-color: rgba(5, 8, 13, .96);
    }
    .hkTiciqiAnchorPage.dark .anchor-gauge-rate,
    .hkTiciqiAnchorPage.dark .anchor-card-ring span {
        color: #a998ff;
    }
    .hkTiciqiAnchorPage.dark .hkTypeXxk span {
        background: #202938;
        border-color: #344158;
        color: #dbe3f1;
    }
    .hkTiciqiAnchorPage.dark .hkTypeXxk input:checked + span {
        color: #fff;
    }
    .hkTiciqiAnchorPage.dark .fmImg {
        background: #202938;
        border-color: #344158;
    }
    .hkTiciqiAnchorPage.dark .backPapaerNum {
        background: #121821;
        border-top-color: #263141;
        box-shadow: 0 -1px 8px rgba(0,0,0,.28);
    }
    .hkTiciqiAnchorPage.dark .dataTables_info,
    .hkTiciqiAnchorPage.dark .pagination>li>a {
        color: #d8dfec;
    }
    .hkTiciqiAnchorPage.dark .pagination>li>a {
        background: #161c26;
        border-color: #2b3546;
    }
    .hkTiciqiAnchorPage.dark .pagination>.active>a,
    .hkTiciqiAnchorPage.dark .pagination>.active>a:hover {
        background: #6d4df6;
        border-color: #6d4df6;
        color: #fff;
    }
    .hkTiciqiAnchorPage.dark .hk-more-panel {
        background: #161c26;
        border-color: #2b3546;
        box-shadow: 0 18px 42px rgba(0,0,0,.42);
    }
    .hkTiciqiAnchorPage.dark .hk-more-item {
        color: #d8dfec;
    }
    .hkTiciqiAnchorPage.dark .hk-more-item:hover {
        background: #202938;
    }
    .hkTiciqiAnchorPage.dark .hk-more-divider {
        background: #2b3546;
    }
    /* 主播管理 */

/* 稿件管理 */
.hkTiciqiProposalPage   .trendCanvas{display:block;width:100%;height:198px;}

    .hkTiciqiProposalPage .dash{margin-bottom:18px;}
    .hkTiciqiProposalPage .cardGrid{display:grid;grid-template-columns:repeat(5,minmax(160px,1fr));gap:14px;margin-bottom:16px;}
    .hkTiciqiProposalPage .statCard{position:relative;overflow:hidden;min-height:126px;padding:20px 18px;border:1px solid #edf0f8;border-radius:18px;background:rgba(255,255,255,.94);box-shadow:0 14px 34px rgba(25,34,58,.06);transition:all .3s ease;}
    .hkTiciqiProposalPage .statCard:hover{transform:translateY(-4px);box-shadow:0 20px 46px rgba(90,77,246,.14);border-color:#ded8ff;}
    .hkTiciqiProposalPage .statMain{display:flex;align-items:center;gap:14px;}
    .hkTiciqiProposalPage .statIcon{width:58px;height:58px;border-radius:18px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:25px;box-shadow:0 10px 22px rgba(109,77,246,.22);}
    .hkTiciqiProposalPage .tone-purple{background:linear-gradient(135deg,#8c63ff,#6545f5)}
    .hkTiciqiProposalPage .tone-blue{background:linear-gradient(135deg,#60a5ff,#2d7cf8)}
    .hkTiciqiProposalPage .tone-teal{background:linear-gradient(135deg,#20d0c6,#0fb3ad)}
    .hkTiciqiProposalPage .tone-violet{background:linear-gradient(135deg,#a278ff,#7453f8)}
    .hkTiciqiProposalPage .tone-orange{background:linear-gradient(135deg,#ffbf48,#f59b22)}
    .hkTiciqiProposalPage .statTitle{color:#8791a6;font-size:13px;margin-bottom:8px;}
    .hkTiciqiProposalPage .statValue{font-size:28px;font-weight:900;color:#172033;letter-spacing:.2px;line-height:1.1;}
    .hkTiciqiProposalPage .statCompare{margin-top:8px;color:#8b95a7;font-size:12px;}
    .hkTiciqiProposalPage .spark{position:absolute;right:16px;bottom:14px;width:96px;height:38px;opacity:.9;}
    .hkTiciqiProposalPage .dashGrid{display:grid;grid-template-columns:1fr 1.18fr 1fr;gap:16px;margin-bottom:16px;}
    .hkTiciqiProposalPage .dashPanel{border:1px solid #edf0f8;border-radius:18px;background:rgba(255,255,255,.96);box-shadow:0 14px 34px rgba(25,34,58,.06);padding:18px;transition:all .3s ease;}
    .hkTiciqiProposalPage .dashPanel:hover{transform:translateY(-2px);box-shadow:0 20px 44px rgba(90,77,246,.12);}
    .hkTiciqiProposalPage .dashHead{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
    .hkTiciqiProposalPage .dashTitle{font-size:18px;font-weight:900;color:#172033;}
    .hkTiciqiProposalPage .rankRow{
      position:relative;display:grid;
      grid-template-columns: 30px 40px minmax(145px,1fr) minmax(68px,1fr) 58px;
      align-items:center;gap:10px;min-height:46px;border-radius:12px;padding:6px 8px;transition:all .3s ease;}
    .hkTiciqiProposalPage .rankRow:hover{background:#f6f3ff;transform:translateX(4px);}
    .hkTiciqiProposalPage .rankNo{width:26px;height:26px;border-radius:9px;background:#7a5cf7;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;}
    .hkTiciqiProposalPage .rankRow:nth-child(2) .rankNo{background:#6fa4fb;}
    .hkTiciqiProposalPage .rankRow:nth-child(3) .rankNo{background:#58cfa2;}
    .hkTiciqiProposalPage .rankAvatar{width:34px;height:34px;border-radius:50%;object-fit:cover;background:#f2efff;}
    .hkTiciqiProposalPage .rankName{font-weight:800;color:#273142;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
    .hkTiciqiProposalPage .rankMobile{font-size:12px;color:#8b95a7;}
    .hkTiciqiProposalPage .rankBar{height:8px;border-radius:999px;background:#edf1f8;overflow:hidden;}
    .hkTiciqiProposalPage .rankFill{height:100%;border-radius:999px;background:linear-gradient(90deg,#8a63ff,#6c4ff7);transition:width .3s ease;}
    .hkTiciqiProposalPage .rankCount{font-weight:900;color:#694df4;text-align:right;}
    .hkTiciqiProposalPage .rankDetail{border:0;border-radius:100px;background:#6d52f6;color:#fff;font-weight:900;padding:6px 9px;opacity:0;transform:translateX(6px);transition:all .3s ease;
      right: 0;
      position: absolute;
  box-shadow: 0 8px 18px rgba(95, 73, 242, .22);
  transition: all .22s ease;}
    .hkTiciqiProposalPage .rankRow:hover .rankDetail{opacity:1;transform:translateX(0);}
    .hkTiciqiProposalPage .trendSvg{position:absolute;left:18px;right:12px;top:18px;width:calc(100% - 30px);height:205px;display:block;overflow:visible;}
    .hkTiciqiProposalPage .trendChart{position:relative;height:260px;padding:8px 4px 26px;border-radius:16px;background:linear-gradient(180deg,#fbfaff 0%,#fff 100%);overflow:hidden;}
    .hkTiciqiProposalPage .trendGrid line{stroke:#e8eaf3;stroke-dasharray:5 6;stroke-width:1;}
    .hkTiciqiProposalPage .trendAxis{position:absolute;left:18px;right:12px;bottom:5px;display:flex;justify-content:space-between;color:#8b95a7;font-size:12px;font-weight:700;}
    .hkTiciqiProposalPage .trendArea{fill:url(#proposalTrendArea);opacity:1;}
    .hkTiciqiProposalPage .trendLine{fill:none;stroke:#7357f6;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 8px 14px rgba(115,87,246,.26));}
    .hkTiciqiProposalPage .trendBase{stroke:#7357f6;stroke-width:2;stroke-dasharray:8 12;opacity:.18;}
    .hkTiciqiProposalPage .trendDot{fill:#fff;stroke:#7357f6;stroke-width:4;transition:all .3s ease;}
    .hkTiciqiProposalPage .trendHit{fill:transparent;cursor:pointer;}
    .hkTiciqiProposalPage .trendHit:hover + .trendDot{r:7;filter:drop-shadow(0 4px 10px rgba(115,87,246,.35));}
    .hkTiciqiProposalPage .trendPoint{width:28px;height:28px;margin-left:-14px;margin-top:-14px;border-radius:50%;cursor:pointer;}
    .hkTiciqiProposalPage .trendTip{position:absolute;left:50%;top:0;z-index:6;white-space:nowrap;background:#fff;color:#172033;border:1px solid #edf0f8;border-radius:10px;padding:8px 10px;font-size:12px;font-weight:800;box-shadow:0 12px 28px rgba(31,42,68,.14);opacity:0;pointer-events:none;transform:translate(-50%,-110%);transition:all .3s ease;}
    .hkTiciqiProposalPage .trendPoint:hover .trendTip{opacity:1;transform:translate(-50%,-126%);}
    .hkTiciqiProposalPage .trendMeta{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px;}
    .hkTiciqiProposalPage .trendMetaItem{border-radius:14px;background:#f8f9ff;padding:12px 14px;color:#69748a;}
    .hkTiciqiProposalPage .trendMetaItem b{display:block;color:#172033;font-size:18px;margin-top:4px;}
    .hkTiciqiProposalPage .rankTabs{display:flex;gap:8px;background:#f5f6fb;border-radius:12px;padding:5px;}
    .hkTiciqiProposalPage .rankTab{border:0;background:transparent;border-radius:10px;padding:8px 18px;color:#69748a;transition:all .3s ease;}
    .hkTiciqiProposalPage .rankTab.active,.hkTiciqiProposalPage .rankTab:hover{background:#7357f6;color:#fff;box-shadow:0 10px 20px rgba(115,87,246,.22);}
    .hkTiciqiProposalPage .titleRankRow{display:grid;grid-template-columns:40px minmax(140px,1fr) 70px 70px;gap:10px;align-items:center;min-height:46px;padding:8px;border-bottom:1px solid #edf0f8;border-radius:12px;transition:all .3s ease;}
    .hkTiciqiProposalPage .titleRankRow:hover{background:#f7f5ff;transform:translateX(4px);}
    .hkTiciqiProposalPage .titleRankName{font-weight:800;color:#2b3448;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
    .hkTiciqiProposalPage .titleCount{font-weight:900;color:#5f49ed;text-align:right;}
    .hkTiciqiProposalPage .titleDelta{font-weight:800;text-align:right;color:#f05365;}
    .hkTiciqiProposalPage .listTabs{display:flex;gap:10px;margin:0 0 16px;}
    .hkTiciqiProposalPage .listTab{border:0;border-radius:13px;padding:10px 22px;background:#f3f5fb;color:#69748a;font-weight:900;transition:all .3s ease;}
    .hkTiciqiProposalPage .listTab.active,.hkTiciqiProposalPage .listTab:hover{background:#7357f6;color:#fff;box-shadow:0 12px 24px rgba(115,87,246,.2);}
    .hkTiciqiProposalPage .batchBar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:14px 0 0;padding:12px 14px;border-radius:14px;background:#fafbff;border:1px solid #edf0f8;}
    .hkTiciqiProposalPage .check{width:18px;height:18px;cursor:pointer;}
    @media (max-width:1500px){.hkTiciqiProposalPage .cardGrid{grid-template-columns:repeat(3,1fr)}.hkTiciqiProposalPage .dashGrid{grid-template-columns:1fr}.hkTiciqiProposalPage .spark{display:none}}

    .hkTiciqiProposalPage.dark .dash,
    .hkTiciqiProposalPage.dark #ticiqi-proposal-app {
        color: #f3f5fb;
    }
    .hkTiciqiProposalPage.dark .statCard,
    .hkTiciqiProposalPage.dark .dashPanel,
    .hkTiciqiProposalPage.dark .trendTip,
    .hkTiciqiProposalPage.dark .batchBar {
        background: #111518;
        border-color: #252935;
        box-shadow: 0 8px 22px rgba(0,0,0,.18);
    }
    .hkTiciqiProposalPage.dark .statCard:hover,
    .hkTiciqiProposalPage.dark .dashPanel:hover {
        border-color: rgba(198,148,250,.42);
        box-shadow: 0 12px 28px rgba(0,0,0,.28);
    }
    .hkTiciqiProposalPage.dark .statTitle,
    .hkTiciqiProposalPage.dark .statCompare,
    .hkTiciqiProposalPage.dark .rankMobile,
    .hkTiciqiProposalPage.dark .trendAxis,
    .hkTiciqiProposalPage.dark .trendMetaItem,
    .hkTiciqiProposalPage.dark .rankTab,
    .hkTiciqiProposalPage.dark .listTab {
        color: rgba(255,255,255,.56);
    }
    .hkTiciqiProposalPage.dark .statValue,
    .hkTiciqiProposalPage.dark .dashTitle,
    .hkTiciqiProposalPage.dark .rankName,
    .hkTiciqiProposalPage.dark .trendTip,
    .hkTiciqiProposalPage.dark .trendMetaItem b,
    .hkTiciqiProposalPage.dark .titleRankName {
        color: #fff;
    }
    .hkTiciqiProposalPage.dark .rankRow:hover,
    .hkTiciqiProposalPage.dark .titleRankRow:hover {
        background: rgba(114,85,255,.12);
    }
    .hkTiciqiProposalPage.dark .rankBar {
        background: #252935;
    }
    .hkTiciqiProposalPage.dark .rankTabs,
    .hkTiciqiProposalPage.dark .listTabs .listTab,
    .hkTiciqiProposalPage.dark .trendMetaItem {
        background: #1e2329;
    }
    .hkTiciqiProposalPage.dark .rankTab.active,
    .hkTiciqiProposalPage.dark .rankTab:hover,
    .hkTiciqiProposalPage.dark .listTab.active,
    .hkTiciqiProposalPage.dark .listTab:hover {
        background: linear-gradient(to right, rgb(106,91,250), rgb(133,129,253));
        color: #fff;
        box-shadow: 0 8px 18px rgba(106,91,250,.22);
    }
    .hkTiciqiProposalPage.dark .trendChart {
        background: linear-gradient(180deg,#171b21 0%,#111518 100%);
    }
    .hkTiciqiProposalPage.dark .trendGrid line {
        stroke: rgba(255,255,255,.08);
    }
    .hkTiciqiProposalPage.dark .trendDot {
        fill: #111518;
    }
    .hkTiciqiProposalPage.dark .trendTip {
        border-color: #252935;
    }
    .hkTiciqiProposalPage.dark .batchBar {
        background: #151a20;
    }
    .hkTiciqiProposalPage.dark .empty {
        color: rgba(255,255,255,.42);
    }
    /* 稿件管理 */
