/* 霖信莼壳系统 — 设计系统（附件D 视觉规范落地 + 反模板化精修）
   唯一允许的主题定制入口：--bs-primary 覆盖 + :root 品牌变量 + 壳内自绘动效。
   本文件在 Bootstrap 5.3 之上叠加统一视觉层：字号节奏 / 卡片语言 / 按钮 / 表格 / 表单 / 留白 / 克制动效。
   约束（design-taste-frontend）：等保二级=信任优先 → 动效克制、单强调色、形状与配色锁定。 */

:root {
  /* 品牌色（附件D§1，锁定不变） */
  --cx-navy-900: #0D2550;
  --cx-navy-700: #1A3A6B;
  --cx-navy-500: #2E5490;
  --cx-gold-400: #D4B860;
  --cx-gold-200: #EDDFAC;
  /* 语义色（对齐 Bootstrap 5.3） */
  --cx-success: #198754;
  --cx-warning: #FFC107;
  --cx-danger:  #DC3545;
  --cx-info:    #0DCAF0;
  /* 中性面（冷调灰，统一一套，禁止暖灰/冷灰混用） */
  --cx-bg:      #F4F6FA;
  --cx-surface: #FFFFFF;
  --cx-border:  #E5EAF2;
  --cx-border-strong: #D2DAE6;
  --cx-ink:     #1B2536;
  --cx-muted:   #5C6B82;
  --cx-primary-soft: #EEF2F9;
  /* 形状锁：全站统一圆角尺度（卡片12 / 控件8 / 胶囊可点） */
  --cx-radius-card: 14px;
  --cx-radius-ctrl: 10px;
  --cx-radius-pill: 999px;
  /* 阴影：按背景色染海军蓝，禁止纯黑投影 */
  --cx-shadow-sm: 0 1px 2px rgba(13, 37, 80, .05);
  --cx-shadow-md: 0 6px 20px rgba(13, 37, 80, .07);
  --cx-shadow-lg: 0 14px 40px rgba(13, 37, 80, .12);
  /* Bootstrap 变量覆盖（唯一入口） */
  --bs-primary: #1A3A6B;
  --bs-primary-rgb: 26, 58, 107;
  --bs-link-color: #2E5490;
  --bs-link-hover-color: #1A3A6B;
  --bs-body-bg: var(--cx-bg);
  --bs-body-color: var(--cx-ink);
  --bs-border-color: var(--cx-border);
}

html { -webkit-text-size-adjust: 100%; }

body {
  background: var(--cx-bg);
  color: var(--cx-ink);
  font-family: "Segoe UI", system-ui, -apple-system, "PingFang SC",
    "Microsoft YaHei", "Hiragino Sans GB", "Noto Sans SC", sans-serif;
  font-size: 14.5px;
  line-height: 1.65;
  letter-spacing: .1px;
  -webkit-font-smoothing: antialiased;
}

/* ---------- 排版节奏 ---------- */
h1, h2, h3, h4, h5, h6 { color: var(--cx-ink); font-weight: 650; letter-spacing: -.1px; }
.cx-h-page { font-size: 1.5rem; font-weight: 700; margin: 0; }
.cx-sub { color: var(--cx-muted); font-size: .9rem; margin: 0; }
.text-secondary { color: var(--cx-muted) !important; }

/* 页面统一抬头（标题 + 副标题 + 右侧操作槽） */
.cx-page-head {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap; margin-bottom: 1.25rem;
  padding-bottom: .85rem; border-bottom: 1px solid var(--cx-border);
}
.cx-page-head .cx-title-wrap { display: flex; align-items: center; gap: .6rem; }
.cx-page-head .cx-title-ico {
  width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center;
  background: var(--cx-primary-soft); color: var(--cx-navy-500); font-size: 1.15rem;
}

/* ---------- 顶部导航（附件D§4：56px navy-900 底白字，加底线与留白） ---------- */
.cx-topnav {
  height: 56px; background: var(--cx-navy-900); color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  box-shadow: 0 1px 0 rgba(13, 37, 80, .25);
}
.cx-topnav .navbar-brand { font-weight: 700; letter-spacing: .3px; font-size: 1.02rem; }
.cx-topnav .navbar-brand i { color: var(--cx-gold-400); }
.cx-topnav .badge {
  background: var(--cx-gold-400); color: var(--cx-navy-900); font-weight: 600;
}

/* ---------- 卡片语言（统一圆角 + 细边 + 染蓝柔影） ---------- */
.card {
  border: 1px solid var(--cx-border);
  border-radius: var(--cx-radius-card);
  background: var(--cx-surface);
  box-shadow: var(--cx-shadow-sm);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.card-header, .card-footer { background: var(--cx-surface); }
.cx-card-hover:hover {
  transform: translateY(-4px);
  box-shadow: var(--cx-shadow-lg);
  border-color: var(--cx-border-strong);
}

/* 数字展示（配额余量，附件D§2：tabular-nums 2rem/700） */
.cx-num {
  font-variant-numeric: tabular-nums;
  font-size: 2rem; font-weight: 700; color: var(--cx-gold-400); line-height: 1.1;
}
.cx-num.cx-warn { color: var(--cx-warning); }

/* ---------- 按钮（统一圆角 + 平滑过渡 + 海军蓝主色） ---------- */
.btn {
  border-radius: var(--cx-radius-ctrl);
  font-weight: 500; padding: .5rem 1rem;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .12s ease;
}
.btn:active { transform: translateY(1px); }
.btn-primary {
  background: var(--cx-navy-700); border-color: var(--cx-navy-700); color: #fff;
}
.btn-primary:hover { background: var(--cx-navy-900); border-color: var(--cx-navy-900); color: #fff; box-shadow: var(--cx-shadow-md); }
.btn-primary:focus-visible { box-shadow: 0 0 0 .2rem rgba(46, 84, 144, .35); }
.btn-outline-primary { color: var(--cx-navy-500); border-color: var(--cx-border-strong); }
.btn-outline-primary:hover { background: var(--cx-primary-soft); color: var(--cx-navy-700); border-color: var(--cx-navy-500); }
.btn-outline-light { border-color: rgba(255,255,255,.35); }
.btn-outline-light:hover { background: rgba(255,255,255,.12); color: #fff; }
.btn-warning { background: var(--cx-gold-400); border-color: var(--cx-gold-400); color: var(--cx-navy-900); font-weight: 600; }
.btn-warning:hover { background: #c9ab4f; border-color: #c9ab4f; color: var(--cx-navy-900); }

/* ---------- 表格（清爽表头 + 行悬停） ---------- */
.table { --bs-table-bg: var(--cx-surface); margin-bottom: 0; }
.table > :not(caption) > * > * { padding: .7rem .85rem; vertical-align: middle; }
.table thead th {
  background: var(--cx-primary-soft); color: var(--cx-navy-700);
  font-weight: 600; font-size: .82rem; border-bottom: 1px solid var(--cx-border-strong);
  white-space: nowrap;
}
.table tbody tr { transition: background-color .12s ease; }
.table tbody tr:hover { background: #F7F9FC; }
.table-bordered { border-color: var(--cx-border); }
.table-bordered > :not(caption) > * > * { border-color: var(--cx-border); }

/* ---------- 表单控件（海军蓝聚焦环） ---------- */
.form-control, .form-select {
  border-radius: var(--cx-radius-ctrl); border-color: var(--cx-border-strong);
  padding: .5rem .75rem; transition: border-color .15s ease, box-shadow .15s ease;
}
.form-control:focus, .form-select:focus {
  border-color: var(--cx-navy-500);
  box-shadow: 0 0 0 .2rem rgba(46, 84, 144, .15);
  background: #fff;
}
.form-label { font-weight: 500; color: var(--cx-ink); margin-bottom: .35rem; }

/* ---------- 徽章 ---------- */
.badge { font-weight: 500; letter-spacing: .2px; }
.badge.bg-primary { background: var(--cx-navy-700) !important; }

/* ---------- 弹窗 ---------- */
.modal-content { border: 1px solid var(--cx-border); border-radius: var(--cx-radius-card); box-shadow: var(--cx-shadow-lg); }
.modal-header { border-bottom: 1px solid var(--cx-border); }
.modal-footer { border-top: 1px solid var(--cx-border); }

/* ---------- 提示条 ---------- */
.alert { border-radius: var(--cx-radius-ctrl); border: 1px solid transparent; }
.alert-warning { background: #FCF6E3; border-color: #F0E2B0; color: #7A5E10; }
.alert-danger  { background: #FCEBEC; border-color: #F4C7CB; color: #8E2630; }
.alert-info    { background: #E9F4FB; border-color: #C9E3F2; color: #1F5C7A; }
.alert-success { background: #E9F6EE; border-color: #C5E8D2; color: #1C6B3C; }

/* ---------- 页脚 ---------- */
footer { color: var(--cx-muted); border-top: 1px solid var(--cx-border); background: var(--cx-surface); }

/* ---------- 登录/注册 左色块（附件D§6：navy-900 + 金色装饰线 + 品牌徽标） ---------- */
.cx-login-hero {
  min-height: 100vh; background: var(--cx-navy-900); color: #fff;
  background-image:
    radial-gradient(120% 80% at 0% 0%, rgba(46, 84, 144, .55) 0%, transparent 55%),
    radial-gradient(120% 90% at 100% 100%, rgba(212, 184, 96, .18) 0%, transparent 50%);
}
.cx-login-hero .cx-gold-line { width: 64px; height: 3px; background: var(--cx-gold-400); border-radius: 2px; }
.cx-login-hero .cx-brand-mark {
  width: 56px; height: 56px; border-radius: 14px; display: grid; place-items: center;
  background: rgba(255,255,255,.08); border: 1px solid rgba(212,184,96,.5);
  color: var(--cx-gold-400); font-size: 1.6rem; margin-bottom: 1.25rem;
}
.cx-auth-card { border-radius: var(--cx-radius-card); box-shadow: var(--cx-shadow-lg); border: 1px solid var(--cx-border); }

/* ---------- iframe 入口页：32px 金色加载条（附件D§6 唯一自绘动效） ---------- */
.cx-loadbar {
  height: 32px;
  background: linear-gradient(90deg, var(--cx-gold-400), var(--cx-gold-200), var(--cx-gold-400));
  background-size: 200% 100%;
  animation: cx-slide 1.2s linear infinite;
  transition: opacity .5s ease;
}
@keyframes cx-slide { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.cx-loadbar.cx-done { opacity: 0; }
.cx-frame-wrap iframe { width: 100%; height: calc(100vh - 32px); border: 0; display: block; background: #fff; }

/* ---------- 克制入场动效（信任优先：仅一次、位移小、可降级） ---------- */
@keyframes cx-rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.cx-rise { animation: cx-rise .42s cubic-bezier(.22,.61,.36,1) both; }
.cx-rise-1 { animation-delay: .04s; } .cx-rise-2 { animation-delay: .10s; }
.cx-rise-3 { animation-delay: .16s; } .cx-rise-4 { animation-delay: .22s; }
@media (prefers-reduced-motion: reduce) {
  .cx-rise, .cx-loadbar { animation: none !important; }
  .card, .btn, .table tbody tr { transition: none !important; }
}