/* Shared visual theme. Keep Layui navigation, table sizing and event hooks intact. */
:root {
  --zw-primary: #16836e;
  --zw-primary-dark: #116451;
  --zw-primary-light: #eaf5f0;
  --zw-deep: #193b42;
  --zw-bg: #f3f6f8;
  --zw-border: #e3e9ed;
  --zw-text: #283e48;
  --zw-text-weak: #75858f;
  --zw-shadow: 0 4px 20px rgba(24, 48, 63, .045);
}
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Microsoft YaHei', sans-serif;
  color: var(--zw-text);
  background-color: var(--zw-bg);
  -webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font-family: inherit; }
::selection { background: #d6eee3; color: #153e34; }
a, button, input, select, textarea { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 2px solid #16836e;
  outline-offset: 3px;
}

/* Frame geometry stays compatible with the existing menu-collapse script. */
body.layui-layout-body .layui-layout-admin > .layui-header {
  background: #fff !important;
  border-bottom: 1px solid var(--zw-border);
  box-shadow: none;
}
body.layui-layout-body .layui-layout-admin .layui-logo {
  background: #15323b !important;
  color: #fff !important;
  border-right: 0;
  font-size: 14px;
  font-weight: 650;
  letter-spacing: 0;
}
body.layui-layout-body .layui-header .layui-nav > .layui-nav-item > a,
body.layui-layout-body .layui-header .layuimini-tool-left .icon-color {
  color: #526973 !important;
}
body.layui-layout-body .layui-header .layui-nav > .layui-nav-item > a:hover {
  color: var(--zw-primary) !important;
  background: #f1f7f4 !important;
}
.layui-header .zw-header-user { gap: 9px; font-weight: 600; }
.layui-header .zw-header-user .zw-avatar {
  width: 30px; height: 30px;
  background: #e4f2eb;
  color: #17634e;
  border-radius: 10px;
}
body.layui-layout-body #mainmenu { background: #15323b !important; }
body.layui-layout-body #mainmenu .layui-nav { background: transparent !important; }
body.layui-layout-body #mainmenu .layui-nav-child { background: rgba(0, 0, 0, .1) !important; }
body.layui-layout-body #mainmenu .layui-nav-item > a { color: #d5e3e6 !important; }
body.layui-layout-body #mainmenu .layui-nav-child a { color: #a9c1c6 !important; }
body.layui-layout-body #mainmenu a { transition: background .15s, color .15s; }
body.layui-layout-body #mainmenu a:hover { background: rgba(255, 255, 255, .06) !important; color: #fff !important; }
body.layui-layout-body #mainmenu .layui-this > a {
  background: #216554 !important;
  color: #fff !important;
  box-shadow: inset 3px 0 #80d2b1;
}
body.layui-layout-body #mainmenu .layui-nav-bar { background: #80d2b1; }
body.layui-layout-body .layui-body { background: var(--zw-bg); }
.layui-body > .layui-tab > .layui-tab-title {
  background: #fff;
  border-bottom-color: var(--zw-border);
}
.layui-body > .layui-tab > .layui-tab-title li {
  font-size: 13px;
  color: #687c86;
  border-right-color: #eef2f4;
  transition: color .15s, background .15s;
}
.layui-body > .layui-tab > .layui-tab-title li.layui-this {
  background: #edf7f2 !important;
  color: #147256 !important;
  border-top-color: #16836e;
}
.layui-body > .layui-tab > .layui-tab-title li:hover { background: #f6f9f8; }
body.layui-layout-body .closeBox { background: #f8fafb !important; border-color: #e7ecef; }

/* Lists and edit forms share the same surface, controls and semantic colors. */
.table_div, .user_table_div, .operation, .operation_user, .bzj-panel {
  border-color: var(--zw-border);
  border-radius: 14px;
  box-shadow: var(--zw-shadow);
}
.table_div { padding: 22px; }
.table_div #searchParam, .user_table_div #searchParam, .bzj-panel .bzj-search {
  background: #f7f9fa;
  border: 1px solid #e8edef;
  border-radius: 10px;
  padding: 16px;
}
.table_div #searchParam .layui-form-item { gap: 12px; }
.layui-input, .layui-textarea, .layui-form-select .layui-input {
  border-color: #dce5e9;
  border-radius: 7px;
  background-color: #fff;
  transition: border-color .15s, box-shadow .15s;
}
.layui-input::placeholder, .layui-textarea::placeholder { color: #96a3aa; }
.layui-input:hover, .layui-textarea:hover { border-color: #b5c8ca !important; }
.layui-input:focus, .layui-textarea:focus {
  border-color: #16836e !important;
  box-shadow: 0 0 0 3px rgba(22, 131, 110, .09);
}
.layui-form-select dl {
  border-color: var(--zw-border);
  border-radius: 9px;
  box-shadow: 0 8px 28px rgba(25, 59, 66, .1);
}
.layui-form-select dl dd.layui-this { background: var(--zw-primary); }
.layui-form-checkbox[lay-skin=primary] > i { border-radius: 4px; }
.layui-form-switch { border-radius: 20px; }
.layui-btn {
  border-radius: 7px;
  font-weight: 500;
  box-shadow: none;
  transition: background .15s, border-color .15s, box-shadow .15s;
}
.layui-btn-primary { border-color: #d8e3e7; color: #536e78; }
.layui-btn-primary:hover { border-color: #16836e; color: #147256; background: #f6fbf8; }
.layui-btn-danger { background-color: #d95656 !important; }
.layui-btn-warm { background-color: #ba7c25 !important; }
.layui-btn-normal { background-color: #377eaa !important; }
.layui-btn-disabled, .layui-btn-disabled:hover { background-color: #f5f6f7 !important; color: #abb5bb !important; }
.layui-btn-xs { padding: 0 9px; border-radius: 5px; }
.layui-form-radio > i:hover, .layui-form-radioed > i { color: var(--zw-primary); }
.layui-form-onswitch, .layui-form-checked[lay-skin=primary] > i { background-color: var(--zw-primary); border-color: var(--zw-primary); }
.operation > .panel-heading, .operation_user > .panel-heading {
  background: #f7faf9;
  color: #214a44;
  border-bottom: 1px solid var(--zw-border);
  padding: 16px 20px;
  font-weight: 600;
}
.layui-table-view { border-color: var(--zw-border); border-radius: 10px; }
.table_div .layui-table-view, .user_table_div .layui-table-view { overflow: visible; }
.layui-table-view .layui-table-header,
.layui-table-view .layui-table-header .layui-table,
.layui-table-view .layui-table-header th {
  background: #f2f6f7;
  color: #516973;
  border-color: #e5ecef;
}
.layui-table-view .layui-table-header .layui-table-cell { font-weight: 600; }
.layui-table-cell { font-size: 13px; }
.layui-table td, .layui-table th { border-color: #e7edef; }
.layui-table-view .layui-table-body tr:hover,
.bzj-panel .bzj-table tbody tr:hover { background: #f0f8f4 !important; }
.layui-table-view .layui-table-tool { background: #fff; border-bottom-color: #e7edef; }
.layui-table-view .layui-table-page { background: #fff; border-top-color: #e7edef; }
.layui-laypage a, .layui-laypage span { border-color: #e3e9ed; border-radius: 5px; }
.layui-laypage .layui-laypage-curr .layui-laypage-em { background-color: var(--zw-primary); border-radius: 5px; }
.layui-layer { border-radius: 12px !important; box-shadow: 0 18px 60px rgba(23, 51, 62, .16) !important; }
.layui-layer .layui-layer-title { border-radius: 12px 12px 0 0; background: #f5f8f9; color: #2f4b58; }
.layui-layer .layui-layer-btn .layui-layer-btn0 { border-color: var(--zw-primary); background: var(--zw-primary); border-radius: 6px; }

/* Existing device workspace and home shortcuts retain their data and events. */
.bzj-wrap, .device-workspace { background: #f3f6f8; }
.bzj-panel .bzj-panel-title { font-size: 21px; color: #243d47; letter-spacing: -.4px; }
.bzj-panel .bzj-panel-sub { line-height: 1.8; color: #7b8b94; }
.bzj-panel .bzj-table-wrap { border-color: #e3e9ed; border-radius: 10px; }
.bzj-panel .bzj-table thead th { background: #f2f6f7; color: #526e78; }
.zw-home.zw-home { background: #f3f6f8; gap: 20px; }
.zw-home .zw-hero {
  background: #fff;
  border: 1px solid #e3e9ed;
  border-left: 5px solid #16836e;
  color: #263e48;
  box-shadow: var(--zw-shadow);
  border-radius: 14px;
  padding: 30px;
}
.zw-home .zw-hero h1 { color: #23443d; font-size: 24px; letter-spacing: -.4px; }
.zw-home .zw-hero p { color: #7a8b94; }
.zw-home .zw-hero .zw-hero-time { color: #53786c; background: #f0f7f3; padding: 14px 20px; border-radius: 10px; }
.zw-home .zw-hero .zw-hero-time .date { font-size: 24px; letter-spacing: -.5px; }
.zw-home .zw-quick-title { margin: 3px 0 0; font-size: 16px; color: #3c5660; }
.zw-home .zw-quick { gap: 16px; }
.zw-home .zw-quick-item { padding: 23px; border-color: #e3e9ed; box-shadow: var(--zw-shadow); }
.zw-home .zw-quick-item:hover { border-color: #8cbaa8; transform: translateY(-2px); box-shadow: 0 8px 24px rgba(24, 84, 61, .08); }
.zw-home .zw-quick-item .qi-icon { display: inline-flex; padding: 10px; background: #edf7f2; border-radius: 10px; margin-bottom: 16px; }
.zw-home .zw-quick-item .qi-desc { line-height: 1.8; margin-top: 7px; }

body.login-page { background: radial-gradient(ellipse at 25% 15%, #e3f0e8, transparent 60%), #f2f6f4; }
body.login-page::after { background-image: none; }
.login-page .zw-login-logo { background: #1d6a50; border-color: #1d6a50; box-shadow: 0 8px 20px rgba(29, 106, 80, .12); border-radius: 16px; }
.login-page .zw-login-title { color: #254e40; text-shadow: none; letter-spacing: .5px; }
.login-page .zw-login-sub { color: #8a9c93; font-size: 10px; letter-spacing: 1.4px; }
.login-page .login-form { border: 1px solid #e0e9e3; background: #fff; box-shadow: 0 16px 55px rgba(31, 74, 53, .08); border-radius: 16px; padding: 30px 28px 22px; }
.login-page .zw-login-foot { color: #93a299; }
.login-page .login-form .layui-input { border-color: #e1e8e4; background: #f9fbfa; }
.login-page .admin-login-background { width: min(400px, calc(100% - 32px)); }

@media (max-width: 760px) {
  .table_div { padding: 14px; }
  .zw-home.zw-home { padding: 16px; }
  .zw-home .zw-hero { padding: 22px; }
  .zw-home .zw-hero h1 { font-size: 20px; }
  .zw-home .zw-hero .zw-hero-time { width: 100%; box-sizing: border-box; text-align: left; }
  .zw-home .zw-quick { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}