ServerStatus/web/css/dark.css

:root{
   /* =====色板===== */
  /*常量,不随明暗主题变化*/
  --color-white: #FFFFFF;
  --color-black: #000000;

  --lay-color-white: #FAFAFA;
  --lay-color-black: #333333;

  --lay-color-red-1: #FFF1E8; 
  --lay-color-red-2: #FFD7C0; 
  --lay-color-red-3: #FFBB99; 
  --lay-color-red-4: #FF9C71; 
  --lay-color-red-5: #FF7A4A; 
  --lay-color-red-6: #FF5722; 
  --lay-color-red-7: #D23B15; 
  --lay-color-red-8: #A6250B; 
  --lay-color-red-9: #791404; 
  --lay-color-red-10: #4D0800;

  --lay-color-blue-1: #E8F9FF;
  --lay-color-blue-2: #C0ECFF;
  --lay-color-blue-3: #97DCFF;
  --lay-color-blue-4: #6FCAFF;
  --lay-color-blue-5: #46B5FF;
  --lay-color-blue-6: #1E9FFF;
  --lay-color-blue-7: #1379D2;
  --lay-color-blue-8: #0A58A6;
  --lay-color-blue-9: #043A79;
  --lay-color-blue-10: #00214D;

  --lay-color-lightblue-1: #E8FDFF;
  --lay-color-lightblue-2: #C1F4FB;
  --lay-color-lightblue-3: #9CEAF7;
  --lay-color-lightblue-4: #77DDF4;
  --lay-color-lightblue-5: #53CEF0;
  --lay-color-lightblue-6: #31BDEC;
  --lay-color-lightblue-7: #1F95C4;
  --lay-color-lightblue-8: #10709C;
  --lay-color-lightblue-9: #064E74;
  --lay-color-lightblue-10: #002F4D;

  /* --lay-color-green-1: #E8FFF9;
  --lay-color-green-2: #AAEADB;
  --lay-color-green-3: #74D5C2;
  --lay-color-green-4: #46C0AC;
  --lay-color-green-5: #1FAB98;
  --lay-color-green-6: #009688;
  --lay-color-green-7: #00847B;
  --lay-color-green-8: #00716D;
  --lay-color-green-9: #005F5F;
  --lay-color-green-10: #004A4D; */

  --lay-color-green-1: #E8FFF9;
  --lay-color-green-2: #B5F1E3;
  --lay-color-green-3: #87E3D1;
  --lay-color-green-4: #5DD6C1;
  --lay-color-green-5: #37C8B5;
  --lay-color-green-6: #16BAAA;
  --lay-color-green-7: #0E9F95;
  --lay-color-green-8: #08837F;
  --lay-color-green-9: #036868;
  --lay-color-green-10: #004A4D;

  /* --lay-color-lightgreen-1: #E8FFEB;
  --lay-color-lightgreen-2: #C8F1CE;
  --lay-color-lightgreen-3: #ABE3B5;
  --lay-color-lightgreen-4: #8FD49E;
  --lay-color-lightgreen-5: #76C68A;
  --lay-color-lightgreen-6: #5FB878;
  --lay-color-lightgreen-7: #3D9D5B;
  --lay-color-lightgreen-8: #228243;
  --lay-color-lightgreen-9: #0D6730;
  --lay-color-lightgreen-10: #004D20; */

  --lay-color-lightgreen-1: #E8FFF2;
  --lay-color-lightgreen-2: #B5F1D1;
  --lay-color-lightgreen-3: #86E2B4;
  --lay-color-lightgreen-4: #5CD49C;
  --lay-color-lightgreen-5: #37C588;
  --lay-color-lightgreen-6: #16B777;
  --lay-color-lightgreen-7: #0E9C68;
  --lay-color-lightgreen-8: #088259;
  --lay-color-lightgreen-9: #036749;
  --lay-color-lightgreen-10: #004D38;

  --lay-color-orange-1: #FFFCE8;
  --lay-color-orange-2: #FFF5BA;
  --lay-color-orange-3: #FFEA8B;
  --lay-color-orange-4: #FFDC5D;
  --lay-color-orange-5: #FFCB2E;
  --lay-color-orange-6: #FFB800;
  --lay-color-orange-7: #D29000;
  --lay-color-orange-8: #A66C00;
  --lay-color-orange-9: #794B00;
  --lay-color-orange-10: #4D2D00;

  --lay-color-cyan-1: #E8F6FF;
  --lay-color-cyan-2: #B9CEDD;
  --lay-color-cyan-3: #8FA7BB;
  --lay-color-cyan-4: #6A829A;
  --lay-color-cyan-5: #4A5F78;
  --lay-color-cyan-6: #2F4056;
  --lay-color-cyan-7: #223654;
  --lay-color-cyan-8: #162C51;
  --lay-color-cyan-9: #0B214F;
  --lay-color-cyan-10: #00174D;

  --lay-color-purple-1: #FDE8FF;
  --lay-color-purple-2: #EDBEF4;
  --lay-color-purple-3: #DC97E8;
  --lay-color-purple-4: #C972DD;
  --lay-color-purple-5: #B651D1;
  --lay-color-purple-6: #A233C6;
  --lay-color-purple-7: #8120A8;
  --lay-color-purple-8: #631289;
  --lay-color-purple-9: #48076B;
  --lay-color-purple-10: #2F004D;

  --lay-color-black-1: #E8F8FF;
  --lay-color-black-2: #BFD0D8;
  --lay-color-black-3: #98A8B1;
  --lay-color-black-4: #73818A;
  --lay-color-black-5: #505B63;
  --lay-color-black-6: #2F363C;
  --lay-color-black-7: #23303C;
  --lay-color-black-8: #18293C;
  --lay-color-black-9: #0C213C;
  --lay-color-black-10: #00183C;

  /* --lay-color-black-1: #E8F2FF;
  --lay-color-black-2: #C1CBDB;
  --lay-color-black-3: #9CA5B6;
  --lay-color-black-4: #798192;
  --lay-color-black-5: #585E6D;
  --lay-color-black-6: #393D49;
  --lay-color-black-7: #2B3149;
  --lay-color-black-8: #1D2549;
  --lay-color-black-9: #0E1749;
  --lay-color-black-10: #000949; */

  --lay-color-gray-1: #FAFAFA;
  --lay-color-gray-2: #F6F6F6;
  --lay-color-gray-3: #EEEEEE;
  --lay-color-gray-4: #E2E2E2;
  --lay-color-gray-5: #DDDDDD;
  --lay-color-gray-6: #D2D2D2;
  --lay-color-gray-7: #CCCCCC;
  --lay-color-gray-8: #C2C2C2;
  --lay-color-gray-9: #AAAAAA;
  --lay-color-gray-10: #939393;

  /* =====语义===== */
  /* 主色 */
  --lay-color-primary: var(--lay-color-green-6); 
  --lay-color-primary-hover: var(--lay-color-green-5);
  --lay-color-primary-active: var(--lay-color-green-7);
  --lay-color-primary-disabled: var(--lay-color-green-3);
  --lay-color-primary-light: var(--lay-color-green-4);

  /* 次色 */
  --lay-color-secondary: var(--lay-color-lightgreen-6);
  --lay-color-secondary-hover: var(--lay-color-lightgreen-5);
  --lay-color-secondary-active: var(--lay-color-lightgreen-7);
  --lay-color-secondary-disabled: var(--lay-color-lightgreen-3);
  --lay-color-secondary-light: var(--lay-color-lightgreen-4);

  /* 引导 */
  --lay-color-info: var(--lay-color-lightblue-6);
  --lay-color-info-hover: var(--lay-color-lightblue-5);
  --lay-color-info-active: var(--lay-color-lightblue-7);
  --lay-color-info-disabled: var(--lay-color-lightblue-3);
  --lay-color-info-light: var(--lay-color-lightblue-4);

  /* 百搭 */
  --lay-color-normal: var(--lay-color-blue-6);
  --lay-color-normal-hover: var(--lay-color-blue-5);
  --lay-color-normal-active: var(--lay-color-blue-7);
  --lay-color-normal-disabled: var(--lay-color-blue-3);

  /* 警示 */
  --lay-color-warning: var(--lay-color-orange-6);
  --lay-color-warning-hover: var(--lay-color-orange-5);
  --lay-color-warning-active: var(--lay-color-orange-7);
  --lay-color-warning-disabled: var(--lay-color-orange-3);
  --lay-color-warning-light: var(--lay-color-orange-4);

  /* 成功 */
  --lay-color-success: var(--lay-color-lightgreen-6);
  --lay-color-success-hover: var(--lay-color-lightgreen-5);
  --lay-color-success-active: var(--lay-color-lightgreen-7);
  --lay-color-success-disabled: var(--lay-color-lightgreen-3);
  --lay-color-success-light: var(--lay-color-lightgreen-4);

  /* 错误 */
  --lay-color-danger: var(--lay-color-red-6);
  --lay-color-danger-hover: var(--lay-color-red-5);
  --lay-color-danger-active: var(--lay-color-red-7);
  --lay-color-danger-disabled: var(--lay-color-red-3);
  --lay-color-danger-light: var(--lay-color-red-4);

  --lay-color-bg-1: #17171A; /*整体背景*/
  --lay-color-bg-2: #232324; /*一级容器背景,卡片,面板*/
  --lay-color-bg-3: #2a2a2b; /*二级容器背景*/
  --lay-color-bg-4: #313132; /*三级容器背景*/
  --lay-color-bg-5: #373739; /*下拉弹出框、Tooltip 背景颜色*/
  --lay-color-bg-white: #f6f6f6; /*白色背景*/

  --lay-color-text-1: rgba(255,255,255,.9); /*强调/正文标题*/
  --lay-color-text-2: rgba(255,255,255,.7); /*次强调/语句*/
  --lay-color-text-3: rgba(255,255,255,.5); /*次要信息*/
  --lay-color-text-4: rgba(255,255,255,.3);/*禁用状态文字 */

  --lay-color-border-1: #2e2e30;
  --lay-color-border-2: #484849;
  --lay-color-border-3: #5f5f60;
  --lay-color-border-4: #929293;

  --lay-color-fill-1: rgba(255,255,255,.04);/*浅/禁用*/
  --lay-color-fill-2: rgba(255,255,255,.08);/*常规/白底悬浮*/
  --lay-color-fill-3: rgba(255,255,255,.12); /*深/灰底悬浮*/
  --lay-color-fill-4: rgba(255,255,255,.16);/*重/特殊场景*/

  --lay-color-hover: var(--lay-color-fill-3); /*bg*/
  --lay-color-active: var(--lay-color-fill-3); /*bg*/
}
blockquote,body,button,dd,div,dl,dt,form,h1,h2,h3,h4,h5,h6,input,li,ol,p,pre,td,textarea,th,ul{-webkit-tap-highlight-color: rgba(0, 0, 0, 0)} /*danger: 勿改*/
body{color:var(--lay-color-text-2);background-color: var(--lay-color-bg-1); color-scheme: dark;}
hr{border-bottom:1px solid var(--lay-color-border-2)!important}
a{color:var(--lay-color-text-1);}
a:hover{color:var(--lay-color-text-3)}
/* 三角形 */
.layui-edge{border-color:transparent}
.layui-edge-top{border-bottom-color:var(--lay-color-border-4)}
.layui-edge-right{border-left-color:var(--lay-color-border-4)}
.layui-edge-bottom{border-top-color:var(--lay-color-border-4)}
.layui-edge-left{border-right-color:var(--lay-color-border-4)}
/* 禁用文字 */
.layui-disabled,.layui-disabled:hover{color:var(--lay-color-text-4)!important}
/* 图标 */
.layui-icon{-moz-osx-font-smoothing:grayscale}
/* admin 布局 */
.layui-layout-admin .layui-header{background-color:var(--lay-color-bg-2)}
.layui-layout-admin .layui-footer{box-shadow:-1px 0 4px rgb(0 0 0 / 12%);background-color:var(--lay-color-bg-2)}
.layui-layout-admin .layui-logo{color:var(--lay-color-primary);box-shadow:0 1px 2px 0 rgb(0 0 0 / 15%)}
/* 引用 */
.layui-elem-quote{border-left:5px solid var(--lay-color-secondary);background-color:var(--lay-color-bg-2)}
/* 进度条 */
.layui-progress{background-color: var(--lay-color-bg-3)}
.layui-progress-bar{background-color:var( --lay-color-secondary)}
.layui-progress-text{color:var(--lay-color-text-2)}
.layui-progress-big .layui-progress-text{color: var(--lay-color-text-1)}
/* 折叠面板 */
.layui-colla-title{color: var(--lay-color-text-1);background-color: var(--lay-color-bg-2)}
.layui-colla-content{color:var(--lay-color-text-2)}
/* 卡片面板 */
.layui-card{background-color: var(--lay-color-bg-2);box-shadow:0 1px 2px 0 rgba(0,0,0,.05)}
.layui-card-header{border-bottom:1px solid var(--lay-color-border-2);color:var(--lay-color-text-1)}
/* 常规面板 */
.layui-panel{box-shadow:1px 1px 4px rgb(0 0 0 / 8%);background-color: var( --lay-color-bg-2);color: var(--lay-color-text-1)}
/* 窗口面板 */
.layui-panel-window{border-top:5px solid var(--lay-color-border-2);background-color: var(--lay-color-bg-2)}
/* 背景颜色 */
.layui-bg-red{background-color:var(--lay-color-red-6)!important;color: var(--lay-color-white)!important}
.layui-bg-orange{background-color:var(--lay-color-orange-6)!important;color: var(--lay-color-white)!important}
.layui-bg-green{background-color:var(--lay-color-green-6)!important;color: var(--lay-color-white)!important}
.layui-bg-cyan{background-color:var(--lay-color-cyan-6)!important;color: var(--lay-color-white)!important}
.layui-bg-blue{background-color: var(--lay-color-blue-6)!important;color: var(--lay-color-white)!important}
.layui-bg-black{background-color:var(--lay-color-black-6)!important;color: var(--lay-color-white)!important}
.layui-bg-purple{background-color: var(--lay-color-purple-6)!important; color: var(--lay-color-white)!important;}
.layui-bg-gray{background-color:var(--lay-color-gray-1)!important;color: var(--lay-color-black-6)!important}
/* 徽章 */
.layui-badge-rim,.layui-border,.layui-colla-content,.layui-colla-item,.layui-collapse,.layui-elem-field,.layui-form-pane .layui-form-item[pane],.layui-form-pane .layui-form-label,.layui-input,.layui-input-split,.layui-panel,.layui-quote-nm,.layui-select,.layui-tab-bar,.layui-tab-card,.layui-tab-title,.layui-tab-title .layui-this:after,.layui-textarea{border-color: var(--lay-color-border-1)}
/* 边框颜色 */
.layui-border{color:var(--lay-color-text-1)!important}
.layui-border-red{border-color:var(--lay-color-red-6)!important;color:var(--lay-color-red-6)!important}
.layui-border-orange{border-color:var(--lay-color-orange-6)!important;color:var(--lay-color-orange-6)!important}
.layui-border-green{border-color:var(--lay-color-green-6)!important;color:var(--lay-color-green-6)!important}
.layui-border-cyan{border-color:var(--lay-color-cyan-6)!important;color:var(--lay-color-cyan-6)!important}
.layui-border-blue{border-color: var(--lay-color-blue-6)!important;color: var(--lay-color-blue-6)!important}
.layui-border-purple{border-color: var(--lay-color-purple-6)!important; color: var(--lay-color-purple-6)!important;}
.layui-border-black{border-color:var(--lay-color-black-6)!important;color:var(--lay-color-black-5)!important}
/* 文本区域 */
.layui-text{color:var(--lay-color-text-3)}
.layui-text h1,.layui-text h2,.layui-text h3,.layui-text h4,.layui-text h5,.layui-text h6{color: var(--lay-color-text-2)}
.layui-text-em,.layui-word-aux{color: var(--lay-color-text-2)!important}
.layui-text a:not(.layui-btn){color:var(--lay-color-lightblue-6)}
.layui-text blockquote:not(.layui-elem-quote){border-left:5px solid var(--lay-color-border-4)}
.layui-text pre>code:not(.layui-code){background-color:var(--lay-color-bg-white)}
/* 字体颜色 */
.layui-font-red{color:var(--lay-color-red-6)!important}
.layui-font-orange{color:var(--lay-color-orange-6)!important}
.layui-font-green{color:var(--lay-color-green-6)!important}
.layui-font-cyan{color:var(--lay-color-cyan-6)!important}
.layui-font-blue{color:var(--lay-color-lightblue-6)!important}
.layui-font-black{color:var(--lay-color-black)!important}
.layui-font-purple{color:var(--lay-color-purple-6)!important;}
.layui-font-gray{color:var(--lay-color-gray-7)!important}
/* 按钮 */
.layui-btn{border:1px solid transparent;background-color:var(--lay-color-primary);color: var(--lay-color-text-1)}
.layui-btn:hover{color: var(--lay-color-text-2)}
.layui-btn-primary{border-color:var(--lay-color-border-2);color:var(--lay-color-text-1);background-color: var(--lay-color-bg-4)}
.layui-btn-primary:hover{border-color:var(--lay-color-primary);color:var(--lay-color-text-2)}
.layui-btn-normal{background-color: var(--lay-color-normal)}
.layui-btn-warm{background-color:var(--lay-color-warning)}
.layui-btn-danger{background-color:var(--lay-color-danger)}
.layui-btn-checked{background-color:var(--lay-color-success)}
.layui-btn-disabled,.layui-btn-disabled:active,.layui-btn-disabled:hover{border-color: var(--lay-color-border-2)!important;background-color: var(--lay-color-bg-2)!important;color: var(--lay-color-text-4)!important}
.layui-btn-group .layui-btn{border-left:1px solid  var(--lay-color-border-2)}
.layui-btn-group .layui-btn-primary:hover{border-color:var(--lay-color-border-2);color:var(--lay-color-primary)}
.layui-btn-group .layui-btn-primary:first-child{border-left:1px solid var(--lay-color-gray-5)}
/*表单*/
.layui-input,.layui-select,.layui-textarea{background-color: var(--lay-color-fill-2);color: var(--lay-color-text-2)}
.layui-input[disabled],.layui-select[disabled],.layui-textarea[disabled]{background-color: var(--lay-color-fill-1);color: var(--lay-color-text-4)}
.layui-input:hover,.layui-textarea:hover{border-color: var(--lay-color-border-2)!important}
.layui-input:focus,.layui-textarea:focus{border-color: var(--lay-color-border-2)!important}
.layui-form-danger+.layui-form-select .layui-input,.layui-form-danger:focus{border-color:var(--lay-color-danger)!important}
/* 输入框点缀  */
.layui-input-prefix .layui-icon,.layui-input-split .layui-icon,.layui-input-suffix .layui-icon{color: var(--lay-color-gray-8)}
.layui-input-wrap .layui-input:focus+.layui-input-split{border-color: var(--lay-color-border-2)}
.layui-input-affix .layui-icon{color: var(--lay-color-text-2)}
.layui-input-affix .layui-icon-clear{color:var(--lay-color-text-2)}
.layui-input-affix .layui-icon:hover{color:var(--lay-color-text-3)}
/* 下拉选择 */
.layui-form-select{color:var(--lay-color-text-2)}
.layui-form-select .layui-edge{border-top-color:var(--lay-color-gray-8)}
.layui-form-select dl{border:1px solid  var( --lay-color-border-2);background-color: var(--lay-color-bg-5);box-shadow:1px 1px 4px rgb(0 0 0 / 8%)}
.layui-form-select dl dt{color:var(--lay-color-gray-8)}
.layui-form-select dl dd:hover{background-color:var(--lay-color-active)}
.layui-form-select dl dd.layui-select-tips{color:var(--lay-color-text-2)}
.layui-form-select dl dd.layui-this{background-color: var(--lay-color-active);color: var(--lay-color-text-1)}
.layui-form-select dl dd.layui-disabled,.layui-form-select dl dd:hover.layui-disabled{background-color: var(--lay-color-bg-5)}
.layui-select-none{color:var(--lay-color-black-8)}
.layui-select-disabled .layui-disabled{border-color:var(--lay-color-gray-3)!important}
.layui-select-disabled .layui-edge{border-top-color:var(--lay-color-gray-6)}
/* 复选框 */
.layui-form-checkbox{background-color:var(--lay-color-fill-2)}
.layui-form-checkbox span{background-color:var(--lay-color-fill-3);color:var(--lay-color-text-2)}
.layui-form-checkbox:hover span{background-color: var(--lay-color-active)}
.layui-form-checkbox i{background-color: var(--lay-color-fill-1);border-top-color:var(--lay-color-border-1);border-right-color:var(--lay-color-border-1);border-bottom-color:var(--lay-color-border-1);border-left-color:initial;color:var(--lay-color-text-1)}
.layui-form-checkbox:hover i{border-color:var(--lay-color-border-2);color:var(--lay-color-text-4)}
.layui-form-checked,.layui-form-checked:hover{border-color:var(--lay-color-secondary-active)}
.layui-form-checked span,.layui-form-checked:hover span{background-color:var(--lay-color-secondary)}
.layui-form-checked i,.layui-form-checked:hover i{color:var(--lay-color-secondary-hover)}
/* 复选框-默认风格 */
.layui-form-checkbox[lay-skin=primary]{background-image:none;background-color:initial;border-color:initial!important}
.layui-form-checkbox[lay-skin=primary] span{background-image:none;background-color:initial;color:var(--lay-color-text-2)}
.layui-form-checkbox[lay-skin=primary] i{border-color:var(--lay-color-border-1);background-color:var(--lay-color-fill-2)}
.layui-form-checkbox[lay-skin=primary]:hover i{border-color:var(--lay-color-secondary-hover);color:var(--lay-color-text-1)}
.layui-form-checked[lay-skin=primary] i{background-color:var(--lay-color-secondary);color:var(--lay-color-text-1);border-color:var(--lay-color-secondary-active)!important}
.layui-checkbox-disabled[lay-skin=primary] span{background-image:none!important;background-color:initial!important;color:var(--lay-color-text-4)!important}
.layui-form-checked.layui-checkbox-disabled[lay-skin=primary] i{background-image:initial!important;background-color:var(--lay-color-fill-1)!important;border-color:var(--lay-color-border-2)!important}
.layui-checkbox-disabled[lay-skin=primary]:hover i{border-color:var(--lay-color-border-1)}
.layui-form-checkbox[lay-skin="primary"] .layui-icon-indeterminate:before{background-color: var(--lay-color-gray-6);opacity: 1;}
.layui-form-checkbox[lay-skin="primary"]:hover .layui-icon-indeterminate:before{background-color: var(--lay-color-secondary-hover);opacity: 1;}
.layui-form-checkbox[lay-skin="primary"] .layui-icon-indeterminate{border-color: var(--lay-color-border-2);}
.layui-form-checkbox[lay-skin="primary"]:hover .layui-icon-indeterminate {border-color: var(--lay-color-secondary-hover);}
/* 复选框-开关风格 */
.layui-form-switch{border-color:var(--lay-color-border-2);background-color:var(--lay-color-fill-2)}
.layui-form-switch i{background-color:var(--lay-color-gray-4)}
.layui-form-switch.layui-checkbox-disabled i{background-color:var(--lay-color-gray-4)}
.layui-form-switch em{color:var(--lay-color-gray-8)!important}
.layui-form-onswitch{border-color:var(--lay-color-secondary-active);background-color:var(--lay-color-secondary)}
.layui-form-onswitch i{background-color:var(--lay-color-gray-4)}
.layui-form-onswitch em{color:var(--lay-color-text-1)!important}
.layui-checkbox-disabled{border-color:var(--lay-color-border-2)!important}
.layui-checkbox-disabled span{background-color:var(--lay-color-fill-3)!important;color: var(--lay-color-text-4);}
.layui-checkbox-disabled i{border-color:var(--lay-color-border-2)!important}
.layui-checkbox-disabled em{color:var(--lay-color-text-4)!important}
.layui-checkbox-disabled:hover i{color:var(--lay-color-text-1)!important}
/*复选框背景优化*/
.layui-form-checkbox i:before{opacity:0;filter:alpha(opacity=0)}
.layui-form-checkbox:hover i:before{opacity:1;filter:alpha(opacity=100)}
.layui-form-checked.layui-checkbox-disabled:hover i:before,.layui-form-checked:hover i:before,.layui-form-checked i:before{opacity:1;filter:alpha(opacity=100)}
.layui-form-checkbox[lay-skin=primary]:hover i:before{opacity:0;filter:alpha(opacity=0)}
.layui-form-checked[lay-skin=primary]:hover i:before{opacity:1;filter:alpha(opacity=100)}
.layui-checkbox-disabled:hover i:before{opacity:0;filter:alpha(opacity=0)}
/*单选框*/
.layui-form-radio>i{color:var(--lay-color-gray-8)}
.layui-form-radio:hover *,.layui-form-radioed,.layui-form-radioed>i{color:var(--lay-color-secondary)}
.layui-radio-disabled>i{color:var(--lay-color-text-4)!important}
.layui-radio-disabled *{color:var(--lay-color-text-4)!important}
/* 表单方框风格 */
.layui-form-pane .layui-form-label{background-color:var(--lay-color-bg-2)}
/** 分页 **/
.layui-laypage a,.layui-laypage button,.layui-laypage input,.layui-laypage select,.layui-laypage span{border:1px solid  var(--lay-color-border-2)}
.layui-laypage a,.layui-laypage span{background-color: var(--lay-color-bg-2);color: var(--lay-color-text-2)}
.layui-laypage a[data-page]{color:var(--lay-color-text-2)}
.layui-laypage a:hover{color: var(--lay-color-primary)}
.layui-laypage .layui-laypage-spr{color:var(--lay-color-text-3)}
.layui-laypage .layui-laypage-curr em{color: var(--lay-color-white)}
.layui-laypage .layui-laypage-curr .layui-laypage-em{background-color: var(--lay-color-primary)}
.layui-laypage .layui-laypage-skip{color:var(--lay-color-text-3)}
.layui-laypage button,.layui-laypage input{background-color: var(--lay-color-bg-2)}
.layui-laypage input:focus,.layui-laypage select:focus{border-color: var(--lay-color-primary)!important}
/** 流加载 **/
.layui-flow-more{color:var(--lay-color-text-1)}
.layui-flow-more a cite{background-color: var(--lay-color-bg-4);color: var(--lay-color-text-1)}
.layui-flow-more a i{color:var(--lay-color-text-2)}
/** 表格 **/
.layui-table{background-color: var(--lay-color-bg-2);color: var(--lay-color-text-2)}
.layui-table-mend{background-color: var(--lay-color-bg-2)}
.layui-table-click,.layui-table-hover,.layui-table[lay-even] tbody tr:nth-child(even){background-color:var(--lay-color-bg-2)}
.layui-table td,.layui-table th,.layui-table-col-set,.layui-table-fixed-r,.layui-table-grid-down,.layui-table-header,.layui-table-mend,.layui-table-page,.layui-table-tips-main,.layui-table-tool,.layui-table-total,.layui-table-view,.layui-table[lay-skin=line],.layui-table[lay-skin=row]{border-color: var(--lay-color-border-2)}
.layui-table-view .layui-table td[data-edit]:hover:after{border:1px solid var(--lay-color-primary-active)}
.layui-table-init{background-color: var(--lay-color-bg-2);}
.layui-table-init .layui-icon{color:var(--lay-color-gray-8);}
.layui-table-page{background-color: var(--lay-color-bg-2);}
.layui-table-tool{background-color: var(--lay-color-bg-2);}
.layui-table-tool .layui-inline[lay-event]{color:var(--lay-color-text-3);border:1px solid var(--lay-color-border-2)}
.layui-table-tool .layui-inline[lay-event]:hover{border:1px solid var(--lay-color-border-3)}
.layui-table-tool-panel{color: var(--lay-color-text-1); border:1px solid  var(--lay-color-border-2);background-color: var(--lay-color-bg-5);box-shadow:0 2px 4px rgba(0,0,0,.12)}
.layui-table-tool-panel li:hover{background-color:var(--lay-color-active)}
.layui-table-col-set{background-color: var(--lay-color-white)}
.layui-table-sort .layui-table-sort-asc{border-bottom-color:var(--lay-color-border-4)}
.layui-table-sort .layui-table-sort-asc:hover{border-bottom-color:var(--lay-color-border-3)}
.layui-table-sort .layui-table-sort-desc{border-top-color:var(--lay-color-border-4)}
.layui-table-sort .layui-table-sort-desc:hover{border-top-color:var(--lay-color-border-3)}
.layui-table-sort[lay-sort=asc] .layui-table-sort-asc{border-bottom-color:var(--lay-color-bg-5)}
.layui-table-sort[lay-sort=desc] .layui-table-sort-desc{border-top-color:var(--lay-color-bg-5)}
.layui-table-cell .layui-table-link{color: var(--lay-color-lightblue-5)}
.layui-table-body .layui-none{color:var(--lay-color-gray-8)}
.layui-table-fixed-l{box-shadow:1px 0 8px rgba(0,0,0,1)}
.layui-table-fixed-r{box-shadow:-1px 0 8px rgba(0,0,0,1)}
.layui-table-edit{box-shadow:1px 1px 20px rgba(0,0,0,.15);background-color: var(--lay-color-bg-2)}
.layui-table-edit:focus{border-color:var(--lay-color-secondary)!important}
select.layui-table-edit{border-color:var(--lay-color-border-2)}
.layui-table-grid-down{background-color: var(--lay-color-bg-5);color:var(--lay-color-gray-8)}
.layui-table-grid-down:hover{background-color:var(--lay-color-bg-5)}
body .layui-table-tips .layui-layer-content{box-shadow:0 1px 6px rgba(0,0,0,.12)}
.layui-table-tips-main{background-color: var(--lay-color-bg-5);color: var(--lay-color-text-3)}
.layui-table-tips-c{background-color:var(--lay-color-gray-7);color: var(--lay-color-text-1)}
.layui-table-tips-c:hover{background-color:var(--lay-color-gray-8)}
/* 下拉菜单 */
.layui-dropdown{background-color: var(--lay-color-bg-5)}
.layui-dropdown.layui-panel,.layui-dropdown .layui-panel{background-color: var(--lay-color-bg-5)}
.layui-dropdown.layui-panel .layui-menu{background-color: var(--lay-color-bg-5)}
/** 导航菜单 **/
.layui-nav{background-color:#393d49;color: var(--lay-color-white)}
.layui-nav .layui-nav-item a{color: var(--lay-color-text-1);}
.layui-nav .layui-this:after,.layui-nav-bar{background-color:var(--lay-color-secondary)}
.layui-nav .layui-nav-item a:hover,.layui-nav .layui-this a{color: var(--lay-color-text-1)}
.layui-nav-child{box-shadow:0 2px 4px rgba(0,0,0,.12);border:1px solid var(--lay-color-border-2);background-color: var(--lay-color-bg-5)}
.layui-nav .layui-nav-child a{color: var(--lay-color-text-1)}
.layui-nav .layui-nav-child a:hover{background-color: var(--lay-color-bg-5);color: var(--lay-color-text-1)}
.layui-nav-child dd.layui-this{background-color: var(--lay-color-bg-5);color: var(--lay-color-text-1)}
.layui-nav-tree .layui-nav-child dd.layui-this,.layui-nav-tree .layui-nav-child dd.layui-this a,.layui-nav-tree .layui-this,.layui-nav-tree .layui-this>a,.layui-nav-tree .layui-this>a:hover{background-color: var(--lay-color-primary);color: var(--lay-color-white)}
.layui-nav-itemed>a,.layui-nav-tree .layui-nav-title a,.layui-nav-tree .layui-nav-title a:hover{color: var(--lay-color-white)!important}
.layui-nav-tree .layui-nav-bar{background-color:var(--lay-color-primary)}
.layui-nav-tree .layui-nav-child a{color: var(--lay-color-white);color: var(--lay-color-white)}
.layui-nav-tree .layui-nav-child,.layui-nav-tree .layui-nav-child a:hover{color: var(--lay-color-white)}
.layui-nav-itemed>.layui-nav-child{background-color:rgba(0, 0, 0, .3) !important}
.layui-nav-tree.layui-bg-gray a,.layui-nav.layui-bg-gray .layui-nav-item a{color: var(--lay-color-black-4)}
.layui-nav.layui-bg-gray .layui-nav-child{background-color: var(--lay-color-gray-1);}
.layui-nav-tree.layui-bg-gray .layui-nav-itemed>a{color:#333!important}
.layui-nav.layui-bg-gray .layui-this a{color:var(--lay-color-secondary)}
.layui-nav-tree.layui-bg-gray .layui-nav-child dd.layui-this,.layui-nav-tree.layui-bg-gray .layui-nav-child dd.layui-this a,.layui-nav-tree.layui-bg-gray .layui-this,.layui-nav-tree.layui-bg-gray .layui-this>a{color:var(--lay-color-secondary)!important}
.layui-nav-tree.layui-bg-gray .layui-nav-bar{background-color:var( --lay-color-secondary)}
/*徽章*/
.layui-badge,.layui-badge-dot,.layui-badge-rim{background-color:var(--lay-color-red-6);color: var(--lay-color-white)}
.layui-badge-rim{background-color: var(--lay-color-white);color:var(--lay-color-black-6)}
/*fix style*/
.layui-layer-loading{background:0 0}
.layui-btn-primary{border-color:transparent}
.layui-btn-group .layui-btn:first-child{border-left:none}
.layui-btn-group .layui-btn-primary:hover{border-top-color:transparent; border-bottom-color: transparent;}
.layui-menu li:hover{background-color:var(--lay-color-fill-2)}
.layui-nav-child dd.layui-this{background-color:var(--lay-color-fill-2)}
.layui-nav .layui-nav-child a:hover{background-color:var(--lay-color-fill-2)}
.layui-nav .layui-nav-item a:hover,.layui-nav .layui-this a{background-color: var(--lay-color-fill-2)}
.layui-nav-child dd.layui-this{background-color: var(--lay-color-fill-2)}
.layui-tab-card>.layui-tab-title .layui-this:after,.layui-tab-title .layui-this:after{border-bottom-color:var(--lay-color-bg-1)}
.layui-form-select dl dd:hover{background-color:var(--lay-color-fill-2)}
.layui-form-select dl dd.layui-this{background-color:var(--lay-color-fill-2)}
.layui-laypage button{color:var(--lay-color-text-1)}
.layui-table-click,.layui-table-hover,.layui-table[lay-even] tbody tr:nth-child(even){background-color:var(--lay-color-fill-3)}
.layui-transfer-data li:hover{background-color:var(--lay-color-active)}
.layui-menu .layui-menu-item-checked,.layui-menu .layui-menu-item-checked2{background-color:var(--lay-color-fill-2)!important}
.layui-input-split{background-color: var(--lay-color-bg-2);}
.layui-layer-tab .layui-layer-title span:first-child{border-left: none !important;}
.layui-slider-input.layui-input,
.layui-slider-input .layui-input {background-color: var(--lay-color-bg-2);}

body {background: #212e36;}
.layui-panel {overflow-x: auto;}
.layui-table th, .layui-table td { text-align: center;white-space: nowrap; }
.collapse { text-align: center; }