/* ============================================================
   武威桁北集团 · 工作台主布局设计系统（console.css）
   ------------------------------------------------------------
   与公开门户（portal.css）/ 专业能力认证（pcert.css）共用同一套
   视觉语言：正式、克制、信息密集的政务/企业级观感。
   刻意规避「AI 模板味」——不使用大圆角、渐变横幅、霓虹投影、
   玻璃拟态、胶囊标签；改用细描边、直角/微圆角、左侧强调条、
   方形状态签、等宽数字与清晰的信息层级。

   适用范围：工作台主布局（layouts/main.php）——侧边导航、顶栏、
   下拉菜单，以及内容区内的卡片 / 表格 / 表单 / 徽标 / 分页 /
   标签页 / 弹窗 / 抽屉 / 提示条 / 底部标签栏。
   对既有组件只做样式覆盖，不改结构、不影响任何交互逻辑。

   加载顺序：必须置于 app.css、cert.css 之后（同优先级后写覆盖）。
   ============================================================ */

/* ============ 1. 设计令牌：对齐 portal.css ============ */
:root {
  /* 主色：藏蓝 + 主蓝（与门户一致，收敛偏亮的天蓝） */
  --primary:#1B4C86; --primary-deep:#123A69; --primary-soft:#EDF2F9; --primary-line:#C4D6EA;
  --navy:#0A1F3C; --navy-800:#12325A; --navy-700:#1B4C86; --accent:#1B4C86;
  /* 文本 / 描边 / 底色 */
  --text-1:#1A2533; --text-2:#4C5A6E; --text-3:#7E8A9A;
  --border:#DFE6EE; --border-strong:#C7D2E0; --bg:#F4F7FB;
  /* 圆角：蓝白商务（卡片 8px / 控件 6px）；投影取消，一律改用细描边（浮动层除外） */
  --radius-card:8px; --radius-btn:6px; --radius-input:6px; --radius-pill:6px;
  --shadow-card:none; --shadow-hover:none;
  /* 本布局自用令牌 */
  --wb-blue:#1B4C86; --wb-blue-l:#EDF2F9; --wb-blue-line:#C4D6EA;
  --wb-navy:#0A1F3C; --wb-line:#DFE6EE; --wb-line-2:#EDF1F6;
  --wb-mute:#F2F5F9; --wb-r:6px;
}

/* ============ 1b. 工作台底色：去身份主题的彩色渐变铺底 ============ */
/* 原身份主题会在 body 铺一层大面积彩色渐变 + 淡影水印（cert.css），
   数据密集的工作台里显得很杂，也与门户的扁平观感冲突；
   统一压平为干净浅灰底（沿用认证数据页既有的 page-flat 思路）。 */
body.cert-theme,
body.cert-theme.cert-personal,
body.cert-theme.cert-school,
body.cert-theme.cert-legal { background:var(--bg) !important; }
body.cert-theme::before { display:none !important; }

/* ============ 2. 侧边栏：白底细描边 + 直角导航 + 左侧强调条 ============ */
.sidebar { background:#fff; border-right:1px solid var(--wb-line); }
/* 顶部藏蓝细条：由渐变改为纯色，与顶栏 3px 藏蓝边对齐成一条通栏基准线 */
.sidebar::before { background:var(--wb-navy); height:3px; }

.side-logo { border-bottom:1px solid var(--wb-line); padding:17px 16px 13px; position:relative; }
.side-logo::after { content:""; position:absolute; left:0; top:3px; bottom:0; width:3px; background:var(--wb-navy); opacity:.9; }
.side-logo .logo-mark { width:34px; height:34px; }
.logo-txt b { color:var(--wb-navy); font-weight:700; letter-spacing:.6px; }
.logo-txt span { color:var(--text-3); letter-spacing:.3px; }
.side-nav { padding:8px 10px 12px; }

.nav-item { border-radius:2px; padding:9px 12px; margin:1px 0; }
.nav-item:hover { background:var(--wb-blue-l); color:var(--wb-blue); }
.nav-item.active { background:var(--wb-blue-l); color:var(--wb-blue); font-weight:600; box-shadow:inset 3px 0 0 var(--wb-blue); }
.nav-group.open .nav-parent { color:var(--wb-blue); font-weight:600; }
.nav-toggle { border-radius:2px; }
.nav-toggle:hover { background:var(--wb-blue-l); color:var(--wb-blue); }
/* 子菜单：缩进 + 细引导线，层级更清楚 */
.nav-sub { padding-left:12px; margin-left:8px; border-left:1px solid var(--wb-line-2); }
.nav-sub .nav-item { font-size:13px; padding:8px 10px; }

/* 角标 / 红点：方形细签，数字用等宽 */
.nav-badge, .dot-badge {
  border-radius:2px; font-variant-numeric:tabular-nums;
  box-shadow:none; border:1px solid rgba(255,255,255,.85);
}
.nav-badge { min-width:18px; height:17px; background:#C8161D; }
.dot-badge { min-width:18px; height:17px; background:#C8161D; }
.nav-dot { width:6px; height:6px; border-radius:0; box-shadow:0 0 0 2px #fff; }

.side-foot { border-top:1px solid var(--wb-line); }
.side-user-txt b { color:var(--text-1); }
.side-user-txt span { color:var(--text-3); }
/* 头像统一微圆角（方形观感），不再用全圆 */
.avatar { border-radius:4px; }

/* ============ 3. 顶栏：白底 + 3px 藏蓝顶边 + 细描边 ============ */
.topbar { background:#fff; border-bottom:1px solid var(--wb-line); border-top:3px solid var(--wb-navy); }
.topbar-title h1 { color:var(--wb-navy); font-weight:800; letter-spacing:.4px; }
.subtitle { color:var(--text-3); }
.search-capsule { border-radius:var(--wb-r); background:#fff; border:1px solid var(--wb-line); }
.search-capsule:hover { border-color:var(--wb-blue-line); }
.icon-btn { border-radius:2px; background:#fff; border:1px solid var(--wb-line); color:var(--text-2); }
.icon-btn:hover { background:var(--wb-blue-l); border-color:var(--wb-blue-line); color:var(--wb-blue); }
.icon-btn:active { background:#DCEAFB; }
.sidebar-toggle, .mobile-menu-btn { border-radius:2px; background:#fff; border:1px solid var(--wb-line); color:var(--text-2); }
.sidebar-toggle:hover, .mobile-menu-btn:hover { background:var(--wb-blue-l); border-color:var(--wb-blue-line); color:var(--wb-blue); }

/* 用户下拉：直角细边、无尖角气泡、无投影 */
.user-dropdown { border-radius:var(--wb-r); border:1px solid var(--wb-line); box-shadow:0 6px 18px rgba(11,39,64,.10); }
.user-dropdown::before { display:none; }
.user-dropdown a { border-radius:2px; }
.dropdown-head { border-bottom:1px solid var(--wb-line); }
.dropdown-head b { color:var(--text-1); }

/* ============ 4. 内容区与面包屑 ============ */
.content { padding:22px 28px 48px; }
.breadcrumb .bc-sep { opacity:.42; }
.breadcrumb .bc-cur { color:var(--text-1); }

/* 区块标题：左侧强调条（对齐门户 .pt-sec__title） */
.page-head h2 { display:inline-flex; align-items:center; gap:9px; color:var(--wb-navy); font-weight:800; }
.page-head h2::before { content:""; width:3px; height:20px; background:var(--wb-blue); flex-shrink:0; }
.card-title, .sec-title { border-left:3px solid var(--wb-blue); padding-left:10px; }
.card-head h3 { border-left:3px solid var(--wb-blue); padding-left:9px; }
.card-title { color:var(--wb-navy); font-weight:800; }

/* ============ 5. 卡片 / 面板：细描边替代投影 ============ */
.card, .table-card, .stat-card, .panel, .app-card, .announce-bar, .alert,
.upload-zone, .batch-bar, .sms-status, .conv-row {
  border-radius:var(--wb-r); box-shadow:none; border:1px solid var(--wb-line); background:#fff;
}
.card:hover, .stat-card:hover, .conv-row:hover { box-shadow:none; transform:none; border-color:var(--wb-blue-line); }
.card + .card { margin-top:14px; }
.sms-tip { border-radius:var(--wb-r); }
.sms-tip code { border-radius:2px; }
code { border-radius:2px; }

/* ============ 6. 按钮：直角细边、去发光 ============ */
.btn, .btn-arrow { border-radius:var(--wb-r); }
.btn:hover { box-shadow:none; }
.btn-ghost, .btn-soft { border-radius:var(--wb-r); }
.btn-chamfer { border-radius:2px; }

/* ============ 7. 表单：微圆角细描边 ============ */
.input, .select, .textarea { border-radius:var(--wb-r); border:1px solid var(--wb-line); }
.input:focus, .select:focus, .textarea:focus { border-color:var(--wb-blue); box-shadow:0 0 0 2px var(--wb-blue-l); }
.upload-zone { border-width:1px; border-radius:var(--wb-r); }
.upload-zone .up-preview { border-radius:var(--wb-r); }
.fa-box { border-radius:var(--wb-r); }
.fa-item { border-radius:var(--wb-r); }
.fa-ic { border-radius:2px; }
.fa-add { border-radius:var(--wb-r); border-width:1px; }
.fa-by { border-radius:2px; }
.captcha-q { border-radius:2px; }
.err-box, .ok-box { border-radius:var(--wb-r); }

/* ============ 8. 表格：政务式高密度排布 ============ */
table.list th { background:var(--wb-mute); color:var(--text-2); border-bottom:1px solid var(--wb-line); }
table.list td { border-bottom:1px solid var(--wb-line-2); }
table.list tr:hover td { background:#FBFDFF; }

/* ============ 9. 徽标 / 标签 / 状态签：方形细边，方形点 ============ */
.badge, .tag, .chip { border-radius:2px; }
.badge::before { border-radius:0; }
.tab-badge { border-radius:2px; }
.todo-src, .todo-flag, .src-flow, .src-biz, .src-cert, .src-cc, .src-task, .src-conv,
.flag-overdue, .flag-new, .flag-aging, .flag-unread { border-radius:2px; }
.todo-item { border-radius:0; }
.todo-item:hover { border-radius:2px; }
.stat-card .stat-trend { border-radius:2px; }
.conv-no, .empno { border-radius:2px; }
.conv-head-badge { border-radius:2px; }
.conv-unread { border-radius:2px; }
.ac-flow-step { border-radius:2px; }
.batch-bar .batch-count { border-radius:2px; }

/* 图标底：方形底替代大圆角渐变块 */
.stat-card .stat-ic, .app-ic, .app-item { border-radius:3px; }
.app-ic { box-shadow:none; background:var(--wb-blue-l) !important; color:var(--wb-blue) !important; }
.app-cell { border-radius:3px; }
.app-cell:hover { background:var(--wb-blue-l); }
.stat-card:hover { border-color:var(--wb-blue-line); }
.stat-card .stat-num { font-variant-numeric:tabular-nums; font-weight:700; }

/* ============ 10. 分页 / 标签页 ============ */
.pagination a, .pagination span { border-radius:2px; }
.pagination .cur { border-radius:2px; }
.tab.active::after { border-radius:0; height:2px; }
.tab .tab-count { border-radius:2px; }
.tab-badge.has-new { border-radius:2px; }

/* ============ 11. 提示条 / 弹窗 / 抽屉 ============ */
.toast { border-radius:var(--wb-r); border:1px solid var(--wb-line); box-shadow:none; }
.toast-float { box-shadow:0 8px 24px rgba(11,39,64,.12); }
.modal { border-radius:var(--wb-r); border:1px solid var(--wb-line); box-shadow:0 16px 40px rgba(11,39,64,.20); }
.modal-actions { border-top:1px solid var(--wb-line); }
.drawer { box-shadow:-8px 0 28px rgba(11,39,64,.14); border-left:1px solid var(--wb-line); }
.drawer-head { border-bottom:1px solid var(--wb-line); }
.drawer-close { border-radius:2px; border:1px solid var(--wb-line); background:#fff; }
.drawer-close:hover { background:var(--danger-soft); color:var(--danger); border-color:#F3C6C2; }
.icon-btn-plain { border-radius:2px; }

/* ============ 12. 办件沟通 / 会话 / 消息气泡 ============ */
/* 头像由全圆收敛为方形微圆角；渐变底改为纯色 */
.conv-av { border-radius:3px; background:var(--wb-blue); }
.msg-av { border-radius:3px; }
.msg, .msg.is-me .msg-bubble, .msg-bubble { border-radius:var(--wb-r); }
.chat-text, .rate-text { border-radius:var(--wb-r); }
.conv-time, .todo-time, .msg-time { font-variant-numeric:tabular-nums; }

/* ============ 13. 杂项组件收敛 ============ */
.skeleton { border-radius:3px; }
.verify-photo { border-radius:3px; border-width:1px; border-color:var(--wb-line); }
.cert-paper { border-radius:var(--wb-r); box-shadow:none; }
.cert-paper .cert-paper-inner { border-radius:2px; }
.cert-paper .cert-rule { border-radius:0; }
.rate-card, .rate-summary, .rate-tip, .rate-text-item { border-radius:var(--wb-r); }
::-webkit-scrollbar-thumb { border-radius:2px; }
.sidebar-collapsed .nav-group:hover .nav-sub { border-radius:var(--wb-r); border:1px solid var(--wb-line); box-shadow:0 8px 24px rgba(11,39,64,.12); }
.sidebar-collapsed .nav-badge { border-radius:2px; }

/* ============ 14. 移动端底部标签栏：纯白底 + 方形角标 ============ */
@media (max-width:768px) {
  .m-tabbar { background:#fff; -webkit-backdrop-filter:none; backdrop-filter:none; border-top:1px solid var(--wb-line); }
  .m-tab .bd { border-radius:2px; font-variant-numeric:tabular-nums; }
  .card { border-radius:var(--wb-r); }
  .modal { border-radius:var(--wb-r); }
}

/* Unified theme: gov-service blue (align portal) */
:root{
  --primary:#3180FE; --primary-deep:#1E63D8; --primary-soft:#EEF6FF; --primary-line:#D6E8FF;
  --navy-700:#3180FE; --accent:#3180FE; --bg:#F3F5F9;
  --wb-blue:#3180FE; --wb-blue-l:#EEF6FF; --wb-blue-line:#D6E8FF; --wb-mute:#F7FAFF;
}