html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    font-size: 13px;
}

ol, ul {
    margin-bottom: 0px;
}

dl {
    margin-top: 0;
    margin-bottom: 0px;
}

div::-webkit-scrollbar {
  width: 0;
}

.fixed-table-container tbody .selected td {
	background-color: #dedede
}

.nav-logo {
	float: left;
    height: 100px;
    color: #fff;
    line-height: 50px;
    font-size: 18px;
}

/* Tabs */
.tabs {
	background-position: none;
	background-repeat: none;
}

.tabs, .tabsHeader, .tabsHeaderContent, .tabs .tabsHeader ul, .tabs .tabsHeader li, .tabs .tabsHeader li a, .tabs .tabsHeader li span, .tabs .tabsFooter, .tabs .tabsFooterContent {
    background:none;
}

.tabs .tabsContent {
    border-color: rgba(0,0,0,0);
    background: rgba(0,0,0,0);
}


.tabs .tabsHeader {
	display: block;
	overflow: hidden;
	height: 40px;
	padding-left: 5px;
	background-position: 0 0;
}

.tabs .tabsHeaderContent {
	display: block;
	overflow: hidden;
	height: 40px;
	padding-right: 5px;
	background-position: 100% -50px;
}

.tabs .tabsHeader ul {
	display: block;
	height: 40px;
	background-position: 0 -100px;
	background-repeat: repeat-x;
	border-bottom: 1px solid #ddd;
}

.tabsPage .tabsPageHeader .home_icon {
    background: none!important;
}

.tabs .tabsHeader li {
	float: left;
	display: block;
	height: 40px;
	margin-right: 2px;
	background-position: 0 -250px;
	background-repeat: repeat-x;
	cursor: pointer;
}

.tabs .tabsHeader li a {
	float: left;
	display: block;
	height: 40px;
	padding-left: 5px;
	background-position: 0 -150px;
}

.tabs .tabsHeader li a:hover {
	text-decoration: none;
}

.tabs .tabsHeader li span {
	float: left;
	display: block;
	overflow: hidden;
	height: 40px;
	padding: 2px 10px 0 5px;
	line-height: 38px;
	background-position: 100% -200px;
	cursor: pointer;
	margin-right: 2px;
    line-height: 1.42857143;
    border: 1px solid transparent;
    border-radius: 4px 4px 0 0;
    line-height: 35px;
    padding: 0 20px 0 20px;
}

.tabs .tabsHeader li.hover {
	background-position: 0 -400px;
	background-repeat: repeat-x;
}

.tabs .tabsHeader li.hover a {
	background-position: 0 -300px;
}

.tabs .tabsHeader li.hover span {
	background-position: 100% -350px;
}

.tabs .tabsHeader li.selected {
	background-position: 0 -550px;
}

.tabs .tabsHeader li.selected a {
	background-position: 0 -450px;
}

.tabs .tabsHeader li.selected span {
	font-weight: bold;
	background-position: 100% -500px;
	color: #555;
    cursor: default;
    background-color: #fff;
    border: 1px solid #ddd;
    border-bottom-color: transparent;
}

.tabs .tabsContent {
	display: block;
	overflow: auto;
	padding: 5px 5px 1px 5px;
	border-style: solid;
	border-width: 0 1px;
}

.tabs .tabsFooter {
	display: block;
	overflow: hidden;
	height: 5px;
	background-position: 0 -600px;
}

.tabs .tabsFooterContent {
	display: block;
	overflow: hidden;
	height: 5px;
	background-position: 100% -650px;
}

.tabsPage .tabsPageHeader {
	display: block;
	height: 40px;
	border-style: solid;
	border-width: 1px 1px 0 1px;
	background-position: 0 -450px;
	background-repeat: repeat-x;
	position: relative;
	margin-left: 1px;
	width: 100000px;
	height: 40px;
	overflow: hidden;
	background-color: #fff;
	border-color: #fafafa;
}

.tabsPage .tabsPageHeaderContent {
	display: block;
	overflow: hidden;
	margin-right: 19px;
	position: relative;
	height: 40px;
	border-bottom: solid 2px #2f4050;
}

.tabsPage .tabsPageHeaderMargin {
	margin: 0 34px 0 17px;
}

.tabsPage .tabsPageHeader ul {
	display: block;
	width: 90%;
	height: 40px;
	z-index: 1;
	position: absolute;
	transition: all .3s ease-out 0s;
}

.tabsPage .tabsPageHeader li {
	display: block;
	float: left;
	border-right: solid 1px #eee;
	padding: 0 0px;
}

.tabsPage .tabsPageHeader li a {
	    display: block;
    float: left;
    border-right: solid 0px #eee;
    padding: 0 15px;
}

.tabsPage .tabsPageHeader li a:hover {
	text-decoration: none;
}

.tabsPage .tabsPageHeader li span {
	float: left;
	display: block;
	overflow: hidden;
	width: 92px;
	height: 40px;
	padding: 2px 10px 0 20px;
	line-height: 34px;
	cursor: pointer;
	font-size:14px;
}

.tabsPage .tabsPageHeader li.hover {
	background-position: 0 -250px;
	background-repeat: repeat-x;
}

.tabsPage .tabsPageHeader li.hover a {
	background-position: 0 -150px;
}

.tabsPage .tabsPageHeader li.hover span {
	background-position: 100% -200px;
}

.tabsPage .tabsPageHeader li {
    float: left;
    display: block;
    height: 40px;
    margin-left: 2px;
    position: relative;
    cursor: pointer;
}

.tabsPage .tabsPageHeader li a {
    float: left;
    display: block;
    overflow: hidden;
    height: 40px;
    padding-left: 5px;
    line-height: 40px;
}

.tabsPage .tabsPageHeader li.selected {
	background: #2f4050;
    color: #a7b1c2;
}

.tabsPage .tabsPageHeader li.selected a {
	font-weight: bold;
	/* background:none!important; */
}

.tabsPage .tabsPageHeader li.selected span {
	/* background-position: 100% -350px; */
	color: #eaeaea;
}

.tabsPage .tabsPageHeader li .close {
	display: block;
	overflow: hidden;
	width: 11px;
	height: 11px;
	padding: 0;
	text-indent: -1000px;
	position: absolute;
	top: 3px;
	right: 2px;
}

.tabsPage .tabsPageHeader li .close:hover {
	background-position: 0 -50px;
}

.tabsPage .tabsPageHeader li.main span {
	padding: 2px 8px 0 3px;
	line-height:35px;
	background: none!important;
}

.tabsPage .tabsPageHeader li .home_icon,
.tabsPage .tabsPageHeader li.main .home_icon {
	width: auto;
	padding: 0 0 0 15px;
	background: none!important;
}

.tabsPage .tabsPageContent {
	display: block;
	overflow: hidden;
	border-style: solid;
	border-width: 0 0px 0px 0px;
	position: relative;
}

.content-tabs {
	border-bottom: solid 2px #2f4050
}

.content-tabs {
	position: relative;
	height: 42px;
	background: #fafafa;
	line-height: 40px
}

.panelBar {
    display: block;
    overflow: hidden;
    height: 40px;
    border-style: solid;
    border-width: 1px 0;
    background-repeat: repeat-x;
    border-color: #fff;
    background-color: #fff;
    margin-bottom: 5px;
    margin-top:5px;
}

.panelBar .toolBar a, .panelBar .toolBar li.hover a {
    float: left;
    display: block;
    overflow: hidden;
    padding: 0 5px 0 5px;
    text-decoration: none;
    background-color: #009688;
}

.toolBar a, .toolBar li.hover a {
    display: inline-block;
    height: 38px;
    line-height: 38px;
    padding: 0 18px;
    background-color: #009688;
    color: #f3f3f3;
    white-space: nowrap;
    text-align: center;
    font-size: 14px;
    border:none;
    border-radius: 2px;
    cursor: pointer;
}

.panelBar li {
    float: left;
    display: block;
    overflow: hidden;
    height: 40px;
    padding: 0 0 0 5px;
}

.panelBar .toolBar li, .panelBar .toolBar li.hover {
	padding: 0 0 0 5px;
}

.panelBar .toolBar span, .panelBar .toolBar li.hover span {
	float: left;
	display: block;
	overflow: hidden;
	height: 40px;
	padding: 0 20px 0 20px;
	line-height: 40px;
	cursor: pointer;
	background-color: #009688;
	border:none;
}

.pagination, .pagination li.hover, .pagination li.hover a, .pagination li span, .pagination li.disabled span span, .pagination li.jumpto, .pagination li.jumpto .goto {
	    background: none!important;
	}

 .toolBar li.hover, .toolBar li.hover a, .toolBar li.hover span  {
    padding: 0 0 0 5px;
    color: #fff;
    font-weight: bold;
}

.panelBar .pages {
    height: 40px;
}

.panelBar .pages span {
    float: left;
    line-height: 35px;
    background: none!important;
}

.searchBar ul.searchContent {
    display: block;
    overflow: visible;
    height: auto;
    min-height: 38px;
    margin-top: 10px;
}

.searchBar ul.searchContent li label {
    float: left;
    width: 110px;
    padding: 0 5px;
    line-height: 38px;
}

.searchBar ul.searchContent li {
    float: left;
    display: block;
    overflow: visible;
    width: 23%;
    height: 40px;
    padding: 2px 0;
}

.searchBar ul.searchContent li input {
    float: left;
    width: 40%;
    padding: 0 5px;
    line-height: 23px;
    height: 30px;
}

.page .pageHeader, .formBar {
    border-color: #dadada;
    background: #fff;
    width: 100%;
    overflow: visible;
}

body, #splitBar {
    background: #fff;
}

.table-fixed {
	table-layout:fixed;
}

table, caption, tbody, tfoot, thead, tr, th, td {
	padding: 0;
	margin: 0;
	font-size: 13px;
	line-height: 100%;
	font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td {
    border-top: 1px solid #ddd;
}

.table>thead>tr>th {
	border-top: 0px solid #ddd;
}

th {
	font-weight: bold;
	font-size: 14px;
}

.searchBar .subBar ul {
    float: right;
    width: 10%;
}



.buttonActive {
	display: inline-block;
	height: 38px;
	line-height: 38px;
	padding: 0 18px;
	background-color: #009688;
	color: #fff;
	white-space: nowrap;
	text-align: center;
	font-size: 14px;
	border: none;
	border-radius: 2px;
	cursor: pointer
}

.buttonActive .buttonContent {
	padding: 0 5px 0 0;
	background-position: none!important;
}

.buttonActive button, .buttonDisabled button {
	display: inline-block;
	height: 38px;
	line-height: 38px;
	padding: 0 18px;
	background-color: #009688;
	color: #fff;
	white-space: nowrap;
	text-align: center;
	font-size: 14px;
	border: none;
	border-radius: 2px;
	cursor: pointer
}

.button {
	display: inline-block;
	height: 38px;
	line-height: 38px;
	padding: 0 18px;
    background-color: #fff;
    color: #555;
	white-space: nowrap;
	text-align: center;
	font-size: 14px;
	border-radius: 2px;
	cursor: pointer
}

.button .buttonContent {
	padding: 0 5px 0 0;
	background-position: none!important;
}

.button:hover {
	opacity: .8;
	filter: alpha(opacity=80);
	/* color: #fff */
}

.button button, .buttonDisabled button {
	display: inline-block;
	height: 38px;
	line-height: 38px;
	padding: 0 18px;
	border: 1px solid #C9C9C9;
    background-color: #fff;
    color: #555;
	white-space: nowrap;
	text-align: center;
	font-size: 14px;
	border-radius: 2px;
	cursor: pointer
}


.button, .button span, .buttonDisabled, .buttonDisabled span, .buttonActive, .buttonActive span, .button .buttonContent, .buttonHover, .buttonHover .buttonContent, .buttonActive .buttonContent, .buttonActiveHover, .buttonActiveHover .buttonContent, .buttonDisabled .buttonContent {
    background: none!important;
}

.searchBar .subBar {
    height: 40px;
}

.button span, .buttonDisabled span, .buttonActive span, .button .buttonContent, .buttonHover, .buttonHover .buttonContent, .buttonActive .buttonContent, .buttonDisabled .buttonContent {
    float: left;
    display: block;
    overflow: hidden;
    height: 40px;
    line-height: 40px;
    font-weight: bold;
}

.close {
    opacity: 1;
}

.layui-layout-admin .layui-side {
    top: 49px;
    width: 200px;
    overflow-x: hidden;
}

#header .nav li {
    background:none!important;
}

#header .nav li {
    line-height: 30px;
    height: 30px;
    border-left: 1px solid #ddd;
}

.pagination {
    width: 30%;
    margin: 0px 0;
}

.pageFormContent p {
    height: 40px;
    width: 500px;
    line-height: 30px;
}

.textInput, input.focus, input.required, input.error, input.readonly, input.disabled, textarea.focus, textarea.required, textarea.error, textarea.readonly, textarea.disabled {
    background-color: #FFF;
    border: 1px solid #C0C0C0;
    border-radius: 1px;
    color: inherit;
    display: block;
    padding: 6px 12px;
    -webkit-transition: border-color .15s ease-in-out 0s, box-shadow .15s ease-in-out 0s;
    transition: border-color .15s ease-in-out 0s, box-shadow .15s ease-in-out 0s;
    font-size: 14px;
}

.combox {
    color: inherit;
    font-size: 13px;
    margin-top: 5px;
}

.combox .select a {
    height: 25px;
    line-height: 22px;
    font-size: 13px;
    min-width: 100px;
}

.dialog .dialogHeader, .dialog .dialogHeader_r, .dialog .dialogHeader_c, .dialog .dialogFooter, .dialog .dialogFooter_r, .dialog .dialogFooter_c {
    background:none!important;
    background-color: #fff;
}

.dialog .dialogHeader, .dialog .dialogHeader_r, .dialog .dialogHeader_c {
    height: 50px;
    text-align: center;
}

.dialog .dialogContent {
    border-color: #C0C0C0;
    background: rgba(0,0,0,0);
    border-width: 0 0;
}

.dialog {
    background: #fff;
}

.dialog .pageFormContent, .dialog .viewInfo {
    border-width: 1px 0;
    overflow-x: hidden !important;
    box-sizing: border-box;
}
.dialog .pageFormContent p {
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 40px;
    box-sizing: border-box;
    overflow: visible;
}
.dialog .dialogContent {
    overflow-x: hidden !important;
}

.dialog .pageContent {
    border-width: 0 0px;
    height: 100%;
    box-sizing: border-box;
    overflow-x: hidden !important;
}
.dialog .pageContent > form.pageForm {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: 100%;
    box-sizing: border-box;
}
.dialog .pageContent > form.pageForm > .formBar {
    flex-shrink: 0;
}

.alert {
    width: 500px;
}

.alert .toolBar {
    height: 40px;
}

.progressBar {
	width: 220px;
    height: 50px;
}

.accountInfo {
    display: block;
    overflow: hidden;
    height: 60px;
    padding: 0 10px;
    background: none;
}

.dialog .dialogHeader h1 {
    display: block;
    overflow: hidden;
    height: auto;
    max-height: 50px;
    margin: 0;
    padding: 0 40px 0 20px;
    line-height: 1.35;
    background-position: 0 -450px;
    font-size: 17px;
    font-weight: 700;
    background: none !important;
    box-sizing: border-box;
    width: 100%;
}

.dialog .formBar {
    border-style: solid;
    border-width: 0px 0;
}

span.error {
    display: block;
    overflow: hidden;
    width: 120px;
    height: 28px;
    padding: 0 3px;
    line-height: 28px;
    background: #F00;
    color: #FFF;
    position: absolute;
    top: 5px;
    left: 425px;
}

.dialogBackground {
    filter: alpha(opacity=40);
    background: #1d1b1b;
}

.nav>li>a:focus, .nav>li>a:hover {
    background-color: rgba(16,43,73,.5);
}

.site-doc-color li {
    display: inline-block;
    vertical-align: middle;
    width: 180px;
    margin-left: 20px;
    margin-bottom: 20px;
    padding: 20px 10px;
    color: #fff;
    text-align: center;
    border-radius: 2px;
    line-height: 22px;
    font-size: 14px;
}

.layui-icon {
	margin-right: 10px;
}

/* Toolbar icons spacing (DWZ panelBar) */
.panelBar .toolBar a span .layui-icon,
.panelBar .toolBar a span i.layui-icon{
    margin-right: 6px !important;
    font-size: 16px;
    vertical-align: middle;
}

/* Core Code */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {  line-height: inherit; }

/* =========================
 * Global theme overrides
 * Keep this block LAST so it wins over DWZ/Layui/Bootstrap defaults.
 * ========================= */
:root{
    --app-bg: #f5f7fb;
    --card-bg: #ffffff;
    --text: #111827;
    --muted: #6b7280;
    --border: rgba(17, 24, 39, .10);
    --shadow: 0 10px 30px rgba(17, 24, 39, .08);
    --shadow-sm: 0 4px 12px rgba(17, 24, 39, .10);
    --radius: 10px;
    --radius-sm: 8px;
    --primary: #2563eb;
    --primary-600: #1d4ed8;
    --danger: #e11d48;
    --warn: #f59e0b;
    --brand-watermark: "INDU";
    --font-tech: "Bahnschrift", "Segoe UI", "DIN Alternate", "Microsoft YaHei", "PingFang SC", sans-serif;
}

html, body{
    font-size: 13px;
    line-height: 1.55;
    color: var(--text);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", "PingFang SC", "Noto Sans SC", Arial, sans-serif;
}

body, #splitBar{
    background: var(--app-bg);
}

a{
    color: inherit;
    text-decoration: none;
}
a:hover{
    text-decoration: none;
}

/* Page shell */
#layout{
    background: var(--app-bg);
}

#header, #header .headerNav{
    background: linear-gradient(180deg, rgba(17, 24, 39, .92), rgba(29, 78, 216, .55)) !important;
    background-color: #111827 !important;
    background-image: none !important;
}
#header{
    box-shadow: 0 2px 18px rgba(0,0,0,.18);
    height: 50px;
}
#header .headerNav{
    height: 50px;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 18px !important;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
}
#header .headerNav::after{
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(rgba(148,163,184,.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(148,163,184,.12) 1px, transparent 1px),
        radial-gradient(circle at 16% 32%, rgba(56, 189, 248, .28), transparent 52%),
        radial-gradient(circle at 84% 68%, rgba(59, 130, 246, .24), transparent 56%);
    background-size: 28px 28px, 28px 28px, auto, auto;
    background-position: 0 0, 0 0, 0 0, 0 0;
    pointer-events: none;
    z-index: 0;
}
#header .headerNav > *{
    position: relative;
    z-index: 1;
}
#header .headerNav::before{
    content: none;
}
#header .nav li{
    border-left: none;
}
#header .nav li a{
    color: rgba(255,255,255,.88);
    padding: 0 12px;
    height: 34px;
    line-height: 34px !important;
    border-radius: 999px;
    transition: background-color .15s ease, color .15s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    white-space: nowrap;
}
#header .nav li a .nav-icon{
    margin-right: 0;
    font-size: 14px;
    opacity: .9;
}

.nav-logo{
    height: 50px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 600;
    letter-spacing: .2px;
}
.nav-logo img{
    display: block;
    height: 34px !important;
    margin: 0 0 0 10px !important;
}

#header .nav{
    display: flex;
    align-items: center;
    margin: 0;
    gap: 6px;
    padding: 0 !important;
    float: none !important;
}
#header .nav li{
    height: 50px;
    line-height: normal;
    display: flex;
    align-items: center;
    float: none !important;
    margin: 0 !important;
}
#header .nav li a:hover{
    background: rgba(255,255,255,.10);
    color: #fff;
}

/* Layui sidebar */
.layui-layout-admin .layui-side{
    top: 50px;
    width: 220px;
    background: linear-gradient(180deg, #0b1220, #0a1633);
    box-shadow: 2px 0 18px rgba(0,0,0,.18);
    position: fixed !important;
    left: 0;
    bottom: 0;
    overflow: hidden;
    z-index: 30;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}
.layui-layout-admin .layui-side::before{
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(rgba(148,163,184,.10) 1px, transparent 1px),
        linear-gradient(90deg, rgba(148,163,184,.10) 1px, transparent 1px),
        radial-gradient(circle at 18% 16%, rgba(56, 189, 248, .24), transparent 52%),
        radial-gradient(circle at 72% 84%, rgba(59, 130, 246, .20), transparent 56%);
    background-size: 28px 28px, 28px 28px, auto, auto;
    background-position: 0 0, 0 0, 0 0, 0 0;
    pointer-events: none;
    z-index: 0;
}
.layui-layout-admin .layui-side::selection{
    background: transparent;
}
/* Blend strip between sidebar and content */
.layui-layout-admin .layui-side{
    border-right: 1px solid rgba(255,255,255,.14);
}
.layui-layout-admin .layui-side::selection{
    background: transparent;
}
.layui-layout-admin .layui-side::after{
    box-shadow: 8px 0 20px rgba(59, 130, 246, .16);
}
#container::after{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 12px;
    height: 100%;
    background: linear-gradient(90deg, rgba(59,130,246,.16), rgba(59,130,246,0));
    pointer-events: none;
    z-index: 2;
}
.layui-layout-admin .layui-side::after{
    content: var(--brand-watermark);
    position: absolute;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    font-size: 34px;
    font-weight: 700;
    letter-spacing: 3px;
    color: rgba(255,255,255,.16);
    text-shadow: 0 2px 10px rgba(0,0,0,.35);
    pointer-events: none;
    z-index: 0;
    white-space: nowrap;
}
.layui-side-scroll{
    padding: 12px 8px 14px 8px;
    position: relative;
    z-index: 1;
}
.layui-nav-tree{
    background: transparent;
    width: 220px;
    position: relative;
    z-index: 1;
}
.layui-nav-tree .layui-nav-item a{
    color: rgba(255,255,255,.80);
    border-radius: 10px;
    margin: 6px 0 !important;
    padding: 12px 14px !important;
    padding-right: 34px !important;
    line-height: 20px !important;
    height: auto !important;
    box-sizing: border-box;
    width: 100%;
    text-overflow: ellipsis;
    overflow: visible;
    white-space: nowrap;
}
.layui-nav-tree .layui-nav-more{
    right: 12px !important;
}
.layui-nav-tree .layui-nav-item a:hover{
    background: rgba(255,255,255,.08);
}
.layui-nav-tree .layui-nav-itemed>.layui-nav-child{
    background: rgba(255,255,255,.03);
    border-radius: 10px;
    padding: 6px 6px 8px 6px;
}
.layui-nav-tree .layui-nav-child a{
    padding: 10px 12px 10px 18px !important;
    margin: 4px 0 !important;
    height: auto !important;
    box-sizing: border-box;
    width: 100%;
}
.layui-nav-tree .layui-nav-child dd.layui-this,
.layui-nav-tree .layui-nav-child dd.layui-this a{
    background: rgba(37, 99, 235, .22);
    color: #eaf2ff;
}
.layui-nav-tree .layui-nav-itemed > a{
    background: rgba(255,255,255,.06);
}

/* Layui select dropdown - light theme-blue */
.layui-form-select dl dd.layui-this{
    background-color: rgba(37, 99, 235, .18) !important;
    color: #1e3a8a !important;
}
.layui-form-select dl dd:hover{
    background-color: rgba(37, 99, 235, .10) !important;
}

/* Content area */
#container, .tabsPage .tabsPageContent{
    background: var(--app-bg);
}
#sidebar{
    width: 220px !important;
    left: 0 !important;
    overflow: visible !important;
    z-index: 30 !important;
    position: relative !important;
    top: 0 !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: 100% !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}
#splitBar, #splitBarProxy{
    display: none !important;
}
#container{
    position: absolute !important;
    top: 50px !important;
    right: 0;
    bottom: 0;
    left: 220px !important;
    overflow: hidden;
}
#container::before{
    content: var(--brand-watermark) "  " var(--brand-watermark) "  " var(--brand-watermark) "  " var(--brand-watermark) "\A"
             var(--brand-watermark) "  " var(--brand-watermark) "  " var(--brand-watermark) "  " var(--brand-watermark) "\A"
             var(--brand-watermark) "  " var(--brand-watermark) "  " var(--brand-watermark) "  " var(--brand-watermark) "\A"
             var(--brand-watermark) "  " var(--brand-watermark) "  " var(--brand-watermark) "  " var(--brand-watermark);
    position: absolute;
    left: -12%;
    top: -40px;
    width: 140%;
    height: 140%;
    transform: rotate(-18deg);
    transform-origin: center;
    font-size: 26px;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 86px;
    color: rgba(37,99,235,.10);
    white-space: pre;
    pointer-events: none;
    z-index: 0;
}
#container > *{
    position: relative;
    z-index: 1;
}
.tabsPage .tabsPageContent{
    padding: 12px 14px 16px 14px;
    box-sizing: border-box;
}

/* DWZ tab content padding (fix right edge touching) */
.navTab-panel{
    box-sizing: border-box;
    padding: 12px 16px 16px 16px;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    position: relative;
    overflow: hidden;
}
.navTab-panel::before{
    content: "INDU  INDU  INDU  INDU\AINDU  INDU  INDU  INDU\AINDU  INDU  INDU  INDU\AINDU  INDU  INDU  INDU";
    position: absolute;
    left: -6%;
    top: -30px;
    width: 120%;
    height: 130%;
    transform: rotate(-18deg);
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 78px;
    color: rgba(37,99,235,.08);
    white-space: pre;
    pointer-events: none;
    z-index: 0;
}
.navTab-panel > *{
    position: relative;
    z-index: 1;
}
.navTab-panel .page,
.navTab-panel .pageContent{
    box-sizing: border-box;
    padding: 0;
}
.navTab-panel .pageContent{
    background: transparent;
    border-radius: calc(var(--radius) - 2px);
}
.tabsPage .tabsPageHeader{
    background: var(--card-bg);
    border-color: transparent;
    box-shadow: 0 1px 0 var(--border), 0 10px 24px rgba(37, 99, 235, .06);
    border-radius: 12px 12px 0 0;
    padding: 0 8px;
}
.tabsPage .tabsPageHeaderContent{
    border-bottom: 2px solid rgba(47, 64, 80, .70);
    border-bottom-color: rgba(37, 99, 235, .35);
}
.tabsPage .tabsPageHeader li{
    border-right: 0;
    margin-top: 4px;
    border-radius: 10px 10px 0 0;
}
.tabsPage .tabsPageHeader li.selected{
    background: linear-gradient(180deg, rgba(37, 99, 235, .95), rgba(29, 78, 216, .92));
}
.tabsPage .tabsPageHeader li.selected span{
    color: rgba(255,255,255,.92);
}
.tabsPage .tabsPageHeader li a{
    border-radius: 10px 10px 0 0;
}
.tabsPage .tabsPageHeader li:not(.selected) a{
    background: rgba(17,24,39,.03);
}
.tabsPage .tabsPageHeader li a > span{
    width: auto !important;
    min-width: 72px;
    padding: 2px 16px 0 14px !important;
    white-space: nowrap;
}
.tabsPage .tabsPageHeader li a > span::before{
    content: "◈";
    display: inline-block;
    margin-right: 6px;
    font-size: 10px;
    color: rgba(37, 99, 235, .75);
    transform: translateY(-1px);
}
.tabsPage .tabsPageHeader li.selected a > span::before{
    color: rgba(255,255,255,.95);
}
.tabsPage .tabsPageHeader li.main a > span::before{
    content: none !important;
}
/* Home tab: icon only (hide "首页" text) */
.tabsPage .tabsPageHeader li.main .home_icon{
    font-size: 0 !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 4px !important;
    display: inline-flex;
    align-items: center;
}
.tabsPage .tabsPageHeader li.main .home_icon::before{
    content: "\e68e";
    font-family: "layui-icon" !important;
    font-size: 14px;
    color: inherit;
    line-height: 1;
}
.tabsPage .tabsPageHeader li.main a > span{
    min-width: 0 !important;
    width: auto !important;
    padding: 2px 8px 0 8px !important;
}
/* Tech-style font application */
#header .nav-logo,
#header .nav li a,
.layui-nav-tree .layui-nav-item a,
.tabsPage .tabsPageHeader li a > span,
.panelBar .toolBar a,
.panelBar .pagination a,
.panelBar .pagination span,
.layui-btn{
    font-family: var(--font-tech);
    letter-spacing: .2px;
}

/* Cards / panels */
.layui-card{
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border);
}
.layui-card-header{
    border-bottom: 1px solid var(--border);
}

/* Search / toolbar / pagination rounded */
/* Search area (DWZ search bar) */
.searchBar{
    background: transparent;
    padding: 4px 0;
}
.searchBar .subBar{
    height: auto;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.searchBar .subBar ul{
    width: auto !important;
}
.searchBar ul.searchContent{
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    overflow: visible;
}
.searchBar .subBar ul{
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    overflow: hidden;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 10px;
    box-sizing: border-box;
}
.searchBar .subBar > ul{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 !important;
    padding: 0 10px !important;
    list-style: none;
}
.searchBar .subBar > ul > li{
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    display: inline-flex;
    align-items: center;
}
/* Make old DWZ submit structure look like layui-input-inline */
.searchBar .subBar > ul > li > .buttonActive{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 96px;
}
.searchBar .subBar > ul > li > .buttonActive .buttonContent,
.searchBar .subBar > ul > li > .buttonActive button{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 40px !important;
    line-height: 40px !important;
}

/* Page header / form bar (search outer shell) */
.page .pageHeader,
.formBar{
    border-radius: var(--radius);
    border: 1px solid var(--border);
    background: var(--card-bg);
    box-shadow: var(--shadow-sm);
    padding: 8px 12px;
    box-sizing: border-box;
}

/* Toolbar area (DWZ panelBar) */
.panelBar{
    border: 1px solid var(--border) !important;
    border-radius: var(--radius) !important;
    overflow: hidden;
    height: 52px;
    margin-top: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 0 10px;
    box-sizing: border-box;
}
.panelBar ul{
    margin: 0 !important;
    padding: 0 !important;
}
.panelBar ul.toolBar{
    height: 52px;
    display: flex;
    align-items: center;
    padding: 0;
    box-sizing: border-box;
    flex: 0 1 auto;
    order: 1;
}
.panelBar .pages{
    display: flex;
    align-items: center;
    height: 52px;
    padding: 0;
    order: 2;
    margin-left: auto;
    margin-right: 8px;
}
.panelBar .pages,
.panelBar .pagination{
    flex: 0 0 auto !important;
}
.panelBar .pages span{
    line-height: 52px;
}
.panelBar .pages select{
    height: 32px;
    border-radius: 10px;
    border: 1px solid var(--border);
}
.panelBar ul.toolBar li{
    height: 52px;
    display: flex;
    align-items: center;
    padding-left: 8px;
}
.panelBar ul.toolBar li a{
    height: 40px !important;
    line-height: 40px !important;
}
.panelBar .toolBar li,
.panelBar .toolBar span{
    height: 52px;
}
.panelBar .toolBar span{
    line-height: 52px;
}

/* Pagination area (DWZ pagination) */
.panelBar .pagination,
.pagination{
    background: var(--card-bg) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius) !important;
    overflow: hidden !important;
    padding: 6px 8px !important;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: nowrap;
    white-space: nowrap;
}
.panelBar .pagination{
    float: none !important;
    order: 3;
    margin-left: 0;
    width: auto !important;
}
.panelBar .pagination ul,
.pagination ul{
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}
.panelBar .pages{
    float: none !important;
    width: auto !important;
}
.panelBar .pagination li,
.pagination li{
    float: none !important;
    padding: 0 !important;
    height: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
}
.panelBar .pagination a,
.panelBar .pagination span,
.pagination a,
.pagination span{
    float: none !important;
    /* Important removed so DWZ pagination can hide spans via inline `display:none` */
    display: inline-flex;
    align-items: center !important;
    justify-content: center !important;
    height: 34px !important;
    line-height: 34px !important;
    padding: 0 10px !important;
    border-radius: 12px !important;
    color: var(--text) !important;
    background: rgba(17,24,39,.04) !important;
    text-decoration: none !important;
}
.panelBar .pagination a > span,
.panelBar .pagination span > span,
.pagination a > span,
.pagination span > span{
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    color: inherit !important;
    line-height: inherit !important;
    height: auto !important;
    display: inline !important;
}
.panelBar .pagination li.jumpto,
.pagination li.jumpto{
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px;
    padding: 0 !important;
    background: transparent !important;
}
.panelBar .pagination li.jumpto .textInput,
.pagination li.jumpto .textInput{
    width: 44px !important;
    height: 34px !important;
    line-height: 34px !important;
    border-radius: 12px !important;
}
.panelBar .pagination li.jumpto .goto,
.pagination li.jumpto .goto{
    height: 34px !important;
    border-radius: 12px !important;
    border: 0 !important;
    padding: 0 10px !important;
    min-width: 52px !important;
    width: auto !important;
    background: var(--primary) !important;
    background-image: none !important;
    color: #fff !important;
    text-indent: 0 !important;
    overflow: visible !important;
    font-size: 13px !important;
    line-height: 34px !important;
    cursor: pointer;
}
.panelBar .pagination li.selected a,
.pagination li.selected a{
    color: #fff !important;
    background: var(--primary) !important;
}
.panelBar .pagination li.disabled span,
.panelBar .pagination li.disabled a,
.pagination li.disabled span,
.pagination li.disabled a{
    opacity: .55;
    cursor: not-allowed !important;
}

/* Alert / message popup redesign */
.alert{
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    border: 1px solid var(--border);
}
.alert .alertInner{
    border-radius: calc(var(--radius) - 2px);
    background: #fef9c3;
}
.alert .toolBar{
    background: #e5f0ff;
    border-top: 1px solid var(--border);
    padding: 4px 10px;
}

/* DWZ alert popup polish (fix too-large warning dialog) */
#alertMsgBox,
#alertMsgBox.alert{
    width: 380px !important;
    max-width: 86vw;
    border-radius: 14px !important;
    border: 1px solid rgba(37, 99, 235, .18) !important;
    box-shadow: 0 18px 45px rgba(15, 23, 42, .24) !important;
    overflow: hidden;
    background: #fff !important;
}
#alertMsgBox .alertContent{
    border: 0 !important;
    padding: 12px 12px 8px 12px !important;
    background: #fff !important;
}
#alertMsgBox .alertInner{
    border-radius: 12px !important;
    border: 1px solid rgba(239, 68, 68, .45) !important;
    background: #fff5f5 !important;
    padding: 8px 10px !important;
}
#alertMsgBox .alertInner h1{
    margin: 0 0 6px 0 !important;
    padding: 0 0 6px 28px !important;
    line-height: 22px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #b42318 !important;
    border-bottom: 1px solid rgba(180, 35, 24, .18) !important;
    background-position: 2px 2px !important;
}
#alertMsgBox .alertInner .msg{
    margin: 0 !important;
    padding: 4px 2px 2px 2px !important;
    line-height: 22px !important;
    font-size: 14px !important;
    color: #111827 !important;
}
#alertMsgBox .toolBar{
    height: auto !important;
    padding: 8px 10px 10px 10px !important;
    text-align: right !important;
    border-top: 1px solid rgba(17, 24, 39, .10) !important;
    background: #f8fbff !important;
}
#alertMsgBox .toolBar ul{
    float: none !important;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
#alertMsgBox .toolBar li{
    float: none !important;
}
#alertMsgBox .toolBar .button,
#alertMsgBox .toolBar .buttonActive{
    margin-left: 0 !important;
}
#alertMsgBox .toolBar .button span,
#alertMsgBox .toolBar .buttonActive span{
    min-width: 78px;
    height: 34px !important;
    line-height: 34px !important;
    border-radius: 12px !important;
    font-weight: 600;
}
#alertMsgBox .alertFooter,
#alertMsgBox .alertFooter_r,
#alertMsgBox .alertFooter_c{
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

/* Dialog footer action bar consistency */
.dialog .formBar{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    min-height: 56px;
    padding: 14px 14px 18px 14px !important;
    border-top: 0 !important;
    background: #fff !important;
    box-sizing: border-box;
}
.dialog .formBar ul{
    float: none !important;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0 !important;
    padding: 0 !important;
}
.dialog .formBar li{
    float: none !important;
    padding: 0 !important;
    background: none !important;
}
.dialog .formBar .button,
.dialog .formBar .buttonActive{
    margin: 0 !important;
    background: none !important;
}
.dialog .formBar .button span,
.dialog .formBar .buttonActive span,
.dialog .formBar .button button,
.dialog .formBar .buttonActive button{
    height: 38px !important;
    line-height: 38px !important;
    border-radius: 12px !important;
    min-width: 88px;
    font-weight: 600;
    margin-top: 0;
}
.dialog .formBar .button button{
    background: #fff !important;
    border: 1px solid rgba(17,24,39,.16) !important;
    color: #111827 !important;
}
.dialog .formBar .buttonActive button{
    background: var(--primary) !important;
    border: 1px solid var(--primary) !important;
    color: #fff !important;
}

/* Buttons */
.layui-btn,
.buttonActive,
.toolBar a, .toolBar li.hover a,
.panelBar .toolBar a, .panelBar .toolBar li.hover a{
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
    border-radius: 14px;
    min-width: 96px;
    padding-left: 14px;
    padding-right: 14px;
    overflow: hidden;
}
.layui-btn:hover,
.buttonActive:hover,
.toolBar a:hover,
.panelBar .toolBar a:hover{
    background-color: var(--primary-600) !important;
    border-color: var(--primary-600) !important;
}
.layui-btn-primary{
    background: #fff !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    border-radius: 14px !important;
    min-width: 96px;
}

/* Allow icon-only buttons to stay compact */
.layui-btn.layui-btn-xs,
.layui-btn.layui-btn-sm,
.layui-btn.layui-btn-lg{
    min-width: 0;
}
.layui-btn[style*="padding : 0"],
.layui-btn[style*="padding: 0"]{
    min-width: 0;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Fix "button bottom bleed" from nested spans (DWZ toolbar/button structure) */
.buttonActive span,
.buttonActive .buttonContent,
.buttonActive button,
.toolBar a span,
.panelBar .toolBar a span,
.panelBar .toolBar span{
    background-color: transparent !important;
}
.buttonActive,
.toolBar a,
.panelBar .toolBar a{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.buttonActive span,
.toolBar a span,
.panelBar .toolBar a span{
    height: auto !important;
    line-height: inherit !important;
    padding: 0 !important;
}

/* Inputs */
.layui-input, .layui-textarea, .form-control,
.textInput, input.focus, input.required, input.error, input.readonly, input.disabled, textarea.focus, textarea.required, textarea.error, textarea.readonly, textarea.disabled{
    border-radius: 10px;
    border-color: rgba(17, 24, 39, .14);
}
.layui-input:focus, .layui-textarea:focus, .form-control:focus,
input.focus, textarea.focus{
    border-color: rgba(37, 99, 235, .55) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .18) !important;
}

/* Tables */
.table, .grid{
    background: var(--card-bg);
}
.bootstrap-table,
.fixed-table-container,
.fixed-table-body{
    width: 100% !important;
}
.bootstrap-table .fixed-table-container .table,
.fixed-table-header table,
.fixed-table-body table{
    width: 100% !important;
    max-width: 100% !important;
}
.fixed-table-container{
    background: var(--card-bg);
    border-radius: var(--radius) !important;
    overflow: hidden !important;
}
.fixed-table-container .table{
    margin-bottom: 0;
}
.fixed-table-header{
    background: transparent;
}
.fixed-table-header,
.fixed-table-body{
    border-radius: var(--radius) !important;
}
.table>thead>tr>th{
    background: linear-gradient(180deg, rgba(37, 99, 235, .98), rgba(29, 78, 216, .92));
    border-bottom: 1px solid rgba(0,0,0,.08);
    color: rgba(255,255,255,.92);
}
.bootstrap-table .table>thead>tr>th,
.fixed-table-container thead th{
    background: linear-gradient(180deg, rgba(37, 99, 235, .98), rgba(29, 78, 216, .92)) !important;
    color: rgba(255,255,255,.92) !important;
    border-bottom: 1px solid rgba(0,0,0,.08) !important;
}
.fixed-table-container thead th .th-inner{
    color: rgba(255,255,255,.92) !important;
}
.table>tbody>tr>td{
    border-top: 1px solid rgba(0,0,0,.06);
}
.table-striped>tbody>tr:nth-of-type(odd){
    background-color: rgba(17, 24, 39, .02);
}
.table-hover>tbody>tr:hover{
    background-color: rgba(37, 99, 235, .06);
}

/* Dialog / layer */
.dialog{
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    border: 1px solid var(--border);
    overflow: hidden;
}
.dialog .dialogHeader{
    position: relative;
    background: linear-gradient(270deg,
        rgba(37, 99, 235, .40) 0%,
        rgba(37, 99, 235, .22) 42%,
        rgba(37, 99, 235, .08) 100%) !important;
    border-bottom: 1px solid rgba(37, 99, 235, .28);
    overflow: hidden;
    height: 50px !important;
    min-height: 50px !important;
    box-sizing: border-box;
}
.dialog .dialogHeader_r,
.dialog .dialogHeader_c {
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
    box-sizing: border-box;
}
.dialog .dialogHeader_r {
    display: flex !important;
    align-items: stretch !important;
}
.dialog .dialogHeader_c {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    min-height: 0 !important;
}
.dialog .dialogHeader::before{
    content: var(--brand-watermark) "   " var(--brand-watermark) "   " var(--brand-watermark);
    position: absolute;
    right: -38px;
    top: -8px;
    transform: rotate(-12deg);
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, .20);
    z-index: 0;
    white-space: nowrap;
    pointer-events: none;
}
.dialog .dialogHeader .close{
    top: 15px !important;
    z-index: 2;
}
/* 全局去掉 DWZ 弹窗的最大化/还原/最小化按钮，只保留关闭按钮 */
.dialog .dialogHeader .maximize,
.dialog .dialogHeader .restore,
.dialog .dialogHeader .minimize{
    display: none !important;
}
.dialog .dialogHeader h1 {
    position: relative;
    z-index: 1;
    color: #0f172a;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.45);
    flex: 0 1 auto;
    align-self: center;
}
.dialogBackground{
    background: rgba(17, 24, 39, .55);
    filter: none;
}

/* Layui layer (popup) */
.layui-layer{
    border-radius: var(--radius) !important;
    overflow: hidden;
    box-shadow: var(--shadow) !important;
    border: 1px solid var(--border) !important;
}
.layui-layer-title{
    border-bottom: 1px solid var(--border) !important;
    background: #fff !important;
    color: var(--text) !important;
}
.layui-layer-btn a{
    border-radius: 10px !important;
}
.layui-layer-btn .layui-layer-btn0{
    background: var(--primary) !important;
    border-color: var(--primary) !important;
}

/* Login page (bootstrap) */
body.bg-img{
    background-position: center;
    background-size: cover;
}
.logoMove{
    border: 1px solid rgba(255,255,255,.28) !important;
    box-shadow: 0 20px 60px rgba(0,0,0,.35);
    backdrop-filter: blur(6px);
}
.loginscreen .form-control{
    border-radius: 10px;
}

/* Homepage colorful gradient cards with watermark */
.home-gradient-card{
    position: relative;
    overflow: hidden;
    border: 0;
    box-shadow: 0 12px 26px rgba(37, 99, 235, .25);
    color: #fff;
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
}
.home-gradient-card::before{
    content: "";
    position: absolute;
    right: -22px;
    bottom: -26px;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    background: rgba(255,255,255,.14);
}
.home-gradient-card::after{
    content: var(--brand-watermark);
    position: absolute;
    right: 10px;
    top: 8px;
    font-size: 26px;
    font-weight: 700;
    letter-spacing: 2px;
    color: rgba(255,255,255,.16);
    pointer-events: none;
}
.home-gradient-card .layui-card-header,
.home-gradient-card .layui-card-body,
.home-gradient-card .layui-icon,
.home-gradient-card .money-label{
    color: #fff !important;
}
.home-gradient-card .layui-card-header{
    border-bottom: 1px solid rgba(255,255,255,.25);
}
.home-gradient-card .money-label{
    text-shadow: 0 1px 2px rgba(0,0,0,.16);
}
.layui-row .layui-col-md4:nth-child(4n+1) > .home-gradient-card{
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
}
.layui-row .layui-col-md4:nth-child(4n+2) > .home-gradient-card{
    background: linear-gradient(135deg, #0ea5e9, #0369a1);
}
.layui-row .layui-col-md4:nth-child(4n+3) > .home-gradient-card{
    background: linear-gradient(135deg, #14b8a6, #0f766e);
}
.layui-row .layui-col-md4:nth-child(4n) > .home-gradient-card{
    background: linear-gradient(135deg, #7c3aed, #5b21b6);
}
/* Compatible with other grid widths (e.g. layui-col-md3 on homepage) */
.layui-row > [class*="layui-col-"]:nth-child(4n+1) > .home-gradient-card{
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
}
.layui-row > [class*="layui-col-"]:nth-child(4n+2) > .home-gradient-card{
    background: linear-gradient(135deg, #0ea5e9, #0369a1);
}
.layui-row > [class*="layui-col-"]:nth-child(4n+3) > .home-gradient-card{
    background: linear-gradient(135deg, #14b8a6, #0f766e);
}
.layui-row > [class*="layui-col-"]:nth-child(4n) > .home-gradient-card{
    background: linear-gradient(135deg, #7c3aed, #5b21b6);
}

/* DWZ toolbars (all) gradient + repeated watermark */
.pageContent .panelBar ul.toolBar{
    position: relative !important;
    z-index: 1;
    /* panelBar has default padding: 0 10px; compensate so the gradient reaches edges */
    width: calc(100% + 20px) !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    flex: 1 1 auto !important;
    /* Keep right edge visually flush; add breathing room only on the left */
    padding-left: 10px !important;
    padding-right: 0 !important;
    margin: 0 -10px !important;
    /* right-to-left fill */
    background: linear-gradient(270deg,
        rgba(37, 99, 235, .42) 0%,
        rgba(37, 99, 235, .22) 38%,
        rgba(37, 99, 235, .10) 68%,
        rgba(37, 99, 235, 0) 100%) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: 0 10px 24px rgba(37, 99, 235, .16);
}
.pageContent .panelBar ul.toolBar::before{
    /* Repeated watermark in a single pseudo-element */
    content: var(--brand-watermark) "   " var(--brand-watermark) "   " var(--brand-watermark) "   " var(--brand-watermark) "\A"
             var(--brand-watermark) "   " var(--brand-watermark) "   " var(--brand-watermark) "   " var(--brand-watermark);
    position: absolute;
    top: -18px;
    left: auto;
    right: -56px;
    transform: rotate(-12deg);
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 4px;
    color: rgba(255, 255, 255, .20);
    opacity: .95;
    text-shadow: 0 8px 22px rgba(37, 99, 235, .18), 0 2px 10px rgba(0,0,0,.22);
    pointer-events: none;
    z-index: 0;
    white-space: pre;
}
.pageContent .panelBar ul.toolBar::after{
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(270deg, rgba(37, 99, 235, .30), rgba(37, 99, 235, 0));
    opacity: 1;
    z-index: 0;
    pointer-events: none;
}
.pageContent .panelBar ul.toolBar li,
.pageContent .panelBar ul.toolBar a{
    position: relative !important;
    z-index: 1 !important;
    float: none !important;
}

/* Toolbar action buttons: solid primary (same as proxyByHandList) */
.pageContent .panelBar ul.toolBar a,
.pageContent .panelBar ul.toolBar li.hover a{
    background-color: var(--primary) !important;
    background-image: none !important;
    border-color: var(--primary) !important;
}
.pageContent .panelBar ul.toolBar a:hover,
.pageContent .panelBar ul.toolBar li.hover a:hover{
    background-color: var(--primary-600) !important;
    border-color: var(--primary-600) !important;
}

/* ProxyByHandList toolbar gradient + watermark (precise selector) */
#proxyByHandToolBar{
    position: relative !important;
    z-index: 1;
    /* panelBar has default padding: 0 10px; compensate so the gradient reaches edges */
    width: calc(100% + 20px) !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    /* Keep right edge visually flush; add breathing room only on the left */
    padding-left: 10px !important;
    padding-right: 0 !important;
    margin: 0 -10px !important;
    /* right-to-left fill */
    background: linear-gradient(270deg,
        rgba(37, 99, 235, .42) 0%,
        rgba(37, 99, 235, .22) 38%,
        rgba(37, 99, 235, .10) 68%,
        rgba(37, 99, 235, 0) 100%) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: 0 10px 24px rgba(37, 99, 235, .16);
}
#proxyByHandToolBar::before{
    /* Repeated watermark in a single pseudo-element */
    content: var(--brand-watermark) "   " var(--brand-watermark) "   " var(--brand-watermark) "   " var(--brand-watermark) "\A"
             var(--brand-watermark) "   " var(--brand-watermark) "   " var(--brand-watermark) "   " var(--brand-watermark);
    position: absolute;
    top: -18px;
    left: auto;
    right: -56px;
    transform: rotate(-12deg);
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 4px;
    color: rgba(255, 255, 255, .20);
    opacity: .95;
    text-shadow: 0 8px 22px rgba(37, 99, 235, .18), 0 2px 10px rgba(0,0,0,.22);
    pointer-events: none;
    z-index: 0;
    white-space: pre;
}
#proxyByHandToolBar::after{
    content: "";
    position: absolute;
    inset: 0;
    /* Shadow/gradient layer anchored on the right side */
    background: linear-gradient(270deg, rgba(37, 99, 235, .30), rgba(37, 99, 235, 0));
    opacity: 1;
    z-index: 0;
    pointer-events: none;
}
#proxyByHandToolBar li,
#proxyByHandToolBar a{
    position: relative !important;
    z-index: 1 !important;
    float: none !important;
}

#proxyByHandToolBar li{
    display: inline-flex !important;
    align-items: center !important;
    padding: 0 !important;
    height: 100% !important;
}

#proxyByHandToolBar a{
    height: 38px !important;
    line-height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ProxyByHandList: solid primary toolbar buttons */
#proxyByHandToolBar a,
#proxyByHandToolBar li.hover a,
#proxyByHandToolBar li a{
    background-color: var(--primary) !important;
    background-image: none !important;
    border-color: var(--primary) !important;
}

#proxyByHandToolBar a:hover,
#proxyByHandToolBar li.hover a:hover{
    background-color: var(--primary-600) !important;
    border-color: var(--primary-600) !important;
}

/* ========== Form controls: select / input polish + dropdown stacking ========== */
/* Keep pageHeader above grid/panel so Layui/native dropdowns are not covered */
.page > .pageHeader,
div.pageHeader{
    position: relative !important;
    z-index: 200 !important;
    overflow: visible !important;
}
.page > .pageContent,
div.pageContent{
    position: relative;
    z-index: 1;
}
.pageHeader .searchBar,
.pageHeader .layui-form,
.pageHeader .layui-form-item{
    overflow: visible !important;
}

.layui-form-select{
    position: relative;
    z-index: 10;
}
.layui-form-selected,
.layui-form-selectup{
    z-index: 9999 !important;
}
.layui-form-select dl{
    z-index: 10000 !important;
    margin-top: 4px !important;
    padding: 6px 0 !important;
    border: 1px solid rgba(37, 99, 235, .16) !important;
    border-radius: 10px !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .14) !important;
    max-height: 280px !important;
    background: #fff !important;
}
.layui-form-select dl dd{
    margin: 0 6px !important;
    padding: 8px 12px !important;
    line-height: 22px !important;
    border-radius: 8px !important;
    color: #1f2937 !important;
}
.layui-form-select .layui-edge{
    border-width: 6px !important;
    border-top-color: #64748b !important;
    margin-top: -3px !important;
    right: 12px !important;
}
.layui-form-select .layui-input,
.pageHeader .layui-input,
.searchBar .layui-input{
    height: 38px !important;
    line-height: 38px !important;
    border: 1px solid rgba(17, 24, 39, .14) !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #111827 !important;
    padding: 0 34px 0 12px !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.layui-form-select .layui-input:hover,
.pageHeader .layui-input:hover,
.searchBar .layui-input:hover{
    border-color: rgba(37, 99, 235, .45) !important;
}
.layui-form-select .layui-input:focus,
.pageHeader .layui-input:focus,
.searchBar .layui-input:focus{
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .15) !important;
}
.pageHeader .layui-input-inline,
.searchBar .layui-input-inline{
    margin-right: 10px !important;
    margin-bottom: 8px !important;
    width: 180px !important;
}
.pageHeader .layui-form-item,
.searchBar .layui-form-item{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
}

/* Native selects (DWZ searchBar / dialog forms) */
.searchBar select,
.pageFormContent select,
.pageHeader select{
    height: 34px !important;
    min-width: 140px;
    max-width: 100%;
    padding: 0 28px 0 10px !important;
    border: 1px solid rgba(17, 24, 39, .14) !important;
    border-radius: 10px !important;
    background-color: #fff !important;
    background-image: linear-gradient(45deg, transparent 50%, #64748b 50%),
        linear-gradient(135deg, #64748b 50%, transparent 50%) !important;
    background-position: calc(100% - 14px) calc(50% - 3px), calc(100% - 8px) calc(50% - 3px) !important;
    background-size: 6px 6px, 6px 6px !important;
    background-repeat: no-repeat !important;
    color: #111827 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
    transition: border-color .15s ease, box-shadow .15s ease;
    vertical-align: middle;
}
.searchBar select:hover,
.pageFormContent select:hover,
.pageHeader select:hover{
    border-color: rgba(37, 99, 235, .45) !important;
}
.searchBar select:focus,
.pageFormContent select:focus,
.pageHeader select:focus{
    outline: none !important;
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .15) !important;
}
.searchBar input[type="text"],
.pageFormContent input[type="text"],
.pageFormContent input[type="password"],
.pageHeader input[type="text"]{
    height: 34px !important;
    line-height: 34px !important;
    padding: 0 10px !important;
    border: 1px solid rgba(17, 24, 39, .14) !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #111827 !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.searchBar input[type="text"]:focus,
.pageFormContent input[type="text"]:focus,
.pageFormContent input[type="password"]:focus,
.pageHeader input[type="text"]:focus{
    outline: none !important;
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .15) !important;
}

/* Query button in Layui filter row */
.pageHeader .layui-input-inline .buttonActive,
.pageHeader .layui-input-inline .buttonContent,
.pageHeader .layui-input-inline button{
    height: 38px !important;
    line-height: 38px !important;
}
.pageHeader .layui-input-inline .buttonActive{
    border-radius: 10px !important;
    overflow: hidden;
}
.pageHeader .layui-input-inline button{
    min-width: 72px;
    padding: 0 16px !important;
    border: 0 !important;
    background: var(--primary) !important;
    color: #fff !important;
    border-radius: 10px !important;
    cursor: pointer;
}
.pageHeader .layui-input-inline button:hover{
    background: var(--primary-600) !important;
}