/* ============================================================
   后台 UI 重构覆盖层 · 按 system-manage 风格（方案稿已确认）
   仅在 .admin-layout 作用域生效，不影响前台学生端
   设计 token：主色 #2563eb / 侧栏深 #1e293b / 工作区 #f1f5f9
               卡片白 / 边框 #e2e8f0 / 圆角 12 / 正文 #1e293b
   ============================================================ */

/* ---------- 1. 主题变量重定义（后台作用域，天然覆盖全部后台组件） ---------- */
.admin-layout{
  --primary:#2563eb;
  --primary-hover:#3b82f6;
  --primary-active:#1d4ed8;
  --primary-weak:rgba(37,99,235,.10);
  --primary-gradient:linear-gradient(135deg,#2563eb 0%,#3b82f6 100%);
  --danger:#ef4444;
  --danger-hover:#dc2626;
  --success:#16a34a;
  --success-hover:#15803d;
  --warning:#f59e0b;
  --info:#0ea5e9;
  --text:#1e293b;
  --text-2:#475569;
  --text-3:#64748b;
  --bg:#f1f5f9;
  --bg-gradient:linear-gradient(180deg,#f1f5f9 0%,#f1f5f9 100%);
  --card:#ffffff;
  --card-solid:#ffffff;
  --border:#e2e8f0;
  --border-light:#f1f5f9;
  --radius:12px;
  --radius-sm:10px;
  --radius-xs:8px;
  --shadow-xs:0 1px 2px rgba(15,23,42,.04);
  --shadow-sm:0 1px 3px rgba(15,23,42,.06),0 1px 2px rgba(15,23,42,.04);
  --shadow-md:0 8px 24px rgba(15,23,42,.08),0 4px 10px rgba(15,23,42,.04);
  --shadow-lg:0 16px 48px rgba(15,23,42,.12),0 8px 20px rgba(15,23,42,.06);
  --shadow-primary:0 6px 20px rgba(37,99,235,.28);
  --glass-bg:#ffffff;
  --glass-border:#e2e8f0;
  --glass-highlight:rgba(255,255,255,.9);
  --blur:blur(0px);
  --c-blue:#2563eb;   --c-blue-bg:rgba(37,99,235,.08);
  --c-green:#16a34a;  --c-green-bg:rgba(22,163,74,.08);
  --c-orange:#f59e0b; --c-orange-bg:rgba(245,158,11,.08);
  --c-purple:#7c3aed; --c-purple-bg:rgba(124,58,237,.08);
  --c-teal:#0d9488;   --c-teal-bg:rgba(13,148,136,.08);
  --c-red:#ef4444;    --c-red-bg:rgba(239,68,68,.08);
  --c-gold:#f59e0b;   --c-gold-bg:rgba(245,158,11,.10);
  --c-mint:#16a34a;   --c-mint-bg:rgba(22,163,74,.08);
  background:#f1f5f9 !important;
}

/* ---------- 2. 侧边栏：深色 #1e293b ---------- */
.admin-layout .admin-side{
  background:#1e293b !important;
  border-right:1px solid rgba(255,255,255,.06) !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.admin-layout .side-brand{border-bottom:1px solid rgba(255,255,255,.08) !important;}
.admin-layout .brand-name{color:#ffffff !important;}
.admin-layout .brand-sub{color:#94a3b8 !important;}
.admin-layout .brand-logo-img{box-shadow:none !important;}
.admin-layout .brand-icon{background:linear-gradient(135deg,#2563eb,#3b82f6) !important;box-shadow:none !important;}
.admin-layout .side-nav{padding:12px 10px !important;}
.admin-layout .nav-group-title{color:#64748b !important;}
.admin-layout .side-nav a{
  color:#cbd5e1 !important;
  border-radius:8px !important;
  margin-bottom:2px !important;
}
.admin-layout .side-nav a:hover{background:rgba(255,255,255,.06) !important;color:#ffffff !important;}
.admin-layout .side-nav a.router-link-active,
.admin-layout .side-nav a.router-link-exact-active{
  background:#2563eb !important;
  color:#ffffff !important;
  font-weight:600 !important;
  box-shadow:0 4px 12px rgba(37,99,235,.35) !important;
}
.admin-layout .nav-icon{color:currentColor !important;}
.admin-layout .side-foot{border-top:1px solid rgba(255,255,255,.08) !important;}
.admin-layout .foot-link{color:#93c5fd !important;}
.admin-layout .foot-link:hover{background:rgba(37,99,235,.16) !important;}
.admin-layout .logout-btn{
  background:rgba(255,255,255,.06) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  color:#cbd5e1 !important;
}
.admin-layout .logout-btn:hover{border-color:#ef4444 !important;color:#f87171 !important;background:rgba(239,68,68,.12) !important;}
/* 汉堡按钮位于顶栏（白色背景），需深色可见；侧栏抽屉内的场景由 7.1b 覆盖 */
.admin-layout .menu-btn{background:#ffffff !important;border:1px solid #e2e8f0 !important;color:#1e293b !important;}
.admin-layout .menu-btn:hover{background:#f8fafc !important;color:#2563eb !important;border-color:#2563eb !important;}

/* ---------- 3. 顶栏 / 页脚：白色实心 ---------- */
.admin-layout .admin-topbar{
  background:#ffffff !important;
  border-bottom:1px solid #e2e8f0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.admin-layout .topbar-title{color:#1e293b !important;}
.admin-layout .user-avatar{background:linear-gradient(135deg,#2563eb,#3b82f6) !important;}
.admin-layout .user-name{color:#1e293b !important;}
.admin-layout .user-role{color:#64748b !important;}
.admin-layout .admin-footer{
  background:#ffffff !important;
  border-top:1px solid #e2e8f0 !important;
  color:#64748b !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

/* ---------- 4. 数据概览（Dashboard）卡片化 ---------- */
.admin-layout .dashboard{background:transparent !important;border-radius:0 !important;}
.admin-layout .page-title{
  background:none !important;
  -webkit-text-fill-color:#1e293b !important;
  color:#1e293b !important;
  font-weight:800 !important;
}
.admin-layout .page-sub{color:#64748b !important;}
.admin-layout .header-actions{
  background:#ffffff !important;
  border:1px solid #e2e8f0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.admin-layout .live-dot{background:#16a34a !important;box-shadow:0 0 0 3px rgba(22,163,74,.15) !important;}
.admin-layout .live-text{color:#16a34a !important;}
.admin-layout .stat-card{
  background:#ffffff !important;
  border:1px solid #e2e8f0 !important;
  border-radius:12px !important;
  box-shadow:0 1px 2px rgba(15,23,42,.04) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.admin-layout .stat-card:before{display:none !important;}
.admin-layout .stat-card:hover{box-shadow:0 8px 24px rgba(37,99,235,.10) !important;transform:translateY(-2px) !important;}
.admin-layout .stat-icon{background:var(--primary-weak) !important;color:var(--primary) !important;}
.admin-layout .stat-num{color:#1e293b !important;}
.admin-layout .stat-label{color:#64748b !important;}
.admin-layout .stat-foot{color:#64748b !important;}

/* ---------- 5. 通用卡片 / 表格 / 面板（各管理页） ---------- */
.admin-layout .card{
  background:#ffffff !important;
  border:1px solid #e2e8f0 !important;
  border-radius:12px !important;
  box-shadow:0 1px 2px rgba(15,23,42,.04) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.admin-layout .card-header{border-bottom:1px solid #e2e8f0 !important;}
.admin-layout .table-wrap{border:1px solid #e2e8f0 !important;border-radius:12px !important;overflow:hidden !important;}
.admin-layout .data-table th{background:#f8fafc !important;color:#64748b !important;font-weight:600 !important;border-bottom:1px solid #e2e8f0 !important;}
.admin-layout .data-table td{border-bottom:1px solid #f1f5f9 !important;color:#1e293b !important;}
.admin-layout .data-table tr:hover td{background:#f8fafc !important;}
/* 统一所有后台表格表头为 #f8fafc（兼容 .data-table 之外的表格类名：题目/用户/题库/考试等） */
.admin-layout table th{background:#f8fafc !important;color:#64748b !important;font-weight:600 !important;border-bottom:1px solid #e2e8f0 !important;}
.admin-layout .batch-bar{
  background:rgba(37,99,235,.05) !important;
  border:1px solid rgba(37,99,235,.20) !important;
  border-radius:10px !important;
}
.admin-layout .row-selected{background:rgba(37,99,235,.05) !important;}

/* ---------- 6. 按钮 / 输入框 / 分页 / 徽标微调 ---------- */
.admin-layout .btn{border-radius:8px !important;}
.admin-layout .btn-primary{background:var(--primary) !important;border-color:var(--primary) !important;}
.admin-layout .btn-primary:hover{background:var(--primary-hover) !important;border-color:var(--primary-hover) !important;}
.admin-layout .input,.admin-layout .select{border-color:#e2e8f0 !important;border-radius:8px !important;background:#ffffff !important;}
.admin-layout .modal-mask{background:rgba(15,23,42,.35) !important;backdrop-filter:blur(8px) !important;}
.admin-layout .modal-wrap{
  background:#ffffff !important;
  border:1px solid #e2e8f0 !important;
  border-radius:14px !important;
  box-shadow:0 24px 64px rgba(15,23,42,.18) !important;
  backdrop-filter:none !important;
}
.admin-layout .modal-header{border-bottom:1px solid #e2e8f0 !important;color:#1e293b !important;}
.admin-layout .modal-footer{border-top:1px solid #e2e8f0 !important;}

/* ---------- 6b. 操作列按钮统一：描边小按钮（编辑蓝 / 删除红） ----------
   仅命中表格操作列（最后列），不影响工具栏/模态框按钮。
   统一：题库文本链接、分类/题目/考试实心红删除、备份蓝删除、btn-sm 尺寸 */
.admin-layout table td:last-child .btn-ghost,
.admin-layout table td:last-child .btn-danger{
  border:1px solid !important;
  background:#ffffff !important;
  padding:4px 10px !important;
  border-radius:8px !important;
  font-size:13px !important;
  font-weight:500 !important;
  line-height:1.4 !important;
  box-shadow:none !important;
}
.admin-layout table td:last-child .btn-ghost{color:#2563eb !important;border-color:#2563eb !important;}
.admin-layout table td:last-child .btn-ghost:hover{background:rgba(37,99,235,.08) !important;border-color:#3b82f6 !important;color:#2563eb !important;}
/* .btn-danger 置于 .btn-ghost 之后，优先级一致时源码顺序胜出，保证「删除」红色描边 */
.admin-layout table td:last-child .btn-danger{color:#ef4444 !important;border-color:#ef4444 !important;}
.admin-layout table td:last-child .btn-danger:hover{background:rgba(239,68,68,.08) !important;border-color:#dc2626 !important;color:#ef4444 !important;}

/* ---------- 7. 以 system-manage.html 为标准对齐（用户确认方向） ----------
   顶栏白色满宽 / 内容 admin-main 居中 1200px / 表头+单元格 13px·9px12px /
   输入框 8px12px / 主按钮 8px16px / ghost 次级中性灰描边(hover 蓝，同 system) /
   btn-danger 描边红 / 页头标题 700 / 卡片间距 18px */
/* 7.1 顶栏白色（用户指定还原为白色，保留 system 的字号/内边距体系） */
.admin-layout .admin-topbar{
  background:#ffffff !important;
  border-bottom:1px solid #e2e8f0 !important;
  box-shadow:none !important;
}
.admin-layout .topbar-title{color:#1e293b !important;}
.admin-layout .user-name{color:#1e293b !important;}
.admin-layout .user-role{background:#f1f5f9 !important;color:#64748b !important;}
.admin-layout .user-avatar{background:linear-gradient(135deg,#2563eb,#3b82f6) !important;}
/* 7.2 内容居中 1200px（admin-main，顶栏保持满宽） */
.admin-layout .admin-main{max-width:1200px !important;width:100% !important;margin:0 auto !important;}
/* 7.2b 顶栏内容与居中内容区左边缘对齐：顶栏满宽背景不变，仅内边距跟随居中偏移
   （大屏 1920 时 main 居中留白 244px，若顶栏仍用 28px padding，标题会与内容错位） */
.admin-layout .admin-topbar{
  padding-left:calc(28px + max(0px, (100% - 1200px) / 2)) !important;
  padding-right:calc(28px + max(0px, (100% - 1200px) / 2)) !important;
}
/* 7.2c 窄屏（≤900px 组件断点）：侧栏收起为抽屉，内容 padding 变为 14px，
   顶栏同步改为 14px，保证汉堡按钮与卡片左边缘对齐 */
@media (max-width: 900px){
  .admin-layout .admin-topbar{
    padding-left:14px !important;
    padding-right:14px !important;
  }
}
/* 7.3 页头标题字重 700（同 system 22px/700） */
.admin-layout .page-title{font-weight:700 !important;}
/* 7.4 表格：表头+单元格 13px / 9px12px（同 system） */
.admin-layout table th{font-size:13px !important;padding:9px 12px !important;}
.admin-layout table td{font-size:13px !important;padding:9px 12px !important;}
/* 7.5 输入框 8px12px（同 system） */
.admin-layout .input,.admin-layout .select,
.admin-layout input[type="text"],.admin-layout input[type="number"],.admin-layout input[type="search"],
.admin-layout input[type="password"],.admin-layout select,.admin-layout textarea{padding:8px 12px !important;}
/* 7.6 按钮尺寸对齐 system（sm-btn 8px16px / sm-btn-sm 5px10px） */
.admin-layout .btn{padding:8px 16px !important;}
.admin-layout .btn.btn-xs{padding:4px 10px !important;}
.admin-layout .btn.btn-sm{padding:5px 10px !important;}
/* 7.7 ghost 次级按钮：中性灰描边，hover 变蓝（同 system sm-btn-ghost）
   —— 操作列编辑/删除保持蓝红（第 6b 节更高特异性优先） */
.admin-layout .btn-ghost{background:#ffffff !important;color:#1e293b !important;border-color:#e2e8f0 !important;}
.admin-layout .btn-ghost:hover{border-color:#2563eb !important;color:#2563eb !important;background:#ffffff !important;}
/* 7.8 btn-danger：描边红（同 system sm-btn-danger），操作列删除同款 */
.admin-layout .btn-danger{background:#ffffff !important;color:#ef4444 !important;border-color:#ef4444 !important;}
.admin-layout .btn-danger:hover{background:#fef2f2 !important;border-color:#dc2626 !important;color:#dc2626 !important;}
/* 7.9 卡片间距 18px（同 system） */
.admin-layout .card{margin-bottom:18px !important;}
/* 7.10 消除页面级重复内边距（题库页 .quiz-bank-page 自带 24px padding，
   与 .admin-main 的 28px 叠加导致卡片比顶栏标题右移 24px） */
.admin-layout .quiz-bank-page{padding:0 !important;}
/* 概览页 .dashboard 左右 2px padding 造成 2px 偏移，归零对齐 */
.admin-layout .dashboard{padding-left:0 !important;padding-right:0 !important;}

/* ---------- 8. 去掉后台彩带/光斑装饰背景（用户指定） ----------
   来源：body::before 右上 500x500、body::after 左下 400x400，
   均为 radial-gradient 蓝色光斑 + filter:blur(80px) + opacity .4 + position:fixed + z-index:0。
   因 .admin-layout 是 static（z-index:auto），这两个 fixed 伪元素浮在其上可见。
   仅后台生效：:has(.admin-layout) 现代浏览器直接命中；另由 admin-bg-clean.js 兜底给
   body 加 .admin-bg-clean 类（覆盖不支持 :has 的旧内核）。
   ---------- */
body:has(.admin-layout)::before,
body:has(.admin-layout)::after,
body.admin-bg-clean::before,
body.admin-bg-clean::after{
  display:none !important;
  content:none !important;
  background:none !important;
  filter:none !important;
}
/* 后台 body 底色统一为工作区浅灰（原 body 为蓝白 linear-gradient） */
body:has(.admin-layout),
body.admin-bg-clean{
  background:#f1f5f9 !important;
  background-image:none !important;
}
/* 兜底版：给后台根容器加独立不透明背景层，确保任何情况下不露装饰 */
body.admin-bg-clean .admin-layout{isolation:isolate;}
