/* ============================================================================
   清远管业 · 前台门户 / 登录页 换肤      v1.0   2026-10-13
   ----------------------------------------------------------------------------
   注入方式 : crm app 的 hooks.py -> web_include_css
   物理位置 : apps/crm/crm/public/css/qykj_web.css
   访问路径 : /assets/crm/css/qykj_web.css
   覆盖范围 : 登录页(/login)、门户首页(/)、以及一切走 website web 模板的页面
   影响面   : 纯 CSS，不改模板/逻辑。
   回滚     : hooks.py 里去掉 web_include_css 一行 → 重启 web → clear-cache。
   ============================================================================ */

:root {
  --qykj-blue: #2563eb;
  --qykj-blue-d: #1d4ed8;
  --qykj-ink: #161b26;
  --qykj-sub: #667085;
  --qykj-line: #e6eaf1;
}

body {
  color: var(--qykj-ink);
  -webkit-font-smoothing: antialiased;
}

/* ---------- 登录页 ---------- */
body:has(.page-card), body.login-page, body[data-path="login"] { }
[data-path="login"] body, body.login-page { }

/* 背景：淡蓝渐变 + 细网格 */
body:not(.no-login-bg) {
  background-color: #f4f6fa;
}
body:has(.login-content) {
  background:
    radial-gradient(1100px 520px at 12% -10%, #e8f0ff 0%, rgba(232, 240, 255, 0) 62%),
    radial-gradient(900px 460px at 88% 8%, #eef4ff 0%, rgba(238, 244, 255, 0) 60%),
    #f4f6fa;
}

.page-card {
  border: 1px solid var(--qykj-line) !important;
  border-radius: 16px !important;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 22px 48px -26px rgba(16, 24, 40, .30) !important;
  padding: 34px 34px 28px !important;
  background: #fff !important;
}
.page-card-head {
  border-bottom: none !important;
  padding-bottom: 4px !important;
}
.page-card-head .app-logo {
  max-height: 46px !important;
  max-width: 210px !important;
  width: auto !important;
  height: auto !important;
  margin: 0 auto 6px;
  display: block;
}
.page-card-head h4 { font-size: 17px !important; font-weight: 600 !important; letter-spacing: -.2px; }
.page-card-body { padding: 10px 0 2px !important; }
.page-card-actions { margin-top: 6px; }

/* 输入框：白底 + 细描边 */
.page-card .form-control,
.page-card input.form-control {
  background: #fff !important;
  border: 1px solid var(--qykj-line) !important;
  border-radius: 10px !important;
  height: 42px !important;
  font-size: 14px !important;
  color: var(--qykj-ink) !important;
  box-shadow: none !important;
  transition: border-color .15s, box-shadow .15s;
}
.page-card .form-control:focus {
  border-color: var(--qykj-blue) !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .14) !important;
}
.page-card .field-icon { color: #98a2b3 !important; opacity: .9; }
.page-card .toggle-password { color: var(--qykj-blue) !important; font-size: 12.5px; }
.page-card .forgot-password-message a,
.page-card a { color: var(--qykj-blue) !important; }

/* 主按钮：品牌蓝 */
.page-card .btn-primary,
.btn-primary {
  background: var(--qykj-blue) !important;
  border-color: var(--qykj-blue) !important;
  color: #fff !important;
}
.page-card .btn-login {
  height: 42px !important;
  border-radius: 10px !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  letter-spacing: .5px;
  box-shadow: 0 2px 6px rgba(37, 99, 235, .30) !important;
}
.page-card .btn-primary:hover, .btn-primary:hover { background: var(--qykj-blue-d) !important; border-color: var(--qykj-blue-d) !important; }
.btn-default, .btn-secondary {
  border-radius: 10px !important;
  border: 1px solid var(--qykj-line) !important;
  background: #fff !important;
  color: #344054 !important;
}
.btn-default:hover { border-color: #c7dbfd !important; color: var(--qykj-blue) !important; }
.login-divider { color: #98a2b3 !important; font-size: 12px !important; }
.sign-up-message, .text-muted { color: var(--qykj-sub) !important; }
.page-card .btn { border-radius: 10px !important; }

/* ---------- 门户 / 网站通用 ---------- */
.navbar {
  background: #fff !important;
  border-bottom: 1px solid var(--qykj-line) !important;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04) !important;
  min-height: 56px;
}
.navbar .navbar-brand img, .navbar-brand img.app-logo {
  max-height: 26px !important;
  width: auto !important;
}
.navbar .nav-link { color: #344054 !important; font-size: 14px; }
.navbar .nav-link:hover { color: var(--qykj-blue) !important; }
.web-footer {
  border-top: 1px solid var(--qykj-line) !important;
  background: #fff !important;
  color: var(--qykj-sub) !important;
}
a { color: var(--qykj-blue); }
a:hover { color: var(--qykj-blue-d); }
h1, h2, h3, h4, h5 { letter-spacing: -.3px; color: var(--qykj-ink); }
.btn { border-radius: 10px !important; }
.form-control { background: #fff !important; border-radius: 10px !important; border: 1px solid var(--qykj-line) !important; }
.form-control:focus { border-color: var(--qykj-blue) !important; box-shadow: 0 0 0 3px rgba(37, 99, 235, .13) !important; }
::selection { background: rgba(37, 99, 235, .18); }
