:root {
  --weather-primary: #1687d9;
  --weather-primary-dark: #0867b2;
  --weather-sky: #66c8f2;
  --weather-ice: #eaf7ff;
  --weather-bg: #f3f8fc;
  --weather-surface: #ffffff;
  --weather-text: #17324d;
  --weather-muted: #6f8498;
  --weather-border: #dceaf4;
  --weather-shadow: 0 8px 28px rgba(36, 112, 162, .10);
}

html, body { color: var(--weather-text); }
body.gray-bg, body { background: var(--weather-bg); }
a { color: var(--weather-primary); }
a:hover, a:focus { color: var(--weather-primary-dark); }

/* Main shell */
.navbar-static-side { background: #fff; border-right: 1px solid var(--weather-border); }
.navbar-default .nav > li > a { color: #526d82; font-weight: 500; }
.navbar-default .nav > li > a:hover,
.navbar-default .nav > li > a:focus { background: #edf8ff; color: var(--weather-primary); }
.navbar-default .nav > li.active > a,
.navbar-default .nav > li.selected > a { background: linear-gradient(90deg, #e1f3ff, #f7fcff); color: #0876c9; border-left: 3px solid var(--weather-primary); }
.nav-second-level, .nav-third-level, .nav-four-level { background: #fbfdff; }
.navbar-static-side .logo { height: 92px; padding: 0; overflow: hidden; background: #fff !important; border-bottom: 1px solid var(--weather-border); list-style: none; }
.weather-brand-logo-frame { display: flex; align-items: center; justify-content: center; width: 100%; height: 91px; overflow: hidden; background: #fff; }
.weather-brand-logo { display: block; width: 100%; height: 100%; object-fit: contain; transform: scale(1.3); mix-blend-mode: multiply; }
.navbar-static-top { background: linear-gradient(100deg, #0878c9 0%, #25a7e6 62%, #70d2f2 100%) !important; box-shadow: 0 4px 18px rgba(12, 112, 177, .18); }
.navbar-static-top .navbar-minimalize, .navbar-static-top .nav > li > a { color: #fff !important; }
.content-tabs { height: 42px; border-bottom: 1px solid var(--weather-border); background: #fff; box-shadow: 0 3px 12px rgba(50, 100, 135, .05); }
.content-tabs .page-tabs a { color: #667d91; }
.content-tabs .page-tabs a.active { background: #eaf7ff; color: #0879ca; border-bottom: 2px solid var(--weather-primary); }
.content-tabs .roll-nav { color: #668095; border-color: var(--weather-border); }
.footer { border-color: var(--weather-border); background: #fff; color: var(--weather-muted); }

/* Shared business surfaces */
.wrapper-content { padding: 18px; }
.ibox, .panel, .well, .search-collapse, .select-table { border: 0; border-radius: 12px; box-shadow: var(--weather-shadow); background: var(--weather-surface); }
.ibox-title { min-height: 48px; padding: 15px 18px 10px; border: 0; border-bottom: 1px solid #edf3f7; border-radius: 12px 12px 0 0; }
.ibox-title h5 { color: var(--weather-text); font-weight: 600; }
.ibox-content { border: 0; border-radius: 0 0 12px 12px; }
.search-collapse { margin-bottom: 14px; border-left: 3px solid #65c3ef; }
.form-control, .select2-container--bootstrap .select2-selection { border-color: #cedfea; border-radius: 7px; box-shadow: none; }
.form-control:focus { border-color: #59b9eb; box-shadow: 0 0 0 3px rgba(32, 157, 222, .12); }
.btn { border-radius: 7px; transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.btn:hover { transform: translateY(-1px); }
.btn-primary, .btn-success { border-color: var(--weather-primary); background: linear-gradient(135deg, #168bdc, #0872c2); }
.btn-primary:hover, .btn-success:hover { border-color: #0867b2; box-shadow: 0 5px 14px rgba(18, 126, 199, .23); }
.btn-info { border-color: #48b6e7; background: #48b6e7; }
.fixed-table-container { border-color: var(--weather-border); border-radius: 9px; }
.bootstrap-table .table > thead > tr > th { background: #f0f8fd; color: #395a73; border-color: #dceaf4; }
.bootstrap-table .table > tbody > tr:hover { background: #f3faff; }
.pagination > .active > a, .pagination > .active > span { background: var(--weather-primary); border-color: var(--weather-primary); }
.label-primary, .badge-primary { background: var(--weather-primary); }
.layer-ext-moon .layui-layer-title { background: linear-gradient(90deg, #f0f9ff, #fff) !important; color: var(--weather-text) !important; border-color: var(--weather-border) !important; }

/* Login */
body.signin.weather-signin { display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 20px; background: linear-gradient(135deg, #eaf8ff 0%, #77cef0 48%, #0878c9 100%); position: relative; overflow: auto; }
.weather-signin:before, .weather-signin:after { content: ""; position: fixed; border-radius: 50%; background: rgba(255,255,255,.22); filter: blur(1px); }
.weather-signin:before { width: 520px; height: 220px; top: -80px; right: 8%; }
.weather-signin:after { width: 620px; height: 260px; bottom: -140px; left: -80px; }
.weather-signin .signinpanel { position: relative; z-index: 1; width: min(980px, 100%); margin: auto; }
.weather-signin .signinpanel .row { display: flex; align-items: stretch; overflow: hidden; border-radius: 22px; background: rgba(255,255,255,.96); box-shadow: 0 24px 70px rgba(4, 74, 124, .25); }
.weather-signin .brand-side { padding: 42px 44px; background: linear-gradient(160deg, #f6fcff, #e3f5ff); }
.weather-signin .login-side { padding: 46px 44px; background: #fff; }
.weather-signin .signin-info, .weather-signin .signin-info h4, .weather-signin .signin-info li { color: var(--weather-text); }
.weather-login-logo { width: 100%; max-width: 460px; height: 185px; object-fit: contain; mix-blend-mode: multiply; }
.weather-signin .platform-name { margin: 20px 0 8px; color: #0c3d69; font-size: 27px; font-weight: 700; }
.weather-signin .platform-subtitle { color: #5d7d94; letter-spacing: 2px; }
.weather-signin #signupForm h3 { margin: 0 0 7px; color: #153956; font-weight: 700; }
.weather-signin #signupForm .login-hint { margin-bottom: 26px; color: var(--weather-muted); }
.weather-signin #signupForm .form-control { height: 44px; margin-bottom: 15px; background-color: #f8fbfd; }
.weather-signin .weather-captcha-row { display: flex; align-items: stretch; gap: 10px; width: 100%; margin: 0 0 15px; }
.weather-signin .weather-captcha-input, .weather-signin .weather-captcha-image { flex: 1 1 0; min-width: 0; height: 44px; }
.weather-signin .weather-captcha-row .form-control { width: 100%; height: 44px; margin: 0; }
.weather-signin .weather-captcha-image a { display: block; width: 100%; height: 44px; overflow: hidden; border: 1px solid #cedfea; border-radius: 7px; background: #f8fbfd; }
.weather-signin .weather-captcha-image .imgcode { display: block; width: 100% !important; height: 42px; margin: 0; border: 0; border-radius: 6px; object-fit: cover; }
.weather-signin .checkbox-custom label { color: #5f7689; }
.weather-signin #btnSubmit { height: 44px; margin-top: 12px; font-size: 15px; }
.weather-signin .signup-footer { position: absolute; top: calc(100% + 18px); left: 0; right: 0; margin: 0; color: rgba(255,255,255,.9); border: 0; text-align: center; }
.weather-signin .signup-footer .pull-left { float: none !important; }

/* Dashboard */
.weather-dashboard { padding: 20px; }
.weather-hero { position: relative; overflow: hidden; min-height: 190px; padding: 34px 38px; border-radius: 18px; color: #fff; background: linear-gradient(115deg, #076ebd, #24a7e5 58%, #7ad5f2); box-shadow: 0 16px 36px rgba(18, 122, 191, .22); }
.weather-hero:before, .weather-hero:after { content: ""; position: absolute; border-radius: 50%; background: rgba(255,255,255,.13); }
.weather-hero:before { width: 330px; height: 150px; right: 6%; top: -35px; }
.weather-hero:after { width: 420px; height: 170px; right: -6%; bottom: -90px; }
.weather-hero h1 { margin: 0 0 12px; font-size: 30px; font-weight: 700; }
.weather-hero p { max-width: 650px; margin: 0; color: rgba(255,255,255,.88); font-size: 15px; line-height: 1.8; }
.weather-hero-logo { position: absolute; z-index: 1; right: 34px; top: 24px; width: 270px; height: 140px; object-fit: contain; border-radius: 12px; opacity: .96; mix-blend-mode: screen; }
.weather-metric { min-height: 126px; margin-top: 18px; padding: 22px; border-radius: 14px; background: #fff; box-shadow: var(--weather-shadow); transition: transform .18s ease, box-shadow .18s ease; }
.weather-metric:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(36,112,162,.14); }
.weather-metric-icon { float: left; width: 52px; height: 52px; margin-right: 16px; border-radius: 15px; color: #0879ca; background: #e5f5ff; text-align: center; line-height: 52px; font-size: 22px; }
.weather-metric h3 { margin: 2px 0 7px; font-size: 17px; font-weight: 600; }
.weather-metric p { color: var(--weather-muted); line-height: 1.6; }
.weather-section { margin-top: 18px; padding: 24px; border-radius: 14px; background: #fff; box-shadow: var(--weather-shadow); }
.weather-section h2 { margin: 0 0 18px; font-size: 18px; font-weight: 650; }
.weather-shortcut { display: block; min-height: 88px; padding: 16px; border: 1px solid var(--weather-border); border-radius: 11px; color: var(--weather-text); background: #fbfdff; }
.weather-shortcut:hover { color: var(--weather-primary); border-color: #8bd0f1; background: #f0f9ff; text-decoration: none; transform: translateY(-2px); }
.weather-shortcut i { margin-right: 9px; color: var(--weather-primary); font-size: 20px; }
.weather-shortcut small { display: block; margin: 8px 0 0 31px; color: var(--weather-muted); }

@media (max-width: 767px) {

  body.signin.weather-signin { align-items: flex-start; }
  .weather-signin .signinpanel .row { display: block; }
  .weather-signin .brand-side { padding: 22px; }
  .weather-signin .login-side { padding: 28px 24px; }
  .weather-login-logo { height: 120px; }
  .weather-hero-logo { display: none; }
  .weather-hero { padding: 26px; }
}
@media (max-height: 700px) {
  body.signin.weather-signin { align-items: flex-start; }
  .weather-signin .signinpanel { margin: 20px auto 54px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *:before, *:after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
