/* ============ 麟源斋人事系统 样式 ============ */
:root{
  --c-bg:#f5f6f8;
  --c-panel:#ffffff;
  --c-side:#1f2733;
  --c-side-hover:#2b3646;
  --c-side-active:#c9784a;
  --c-text:#1f2733;
  --c-text-2:#5b6675;
  --c-text-3:#8d97a5;
  --c-border:#e4e8ee;
  --c-line:#eef1f5;
  --c-primary:#c9784a;      /* 麟源斋 主色：暖铜 */
  --c-primary-d:#b3663b;
  --c-primary-l:#fdf4ee;
  --c-green:#2f9e5f;
  --c-red:#d64545;
  --c-blue:#3d7ede;
  --c-amber:#d99a2b;
  --c-purple:#7a5cd6;
  --radius:10px;
  --radius-s:6px;
  --shadow:0 1px 3px rgba(31,39,51,.06),0 8px 24px rgba(31,39,51,.06);
  --shadow-s:0 1px 2px rgba(31,39,51,.08);
  --side-w:216px;
}
*{box-sizing:border-box;margin:0;padding:0}
/* 关键：display 类规则（.modal-mask 等）会覆盖浏览器默认的 [hidden]，
   必须显式强制隐藏，否则 hidden 属性失效 */
[hidden]{display:none !important}
html,body{height:100%}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  background:var(--c-bg);color:var(--c-text);font-size:14px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
.muted{color:var(--c-text-3)}
code{background:#f0f2f5;padding:1px 6px;border-radius:4px;font-size:12.5px;color:var(--c-primary-d)}

/* ============ 登录 ============ */
.login-wrap{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(140deg,#1f2733 0%,#33404f 55%,#4a3a30 100%);
  padding:24px;
}
.login-card{
  background:var(--c-panel);width:100%;max-width:400px;border-radius:14px;
  padding:36px 34px 28px;box-shadow:0 20px 60px rgba(0,0,0,.28);
}
.login-brand{text-align:center;margin-bottom:26px}
.brand-mark{
  width:52px;height:52px;border-radius:14px;margin:0 auto 12px;
  background:linear-gradient(135deg,var(--c-primary),#e0a074);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:26px;font-weight:700;letter-spacing:1px;
}
.brand-mark.sm{width:36px;height:36px;border-radius:10px;font-size:19px;margin:0}
.login-brand h1{font-size:20px;font-weight:600;margin-bottom:4px}
.login-brand p{font-size:13px}
.login-tip{font-size:12px;text-align:center;margin-top:18px;line-height:1.8}

/* ============ 布局 ============ */
#app{display:flex;min-height:100vh}
.sidebar{
  width:var(--side-w);background:var(--c-side);color:#c3cbd6;
  display:flex;flex-direction:column;position:fixed;top:0;bottom:0;left:0;z-index:20;
}
.side-brand{
  display:flex;align-items:center;gap:10px;padding:18px 16px;border-bottom:1px solid rgba(255,255,255,.07);
}
.side-brand strong{display:block;color:#fff;font-size:14px;font-weight:600}
.side-brand small{font-size:11px;color:#8b95a4 !important}
.nav{flex:1;padding:10px 8px;overflow-y:auto}
.nav-item{
  display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-s);
  font-size:13.5px;margin-bottom:2px;cursor:pointer;transition:.16s;
}
.nav-item i{font-style:normal;font-size:15px;width:20px;text-align:center;opacity:.85}
.nav-item:hover{background:var(--c-side-hover);color:#fff}
.nav-item.active{background:var(--c-side-active);color:#fff;font-weight:500}
.side-foot{padding:12px;border-top:1px solid rgba(255,255,255,.07)}
.user-box{display:flex;align-items:center;gap:9px;padding:6px 4px 10px}
.avatar-dot{
  width:32px;height:32px;border-radius:50%;background:var(--c-primary);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:600;font-size:14px;flex:0 0 auto;
}
.user-meta{min-width:0}
.user-meta strong{display:block;color:#fff;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-meta small{font-size:11px;color:#8b95a4 !important}

.main{flex:1;margin-left:var(--side-w);display:flex;flex-direction:column;min-width:0}
.topbar{
  height:60px;background:var(--c-panel);border-bottom:1px solid var(--c-border);
  display:flex;align-items:center;justify-content:space-between;padding:0 24px;
  position:sticky;top:0;z-index:10;
}
.topbar h2{font-size:16.5px;font-weight:600}
.topbar-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.content{padding:20px 24px 40px;flex:1}

/* ============ 卡片 / 栅格 ============ */
.card{
  background:var(--c-panel);border-radius:var(--radius);box-shadow:var(--shadow-s);
  border:1px solid var(--c-border);margin-bottom:16px;
}
.card-head{
  padding:14px 18px;border-bottom:1px solid var(--c-line);
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
}
.card-head h3{font-size:14.5px;font-weight:600}
.card-body{padding:16px 18px}
.card-body.tight{padding:0}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g5{grid-template-columns:repeat(5,minmax(0,1fr))}
.g6{grid-template-columns:repeat(6,minmax(0,1fr))}
@media(max-width:1280px){.g5,.g6{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1080px){.g4,.g3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.g2,.g3,.g4,.g5,.g6{grid-template-columns:1fr}}

/* 统计卡 */
.stat{
  background:var(--c-panel);border:1px solid var(--c-border);border-radius:var(--radius);
  padding:15px 16px;box-shadow:var(--shadow-s);position:relative;overflow:hidden;
}
.stat::after{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--c-primary)}
.stat.g::after{background:var(--c-green)}
.stat.b::after{background:var(--c-blue)}
.stat.a::after{background:var(--c-amber)}
.stat.p::after{background:var(--c-purple)}
.stat .lbl{font-size:12.5px;color:var(--c-text-3);margin-bottom:6px;display:flex;align-items:center;gap:5px}
.stat .val{font-size:22px;font-weight:650;letter-spacing:-.4px;font-variant-numeric:tabular-nums}
.stat .sub{font-size:12px;color:var(--c-text-3);margin-top:4px}
.stat .val.money::before{content:'¥';font-size:14px;font-weight:500;margin-right:2px;opacity:.7}

/* ============ 按钮 ============ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:5px;
  padding:7px 14px;border-radius:var(--radius-s);border:1px solid var(--c-border);
  background:#fff;color:var(--c-text);font-size:13px;cursor:pointer;
  transition:.15s;font-family:inherit;white-space:nowrap;
}
.btn:hover{background:#f7f8fa;border-color:#d5dae1}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.btn-primary{background:var(--c-primary);border-color:var(--c-primary);color:#fff}
.btn-primary:hover{background:var(--c-primary-d);border-color:var(--c-primary-d)}
.btn-danger{background:#fff;border-color:#f0c9c9;color:var(--c-red)}
.btn-danger:hover{background:#fdf3f3}
.btn-ghost{background:transparent;border-color:transparent;color:#c3cbd6}
.btn-ghost:hover{background:var(--c-side-hover);color:#fff;border-color:transparent}
.btn-sm{padding:4px 9px;font-size:12.5px}
.btn-xs{padding:2px 7px;font-size:12px;border-radius:4px}
.btn-block{width:100%;margin-bottom:6px}
.btn-link{background:none;border:none;color:var(--c-primary);cursor:pointer;font-size:13px;padding:2px 4px;font-family:inherit}
.btn-link:hover{text-decoration:underline}
.btn-link.danger{color:var(--c-red)}

/* ============ 表单 ============ */
label{display:block;font-size:13px;color:var(--c-text-2);margin-bottom:11px}
label > span.req{color:var(--c-red);margin-left:2px}
input,select,textarea{
  width:100%;margin-top:5px;padding:7px 10px;border:1px solid var(--c-border);
  border-radius:var(--radius-s);font-size:13.5px;font-family:inherit;color:var(--c-text);
  background:#fff;transition:.15s;
}
input:focus,select:focus,textarea:focus{
  outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px rgba(201,120,74,.12);
}
input:disabled,select:disabled{background:#f7f8fa;color:var(--c-text-3)}
textarea{resize:vertical;min-height:64px;line-height:1.55}
input[type=number]{font-variant-numeric:tabular-nums}
.form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}
.form-row.g3c{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:680px){.form-row,.form-row.g3c{grid-template-columns:1fr}}
.form-hint{font-size:12px;color:var(--c-text-3);margin-top:-6px;margin-bottom:10px}

/* 工具栏 */
.toolbar{
  display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap;
  padding:14px 18px;border-bottom:1px solid var(--c-line);background:#fcfcfd;
}
.toolbar label{margin-bottom:0;min-width:130px}
.toolbar .spacer{flex:1}
.toolbar label.inline{display:flex;align-items:center;gap:6px;min-width:auto}
.toolbar label.inline input{width:auto;margin-top:0}

/* ============ 表格 ============ */
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:13px}
th,td{padding:9px 12px;text-align:left;border-bottom:1px solid var(--c-line);white-space:nowrap}
th{
  background:#fafbfc;font-weight:600;font-size:12.5px;color:var(--c-text-2);
  position:sticky;top:0;z-index:2;
}
tbody tr:hover{background:#fcfaf8}
tbody tr.total-row{background:var(--c-primary-l);font-weight:600}
tbody tr.total-row:hover{background:#fbf0e8}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
td.money,th.money{text-align:right;font-variant-numeric:tabular-nums;font-weight:500}
td.actions{text-align:right;white-space:nowrap}
.empty{padding:38px 20px;text-align:center;color:var(--c-text-3);font-size:13.5px}
.empty .em-ico{font-size:32px;display:block;margin-bottom:8px;opacity:.5}
td input.batch-input{
  width:82px;margin:0;padding:4px 8px;font-size:13px;text-align:right;
}
td input.batch-input.changed{border-color:var(--c-primary);background:var(--c-primary-l)}
.badge{
  display:inline-block;padding:1px 7px;border-radius:20px;font-size:11.5px;
  background:#f0f2f5;color:var(--c-text-2);line-height:1.7;
}
.badge.g{background:#e9f7ee;color:var(--c-green)}
.badge.r{background:#fdeeee;color:var(--c-red)}
.badge.b{background:#eaf1fd;color:var(--c-blue)}
.badge.a{background:#fdf5e5;color:#a8761a}
.badge.p{background:#f1ecfd;color:var(--c-purple)}
.badge.pri{background:var(--c-primary-l);color:var(--c-primary-d)}
.tag-store{font-size:11.5px;color:var(--c-text-3)}

/* 分页 */
.pager{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;flex-wrap:wrap}
.pager .pages{display:flex;gap:4px;align-items:center}
.pager .pg{
  min-width:30px;height:30px;padding:0 8px;border:1px solid var(--c-border);background:#fff;
  border-radius:var(--radius-s);cursor:pointer;font-size:13px;font-family:inherit;
}
.pager .pg:hover{background:#f7f8fa}
.pager .pg.on{background:var(--c-primary);border-color:var(--c-primary);color:#fff;font-weight:600}
.pager .pg:disabled{opacity:.4;cursor:not-allowed}

/* ============ 提示 ============ */
.alert{padding:10px 14px;border-radius:var(--radius-s);font-size:13px;margin-bottom:14px;line-height:1.55}
.alert-error{background:#fdeeee;color:#a83232;border:1px solid #f5d5d5}
.alert-ok{background:#eaf6ee;color:#1f7a45;border:1px solid #cbe9d7}
.alert-info{background:#eaf1fd;color:#2757a0;border:1px solid #d4e2f9}
.alert-warn{background:#fdf6e6;color:#8a6212;border:1px solid #f2e2bd}

.toast-wrap{position:fixed;top:18px;right:18px;z-index:9999;display:flex;flex-direction:column;gap:8px}
.toast{
  background:#fff;border:1px solid var(--c-border);border-left:3px solid var(--c-primary);
  border-radius:var(--radius-s);padding:10px 16px;box-shadow:var(--shadow);
  font-size:13.5px;min-width:240px;max-width:400px;animation:slideIn .22s ease;
}
.toast.ok{border-left-color:var(--c-green)}
.toast.err{border-left-color:var(--c-red)}
@keyframes slideIn{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}

/* ============ 弹窗 ============ */
.modal-mask{
  position:fixed;inset:0;background:rgba(31,39,51,.42);z-index:1000;
  display:flex;align-items:flex-start;justify-content:center;padding:48px 20px;overflow-y:auto;
  backdrop-filter:blur(2px);
}
.modal{
  background:#fff;border-radius:12px;width:100%;max-width:620px;
  box-shadow:0 24px 64px rgba(0,0,0,.24);animation:pop .2s ease;
}
.modal.wide{max-width:920px}
.modal.xwide{max-width:1180px}
@keyframes pop{from{opacity:0;transform:translateY(-12px) scale(.98)}to{opacity:1;transform:none}}
.modal-head{
  padding:15px 20px;border-bottom:1px solid var(--c-line);
  display:flex;align-items:center;justify-content:space-between;
}
.modal-head h3{font-size:15px;font-weight:600}
.modal-x{
  background:none;border:none;font-size:22px;color:var(--c-text-3);cursor:pointer;
  line-height:1;padding:0 4px;font-family:inherit;
}
.modal-x:hover{color:var(--c-text)}
.modal-body{padding:20px;max-height:calc(100vh - 260px);overflow-y:auto}
.modal-foot{
  padding:14px 20px;border-top:1px solid var(--c-line);
  display:flex;justify-content:flex-end;gap:8px;
}

/* ============ 组织树 ============ */
.org-tree{padding:6px 0}
.org-node{border-bottom:1px solid var(--c-line)}
.org-node:last-child{border-bottom:none}
.org-row{
  display:flex;align-items:center;gap:9px;padding:11px 18px;transition:.14s;
}
.org-row:hover{background:#fcfaf8}
.org-row.store{background:#fafbfc;font-weight:600}
.org-row.dept{padding-left:44px;font-weight:500}
.org-row.pos{padding-left:78px;font-size:13px;color:var(--c-text-2)}
.org-toggle{
  width:18px;height:18px;flex:0 0 auto;border:none;background:none;cursor:pointer;
  color:var(--c-text-3);font-size:11px;font-family:inherit;transition:.16s;
}
.org-toggle.open{transform:rotate(90deg)}
.org-name{flex:1;min-width:0;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.org-meta{font-size:12px;color:var(--c-text-3);font-variant-numeric:tabular-nums}
.org-acts{display:flex;gap:2px;opacity:0;transition:.14s}
.org-row:hover .org-acts{opacity:1}
.collapsed{display:none}
.indent-1{padding-left:20px}
.indent-2{padding-left:40px}

/* ============ OCR 上传 ============ */
.drop-zone{
  border:2px dashed var(--c-border);border-radius:var(--radius);padding:34px 20px;
  text-align:center;cursor:pointer;transition:.18s;background:#fcfcfd;
}
.drop-zone:hover,.drop-zone.over{border-color:var(--c-primary);background:var(--c-primary-l)}
.drop-zone .dz-ico{font-size:34px;display:block;margin-bottom:10px;opacity:.6}
.drop-zone .dz-t{font-size:14px;font-weight:500;margin-bottom:4px}
.drop-zone .dz-s{font-size:12.5px;color:var(--c-text-3)}
.preview-img{max-width:100%;max-height:420px;border-radius:var(--radius-s);border:1px solid var(--c-border)}
.ocr-raw{
  background:#fafbfc;border:1px solid var(--c-line);border-radius:var(--radius-s);
  padding:12px 14px;font-family:Consolas,Monaco,monospace;font-size:12.5px;
  white-space:pre-wrap;word-break:break-all;max-height:260px;overflow-y:auto;color:var(--c-text-2);
}
.ocr-split{display:grid;grid-template-columns:1fr 1.2fr;gap:18px}
@media(max-width:900px){.ocr-split{grid-template-columns:1fr}}

/* 录入方式切换（图片 / 文字） */
.ocr-mode-tabs{display:flex;gap:0;border-bottom:1px solid var(--c-line)}
.ocr-tab{
  border:none;background:none;padding:9px 18px;font-size:14px;font-family:inherit;
  color:var(--c-text-3);cursor:pointer;border-bottom:2px solid transparent;
  transition:.15s;margin-bottom:-1px;
}
.ocr-tab:hover{color:var(--c-text)}
.ocr-tab.on{color:var(--c-primary);border-bottom-color:var(--c-primary);font-weight:600}
.ocr-textarea{
  width:100%;min-height:210px;padding:12px 14px;font-size:13.5px;font-family:inherit;
  border:1px solid var(--c-border);border-radius:var(--radius-s);resize:vertical;
  line-height:1.7;box-sizing:border-box;transition:.15s;background:#fff;color:var(--c-text);
}
.ocr-textarea:focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px var(--c-primary-l)}
.form-row.g2c{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:680px){.form-row.g2c{grid-template-columns:1fr}}

/* 支付方式色块 */
.pay-chip{
  display:flex;align-items:center;gap:6px;padding:8px 10px;border-radius:var(--radius-s);
  background:#fafbfc;border:1px solid var(--c-line);font-size:12.5px;
}
.pay-chip .dot{width:8px;height:8px;border-radius:50%;flex:0 0 auto}
.dot.wechat{background:#2f9e5f}.dot.cash{background:#d99a2b}
.dot.wechat_change{background:#4fb06f}.dot.yinbao{background:#3d7ede}
.dot.douyin{background:#1f2733}.dot.alipay{background:#1677ff}

/* 进度条 */
.bar{height:6px;background:#eef1f5;border-radius:6px;overflow:hidden;margin-top:6px}
.bar > i{display:block;height:100%;background:var(--c-primary);border-radius:6px;transition:width .5s}

/* 标签页 */
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--c-line);padding:0 18px;background:#fcfcfd}
.tab{
  padding:11px 15px;font-size:13.5px;cursor:pointer;border-bottom:2px solid transparent;
  color:var(--c-text-2);transition:.15s;background:none;border-top:none;border-left:none;border-right:none;font-family:inherit;
}
.tab:hover{color:var(--c-text)}
.tab.on{color:var(--c-primary);border-bottom-color:var(--c-primary);font-weight:600}

.loading{padding:44px;text-align:center;color:var(--c-text-3)}
.spinner{
  width:26px;height:26px;border:2.5px solid var(--c-border);border-top-color:var(--c-primary);
  border-radius:50%;animation:spin .7s linear infinite;margin:0 auto 12px;
}
@keyframes spin{to{transform:rotate(360deg)}}

@media(max-width:820px){
  .sidebar{transform:translateX(-100%);transition:.22s}
  .sidebar.open{transform:none}
  .main{margin-left:0}
}
@media print{
  .sidebar,.topbar,.toolbar,.pager,.btn{display:none !important}
  .main{margin-left:0}
  .card{box-shadow:none;border:none}
}