/* ============================================================
   base.css —— 全站共享层（第 1 层）
   放「所有页面都可能用到」的东西：色板变量、以及今后新增的通用件。
   ------------------------------------------------------------
   ⚠️ 这里**没有**老页的 `* { box-sizing: border-box }` reset ——
      新页（外壳 / 账号 / 客户 / 操作记录 / 活动模块）是 content-box，
      那套 reset 一旦放进来就会整体改变它们的盒模型、布局全变样。
      老页的 reset 在 legacy.css 顶部，只发给 admin / db / 登录 / 找回。
   ⚠️ 色板变量只在这里定义，别处不要另立一份。
      不在色板里的业务色（警示黄 / 错误红 / 表头深底 …）写在各自的页面样式表里。
   ============================================================ */

:root {
  --brand-1: #f0f4f9;
  --brand-2: #9ec3ff;
  --brand-3: #3984fe;
  --brand-4: #0050d0;
  --brand-5: #01296a; /* --brand-4 的悬停档（.btn.primary:hover），白字 9.19:1 */
  --brand-grad: linear-gradient(135deg, var(--brand-2) 0%, var(--brand-3) 100%);
  /* 三级文字色。白底对比度 13.0 / 7.5 / 3.2。改值前先算对比度。 */
  --black: #2b2b2b;
  --soft-black: #464646;
  --dark-grey: #909090;
  --medium-grey: #b6b6b6;
  --grey: #e9e9e9;
  --soft-grey:  #F5F7FA;
  --white: #ffffff;
  --green: #00ba4e;
  --red: #ef0000;
  --radius: 8px;
  /* 全站字体栈。⚠️ generic 族（sans-serif）必须放最后：
     CSS 字体匹配命中第一个 generic 即停，排它之后的字体永远轮不到。 */
  --font-stack: system-ui, "PingFang SC", Arial, "Microsoft YaHei", SimSun,
    sans-serif;
}

body {
  font-family: var(--font-stack);
}

/* ── 全局「筛选/搜索中」过渡遮罩（2026-11-03）──
 * 所有带数据表的页面共用：在容器上盖一层半透明遮罩 + spinner + 文案，
 * 表明「正在筛选/搜索/查询中」，用于区分前后状态（本地筛选毫秒级，需最短可见时长）。
 * 与活动模块 DataTable 的 .dt-loading-overlay 观感一致（spinner 同源 .dt-spin）。
 * 由 js/common.js 的 showTableBusy / hideTableBusy 操作。
 * ⚠️ 容器需是定位元素（函数内部会临时设 position:relative）；老页面请传「表格的父容器」，
 *    不要直接传 <table>（表格元素不能含 <div> 子节点）。 */
.table-busy {
  position: absolute;
  inset: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;   /* 纯白空白背景（与活动模块统一：不做半透明遮罩） */
  color: var(--dark-grey, #555);
  font-size: 0.88rem;
  pointer-events: none;
}
.table-busy-spin {
  display: inline-block;
  width: 14px; height: 14px;
  margin-right: 8px;
  vertical-align: -2px;
  border: 2px solid rgba(128, 128, 128, 0.25);
  border-top-color: var(--brand-4, #4a90d9);
  border-radius: 50%;
  animation: table-busy-kf 0.8s linear infinite;
}
@keyframes table-busy-kf { to { transform: rotate(360deg); } }

/* ── 全站统一：搜索框 + 贴身「搜索」按钮（2026-11-10）──
 * 范本 = 活动管理页。输入框与按钮粘成一条：左输入框、右蓝色按钮。
 * 点按钮 / 回车 = 立刻按当前关键词搜一次（自动搜卡住时的兜底），
 * 各页自己的 input 事件继续负责自动搜，两条路径互不干扰。
 * ⚠️ 每个页面都加载本文件，所以这里是 .tb-search-wrap / .tb-search-btn 的唯一定义处；
 *    activity.css 只保留「wrap 内的 .tb-search 取消 300px 限宽」那一条局部覆盖。 */
.tb-search-wrap {
  display: inline-flex;
  align-items: stretch;
  flex: 1 1 200px;
  min-width: 140px;
  max-width: 320px;
}
/* body 前缀用于压过各页面样式表里同特异性的 input 规则，保证左半边圆角统一。 */
body .tb-search-wrap > input[type="search"],
body .tb-search-wrap > input[type="text"] {
  flex: 1 1 auto;
  min-width: 0;
  border-radius: 8px 0 0 8px;
}
.tb-search-btn {
  flex: 0 0 auto;
  margin-left: -1.5px;
  border: 1.5px solid var(--brand-4);
  border-left: 0;
  border-radius: 0 8px 8px 0;
  background: var(--brand-4);
  color: #fff;
  font-family: inherit;
  font-size: 0.86rem;
  padding: 0 14px;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s, border-color 0.15s;
}
.tb-search-btn:hover { background: var(--brand-5); border-color: var(--brand-5); }
.tb-search-btn:active { transform: translateY(1px); }
/* 弹窗 / 窄栏里的搜索框：按钮收窄，别把候选列表挤没 */
.tb-search-btn.sm { padding: 0 10px; font-size: 0.78rem; }