/* ============================================================
   许鲜集采 · 三后台设计系统 v5 — 主题 token + 布局骨架
   方向：生鲜品牌绿 · 统一系统 + 角色强调色 · 视觉+布局重构
   作用域：dcat-admin 全局（侧栏 / 顶栏 / 内容区 / 菜单 / 标题）
   角色强调色由各 app 的 role-theme.css 覆写 --xx-brand* token。
   ============================================================ */
:root {
  /* —— 品牌 / 强调色（默认平台绿；role-theme.css 按角色覆写）—— */
  --xx-brand: #10976a;
  --xx-brand-strong: #0c7a55;
  --xx-brand-deep: #0a5f43;
  --xx-brand-soft: #e7f6ef;
  --xx-brand-tint: #f1faf5;
  --xx-brand-ring: rgba(16, 151, 106, 0.16);

  /* —— 语义色 —— */
  --xx-accent: #cf7e23;
  --xx-danger: #d24b48;
  --xx-danger-soft: #fdeceb;
  --xx-danger-ink: #b23b38;
  --xx-warning: #c9820a;
  --xx-warning-soft: #fdf3df;
  --xx-warning-ink: #9a6207;
  --xx-info: #2b7fb8;
  --xx-info-soft: #e6f2fa;
  --xx-info-ink: #1f6391;

  /* —— 中性色 —— */
  --xx-text: #16202c;
  --xx-text-soft: #4a5666;
  --xx-muted: #73808f;
  --xx-border: #e7ecf1;
  --xx-border-strong: #d6dde5;
  --xx-page: #f3f6f5;
  --xx-surface: #ffffff;
  --xx-surface-soft: #f8faf9;

  /* —— 侧栏（深色：深绿-石板，平台感偏绿，蓝/琥珀强调色亦可协调）—— */
  --xx-side-bg: #0f1a17;
  --xx-side-bg-2: #0b1310;
  --xx-side-ink: #c5d3cc;
  --xx-side-ink-2: #859488;
  --xx-side-hover: rgba(255, 255, 255, 0.06);
  --xx-side-border: rgba(255, 255, 255, 0.07);

  /* —— 圆角 / 阴影 / 尺寸 —— */
  --xx-radius-sm: 6px;
  --xx-radius-md: 9px;
  --xx-radius-lg: 13px;
  --xx-shadow-sm: 0 1px 2px rgba(16, 32, 44, 0.05), 0 1px 3px rgba(16, 32, 44, 0.04);
  --xx-shadow-md: 0 4px 12px rgba(16, 32, 44, 0.06), 0 2px 6px rgba(16, 32, 44, 0.04);
  --xx-shadow-lg: 0 14px 40px rgba(16, 32, 44, 0.12);
  --xx-control-height: 38px;
}

html,
body {
  color: var(--xx-text);
  background: var(--xx-page);
  font-size: 14px;
  letter-spacing: 0;
  -webkit-font-smoothing: antialiased;
}

::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: #cfd8d3; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: #b8c4bd; }

/* ========== 侧栏容器（深色生鲜绿）========== */
.main-sidebar,
.sidebar,
.main-menu,
.main-menu-content,
.left-side,
.left-side-menu {
  background: linear-gradient(180deg, var(--xx-side-bg), var(--xx-side-bg-2)) !important;
  color: var(--xx-side-ink);
  border-right: none !important;
}
.main-sidebar::-webkit-scrollbar-thumb,
.sidebar::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.12); }

/* 侧栏品牌 / logo 区 */
.main-sidebar .logo,
.main-sidebar .brand-link,
.sidebar .logo,
.logo-mini,
.logo-lg {
  color: #fff !important;
  font-weight: 800 !important;
  letter-spacing: .3px;
  border-bottom: 1px solid var(--xx-side-border) !important;
  background: transparent !important;
}
.main-sidebar .logo img,
.sidebar .logo img { border-radius: 9px; }

/* ========== 顶栏（浅色 surface）========== */
.main-header,
.navbar,
.header-navbar,
.content-header.navbar {
  background: var(--xx-surface) !important;
  border-bottom: 1px solid var(--xx-border) !important;
  box-shadow: var(--xx-shadow-sm);
}
.navbar .nav-link,
.main-header .nav-link { color: var(--xx-text-soft) !important; }
.navbar .nav-link:hover,
.main-header .nav-link:hover { color: var(--xx-brand-strong) !important; }

/* ========== 内容区 ========== */
.content-wrapper,
.app-content,
.main-content,
.content {
  background: var(--xx-page) !important;
}

/* ========== 侧栏菜单项 ========== */
.main-menu .navigation > li > a,
.main-menu .navigation .menu-content > li > a,
.sidebar-menu li a,
.left-side-menu li a,
.dropdown-menu.show .vertical-menu li a {
  color: var(--xx-side-ink) !important;
  border-radius: var(--xx-radius-md);
  margin: 2px 10px;
  font-weight: 500;
  transition: .16s;
}
.main-menu .navigation > li > a > i,
.sidebar-menu li a i { color: var(--xx-side-ink-2) !important; }

.main-menu .navigation > li > a:hover,
.main-menu .navigation .menu-content > li > a:hover,
.sidebar-menu li a:hover,
.left-side-menu li a:hover {
  color: #fff !important;
  background: var(--xx-side-hover) !important;
}

.main-menu .navigation > li.active > a,
.main-menu .navigation > li.open > a,
.main-menu .navigation .menu-content > li.active > a,
.sidebar-menu li.active > a,
.sidebar-menu li.menu-open > a,
.left-side-menu li.active > a {
  color: #fff !important;
  background: linear-gradient(90deg, var(--xx-brand), var(--xx-brand-strong)) !important;
  box-shadow: 0 6px 16px var(--xx-brand-ring);
}
.main-menu .navigation > li.active > a > i,
.sidebar-menu li.active > a i { color: #fff !important; }

/* 菜单分组标题 */
.main-menu .navigation-header,
.sidebar-menu .header {
  color: var(--xx-side-ink-2) !important;
  font-size: 11px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  font-weight: 700;
  padding: 16px 22px 7px !important;
}

/* ========== 页面标题 / 面包屑 ========== */
.content-header h1,
.content-header .content-header-title,
.content-header-title {
  color: var(--xx-text);
  font-size: 22px;
  font-weight: 800;
  letter-spacing: .2px;
}
.breadcrumb,
.content-header .breadcrumb {
  color: var(--xx-muted);
  font-size: 13px;
  background: transparent;
}
.breadcrumb a { color: var(--xx-text-soft); }
.breadcrumb a:hover { color: var(--xx-brand-strong); }