/* 公共区 */
.kimfont {
  font-family: "kimfont" !important;
  font-size: 1.6rem;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
input, select, textarea{
    background-color:transparent;
}
.redStart{
	color:#ce2222!important;
	font-size: 16px;
	line-height: 1.6rem;
}
.layui-btn{border-radius:5px;}
.mb20{margin-bottom:20px;}
.mr20{margin-right:20px;}
.mt20{margin-top:20px!important;}
.mt10{margin-top:10px!important;}
.mb10{margin-bottom:10px;}
.btnsHide{display: none;}
.logoimg{
    height: 56px;
    display:none;
}
.light .logo_light{display: block;}
.dark .logo_dark{display: block;}
.pageTitle{
	border-bottom:1px solid var(--global-border-color);
	margin-bottom:15px;
	padding-bottom:12px;
	text-align: center;
	font-size:20px;
}
/* 窗体结构 */
.centerMain{display: flex;flex-direction: column;justify-content: space-between;align-items: center;height:100%;}
.centerTop{width:100%;height:100px;}
.centerTop .top-infos{height:30px;line-height:30px;display: flex;justify-content: space-between;align-items: center;padding:0 20px;color:var(--global-exp-colorpageTitle);
    background:var(--global-form-top-background);
}
.centerTop .top-handers{height:70px;display: flex;justify-content: space-between;align-items: center;padding:0 20px;
    background:var(--global-form-background);
}
.centerTop .top-handers .top-navs{display: flex;justify-content: space-between;align-items: center;}
.top-handers .top-navs .searchArea{margin-right:46px;border-radius:20px; padding-right:16px;
    border:1px solid var(--global-border-color);
    background:var(--layui-normal-background);
}
.top-handers .top-navs  #messages{position: relative;}
.top-handers .top-navs  #messages .layui-badge{position: absolute;right: -5px;top: -5px;
	background:#ce2222;color: #FFF;display: block;border-radius:10px;width: 18px;height: 18px;text-align: center;line-height: 18px;padding:0;}
.top-handers .top-navs .searchArea i{
    color:var(--global-color);
}

.top-handers .top-navs .searchArea input.searchInput{border:0;height:34px;line-height:34px;text-indent:20px;width:300px;
    color:var(--global-sec-color);
}
.top-handers .top-navs .nav-menus{display: flex;justify-content: space-between;align-items: center;gap:40px;}
.top-handers .top-navs .nav-menus a {display: flex;justify-content: center;align-items: center; flex-direction: column;font-size:12px;
    color:var(--global-sec-color);
}
.top-handers .top-navs .nav-menus a img{width:20px;margin-bottom:3px;}
.centerBody{display: flex;justify-content: space-between;align-items: flex-start;width: 100%;padding:20px 20px;flex:1;box-sizing: border-box;height:calc(100% - 100px);}
.leftMenus{width:240px;border-radius:10px;height:100%;box-sizing: border-box;border-radius:10px;overflow-x:hidden ;
    background:var(--layui-normal-background);
}   
.leftMenus .userInfos{width:240px;height:190px;display: flex;justify-content: center;flex-direction: column;align-items: center;gap:8px;
    color:var(--global-exp-color);
}
.userInfos .user_avatar{ width:80px;height:80px;display: block;border-radius:50px;}
.userInfos .user_name{display: flex;justify-content: center;align-items: center;gap:5px;}
.userInfos .user_name span{display: inline-block; max-width:100px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.userInfos .is_vip{width:70px;height:18px;}
.user_viptime{ font-size:12px;}
.rightContant{ width:calc(100% - 260px);height:100%;border-radius:10px;overflow: hidden;box-sizing: border-box;padding:0!important;}
#centerMenus li {margin:5px 10px 0;border-radius:5px;overflow: hidden;}
#centerMenus li a{display: inline-block;padding:0 30px;height:46px;line-height:46px;width: 100%;
    color:var(--global-color);box-sizing: border-box;
}
#centerMenus li a i{display: inline-block;width:20px;text-align: center;}
#centerMenus li a.checked{
    color:var(--global-exp-color);
    background:var(--global-form-top-background);
    
}
#centerMenus li a.checked i{
    background: var(--global-exp-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.dark #centerMenus li a.checked i{
    background: -webkit-linear-gradient(top, #e3c184, #f79424);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
#centerMenus li a:hover{
    background:var(--global-form-top-background);
    color:var(--global-exp-color);
}
.videoView{
    width:100%;
    box-sizing: border-box;
    height:calc(100% - 100px);
    position: fixed;
    right:-100%;

    top:100px;
    z-index:8888;
    background:var(--global-form-background);
}


/* 用户信息 */
.users{padding:20px 35px 20px 20px;}
.users .layui-form-label{color:var(--global-color);width:100px;}
#avatar{width:80px;height:80px;border-radius:10px;overflow:hidden;position: relative;}
#userAvatar{width:80px;height:80px;}
.editAvatar{position:absolute;bottom:0;left:0;height:24px;line-height:24px;width: 100%; color:#FFF;background:rgba(0,0,0,0.65);font-size:12px;text-align: center;}
.radiosArea{display: flex;align-items: center;justify-content: flex-start;padding-left:10px;border:1px solid var(--global-border-color)}
.radiosArea .layui-form-radio{margin-top:0!important;}
.btnsList{text-align: center;padding-top:15px;border-top:1px solid var(--global-border-color)}


/* 分页 */
.paginationArea{
    width: 100%;display: flex;justify-content: center;
}
.pagination {
	display: block;
	padding-left: 0;
	margin: 20px auto;
	border-radius: 2px
}

.pagination>li {
	display: inline
}

.pagination>li>a,.pagination>li>span {
	position: relative;
	float: left;
	padding: 6px 12px;
	line-height: 1.42857143;
	text-decoration: none;
	/* color:var(--global-exp-color); */
	border: 1px solid var(--global-border-color);
	margin-left: -1px
}

.pagination>li:first-child>a,.pagination>li:first-child>span {
	margin-left: 0;
	border-bottom-left-radius: 2px;
	border-top-left-radius: 2px
}

.pagination>li:last-child>a,.pagination>li:last-child>span {
	border-bottom-right-radius: 2px;
	border-top-right-radius: 2px
}

.pagination>li>a:hover,.pagination>li>span:hover,.pagination>li>a:focus,.pagination>li>span:focus {
	z-index: 2;
	color: var(--layui-checked-text-color);
	background-color: var(--layui-checked-color);
	border-color: var(--layui-checked-color)
}

.pagination>.active>a,.pagination>.active>span,.pagination>.active>a:hover,.pagination>.active>span:hover,.pagination>.active>a:focus,.pagination>.active>span:focus {
	z-index: 3;
    color: var(--layui-checked-text-color);
	background-color: var(--layui-checked-color);
	border-color: var(--layui-checked-color);
	cursor: default
}

.pagination>.disabled>span,.pagination>.disabled>span:hover,.pagination>.disabled>span:focus,.pagination>.disabled>a,.pagination>.disabled>a:hover,.pagination>.disabled>a:focus {
	/* color: var(--global-sec-color); */
	/* background-color: var(--global-sec-color); */
	/* border-color:var(--global-border-color); */
	cursor: not-allowed
}

.pagination-lg>li>a,.pagination-lg>li>span {
	padding: 8px 16px;
	font-size: 16px;
	line-height: 1.3333333
}

.pagination-lg>li:first-child>a,.pagination-lg>li:first-child>span {
	border-bottom-left-radius: 4px;
	border-top-left-radius: 4px
}

.pagination-lg>li:last-child>a,.pagination-lg>li:last-child>span {
	border-bottom-right-radius: 4px;
	border-top-right-radius: 4px
}

.pagination-sm>li>a,.pagination-sm>li>span {
	padding: 2px 8px;
	font-size: 12px;
	line-height: 1.4
}

.pagination-sm>li:first-child>a,.pagination-sm>li:first-child>span {
	border-bottom-left-radius: 2px;
	border-top-left-radius: 2px
}

.pagination-sm>li:last-child>a,.pagination-sm>li:last-child>span {
	border-bottom-right-radius: 2px;
	border-top-right-radius: 2px
}