/* ===================================================================
   style.css — 康普森牧场管理系统 设计系统
   目标：将 530 个内联 style 减少到 100 个以内
   =================================================================== */

/* ===========================
   1. 复用工具类
   =========================== */

/* ----- 间距 ----- */
.px-2 { padding:6px 8px; }          /* 约28处高频 */
.py-2 { padding:6px 0; }
.p-2 { padding:6px; }
.p-4 { padding:4px; }
.p-8 { padding:8px; }
.p-10 { padding:10px; }
.p-12 { padding:12px; }
.p-14 { padding:14px; }
.p-40 { padding:40px; }
.pb-8 { padding-bottom:8px; }
.p-2x4 { padding:2px 4px; }
.p-4x6 { padding:4px 6px; }
.p-10-0 { padding:10px 0; }

.mt-2 { margin-top:8px; }           /* 约9处高频 */
.mb-2 { margin-bottom:8px; }        /* 约6处高频 */
.mt-5 { margin-top:5px; }
.mr-5 { margin-right:5px; }
.mb-5 { margin-bottom:5px; }
.ml-5 { margin-left:5px; }
.mt-8 { margin-top:8px; }
.mb-8 { margin-bottom:8px; }
.mt-10 { margin-top:10px; }
.mb-10 { margin-bottom:10px; }
.mr-6 { margin-right:6px; }
.ml-16 { margin-left:16px; }
.m-0 { margin:0; }
.m-auto { margin:0 auto; }

/* ----- 尺寸 ------ */
.w-full { width:100%; }
.w-95p { width:95%; }
.w-60 { width:60px; }
.w-80 { width:80px; }
.w-90 { width:90px; }
.w-100 { width:100px; }
.w-110 { width:110px; }
.w-120 { width:120px; }
.w-140 { width:140px; }
.w-160 { width:160px; }
.w-240 { width:240px; }
.w-10 { width:10%; }
.w-14 { width:14%; }
.minw-100 { min-width:100px; }
.minw-120 { min-width:120px; }
.maxw-320 { max-width:320px; }
.maxw-800 { max-width:800px; margin:0 auto; }

/* ----- 字体/颜色 ----- */
.t-muted { color:var(--t2); }       /* 约23处高频 */
.c-t2 { color:var(--t2); }
.c-t3 { color:var(--t3); }
.c-green { color:#2e7d32; }
.c-red { color:#d93025; }
.c-blue { color:var(--p); }
.c-amber { color:#e37400; }
.c-white { color:#fff; }
.c-green2 { color:var(--green); }
.c-red2 { color:var(--red); }
.c-orange { color:var(--orange); }

.fs-9 { font-size:9px; }
.fs-10 { font-size:10px; }
.fs-11 { font-size:11px; }
.fs-12 { font-size:12px; }
.fs-13 { font-size:13px; }
.fs-14 { font-size:14px; }
.fs-22 { font-size:22px; }
.fw-400 { font-weight:400; }
.fw-500 { font-weight:500; }
.fw-600 { font-weight:600; }
.fw-700 { font-weight:700; }

.ws-nowrap { white-space:nowrap; }
.ws-pre-wrap { white-space:pre-wrap; }

/* ===== 统一表格对齐规则（应用层全局，老大定：所有表格对齐方式一致，新增/删除表格同样适用） =====
   作用：①卡片内宽表自动横向滚动防窄屏压缩错位 ②表头永不换行 ③数据单元格默认不换行 ④长文本列优先省略号不撑爆 */
.layui-card table { border-collapse:collapse; }
.layui-card .tbl-wrap { overflow-x:auto; width:100%; -webkit-overflow-scrolling:touch; }
.layui-card .tbl-wrap table { min-width:100%; }
.layui-card table thead th { white-space:nowrap; }
.layui-card table td { white-space:nowrap; }
.layui-card table td[style*="max-width"] { white-space:nowrap; }
.layui-card table td.ws-pre-wrap, .layui-card table td[style*="pre-wrap"] { white-space:pre-wrap; }

/* ----- 对齐/布局 ----- */
.td-center { text-align:center; }
.td-right { text-align:right; }
.td-left { text-align:left; }
.flex-center { display:flex; align-items:center; }
.flex-end { display:flex; align-items:end; }
.flex-between { display:flex; justify-content:space-between; align-items:center; }
.flex-gap { display:flex; gap:10px; flex-wrap:wrap; align-items:end; }
.flex-gap-8 { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.flex-1 { flex:1; }
.gap-fw { display:flex; flex-wrap:wrap; gap:8px; }

/* ----- 边框 ----- */
.bb-border { border:1px solid var(--bd); border-radius:4px; }
.bb-b2 { border-bottom:1px solid var(--b2); }
.bb-var { border-bottom:1px solid var(--bd); }
.bb2-d0d7de { border-bottom:2px solid #d0d7de; }
.bl-2px-p { border-left:2px solid var(--p); }

/* ----- 标签/描述文本 ----- */
.label-sm { font-size:11px; color:var(--t2); display:block; margin-bottom:3px; }
.label-md { font-size:12px; color:var(--t2); display:block; margin-bottom:4px; }
.label-sm-inline { font-size:11px; color:var(--t2); margin-top:4px; }
.helper-text { font-size:11px; color:var(--t2); padding-left:16px; }
.helper-text-sm { font-size:11px; color:var(--t2); padding-left:16px; }

/* ----- 隐藏实用类 ----- */
.dn { display:none; }

/* ===========================
   2. 登录页 (由 #login_page 处理)
   =========================== */

/* ===========================
   3. 导航栏
   =========================== */
.nv { position:fixed; left:0; top:0; bottom:0; width:180px; background:var(--c); border-right:1px solid var(--bd); padding:10px; overflow-y:auto; z-index:100; }
.nv-title { font-weight:700; font-size:14px; color:var(--p); padding:10px 0 14px; text-align:center; }
.nv-sub { display:none; padding-left:12px; }
.nv-sub.sho { display:block; }

.ni { cursor:pointer; padding:8px 14px; border-radius:6px; transition:background .15s, color .15s; display:flex; align-items:center; gap:6px; }
.ni:hover { background:var(--ca); }
.ni.act { background:linear-gradient(135deg,var(--p),#1a4a7a); color:#fff; box-shadow:0 2px 6px rgba(26,115,232,.3); }

/* ===========================
   4. 卡片
   =========================== */
.cd { background:var(--c); border:1px solid var(--bd); border-radius:var(--radius); padding:18px; margin-bottom:12px; box-shadow:0 1px 3px rgba(0,0,0,.04); }
.cd-p0 { background:var(--c); border:1px solid var(--bd); border-radius:var(--radius); margin-bottom:12px; box-shadow:0 1px 3px rgba(0,0,0,.04); padding:0; overflow:hidden; }
.card-sm { background:var(--bg); border-radius:8px; padding:16px; }
.card-hov { background:#fff; border:1px solid var(--bd); border-radius:6px; padding:8px; cursor:pointer; transition:box-shadow .15s; }
.card-hov:hover { box-shadow:0 2px 8px rgba(0,0,0,.08); }

.dc { background:var(--c); border:1px solid var(--bd); border-radius:var(--radius); padding:14px; box-shadow:0 1px 3px rgba(0,0,0,.04); }
.dc-h { background:linear-gradient(135deg,var(--p),#1a4a7a); color:#fff; padding:8px 14px; display:flex; justify-content:space-between; align-items:center; font-size:12px; }

/* ===========================
   5. 表格
   =========================== */
.tb { width:100%; border-collapse:collapse; font-size:13px; }
.tb th, .tb td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--bd); }
.tb th { background:var(--ca); font-weight:600; color:var(--t2); font-size:12px; }
.tb tr:nth-child(even) { background:#f8f9fa; }
.tb tr:hover { background:#eef3fa; }

.tbl { width:100%; border-collapse:collapse; font-size:13px; }
.tbl th, .tbl td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--bd); }
.tbl th { background:var(--ca); font-weight:600; color:var(--t2); font-size:12px; }

/* 单元格内边距 */
.td-1 { padding:3px 8px; }

/* ===========================
   6. 按钮
   =========================== */
.btn { display:inline-flex; align-items:center; gap:4px; padding:8px 16px; border-radius:6px; font-size:13px; cursor:pointer; border:1px solid var(--bd); background:var(--c); transition:all .15s; font-family:inherit; }
.btn:hover { opacity:.85; }

/* 颜色 */
.btn-p { background:var(--p); color:#fff; border-color:var(--p); }
.btn-d { background:#d32f2f; color:#fff; border:none; padding:6px 14px; border-radius:4px; cursor:pointer; font-size:12px; display:inline-flex; align-items:center; gap:4px; transition:opacity .15s; }
.btn-d:hover { opacity:.85; }      /* 主色蓝 */
.btn-s { background:#f5f5f5; color:var(--t); }                          /* 次色灰 */
.btn-success { background:var(--green); color:#fff; border-color:var(--green); }  /* 成功绿 */
.btn-danger { background:var(--red); color:#fff; border-color:var(--red); }       /* 危险红 */
.btn-warn { background:#e37400; color:#fff; border-color:#e37400; }               /* 警告橙 */

/* 尺寸 */
.btn-sm { padding:3px 8px; font-size:10px; }
.btn-xs { padding:5px 12px; font-size:11px; }
.btnm { padding:5px 12px; font-size:11px; }
.btnl { padding:8px 16px; font-size:13px; }
.btnw { width:100%; }

/* 旧名称兼容 */
.bo { background:var(--p); color:#fff; border-color:var(--p); }
.b-sub { background:#f5f5f5; color:var(--t); }
.b-dng { background:var(--red); color:#fff; border-color:var(--red); }
.b-warn { background:#e37400; color:#fff; border-color:#e37400; }
.btns { padding:5px 12px; font-size:11px; }

/* ===========================
   7. 表单
   =========================== */
.inp { width:95%; padding:6px; border:1px solid var(--b2); border-radius:4px; font-size:12px; outline:none; transition:border-color .2s, box-shadow .15s; }
.inp:focus { border-color:var(--p); box-shadow:0 0 0 2px rgba(26,115,232,.15); }

.fi { border:1px solid var(--bd); border-radius:6px; padding:8px 10px; font-size:14px; outline:none; transition:border .2s; background:var(--c); }
.fi:focus { border-color:var(--p); box-shadow:0 0 0 2px rgba(26,115,232,.12); }

.lbl { font-size:11px; color:var(--t2); display:block; margin-bottom:4px; }

/* 输入框尺寸变体 */
.inp-sm { padding:5px 8px; font-size:11px; }
.inp-md { width:100%; padding:7px 10px; }
.inp-mds { width:100%; padding:6px 8px; }
.inp-ms { width:100%; padding:5px 8px; }
.inp-w60 { width:60px; padding:2px 4px; border:1px solid var(--bd); border-radius:3px; text-align:center; }
.inp-sh { width:36px; border:1px solid var(--bd); border-radius:3px; padding:2px; font-size:11px; text-align:center; }
.p-2x6 { padding:2px 6px; }

/* ===========================
   8. 弹窗 (modal)
   =========================== */
.mo { position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:9999; display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity .2s; }
.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:9999; display:flex; align-items:center; justify-content:center; }
.modal-box { background:#fff; border-radius:8px; padding:20px; min-width:400px; max-width:90vw; max-height:80vh; overflow-y:auto; box-shadow:0 8px 30px rgba(0,0,0,.15); }
.mo-s { opacity:1; }
.mb { background:var(--c); border-radius:var(--radius); padding:20px; max-width:500px; width:90%; max-height:80vh; overflow-y:auto; box-shadow:0 8px 30px rgba(0,0,0,.15); }
.mh { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; padding-bottom:10px; border-bottom:1px solid var(--bd); }
.mt { font-size:15px; font-weight:600; }
.mc { font-size:22px; cursor:pointer; color:var(--t2); line-height:1; }
.mc:hover { color:var(--t); }
.mm { font-size:13px; }

/* 旧名称兼容 */
.ov { position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:9999; display:flex; align-items:center; justify-content:center; }
.ovb { background:var(--c); border-radius:var(--radius); padding:20px; max-width:500px; width:90%; max-height:80vh; overflow-y:auto; box-shadow:0 8px 30px rgba(0,0,0,.15); }

/* ===========================
   9. 看板 (Dashboard)
   =========================== */
.dg { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:12px; margin-bottom:14px; }
@media (max-width:1024px) and (min-width:769px) { .dg { grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); } }
@media (max-width:768px) { .dg { grid-template-columns:1fr; } }

.dr { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (max-width:768px) { .dr { grid-template-columns:1fr; } }

.dash-grid { display:grid; grid-template-columns:1fr 1fr 1fr 1fr; gap:10px; margin-bottom:14px; }
@media (max-width:768px) { .dash-grid { grid-template-columns:1fr 1fr; } }

.dash-card { text-align:center; padding:14px 8px; }
.dash-icon { font-size:24px; }
.dash-num { font-size:36px; font-weight:700; color:var(--p); }
.dash-label { font-size:11px; color:var(--t2); margin-bottom:4px; }

.dv { font-size:18px; font-weight:700; color:var(--p); }
.dvl { font-size:11px; color:var(--t2); }
.dsg { display:grid; grid-template-columns:1fr 1fr 1fr; gap:6px; }
.dsb { background:var(--ca); border-radius:6px; padding:8px; text-align:center; }

/* 预警 */
.wi { display:flex; gap:8px; padding:6px 0; border-bottom:1px solid var(--ca); font-size:12px; }
.wi:last-child { border-bottom:none; }
.wi-icon { font-size:12px; width:18px; text-align:center; }
.wi-detail { font-size:10px; color:var(--t2); }

/* 今日事件 */
.te { display:flex; gap:8px; padding:5px 4px; font-size:12px; border-bottom:1px solid var(--ca); }
.te:last-child { border-bottom:none; }
.te-time { color:var(--t2); font-size:10px; white-space:nowrap; }

/* 快捷操作 */
.qs { display:flex; gap:8px; flex-wrap:wrap; }
.qa { background:var(--ca); border:1px solid var(--bd); border-radius:6px; padding:10px 14px; cursor:pointer; text-align:center; font-size:12px; transition:all .15s; flex:1; min-width:80px; }
.qa:hover { background:#e8f0fe; border-color:var(--p); }
.qa-icon { font-size:20px; display:block; margin-bottom:4px; }

/* ===========================
   10. 牛只管理
   =========================== */
.alert-red { color:var(--red); font-weight:600; }
.alert-yellow { color:#e37400; font-weight:600; }

.cl { display:flex; gap:12px; }
.cr { flex:1; min-width:0; display:flex; flex-direction:column; gap:10px; }
.sl { width:160px; flex-shrink:0; }
.si { display:flex; justify-content:space-between; padding:6px 10px; border-radius:5px; cursor:pointer; font-size:12px; transition:background .15s; }
.si:hover { background:var(--ca); }
.si.act { background:var(--p); color:#fff; }
.cn { background:var(--ca); border-radius:10px; padding:1px 7px; font-size:10px; color:var(--t2); }
.si.act .cn { background:rgba(255,255,255,.2); color:#fff; }

.cg { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:6px; }

.fb { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.flex-between { display:flex; justify-content:space-between; align-items:center; }

/* 批量录入 */
.card-sm { background:var(--bg); border-radius:8px; padding:16px; }
.batch-ta { width:100%; height:140px; padding:8px; border:1px solid var(--bd); border-radius:4px; font-size:11px; resize:vertical; }

/* ===========================
   11. 圈舍
   =========================== */
.shr td { padding:6px 8px; border-bottom:1px solid var(--bd); }
.shnm { width:90px; border:none; font-size:12px; padding:2px 4px; border-radius:3px; }
.shf { width:80px; border:none; font-size:12px; padding:2px 4px; border-radius:3px; }

/* ===========================
   12. 物资管理
   =========================== */
.sg { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:10px; margin-bottom:10px; }
.sb { background:var(--c); border:1px solid var(--bd); border-radius:8px; padding:12px; text-align:center; }
.sn { font-size:24px; font-weight:700; color:var(--p); }
.sl { font-size:11px; color:var(--t2); margin-top:4px; }

/* 物资表格标记 */
.tag { display:inline-block; padding:2px 8px; border-radius:4px; font-size:10px; margin:1px; }
.tg { background:#e6f4ea; color:#1e7e34; }
.ty { background:#fef7e0; color:#e37400; }
.tb { background:#e8f0fe; color:#1a73e8; }
.tp { background:#f3e8fd; color:#7b1fa2; }
.tr { background:#fce8e6; color:#d93025; }
.t-gray { background:#f0f0f0; color:#666; }

.cb { cursor:pointer; }

/* ===========================
   13. 专业账簿 (GL)
   =========================== */
.gl-card { background:#fff; border:1px solid var(--bd); border-radius:8px; margin-bottom:14px; overflow:hidden; }
.gl-card table { width:100%; border-collapse:collapse; font-size:11px; min-width:1000px; }

/* ===========================
   14. 响应式
   =========================== */
@media (max-width:768px) {
  .nv { width:100%; height:auto; position:relative; border-right:none; border-bottom:1px solid var(--bd); display:flex; overflow-x:auto; padding:6px; }
  .nv-title { display:none; }
  .ni { white-space:nowrap; padding:6px 10px; }
  .nv-sub { position:static; box-shadow:none; border:none; padding-left:12px; }
  #mp { margin-left:0 !important; padding:12px !important; }
  .cd { padding:12px; width:100%; box-sizing:border-box; }
  .card-sm, .dc, .dash-card, .sb, .dsb { width:100%; box-sizing:border-box; }
  .cl { flex-direction:column; }
  .sl { width:100%; display:flex; gap:4px; overflow-x:auto; padding-bottom:4px; }
  .dash-grid { grid-template-columns:1fr 1fr; }
  .cg { grid-template-columns:1fr; }
  .sg { grid-template-columns:1fr 1fr; }
  .modal-box { min-width:auto; width:95vw; }
  .fb { flex-direction:column; align-items:stretch; }
  .fi { width:100%; box-sizing:border-box; }
}

/* ===========================
   15. 斑马纹、hover 等
   =========================== */
.t tr:nth-child(even) { background:#fafbfc; }
.t tr:hover { background:#eef3fa; }
.t tr:first-child:hover { background:var(--ca); } /* 表头不变 */

/* ===========================
   16. 杂项旧兼容
   =========================== */
.sh { font-size:13px; font-weight:600; color:var(--t2); margin-bottom:12px; text-transform:uppercase; letter-spacing:.5px; }
.gr { color:var(--green); }
.rd { color:var(--red); }
.or { color:var(--orange); }
.fw6 { font-weight:600; }
.mt- { margin-top:8px; }
.mb- { margin-bottom:8px; }
.dc_chip { padding:3px 8px; border:1px solid var(--bd); border-radius:4px; font-size:10px; cursor:pointer; background:var(--ca); display:inline-block; margin:2px; }
.dc_chip:hover { background:#e8f0fe; }

/* Toast */
#toast { position:fixed; top:60px; left:50%; transform:translateX(-50%); padding:10px 20px; border-radius:6px; font-size:13px; z-index:9999; max-width:90%; box-shadow:0 2px 8px rgba(0,0,0,0.3); }

/* 杂项 */
.overflow-auto { overflow-x:auto; }
.minh-200 { min-height:200px; }
.minh-80 { min-height:80px; }
.pad-empty { padding:20px; text-align:center; color:var(--t2); font-size:13px; }
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.grid-3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; }
.grid-4 { display:grid; grid-template-columns:1fr 1fr 1fr 1fr; gap:10px; }
.grid-2-1 { display:grid; grid-template-columns:2fr 1fr; gap:10px; }
.grid-3-1 { display:grid; grid-template-columns:3fr 1fr; gap:10px; }
.inl-flex { display:inline-flex; align-items:center; gap:4px; }
.flex-wrap { flex-wrap:wrap; }
.c-link { color:var(--p); cursor:pointer; }
.c-link:hover { text-decoration:underline; }
.c-pointer { cursor:pointer; }
.p-relative { position:relative; }
.abs-right { position:absolute; right:8px; top:50%; transform:translateY(-50%); }
.lh-30 { line-height:30px; }
.lh-28 { line-height:28px; }
.bg-green-light { background:#e8f5e9; }
.bg-amber-light { background:#fff8e1; }
.bg-blue-light { background:#e3f2fd; }
.bg-red-light { background:#fce4ec; }
.bg-gray-light { background:#f5f5f5; }
.bdr-6 { border-radius:6px; }
.bdr-8 { border-radius:8px; }
.bdr-4 { border-radius:4px; }
.bd-b { border-bottom:1px solid var(--bd); }
.overflow-x { overflow-x:auto; }
.text-ellipsis { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.va-middle { vertical-align:middle; }
.fs-15 { font-size:15px; }
.fs-18 { font-size:18px; }
.bg-bg { background:var(--b); }
.bg-dark-blue { background:#1a237e; }
.bg-f0 { background:#f0f0f0; }

/* ===========================
   6. 动态样式 class 辅助
   =========================== */
.dn { display:none; }
.db { display:block; }
.dib { display:inline-block; }
.dfx { display:flex; }
.bg-selected { background:#e8f0fe; border-color:var(--a); color:var(--a); }
.hl { background:#f0f4f9 !important; }
.toast-error { position:fixed;top:60px;left:50%;transform:translateX(-50%);background:#d93025;color:#fff;padding:10px 20px;border-radius:6px;font-size:13px;z-index:9999;max-width:90%;box-shadow:0 2px 8px rgba(0,0,0,0.3); }
.toast-success { position:fixed;top:60px;left:50%;transform:translateX(-50%);background:#1e8e3e;color:#fff;padding:10px 20px;border-radius:6px;font-size:13px;z-index:9999;max-width:90%;box-shadow:0 2px 8px rgba(0,0,0,0.3); }

/* ===========================
   7. 遗漏补缺类
   =========================== */
.px-6x4 { padding:6px 4px; }
.bb-yellow { border-bottom:2px solid #ffca28; }
.bb-yellow-light { border-bottom:1px solid #fff9c4; }
.br-3 { border-radius:3px; }
.bg-none { background:none; }
.cp { cursor:pointer; }
.b-none { border:none; }
.b-red { border:1px solid #d93025; }
.bd-dashed { border:1px dashed; }
.bp { background:var(--p); color:#fff; border-color:var(--p); }
.br-4 { border-radius:4px; }
.br-6 { border-radius:6px; }
.flex-col { display:flex; flex-direction:column; }
.gap-2 { gap:2px; }
.gap-24 { gap:24px; }
.m-4 { margin:4px; }
.m-4-0 { margin:4px 0; }
.m-8-0 { margin:8px 0; }
.mb-4 { margin-bottom:4px; }
.ml-2 { margin-left:2px; }
.mr-2 { margin-right:2px; }
.p-0 { padding:0; }
.p-0-8-12 { padding:0 8px 12px; }
.p-2x8 { padding:2px 8px; }
.p-4-0 { padding:4px 0; }
.p-4x8 { padding:4px 8px; }
.p-8x12 { padding:8px 12px; }
.w-32 { width:32px; }
.minw-80 { min-width:80px; }
.maxw-600 { max-width:600px; }
.input-border { border:1px solid var(--b2); border-radius:4px; padding:6px; font-size:12px; }
.grid-col-span-2 { grid-column:1 / -1; }
.bg-p { background:var(--p); }
.op-07 { opacity:0.7; }
.op-08 { opacity:0.8; }
.op-09 { opacity:0.9; }
.bg-f6f8fa { background:#f6f8fa; }
.bg-white09 { background:rgba(255,255,255,0.9); }
.c-333 { color:#333; }
.gap-4 { gap:4px; }
.gap-6 { gap:6px; }
.gap-8 { gap:8px; }
.gap-12 { gap:12px; }
.mt-4 { margin-top:4px; }
.mt-12 { margin-top:12px; }
.mb-6 { margin-bottom:6px; }
.mb-14 { margin-bottom:14px; }
.p-5x0 { padding:5px 0; }
.p-5x8 { padding:5px 8px; }
.p-8x4 { padding:8px 4px; }
.fs-16 { font-size:16px; }
.maxw-480 { max-width:480px; }
.maxw-1100 { max-width:1100px; margin:0 auto; }
.maxh-200 { max-height:200px; overflow-y:auto; }
.maxh-400 { max-height:400px; overflow-y:auto; }
.minw-320 { min-width:320px; }
.cow-card { background:#fff; border:1px solid var(--bd); border-radius:6px; padding:8px; cursor:pointer; }
.cow-card:hover { box-shadow:0 2px 8px rgba(0,0,0,.08); }
.cell-ellipsis { max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.flex-gap-6 { display:flex; gap:6px; flex-wrap:wrap; }
.flex-gap-4 { display:flex; gap:4px; flex-wrap:wrap; }
.flex-gap-12 { display:flex; gap:12px; }

/* ==============================================
   轮次4：补全 JS 引用的未定义 class
   来源：8 个 JS 文件中的静态 class 引用
   ============================================== */

/* --- 通用布局/工具 --- */
.abs-left { position:absolute; left:0; }
.c-red-ec { color:#e53935; }  /* app-breed: 空怀标记红 */
.flex { display:flex; }  /* app-breed: flex布局 */
.grid-2col { display:grid; grid-template-columns:1fr 1fr; }  /* app-breed: 两列网格 */
.bl-2px-var-bd { border-left:2px solid var(--bd,#ddd); }  /* app-cattle: 左边框 */
.mb-12 { margin-bottom:12px; }  /* app-cattle: 下间距 */
.ml-6 { margin-left:6px; }  /* app-cattle: 左间距 */

/* --- 输入框尺寸系列 --- */
.input-ms { padding:5px 8px; font-size:11px; }  /* app-cattle, app-events: 极小输入框 */
.input-md { padding:6px 10px; font-size:13px; }  /* app-events: 中等输入框 */
.input-mds { padding:6px 10px; font-size:12px; }  /* app-events: 稍小输入框 */
.px-7x8 { padding-left:7px; padding-right:7px; }  /* app-events: 水平内边距 */
.py-7x8 { padding-top:7px; padding-bottom:7px; }  /* app-events: 垂直内边距 */
.p-5x6 { padding:5px 6px; }  /* app-materials: 内边距 */
.shmax, .shmin { width:60px; }  /* app-shed: 数量输入 */
.w-180 { width:180px; }  /* app-materials: 宽度 */
.maxw-200 { max-width:200px; }  /* app-materials: 最大宽度 */
.fmf-alloc { width:80px; }  /* app-feeding: 分配量输入 */

/* --- 表格/数据展示 --- */
.sub { font-size:13px; color:#666; margin-top:4px; }  /* app-dash, app-export: 副标题 */
.vl { font-weight:600; color:var(--p,#333); }  /* app-dash, app-weigh: 表格值列 */
.lb { font-size:11px; color:#666; white-space:nowrap; padding:3px 8px 3px 0; }  /* app-weigh: 标签列 */
.amt { text-align:right; font-weight:600; color:var(--p,#333); }  /* app-weigh: 金额列 */
.r { text-align:right; }  /* app-export, app-weigh: 右对齐 */
.ft { font-size:10px; color:#999; border-top:1px dashed #ccc; margin-top:6px; padding-top:4px; text-align:center; }  /* app-export, app-weigh: 页脚 */
.h { background:#f0f4f8; }  /* app-export: 合计行高亮 */
.msr { }  /* app-shed: 移动记录行 */

/* --- 事件时间线 (app-events) --- */
.ti { display:flex; align-items:center; gap:8px; }  /* 时间线项行 */
.td { width:6px; height:6px; border-radius:50%; background:#ccc; flex-shrink:0; }  /* 时间线圆点 */
.tn { font-size:13px; }  /* 时间线事件名称 */
.tl { font-size:12px; color:#666; }  /* 时间行标签 */
.tm { font-size:11px; color:#999; }  /* 时间戳 */
.ta { }  /* 动作链接容器（配合 c-link） */
.t { font-size:11px; }  /* 表格基类 */

/* --- 事件界面布局 (app-events) --- */
.ee-layout { display:grid; grid-template-columns:1fr 380px; gap:12px; }  /* 事件面板主布局 */
.ee-left { }  /* 左侧事件列表 */
.ee-right { }  /* 右侧详情面板 */

/* --- 语音录入牛号：输入框 + 麦克风按钮 --- */
.inputwrap { display:flex; align-items:stretch; gap:6px; }
.inputwrap > .layui-input { flex:1; min-width:0; }
.voice-btn {
  flex:0 0 auto; width:42px; min-height:38px; border:1px solid var(--bd,#d9d9d9);
  background:#fff; border-radius:6px; cursor:pointer; font-size:18px; line-height:1;
  display:flex; align-items:center; justify-content:center; color:var(--p,#1a73e8);
  transition:background .15s;
}
.voice-btn:hover { background:#e8f0fe; }
.voice-btn:active { background:#d2e3fc; }

/* --- 事件中心 (app-events) --- */
.cc { margin-bottom:8px; border:1px solid var(--bd); border-radius:8px; padding:10px; background:#fafafa; }
.dh { font-size:13px; font-weight:600; color:var(--p,#333); }  /* 日期标题头 */
.dci_ck { }  /* 复选框，仅js控制 */
.ev_rx_amt { text-align:right; }  /* 处方金额列 */
.ev_rx_mat { }  /* 处方药品 */
.ev_rx_method { }  /* 处方用法 */
.ev_rx_qty { width:60px; text-align:center; }  /* 处方用量 */
.ev_rx_unit { }  /* 处方单位 */

/* --- 物资 (app-materials) --- */
.mi-tr { }  /* 物资列表行 */
.bg { }  /* 配合 bg-dark-blue/bg-bg 等颜色类使用 */
.gap-10 { display:flex; gap:10px; flex-wrap:wrap; }  /* 物资统计布局 */

/* --- 饲喂 (app-feeding) --- */
.fm-form { }  /* 饲喂表单 */
.fm-mat { }  /* 原料 select */
.fm-ing { }  /* 原料行 */
.fm-qty { width:100px; }  /* 用量输入 */
.fm-toolbar { }  /* 工具栏 */
.fmf-shed-cb { }  /* 牛舍 checkbox */
.cat { }  /* 分类容器 */

/* --- 牛舍 (app-shed) --- */
.sa-card { }  /* 存栏卡片（样式由 bd-b/bdr-6 等控制） */
.ms-to { }  /* 转入 select */

/* --- 用户管理 (app-user) --- */
.btn-green { background:#4caf50; color:#fff; border-color:#4caf50; }
.btn-green:hover { background:#43a047; }
.btn-red { background:#f44336; color:#fff; border-color:#f44336; }
.btn-red:hover { background:#e53935; }
.w100 { width:100%; box-sizing:border-box; }
.user-role-select { width:130px; font-size:11px; padding:2px; border:1px solid var(--bd,#d0d5dd); border-radius:4px; }
.tag-admin { background:#e3f2fd; color:#1976d2; font-size:10px; padding:2px 6px; border-radius:3px; }
.tag-btn { display:inline-block; padding:2px 10px; border:1px solid var(--bd); border-radius:4px; font-size:11px; cursor:pointer; color:var(--t2); background:#fff; user-select:none; }
.tag-btn:hover { border-color:var(--p); color:var(--p); }

/* ============================================================
 * UI 按钮图例库 v1 统一色板（2026-08-02）
 * 将 layui 默认色覆盖为系统标准色，全站按钮颜色语义统一
 * 蓝=主操作(新增/确认) 绿=保存/入库 橙=出库/审核 红=危险/删除
 * ============================================================ */
.layui-btn { background-color:#1a73e8; border-color:#1a73e8; }           /* 默认=主蓝 */
.layui-btn:hover { background-color:#1557b0; border-color:#1557b0; opacity:1; }
.layui-btn:active { background-color:#1557b0; }
.layui-btn-primary { background-color:#fff; color:#1a73e8; border-color:#c5cbd5; }  /* 描边=次操作 */
.layui-btn-primary:hover { border-color:#1a73e8; color:#1a73e8; background:#f5f9ff; }
.layui-btn-normal { background-color:#34a853; border-color:#34a853; }     /* normal=绿(导出/保存类) */
.layui-btn-normal:hover { background-color:#2d8f47; border-color:#2d8f47; }
.layui-btn-warm { background-color:#e37400; border-color:#e37400; }       /* warm=橙(出库/审核) */
.layui-btn-warm:hover { background-color:#c66400; border-color:#c66400; }
.layui-btn-danger { background-color:#d93025; border-color:#d93025; }     /* danger=红(删除/作废) */
.layui-btn-danger:hover { background-color:#b3261e; border-color:#b3261e; }
/* 系统自定义按钮色对齐 */
.b-sub { background-color:#34a853 !important; border-color:#34a853 !important; color:#fff !important; }
.b-sub:hover { background-color:#2d8f47 !important; }
.b-warn { background-color:#e37400 !important; border-color:#e37400 !important; color:#fff !important; }
.b-warn:hover { background-color:#c66400 !important; }
.b-dng { background-color:#d93025 !important; border-color:#d93025 !important; color:#fff !important; }
.b-dng:hover { background-color:#b3261e !important; }
.bg-dark-blue { background-color:#1a3a6e !important; color:#fff !important; }
/* 所有按钮统一样式细节 */
.layui-btn { border-radius:6px; display:inline-flex; align-items:center; justify-content:center; gap:6px; }
.layui-btn-xs, .layui-btn-sm { display:inline-flex; align-items:center; justify-content:center; gap:4px; }
/* 表格行内图标按钮统一（fa-mini 已定义） */

/* ===== 统一特殊维护入口 (ledger-maintain) ===== */
.lm-cards .lm-pick { cursor:pointer; transition:all .15s; border:2px solid transparent; }
.lm-cards .lm-pick:hover { border-color:var(--c); transform:translateY(-2px); }
.lm-cards .lm-pick.act { border-color:var(--c); background:rgba(64,128,255,.06); }
.lm-cards .lm-pick .lm-sub { color:var(--tx2); font-size:12px; margin-top:5px; }
.lm-flash { padding:10px 12px; border-radius:8px; margin:8px 0; font-size:13px; line-height:1.6; }
.lm-ok { background:#e8f8ee; color:#1a7f37; border:1px solid #b7e6c7; }
.lm-warn { background:#fff7e6; color:#9a6700; border:1px solid #f2d9a0; }
.lm-err { background:#fdecec; color:#b42318; border:1px solid #f5c1bd; }
.lm-item-row input, #lm_body input:not([type=radio]):not([type=checkbox]) { border:1px solid var(--bd); border-radius:6px; padding:7px 9px; font-size:13px; min-height:36px; }
#lm_body label { display:flex; flex-direction:column; gap:4px; font-size:12px; color:var(--tx2); }
#lm_body select { border:1px solid var(--bd); border-radius:6px; padding:7px 9px; font-size:13px; min-height:36px; background:#fff; }

/* 预警方案A：整条关闭按钮（✕）2026-08-26 */
.alert-x{ color:#cbd5e1; font-size:13px; cursor:pointer; padding:2px 6px; border-radius:4px; line-height:1; user-select:none; flex:0 0 auto; margin-left:6px; }
.alert-x:hover{ color:#ef4444; background:rgba(239,68,68,.12); }
/* 预警条目整条可点，hover 高亮 */
.wi[onclick]{ transition:background .15s; border-radius:6px; padding:7px 6px; }
.wi[onclick]:hover{ background:rgba(26,115,232,.06); }