/*! ============================================================
 * modern-compat.css · 双后台壳兼容层
 *
 * 由 include.php 通过官方钩子 Filter_Plugin_Admin_Header 注入。
 * 该钩子在 admin2 主页面（template/index.php）与插件自带后台页
 * （zb_system/admin/admin_header.php）都会触发，所以这是解决
 * 「一点进插件管理就退回原生后台 UI」的正路：不再靠 iframe 硬扛，
 * 而是让样式本身覆盖两套外壳。
 *
 * 【作用域收口】全部规则以 body.body-admin 开头。
 *   · admin2 主页面是 body.admin → 一条都不匹配，override.css 完全不受影响；
 *   · 登录页是 body.admin-login → 同样不匹配；
 *   · 只有 require 旧后台头的插件 / 主题页面（body.body-admin）命中。
 *
 * 【为什么必须"显式复位"】参考 Ai_ui DESIGN.md 第 9.1 节：
 * 旧后台头加载的是 zb_system/css/admin2.css，它给 #leftmenu li/a/span、
 * .left、.menu、.user、#divMain 声明了大量 float / 固定宽高 / margin。
 * 只让选择器"匹配得上"不够 —— 那些我们没声明的属性会原样泄漏，
 * 典型症状是侧栏 span 浮动收缩导致文字折行、li 高度锁死 32px 造成
 * 上下两行文字重叠。凡旧表声明过而本层不需要的，这里逐条清零。
 *
 * 【与 plugin-bridge.css 的分工】
 *   · 本层：布局复位 + 设计令牌 + 基础观感（整页打开与 iframe 内都生效）；
 *   · plugin-bridge.css：iframe load 后由 modern-embed.js 注入，负责隐藏旧壳
 *     与白卡片重绘。它在 <head> 里更靠后，!important 规则自然覆盖本层，
 *     两者不冲突（隐藏优先于上色）。
 * ============================================================ */

/* ---------- 设计令牌（定义在 body 上，只向下传播，不污染其它页面） ---------- */
body.body-admin {
  --bm-primary: #2563eb;
  --bm-primary-soft: #e8effd;
  --bm-surface: #ffffff;
  --bm-background: #f6f7f9;
  --bm-border: #e8ebf0;
  --bm-text: #1f2937;
  --bm-muted: #6b7280;
  --bm-side: 216px;
  --bm-top: 60px;
  --bm-focus: 0 0 0 3px rgba(37, 99, 235, 0.18);
}

/* ---------- 基础：解除旧表固定宽度与字体 ---------- */
body.body-admin {
  min-width: 0 !important;
  width: 100% !important;
  margin: 0;
  padding: 0;
  color: var(--bm-text);
  background: var(--bm-background);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei",
               "PingFang SC", "Hiragino Sans GB", sans-serif;
  font-size: 14px;
  line-height: 1.6;
}

body.body-admin :focus-visible {
  outline: none;
  box-shadow: var(--bm-focus);
}

/* ---------- 顶栏：旧表 .header 是 85px 深蓝块 ---------- */
body.body-admin .header {
  height: auto;
  min-height: var(--bm-top);
  margin: 0;
  padding: 0 18px;
  background: var(--bm-surface);
  border-bottom: 1px solid var(--bm-border);
  box-sizing: border-box;
  color: var(--bm-text);
}

/* .user / .menu / #avatar 的绝对定位与浮动复位 */
body.body-admin .user {
  position: static;
  width: auto;
  height: auto;
  text-align: right;
  color: var(--bm-text);
}
body.body-admin .user #avatar,
body.body-admin #avatar {
  float: none;
  margin-left: 0;
}
body.body-admin .username,
body.body-admin .user-name {
  height: auto;
  line-height: inherit;
  overflow: visible;
}
body.body-admin .userbtn a,
body.body-admin .user-btn a {
  margin-left: 12px;
  color: var(--bm-primary);
  height: auto;
  text-shadow: none;
}
body.body-admin .menu {
  position: static;
  height: auto;
  left: auto;
  right: auto;
  bottom: auto;
}
body.body-admin .menu ul,
body.body-admin .menu ul li,
body.body-admin .menu ul li a,
body.body-admin .menu ul li a:hover {
  float: none;
  height: auto;
  line-height: inherit;
  margin: 0;
  overflow: visible;
  background: transparent;
  color: var(--bm-text);
  text-shadow: none;
}
body.body-admin .menu ul li a:hover {
  color: var(--bm-primary);
}

/* ---------- 侧栏：属性泄漏的重灾区 ---------- */
body.body-admin .left {
  float: left;
  position: relative;
  width: var(--bm-side);
  min-height: calc(100vh - var(--bm-top));
  padding: 12px 10px;
  margin: 0;
  background: var(--bm-surface);
  border-right: 1px solid var(--bm-border);
  box-sizing: border-box;
  overflow: visible;
}

/* 旧表：li/a 是 float:left; width:140px; height:32px；span 是 float:left;
   width:auto; margin-left:24px —— 不显式清零就会文字折行 + 行高重叠。 */
body.body-admin #leftmenu li,
body.body-admin #leftmenu a,
body.body-admin #leftmenu span {
  float: none;
  width: auto;
  height: auto;
  line-height: inherit;
  margin-left: 0;
  padding-right: 0;
  text-align: left;
}
body.body-admin #leftmenu li {
  margin-bottom: 2px;
  background: transparent;
  border-radius: 8px;
}
body.body-admin #leftmenu a {
  display: block;
  padding: 8px 12px;
  border-radius: 8px;
  color: var(--bm-text);
  text-decoration: none;
}
body.body-admin #leftmenu a:hover {
  background: var(--bm-primary-soft);
  color: var(--bm-primary);
}
body.body-admin #leftmenu li.on a,
body.body-admin #leftmenu .on a {
  background: var(--bm-primary-soft);
  color: var(--bm-primary);
  font-weight: 600;
}
body.body-admin #leftmenu span {
  background-image: none;
  padding-left: 0;
  overflow: visible;
}
body.body-admin #leftmenu li span i {
  margin-right: 8px;
  margin-left: 0;
  line-height: inherit;
  height: auto;
}

/* ---------- 内容区：必须撑满，绝不设 max-width ----------
 * Ai_ui DESIGN.md 9.2：给栅格项 .main 加 max-width 会截断拉伸，
 * 剩余空间全挤到右侧形成空白带；浮动盒同样不参与列拉伸。 */
body.body-admin .main {
  float: none;
  width: auto;
  max-width: none;
  min-width: 0;
  margin-left: var(--bm-side);
  padding: 16px;
  box-sizing: border-box;
  background: transparent;
}

body.body-admin #divMain,
body.body-admin #divMain2 {
  float: none;
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
}
body.body-admin #divMain a,
body.body-admin #divMain2 a {
  color: var(--bm-primary);
}
body.body-admin #divMain a:hover,
body.body-admin #divMain2 a:hover {
  color: #1d4ed8;
}

/* ---------- 子菜单 / 表格 / 表单：轻量统一，重绘交给 plugin-bridge.css ---------- */
body.body-admin .SubMenu span,
body.body-admin .SubMenu a {
  float: none;
  height: auto;
  line-height: inherit;
  margin: 0 6px 6px 0;
  padding: 6px 12px;
  border-radius: 8px;
  color: var(--bm-text);
  background: var(--bm-surface);
  text-decoration: none;
}
body.body-admin .SubMenu span.m-now,
body.body-admin .SubMenu a.m-now {
  color: #ffffff;
  background: var(--bm-primary);
}
body.body-admin .tableFull,
body.body-admin .tableBorder,
body.body-admin .table_hover,
body.body-admin .table_striped {
  width: 100%;
  border-collapse: collapse;
  background: var(--bm-surface);
}
body.body-admin .tableFull th,
body.body-admin .tableBorder th {
  background: var(--bm-background);
  font-weight: 600;
  text-align: left;
}
body.body-admin input[type="text"],
body.body-admin input[type="password"],
body.body-admin input[type="number"],
body.body-admin input[type="url"],
body.body-admin input[type="email"],
body.body-admin select,
body.body-admin textarea {
  box-sizing: border-box;
  max-width: 100%;
  padding: 7px 10px;
  color: var(--bm-text);
  background: var(--bm-surface);
  border: 1px solid #dfe3e9;
  border-radius: 8px;
  font: inherit;
  font-size: 13px;
}

/* ---------- 暗色：整页 .night 与弹层同步到 <html> 的 .night 都支持 ---------- */
html.night body.body-admin,
body.body-admin.night {
  --bm-primary: #3b82f6;
  --bm-primary-soft: #1e2a44;
  --bm-surface: #1a1b1e;
  --bm-background: #131417;
  --bm-border: #2b2e33;
  --bm-text: #e3e6ea;
  --bm-muted: #9ca3af;
  --bm-focus: 0 0 0 3px rgba(59, 130, 246, 0.28);
  color: var(--bm-text);
  background: var(--bm-background);
}
html.night body.body-admin .header,
body.body-admin.night .header,
html.night body.body-admin .left,
body.body-admin.night .left {
  background: var(--bm-surface);
  border-color: var(--bm-border);
}
html.night body.body-admin .tableFull,
html.night body.body-admin .tableBorder,
body.body-admin.night .tableFull,
body.body-admin.night .tableBorder {
  background: var(--bm-surface);
}
html.night body.body-admin .tableFull th,
html.night body.body-admin .tableBorder th,
body.body-admin.night .tableFull th,
body.body-admin.night .tableBorder th {
  background: #222429;
}
html.night body.body-admin #divMain a,
html.night body.body-admin #divMain2 a,
body.body-admin.night #divMain a,
body.body-admin.night #divMain2 a {
  color: #60a5fa;
}

/* ---------- 响应式：窄屏退回单栏，避免 216px 侧栏挤压内容 ---------- */
@media screen and (max-width: 992px) {
  body.body-admin .left {
    float: none;
    width: 100%;
    min-height: 0;
    border-right: 0;
    border-bottom: 1px solid var(--bm-border);
  }
  body.body-admin .main {
    margin-left: 0;
  }
}
