/* ============================================================================
   hh-theme.css — 鸿昊 CRM 统一设计令牌 + 视觉对齐层
   参照原型（桌面 index(4).html，北斗运营系统高保真原型）的设计语言。
   分期：B 期 = 设计令牌 + 主框架（index.html）；C 期 = system 内置页 /
   config / 弹窗 chrome 的 override 陆续追加在本文件后半。
   挂载：include.html header 与 index.html 均在 ry-ui.css 之后引入，
   依赖加载顺序覆盖 style.min.css / skins.css，非必要不用 !important。
   隔离：主框架 override 一律以 #wrapper 前缀限定（仅 index.html 有该节点），
   iframe 业务页只吃到 :root 令牌与页面画布色，互不波及。
   ============================================================================ */

/* ===== 设计令牌（原型 :root 色板） ===== */
:root {
	/* 品牌主色 */
	--hh-primary: #2563EB;
	--hh-primary-light: #EFF6FF;
	--hh-primary-dark: #1E40AF;
	/* 语义色 */
	--hh-success: #16A34A;
	--hh-success-light: #F0FDF4;
	--hh-warning: #D97706;
	--hh-warning-light: #FFFBEB;
	--hh-danger: #DC2626;
	--hh-danger-light: #FEF2F2;
	--hh-purple: #7C3AED;
	--hh-purple-light: #F5F3FF;
	--hh-teal: #0D9488;
	--hh-teal-light: #F0FDFA;
	/* 灰阶（slate） */
	--hh-gray-50: #F8FAFC;
	--hh-gray-100: #F1F5F9;
	--hh-gray-200: #E2E8F0;
	--hh-gray-300: #CBD5E1;
	--hh-gray-400: #94A3B8;
	--hh-gray-500: #64748B;
	--hh-gray-600: #475569;
	--hh-gray-700: #334155;
	--hh-gray-800: #1E293B;
	--hh-gray-900: #0F172A;
	/* 线 / 圆角 / 阴影 */
	--hh-border: #E2E8F0;
	--hh-radius: 8px;
	--hh-shadow: 0 1px 3px rgba(15, 23, 42, .08);
	--hh-shadow-lg: 0 8px 30px rgba(15, 23, 42, .15);
	/* 页面画布 */
	--hh-canvas: #F1F5F9;
}

/* ===== 页面画布（所有页签 iframe 页 + 主框架共用） ===== */
body.gray-bg { background-color: var(--hh-canvas); }

/* ===== 皮肤 = 品牌主色切换（REQ-06：新设计侧栏恒白，skin 决定主色系；
   原 theme-dark/light/blue 侧栏差异已被白底设计取代，不再有视觉作用） ===== */
body.skin-blue   { --hh-primary: #2563EB; --hh-primary-dark: #1E40AF; --hh-primary-light: #EFF6FF; }
body.skin-green  { --hh-primary: #16A34A; --hh-primary-dark: #15803D; --hh-primary-light: #F0FDF4; }
body.skin-purple { --hh-primary: #7C3AED; --hh-primary-dark: #6D28D9; --hh-primary-light: #F5F3FF; }
body.skin-red    { --hh-primary: #DC2626; --hh-primary-dark: #B91C1C; --hh-primary-light: #FEF2F2; }
body.skin-yellow { --hh-primary: #D97706; --hh-primary-dark: #B45309; --hh-primary-light: #FFFBEB; }

/* ===== 主框架：侧边栏白底（原型 sidebar） ===== */
#wrapper .navbar-static-side {
	background: #fff;
	border-right: 1px solid var(--hh-border);
}
#wrapper .logo {
	background: transparent;
	color: var(--hh-gray-900);
	border-bottom: 1px solid var(--hh-border);
}
#wrapper .logo .logo-lg {
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .5px;
	line-height: 50px;
}
/* 品牌方块（纯 CSS 伪元素，不动 DOM） */
#wrapper .logo .logo-lg::before {
	content: '';
	display: inline-block;
	width: 26px;
	height: 26px;
	margin-right: 9px;
	background: var(--hh-primary);
	border-radius: 7px;
	vertical-align: -6px;
}

/* 用户区 */
#wrapper .user-panel { background: transparent; }
#wrapper .user-panel > .info > p,
#wrapper .user-panel > .info,
#wrapper .user-panel > .info > a { color: var(--hh-gray-600); }
#wrapper .user-panel > .info > a:hover { color: var(--hh-primary); }
#wrapper .user-panel .image > img { border: 2px solid var(--hh-gray-200); }

/* 菜单项：胶囊化（原型 nav-item） */
#wrapper #side-menu > li > a {
	margin: 2px 8px;
	border-radius: 6px;
	color: var(--hh-gray-600);
	font-size: 13.5px;
}
#wrapper .navbar-default .nav > li > a:hover,
#wrapper .navbar-default .nav > li > a:focus {
	background: var(--hh-gray-100);
	color: var(--hh-gray-900);
}
/* 展开的分组父级（li.active）：去掉旧深色底，仅字色加重 */
#wrapper .nav:not(.navbar-toolbar) > li.active { background: transparent; }
#wrapper .nav:not(.navbar-toolbar) > li.active > a { color: var(--hh-gray-900); font-weight: 500; }
/* 当前页签对应菜单项（li.selected）：主色胶囊（原型 nav-item.active） */
#wrapper .navbar-default .nav > li.selected > a,
#wrapper .navbar-default .nav > li.selected > a:focus {
	background: var(--hh-primary);
	color: #fff;
}
#wrapper .navbar-default .nav > li.selected > a:hover { background: var(--hh-primary-dark); color: #fff; }
#wrapper .navbar-default .nav > li.selected > a .fa { color: #fff; }

/* 二/三级菜单 */
#wrapper .nav-second-level li a,
#wrapper .nav-third-level li a {
	color: var(--hh-gray-600);
	font-size: 13px;
	border-radius: 6px;
	margin: 1px 8px 1px 40px;
	padding-left: 14px;
}
#wrapper .nav-second-level li a:hover,
#wrapper .nav-third-level li a:hover {
	background: var(--hh-gray-100);
	color: var(--hh-gray-900);
}
#wrapper .nav.nav-second-level > li.active { background: transparent; }
#wrapper .nav.nav-second-level > li.selected > a { background: var(--hh-primary); color: #fff; }

/* ===== 主框架：顶栏（原型 topbar） ===== */
#wrapper nav.navbar-static-top {
	background: #fff;
	border-bottom: 1px solid var(--hh-border);
}
/* 顶栏右侧链接：收紧内边距，为横向页签腾宽度（放不下时按原机制换行，可接受） */
#wrapper .nav.navbar-top-links > li > a { padding-left: 6px; padding-right: 6px; }
/* 汉堡折叠按钮：白底转幽灵按钮（原行内 color:#FFF 需 !important 盖） */
#wrapper .navbar-minimalize.minimalize-styl-2 {
	color: var(--hh-gray-500) !important;
	border-radius: 6px;
	padding: 5px 11px;
}
#wrapper .navbar-minimalize.minimalize-styl-2:hover {
	background: var(--hh-gray-100);
	color: var(--hh-gray-700) !important;
}

/* 顶栏全局搜索（原型 .field input 风格） */
#wrapper .navbar-form .form-control {
	height: 32px;
	border: 1px solid var(--hh-border);
	border-radius: 6px;
	box-shadow: none;
	font-size: 13px;
}
#wrapper .navbar-form .form-control:focus {
	border-color: var(--hh-primary);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, .1);
}
#wrapper .navbar-form .input-group-btn .btn-primary {
	background: var(--hh-primary);
	border-color: var(--hh-primary);
	padding: 5px 12px;
}

/* 顶栏右侧链接 */
#wrapper .nav.navbar-top-links > li > a { color: var(--hh-gray-500); }
#wrapper .nav.navbar-top-links > li > a:hover,
#wrapper .nav.navbar-top-links > li > a:focus { color: var(--hh-gray-900); background: var(--hh-gray-100); }

/* ===== 主框架：页签栏（原型 tab 风格：白底 + 主色浅底活动页签） ===== */
#wrapper .content-tabs {
	background: #fff;
	border-bottom: 1px solid var(--hh-border);
}
#wrapper .page-tabs a {
	border-right: 0;
	margin: 5px 2px 0;
	padding: 0 14px;
	line-height: 29px;
	border-radius: 6px;
	color: var(--hh-gray-500);
}
#wrapper .page-tabs a i { color: var(--hh-gray-400); }
#wrapper .page-tabs a i:hover { color: var(--hh-danger); }
#wrapper .page-tabs a:hover {
	color: var(--hh-gray-700);
	background: var(--hh-gray-100);
}
#wrapper .page-tabs a.active,
#wrapper .page-tabs a.active:hover,
#wrapper .page-tabs a.active i:hover {
	background: var(--hh-primary-light);
	color: var(--hh-primary);
}
#wrapper .page-tabs a.active i { color: var(--hh-primary); }
#wrapper .content-tabs button { color: var(--hh-gray-500); }
#wrapper .content-tabs button:hover { color: var(--hh-gray-700); background: var(--hh-gray-100); }
#wrapper .content-tabs .roll-left { border-right: 1px solid var(--hh-border); }
#wrapper .content-tabs .roll-right { border-left: 1px solid var(--hh-border); }

/* ===== 主框架：内容画布 ===== */
#wrapper #page-wrapper { background: var(--hh-canvas); }
#wrapper .footer { background: transparent; color: var(--hh-gray-400); }

/* ===== 主框架：折叠态（mini-navbar）悬浮菜单白底化 ===== */
body.fixed-sidebar.mini-navbar #wrapper .nav li:hover > a > span.nav-label {
	background: #fff;
	color: var(--hh-gray-900);
	border: 1px solid var(--hh-border);
	border-radius: 6px;
	box-shadow: var(--hh-shadow-lg);
}
body.fixed-sidebar.mini-navbar #wrapper .nav li:hover > .nav-second-level {
	background: #fff;
	border: 1px solid var(--hh-border);
	border-radius: 8px;
	box-shadow: var(--hh-shadow-lg);
}

/* ===== 主框架：侧栏收起/展开两态（frame-sidebar-toggle-fix）
   取值与 style.min.css 的 body.mini-navbar 折叠规则逐条同值，仅以 #wrapper
   作用域重申——把两态几何钉在主框架样式层内，防止本文件后续再以 #wrapper
   前缀新增规则时（单 ID 即可压过 body.mini-navbar 系列）无意破坏折叠；
   悬停态由上方 .fixed-sidebar.mini-navbar hover 规则以更高特异性接管，
   :not(:hover) 与之互补，不压悬浮白底卡片 */
body.mini-navbar #wrapper nav.navbar-static-side { width: 70px; }
body:not(.canvas-menu).mini-navbar #wrapper #page-wrapper { margin-left: 70px; }
body.mini-navbar #wrapper .nav li:not(:hover) > a > span.nav-label { display: none; }

/* ===== 主框架：横向菜单模式（index-topnav.html 顶栏页签 navbar-toolbar） ===== */
#wrapper .navbar-toolbar > li > a {
	color: var(--hh-gray-600);
	border: 0;
	border-radius: 6px;
	padding: 8px 10px;
	margin: 8px 2px;
	font-size: 13px;
	white-space: nowrap;
}
#wrapper .navbar-toolbar > li > a:hover,
#wrapper .navbar-toolbar > li > a:focus {
	background: var(--hh-gray-100);
	color: var(--hh-gray-900);
}
#wrapper .navbar-toolbar > li.active > a,
#wrapper .navbar-toolbar > li.active > a:hover,
#wrapper .navbar-toolbar > li.active > a:focus {
	background: var(--hh-primary);
	color: #fff;
}
#wrapper .navbar-toolbar > li.active > a .fa { color: #fff; }

/* ===== 登录页（body.signin，login.html）—— 对齐主系统设计语言 ===== */
body.signin {
	background: linear-gradient(160deg, #EFF6FF 0%, var(--hh-canvas) 45%, var(--hh-gray-200) 100%) fixed;
}
body.signin .signinpanel { color: var(--hh-gray-800); margin-top: 7%; }
/* 品牌：与主框架 logo 同款蓝方块 */
body.signin .logopanel h1 {
	color: var(--hh-gray-900);
	font-size: 26px;
	font-weight: 700;
	letter-spacing: .5px;
}
body.signin .logopanel h1::before {
	content: '';
	display: inline-block;
	width: 34px;
	height: 34px;
	margin-right: 12px;
	background: var(--hh-primary);
	border-radius: 9px;
	vertical-align: -5px;
}
body.signin .signin-info h4 { color: var(--hh-gray-800); }
body.signin .signin-info ul li { color: var(--hh-gray-600); }
body.signin .signin-info ul li .fa { color: var(--hh-primary); }
body.signin .signin-info a { color: var(--hh-primary); }
/* 表单卡 */
body.signin .signinpanel form {
	background: #fff;
	border: 1px solid var(--hh-border);
	border-radius: 12px;
	box-shadow: var(--hh-shadow-lg);
	padding: 28px;
}
body.signin .signinpanel form .no-margins { color: var(--hh-gray-900); font-weight: 600; }
body.signin .signinpanel form p { color: var(--hh-gray-500); }
body.signin .signinpanel .form-control {
	border-radius: 8px !important;
	height: 40px !important;
	border-color: var(--hh-gray-200);
	box-shadow: none;
}
body.signin .signinpanel .form-control:focus {
	border-color: var(--hh-primary) !important;
	box-shadow: 0 0 0 3px rgba(37, 99, 235, .12) !important;
}
body.signin #btnSubmit.btn-success {
	background: var(--hh-primary);
	border-color: var(--hh-primary);
	border-radius: 8px;
	height: 42px;
	font-weight: 600;
	letter-spacing: 4px;
}
body.signin #btnSubmit.btn-success:hover,
body.signin #btnSubmit.btn-success:focus {
	background: var(--hh-primary-dark);
	border-color: var(--hh-primary-dark);
}
body.signin .signup-footer { border-top: 1px solid var(--hh-gray-200); color: var(--hh-gray-400); }
body.signin .checkbox-custom label::before { border-radius: 4px; border-color: var(--hh-gray-300); }
body.signin .checkbox-custom input[type="checkbox"]:checked + label::after { color: var(--hh-primary); }

/* ============================================================================
   C 期扩展区（system 内置页 / config / 弹窗 chrome）—— 追加在下方
   ============================================================================ */

/* ===== C：RuoYi/H+ 组件层映射（config、search、system 页共用；@media screen 隔离打印；
   业务页 scoped 规则特异性更高，不受本段影响） ===== */
@media screen {

/* 卡片（ibox） */
.ibox {
	background: #fff;
	border: 1px solid var(--hh-border);
	border-radius: var(--hh-radius);
	box-shadow: var(--hh-shadow);
	margin-bottom: 16px;
}
.ibox-title {
	padding: 14px 20px 10px;
	border-bottom: 1px solid var(--hh-border);
}
.ibox-title h5 {
	font-size: 15px;
	font-weight: 600;
	color: var(--hh-gray-900);
	margin: 0;
}
.ibox-content { padding: 16px 20px; color: var(--hh-gray-700); }

/* 页面级页签（config / search 的 nav-tabs；topnav 工具栏由 #wrapper 段更高特异性接管） */
.nav-tabs { border-bottom: 1px solid var(--hh-border); }
.nav-tabs > li > a {
	color: var(--hh-gray-500);
	border: 0;
	border-radius: 6px;
	margin-right: 4px;
	padding: 8px 14px;
}
.nav-tabs > li > a:hover { background: var(--hh-gray-100); color: var(--hh-gray-900); border: 0; }
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
	background: var(--hh-primary);
	border: 0;
	color: #fff;
}
.nav-tabs > li.active > a .badge { background: rgba(255,255,255,.25); color: #fff; }

/* 按钮（bootstrap 变体 → 原型 btn 体系；不改高度尺寸） */
.btn {
	border-radius: 6px;
	font-size: 13px;
	transition: all .15s;
}
.btn-primary, .btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-primary.active, .open .dropdown-toggle.btn-primary {
	background: var(--hh-primary);
	border-color: var(--hh-primary);
	color: #fff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active { background: var(--hh-primary-dark); border-color: var(--hh-primary-dark); }
.btn-success, .btn-success:hover, .btn-success:focus, .btn-success:active,
.btn-success.active, .open .dropdown-toggle.btn-success {
	background: var(--hh-success);
	border-color: var(--hh-success);
	color: #fff;
}
.btn-success:hover, .btn-success:focus { background: #15803D; border-color: #15803D; }
.btn-warning, .btn-warning:hover, .btn-warning:focus, .btn-warning:active,
.btn-warning.active, .open .dropdown-toggle.btn-warning {
	background: var(--hh-warning);
	border-color: var(--hh-warning);
	color: #fff;
}
.btn-warning:hover, .btn-warning:focus { background: #B45309; border-color: #B45309; }
.btn-danger {
	background: #fff;
	border: 1px solid var(--hh-danger);
	color: var(--hh-danger);
}
.btn-danger:hover, .btn-danger:focus, .btn-danger:active,
.btn-danger.active, .open .dropdown-toggle.btn-danger {
	background: var(--hh-danger);
	border-color: var(--hh-danger);
	color: #fff;
}
.btn-default, .btn-info {
	background: #fff;
	border: 1px solid var(--hh-gray-300);
	color: var(--hh-gray-600);
}
.btn-default:hover, .btn-default:focus, .btn-default:active,
.btn-info:hover, .btn-info:focus, .btn-info:active {
	border-color: var(--hh-primary);
	color: var(--hh-primary);
	background: #fff;
}
.btn-rounded { border-radius: 6px; }

/* 徽标 → 原型软色 tag（RuoYi 旧配色 badge-primary=#1ab394 / badge-success=#1c84c6 一并归位） */
.badge {
	padding: 2px 8px;
	border-radius: 4px;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
	background: var(--hh-gray-100);
	color: var(--hh-gray-500);
}
.label-primary, .badge-primary { background: var(--hh-primary-light); color: var(--hh-primary); }
.label-success, .badge-success { background: var(--hh-success-light); color: var(--hh-success); }
.label-warning, .badge-warning, .label-warning-light, .badge-warning-light { background: var(--hh-warning-light); color: var(--hh-warning); }
.label-danger, .badge-danger { background: var(--hh-danger-light); color: var(--hh-danger); }
.label-info, .badge-info { background: var(--hh-primary-light); color: var(--hh-primary); }

/* 表单控件 */
.form-control {
	border: 1px solid var(--hh-gray-300);
	border-radius: 6px;
	color: var(--hh-gray-800);
	box-shadow: none;
}
.form-control:focus {
	border-color: var(--hh-primary);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

/* RuoYi 检索区（select-list） */
.select-list ul { padding: 4px 0 8px; }
.select-list li { color: var(--hh-gray-600); }
.select-list li input, .select-list li select {
	border: 1px solid var(--hh-gray-300);
	border-radius: 6px;
	color: var(--hh-gray-800);
}
.select-list li input:focus, .select-list li select:focus {
	border-color: var(--hh-primary);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

/* bootstrap-table 表格（白底 + 灰阶分隔 + 悬浮，原型 table 观感） */
.table { color: var(--hh-gray-700); }
.table > thead > tr > th {
	background: var(--hh-gray-50);
	color: var(--hh-gray-500);
	font-weight: 500;
	font-size: 12px;
	border-bottom: 1px solid var(--hh-border);
	padding: 10px 12px;
	vertical-align: middle;
}
.table > tbody > tr > td {
	border-top: 1px solid var(--hh-gray-100);
	padding: 10px 12px;
	vertical-align: middle;
	color: var(--hh-gray-700);
}
.table-striped > tbody > tr:nth-of-type(odd) > td,
.table-striped > tbody > tr:nth-of-type(odd) > th { background: #fff; }
.table-hover > tbody > tr:hover > td,
.table-hover > tbody > tr:hover > th { background: var(--hh-gray-50); }
.table-bordered, .table-bordered > thead > tr > th, .table-bordered > tbody > tr > td { border-color: var(--hh-gray-100); }
.fixed-table-container { border: 1px solid var(--hh-border); border-radius: var(--hh-radius); }

/* 分页 */
.pagination > li > a, .pagination > li > span {
	color: var(--hh-gray-600);
	border: 1px solid var(--hh-gray-200);
	border-radius: 6px;
	margin: 0 2px;
}
.pagination > li > a:hover, .pagination > li > span:hover {
	background: var(--hh-gray-100);
	color: var(--hh-gray-900);
	border-color: var(--hh-gray-200);
}
.pagination > .active > a, .pagination > .active > span,
.pagination > .active > a:hover, .pagination > .active > a:focus {
	background: var(--hh-primary);
	border-color: var(--hh-primary);
	color: #fff;
}
.fixed-table-pagination .pagination-detail { color: var(--hh-gray-500); }

/* 提示条 */
.alert { border-radius: var(--hh-radius); }
.alert-warning {
	background: var(--hh-warning-light);
	border-color: #FDE68A;
	color: #92400E;
}

} /* ===== C：组件层映射结束 ===== */

/* ===== C：layer 弹窗 chrome（全部弹窗外壳统一；不改标题高度——layer 以固定标题高
   参与 iframe 弹窗内容高度计算，改高度会引起内容裁切） ===== */
@media screen {
.layui-layer {
	background: #fff;
	border: 1px solid var(--hh-border);
	border-radius: 10px;
	box-shadow: var(--hh-shadow-lg);
	overflow: hidden;
}
.layui-layer-title {
	background: #fff;
	border-bottom: 1px solid var(--hh-border);
	font-size: 15px;
	font-weight: 600;
	color: var(--hh-gray-900);
}
.layui-layer-setwin .layui-layer-close1 { color: var(--hh-gray-400); }
.layui-layer-setwin .layui-layer-close1:hover { color: var(--hh-danger); opacity: 1; }
.layui-layer-btn { border-top: 0; padding: 12px 16px; text-align: right; }
.layui-layer-btn a {
	height: 32px;
	line-height: 32px;
	padding: 0 16px;
	border-radius: 6px;
	font-size: 13px;
	border: 1px solid var(--hh-gray-300);
	background: #fff;
	color: var(--hh-gray-600);
}
.layui-layer-btn a:hover { border-color: var(--hh-primary); color: var(--hh-primary); }
.layui-layer-btn .layui-layer-btn0 { background: var(--hh-primary); border-color: var(--hh-primary); color: #fff; }
.layui-layer-btn .layui-layer-btn0:hover { background: var(--hh-primary-dark); border-color: var(--hh-primary-dark); color: #fff; }
.layui-layer-msg { border-radius: 8px; }
} /* ===== C：layer 弹窗 chrome 结束 ===== */
