/* 领导行程信息管理系统 —— 主题色 #3768B5 */
:root{
  --brand:#3768B5; --brand-d:#2d5596; --brand-l:#e8eff9; --brand-l2:#f4f8fd;
  --ink:#1f2733; --ink2:#5a6675; --ink3:#8c97a6;
  --line:#e3e8ef; --bg:#f5f7fa; --card:#fff;
  --ok:#1f9c5b; --warn:#e8a020; --danger:#d64545; --busy:#9aa5b4;
  --r:8px; --sh:0 1px 3px rgba(31,39,51,.08), 0 6px 18px rgba(31,39,51,.05);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
/* 【全局兜底】hidden 属性必须真正隐藏元素；
   修复：.modal{display:flex} 等具体类选择器曾覆盖 UA 的 [hidden]{display:none}，
   导致模态/抽屉"凭空出现一个空提示框"。任何位置只要写了 hidden 就必须不显示。 */
[hidden]{display:none !important}
body{
  font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",Arial,sans-serif;
  background:var(--bg); color:var(--ink); font-size:14px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--brand); text-decoration:none}
button{font-family:inherit}

/* ---------------- 顶栏 ---------------- */
.topbar{background:var(--brand); color:#fff; position:sticky; top:0; z-index:60;
  box-shadow:0 2px 10px rgba(45,85,150,.25)}
.topbar-in{max-width:1440px; margin:0 auto; padding:0 18px; height:58px;
  display:flex; align-items:center; gap:18px}
.brand{display:flex; align-items:center; gap:10px; color:#fff; flex:none}
.brand-mark{width:26px;height:26px;border-radius:6px;background:#fff;flex:none;
  position:relative}
.brand-mark::before{content:"";position:absolute;inset:6px 6px auto 6px;height:3px;
  background:var(--brand);border-radius:2px;box-shadow:0 6px 0 var(--brand),0 12px 0 var(--brand)}
.brand-text b{display:block;font-size:16px;line-height:1.2;white-space:nowrap}
.brand-text i{display:block;font-size:11px;opacity:.8;font-style:normal;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px}
.nav{display:flex; gap:2px; flex:1; min-width:0}
.nav a{color:rgba(255,255,255,.85); padding:8px 14px; border-radius:6px;
  white-space:nowrap; font-size:14px}
.nav a:hover{background:rgba(255,255,255,.12); color:#fff}
.nav a.on{background:rgba(255,255,255,.2); color:#fff; font-weight:600}
.topbar-right{display:flex; align-items:center; gap:10px; flex:none}
.icon-btn{background:rgba(255,255,255,.14); border:0; color:#fff; cursor:pointer;
  padding:6px 10px; border-radius:6px; font-size:13px; position:relative}
.icon-btn:hover{background:rgba(255,255,255,.26)}
.badge{position:absolute;top:-4px;right:-4px;background:#e8452c;color:#fff;
  font-size:10px;font-style:normal;border-radius:9px;padding:0 5px;min-width:16px;
  height:16px;line-height:16px;text-align:center}
.me{display:flex; align-items:center; gap:7px}
.avatar{width:30px;height:30px;border-radius:50%;background:#fff;color:var(--brand);
  display:grid;place-items:center;font-weight:700;flex:none}
.me-name{font-size:13px}
.me-rank{font-size:11px;opacity:.75}
.only-mobile{display:none}

/* ---------------- 布局 ---------------- */
.wrap{max-width:1440px; margin:0 auto; padding:16px 18px 40px}
.card{background:var(--card); border-radius:var(--r); box-shadow:var(--sh); padding:16px}
.card+.card{margin-top:14px}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:-4px 0 12px}
.card-head h2{margin:0;font-size:16px;font-weight:700}
.card-head .sub{color:var(--ink3);font-size:12px;font-weight:400;margin-left:8px}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.grid{display:grid;gap:14px}
.g4{grid-template-columns:repeat(4,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
.spacer{flex:1}

/* ---------------- 标签页 ---------------- */
.tabs{display:flex;gap:4px;flex-wrap:wrap}
.tab{border:0;background:transparent;color:var(--ink2);padding:10px 16px;cursor:pointer;
  font-size:14px;border-radius:6px 6px 0 0;position:relative}
.tab:hover{color:var(--brand)}
.tab.on{color:var(--brand);font-weight:600;background:var(--brand-l2)}
.tab.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--brand)}

/* ---------------- 控件 ---------------- */
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);
  background:#fff;color:var(--ink);padding:7px 14px;border-radius:6px;cursor:pointer;
  font-size:13px;white-space:nowrap;transition:.15s}
.btn:hover{border-color:var(--brand);color:var(--brand)}
.btn-primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn-primary:hover{background:var(--brand-d);border-color:var(--brand-d);color:#fff}
.btn-danger{background:#fff;border-color:#f0c4c4;color:var(--danger)}
.btn-danger:hover{background:var(--danger);color:#fff;border-color:var(--danger)}
.btn-ghost{border-color:transparent;background:transparent;color:var(--ink2)}
.btn-sm{padding:5px 10px;font-size:12px}
.btn:disabled{opacity:.5;cursor:not-allowed}
input,select,textarea{font-family:inherit;font-size:13px;padding:7px 10px;
  border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);
  outline:none;width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(55,104,181,.12)}
textarea{resize:vertical;min-height:76px}
label.f{display:block;margin-bottom:12px}
label.f>span{display:block;font-size:12px;color:var(--ink2);margin-bottom:5px}
label.f>span em{color:var(--danger);font-style:normal}
.inline-check{display:inline-flex;align-items:center;gap:6px;font-size:13px;
  cursor:pointer;margin-right:16px}
.inline-check input{width:auto}

/* ---------------- 周视图（列表，参考督办系统 table.grid 风格） ---------------- */
.weekbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.weekbar .wlabel{font-size:19px;font-weight:700;color:var(--brand)}
.weekbar .wrange{color:var(--ink3);font-size:12px}

.grid-wrap{background:var(--card);border-radius:var(--r);box-shadow:var(--sh);overflow:auto}
table.grid{width:100%;border-collapse:collapse;font-size:13px;min-width:760px}
table.grid thead th{position:sticky;top:0;z-index:2;background:var(--brand);
  color:#fff;padding:10px 12px;font-weight:500;text-align:left;white-space:nowrap}
table.grid tbody td{padding:9px 12px;border-bottom:1px solid var(--line);
  white-space:nowrap;vertical-align:middle}
table.grid tbody tr:nth-child(even) td{background:#f9fbf5}
table.grid tbody tr:hover td{background:var(--brand-l)}
table.grid .c-time,.c-wd,.c-cat,.c-op{text-align:center}
table.grid .c-title{white-space:normal;min-width:160px}
table.grid .empty,.grid .loading{text-align:center;color:var(--ink3);padding:22px}
.lnk{color:var(--brand);text-decoration:none;font-weight:600}
.lnk:hover{text-decoration:underline}

/* 类型标签 */
.tag{display:inline-block;padding:2px 8px;border-radius:10px;font-size:12px;line-height:1.6;
  background:var(--bg);color:var(--ink2)}
.tag.meeting{background:#e8eff9;color:#2d5596}
.tag.travel{background:#e6f4ec;color:#1f9c5b}
.tag.training{background:#fbf0db;color:#b97c10}
.tag.reception{background:#fbe6e6;color:#c23b3b}
.tag.personal{background:#eef1f4;color:#5a6675}
.tag.other{background:#eef1f4;color:#5a6675}
.tag.busy{background:#e9edf2;color:#8c97a6}
@media (max-width:860px){
  table.grid{font-size:12px;min-width:680px}
  table.grid thead th,table.grid tbody td{padding:7px 8px}
}

/* ---- 领导 × 日期 矩阵（参考样式：参考表设计）---- */
.page-head h1{font-size:22px;margin:0 0 4px;color:var(--ink)}
.page-head .muted{color:var(--ink3);font-size:13px;margin:0 0 14px}
.matrix-wrap{background:var(--card);border-radius:var(--r);
  box-shadow:var(--sh);overflow:auto}
table.matrix{width:100%;border-collapse:separate;border-spacing:0;
  min-width:900px;font-size:13px}
table.matrix thead th{position:sticky;top:0;z-index:2;
  background:var(--brand);color:#fff;padding:10px 12px;
  text-align:center;font-weight:500;border-right:1px solid rgba(255,255,255,.18)}
table.matrix thead th b{display:block;font-size:14px}
table.matrix thead th i{display:block;font-size:11px;opacity:.85;font-style:normal;
  margin-top:2px}
table.matrix thead .col-name{text-align:left;min-width:120px}
table.matrix thead .col-title{text-align:left;min-width:120px}
table.matrix thead .col-op{min-width:84px}
table.matrix tbody td{padding:10px 12px;border-bottom:1px solid var(--line);
  border-right:1px solid var(--line);vertical-align:top;background:#f9fbf5}
table.matrix tbody tr:nth-child(even) td{background:#eef5dc}
table.matrix tbody td.col-name{background:#fff;font-weight:600;
  white-space:nowrap}
table.matrix tbody td.col-title{background:#fff;color:var(--ink2);
  font-size:12px;white-space:nowrap}
table.matrix tbody td.col-op{background:#fff;text-align:center;
  white-space:nowrap}
table.matrix .cell{min-height:54px}
table.matrix .cell .row{display:block;padding:4px 6px;margin:2px 0;
  border-left:3px solid var(--brand);background:#fff;border-radius:0 4px 4px 0;
  font-size:12px;line-height:1.35;text-decoration:none;color:var(--ink)}
table.matrix .cell .row b{display:block;font-weight:700;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px}
table.matrix .cell .row i{display:block;font-style:normal;color:var(--ink3);
  font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  max-width:160px}
table.matrix .cell .row.busy{color:var(--ink2);border-left-color:var(--busy);
  background:var(--bg)}
table.matrix .cell .row.more{background:transparent;border-left:0;
  color:var(--brand);font-weight:600;text-align:center;padding:2px}
table.matrix .cell .row.meeting{border-left-color:#3768B5}
table.matrix .cell .row.travel{border-left-color:#1f9c5b}
table.matrix .cell .row.training{border-left-color:#e8a020}
table.matrix .cell .row.reception{border-left-color:#d64545}
table.matrix .cell .row.personal{border-left-color:#9aa5b4}
table.matrix .cell .row.other{border-left-color:var(--ink3)}
table.matrix .cell.empty{color:var(--ink3);text-align:center;padding:14px 0;
  font-size:18px}
@media (max-width:860px){
  table.matrix{min-width:760px;font-size:12px}
  table.matrix thead th{padding:8px 6px}
  table.matrix tbody td{padding:6px}
}

.weekgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}
.daycol{background:var(--card);border-radius:var(--r);box-shadow:var(--sh);
  min-height:190px;display:flex;flex-direction:column;overflow:hidden}
.daycol.today{outline:2px solid var(--brand)}
.dayhead{padding:8px 10px;border-bottom:1px solid var(--line);
  display:flex;align-items:baseline;justify-content:space-between}
.dayhead b{font-size:13px}
.dayhead .d{color:var(--ink3);font-size:11px}
.daycol.today .dayhead{background:var(--brand-l)}
.daycol.weekend .dayhead b{color:var(--ink3)}
.daybody{padding:8px;display:flex;flex-direction:column;gap:6px;flex:1}
.ev{border-left:3px solid var(--brand);background:var(--brand-l2);border-radius:5px;
  padding:6px 8px;cursor:pointer;transition:.15s}
.ev:hover{background:var(--brand-l);transform:translateX(1px)}
.ev .t{font-size:11px;color:var(--ink2)}
.ev .n{font-size:13px;font-weight:600;line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ev .o{font-size:11px;color:var(--ink3);margin-top:2px}
.ev.busy{border-left-color:var(--busy);background:#f1f3f6}
.ev.busy .n{color:var(--busy);font-weight:500}
.ev.cat-travel{border-left-color:#c2853a;background:#fdf6ec}
.ev.cat-personal{border-left-color:#7a5db8;background:#f5f1fb}
.ev.private{border-left-color:#7a5db8}
.ev.conflict{box-shadow:inset 0 0 0 1px #f0c4c4}
.empty{color:var(--ink3);font-size:12px;text-align:center;padding:18px 0}

/* ---------------- 月视图 ---------------- */
.monthgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.mcell{background:var(--card);border-radius:6px;min-height:104px;padding:6px;
  box-shadow:var(--sh);display:flex;flex-direction:column;gap:3px}
.mcell.out{opacity:.45}
.mcell.today{outline:2px solid var(--brand)}
.mcell .dn{font-size:12px;color:var(--ink2);font-weight:600}
.mev{font-size:11px;background:var(--brand-l2);border-left:2px solid var(--brand);
  padding:2px 4px;border-radius:3px;cursor:pointer;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.mev.busy{border-left-color:var(--busy);background:#f1f3f6;color:var(--busy)}
.mhead{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:6px}
.mhead span{text-align:center;font-size:12px;color:var(--ink2);font-weight:600}

/* ---------------- 统计 ---------------- */
.kpi{background:var(--card);border-radius:var(--r);box-shadow:var(--sh);padding:16px}
.kpi .k{font-size:12px;color:var(--ink2)}
.kpi .v{font-size:30px;font-weight:700;color:var(--brand);line-height:1.25}
.kpi .v small{font-size:14px;color:var(--ink2);font-weight:400;margin-left:3px}
.kpi .c{font-size:12px;color:var(--ink3)}
.kpi .c .up{color:var(--danger)} .kpi .c .down{color:var(--ok)}
.bars{display:flex;flex-direction:column;gap:9px}
.bar{display:grid;grid-template-columns:96px 1fr 52px;gap:10px;align-items:center;
  font-size:13px}
.bar .track{background:var(--brand-l);border-radius:4px;height:16px;overflow:hidden}
.bar .fill{background:var(--brand);height:100%;border-radius:4px;min-width:2px;
  transition:width .4s}
.bar .n{text-align:right;color:var(--ink2);font-size:12px}
.spark{display:flex;align-items:flex-end;gap:8px;height:130px;padding-top:8px}
.spark .col{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;
  height:100%;justify-content:flex-end}
.spark .b{width:100%;background:var(--brand);border-radius:4px 4px 0 0;min-height:3px;
  transition:height .4s}
.spark .lb{font-size:11px;color:var(--ink3)}
.spark .vv{font-size:11px;color:var(--ink2);font-weight:600}

/* ---------------- 表格 ---------------- */
table.tb{width:100%;border-collapse:collapse;font-size:13px}
table.tb th{background:var(--brand);color:#fff;text-align:left;padding:9px 10px;
  font-weight:600;white-space:nowrap;font-size:12px}
table.tb th:first-child{border-radius:6px 0 0 0}
table.tb th:last-child{border-radius:0 6px 0 0}
table.tb td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
table.tb tr:hover td{background:var(--brand-l2)}
.tb-wrap{overflow-x:auto}
.tag{display:inline-block;padding:1px 8px;border-radius:10px;font-size:11px;
  background:var(--brand-l);color:var(--brand-d);white-space:nowrap}
.tag.g{background:#e6f6ed;color:var(--ok)}
.tag.r{background:#fdeaea;color:var(--danger)}
.tag.y{background:#fdf3e2;color:#a9761a}
.tag.n{background:#eef1f5;color:var(--ink2)}

/* ---------------- 详情 ---------------- */
.dt{display:grid;grid-template-columns:88px 1fr;gap:10px 14px;font-size:14px}
.dt dt{color:var(--ink3);font-size:13px}
.dt dd{margin:0}
.people{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--brand-l2);
  border:1px solid var(--line);border-radius:14px;padding:3px 10px;font-size:12px}
.chip .x{cursor:pointer;color:var(--ink3);font-weight:700}
.chip .x:hover{color:var(--danger)}
.timeline{border-left:2px solid var(--line);padding-left:14px;
  display:flex;flex-direction:column;gap:12px}
.timeline .it{position:relative;font-size:12px;color:var(--ink2)}
.timeline .it::before{content:"";position:absolute;left:-19px;top:6px;width:8px;
  height:8px;border-radius:50%;background:var(--brand)}
.notice{padding:9px 12px;border-radius:6px;font-size:13px;margin-bottom:12px}
.notice.warn{background:#fdf3e2;color:#8a5f13;border:1px solid #f3dfb8}
.notice.err{background:#fdeaea;color:#8f2d2d;border:1px solid #f2cccc}
.notice.info{background:var(--brand-l);color:var(--brand-d);border:1px solid #cadcf3}

/* ---------------- 登录 ---------------- */
.login-bg{min-height:100vh;display:grid;place-items:center;padding:20px;
  background:linear-gradient(135deg,#3768B5 0%,#24457c 100%)}
.login-card{background:#fff;border-radius:12px;padding:34px 32px;width:100%;
  max-width:390px;box-shadow:0 20px 60px rgba(0,0,0,.28)}
.login-card h1{margin:0 0 4px;font-size:20px;color:var(--brand)}
.login-card p.org{margin:0 0 22px;font-size:12px;color:var(--ink3)}
.login-tip{margin-top:18px;padding-top:14px;border-top:1px dashed var(--line);
  font-size:11px;color:var(--ink3);line-height:1.8}

/* ---------------- 抽屉 / 弹窗 / toast ---------------- */
.drawer{position:fixed;top:0;right:0;bottom:0;width:340px;background:#fff;z-index:80;
  box-shadow:-6px 0 24px rgba(0,0,0,.14);display:flex;flex-direction:column}
.drawer-head{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;
  align-items:center;justify-content:space-between}
.drawer-head .icon-btn{background:var(--bg);color:var(--ink2)}
.drawer-body{flex:1;overflow:auto;padding:10px 14px}
.noti{padding:10px;border-radius:6px;border:1px solid var(--line);margin-bottom:9px;
  cursor:pointer}
.noti.unread{background:var(--brand-l2);border-color:#cadcf3}
.noti b{display:block;font-size:13px}
.noti span{font-size:12px;color:var(--ink2)}
.noti i{display:block;font-style:normal;font-size:11px;color:var(--ink3);margin-top:3px}
.modal{position:fixed;inset:0;background:rgba(20,28,40,.45);z-index:90;
  display:grid;place-items:center;padding:20px}
.modal-card{background:#fff;border-radius:10px;width:100%;max-width:560px;
  max-height:86vh;display:flex;flex-direction:column;box-shadow:0 24px 60px rgba(0,0,0,.3)}
.modal-head{padding:14px 18px;border-bottom:1px solid var(--line);display:flex;
  align-items:center;justify-content:space-between}
.modal-head .icon-btn{background:var(--bg);color:var(--ink2)}
.modal-body{padding:16px 18px;overflow:auto;flex:1}
.modal-foot{padding:12px 18px;border-top:1px solid var(--line);display:flex;
  justify-content:flex-end;gap:9px}
.toast-wrap{position:fixed;top:70px;left:50%;transform:translateX(-50%);z-index:100;
  display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.toast{background:rgba(31,39,51,.92);color:#fff;padding:9px 18px;border-radius:20px;
  font-size:13px;animation:tin .2s}
.toast.ok{background:rgba(31,156,91,.95)}
.toast.err{background:rgba(214,69,69,.95)}
@keyframes tin{from{opacity:0;transform:translateY(-8px)}}
.loading{text-align:center;color:var(--ink3);padding:26px;font-size:13px}

/* ---------------- 响应式 ---------------- */
@media (max-width:1100px){
  .g4{grid-template-columns:repeat(2,1fr)}
  .weekgrid{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:860px){
  .topbar-in{height:auto;padding:8px 12px;flex-wrap:wrap;gap:8px}
  .brand-text i{display:none}
  .nav{order:9;width:100%;overflow-x:auto;padding-bottom:2px;display:none}
  .nav.open{display:flex}
  .only-mobile{display:inline-block}
  .me-name,.me-rank{display:none}
  .wrap{padding:12px}
  .weekgrid{grid-template-columns:1fr}
  .daycol{min-height:auto}
  .g4,.g3,.g2{grid-template-columns:1fr}
  .dt{grid-template-columns:74px 1fr}
  .drawer{width:100%}
  .mcell{min-height:74px}
  .monthgrid,.mhead{gap:3px}
}
@media print{
  .topbar,.drawer,.modal,.toast-wrap,.btn,.icon-btn{display:none !important}
  body{background:#fff}
  .card{box-shadow:none;border:1px solid var(--line)}
}