/* 崇矩崇访 · 全站 UI/UX 一致性层
   仅统一视觉、导航上下文与响应式行为；不改业务数据与流程。 */
:root {
  --ui-shell-narrow: 520px;
  --ui-shell-wide: 1180px;
  --ui-page-pad: clamp(14px, 2.5vw, 28px);
  --ui-control-h: 44px;
  --ui-card-radius: 16px;
  --ui-control-radius: 10px;
  --ui-border: #dfe5ec;
  --ui-border-strong: #cbd5e1;
  --ui-surface: #ffffff;
  --ui-surface-soft: #f7f9fc;
  --ui-ink: #0c2340;
  --ui-muted: #64748b;
  --ui-focus: 0 0 0 3px rgba(201, 162, 39, .2);
  --ui-card-shadow: 0 1px 2px rgba(12, 35, 64, .04), 0 8px 24px rgba(12, 35, 64, .06);
}

html { scroll-behavior: smooth; }
body.ui-consistent {
  font-family: var(--font-sans, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif);
  background-color: var(--bg, #f3f5f8);
  color: var(--text, var(--ui-ink));
}
body.ui-consistent :focus-visible {
  outline: 2px solid var(--brand-gold, #c9a227);
  outline-offset: 2px;
}

/* 页面宽度：业务员端保持手机友好，管理端获得稳定桌面宽度。 */
body.ui-sales-page :is(.page, .home-shell, .crm-add-shell, .coach-page, .disability-shell, .result-shell),
body.ui-login-page :is(.page, .login-shell) {
  width: min(100%, var(--ui-shell-narrow));
  margin-inline: auto;
}
body.ui-admin-page :is(.home-shell, .admin-shell, .hub-shell, .ledger-shell, .followup-shell) {
  width: min(calc(100% - 2 * var(--ui-page-pad)), var(--ui-shell-wide));
  max-width: var(--ui-shell-wide);
  margin-inline: auto;
}

/* 二三级页面位置上下文。 */
.ui-breadcrumbs {
  display: flex;
  align-items: center;
  min-height: 40px;
  gap: 7px;
  margin: 0 0 12px;
  padding: 8px 2px;
  color: var(--ui-muted);
  font-size: .78rem;
  line-height: 1.3;
  overflow-x: auto;
  scrollbar-width: none;
}
.ui-breadcrumbs::-webkit-scrollbar { display: none; }
.ui-breadcrumbs a {
  color: var(--brand-navy-light, #1a3a5c);
  text-decoration: none;
  font-weight: 700;
  white-space: nowrap;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  border-radius: 8px;
  padding: 0 5px;
}
.ui-breadcrumbs a:hover { background: rgba(12, 35, 64, .06); }
.ui-breadcrumbs .ui-crumb-sep { color: #a3adba; }
.ui-breadcrumbs [aria-current="page"] {
  color: var(--ui-ink);
  font-weight: 700;
  white-space: nowrap;
}
.ui-breadcrumbs .ui-back-link {
  margin-right: 4px;
  padding-inline: 8px;
  background: var(--ui-surface);
  border: 1px solid var(--ui-border);
  box-shadow: 0 1px 2px rgba(12, 35, 64, .04);
}

/* 标题、卡片、列表区块。 */
body.ui-consistent :is(.card, .panel, .section-card, .crm-section, .followup-panel, .ledger-panel, .admin-card) {
  border-radius: var(--ui-card-radius);
  border-color: var(--ui-border);
  box-shadow: var(--ui-card-shadow);
}
body.ui-consistent :is(h1, .page-title, .crm-add-title strong, .hub-header strong) {
  letter-spacing: -.015em;
  text-wrap: balance;
}
body.ui-consistent :is(.sub-header, .page-heading, .section-heading) p {
  color: var(--ui-muted);
  max-width: 72ch;
}

/* 按钮与可点击入口统一触控尺寸。 */
body.ui-consistent button,
body.ui-consistent [role="button"],
body.ui-consistent .btn,
body.ui-consistent a.btn {
  font-family: inherit;
  min-height: var(--ui-control-h);
  border-radius: var(--ui-control-radius);
  touch-action: manipulation;
}
body.ui-consistent :is(.btn-primary, button.btn-primary) {
  background: var(--brand-navy, #0c2340);
  color: #fff;
  border: 1px solid transparent;
  box-shadow: 0 2px 8px rgba(12, 35, 64, .16);
}
body.ui-consistent :is(.btn-primary, button.btn-primary):hover:not(:disabled) {
  background: var(--brand-navy-light, #1a3a5c);
}
body.ui-consistent :is(.btn-secondary, .btn-outline, .btn-text) {
  color: var(--brand-navy, #0c2340);
}
body.ui-consistent button:disabled,
body.ui-consistent [aria-disabled="true"] {
  cursor: not-allowed;
  opacity: .55;
}

/* 表单控件：高度、边框、焦点和错误态。 */
body.ui-consistent :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  width: 100%;
  min-height: var(--ui-control-h);
  padding: 10px 12px;
  font: inherit;
  color: var(--ui-ink);
  background: var(--ui-surface);
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-control-radius);
  transition: border-color .15s ease, box-shadow .15s ease;
}
body.ui-consistent textarea { min-height: 92px; resize: vertical; }
body.ui-consistent :is(input, select, textarea):focus {
  border-color: var(--brand-gold, #c9a227);
  box-shadow: var(--ui-focus);
  outline: none;
}
body.ui-consistent :is(input, textarea)::placeholder { color: #94a3b8; }
body.ui-consistent label { color: var(--ui-ink); }
body.ui-consistent :is(.form-group, .field, .filter-field) { min-width: 0; }

/* 搜索与筛选栏。 */
body.ui-consistent :is(.search-bar, .filter-bar, .filters, .followup-filters, .ledger-filters) {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 1px 2px rgba(12, 35, 64, .04);
}

/* 表格统一，可在窄屏横向滚动。 */
body.ui-consistent table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: var(--ui-surface);
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  overflow: hidden;
  font-size: .86rem;
}
body.ui-consistent thead th {
  background: #eef2f7;
  color: var(--ui-ink);
  font-size: .76rem;
  font-weight: 800;
  text-align: left;
  white-space: nowrap;
}
body.ui-consistent :is(th, td) { padding: 11px 12px; border-bottom: 1px solid #edf1f5; }
body.ui-consistent tbody tr:last-child td { border-bottom: 0; }
body.ui-consistent tbody tr:hover { background: #f8fafc; }

/* 标签与状态色保持克制、语义稳定。 */
body.ui-consistent :is(.tag, .badge, .status, [class*="status-"]) {
  border-radius: 999px;
  font-weight: 700;
}
/* 协作任务卡片带 status- 状态类，不能套成胶囊，否则高卡片会露出大圆。 */
body.ui-consistent .followup-task-card {
  border-radius: 14px;
}
body.ui-consistent :is(.status-success, .tag-success, .is-done) { color: #166534; background: #ecfdf3; }
body.ui-consistent :is(.status-warning, .tag-warning, .is-pending) { color: #92400e; background: #fffbeb; }
body.ui-consistent :is(.status-danger, .tag-danger, .is-overdue, .error) { color: #991b1b; background: #fef2f2; }

/* 弹窗、分页、空/加载/错误状态。 */
body.ui-consistent :is(dialog, .modal, [role="dialog"]) {
  border-radius: 18px;
  border: 1px solid var(--ui-border);
  box-shadow: 0 24px 70px rgba(12, 35, 64, .24);
}
body.ui-consistent :is(.modal-content, .dialog-content) { border-radius: 18px; }
body.ui-consistent :is(.pagination, .pager) { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
body.ui-consistent :is(.empty-tip, .empty-state, .loading, .error-state) {
  padding: 28px 18px;
  text-align: center;
  color: var(--ui-muted);
  background: var(--ui-surface-soft);
  border: 1px dashed var(--ui-border-strong);
  border-radius: 14px;
}
.ui-loading-dot {
  display: inline-block; width: 8px; height: 8px; margin-right: 7px;
  border-radius: 50%; background: var(--brand-gold, #c9a227);
  animation: ui-pulse 1.1s ease-in-out infinite;
}
@keyframes ui-pulse { 50% { opacity: .35; transform: scale(.8); } }

/* 旧返回控件统一为明确的按钮形态。 */
body.ui-consistent :is(.crm-add-back, .hub-back-btn, .back, .back-light, .coach-back, .brand-topbar-back) {
  min-width: 40px;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  text-decoration: none;
}

/* 移动端：单列、底部安全区、避免按钮过小。 */
@media (max-width: 720px) {
  :root { --ui-page-pad: 14px; }
  body.ui-consistent :is(.home-shell, .admin-shell, .hub-shell, .ledger-shell, .followup-shell) {
    width: 100%;
    max-width: 100%;
  }
  body.ui-consistent :is(.home-main, .followup-main, .ledger-main, .admin-main, .crm-add-shell) {
    padding-inline: 14px;
  }
  body.ui-consistent :is(.grid, .stats-grid, .form-grid, .crm-row-2, .detail-grid) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  body.ui-consistent :is(.actions, .form-actions, .modal-actions, .toolbar-actions) {
    flex-wrap: wrap;
  }
  body.ui-consistent :is(.actions, .form-actions, .modal-actions) > button,
  body.ui-consistent :is(.actions, .form-actions, .modal-actions) > .btn { flex: 1 1 140px; }
  .ui-breadcrumbs { margin-inline: 0; }
  body.ui-consistent .ui-table-scroll table { min-width: 620px; }
  body.ui-consistent :is(.table-wrap, .table-scroll, .data-table-wrap) {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

@media print {
  .ui-breadcrumbs { display: none !important; }
  body.ui-consistent { background: #fff; }
}