/********************** 公共样式 OK start **********************/
html {width:100%;height:100%;margin:0;padding:0;}
/*统一字体颜色、背景色、字体*/
body {color: #666666;background: #FFF;overflow: auto;margin:0;padding:0;position: absolute;left:0;top:0;right:0;bottom:0;font-family:-apple-system,PingFang SC,Microsoft Yahei,SimHei,sans-serif;}

/*灰色背景*/
.bgcolor-gray {background: #F2F2F2;}
.bgcolor-white {background: #FFF;}

/*字体图标大小继承父级*/
.layui-btn .layui-icon, .layui-btn .iconfont {font-size: inherit;}
/*单图片预览*/
.image-preview img {cursor: pointer;}
/********************** 公共样式 end **********************/

/********************** 滚动条样式 OK start **********************/
/* 滚动条宽度 */
::-webkit-scrollbar {width: 7px;height:7px;}
/* 轨道背景色 */
::-webkit-scrollbar-track {background-color: #f1f1f1;}
/* 滑块背景色 */
::-webkit-scrollbar-thumb {background-color: #CCC;}
/* 悬停时滑块背景色 */
::-webkit-scrollbar-thumb:hover {background-color: #AAA;}
/********************** 滚动条样式 end **********************/

/**************** 链接颜色 OK start ****************/
/*点击链接*/
.click-link {color: #1d9fff;cursor: pointer;}
.click-link:hover {color: #2f8fff;}
.click-link:active {color: #1d9fff;}
/*编辑链接*/
.edit-link {color: #1E9FFF;cursor: pointer;}
.edit-link .layui-icon {font-size: 18px;}
/*删除链接*/
.del-link {color: #f55d5d;cursor: pointer;}
.del-link .layui-icon {font-size: 18px;}
/**************** 链接颜色 end ****************/

/************************ 容器 OK start ****************/
/*标准容器*/
.wrapper {padding: 15px;box-sizing: border-box;}
.wrapper.edit {padding-bottom: 70px;}
.margin-wrapper {margin: 15px;box-sizing: border-box;}

/*编辑表单容器*/
.edit-wrapper {padding: 30px 80px 80px 30px;}
/*编辑表单按钮容器*/
.save-bar {position: fixed;background:#FFF;left: 0px;right: 0px;bottom: 0px;padding: 10px 15px;border-top: 1px solid #EEE;text-align: right;}


/*绝对布局：铺满*/
.overspread {position: absolute;left: 0px;right: 0px;top: 0px;bottom: 0px;overflow: auto;}

/*水平布局：左边固定，右边自适应*/
.horizontal-wrapper {display: flex;align-items: flex-start;height:100%;}
.horizontal-wrapper .left {flex: 0 0 auto;height:100%;}
.horizontal-wrapper .right {flex: 1 1 auto;height:100%;}

.horizontal-wrapper .left.wrapper {padding-right: 0px;margin-right: -7px;}

.horizontal-wrapper .layui-card {width:100%;height: 100%;position: relative;}
.horizontal-wrapper .layui-card .layui-card-body {position: absolute;left: 0px;right: 0px;top: 43px;bottom: 0px;overflow: auto;}
.layui-card .layui-card-header .op {position: absolute;top:0px;right:10px;}

/*垂直布局，上面固定，下面自适应*/
.vertical-wrapper {display: flex; flex-direction: column;height:100%;}
/*搜索栏容器*/
.vertical-wrapper .search-wrapper, .vertical-wrapper .header-wrapper, .vertical-wrapper .footer-wrapper {flex: 0 0 auto; position: relative;}
/*表格容器、内容容器*/
.vertical-wrapper .table-wrapper, .vertical-wrapper .content-wrapper {flex: 1 1 auto; }

.vertical-wrapper .search-wrapper.wrapper, .vertical-wrapper .header-wrapper.wrapper {padding-bottom: 0px;margin-bottom: -7px;}
.vertical-wrapper .footer-wrapper.wrapper {padding-top: 0px;margin-top:-7px;}

/*面板*/
.fluid-panel {background: #FFF;padding:15px;height:100%;box-sizing: border-box;position: relative;}
.panel {background: #FFF;padding:15px;box-sizing: border-box;position: relative;}

/************************ 容器 end ****************/


/************************ 搜索条件展开收缩 OK start ****************/
.search-wrapper .search-more {position: absolute;right: 20px;top:20px;}
.search-wrapper .search-more a {color: #999;font-size: 13px;}
.search-wrapper .search-more a:hover {color: #1E9FFF;}
.search-wrapper .search-more-item {display: none;}
/************************ 搜索条件展开收缩 end ****************/

/************************ 必填 OK start ****************/
.layui-form-label.required:before {content: '* ';font-weight: bold;color: #f5535b;}
/************************ 必填 end ****************/

/*************** 详情-值列 OK start ****************/
.display-label {padding: 9px 15px;line-height: 20px;}
/*************** 详情-值列 end ****************/

/*************** 详情-表格 OK start ****************/
.detail-table {table-layout: fixed;width: 100%;height: 100%;border: 1px solid #DDD;}
.detail-table td {padding: 15px;word-wrap: break-word;word-break: break-all;}
/*奇数列样式*/
.detail-table td:nth-child(odd) {background: aliceblue;width: 150px;}
/*偶数列样式*/
.detail-table td:nth-child(even) {width: 100%;}
/*************** 详情-表格 end ****************/

/*************** 设置页 OK start ****************/
.settings-form .layui-input-inline {width: 270px;}
.settings-form .layui-form-label {width: 100px;}
.layui-form-pane.settings-form .layui-form-label {width: 130px !important;}
.settings-form .layui-input-block {margin-left: 130px;}
/*************** 设置页 OK start ****************/


/*************** 卡片样式 OK start ****************/
.dashboard-card {position: relative;}
.dashboard-card .layui-card-body {padding: 20px;}
.dashboard-card .icon-wrapper {padding: 12px 12px 10px 12px;display: inline-block;border-radius:50px;vertical-align:middle;}
.dashboard-card .card-content {margin-left: 20px;display: inline-block;vertical-align:middle;min-width: 100px;}
.dashboard-card .card-title {color: #AAAAAA;}
.dashboard-card>i {color: #888;position:absolute;right: 15px;top: 15px;cursor: pointer;}
.dashboard-card .card-count {line-height: 40px;font-size: 30px;text-align: center;}
.dashboard-card .icon-wrapper i {font-size: 30px;color: #FFF;}
/*************** 卡片样式 OK end ****************/

/*************** 表格操作列下拉菜单 OK start ****************/
.dropdown-content {padding: 15px;font-size: 12px;width: 285px;}
.dropdown-content .item {color: #666;cursor: pointer;display:inline-block;width:60px;height:60px;padding:5px;box-sizing:border-box;text-align: center;border: 1px solid transparent;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.dropdown-content .item:hover {color: #1E9FFF;}
.dropdown-content .item.del-link:hover {color: #f55d5d;}
.dropdown-content .item i {display:block;font-size: 20px;margin-bottom: 5px;}
/*************** 表格操作列下拉菜单 OK end ****************/

/************** 覆盖layui readonly样式 OK start *************/
/*解决表单项中的表格，checkbox不垂直居中*/
.layui-form-item .layui-table-view .layui-form-checkbox[lay-skin=primary] {margin-top: 0px;}
/*input、textarea处于readonly下的背景色*/
.layui-input:read-only, .layui-select:read-only, .layui-textarea:read-only {background-color: #f8f8f8;}
/*select only时背景色*/
.layui-form-select .layui-input:read-only {background-color: inherit;}
/************** 覆盖layui readonly样式 end *************/

/************** 覆盖layui 输入focus边框线 OK start *************/
.layui-input:focus, .layui-textarea:focus {border-color: #d2d2d2 !important;box-shadow: 0 0 0 3px #d2d2d20f;}
/*输入框带后缀分割框，focus边框颜色*/
.layui-input-wrap .layui-input:focus+.layui-input-split {border-color: #d2d2d2 !important;box-shadow: 0 0 0 3px #d2d2d20f;}
/*字段校验失败，红色边框*/
.layui-form-danger+.layui-form-select .layui-input, .layui-form-danger:focus {border-color: #ff5722 !important;}
/*输入框前后缀，宽度百分比*/
.layui-input-block .layui-input-group {width:100%;}
/*表格工具条内的输入框修改高度*/
.layui-table-tool-temp .layui-input, .layui-select, .layui-textarea {height:30px;}
/*解决按钮文字图标有偏差*/
.layui-btn {line-height: 36px;}
.layui-btn-sm {line-height: 28px;}
.layui-btn-xs {line-height: 20px;}
.layui-btn-lg {line-height: 42px;}
.layui-badge-rim {height:20px;}
.layui-badge {height:20px;line-height: 20px;}
/************** 覆盖layui 输入focus边框线 end *************/

/*************** 覆盖layui分页器 OK start ****************/
/*layui表格分页器右对齐*/
.layui-table-page {padding-top: 10px;text-align: right;height: inherit;}
/*************** 覆盖layui分页器 end ****************/

/*************** 覆盖layui加载中图标 OK start ****************/
.layui-layer-loading .layui-layer-content {width: 60px !important;height: 60px !important;background: url(/static/admin/image/loading-0-27260a77824a3063fe15d46968991bd4.gif) no-repeat !important;}
.layui-layer-loading .layui-layer-content .layui-icon-loading:before {content: none}
.layui-layer-loading, .layui-layer-shade {cursor: pointer;}
/*************** 覆盖layui加载中图标 end ****************/

/*************** 覆盖layui table样式 OK start ****************/
/*table行悬浮背景色*/
.layui-table-click, .layui-table-hover {background: #f2f2f2 !important;}
/*table表头背景色*/
.layui-table-header thead {background: #f8f8f8 !important;}
/*table中的图标设为16px*/
.layui-table-view .layui-table-cell .layui-icon, .layui-table-view .layui-table-cell .iconfont {font-size: 16px;}
/*************** 覆盖layui table样式 end ****************/

/*************** 覆盖layui tree OK start ****************/
/*解决layui tree 删除图标不齐问题*/
.layui-tree-btnGroup .layui-icon {font-size: 20px;padding: 4px 2px 0px 2px;}
.layui-tree-btnGroup .layui-icon-delete {color: red;}
.layui-tree-btnGroup .layui-icon-delete:hover {color: #fc6969;}
/*************** 覆盖layui tree end ****************/



/************** 更改三方组件样式：xm-select OK start *************/
/*边框线颜色*/
xm-select {border-color: #eee !important;}
/*选中颜色*/
xm-select > .xm-body .xm-option.selected {background-color: #f8f8f8 !important;}
xm-select > .xm-body .xm-option.selected.hide-icon .xm-option-content {color: #3c8dbc !important;}
/************** 更改三方组件样式：xm-select end *************/

/************** 更改三方组件样式：layCascader OK start *************/
.el-cascader {line-height: 38px !important;}
.el-cascader .el-input__inner {border-radius: 0px;color: #606266;height: 38px;line-height: 38px;border-color: #eee !important;}
.el-cascader .el-input.is-focus .el-input__inner {border-color: #d2d2d2 !important;}
.el-cascader .el-input .el-input__inner:focus {border-color: #d2d2d2 !important;}
.el-cascader__dropdown {border-radius: 0px !important;}
/************** 更改三方组件样式：layCascader end *************/

/*************** 更改三方组件样式：jquery.nestable排序 start *************/
.dd-handle {height: 36px !important;padding: 8px 10px !important;border:1px solid #DDD !important;}
.dd-item>button {margin: 8px 0 !important;font-size: 14px;}
/*************** 更改三方组件样式：jquery.nestable排序 end *************/
