/* 便民服务平台 后台公共样式 · 双主题（:root 默认党建红金；html.dj-theme-blue 科技蓝）
   主题切换由 /static/admin/theme.js 控制（html 级 class + CSS 变量继承，iframe 页面各自加载） */

:root {
    --dj-bg: #f4f1ea;
    --dj-card: #fffdf7;
    --dj-card-border: #f0e6cc;
    --dj-shadow: rgba(120, 40, 0, .08);
    --dj-primary: #c7000b;
    --dj-primary-deep: #a00000;
    --dj-primary-bright: #e03117;
    --dj-primary-shadow: rgba(199, 0, 11, .3);
    --dj-accent: #e6b422;
    --dj-accent-bright: #f5c518;
    --dj-text-strong: #a00000;
    --dj-text: #5a4a3a;
    --dj-text-soft: #8a7a5a;
    --dj-text-faint: #a08c6a;
    --dj-side-bg: #fffdf7;
    --dj-side-text: #5a4a3a;
    --dj-hover-bg: #f7ecd4;
    --dj-child-bg: #f7f1e3;
    --dj-tab-bg: #f7f1e3;
    --dj-tabs-bar: #ece5d3;
    --dj-tab-border: #e3d7ba;
    --dj-scroll: #d8c9a3;
    --dj-header-text: #ffe9c2;
    --dj-login-shadow: rgba(80, 0, 0, .45);
}

/* 科技蓝主题（默认）：大数据风格浅蓝 + 亮蓝主色 */
html.dj-theme-blue {
    --dj-bg: #edf4fc;
    --dj-card: #ffffff;
    --dj-card-border: #d9e8f8;
    --dj-shadow: rgba(23, 94, 168, .10);
    --dj-primary: #1f8ef1;
    --dj-primary-deep: #0d6ecf;
    --dj-primary-bright: #4aa8f5;
    --dj-primary-shadow: rgba(31, 142, 241, .35);
    --dj-accent: #7cc4ff;
    --dj-accent-bright: #aedcff;
    --dj-text-strong: #0d6ecf;
    --dj-text: #3d4d5f;
    --dj-text-soft: #7a8aa0;
    --dj-text-faint: #8ea3bb;
    --dj-side-bg: #ffffff;
    --dj-side-text: #3d4d5f;
    --dj-hover-bg: #e2f0fd;
    --dj-child-bg: #eaf4fd;
    --dj-tab-bg: #eaf4fd;
    --dj-tabs-bar: #d8e9f9;
    --dj-tab-border: #c4ddf3;
    --dj-scroll: #a9cdec;
    --dj-header-text: #dceeff;
    --dj-login-shadow: rgba(8, 60, 120, .45);
}

body { background: var(--dj-bg); }

/* ============ 登录页 ============ */
.dj-login-body {
    background: url('/static/admin/login_bg.png') center/100% 100% no-repeat;
    display: flex; align-items: center; justify-content: center; height: 100vh; margin: 0;
    position: relative;
}
.dj-login-body::before {
    content: ''; position: absolute; left: 0; right: 0; top: 0; height: 6px;
    background: linear-gradient(90deg, var(--dj-accent-bright), var(--dj-accent), var(--dj-accent-bright));
    z-index: 2;
}
.dj-login-box {
    position: relative; z-index: 1;
    width: 380px; background: rgba(255, 253, 247, .96); border-radius: 12px; padding: 40px 36px;
    box-shadow: 0 12px 40px var(--dj-login-shadow); border-top: 4px solid var(--dj-accent);
}
html.dj-theme-blue .dj-login-box { background: rgba(255, 255, 255, .97); }
.dj-login-title {
    font-size: 21px; font-weight: 700; color: var(--dj-primary-deep); text-align: center; margin-bottom: 28px;
    display: flex; align-items: center; justify-content: center; gap: 10px;
    letter-spacing: 1px;
}
.dj-login-logo { width: 40px; height: 40px; object-fit: contain; }

/* ============ 布局 ============ */
.dj-header {
    background: linear-gradient(90deg, var(--dj-primary-deep) 0%, var(--dj-primary) 100%);
    border-bottom: 3px solid var(--dj-accent);
}
.dj-header-title { float: left; color: #fff; font-size: 17px; font-weight: 700; line-height: 57px; padding-left: 20px; display: flex; align-items: center; gap: 8px; letter-spacing: 1px; }
.dj-logo { width: 30px; height: 30px; object-fit: contain; }
.dj-header .layui-nav { background: transparent; }
.dj-header .layui-nav .layui-nav-item a { color: var(--dj-header-text); }
.dj-header .layui-nav .layui-nav-item a:hover { color: #ffffff; }
.dj-side { top: 60px; background: var(--dj-side-bg); box-shadow: 1px 0 4px var(--dj-shadow); }
.dj-side .layui-nav { background: var(--dj-side-bg); }
.dj-side .layui-nav-item a { color: var(--dj-side-text) !important; }
.dj-side .layui-nav-itemed > a, .dj-side .layui-nav-tree .layui-nav-title a { color: var(--dj-side-text) !important; }
.dj-side .layui-nav .layui-this > a {
    background: linear-gradient(90deg, var(--dj-primary), var(--dj-primary-bright)); color: #fff !important; border-radius: 6px;
    box-shadow: 0 2px 6px var(--dj-primary-shadow);
}
.dj-side .layui-nav-child dd.layui-this a { background: linear-gradient(90deg, var(--dj-primary), var(--dj-primary-bright)); color: #fff !important; border-radius: 6px; }
.dj-side .layui-nav-child { background: var(--dj-child-bg) !important; }
.dj-side .layui-nav-child a { padding-left: 40px; }
.dj-side .layui-nav-item a:hover { background: var(--dj-hover-bg); color: var(--dj-text-strong) !important; }
.layui-layout-admin .layui-body.dj-body { top: 60px; bottom: 44px; padding-bottom: 0; background: var(--dj-bg); display: flex; flex-direction: column; overflow: hidden; }
.dj-footer { left: 200px; background: var(--dj-side-bg); color: var(--dj-text-faint); text-align: center; height: 44px; line-height: 44px; border-top: 1px solid var(--dj-card-border); }

/* ---- 主框架多标签页 ---- */
.dj-tabs {
    flex: none; height: 40px; box-sizing: border-box; display: flex; align-items: flex-end; gap: 4px;
    padding: 0 8px; background: var(--dj-tabs-bar); border-bottom: 2px solid var(--dj-accent);
    overflow-x: auto; overflow-y: hidden;
}
.dj-tabs::-webkit-scrollbar { height: 4px; }
.dj-tabs::-webkit-scrollbar-thumb { background: var(--dj-scroll); border-radius: 2px; }
.dj-tab {
    flex: none; max-width: 180px; height: 32px; line-height: 30px; padding: 0 12px;
    display: flex; align-items: center; gap: 6px; cursor: pointer;
    background: var(--dj-tab-bg); color: var(--dj-text); font-size: 13px; white-space: nowrap; overflow: hidden;
    border: 1px solid var(--dj-tab-border); border-bottom: 0; border-radius: 8px 8px 0 0;
}
.dj-tab:hover { background: var(--dj-side-bg); color: var(--dj-text-strong); }
.dj-tab.dj-tab-active {
    background: var(--dj-side-bg); color: var(--dj-text-strong); font-weight: 600; height: 34px;
    border-color: var(--dj-accent); box-shadow: inset 0 3px 0 var(--dj-primary);
}
.dj-tab .dj-tab-title { overflow: hidden; text-overflow: ellipsis; }
.dj-tab .dj-tab-close {
    flex: none; width: 16px; height: 16px; font-size: 12px; color: var(--dj-text-faint);
    display: inline-flex; align-items: center; justify-content: center; border-radius: 50%;
}
.dj-tab .dj-tab-close:hover { background: var(--dj-primary); color: #fff; }
.dj-frames { flex: 1; min-height: 0; position: relative; }
/* iframe 用 top+height:100% 精确贴满 .dj-frames（容器高度由 flex 确定，百分比可解析；不用 JS 量高，避免加载时测量偏小而留底缝） */
.dj-iframe { display: none; position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 100%; border: 0; background: transparent; }
.dj-iframe.dj-iframe-active { display: block; }

/* ============ 数据看板 ============ */
.dj-dashboard { padding: 16px; }
.dj-card { background: var(--dj-card); border-radius: 10px; padding: 18px; text-align: center; box-shadow: 0 1px 4px var(--dj-shadow); margin-bottom: 15px; border: 1px solid var(--dj-card-border); }
.dj-card-num { font-size: 26px; font-weight: 700; color: var(--dj-primary); }
.dj-card-label { color: var(--dj-text-soft); margin-top: 6px; font-size: 13px; }
.dj-panel { margin-top: 6px; }
.dj-panel .layui-card-header { font-weight: 600; color: var(--dj-text-strong); border-bottom: 2px solid var(--dj-accent); }

/* ============ 通用列表页 ============ */
.dj-page { padding: 16px; }
.dj-search { background: var(--dj-card); border-radius: 10px; padding: 14px 16px; margin-bottom: 14px; box-shadow: 0 1px 4px var(--dj-shadow); border: 1px solid var(--dj-card-border); }
.dj-table-card { background: var(--dj-card); border-radius: 10px; padding: 16px; box-shadow: 0 1px 4px var(--dj-shadow); border: 1px solid var(--dj-card-border); min-height: calc(100vh - 170px); }
.dj-img-thumb { width: 36px; height: 36px; vertical-align: middle; border-radius: 4px; object-fit: contain; cursor: pointer; background: var(--dj-child-bg); border: 1px solid var(--dj-card-border); }

/* layui 主按钮主题色化 */
.layui-btn { border-radius: 4px; }
.layui-btn-primary { border-color: var(--dj-scroll); color: var(--dj-text-soft); }
.layui-laypage .layui-laypage-curr .layui-laypage-curr { background-color: var(--dj-primary); }
.layui-form-checked[lay-skin=primary] i { border-color: var(--dj-primary) !important; background-color: var(--dj-primary); }

/* ============ 弹层滚动条隐藏（保留滚动能力，视觉干净） ============ */
.layui-layer-content { scrollbar-width: none; -ms-overflow-style: none; }
.layui-layer-content::-webkit-scrollbar { display: none; }
.layui-layer-content [style*="overflow"] { scrollbar-width: none; -ms-overflow-style: none; }
.layui-layer-content [style*="overflow"]::-webkit-scrollbar { display: none; }

/* ============ 顶栏入口（主题/清理缓存/退出） ============ */
.dj-header .layui-nav .layui-nav-item a#djClearCache { color: var(--dj-header-text); }
.dj-header .layui-nav .layui-nav-item a#djClearCache:hover { color: var(--dj-accent-bright); }
.dj-header .layui-nav .layui-nav-item a.dj-theme-link { color: var(--dj-header-text); }
.dj-header .layui-nav .layui-nav-item a.dj-theme-link:hover { color: #ffffff; }
.dj-header .layui-nav .layui-nav-item .layui-nav-child dd a.dj-theme-opt { color: var(--dj-text) !important; }
.dj-header .layui-nav .layui-nav-item .layui-nav-child dd a.dj-theme-opt:hover { background: var(--dj-hover-bg); }
.dj-header .layui-nav .layui-nav-item .layui-nav-child dd.layui-this a.dj-theme-opt,
.dj-header .layui-nav .layui-nav-item .layui-nav-child dd a.dj-theme-opt.dj-theme-cur { background: linear-gradient(90deg, var(--dj-primary), var(--dj-primary-bright)); color: #fff !important; border-radius: 4px; }
/* 退出登录：主题深底白字 + 高亮描边，hover 再加深，保证清晰可辨 */
.dj-header .layui-nav .layui-nav-child dd.dj-logout a {
    margin: 5px 8px; padding: 8px 12px; text-align: center;
    background: var(--dj-primary-deep); color: #ffffff !important;
    border: 1px solid var(--dj-accent); border-radius: 4px;
}
.dj-header .layui-nav .layui-nav-child dd.dj-logout a:hover {
    background: var(--dj-primary); color: #ffffff !important;
}

/* ============ 表单 checkbox 按社区分组（社工辖区等两级选择） ============ */
.dj-cb-group { margin-bottom: 8px; }
.dj-cb-group-title { font-weight: 600; color: var(--dj-text-strong); font-size: 13px; margin-bottom: 2px; }
.dj-cb-group-body .layui-form-checkbox[lay-skin=primary] { margin: 2px 8px 2px 0; }