/* =========================================================
   日程管理系统 —— 全局样式
   ========================================================= */
:root {
    --brand: #1e6fff;
    --brand-dark: #1457d6;
    --sidebar-bg: #1f2937;
    --sidebar-hover: #2b3a4d;
    --sidebar-active: #1e6fff;
    --text-main: #1f2937;
    --text-sub: #6b7280;
    --border: #e8ecf3;
    --bg-page: #f4f6fa;
}

* { box-sizing: border-box; }

/* =========================================================
   表单标签列加宽（第二十四轮）：layui 默认 label 80px（border-box 内容仅 50px），
   4 个汉字即折行；加宽到 120px（内容 90px，可容 6 字）并同步右移输入区。
   ========================================================= */
.layui-form-label { width: 120px !important; padding: 9px 12px; }
.layui-input-block { margin-left: 130px !important; }
.layui-form-label .req { margin-left: 2px; color: #f56c6c; }

/* =========================================================
   弹窗两列布局（第二十五轮）：弹窗内表单两列栅格。
   用法：弹窗表单根 div 加 class="layui-form form-2col"，
   每个 .layui-form-item 自动占半宽；带 .full 的项占整行。
   ========================================================= */
.form-2col { display: grid; grid-template-columns: 1fr 1fr; column-gap: 12px; }
.form-2col .layui-form-item { margin-bottom: 10px; min-width: 0; }
.form-2col .layui-form-item.full { grid-column: 1 / -1; }
.form-2col .layui-form-item .layui-input-block { margin-left: 100px !important; }
.form-2col .layui-form-label { width: 90px !important; padding: 9px 8px; }
/* 弹窗整体加宽 */
.layui-layer { min-width: 0; }
.layer-2col { width: 860px !important; }

body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
    background: var(--bg-page);
    color: var(--text-main);
    font-size: 14px;
}

a { text-decoration: none; color: inherit; }

/* ---------------- 登录页 ---------------- */
.login-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #1e3a8a 0%, #1e6fff 55%, #38bdf8 100%);
    padding: 24px;
}
.login-box {
    width: 100%;
    max-width: 920px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, .25);
    display: flex;
    overflow: hidden;
}
.login-intro {
    flex: 1 1 46%;
    background: linear-gradient(160deg, #1457d6, #1e6fff 60%, #3b9dff);
    color: #fff;
    padding: 48px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.login-intro h1 { font-size: 26px; margin: 0 0 12px; font-weight: 600; letter-spacing: .5px; }
.login-intro p { margin: 0 0 24px; line-height: 1.9; opacity: .92; font-size: 13px; }
.login-intro ul { margin: 0; padding-left: 18px; line-height: 2.1; font-size: 13px; opacity: .95; }
.login-form { flex: 1 1 54%; padding: 48px 44px; }
.login-form h2 { margin: 0 0 6px; font-size: 20px; }
.login-form .sub { color: var(--text-sub); margin-bottom: 26px; font-size: 13px; }
.login-form .layui-input { height: 42px; line-height: 42px; }
.login-form .layui-form-item { margin-bottom: 18px; }
.login-btn {
    width: 100%; height: 44px; line-height: 44px;
    background: var(--brand); color: #fff; border: none; border-radius: 6px;
    font-size: 15px; cursor: pointer; transition: background .2s;
}
.login-btn:hover { background: var(--brand-dark); }
.login-tips {
    margin-top: 22px; padding: 12px 14px; background: #f6f8fc;
    border-radius: 8px; color: var(--text-sub); font-size: 12px; line-height: 1.9;
}
.login-tips b { color: var(--text-main); }

/* ---------------- 主框架 ---------------- */
.layout-header {
    height: 58px; background: #fff; border-bottom: 1px solid var(--border);
    display: flex; align-items: center; padding: 0 18px;
    position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
}
.layout-logo {
    width: 202px; font-size: 16px; font-weight: 600; color: var(--brand);
    display: flex; align-items: center; gap: 8px; letter-spacing: .5px;
}
.layout-logo i { font-size: 20px; }
.layout-header-right { margin-left: auto; display: flex; align-items: center; gap: 18px; }
.header-icon {
    position: relative; cursor: pointer; color: #4b5563; font-size: 18px;
    width: 34px; height: 34px; display: flex; align-items: center; justify-content: center;
    border-radius: 8px; transition: background .2s;
}
.header-icon:hover { background: #f1f5fb; }
.header-badge {
    position: absolute; top: 1px; right: 1px; min-width: 16px; height: 16px; line-height: 16px;
    padding: 0 4px; border-radius: 8px; background: #ff5722; color: #fff;
    font-size: 11px; text-align: center;
}
.header-user { display: flex; align-items: center; gap: 8px; cursor: pointer; padding: 4px 10px; border-radius: 8px; }
.header-user:hover { background: #f1f5fb; }
.header-user .avatar {
    width: 30px; height: 30px; border-radius: 50%; background: var(--brand); color: #fff;
    display: flex; align-items: center; justify-content: center; font-size: 13px;
}
.header-user .meta { line-height: 1.25; }
.header-user .meta .name { font-size: 13px; font-weight: 500; }
.header-user .meta .dept { font-size: 11px; color: var(--text-sub); }

.layout-sidebar {
    position: fixed; top: 58px; bottom: 0; left: 0; width: 202px;
    background: var(--sidebar-bg); overflow-y: auto; padding: 12px 0 24px; z-index: 900;
}
.layout-sidebar::-webkit-scrollbar { width: 5px; }
.layout-sidebar::-webkit-scrollbar-thumb { background: #4b5563; border-radius: 3px; }
.side-group-title {
    color: #8b98ab; font-size: 11px; padding: 14px 18px 6px; letter-spacing: 1px;
}
.side-item {
    display: flex; align-items: center; gap: 10px; color: #cbd5e1;
    padding: 10px 18px; cursor: pointer; font-size: 13.5px; transition: all .18s;
    border-left: 3px solid transparent;
}
.side-item:hover { background: var(--sidebar-hover); color: #fff; }
.side-item.active { background: var(--sidebar-hover); color: #fff; border-left-color: var(--sidebar-active); }
.side-item i { font-size: 16px; width: 18px; text-align: center; }
.side-item .arrow { margin-left: auto; font-size: 12px; transition: transform .2s; }
.side-item.open .arrow { transform: rotate(90deg); }
.side-children { overflow: hidden; }
.side-child {
    display: block; color: #9aa7ba; padding: 8px 18px 8px 46px; font-size: 13px; cursor: pointer;
    border-left: 3px solid transparent; transition: all .18s;
}
.side-child:hover { background: var(--sidebar-hover); color: #fff; }
.side-child.active { color: #fff; background: var(--sidebar-hover); border-left-color: var(--sidebar-active); }

.layout-body { margin-left: 202px; padding-top: 58px; height: 100vh; }
.layout-iframe { width: 100%; height: 100%; border: 0; display: block; }

/* ---------------- 页面内容 ---------------- */
.page-wrap { padding: 16px; }
.page-card {
    background: #fff; border-radius: 10px; box-shadow: 0 1px 3px rgba(15, 23, 42, .06);
    padding: 18px 20px; margin-bottom: 16px;
}
.page-title { font-size: 16px; font-weight: 600; margin: 0 0 4px; }
.page-desc { color: var(--text-sub); font-size: 12.5px; margin: 0; }

.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; }
.stat-card {
    background: #fff; border-radius: 10px; padding: 18px 20px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .06); position: relative; overflow: hidden;
}
.stat-card .label { color: var(--text-sub); font-size: 12.5px; }
.stat-card .value { font-size: 28px; font-weight: 600; margin-top: 6px; letter-spacing: .5px; }
.stat-card .unit { font-size: 12px; color: var(--text-sub); margin-left: 4px; font-weight: 400; }
.stat-card::after {
    content: ''; position: absolute; right: -18px; top: -18px; width: 72px; height: 72px;
    border-radius: 50%; background: rgba(30, 111, 255, .07);
}
.stat-card.blue .value { color: #1e6fff; }
.stat-card.orange .value { color: #ff9800; }
.stat-card.green .value { color: #16baaa; }
.stat-card.red .value { color: #ff5722; }
.stat-card.purple .value { color: #a233c6; }

/* 日历 */
.calendar-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.calendar-toolbar .spacer { flex: 1; }
#calendar { background: #fff; border-radius: 10px; padding: 16px; box-shadow: 0 1px 3px rgba(15, 23, 42, .06); }
.fc .fc-button-primary { background: var(--brand); border-color: var(--brand); }
.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:not(:disabled):active { background: var(--brand-dark); border-color: var(--brand-dark); }
.fc-event { cursor: pointer; border: none; }
.fc-daygrid-event { padding: 1px 4px; }

.event-detail { padding: 18px 20px; line-height: 1.9; font-size: 13.5px; }
.event-detail .row { display: flex; gap: 10px; }
.event-detail .row .k { width: 76px; color: var(--text-sub); flex: none; }
.event-detail .row .v { flex: 1; color: var(--text-main); word-break: break-all; }
.event-detail h4 { margin: 0 0 14px; font-size: 15px; }
.tag {
    display: inline-block; padding: 1px 8px; border-radius: 4px; font-size: 12px; line-height: 19px;
}
.tag-gray { background: #eef1f6; color: #64748b; }
.tag-blue { background: #e8f1ff; color: #1e6fff; }
.tag-orange { background: #fff3e0; color: #ff9800; }
.tag-green { background: #e6f7f4; color: #16baaa; }
.tag-red { background: #ffece6; color: #ff5722; }

.toolbar { margin-bottom: 14px; }
.toolbar .layui-form-item { margin-bottom: 0; }

.empty-block { text-align: center; color: var(--text-sub); padding: 48px 0; font-size: 13px; }

/* 通知 */
.notice-item {
    display: flex; gap: 12px; padding: 14px 4px; border-bottom: 1px solid var(--border);
}
.notice-item:last-child { border-bottom: 0; }
.notice-dot { width: 8px; height: 8px; border-radius: 50%; background: #ff5722; margin-top: 7px; flex: none; }
.notice-dot.read { background: #d1d5db; }
.notice-main { flex: 1; }
.notice-title { font-size: 14px; font-weight: 500; }
.notice-title.read { font-weight: 400; color: var(--text-sub); }
.notice-content { color: var(--text-sub); font-size: 12.5px; margin-top: 3px; line-height: 1.8; }
.notice-time { color: #9ca3af; font-size: 12px; margin-top: 4px; }

@media (max-width: 900px) {
    .login-intro { display: none; }
    .layout-sidebar { width: 62px; }
    .layout-sidebar .side-item span, .layout-sidebar .side-child { display: none; }
    .layout-logo { width: 62px; }
    .layout-body { margin-left: 62px; }
}

/* ---------------- 表单 ---------------- */
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.form-grid .full { grid-column: 1 / -1; }
.form-row { margin-bottom: 14px; }
.form-row > label { display: block; font-size: 13px; color: #374151; margin-bottom: 6px; }
.form-row > label .req { color: #ff5722; margin-left: 2px; }
.form-control {
    width: 100%; height: 36px; line-height: 36px; padding: 0 10px;
    border: 1px solid #dfe4ec; border-radius: 6px; font-size: 13.5px; color: #1f2937;
    background: #fff; outline: none; transition: border-color .15s;
}
.form-control:focus { border-color: var(--brand); }
textarea.form-control { height: auto; min-height: 74px; line-height: 1.7; padding: 8px 10px; resize: vertical; }
select.form-control { appearance: none; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M2 4l4 4 4-4z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; padding-right: 28px; }
.check-line { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: #374151; height: 36px; }
.check-line input { width: 15px; height: 15px; }
.picker-box { border: 1px solid #dfe4ec; border-radius: 6px; overflow: hidden; }
.picker-search { width: 100%; border: 0; border-bottom: 1px solid #eef1f6; padding: 8px 10px; font-size: 13px; outline: none; }
.picker-list { max-height: 168px; overflow-y: auto; padding: 6px 0; }
.picker-item { display: flex; align-items: center; gap: 8px; padding: 5px 12px; font-size: 13px; cursor: pointer; }
.picker-item:hover { background: #f6f8fc; }
.picker-item input { width: 14px; height: 14px; }
.picker-empty { padding: 16px; text-align: center; color: #9ca3af; font-size: 12.5px; }

/* layui 的 .layui-form 会把原生 checkbox / radio / select 一并隐藏（它靠 form.render 生成替身）。
   本项目这些勾选控件用的是原生 checkbox、没有走 layui 渲染，必须显式放回来，
   否则列表里只看得到文字、看不到勾选框，点了也没有视觉反馈。
   report/template.html 的 lay-skin="switch" 走的是 layui 渲染，不受这里影响。 */
.layui-form .picker-box input[type=checkbox],
.layui-form .picker-item input[type=checkbox],
.layui-form .check-line input[type=checkbox],
.layui-form .check-line input[type=radio],
.layui-form input[type=checkbox].ui-check,
.layui-form input[type=radio].ui-check,
/* 表单块里被 label 包着的原生勾选框（如「允许建空单」）；layui 的 lay-skin=switch 是 input 直接子节点，不受影响 */
.layui-form .layui-input-block label input[type=checkbox] { display: inline-block; }
.picker-item input, .check-line input { flex: none; accent-color: var(--brand); }
.detail-actions { padding: 12px 20px 18px; display: flex; gap: 10px; justify-content: flex-end; }
.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    height: 34px; padding: 0 16px; border-radius: 6px; border: 1px solid transparent;
    font-size: 13.5px; cursor: pointer; transition: all .15s; background: #fff;
}
.btn-primary { background: var(--brand); color: #fff; }
.btn-primary:hover { background: var(--brand-dark); }
.btn-default { border-color: #dfe4ec; color: #374151; }
.btn-default:hover { border-color: var(--brand); color: var(--brand); }
.btn-danger { background: #ff5722; color: #fff; }
.btn-danger:hover { background: #e64a19; }
.btn-sm { height: 28px; padding: 0 10px; font-size: 12.5px; border-radius: 4px; }
.btn[disabled] { opacity: .6; cursor: not-allowed; }

/* =========================================================
   工程 ERP 模块扩展样式
   ========================================================= */

/* 页内选项卡 */
.mod-tabs {
    display: flex; gap: 4px; border-bottom: 1px solid var(--border);
    padding: 0 16px; background: #fff; flex-wrap: wrap;
}
.mod-tabs .mod-tab {
    padding: 12px 18px; cursor: pointer; font-size: 14px; color: var(--text-sub);
    border-bottom: 2px solid transparent; transition: all .15s; user-select: none;
}
.mod-tabs .mod-tab:hover { color: var(--brand); }
.mod-tabs .mod-tab.active { color: var(--brand); border-bottom-color: var(--brand); font-weight: 600; }
.mod-panel { display: none; }
.mod-panel.active { display: block; }

/* 两栏布局（左树右表） */
.split-layout { display: flex; gap: 14px; align-items: flex-start; }
.split-side { flex: 0 0 250px; background: #fff; border-radius: 10px; border: 1px solid var(--border); padding: 14px; }
.split-main { flex: 1 1 auto; min-width: 0; }
@media (max-width: 900px) {
    .split-layout { flex-direction: column; }
    .split-side { flex: 1 1 auto; width: 100%; }
}

/* 分类树 */
.cat-node { padding: 7px 10px; border-radius: 6px; cursor: pointer; font-size: 13.5px; display: flex; justify-content: space-between; align-items: center; }
.cat-node:hover { background: #f2f6ff; }
.cat-node.active { background: #e8f1ff; color: var(--brand); font-weight: 600; }
.cat-node .cnt { color: var(--text-sub); font-size: 12px; font-weight: 400; }
.cat-children { padding-left: 14px; }

/* 进度条 */
.progress-bar { height: 8px; background: #eef1f6; border-radius: 6px; overflow: hidden; min-width: 70px; }
.progress-bar > span { display: block; height: 100%; background: linear-gradient(90deg, #1e6fff, #38bdf8); border-radius: 6px; }
.progress-bar.warn > span { background: linear-gradient(90deg, #ff9800, #ffc107); }
.progress-bar.done > span { background: linear-gradient(90deg, #16baaa, #4dd0c1); }
.progress-text { font-size: 12px; color: var(--text-sub); margin-top: 3px; }

/* 明细表格（弹窗内） */
.mini-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.mini-table th, .mini-table td { border: 1px solid var(--border); padding: 7px 9px; text-align: left; }
.mini-table th { background: #f7f9fc; font-weight: 600; color: var(--text-sub); }
.mini-table tr:hover td { background: #fafbfe; }
.mini-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.mini-table input, .mini-table select { width: 100%; height: 30px; line-height: 30px; padding: 0 6px; border: 1px solid var(--border); border-radius: 4px; font-size: 13px; }

/* 汇总条 */
.sum-bar {
    display: flex; flex-wrap: wrap; gap: 22px; padding: 12px 16px;
    background: #f7f9fc; border-radius: 8px; margin-bottom: 12px; font-size: 13px;
}
.sum-bar .sum-item .k { color: var(--text-sub); margin-right: 6px; }
.sum-bar .sum-item .v { font-weight: 600; font-variant-numeric: tabular-nums; }
.v-red { color: #ff5722; }
.v-green { color: #16baaa; }
.v-blue { color: #1e6fff; }

/* 区块标题 */
.block-title {
    font-size: 14px; font-weight: 600; margin: 16px 0 8px;
    padding-left: 9px; border-left: 3px solid var(--brand);
}
.detail-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 8px 20px; font-size: 13.5px; }
.detail-grid .dg-item { padding: 5px 0; border-bottom: 1px dashed #eef1f6; }
.detail-grid .dg-item .k { color: var(--text-sub); margin-right: 8px; }
.form-tip { color: var(--text-sub); font-size: 12px; margin-top: 4px; }

/* =========================================================
   移动端适配（iPhone / 智能手机，<768px）
   - 侧边栏改为抽屉（汉堡按钮呼出，遮罩点击关闭）
   - 弹窗全屏化（覆盖 JS 里写死的 px 宽度）
   - 表格容器横向滚动
   - 表单栅格 / 汇总条 / 详情栅格单列化
   ========================================================= */

/* 汉堡按钮：仅移动端显示 */
.menu-toggle {
    display: none; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: 8px; cursor: pointer;
    font-size: 19px; color: #374151; margin-right: 2px;
}
.menu-toggle:active { background: #f1f5fb; }
.sidebar-mask {
    display: none; position: fixed; inset: 0; top: 58px;
    background: rgba(15, 23, 42, .45); z-index: 898; /* 低于侧边栏 900，但侧边栏自身宽度 232px，遮罩覆盖其余区域 */
}

@media (max-width: 768px) {
    /* ---- 主框架：抽屉 ---- */
    .menu-toggle { display: flex; }
    .layout-logo { width: auto; padding: 0 6px; }
    .layout-logo span { font-size: 15px; }
    .layout-sidebar {
        width: 232px; transform: translateX(-100%);
        transition: transform .22s ease; box-shadow: 2px 0 12px rgba(0,0,0,.25);
    }
    .layout-sidebar .side-item span, .layout-sidebar .side-child { display: block; }
    body.drawer-open .layout-sidebar { transform: translateX(0); }
    body.drawer-open .sidebar-mask { display: block; }
    .layout-body { margin-left: 0; }
    .header-user .meta .dept { display: none; }
    .header-user .meta .name { font-size: 12px; }

    /* ---- 页面骨架 ---- */
    .page-wrap { padding: 10px; }
    .page-card { padding: 12px 12px; border-radius: 8px; margin-bottom: 10px; }
    .page-head h2 { font-size: 15px; }

    /* ---- 工具栏：控件占满行 ---- */
    .layui-form.toolbar .layui-form-item { gap: 6px; }
    .layui-form.toolbar .layui-input,
    .layui-form.toolbar select,
    .layui-form.toolbar .form-control { width: 100% !important; flex: 1 1 calc(50% - 3px) !important; min-width: 0; }
    .layui-form.toolbar .layui-btn { flex: 0 0 auto; }
    .report-btns { width: 100%; justify-content: flex-start; flex-wrap: wrap; }

    /* ---- Layui 表格：视图自身横向滚动（列多时不撑破卡片） ----
       关键：从 page-card 往下全部锁定 width:100%（阻断「父宽由子内容决定」的循环），
       再让 table-view 内部滚动。 */
    .page-card, .split-main, .layui-form.toolbar, .layui-form.toolbar .layui-form-item {
        width: 100%; max-width: 100%; overflow-x: visible;
    }
    .layui-table-view {
        width: 100% !important; max-width: 100% !important;
        overflow-x: auto; -webkit-overflow-scrolling: touch;
    }
    .layui-table-box { min-width: 0; width: 100%; }
    .layui-table { min-width: 560px; }
    /* Layui 固定列：移动端取消 fixed 定位（fixed 定位按表格总宽计算，
       视图滚动后会错位到视口外），操作列跟随表格横向滚动 */
    .layui-table-fixed { display: none !important; }
    .layui-table-box { overflow-x: auto; -webkit-overflow-scrolling: touch; }

    /* ---- 弹窗全屏化（覆盖 layer.open 写死的 px） ---- */
    .layui-layer { width: 100% !important; max-width: 100vw !important; left: 0 !important; top: 0 !important; height: 100% !important; max-height: 100% !important; border-radius: 0 !important; }
    .layui-layer .layui-layer-content { overflow-y: auto !important; -webkit-overflow-scrolling: touch; }
    .layui-layer-btn { padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
    .layui-layer-title { font-size: 15px; }
    .layui-layer-setwin { top: 12px; }

    /* ---- 表单：单列 ---- */
    .form-grid { grid-template-columns: 1fr; }
    .layui-form-label { width: 120px !important; }
    .layui-input-block { margin-left: 130px !important; }

    /* ---- 汇总条 / 详情栅格 ---- */
    .sum-bar { flex-wrap: wrap; gap: 8px; }
    .sum-item { flex: 1 1 calc(50% - 4px); min-width: 0; }
    .detail-grid { grid-template-columns: 1fr !important; }

    /* ---- 选项卡：可横滑 ---- */
    .mod-tabs { overflow-x: auto; flex-wrap: nowrap; padding: 0 10px; -webkit-overflow-scrolling: touch; }
    .mod-tabs .mod-tab { white-space: nowrap; padding: 10px 13px; font-size: 13.5px; }

    /* ---- 日历（FullCalendar）---- */
    .fc .fc-toolbar-title { font-size: 15px; }
    .fc .fc-button { padding: 2px 6px; font-size: 12px; }
    .fc .fc-toolbar-chunk { display: flex; gap: 2px; }
    .fc .fc-toolbar { flex-wrap: wrap; gap: 6px; }
    .fc-theme-standard .fc-scrollgrid { min-width: 480px; }
    #calendar { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .fc .fc-daygrid-day-number, .fc .fc-col-header-cell-cushion { font-size: 11px; padding: 2px 3px; }
    .fc .fc-event { font-size: 10.5px; }
    .fc .fc-daygrid-event-harness { max-width: 96%; }

    /* ---- 通知 / 消息列表 ---- */
    .notice-item { flex-direction: column; gap: 4px; }

    /* ---- 两栏布局已由 900px 断点处理，补充内边距 ---- */
    .split-side { flex: 0 0 auto; }

    /* ---- mini 表格 ---- */
    .mini-table { font-size: 12px; }

    /* ---- 权限页双栏：折叠为单栏 ---- */
    .perm-grid { grid-template-columns: 1fr !important; gap: 14px !important; }
    .perm-grid > div { max-width: 100%; min-width: 0; }

    /* ---- Layui 树（权限菜单等）：不撑破视口 ---- */
    .layui-tree { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .layui-tree-set { max-width: 100%; }
    .layui-tree-entry { max-width: 100%; }
    .layui-tree-main { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }

    /* ---- iPhone 安全区 ---- */
    .layout-header { padding-left: max(10px, env(safe-area-inset-left)); padding-right: max(10px, env(safe-area-inset-right)); }
    .layout-body { padding-top: 58px; }
}

/* ============================================================
   第五十七轮：表格显示优化
   1) 单元格内容完整显示（不再用省略号截断）
   2) 右侧操作列按钮全部显示（自动换行，不被裁切）
   3) 表格上方工具条（右侧「筛选列」可勾选列的显示/隐藏）紧凑化
   ============================================================ */
.layui-table-view .layui-table-cell {
    height: auto !important;
    max-height: none !important;
    white-space: normal !important;
    word-break: break-word;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 20px;
    padding: 6px 10px;
}
.layui-table-view .layui-table td,
.layui-table-view .layui-table th {
    height: auto !important;
}
.layui-table-view .layui-table-cell .layui-btn-xs {
    margin: 1px 2px;
    padding: 0 7px;
    font-size: 12px;
    height: 23px;
    line-height: 23px;
}
.layui-table-tool { padding: 0 10px; min-height: 36px; }
.layui-table-tool .layui-table-tool-temp { padding-right: 0; }
.layui-table-tool .layui-inline { margin-bottom: 0; }

/* 第五十七轮：导出列选择弹窗 */
.ec-list { display: flex; flex-wrap: wrap; max-height: 46vh; overflow-y: auto; padding: 4px 0; }
.ec-item { display: inline-flex; align-items: center; gap: 6px; width: 48%; padding: 6px 4px;
    font-size: 13px; color: #334155; cursor: pointer; box-sizing: border-box; }
.ec-item:hover { background: #f6f8fc; border-radius: 4px; }
.ec-item input { width: 14px; height: 14px; flex: 0 0 auto; }
.ec-all { width: 100%; font-weight: 600; border-bottom: 1px solid var(--border); margin-bottom: 4px; }

/* 第五十七轮：收益管理里内嵌的工单收益报表 */
.wp-frame { width: 100%; border: 0; display: block; height: calc(100vh - 190px); min-height: 560px; }

/* 第五十八轮：安排日程弹窗——客户信息卡与改动对比 */
.sc-info { background:#f6f9fe; border:1px solid #dbe6f7; border-radius:8px; padding:10px 12px; margin:10px 0 14px; font-size:13px; color:#334155; }
.sc-info-t { font-weight:600; color:#1e6fff; margin-bottom:6px; }
.sc-info-g { display:flex; flex-wrap:wrap; gap:6px 24px; margin-bottom:4px; }
.sc-info-r { line-height:22px; }
.sc-info b { color:#0f172a; }
.sc-diff { margin-top:12px; }
.sc-diff-t { font-weight:600; color:#b45309; margin-bottom:6px; font-size:13px; }
.sc-diff-r { display:flex; align-items:center; gap:8px; font-size:13px; line-height:24px; flex-wrap:wrap; }
.sc-diff-r .k { width:70px; color:#64748b; flex:0 0 auto; }
.sc-diff-r .old { color:#94a3b8; text-decoration:line-through; }
.sc-diff-r .ar { color:#0ea5e9; font-style:normal; }
.sc-diff-r .new { color:#dc2626; font-weight:600; }

/* 第五十八轮：工单流程线路（已完成绿 / 未完成红） */
.wf-flow { display:flex; align-items:center; flex-wrap:wrap; gap:2px 4px; margin:0 0 14px;
    padding:9px 12px; background:#f8fafc; border:1px solid #e8eef7; border-radius:8px; font-size:13px; }
.wf-flow-t { color:#64748b; margin-right:10px; font-weight:600; }
.wf-flow-s { display:inline-flex; align-items:center; gap:5px; padding:2px 0; }
.wf-flow-s .dot { width:9px; height:9px; border-radius:50%; display:inline-block; flex:0 0 auto; }
.wf-flow-s.done .dot { background:#16a34a; }
.wf-flow-s.undone .dot { background:#dc2626; }
.wf-flow-s.done { color:#16a34a; font-weight:600; }
.wf-flow-s.undone { color:#dc2626; }
.wf-flow-line { display:inline-block; width:20px; height:1px; background:#cbd5e1; flex:0 0 auto; }
.wf-flow-back { border:1px solid #bae6fd; background:#f0f9ff; color:#0284c7; font-size:11px;
    line-height:1.6; cursor:pointer; padding:0 6px; border-radius:9px; margin-left:3px;
    transition:background .15s,color .15s,border-color .15s; }
.wf-flow-back:hover { background:#0284c7; color:#fff; border-color:#0284c7; }
.wf-flow-s { white-space:nowrap; }
.wf-flow { row-gap:8px; }
.wf-flow-now { margin-left:auto; color:#64748b; }

/* 第五十八轮：现场紧急开单 */
.emg-box { border:1px solid #fecaca; background:#fff7f7; border-radius:8px; padding:12px 14px; margin:0 0 14px; }
.emg-warn { color:#b91c1c; font-size:13px; line-height:1.7; background:#fef2f2; border-left:3px solid #dc2626;
    padding:8px 10px; border-radius:5px; margin-bottom:12px; }
.emg-sec { font-size:14px; font-weight:600; color:#b91c1c; margin:12px 0 8px; padding-left:8px; border-left:3px solid #dc2626; }
.emg-note { background:#fff; border:1px dashed #fca5a5; border-radius:6px; padding:10px 12px;
    font-size:12.5px; line-height:1.85; color:#475569; margin-bottom:10px; }
.emg-pad { position:relative; border:1px dashed #fca5a5; border-radius:6px; background:#fff; }
.emg-pad canvas { display:block; width:100%; height:150px; touch-action:none; cursor:crosshair; }
.emg-pad-tip { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
    color:#cbd5e1; font-size:15px; pointer-events:none; user-select:none; }
.emg-tag { display:inline-block; font-size:11px; padding:1px 6px; border-radius:9px; margin-top:3px; }
.emg-tag-warn { background:#fef2f2; color:#dc2626; border:1px solid #fecaca; }
.emg-tag-ok { background:#f0fdf4; color:#16a34a; border:1px solid #bbf7d0; }