@charset "UTF-8";
/* css/style.css — 全局样式（沿用 Ant Design 蓝色主题）
   颜色变量定义在 css/themes/default.css，可被其他主题覆盖 */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --primary-color: #1890ff;
    --primary-hover: #40a9ff;
    --primary-active: #096dd9;
    --sidebar-bg: #001529;
    --sidebar-hover: #1890ff;
    --topnav-bg: #001529;
    --content-bg: #f0f2f5;
    --card-bg: #ffffff;
    --text-color: #333333;
    --text-secondary: #666666;
    --border-color: #e8e8e8;
    --success-color: #52c41a;
    --warning-color: #faad14;
    --danger-color: #ff4d4f;
    --info-color: #1890ff;
    --shadow: 0 2px 8px rgba(0,0,0,0.08);
    --border-radius: 4px;
    --table-header-bg: #fafafa;
    --input-bg: #ffffff;
    --hover-bg: #f5f5f5;
}

body {
    font-family: 'Microsoft YaHei', 'Segoe UI', Arial, sans-serif;
    background-color: var(--content-bg);
    color: var(--text-color);
    font-size: var(--global-font-size, 14px);
}

/* ==================== 全局字体大小缩放 ==================== */
/* 覆盖所有硬编码 font-size 的组件元素，确保滑动条调节对菜单/表格/表单/按钮/标签/弹窗等全部生效 */
.sidebar .menu-item span,
.sidebar .submenu li,
.sidebar .menu-item,
.data-table th,
.data-table td,
.stat-card .stat-title,
.stat-card .stat-value,
.card-header,
.card-header span,
.card-body,
.card-body label,
.form-group label,
.form-group input,
.form-group select,
.form-group textarea,
.form-group span,
input:not(.font-size-control input),
select:not(.theme-select):not(.font-size-control select),
textarea,
button:not(.font-size-control button),
.tab-btn,
.tag,
.badge,
.modal-title,
.modal-body,
.modal-body label,
.modal-body input,
.modal-body select,
.modal-body textarea,
.modal-body p,
.modal-body span,
.modal-footer button,
.top-nav,
.top-nav .search-bar input,
.top-nav .search-bar button,
.header-right .welcome-text,
.header-right .countdown-text,
.header-right .countdown-time,
.header-right .countdown-hint,
.logout-btn,
.acc-input,
.acc-pool-name,
.acc-pool-init,
.acc-pool-cur,
.acc-pool-sum,
.acc-pool-title,
.acc-btn-add,
.acc-btn-save,
.acc-btn-minus,
.acc-compare-label,
.acc-compare-value,
.acc-compare-result,
.acc-compare-hint,
.acc-filter-bar label,
.acc-filter-bar select,
.acc-filter-bar input,
.acc-search-input,
.settle-card .card-row,
.station-info-name,
.station-info-status,
.station-info-shift,
.sfc-label,
.st-form,
.st-form label,
.st-input,
.st-select,
.st-textarea,
.st-field-label,
.st-panel-title,
.st-btn-add,
.st-btn-del,
.st-header-title,
.st-header-sub,
.st-info-label,
.st-info-value,
.st-hint,
.st-perm-grid label,
.fe-info-label,
.fe-info-value,
.fe-hint,
.dr-form label,
.dr-form input,
.dr-form select,
.dr-form textarea,
.security-item-title,
.security-item-desc,
.security-item input,
.security-notice-text,
.empty-state,
.loading,
.text-success,
.text-warning,
.text-secondary,
.acc-name-picker button,
.acc-proj-row input,
.sort-btns button,
.fc-card-title,
.fc-card-value,
.fc-card-label,
.risk-card .risk-title,
.risk-card .risk-value,
.config-tabs .tab-btn,
.station-list-card td,
.station-list-card th,
/* 站内功能模块 (station-func.js 内联样式) */
.dr-header-label,
.dr-header-input,
.dr-shift-bar,
.dr-panel-title,
.dr-table,
.dr-table th,
.dr-table td,
.dr-label-text,
.dr-col-title,
.dr-input,
.dr-text-input,
.dr-btn-add,
.dr-btn-rm,
.dr-readonly,
.dr-val,
.dr-foot-label,
.dr-foot-value,
/* 运营审核模块 (operate.js 内联样式) */
.sa-header-icon,
.sa-header-title,
.sa-header-sub,
.sa-panel-title,
.sa-info-label,
.sa-info-value,
.sa-field-label,
.sa-input,
.sa-select,
.sa-threshold-save,
.sa-hint,
.sa-diff-label,
.sa-diff-value,
.sa-diff-status,
/* 弹窗内文本段落 */
.modal-body div,
.modal-body .text-secondary,
.modal-body .text-info {
    font-size: var(--global-font-size, 14px) !important;
}

/* ==================== 登录页面 ==================== */
.login-body {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.login-container {
    background: white;
    padding: 40px;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    width: 400px;
    max-width: 90vw;
}

.login-header {
    text-align: center;
    margin-bottom: 30px;
}

.login-header h1 {
    color: #333;
    margin-bottom: 10px;
    font-size: 22px;
}

.login-header p {
    color: #666;
    font-size: 14px;
}

.form-group {
    margin-bottom: 20px;
}

/* 两列表单并排布局（如油品型号+品类） */
.form-row-2 {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
}
.form-row-2 .form-group {
    flex: 1;
    margin-bottom: 0;
}

.form-group label {
    display: block;
    margin-bottom: 5px;
    color: #333;
    font-weight: bold;
}

.form-group label.checkbox-row {
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: normal;
    white-space: nowrap;
    margin-bottom: 0;
    cursor: pointer;
}

.form-group label.checkbox-row input[type="checkbox"] {
    width: auto;
    margin: 0;
    cursor: pointer;
}

.form-group label.checkbox-row span {
    color: #333;
    font-weight: normal;
    line-height: 1.5;
}

.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    font-size: 14px;
    background: var(--input-bg);
    color: var(--text-color);
    transition: border-color 0.3s;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    border-color: var(--primary-color);
    outline: none;
    box-shadow: 0 0 0 2px rgba(24,144,255,0.2);
}

.phone-input {
    display: flex;
    gap: 10px;
}

.phone-input input { flex: 1; }

.sms-btn {
    padding: 10px 15px;
    background: #f0f0f0;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    cursor: pointer;
    white-space: nowrap;
}

.sms-btn:hover { background: var(--hover-bg); }

/* 密码框：可见切换按钮 + Caps Lock 提示 */
.pwd-wrap { position: relative; }
.pwd-wrap input { padding-right: 40px; }
.pwd-toggle {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    padding: 2px;
    border: none;
    background: transparent;
    color: #999;
    cursor: pointer;
    line-height: 1;
}
.pwd-toggle:hover { color: var(--primary-color); }
.capslock-tip {
    margin-top: 4px;
    font-size: 12px;
    color: var(--warning-color, #faad14);
}

.login-btn {
    width: 100%;
    padding: 12px;
    background: var(--primary-color);
    color: white;
    border: none;
    border-radius: var(--border-radius);
    font-size: 16px;
    cursor: pointer;
    margin-bottom: 15px;
    transition: background 0.3s;
}

.login-btn:hover:not(:disabled) { background: var(--primary-hover); }
.login-btn:disabled { background: #bbb; cursor: not-allowed; }

.login-links {
    text-align: center;
}

.login-links a {
    color: var(--primary-color);
    text-decoration: none;
    font-size: 13px;
}

.login-links a:hover { text-decoration: underline; }

.icp-footer {
    color: rgba(255,255,255,0.7);
    font-size: 12px;
    margin-top: 20px;
    text-align: center;
}

/* ==================== 主应用 ==================== */
.app-container {
    height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--content-bg);
}

.app-header {
    background: var(--topnav-bg);
    color: white;
    padding: 0 20px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 1px 4px rgba(0,0,0,0.1);
    position: relative;
    z-index: 100;
}

.header-left {
    display: flex;
    align-items: center;
    gap: 10px;
}

.header-left h1 {
    font-size: 18px;
    color: white;
    white-space: nowrap;
}

.header-center {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
}

/* ==================== 退出倒计时 ==================== */
.logout-countdown {
    display: flex;
    align-items: center;
    gap: 4px;
    background: rgba(255, 77, 79, 0.9);
    color: #fff;
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 13px;
    animation: countdown-pulse 1s ease-in-out infinite alternate;
    white-space: nowrap;
}

.logout-countdown .countdown-icon {
    font-size: 14px;
}

.logout-countdown .countdown-time {
    font-weight: bold;
    font-size: 16px;
    color: #fff;
    min-width: 28px;
    text-align: center;
}

.logout-countdown .countdown-hint {
    font-size: 11px;
    opacity: 0.85;
    margin-left: 4px;
}

@keyframes countdown-pulse {
    from { box-shadow: 0 0 0 0 rgba(255, 77, 79, 0.4); }
    to { box-shadow: 0 0 0 6px rgba(255, 77, 79, 0); }
}

.search-bar {
    display: flex;
    gap: 8px;
    max-width: 400px;
    width: 100%;
}

.search-bar input {
    flex: 1;
    padding: 6px 12px;
    border: none;
    border-radius: var(--border-radius);
    font-size: 14px;
}

.search-bar button {
    padding: 6px 16px;
    background: var(--primary-color);
    color: white;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
}

.header-right {
    display: flex;
    align-items: center;
    gap: 12px;
}

.header-right .welcome-text { font-size: 14px; }
.header-right select.theme-select {
    padding: 4px 8px;
    border-radius: var(--border-radius);
    border: none;
    font-size: 13px;
}

/* 全局字体大小调节控件 */
.font-size-control {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: var(--border-radius);
    background: color-mix(in srgb, var(--text-color, #333) 6%, transparent);
    border: 1px solid color-mix(in srgb, var(--border-color, #d9d9d9) 50%, transparent);
}
.font-size-label {
    font-weight: 700;
    color: var(--text-secondary, #666);
    font-size: 13px;
    line-height: 1;
    user-select: none;
}
.font-size-label small {
    font-weight: 400;
    font-size: 10px;
    vertical-align: super;
}
.font-size-btn {
    cursor: pointer;
    padding: 2px 4px;
    border-radius: 3px;
    transition: background 0.15s, color 0.15s;
}
.font-size-btn:hover {
    background: color-mix(in srgb, var(--primary-color, #1890ff) 15%, transparent);
    color: var(--primary-color, #1890ff);
}
.font-size-btn:active {
    background: color-mix(in srgb, var(--primary-color, #1890ff) 25%, transparent);
}
.font-size-control input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    width: 64px;
    height: 4px;
    border-radius: 2px;
    background: color-mix(in srgb, var(--text-color, #333) 18%, transparent);
    outline: none;
    cursor: pointer;
}
.font-size-control input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--primary-color, #1890ff);
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    cursor: pointer;
    transition: transform 0.15s;
}
.font-size-control input[type="range"]::-webkit-slider-thumb:hover {
    transform: scale(1.2);
}
.font-size-control input[type="range"]::-moz-range-thumb {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--primary-color, #1890ff);
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    cursor: pointer;
}
.font-size-value {
    font-size: 11px;
    color: var(--text-secondary, #666);
    min-width: 28px;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.logout-btn {
    padding: 6px 14px;
    background: var(--danger-color);
    color: white;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    font-size: 13px;
}

.logout-btn:hover { opacity: 0.85; }

.menu-toggle {
    display: none;
}

.app-body {
    flex: 1;
    display: flex;
    overflow: hidden;
    gap: 0;
}

/* ==================== 侧边栏 ==================== */
.sidebar {
    background: var(--sidebar-bg);
    color: rgba(255,255,255,0.85);
    width: 250px;
    overflow-y: auto;
    flex-shrink: 0;
}

.sidebar ul.menu {
    list-style: none;
    padding: 8px 0;
}

.sidebar .menu-item {
    cursor: pointer;
    user-select: none;
}

.sidebar .menu-item > span:first-child {
    display: block;
    padding: 12px 20px;
    font-size: 14px;
    transition: background 0.2s;
}

.sidebar .menu-item:hover > span:first-child {
    background: var(--sidebar-hover);
    color: #fff;
}

.sidebar .menu-item.active > span:first-child {
    background: var(--primary-color);
    color: #fff;
}

.sidebar .submenu {
    list-style: none;
    background: rgba(0,0,0,0.2);
    display: none;
}

.sidebar .menu-item.active .submenu { display: block; }

.sidebar .submenu li {
    padding: 10px 20px 10px 40px;
    font-size: 13px;
    cursor: pointer;
    color: rgba(255,255,255,0.75);
    transition: all 0.2s;
}

.sidebar .submenu li:hover {
    background: var(--sidebar-hover);
    color: #fff;
}

.sidebar .submenu li.active {
    background: var(--primary-color);
    color: #fff;
}

/* ==================== 主内容区 ==================== */
.main-content {
    flex: 1;
    padding: 30px;
    overflow-y: auto;
    background: var(--content-bg);
}

.page { display: none; }
.page.active { display: block; }

/* ==================== 卡片 ==================== */
.stat-cards {
    display: grid;
    gap: 16px;
    margin-bottom: 30px;
}

.stat-card {
    background: var(--card-bg);
    padding: 16px;
    border-radius: var(--border-radius);
    box-shadow: var(--shadow);
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
}

.stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}

.stat-title {
    color: var(--text-secondary);
    font-size: 13px;
    margin-bottom: 8px;
}

.stat-value {
    color: var(--text-color);
    font-size: 22px;
    font-weight: bold;
}

/* ==================== 表格 ==================== */
.card {
    background: var(--card-bg);
    border-radius: var(--border-radius);
    box-shadow: var(--shadow);
    margin-bottom: 30px;
    overflow: hidden;
}

.card-header {
    padding: 10px 16px;
    border-bottom: 1px solid var(--border-color);
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--card-bg);
}

.card-body { padding: 14px 16px; }

.table-wrapper {
    overflow-x: auto;
    background: var(--card-bg);
    border-radius: var(--border-radius);
}

/* === 油站列表：增加左右内边距，更美观 === */
.station-list-card .station-list-table {
    padding: 0 24px;
}
.station-list-card .data-table th:first-child,
.station-list-card .data-table td:first-child {
    padding-left: 8px;
}
.station-list-card .data-table th:last-child,
.station-list-card .data-table td:last-child {
    padding-right: 8px;
}

/* === 油站排序按钮（上移/下移）=== */
.sort-btns {
    display: inline-flex;
    flex-direction: column;
    gap: 0;
    line-height: 1;
}
.sort-btns .sort-btn {
    padding: 1px 6px;
    font-size: 11px;
    color: #1890ff;
    line-height: 1.2;
}
.sort-btns .sort-btn:hover:not(:disabled) {
    color: #096dd9;
    background: #e6f4ff;
    border-radius: 3px;
}
.sort-btns .sort-btn:disabled,
.sort-btns .sort-btn.disabled {
    color: #d9d9d9;
    cursor: not-allowed;
}

table.data-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--card-bg);
}

table.data-table th,
table.data-table td {
    padding: 10px 12px;
    text-align: left;
    border-bottom: 1px solid var(--border-color);
    font-size: 13px;
    white-space: nowrap;
}

table.data-table th {
    background: var(--table-header-bg);
    font-weight: 600;
    color: var(--text-color);
}

table.data-table tr:hover td {
    background: var(--hover-bg);
}

/* 表格列分组间隔 */
table.data-table th.col-spacer,
table.data-table td.col-spacer-cell {
    border: none;
    background: transparent;
    background-color: transparent !important;
    padding: 0;
    width: 24px;
    min-width: 24px;
    max-width: 24px;
    border-bottom: none;
}

/* 所有列表：标题和数值居中对齐（共享class + 向后兼容旧class） */
table.data-table.data-table-center th,
table.data-table.data-table-center td,
table.data-table.data-table-cc-center th,
table.data-table.data-table-cc-center td,
table.data-table.data-table-fd-center th,
table.data-table.data-table-fd-center td {
    text-align: center;
}
/* 操作列保持居中样式 */
table.data-table.data-table-center .ac-action-cell,
table.data-table.data-table-cc-center .ac-action-cell,
table.data-table.data-table-fd-center .ac-action-cell {
    text-align: center;
}

/* 锁定状态标签（深蓝色） */
.tag.tag-locked {
    background: #e6f7ff;
    color: #1890ff;
    border: 1px solid #91d5ff;
}

/* ==================== 资金部差值状态指示器 ==================== */
/* 橙色异常状态 */
.fd-diff-orange {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 4px;
    background: #fff3e0;
    color: #e65100;
    border: 1px solid #ffcc80;
    font-weight: 500;
}
/* 黄色异常状态 */
.fd-diff-yellow {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 4px;
    background: #fffde7;
    color: #f57f17;
    border: 1px solid #fff59d;
    font-weight: 500;
}
/* 严重异常状态（账目异常，挪用风险）— 浅红色背景、大红色边框、大红色文字、黄色感叹号 */
.fd-diff-red {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 4px;
    background: #ffebee;
    color: #c62828;
    border: 1.5px solid #ef5350;
    font-weight: 600;
}
.fd-diff-red .fd-diff-icon {
    color: #fdd835;
    font-size: 14px;
}
.fd-diff-label {
    font-size: 11px;
    margin-left: 2px;
}

/* ==================== 资金管理状态列标签（差值账目状态配置驱动） ==================== */
/* 与差值列(.fd-diff-*)共享同一套配色，状态列仅显示标签不含数值 */
.fd-status {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    line-height: 1.6;
}
.fd-status-label {
    display: inline-block;
}
.fd-status-icon {
    font-size: 13px;
    line-height: 1;
}
/* 正常 — 绿色（与账对 tag-approved 配色一致） */
.fd-status-normal {
    background: #f6ffed;
    color: #389e0d;
    border: 1px solid #b7eb8f;
}
/* 橙色异常 — 与 .fd-diff-orange 同色 */
.fd-status-orange {
    background: #fff3e0;
    color: #e65100;
    border: 1px solid #ffcc80;
    font-weight: 500;
}
/* 黄色异常 — 与 .fd-diff-yellow 同色 */
.fd-status-yellow {
    background: #fffde7;
    color: #f57f17;
    border: 1px solid #fff59d;
    font-weight: 500;
}
/* 严重异常（账目异常，挪用风险）— 与 .fd-diff-red 同色，加粗强调 */
.fd-status-red {
    background: #ffebee;
    color: #c62828;
    border: 1.5px solid #ef5350;
    font-weight: 600;
}

/* ==================== 资金部银行卡详情 ==================== */
.fd-bc-detail {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}
.fd-bc-total {
    font-weight: 600;
    color: var(--text-color);
}
.fd-bc-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: calc(var(--global-font-size, 14px) - 1px);
    line-height: 1.5;
}
.fd-bc-item {
    display: flex;
    align-items: center;
    gap: 2px;
    border-radius: 3px;
}
.fd-bc-name {
    white-space: nowrap;
    padding: 1px 0;
}
.fd-bc-colon {
    padding: 1px 1px;
}
.fd-bc-amt {
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    padding: 1px 0;
}
/* 着色行：圆角单元格 + 左右内边距 */
.fd-bc-item-colorized .fd-bc-name { border-radius: 3px 0 0 3px; padding: 1px 6px 1px 6px; }
.fd-bc-item-colorized .fd-bc-colon { padding: 1px 0; }
.fd-bc-item-colorized .fd-bc-amt { border-radius: 0 3px 3px 0; padding: 1px 6px 1px 0; }

/* ==================== 资金部：挂账欠款明细列（slot3 各名称纵向堆叠=行合并显示） ==================== */
/* 与 .fd-bc-* 银行卡列同构：单元格内多行堆叠，字体大小统一 */
.fd-bc-cell { padding: 4px 8px; }
.fd-credit-cell { padding: 4px 8px; }
.fd-credit-list { display: flex; flex-direction: column; gap: 2px; }
.fd-credit-item {
    display: flex;
    align-items: center;
    gap: 2px;
    font-size: calc(var(--global-font-size, 14px) - 1px);
    line-height: 1.6;
    font-variant-numeric: tabular-nums;
    padding: 1px 0;
}
.fd-credit-name { color: var(--text-color); white-space: nowrap; }
.fd-credit-colon { color: var(--text-secondary); }
.fd-credit-amt { color: var(--text-color); font-weight: 600; font-variant-numeric: tabular-nums; }

/* ==================== 按钮 ==================== */
.btn {
    padding: 6px 14px;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    font-size: 13px;
    transition: opacity 0.2s;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.btn:hover:not(:disabled) { opacity: 0.85; }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }

.btn-primary { background: var(--primary-color); color: #fff; }
.btn-success { background: var(--success-color); color: #fff; }
.btn-warning { background: var(--warning-color); color: #fff; }
.btn-danger { background: var(--danger-color); color: #fff; }
.btn-dark-yellow { background: #d48806; color: #fff; }
.btn-dark-yellow:hover:not(:disabled) { background: #ad6800; }
.btn-default { background: #fff; color: var(--text-color); border: 1px solid var(--border-color); }
.btn-link { background: transparent; color: var(--primary-color); padding: 2px 6px; }
.btn-sm { padding: 3px 8px; font-size: 12px; }

/* ==================== 筛选栏 ==================== */
.filter-bar {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
    flex-wrap: wrap;
    align-items: center;
    background: var(--card-bg);
    padding: 14px;
    border-radius: var(--border-radius);
    box-shadow: var(--shadow);
}

/* 交班按钮：大号红色，靠右对齐（与列表"操作"列对齐） */
.sf-shift-btn {
    margin-left: auto;
    font-weight: 700;
    letter-spacing: 1px;
    box-shadow: 0 2px 6px rgba(255,77,79,0.35);
    border: none;
    min-width: 120px;
}
.sf-shift-btn:hover {
    background: #d9363e !important;
    transform: translateY(-1px);
}

.filter-bar label {
    font-size: 13px;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 4px;
}

.filter-bar input,
.filter-bar select {
    padding: 5px 10px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    font-size: 13px;
    background: var(--input-bg);
    color: var(--text-color);
}

/* ==================== 分页 ==================== */
.pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 16px;
    padding: 10px 0;
    flex-wrap: wrap;
    gap: 8px;
}

.pagination-info {
    color: var(--text-secondary);
    font-size: 13px;
}

.pagination-controls {
    display: flex;
    gap: 4px;
    align-items: center;
}

.pagination-controls button {
    padding: 4px 10px;
    border: 1px solid var(--border-color);
    background: var(--card-bg);
    color: var(--text-color);
    border-radius: var(--border-radius);
    cursor: pointer;
    font-size: 13px;
}

.pagination-controls button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.pagination-controls button.active {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
}

/* ==================== 弹窗 ==================== */
.modal-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.45);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.modal-content {
    background: var(--card-bg);
    border-radius: 8px;
    width: 100%;
    max-width: 600px;
    max-height: 92vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 6px 20px rgba(0,0,0,0.2);
    overflow: hidden;
}

.modal-header {
    padding: 14px 20px;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
}

.modal-header h3 { font-size: 16px; color: var(--text-color); }

.modal-close {
    font-size: 22px;
    cursor: pointer;
    color: var(--text-secondary);
    line-height: 1;
}

.modal-close:hover { color: var(--text-color); }

.modal-body {
    padding: 16px;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.modal-footer {
    padding: 14px 20px;
    border-top: 1px solid var(--border-color);
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    flex-shrink: 0;
}

/* ==================== 标签 ==================== */
.tag {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 12px;
    line-height: 1.5;
}

.tag-pending { background: #fff7e6; color: var(--warning-color); border: 1px solid #ffe58f; }
.tag-approved, .tag-matched { background: #f6ffed; color: var(--success-color); border: 1px solid #b7eb8f; }
.tag-rejected, .tag-unmatched { background: #fff1f0; color: var(--danger-color); border: 1px solid #ffa39e; }
.tag-extra { background: #f9f0ff; color: #722ed1; border: 1px solid #d3adf7; }
.tag-default { background: #f0f0f0; color: var(--text-secondary); }

/* ==================== 悬停备注浮窗（审核状态错误原因等） ==================== */
/* 使用 position:fixed + JS 定位，避免被表格 overflow-x:auto 裁剪 */
.sf-tag-tooltip {
    position: fixed;
    z-index: 10001;
    background: color-mix(in srgb, var(--card-bg, #fff) 92%, #000 8%);
    color: var(--text-color, #333);
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 12px;
    line-height: 1.6;
    max-width: 320px;
    min-width: 80px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.08);
    border: 1px solid color-mix(in srgb, var(--border-color, #d9d9d9) 80%, transparent);
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 0.15s ease, transform 0.15s ease;
    pointer-events: none;
    word-break: break-word;
    white-space: normal;
}
.sf-tag-tooltip.sf-tag-tooltip-visible {
    opacity: 1;
    transform: translateY(0);
}
/* 箭头：默认在浮窗底部（浮窗显示在触发元素上方时） */
.sf-tag-tooltip[data-arrow="bottom"]::after {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-bottom-color: color-mix(in srgb, var(--border-color, #d9d9d9) 80%, transparent);
}
.sf-tag-tooltip[data-arrow="bottom"]::before {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(1px);
    border: 5px solid transparent;
    border-bottom-color: color-mix(in srgb, var(--card-bg, #fff) 92%, #000 8%);
    z-index: 1;
}
/* 箭头：在浮窗顶部（浮窗显示在触发元素下方时） */
.sf-tag-tooltip[data-arrow="top"]::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: color-mix(in srgb, var(--border-color, #d9d9d9) 80%, transparent);
}
.sf-tag-tooltip[data-arrow="top"]::before {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(-1px);
    border: 5px solid transparent;
    border-top-color: color-mix(in srgb, var(--card-bg, #fff) 92%, #000 8%);
    z-index: 1;
}

/* ==================== 状态颜色 ==================== */
.text-success { color: var(--success-color); }
.text-warning { color: var(--warning-color); }
.text-danger { color: var(--danger-color); }
.text-info { color: var(--info-color); }
.text-secondary { color: var(--text-secondary); }

/* ==================== 结账卡片 ==================== */
.station-settle-row {
    background: var(--card-bg);
    border-radius: var(--border-radius);
    box-shadow: var(--shadow);
    margin-bottom: 16px;
    overflow: hidden;
}

.station-header {
    padding: 12px 20px;
    background: var(--table-header-bg);
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 600;
    flex-wrap: wrap;
    gap: 8px;
}

.shift-cards {
    display: flex;
    gap: 12px;
    padding: 16px;
    flex-wrap: wrap;
}

.settle-card {
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    padding: 14px;
    min-width: 240px;
    flex: 1;
    background: var(--card-bg);
}

.settle-card.locked {
    background: var(--hover-bg);
    border-color: var(--border-color);
}

.settle-card .card-row {
    margin-bottom: 8px;
    font-size: 13px;
    display: flex;
    justify-content: space-between;
    gap: 8px;
}

.settle-card .card-actions {
    margin-top: 10px;
    display: flex;
    gap: 6px;
}

.settle-card input.oil-machine-input {
    width: 100px;
    padding: 4px 8px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
}

/* ==================== Excel 表格 ==================== */
.excel-table-wrapper {
    overflow: auto;
    background: var(--card-bg);
    border-radius: var(--border-radius);
    border: 1px solid var(--border-color);
}

.excel-table {
    border-collapse: collapse;
    font-size: 12px;
}

.excel-table th,
.excel-table td {
    border: 1px solid var(--border-color);
    padding: 4px;
    min-width: 60px;
}

.excel-table th {
    background: var(--table-header-bg);
    font-weight: 600;
    text-align: center;
    min-width: 40px;
}

.excel-table td.row-num {
    background: var(--table-header-bg);
    text-align: center;
    color: var(--text-secondary);
    width: 40px;
}

.excel-table input {
    width: 100%;
    border: none;
    padding: 4px 6px;
    background: transparent;
    font-size: 12px;
}

.excel-table input:focus {
    outline: 2px solid var(--primary-color);
    background: #fff;
}

.excel-table input.formula-cell {
    background: #fafafa;
    color: var(--primary-color);
}

/* ==================== 卡片网格 ==================== */
.card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
}

.fund-card {
    background: var(--card-bg);
    border-radius: var(--border-radius);
    box-shadow: var(--shadow);
    padding: 16px;
}

.fund-card .fund-row {
    display: flex;
    justify-content: space-between;
    padding: 4px 0;
    font-size: 13px;
    border-bottom: 1px dashed var(--border-color);
}

.fund-card .fund-row:last-child { border-bottom: none; }

.fund-card .fund-header {
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
}

/* ==================== 油站功能页面 ==================== */
.station-func-page {
    max-width: 1200px;
}

.station-info-card {
    background: var(--card-bg, #fff);
    border-radius: 8px;
    padding: 16px 24px;
    display: flex;
    align-items: center;
    gap: 20px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    border: 1px solid var(--border-color, #e8e8e8);
    margin-bottom: 30px;
    color: var(--text-color, #1a1a1a);
}

.station-info-name {
    font-size: 18px;
    font-weight: 600;
    color: var(--text-color, #1a1a1a);
    flex-shrink: 0;
}

.station-info-status {
    font-size: 14px;
    padding: 4px 12px;
    background: color-mix(in srgb, var(--status-success-color, #52c41a) 12%, var(--card-bg, #fff) 88%);
    border: 1px solid color-mix(in srgb, var(--status-success-color, #52c41a) 45%, transparent 55%);
    color: var(--status-success-color, #389e0d);
    border-radius: 4px;
    flex-shrink: 0;
}

.station-info-shift {
    font-size: 14px;
    color: var(--text-secondary-color, #666);
    padding: 4px 12px;
    background: var(--hover-bg, #f5f5f5);
    border: 1px solid var(--border-color, #e8e8e8);
    border-radius: 4px;
    flex-shrink: 0;
}

.station-func-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
@media (max-width: 640px) {
    .station-func-grid { grid-template-columns: repeat(2, 1fr); }
}

.station-func-card {
    background: linear-gradient(135deg, #1890ff 0%, #096dd9 100%);
    color: #fff;
    border-radius: 10px;
    padding: 24px 16px;
    text-align: center;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    box-shadow: 0 2px 8px rgba(24,144,255,0.25);
    min-height: 110px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.station-func-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 6px 16px rgba(24,144,255,0.4);
}

.station-func-card:nth-child(2n) {
    background: linear-gradient(135deg, #13c2c2 0%, #006d75 100%);
    box-shadow: 0 2px 8px rgba(19,194,194,0.25);
}

.station-func-card:nth-child(2n):hover {
    box-shadow: 0 6px 16px rgba(19,194,194,0.4);
}

.station-func-card:nth-child(3n) {
    background: linear-gradient(135deg, #fa8c16 0%, #d46b08 100%);
    box-shadow: 0 2px 8px rgba(250,140,22,0.25);
}

.station-func-card:nth-child(3n):hover {
    box-shadow: 0 6px 16px rgba(250,140,22,0.4);
}

.station-func-card:nth-child(4n) {
    background: linear-gradient(135deg, #722ed1 0%, #531dab 100%);
    box-shadow: 0 2px 8px rgba(114,46,209,0.25);
}

.station-func-card:nth-child(4n):hover {
    box-shadow: 0 6px 16px rgba(114,46,209,0.4);
}

.station-func-card:nth-child(5n) {
    background: linear-gradient(135deg, #eb2f96 0%, #c41d7f 100%);
    box-shadow: 0 2px 8px rgba(235,47,150,0.25);
}

.station-func-card:nth-child(5n):hover {
    box-shadow: 0 6px 16px rgba(235,47,150,0.4);
}

.station-func-card:nth-child(6n) {
    background: linear-gradient(135deg, #52c41a 0%, #389e0d 100%);
    box-shadow: 0 2px 8px rgba(82,196,26,0.25);
}

.station-func-card:nth-child(6n):hover {
    box-shadow: 0 6px 16px rgba(82,196,26,0.4);
}

.station-func-card:nth-child(7n) {
    background: linear-gradient(135deg, #faad14 0%, #d48806 100%);
    box-shadow: 0 2px 8px rgba(250,173,20,0.25);
}

.station-func-card:nth-child(7n):hover {
    box-shadow: 0 6px 16px rgba(250,173,20,0.4);
}

.station-func-card:nth-child(8n) {
    background: linear-gradient(135deg, #eb2f96 0%, #722ed1 100%);
    box-shadow: 0 2px 8px rgba(235,47,150,0.25);
}
.station-func-card:nth-child(8n):hover {
    box-shadow: 0 6px 16px rgba(235,47,150,0.4);
}

/* 「站内记账」科技感样式 — 渐变 + 发光 + 扫光 + 悬停微动画 */
/* 颜色基于 --primary-color 派生，未覆盖时由主题色决定；各主题可在 themes/*.css 中覆盖以匹配色彩方案 */
.station-func-card.is-accounting {
    position: relative;
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--primary-color, #1890ff) 60%, #000 40%) 0%,
        var(--primary-color, #1890ff) 100%);
    box-shadow: 0 0 20px color-mix(in srgb, var(--primary-color, #1890ff) 40%, transparent 60%),
                0 4px 12px color-mix(in srgb, var(--primary-color, #1890ff) 25%, transparent 75%);
    overflow: hidden;
}
.station-func-card.is-accounting::before {
    content: '';
    position: absolute;
    top: 0; left: -120%;
    width: 60%; height: 100%;
    background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.35) 50%, transparent 100%);
    transform: skewX(-20deg);
    animation: acc-sweep 3.2s ease-in-out infinite;
}
@keyframes acc-sweep {
    0% { left: -120%; }
    55%, 100% { left: 140%; }
}
.station-func-card.is-accounting:hover {
    transform: translateY(-6px) scale(1.02);
    box-shadow: 0 0 32px color-mix(in srgb, var(--primary-color, #1890ff) 60%, transparent 40%),
                0 8px 20px color-mix(in srgb, var(--primary-color, #1890ff) 35%, transparent 65%);
}
.station-func-card.is-accounting:hover .sfc-icon {
    transform: scale(1.15);
    transition: transform 0.25s;
}
.station-func-card.is-accounting::after {
    content: '⚡';
    position: absolute;
    top: 8px; right: 10px;
    font-size: 13px;
    opacity: 0.85;
}

/* ==================== 站内记账模块 专属样式 ==================== */
/* 顶部3模块名称池网格 — 每个模块按内容自适应宽度（不再强制3等宽，避免空模块被压窄裁切按钮） */
.acc-pool-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    align-items: flex-start;
    margin-bottom: 8px;
}
@media (max-width: 900px) {
    .acc-pool-grid { flex-direction: column; }
}
.acc-pool-card {
    flex: 0 0 auto;
    width: 320px;            /* 固定基础宽度，禁止按内容自适应无限横向扩张（防止"卡片被名称元素自动撑宽"问题） */
    min-width: 250px;        /* 防止空模块过窄导致按钮被裁（修复模块2/3增减行不可见） */
    max-width: 680px;        /* 内容超出 6 行切两列时，卡片最大扩张到 680px 容纳两列，防止过度横向扩张 */
    background: var(--card-bg, #fff);
    border-radius: 10px;
    border: 1px solid var(--border-color, #e8e8e8);
    padding: 14px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
    position: relative;
    transition: box-shadow 0.2s, border-color 0.2s;
    box-sizing: border-box;
}
/* 当模块名称行数 > 6 行时，JS 加 .acc-pool-card-split → 卡片宽度扩张至双列容纳阈值（680px） */
.acc-pool-card.acc-pool-card-split {
    width: 680px;
}
.acc-pool-card::before {
    content: '';
    position: absolute;
    top: 0; left: 14px; right: 14px;
    height: 3px;
    background: linear-gradient(90deg, #722ed1, #1890ff);
    border-radius: 0 0 3px 3px;
}
.acc-pool-card:hover {
    box-shadow: 0 4px 12px rgba(114, 46, 209, 0.15);
    border-color: color-mix(in srgb, var(--primary-color, #1890ff) 40%, var(--border-color, #e8e8e8));
}
.acc-pool-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}
/* 标题：宽度由 JS 按文字内容自适应（_fitTitle），不再 flex:1 撑满 */
.acc-pool-title {
    font-weight: 700;
    color: var(--primary-color, #1890ff);
    min-width: 60px;
}
/* 站内记账页面：模块标题改为只读（统一由油站配置控制），readonly input 视觉去边框化
   与其他系统卡片标题（card-header span）保持一致的"纯文本"观感与权限语义 */
.acc-pool-title[readonly] {
    border-color: transparent;
    background: transparent;
    cursor: default;
    pointer-events: none;          /* 禁止聚焦/选中文本，与系统其他不可编辑标题交互一致 */
    padding-left: 0;
    padding-right: 6px;
    opacity: 1;                     /* 覆盖某些浏览器对 readonly input 的灰化处理 */
}
.acc-pool-title[readonly]:focus {
    outline: none;
    border-color: transparent;
    box-shadow: none;
}
.acc-pool-sum {
    font-size: 12px;
    color: var(--text-secondary, #666);
    background: color-mix(in srgb, var(--primary-color, #1890ff) 8%, transparent);
    padding: 3px 10px;
    border-radius: 4px;
    white-space: nowrap;
}
/* 名称行容器外层：默认单列布局；超过 6 行时 JS 加 .acc-pool-rows-split 切换为"横向流动"双列 */
/* 设计规范：3 个模块完全一致，名称行数 > 6 时，第 7 行起自动流向右侧列展示，不截断、不出现任何滚动条 */
/* 关键技术选择：使用 CSS Grid 的 grid-auto-flow:column + grid-template-rows:repeat(6,auto)
   而非 CSS Multi-column(column-count/column-fill:auto)。原因是后者必须有 max-height 才能触发
   "溢出到下一列"行为，但 max-height 又会导致 13 行以上时右列溢出容器底/出滚动条；
   Grid 方案跨浏览器一致、无需高度约束，第 7 行起精确流向右列，第 13 行起流向第三列，依此类推。 */
.acc-pool-rows {
    display: block;             /* 默认单列：行少时紧凑显示，行间距由 .acc-pool-row 的 margin-bottom 控制 */
    width: 100%;                /* 容器宽度跟随卡片，自身不主动扩张，由 .acc-pool-card-split 控制 */
    max-width: 100%;
    overflow: visible;          /* 强制不出现横向/纵向任何滚动条 */
}
/* 当模块名称行数 > 阈值(6 行)时，由 JS 同时给 card 与 rows 加 split 类 → 卡片扩张到 680px + rows 切换为 Grid 横向流动 */
/* grid-auto-flow:column = 先填满一列(6 行)再流向下一列；grid-template-rows:repeat(6,auto) = 每列最多 6 行 */
.acc-pool-rows.acc-pool-rows-split {
    display: grid;
    grid-auto-flow: column;                 /* 关键：横向流动，列优先填充 */
    grid-template-rows: repeat(6, auto);    /* 关键：每列固定 6 行，第 7 行起流向下一列 */
    grid-auto-columns: minmax(0, 1fr);      /* 每列等宽自适应，不超出卡片宽度 */
    column-gap: 14px;                       /* 左右两列间距，与卡片 gap 风格一致 */
    row-gap: 6px;                           /* 行间距，与单列模式 margin-bottom:6px 视觉一致 */
    align-items: start;
}
/* 切两列模式下，行内不要 margin-bottom，否则会与 grid row-gap 叠加造成间距不一致 */
.acc-pool-rows.acc-pool-rows-split > .acc-pool-row {
    margin-bottom: 0;
    width: 100%;                            /* 行内 grid 自身已用 minmax(0,1fr) 让名称输入框收缩，防止溢出 */
    min-width: 0;                           /* 关键：允许 grid item 收缩，避免名称过长撑破列宽 */
}
/* 单卡片宽度很小 / 移动端时，强制单列，避免列被压得太窄造成名称截断 */
@media (max-width: 720px) {
    .acc-pool-rows.acc-pool-rows-split { display: block; }
    .acc-pool-card,
    .acc-pool-card.acc-pool-card-split { width: 100%; max-width: 100%; }
}
/* 每行（名称 + 绿色余额数值 + [按钮/占位]）是一个独立 3 列 grid block，整行不可被 column 从中间切断，保证名称完整不截断 */
.acc-pool-row {
    display: grid;
    grid-template-columns: minmax(120px, 1fr) auto 32px;
    gap: 6px 8px;
    align-items: center;
    margin-bottom: 6px;
    min-width: 0;                           /* 关键：允许自身作为 grid item 收缩，避免名称过长撑破父列 */
}
/* 最后一行去掉底部 margin，避免与下方操作区间距被放大 */
.acc-pool-row:last-child { margin-bottom: 0; }
/* 名称输入框：允许文本收缩，超长时由浏览器自动横向滚动而不撑破容器；split 双列模式下尤为关键 */
.acc-pool-row .acc-pool-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* 删除被阻止时的视觉抖动反馈（current_balance 非 0 时点 − 按钮） */
@keyframes acc-pool-row-shake {
    0%, 100% { transform: translateX(0); }
    20%      { transform: translateX(-4px); }
    40%      { transform: translateX(4px); }
    60%      { transform: translateX(-3px); }
    80%      { transform: translateX(3px); }
}
.acc-pool-row-shake {
    animation: acc-pool-row-shake 0.4s ease-in-out;
}
.acc-pool-row-shake .acc-btn-minus {
    background: #ff4d4f !important;
    color: #fff !important;
}
/* 系统自带名称(is_default=1)只读样式：降低视觉权重，表明不可编辑 */
.acc-pool-name-readonly {
    background: color-mix(in srgb, var(--border-color, #d9d9d9) 18%, var(--input-bg, #fff));
    color: var(--text-secondary, #666);
    cursor: not-allowed;
    border-style: dashed;
}
.acc-pool-name-readonly:focus {
    border-color: var(--border-color, #d9d9d9);
    box-shadow: none;
}
/* 全局名称池模板中的初始余额输入框（与 .acc-pool-cur 数值展示位置一致，但为可编辑输入） */
.acc-pool-init {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    width: 100px;
}
/* 数值：绿色数值展示（只读，不再是文本框） */
.acc-pool-cur {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    color: var(--success-color, #52c41a);
    font-size: 13px;
    padding: 0 4px;
}
/* 通用记账输入框（与系统 .st-input 视觉一致，但命名独立避免冲突） */
.acc-input {
    width: 100%;
    background: var(--input-bg, #fff);
    border: 1px solid var(--border-color, #d9d9d9);
    border-radius: 4px;
    color: var(--text-color, #1a1a1a);
    font-size: 13px;
    padding: 6px 9px;
    outline: none;
    box-sizing: border-box;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.acc-input:focus {
    border-color: var(--primary-color, #1890ff);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary-color, #1890ff) 15%, transparent);
}
/* 操作按钮区（+ 添加名称 / 保存名称） */
.acc-pool-actions {
    display: flex;
    gap: 6px;
    margin-top: 10px;
}
.acc-btn-add {
    background: var(--primary-color, #1890ff);
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: 5px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: opacity 0.2s;
}
.acc-btn-add:hover { opacity: 0.88; }
.acc-btn-save {
    background: var(--success-color, #52c41a);
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: 5px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: opacity 0.2s;
}
.acc-btn-save:hover { opacity: 0.88; }
.acc-btn-minus {
    background: var(--danger-color, #ff4d4f);
    color: #fff;
    border: none;
    border-radius: 4px;
    width: 28px;
    height: 28px;
    font-size: 16px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.2s;
}
.acc-btn-minus:hover { opacity: 0.85; }

/* 名称选择浮窗（新增流水对话框：点击名称输入框向上弹出，每行4个名称） */
.acc-name-picker {
    position: absolute;
    z-index: 10000;
    background: var(--card-bg, #fff);
    border: 1px solid var(--border-color, #d9d9d9);
    border-radius: 8px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.18);
    width: 420px;
    max-height: 280px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    animation: acc-picker-in 0.16s ease-out;
}
@keyframes acc-picker-in {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}
.acc-name-picker-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    font-size: 12px;
    color: var(--text-secondary, #666);
    background: var(--table-header-bg, #fafafa);
    border-bottom: 1px solid var(--border-color, #f0f0f0);
    flex: 0 0 auto;
}
.acc-name-picker-close {
    cursor: pointer;
    font-size: 16px;
    line-height: 1;
    color: var(--text-secondary, #999);
    padding: 2px 6px;
    border-radius: 4px;
    transition: background 0.15s, color 0.15s;
}
.acc-name-picker-close:hover {
    background: var(--danger-color, #ff4d4f);
    color: #fff;
}
.acc-name-picker-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);   /* 每行 4 个名称 */
    gap: 1px;
    background: var(--border-color, #f0f0f0);
    padding: 1px;
    overflow-y: auto;
    flex: 1 1 auto;
}
.acc-name-picker-item {
    background: var(--card-bg, #fff);
    padding: 8px 10px;
    font-size: 13px;
    color: var(--text-color, #1a1a1a);
    cursor: pointer;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: background 0.15s, color 0.15s;
}
.acc-name-picker-item:hover {
    background: var(--primary-color, #1890ff);
    color: #fff;
}
/* 名称输入框容器（点击触发浮窗的视觉提示：右侧小箭头） */
.acc-name-cell {
    position: relative;
}
.acc-name-cell .acc-item-name {
    cursor: pointer;
    padding-right: 26px;
}
.acc-name-cell .acc-item-name:focus {
    cursor: text;
}
/* 对象输入框（借出项目下用上浮选择浮窗）—— 与 .acc-item-name 视觉一致，但始终 pointer（readonly 不可编辑） */
.acc-name-cell .acc-item-object {
    cursor: pointer;
    padding-right: 26px;
}
.acc-name-cell .acc-item-object:focus {
    cursor: pointer;
}
.acc-name-cell::after {
    content: '▾';
    position: absolute;
    right: 9px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-secondary, #999);
    font-size: 11px;
    pointer-events: none;
}
.acc-name-cell:focus-within::after {
    color: var(--primary-color, #1890ff);
}

/* ==================== 账目对比卡片 ==================== */
.acc-compare-card {
    background: var(--card-bg, #fff);
    border-radius: 10px;
    border: 1px solid var(--border-color, #e8e8e8);
    padding: 20px 24px 14px;
    margin-bottom: 0;
    margin-top: 14px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
    position: relative;
    transition: box-shadow 0.2s, border-color 0.2s;
}
.acc-compare-card::before {
    content: '';
    position: absolute;
    top: 0; left: 14px; right: 14px;
    height: 3px;
    background: linear-gradient(90deg, #1890ff, #722ed1);
    border-radius: 0 0 3px 3px;
}
.acc-compare-card:hover {
    box-shadow: 0 4px 12px rgba(24, 144, 255, 0.15);
    border-color: color-mix(in srgb, var(--primary-color, #1890ff) 40%, var(--border-color, #e8e8e8));
}
.acc-compare-body {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    flex-wrap: wrap;
}
.acc-compare-group {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}
.acc-compare-label {
    font-size: 13px;
    color: var(--text-secondary, #888);
    letter-spacing: 1px;
    font-weight: 500;
}
.acc-compare-value {
    font-size: 28px;
    font-weight: 800;
    color: var(--primary-color, #1890ff);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.5px;
    line-height: 1.2;
}
.acc-compare-sep {
    width: 1px;
    height: 48px;
    background: var(--border-color, #e8e8e8);
    flex-shrink: 0;
}
/* 保险柜分组扩展："标题+按钮"头 + 主金额 + 两账户明细 + 来源 */
.acc-compare-safe-group {
    min-width: 420px;
    gap: 6px;
}
.acc-compare-headline {
    display: flex;
    align-items: center;
    gap: 10px;
}
.acc-safe-refresh-btn {
    appearance: none;
    border: 1px solid color-mix(in srgb, var(--primary-color,#1890ff) 35%, transparent);
    background: color-mix(in srgb, var(--primary-color,#1890ff) 8%, transparent);
    color: var(--primary-color,#1890ff);
    font-size: 12px;
    border-radius: 6px;
    padding: 2px 10px;
    cursor: pointer;
    transition: all 0.15s;
    font-weight: 600;
}
.acc-safe-refresh-btn:hover:not(:disabled) { background: color-mix(in srgb, var(--primary-color,#1890ff) 18%, transparent); transform: translateY(-1px); }
.acc-safe-refresh-btn:active:not(:disabled) { transform: translateY(0); }
.acc-safe-refresh-btn:disabled { opacity: 0.55; cursor: not-allowed; }
.acc-safe-refresh-btn.acc-loading::after { content: '中'; margin-left:2px; opacity:0.8; }
.acc-cmp-safe-main {
    font-size: 30px;
    background: linear-gradient(90deg, #1890ff, #722ed1);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
/* 两账户余额拆分条（彩色小圆点 + 金额） */
.acc-safe-breakdown {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    color: var(--text-secondary, #666);
    margin-top: 2px;
    flex-wrap: wrap;
    justify-content: center;
}
.acc-safe-bd-item { display:inline-flex; align-items:center; gap:6px; }
.acc-safe-bd-item b { color: var(--text, #222); font-weight: 700; font-variant-numeric: tabular-nums; }
.acc-safe-bd-dot {
    width:8px; height:8px; border-radius:50%;
    display:inline-block;
    box-shadow: 0 0 0 2px rgba(255,255,255,0.6);
}
.acc-safe-bd-dot-cash { background: #1890ff; }
.acc-safe-bd-dot-bal  { background: #722ed1; }
.acc-safe-bd-plus {
    color: #888;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.acc-safe-source {
    font-size: 11px;
    color: var(--text-secondary, #888);
    margin-top: 4px;
    padding: 4px 10px;
    background: color-mix(in srgb, var(--primary-color,#1890ff) 6%, transparent);
    border: 1px dashed color-mix(in srgb, var(--primary-color,#1890ff) 25%, transparent);
    border-radius: 6px;
    max-width: 560px;
    line-height: 1.6;
    text-align: center;
    word-break: break-all;
}
.acc-compare-result {
    font-size: 28px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    padding: 2px 18px;
    border-radius: 8px;
    line-height: 1.2;
    transition: background 0.2s, color 0.2s;
    letter-spacing: 0.5px;
}
.acc-compare-hint {
    text-align: center;
    font-size: 11px;
    color: var(--text-secondary, #aaa);
    margin-top: 10px;
    letter-spacing: 0.3px;
}
.acc-diff-zero {
    color: var(--success-color, #52c41a);
    background: color-mix(in srgb, var(--success-color, #52c41a) 10%, transparent);
}
.acc-diff-pos {
    color: var(--warning-color, #faad14);
    background: color-mix(in srgb, var(--warning-color, #faad14) 10%, transparent);
}
.acc-diff-neg {
    color: var(--danger-color, #ff4d4f);
    background: color-mix(in srgb, var(--danger-color, #ff4d4f) 10%, transparent);
}

/* 记账筛选栏增强（项目下拉 + 实时搜索框） */
.acc-filter-bar {
    flex-wrap: nowrap;
}
.acc-filter-bar label {
    white-space: nowrap;
    flex-shrink: 0;
}
.acc-filter-bar .acc-search-input {
    flex: 1;
    min-width: 0;
    padding: 5px 10px;
    font-size: 13px;
}
.acc-filter-bar select {
    min-width: 100px;
}

/* 收支类型徽章（列表用，收入绿/支出红） */
.acc-type-tag {
    display: inline-block;
    padding: 1px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
}
.acc-type-income {
    background: color-mix(in srgb, var(--success-color, #52c41a) 15%, transparent);
    color: var(--success-color, #52c41a);
}
.acc-type-expense {
    background: color-mix(in srgb, var(--danger-color, #ff4d4f) 15%, transparent);
    color: var(--danger-color, #ff4d4f);
}
/* 审核状态徽章（仅存钱/购油时显示：待审核/已通过） */
.acc-sts-tag {
    display: inline-block;
    padding: 1px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.6;
}
.acc-sts-pending {
    background: color-mix(in srgb, var(--warning-color, #fa8c16) 15%, transparent);
    color: var(--warning-color, #fa8c16);
    border: 1px solid color-mix(in srgb, var(--warning-color, #fa8c16) 30%, transparent);
}
.acc-sts-approved {
    background: color-mix(in srgb, var(--success-color, #52c41a) 15%, transparent);
    color: var(--success-color, #52c41a);
    border: 1px solid color-mix(in srgb, var(--success-color, #52c41a) 30%, transparent);
}
.acc-sts-rejected {
    background: color-mix(in srgb, var(--danger-color, #ff4d4f) 12%, transparent);
    color: var(--danger-color, #ff4d4f);
    border: 1px solid color-mix(in srgb, var(--danger-color, #ff4d4f) 30%, transparent);
}
.acc-sts-na { opacity: 0; display:none; }

/* 新增流水对话框 */
.acc-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.acc-dlg-top {
    display: flex;
    align-items: flex-end;
    gap: 16px;
    flex-wrap: wrap;
}
.acc-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.acc-field-label {
    color: var(--text-secondary, #666);
    font-size: 12px;
    font-weight: 600;
}
.acc-dlg-hint {
    color: var(--text-secondary, #999);
    font-size: 12px;
}
.acc-table .acc-item-row td {
    padding: 4px;
}
.acc-preview {
    background: color-mix(in srgb, var(--primary-color, #1890ff) 6%, transparent);
    border: 1px solid color-mix(in srgb, var(--primary-color, #1890ff) 20%, transparent);
    border-radius: 6px;
    padding: 10px 14px;
    font-size: 14px;
    font-variant-numeric: tabular-nums;
}
.acc-preview .acc-inc { color: var(--success-color, #52c41a); font-weight: 700; }
.acc-preview .acc-exp { color: var(--danger-color, #ff4d4f); font-weight: 700; }
.acc-preview .acc-net { color: var(--primary-color, #1890ff); font-weight: 700; }

.station-func-card .sfc-label {
    font-size: 15px;
    font-weight: 600;
}

/* ==================== 空状态 ==================== */
.empty-state {
    text-align: center;
    padding: 40px 20px;
    color: var(--text-secondary);
    font-size: 14px;
}

.empty-state .empty-icon {
    font-size: 48px;
    margin-bottom: 12px;
    opacity: 0.4;
}

/* ==================== 加载中 ==================== */
.loading {
    text-align: center;
    padding: 30px;
    color: var(--text-secondary);
}

.loading::after {
    content: '';
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 2px solid var(--border-color);
    border-top-color: var(--primary-color);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    margin-right: 8px;
    vertical-align: middle;
}

@keyframes spin { to { transform: rotate(360deg); } }
@keyframes slideIn { from { transform: translateY(-10px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

/* ==================== 杂项 ==================== */
.text-right { text-align: right; }
.text-center { text-align: center; }
.text-bold { font-weight: 600; }
.mb-10 { margin-bottom: 10px; }
.mb-20 { margin-bottom: 20px; }
.mt-10 { margin-top: 10px; }

/* ==================== 配置页 Tab ==================== */
.config-tabs {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--border-color);
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.config-tabs .tab-btn {
    padding: 10px 20px;
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    cursor: pointer;
    font-size: 14px;
    color: var(--text-secondary);
    transition: all 0.2s;
    margin-bottom: -2px;
}

.config-tabs .tab-btn:hover {
    color: var(--primary-color);
    background: var(--hover-bg);
}

.config-tabs .tab-btn.active {
    color: var(--primary-color);
    border-bottom-color: var(--primary-color);
    font-weight: 600;
}

/* ==================== 安全设置 ==================== */
.security-settings {
    max-width: 600px;
}

.security-item {
    padding: 16px 0;
}

.security-item-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

.security-icon {
    font-size: 20px;
}

.security-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-color);
}

.security-item-desc {
    font-size: 13px;
    color: var(--text-secondary);
    margin-bottom: 12px;
    padding-left: 28px;
}

.security-item-input {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-left: 28px;
}

.security-item-input input[type="number"] {
    width: 120px;
    padding: 8px 12px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    color: var(--primary-color);
    border-color: var(--primary-color);
}

.security-item-input input[type="number"]:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(24,144,255,0.2);
}

.security-unit {
    font-size: 14px;
    color: var(--text-secondary);
}

.security-divider {
    height: 1px;
    background: var(--border-color);
    margin: 8px 0;
}

.security-notice {
    background: #fffbe6;
    border: 1px solid #ffe58f;
    border-radius: var(--border-radius);
    padding: 12px 16px;
    margin: 20px 0;
    display: flex;
    gap: 10px;
}

.security-notice-icon {
    font-size: 18px;
    flex-shrink: 0;
}

.security-notice-text {
    font-size: 13px;
    color: #614700;
    line-height: 1.6;
}

.security-actions {
    display: flex;
    gap: 12px;
    padding-top: 16px;
    border-top: 1px solid var(--border-color);
}

.btn-lg {
    padding: 10px 24px;
    font-size: 15px;
}

.btn-sm {
    padding: 4px 10px;
    font-size: 12px;
}

.mt-20 { margin-top: 20px; }
.flex { display: flex; }
.flex-between { display: flex; justify-content: space-between; align-items: center; }
.gap-8 { gap: 8px; }
.gap-12 { gap: 12px; }
.flex-wrap { flex-wrap: wrap; }

.error-msg { min-height: 18px; }

.permission-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 8px;
    padding: 10px;
}

.permission-grid label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    padding: 4px 8px;
    background: var(--hover-bg);
    border-radius: var(--border-radius);
}

textarea {
    width: 100%;
    padding: 8px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    font-family: inherit;
    font-size: 13px;
    resize: vertical;
}

/* 滚动条美化 */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.2); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,0.35); }

/* ==================== 容积表按钮（油罐行内） ==================== */
.st-btn-vol {
    background: var(--primary-color);
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: 4px 10px;
    font-size: 12px;
    cursor: pointer;
    flex-shrink: 0;
    transition: opacity 0.2s;
    white-space: nowrap;
}
.st-btn-vol:hover { opacity: 0.85; }

/* ==================== 容积表向导 ==================== */
.vw-step { display: flex; flex-direction: column; gap: 0; }
.vw-steps {
    display: flex; gap: 4px; padding: 12px 16px;
    border-bottom: 1px solid var(--border-color);
    background: var(--hover-bg);
}
.vw-steps .vw-step {
    flex: 1; text-align: center; font-size: 13px;
    padding: 6px 8px; border-radius: 4px;
    color: var(--text-secondary);
    background: transparent;
}
.vw-steps .vw-step.active {
    color: #fff; background: var(--primary-color); font-weight: 600;
}
.vw-steps .vw-step.done {
    color: var(--primary-color);
    text-decoration: line-through;
    opacity: 0.6;
}
.vw-body { padding: 20px 16px; }
.vw-footer {
    display: flex; gap: 8px; justify-content: flex-end;
    padding: 12px 16px; border-top: 1px solid var(--border-color);
}
.vw-field { margin-bottom: 12px; }
.vw-field label {
    display: block; font-size: 13px; font-weight: 600;
    color: var(--text-color); margin-bottom: 6px;
}
.vw-tank-list { display: flex; flex-direction: column; gap: 6px; }
.vw-tank-item {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 12px; border: 1px solid var(--border-color);
    border-radius: 4px; cursor: pointer; transition: background 0.15s;
}
.vw-tank-item:hover { background: var(--hover-bg); }
.vw-tank-item.vw-disabled { opacity: 0.5; cursor: not-allowed; }
.vw-tank-item input[type=checkbox] {
    accent-color: var(--primary-color); width: 16px; height: 16px;
}

/* 规格总览 */
.vw-overview { padding: 0; }
.vw-overview-title {
    font-size: 14px; font-weight: 700;
    color: var(--text-color);
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-color);
}
.vw-spec-list { display: flex; flex-direction: column; gap: 8px; }
.vw-spec-card {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 14px;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    background: var(--hover-bg);
    transition: border-color 0.2s;
}
.vw-spec-card:hover { border-color: var(--primary-color); }
.vw-spec-info { flex: 1; min-width: 0; }
.vw-spec-name {
    font-size: 14px; font-weight: 700;
    color: var(--text-color);
    margin-bottom: 4px;
}
.vw-spec-meta {
    font-size: 12px; color: var(--text-secondary);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.vw-spec-actions {
    display: flex; gap: 4px; flex-shrink: 0; margin-left: 12px;
}
.vw-empty {
    text-align: center; color: var(--text-secondary);
    padding: 30px 20px; font-size: 13px;
}

/* ==================== 液位模拟面板 ==================== */
#sf-liquid-level-panel { margin-bottom: 16px; }

.ll-panel {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 16px;
}
.ll-panel-title {
    font-size: 15px; font-weight: 700;
    color: var(--text-color);
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border-color);
}
.ll-panel-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
}
.ll-empty {
    text-align: center; color: var(--text-secondary);
    padding: 20px; font-size: 13px;
}

/* 油罐卡片 */
.ll-tank-card {
    display: flex; flex-direction: column; align-items: center;
    padding: 12px 8px;
    border: 1px solid var(--border-color);
    border-radius: 8px; cursor: pointer;
    transition: all 0.2s;
    background: var(--hover-bg);
    min-width: 0;
}
.ll-tank-card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 2px 8px color-mix(in srgb, var(--primary-color) 20%, transparent);
    transform: translateY(-2px);
}
.ll-tank-label {
    font-size: 14px; font-weight: 700;
    color: var(--text-color); margin-bottom: 2px;
}
.ll-tank-oil {
    font-size: 14px; font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 10px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    max-width: 100%;
    padding: 3px 10px;
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    border-radius: 4px;
    line-height: 1.4;
}

/* 立式圆角矩形容器可视化（垂直填充，自下而上） */
.ll-cylinder {
    display: flex; flex-direction: column; align-items: center;
    position: relative;
}
.ll-cylinder-cap {
    width: 58px; height: 8px;
    border-radius: 6px 6px 0 0;
    background: linear-gradient(180deg,
        color-mix(in srgb, var(--border-color) 60%, #fff) 0%,
        var(--border-color) 100%
    );
    border: 1px solid color-mix(in srgb, var(--border-color) 80%, #000);
    border-bottom: none;
    position: relative; z-index: 1;
}
.ll-cylinder-body {
    width: 56px; height: 80px;
    border: 2px solid var(--border-color);
    border-radius: 4px 4px 2px 2px;
    position: relative;
    overflow: hidden;
    background: color-mix(in srgb, var(--card-bg) 70%, transparent);
    box-shadow:
        inset 0 2px 6px rgba(0,0,0,0.08),
        inset -2px 0 4px rgba(0,0,0,0.03),
        inset 2px 0 4px rgba(0,0,0,0.03),
        0 1px 3px rgba(0,0,0,0.05);
}
/* 两侧微弱高光条纹增强立体感 */
.ll-cylinder-body::before,
.ll-cylinder-body::after {
    content: '';
    position: absolute; top: 0; bottom: 0; width: 4px;
    pointer-events: none; z-index: 1;
}
.ll-cylinder-body::before {
    left: 3px;
    background: linear-gradient(180deg,
        rgba(255,255,255,0.25) 0%, rgba(255,255,255,0.08) 50%, transparent 100%);
    border-radius: 2px;
}
.ll-cylinder-body::after {
    right: 3px;
    background: linear-gradient(180deg,
        rgba(0,0,0,0.04) 0%, rgba(0,0,0,0.02) 50%, transparent 100%);
    border-radius: 2px;
}
.ll-cylinder-fill {
    position: absolute; bottom: 0; left: 0; right: 0;
    transition: height 0.5s ease, background 0.3s;
    border-radius: 2px 2px 0 0;
    opacity: 0.88;
    background-image: linear-gradient(180deg,
        rgba(255,255,255,0.35) 0%,
        rgba(255,255,255,0.15) 25%,
        transparent 50%,
        rgba(0,0,0,0.08) 100%
    );
}
.ll-cylinder-base {
    width: 62px; height: 8px;
    border-radius: 0 0 4px 4px;
    background: linear-gradient(180deg,
        var(--border-color) 0%,
        color-mix(in srgb, var(--border-color) 60%, #000) 100%
    );
    border: 1px solid color-mix(in srgb, var(--border-color) 80%, #000);
    border-top: none;
}

/* 大尺寸立式罐（编辑弹窗） */
.ll-cylinder-lg .ll-cylinder-cap { width: 82px; height: 10px; border-radius: 8px 8px 0 0; }
.ll-cylinder-lg .ll-cylinder-body { width: 80px; height: 130px; border-radius: 4px 4px 2px 2px; }
.ll-cylinder-lg .ll-cylinder-base { width: 86px; height: 10px; border-radius: 0 0 6px 6px; }

/* 油罐信息 */
.ll-tank-info {
    display: flex; flex-direction: column; align-items: center;
    gap: 1px; margin-top: 8px;
}
.ll-tank-h {
    font-size: 13px; font-weight: 700; color: var(--text-color);
}
.ll-tank-l {
    font-size: 12px; font-weight: 600; color: var(--text-secondary);
}
.ll-tank-spec {
    font-size: 11px; color: var(--text-secondary);
    margin-top: 2px; opacity: 0.7;
}

/* 编辑弹窗 */
.ll-edit-panel { padding: 0 8px; }
.ll-color-picker {
    display: flex; gap: 8px;
}
.ll-color-btn {
    width: 32px; height: 32px;
    border-radius: 50%; border: 3px solid transparent;
    cursor: pointer; transition: all 0.2s;
}
.ll-color-btn:hover { transform: scale(1.1); }
.ll-color-btn.active {
    border-color: var(--text-color);
    box-shadow: 0 0 0 2px var(--card-bg), 0 0 0 4px var(--text-color);
}

/* 吨数显示（编辑弹窗） */
.ll-edit-tons {
    font-size: 16px; font-weight: bold;
    color: var(--primary-color);
    margin-top: 6px;
}

/* 吨数显示（油罐卡片） */
.ll-tank-t {
    font-size: 11px; font-weight: 600;
    color: var(--primary-color);
}

/* ===== 4 模块统计卡片 ===== */
.ll-stats-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 16px;
}
.ll-stat-card {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 16px;
    transition: all 0.2s;
}
.ll-stat-card:hover {
    border-color: var(--primary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px color-mix(in srgb, var(--primary-color) 15%, transparent);
}
.ll-stat-card-title {
    font-size: 16px; font-weight: 700;
    color: var(--text-color);
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-color);
}
.ll-stat-card-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.ll-stats-line {
    display: flex;
    align-items: center;
    font-size: 13px;
    line-height: 1.6;
    padding: 2px 0;
}
.ll-stats-label {
    flex: 1;
    min-width: 0;
    color: var(--text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ll-stats-num {
    width: 72px;
    flex-shrink: 0;
    text-align: right;
    font-weight: 600;
    color: var(--text-color);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}
.ll-stats-head {
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 4px;
    margin-bottom: 2px;
}
.ll-stats-head .ll-stats-label,
.ll-stats-head .ll-stats-num {
    color: var(--text-secondary);
    font-weight: 600;
    font-size: 12px;
}
.ll-stats-empty {
    color: var(--text-secondary);
    font-size: 13px;
    text-align: center;
    padding: 12px 0;
}

/* ===== 销售对比卡片 ===== */
.ll-stat-card-cmp { border-color: var(--primary-color); }
.ll-stat-card-cmp .ll-stat-card-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
/* 基准日标签：提示对比所基于的日期 */
.ll-cmp-basedate {
    font-size: 11px;
    font-weight: 500;
    color: var(--text-secondary);
    margin-left: 8px;
    padding: 1px 6px;
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    border-radius: 3px;
    white-space: nowrap;
}
/* 卸油按钮：与界面视觉语言一致 */
.ll-unload-btn {
    font-size: 12px;
    font-weight: 600;
    padding: 4px 12px;
    border: 1px solid var(--primary-color);
    border-radius: 4px;
    background: var(--primary-color);
    color: #fff;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
}
.ll-unload-btn:hover {
    opacity: 0.85;
    transform: translateY(-1px);
}
/* ===== 液位模拟标题 + 保存快照按钮 ===== */
/* 标题栏使用 flex 布局：标题文字在左，操作按钮在右 */
.ll-panel-title-with-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}
.ll-panel-title-text {
    flex: 1;
    min-width: 0;
}
/* 对比行预警样式 */
.ll-cmp-warning {
    color: #faad14;
    font-weight: 700;
}
.ll-cmp-warning .ll-stats-num {
    color: #faad14;
}
/* 合计行 */
.ll-cmp-total {
    border-top: 1px solid var(--border-color);
    margin-top: 4px;
    padding-top: 4px;
    font-weight: 700;
}
.ll-cmp-total .ll-stats-label {
    color: var(--text-color);
}
/* 销售对比卡片：4 列（油品/实际销售/油位付出/差值）平均分布 */
.ll-stat-card-cmp .ll-stats-label,
.ll-stat-card-cmp .ll-stats-num {
    flex: 1 1 0;
    width: auto;
    text-align: center;
}
/* 差值列颜色：负数红、正数≤200绿、>200橙（双 class 提特异性，覆盖合计行默认色） */
.ll-stats-num.ll-cmp-diff-neg  { color: #ff4d4f; }
.ll-stats-num.ll-cmp-diff-ok   { color: #52c41a; }
.ll-stats-num.ll-cmp-diff-over { color: #faad14; }
/* 报销金额合计卡片（筛选栏右侧） */
.reim-total-card {
    display: inline-flex;
    align-items: center;
    padding: 6px 14px;
    margin-left: auto;
    background: var(--primary-color, #1890ff);
    color: #fff;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 2px 4px rgba(24,144,255,0.2);
}
.reim-total-card #sf-reim-total,
.reim-total-card #fa-reim-total {
    font-variant-numeric: tabular-nums;
    margin-left: 4px;
}
/* 卸油记录汇总（卡片底部） */
.ll-cmp-unload-summary {
    font-size: 11px;
    color: var(--text-secondary);
    padding: 6px 0 0;
    border-top: 1px dashed var(--border-color);
    margin-top: 6px;
}

/* ===== 卸油记录弹窗 ===== */
.ll-unload-panel { padding: 0 4px; }
.ll-unload-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 16px;
}
.ll-unload-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.ll-unload-field label {
    font-size: 12px;
    color: var(--text-secondary);
    font-weight: 600;
}
.ll-unload-field .form-control {
    padding: 8px 10px;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    font-size: 14px;
    background: var(--input-bg, var(--card-bg));
    color: var(--text-color);
}
.ll-unload-field .form-control:focus {
    border-color: var(--primary-color);
    outline: none;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary-color) 15%, transparent);
}
.ll-unload-section-title {
    font-size: 13px;
    font-weight: 700;
    color: var(--text-color);
    padding: 8px 0 6px;
    border-top: 1px solid var(--border-color);
    margin-bottom: 4px;
}
.ll-unload-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.ll-unload-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    border-radius: 4px;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    font-size: 13px;
}
.ll-unload-row-name {
    flex: 1;
    min-width: 0;
    color: var(--text-color);
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ll-unload-row-liters {
    font-weight: 700;
    color: var(--primary-color);
    white-space: nowrap;
}
.ll-unload-row-remark {
    font-size: 12px;
    color: var(--text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 120px;
}
.ll-unload-del-btn {
    font-size: 11px;
    padding: 2px 8px;
    border: 1px solid #ff4d4f;
    border-radius: 3px;
    background: transparent;
    color: #ff4d4f;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s;
}
.ll-unload-del-btn:hover {
    background: #ff4d4f;
    color: #fff;
}

/* 卸油记录查询弹窗：日期筛选器 */
.ll-unload-filter {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    margin-bottom: 12px;
}
.ll-unload-filter-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}
.ll-unload-filter-field label {
    font-size: 12px;
    color: var(--text-secondary);
    font-weight: 600;
}
.ll-unload-filter-field .form-control {
    padding: 7px 10px;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    font-size: 14px;
    background: var(--input-bg, var(--card-bg));
    color: var(--text-color);
}
.ll-unload-filter-field .form-control:focus {
    border-color: var(--primary-color);
    outline: none;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary-color) 15%, transparent);
}
.ll-unload-query-btn {
    flex-shrink: 0;
    white-space: nowrap;
}

/* 卸油记录行：日期 + 时间 + 锁定标记 */
.ll-unload-row-date {
    font-size: 12px;
    color: var(--text-secondary);
    white-space: nowrap;
    min-width: 70px;
}
.ll-unload-row-time {
    font-size: 11px;
    color: var(--text-secondary);
    white-space: nowrap;
    margin-left: auto;
}
.ll-unload-locked {
    font-size: 11px;
    color: var(--text-secondary);
    white-space: nowrap;
    padding: 2px 8px;
    border: 1px solid var(--border-color);
    border-radius: 3px;
    background: var(--hover-bg, #f5f5f5);
}

/* 步骤3 卸油吨数+升数双控件 */
.ll-unload-tons-field .ll-unload-liters-readonly {
    font-size: 13px;
    color: var(--text-secondary);
    padding: 4px 0 2px;
}
.ll-unload-tons-field #wz-unload-liters-display {
    font-weight: 700;
    color: var(--primary-color);
}
.ll-unload-tons-field .ll-unload-density-hint {
    font-size: 11px;
    color: var(--text-secondary);
    margin-left: 6px;
}

/* 液位同步状态徽章 */
.ll-sync-badge {
    font-size: 11px;
    font-weight: 600;
    margin-left: 8px;
    padding: 2px 8px;
    border-radius: 10px;
    white-space: nowrap;
    vertical-align: middle;
}
.ll-sync-ok {
    color: var(--success-color, #52c41a);
    background: color-mix(in srgb, var(--success-color, #52c41a) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--success-color, #52c41a) 40%, transparent);
}

/* ===== 昨日销售对话框 ===== */
.ll-ys-dialog { padding: 0 8px; }
.ll-ys-date {
    display: flex; align-items: center; gap: 8px;
    margin-bottom: 16px;
    font-size: 14px; color: var(--text-color);
}
.ll-ys-list {
    display: flex; flex-direction: column; gap: 10px;
    max-height: 360px; overflow-y: auto;
}
.ll-ys-row {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 12px;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    background: var(--hover-bg);
}
.ll-ys-name {
    font-size: 14px; font-weight: 600;
    color: var(--text-color);
    min-width: 120px;
}
.ll-ys-inputs {
    display: flex; align-items: center; gap: 8px;
}
.ll-ys-inputs .st-input { width: 120px; }
.ll-ys-tons {
    font-size: 13px; font-weight: 600;
    color: var(--primary-color);
    min-width: 64px;
    text-align: right;
}
.ll-ys-footer {
    margin-top: 16px; padding-top: 12px;
    border-top: 1px solid var(--border-color);
    display: flex; align-items: center; gap: 8px;
    font-size: var(--global-font-size, 14px); color: var(--text-color);
}
.ll-ys-footer strong {
    font-size: calc(var(--global-font-size, 14px) + 4px); color: var(--primary-color);
}

/* ===== 每日数据汇总列表 ===== */
.ll-summary-panel {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 16px;
    margin-top: 16px;
}
.ll-summary-title {
    font-size: calc(var(--global-font-size, 14px) + 1px); font-weight: 700;
    color: var(--text-color);
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border-color);
}
.ll-summary-table-wrap { overflow-x: auto; }
.ll-summary-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--global-font-size, 14px);
}
.ll-summary-table th {
    background: var(--hover-bg);
    color: var(--text-color);
    font-weight: 600;
    padding: 8px 12px;
    text-align: center;
    border: 1px solid var(--border-color);
    white-space: nowrap;
}
.ll-summary-table td {
    padding: 8px 12px;
    border: 1px solid var(--border-color);
    color: var(--text-color);
    line-height: 1.6;
    text-align: center;
}
.ll-summary-table td.num {
    text-align: center;
    font-variant-numeric: tabular-nums;
}
.ll-summary-table td.ll-summary-date {
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    color: var(--text-secondary);
}
/* 日期文本 */
.ll-summary-date-text {
    display: inline-block;
}
/* 操作列：每个日期对应1个按钮（rowspan 合并单元格，垂直居中） */
.ll-summary-action {
    text-align: center;
    vertical-align: middle;
}
/* 编辑按钮：蓝色主操作风格（与系统 btn-primary 视觉一致） */
.ll-summary-edit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 52px;
    height: 26px;
    padding: 0 10px;
    border: 1px solid var(--primary-color, #1890ff);
    border-radius: 3px;
    background: var(--primary-color, #1890ff);
    color: #fff;
    font-size: 12px;
    line-height: 1;
    cursor: pointer;
    transition: all 0.2s;
}
.ll-summary-edit-btn:hover {
    opacity: 0.85;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(24, 144, 255, 0.35);
}
/* 退回编辑按钮：橙色提示风格（油品部使用） */
.ll-summary-return-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 72px;
    height: 26px;
    padding: 0 10px;
    border: 1px solid #faad14;
    border-radius: 3px;
    background: transparent;
    color: #faad14;
    font-size: 12px;
    line-height: 1;
    cursor: pointer;
    transition: all 0.2s;
}
.ll-summary-return-btn:hover {
    background: #faad14;
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(250, 173, 20, 0.35);
}
/* 已退回编辑状态标签（油品部，橙色文字） */
.ll-summary-returned-tag {
    display: inline-block;
    padding: 2px 8px;
    color: #faad14;
    font-size: 12px;
    line-height: 1.4;
}

.ll-summary-table td.ll-summary-station {
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    font-weight: 600;
}
.ll-summary-table td.ll-summary-op {
    text-align: center;
    vertical-align: middle;
}
/* 操作列按钮组：退回编辑 + 删除 横向排列，窄屏自动换行 */
.ll-summary-op-group {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
    justify-content: center;
}
/* 删除按钮：红色描边（与站内删除按钮视觉一致） */
.ll-summary-del-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 52px;
    height: 26px;
    padding: 0 10px;
    border: 1px solid #ff4d4f;
    border-radius: 3px;
    background: transparent;
    color: #ff4d4f;
    font-size: 12px;
    line-height: 1;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
}
.ll-summary-del-btn:hover {
    background: #ff4d4f;
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(255, 77, 79, 0.35);
}
.ll-summary-table tr:hover td {
    background: color-mix(in srgb, var(--primary-color) 4%, transparent);
}
.ll-summary-empty {
    text-align: center;
    color: var(--text-secondary);
    padding: 24px !important;
}
.ll-del-btn {
    padding: 2px 12px;
    font-size: 12px;
    color: var(--danger-color);
    background: transparent;
    border: 1px solid var(--danger-color);
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
}
.ll-del-btn:hover {
    background: var(--danger-color);
    color: #fff;
}
.ll-del-none {
    color: var(--text-secondary);
}
.ll-summary-pagination {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid var(--border-color);
    font-size: 12px;
}
.ll-summary-info { color: var(--text-secondary); }
.ll-summary-pagesize {
    padding: 4px 8px;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    background: var(--card-bg);
    color: var(--text-color);
    font-size: 12px;
}
/* 资金管理列表（与油品部每日数据汇总列表共用 ll-summary-* 视觉语言）的扩展样式 */
/* 合计行：加粗 + 表头背景，与 ll-summary 表头视觉一致区分正文行 */
.ll-summary-table tr.ll-summary-total-row > td {
    font-weight: 700;
    background: var(--table-header-bg, #fafafa);
    border-top: 2px solid var(--border-color);
}
/* 操作菜单单元格在 ll-summary-table 上下文下居中（保持与油品部/对账部操作列视觉一致） */
.ll-summary-table td.ac-action-cell,
.ll-summary-table th.ac-action-cell {
    text-align: center;
    vertical-align: middle;
}

/* ===== 进销存（独立功能） ===== */
.ps-summary-strip {
    display: flex;
    gap: 24px;
    align-items: center;
    margin-bottom: 10px;
    font-size: 13px;
    font-weight: 600;
}
.ps-last-date { color: var(--danger-color); }
/* 筛选栏右侧：进销存配置/新增按钮组 */
.ps-filter-actions {
    margin-left: auto;
    display: inline-flex;
    gap: 8px;
    align-items: center;
}
/* 明细表油品分组标题：红色加大1号，展示罐容(立) */
.ll-summary-table th.ps-th-oil {
    color: var(--danger-color);
    font-size: 15px;
    font-weight: 700;
}
.ps-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 14px;
}
.ps-card {
    flex: 1 1 280px;
    min-width: 260px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background: var(--card-bg);
    padding: 10px 12px;
}
/* 两个统计汇总卡片（库存/可卸）并排各占一半 —— 科技感设计 */
.ps-stat-card {
    flex: 1 1 40%;
    position: relative;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--primary-color) 45%, var(--border-color));
    background: linear-gradient(160deg,
        color-mix(in srgb, var(--primary-color) 10%, var(--card-bg)) 0%,
        var(--card-bg) 60%);
    box-shadow: 0 0 10px color-mix(in srgb, var(--primary-color) 12%, transparent);
    transition: box-shadow 0.25s, transform 0.25s;
}
.ps-stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 18px color-mix(in srgb, var(--primary-color) 25%, transparent);
}
/* 四角霓虹装饰 */
.ps-stat-card::before,
.ps-stat-card::after {
    content: '';
    position: absolute;
    width: 14px;
    height: 14px;
    border: 2px solid var(--primary-color);
    opacity: 0.75;
    pointer-events: none;
}
.ps-stat-card::before { top: 4px; left: 4px; border-right: 0; border-bottom: 0; }
.ps-stat-card::after { bottom: 4px; right: 4px; border-left: 0; border-top: 0; }
/* 标题：字距拉开 + 主色辉光 + 渐变光条 */
.ps-stat-card .ps-card-title {
    color: var(--primary-color);
    letter-spacing: 8px;
    text-indent: 8px;
    border-bottom: 0;
    text-shadow: 0 0 8px color-mix(in srgb, var(--primary-color) 50%, transparent);
}
.ps-stat-card .ps-card-title::after {
    content: '';
    display: block;
    height: 2px;
    margin-top: 6px;
    background: linear-gradient(90deg, transparent, var(--primary-color), transparent);
}
/* 列分隔线 + 数值霓虹 */
.ps-stat-card .ps-card-grid { gap: 0; }
.ps-stat-col { padding: 8px 4px 6px; }
.ps-stat-col + .ps-stat-col {
    border-left: 1px solid color-mix(in srgb, var(--primary-color) 20%, transparent);
}
.ps-stat-card .ps-card-val {
    font-size: 16px;
    font-weight: 700;
    color: var(--primary-color);
    text-shadow: 0 0 8px color-mix(in srgb, var(--primary-color) 40%, transparent);
}
.ps-stat-card .ps-card-val.ps-neg {
    color: var(--danger-color);
    text-shadow: 0 0 8px color-mix(in srgb, var(--danger-color) 40%, transparent);
}
.ps-card-title {
    text-align: center;
    color: var(--danger-color);
    font-weight: 700;
    font-size: 14px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 6px;
}
.ps-card-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 4px;
    text-align: center;
    font-size: 12px;
}
.ps-card-head { color: var(--text-secondary); }
.ps-card-val {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}
.ps-neg { color: var(--danger-color); }
.ps-detail {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}
.ps-detail-list { flex: 1 1 auto; min-width: 0; }
.ps-cfg-row {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr 1.2fr 56px;
    gap: 8px;
    align-items: center;
    margin-bottom: 8px;
}
.ps-cfg-row.ps-cfg-head span {
    font-size: 12px;
    color: var(--text-secondary);
}
/* 系统默认模板模块行：名称锁定不可删除，浅色底区分 */
.ps-cfg-row.ps-cfg-sys {
    background: color-mix(in srgb, var(--primary-color) 5%, transparent);
    border-radius: var(--border-radius);
}
.ps-cfg-row.ps-cfg-sys .ll-del-btn {
    color: var(--primary-color);
    border-color: color-mix(in srgb, var(--primary-color) 50%, transparent);
    cursor: not-allowed;
}

/* ==================== 销存部（跨站进销存一览） ==================== */
.xcb-table-wrap .ll-summary-table { width: 100%; }
.xcb-table-wrap .ll-summary-table th,
.xcb-table-wrap .ll-summary-table td { white-space: nowrap; padding: 5px 6px; }
/* 分组表头：库存 / 可卸（无边框线，淡底色区分） */
.xcb-table-wrap .ll-summary-table th.xcb-grp-th {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
    text-align: center;
    background: color-mix(in srgb, var(--primary-color) 8%, transparent);
}
.xcb-table-wrap .ll-summary-table th.xcb-sub-th {
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    color: var(--text-secondary);
}
/* 库存与可卸之间的留白间距列 */
.xcb-gap,
.xcb-gap-th {
    width: 18px;
    min-width: 18px;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
}
/* 油站列表拖拽排序（沿用 xcb 拖拽视觉规范） */
tr.stl-row .xcb-drag { cursor: grab; }
tr.stl-row:hover .xcb-drag { color: var(--primary-color); }
tr.stl-dragging { opacity: 0.45; }
.xcb-drag-th { width: 26px; }
.xcb-drag {
    color: var(--text-secondary);
    text-align: center;
    cursor: grab;
    user-select: none;
    letter-spacing: -2px;
}
tr.xcb-row:hover .xcb-drag { color: var(--primary-color); }
tr.xcb-dragging { opacity: 0.45; }
/* 状态徽章：已更新(绿) / 未更新(红) */
.xcb-status {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 10px;
    font-size: 12px;
    border: 1px solid;
    white-space: nowrap;
}
.xcb-status-ok {
    color: var(--success-color);
    border-color: color-mix(in srgb, var(--success-color) 60%, transparent);
    background: color-mix(in srgb, var(--success-color) 10%, transparent);
}
.xcb-status-no {
    color: var(--danger-color);
    border-color: color-mix(in srgb, var(--danger-color) 60%, transparent);
    background: color-mix(in srgb, var(--danger-color) 10%, transparent);
}
/* 低库存预警：单油品库存 > 0 且 < 10 吨 → 该库存单元格淡红弥散光晕 + 0.8s 周期透明度闪烁（刚好为 0 不预警） */
.xcb-stock {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 6px;
    font-variant-numeric: tabular-nums;
}
.xcb-low {
    color: var(--danger-color);
    border: 1px solid color-mix(in srgb, var(--danger-color) 55%, transparent);
    box-shadow: 0 0 10px color-mix(in srgb, var(--danger-color) 55%, transparent),
                0 0 22px color-mix(in srgb, var(--danger-color) 30%, transparent),
                inset 0 0 8px color-mix(in srgb, var(--danger-color) 25%, transparent);
    text-shadow: 0 0 6px color-mix(in srgb, var(--danger-color) 70%, transparent);
    animation: xcb-low-pulse 0.8s ease-in-out infinite;
}
@keyframes xcb-low-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.55; }
}
.ps-edit-head {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr;
    gap: 8px;
    margin-bottom: 6px;
    font-size: 12px;
    color: var(--text-secondary);
    text-align: center;
}
.ps-edit-row {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr;
    gap: 8px;
    align-items: center;
    margin-bottom: 8px;
}
.ps-edit-name { font-weight: 600; font-size: 13px; text-align: center; }
.ps-edit-row .st-input { text-align: center; }
.ps-edit-date, .ps-cfg-dialog, .ps-edit-dialog { margin-bottom: 4px; }
/* 进销存弹窗输入框：统一系统视觉（主题边框/圆角/背景），宽度撑满网格列防止溢出变形 */
.ps-cfg-row .st-input,
.ps-edit-row .st-input,
.ps-edit-date .st-input {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    padding: 6px 10px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background: var(--input-bg);
    color: var(--text-color);
    font-size: 13px;
}
.ps-cfg-row > *, .ps-edit-row > * { min-width: 0; }
/* 明细表压缩适配：撑满页宽不出横向滚动条，二级表头小1号 */
.ps-detail-list .ll-summary-table {
    width: 100%;
}
.ps-detail-list .ll-summary-table th,
.ps-detail-list .ll-summary-table td {
    white-space: nowrap;
    padding: 5px 3px;
}
.ps-detail-list .ll-summary-table th.ps-sub-th {
    font-size: 12px;
    font-weight: 600;
}
/* 油品分组区分：奇偶组交替底色 + 每组首列分隔线，一眼区分不同油品模块 */
.ll-summary-table .ps-grp-alt {
    background: color-mix(in srgb, var(--primary-color) 7%, transparent);
}
.ll-summary-table th.ps-th-oil,
.ll-summary-table .ps-grp-first {
    border-left: 2px solid var(--primary-color);
}

/* ===== 响应式：统计卡片 ===== */
@media (max-width: 1024px) {
    .ll-stats-cards { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
    .ll-panel-grid { grid-template-columns: 1fr 1fr !important; }
    .ll-stats-cards { grid-template-columns: 1fr !important; }
    .ll-tank-card { min-width: 0; }
    .ll-cylinder-cap { width: 46px; height: 6px; }
    .ll-cylinder-body { width: 44px; height: 60px; }
    .ll-cylinder-base { width: 48px; height: 6px; }
}
@media (max-width: 400px) {
    .ll-panel-grid { grid-template-columns: 1fr !important; }
}

/* ============================================================
   每日台账（模板化视图） & 台账模版管理
   前缀：ldt- = 油站配置·台账模版Tab；ld- = 站内台账；ldp- = 打印页
   ============================================================ */

/* ---------- 台账模版 Tab（config.js） ---------- */
/* 横版 A4 纸大小对话框（297mm × 210mm），用于台账模板预览/编辑 */
.modal-content.modal-a4-landscape {
    width: 297mm;
    max-width: 96vw;
    height: 210mm;
    max-height: 92vh;
}
/* 全屏模式（台账模版编辑器 ⛶ 全屏切换）：铺满视口，提升操作空间 */
.modal-content.modal-fullscreen {
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    max-height: 100vh !important;
    border-radius: 0;
}
.ldt-hint {
    padding: 8px 12px;
    margin-bottom: 12px;
    font-size: 12px;
    line-height: 1.6;
    color: var(--text-secondary);
    background: color-mix(in srgb, var(--primary-color) 6%, transparent);
    border-left: 3px solid var(--primary-color);
    border-radius: var(--border-radius);
}
/* 模板编辑器内嵌迷你表格（列配置/公式配置） */
.ldt-mini-table {
    width: 100%;
    font-size: 12px;
}
.ldt-mini-table th {
    white-space: nowrap;
    padding: 6px 4px;
}
.ldt-mini-table td {
    padding: 4px;
}
.ldt-mini-table input[type="text"],
.ldt-mini-table input[type="number"],
.ldt-mini-table select {
    width: 100%;
    padding: 4px 6px;
    font-size: 12px;
}
.ldt-mini-table input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}
/* 模板预览 */
.ldt-mini-table .ldt-preview-note {
    color: var(--text-secondary);
    font-size: 12px;
}

/* ---------- 站内台账列表与提示（station-func.js） ---------- */
.ld-hint {
    font-size: 12px;
    color: var(--text-secondary);
    line-height: 1.5;
}
.ld-period {
    padding: 6px 2px 10px;
    font-size: 13px;
    color: var(--text-secondary);
}

/* ---------- 台账导出面板 ---------- */
.ld-export-dropdown { position: relative; }
.ld-export-panel {
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 100;
    margin-top: 6px;
    padding: 12px 14px;
    background: var(--bg-card, #fff);
    border-radius: 8px;
    box-shadow: 0 6px 24px rgba(0,0,0,0.12);
    border: 1px solid var(--border-color, #e8e8e8);
    min-width: 340px;
}
.ld-export-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}
.ld-export-row:last-child { margin-bottom: 0; }
.ld-export-row label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--text-secondary);
    white-space: nowrap;
}
.ld-export-row input[type="date"],
.ld-export-row select {
    padding: 4px 8px;
    border: 1px solid var(--border-color, #d9d9d9);
    border-radius: 4px;
    font-size: 13px;
}
@media (max-width: 768px) {
    .ld-export-panel { min-width: 280px; right: -20px; }
    .ld-export-row { flex-wrap: wrap; }
}

/* ---------- 台账统计卡片（筛选栏与列表之间的过渡） ---------- */
.ld-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 12px;
    padding: 4px 0 16px;
}
.ld-stat-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 18px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(24,144,255,0.06) 0%, rgba(24,144,255,0.02) 100%);
    border: 1px solid rgba(24,144,255,0.15);
    transition: all 0.25s ease;
    position: relative;
    overflow: hidden;
}
.ld-stat-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 3px; height: 100%;
    background: var(--primary-color);
    opacity: 0.6;
}
.ld-stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(24,144,255,0.12);
    border-color: rgba(24,144,255,0.3);
}
.ld-stat-petrol::before { background: #fa8c16; }
.ld-stat-diesel::before { background: #722ed1; }
.ld-stat-total::before { background: #52c41a; }
.ld-stat-icon {
    font-size: 28px;
    line-height: 1;
    flex-shrink: 0;
    width: 48px; height: 48px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 10px;
    background: rgba(24,144,255,0.08);
}
.ld-stat-petrol .ld-stat-icon { background: rgba(250,140,22,0.1); }
.ld-stat-diesel .ld-stat-icon { background: rgba(114,46,209,0.1); }
.ld-stat-total .ld-stat-icon { background: rgba(82,196,26,0.1); }
.ld-stat-content { flex: 1; min-width: 0; }
.ld-stat-label {
    font-size: 12px;
    color: var(--text-secondary);
    margin-bottom: 2px;
}
.ld-stat-value {
    font-size: 22px;
    font-weight: 700;
    color: var(--text-color);
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}
.ld-stat-subs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 12px;
    margin-top: 6px;
}
.ld-stat-sub {
    font-size: 11px;
    color: var(--text-secondary);
    background: rgba(0,0,0,0.04);
    padding: 2px 8px;
    border-radius: 4px;
    white-space: nowrap;
}
.ld-stat-sub em {
    font-style: normal;
    font-weight: 600;
    color: var(--primary-color);
}
.ld-stat-petrol .ld-stat-sub em { color: #fa8c16; }
.ld-stat-diesel .ld-stat-sub em { color: #722ed1; }

/* ---------- 台账列表表格 ---------- */
.ld-list-card .card-header { position: relative; justify-content: center; }
.ld-list-card .card-header .ld-list-title { text-align: center; }
.ld-list-card .card-header > div {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
}
.ld-table { font-size: 13px; }
.ld-table th, .ld-table td { text-align: center; }
.ld-table .ld-sub-cell {
    max-width: 320px;
}
.ld-table .ld-sub-cell .ld-sub-item {
    display: inline-block;
    font-size: 11px;
    color: var(--text-secondary);
    background: rgba(0,0,0,0.04);
    padding: 2px 8px;
    border-radius: 4px;
    margin: 2px 4px 2px 0;
    white-space: nowrap;
}
.ld-table .ld-sub-cell .ld-sub-item em {
    font-style: normal;
    font-weight: 600;
    color: var(--primary-color);
}
@media (max-width: 768px) {
    .ld-stats { grid-template-columns: 1fr; }
    .ld-stat-card { padding: 12px 14px; }
    .ld-stat-value { font-size: 18px; }
    .ld-table .ld-sub-cell { max-width: none; }
    .ld-list-card .card-header { justify-content: flex-start; flex-wrap: wrap; gap: 8px; }
    .ld-list-card .card-header > div { position: static; transform: none; }
}

/* ---------- 油品型号上浮选择菜单 ---------- */
.ld-oil-dropdown {
    position: absolute;
    z-index: 10000;
    background: var(--bg-card, #fff);
    border: 1px solid var(--border-color, #d9d9d9);
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
    max-height: 264px;
    overflow-y: auto;
    padding: 4px 0;
    display: none;
}
.ld-oil-item {
    padding: 6px 14px;
    font-size: 13px;
    color: var(--text-color, #333);
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s;
}
.ld-oil-item:hover {
    background: var(--primary-bg, rgba(24,144,255,0.06));
    color: var(--primary-color, #1890ff);
}

/* ---------- 台账预览弹窗 ---------- */
.ld-preview-wrap {
    max-height: 75vh;
    overflow-y: auto;
    overflow-x: auto;
    padding: 8px 4px 20px;
    background: #fff;
    border-radius: 4px;
}
.ld-preview-wrap .xls-container {
    margin: 0 auto;
}
.ld-preview-wrap .xls-container table {
    font-size: 12px;
}

/* ---------- 台账编辑器（Excel 风格网格） ---------- */
.ld-editor {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.ld-toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
}
.ld-toolbar label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--text-secondary);
    white-space: nowrap;
}
.ld-toolbar input,
.ld-toolbar select {
    padding: 4px 8px;
}
.ld-grid-wrap {
    max-height: 54vh;
    overflow: auto;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background: var(--card-bg);
}
.ld-grid-wrap table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.ld-grid-wrap th,
.ld-grid-wrap td {
    border: 1px solid var(--border-color);
    padding: 0;
    text-align: center;
    white-space: nowrap;
}
/* 四行表头：第0行字母列标（角格+操作列），第1行列名/分组合并，第2行组内子列名，第3行列编号（均吸顶） */
.ld-grid-wrap thead th {
    position: sticky;
    z-index: 2;
    background: var(--table-header-bg);
    font-weight: 600;
    padding: 4px 8px;
}
.ld-grid-wrap .ld-h0 th {
    top: 0;
    height: 26px;
    z-index: 3;
}
.ld-grid-wrap .ld-h0 .ld-colh {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--text-secondary);
    background: color-mix(in srgb, var(--primary-color) 6%, var(--table-header-bg));
}
.ld-grid-wrap .ld-corner,
.ld-grid-wrap .lgs-corner {
    left: 0;
    z-index: 5;
    background: var(--table-header-bg);
}
.ld-grid-wrap .ld-h1 th {
    top: 26px;
    height: 34px;
}
.ld-grid-wrap .ld-h2 th {
    top: 60px;
    height: 28px;
    font-size: 12px;
}
.ld-grid-wrap .ld-h3 th {
    top: 88px;
    height: 24px;
    font-size: 11px;
    font-weight: 500;
    color: var(--text-secondary);
    background: color-mix(in srgb, var(--primary-color) 5%, var(--table-header-bg));
}
.ld-grid-wrap .ld-h0 .ld-op-th {
    width: 34px;
    min-width: 34px;
}
/* 行号列（吸左，与模版编辑器行号一致） */
.ld-grid-wrap .ld-rownum,
.ld-grid-wrap .lgs-rownum {
    position: sticky;
    left: 0;
    z-index: 1;
    width: 46px;
    min-width: 46px;
    font-size: 11px;
    font-weight: 600;
    color: var(--text-secondary);
    background: color-mix(in srgb, var(--primary-color) 6%, var(--table-header-bg));
    text-align: center;
}
/* 图1复刻：斜角表头（时间/月日）与装饰行行号占位 */
.xls-diag {
    position: relative;
    min-width: 64px;
    background: linear-gradient(to bottom right, transparent calc(50% - 0.7px), #000 calc(50% - 0.7px), #000 calc(50% + 0.7px), transparent calc(50% + 0.7px));
}
.xls-diag .d-tr { position: absolute; top: 3px; right: 6px; font-size: 11px; font-weight: 600; }
.xls-diag .d-bl { position: absolute; bottom: 3px; left: 6px; font-size: 11px; font-weight: 600; }
.xls-table .xls-ch {
    cursor: default;
}
.xls-table .xls-ch:hover { color: var(--text-secondary); }
.ld-grid-wrap .xls-ch {
    position: sticky;
    left: 0;
    width: 46px;
    min-width: 46px;
    background: color-mix(in srgb, var(--primary-color) 6%, var(--table-header-bg));
}
/* 表头信息区（标题+年/单位）与网格在 A4 横版弹窗内撑满 */
.ld-head {
    flex: none;
    padding: 0 4px;
}
.ld-head .lgs-title {
    font-size: 18px;
    margin: 2px 0 6px;
}
.modal-content.modal-a4-landscape .ld-editor {
    height: 100%;
    min-height: 0;
}
.modal-content.modal-a4-landscape .ld-grid-wrap {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
}
/* lgs-in / ld-in 双 class 兼容：ld-in 原有交互样式全部映射给 lgs-in；不固定 cell 高度，由 tr style 决定（所有场景统一数据行默认高 28px） */
.ld-cell {
    padding: 0;
}
.ld-cell .ld-in,
.ld-cell .lgs-in {
    width: 100%;
    height: 100%;
    min-height: 24px;
    padding: 2px 8px;
    border: none;
    background: transparent;
    color: var(--text-color);
    font-size: 13px;
    outline: none;
    box-sizing: border-box;
}
.ld-cell .ld-in:focus,
.ld-cell .lgs-in:focus {
    background: color-mix(in srgb, var(--primary-color) 8%, transparent);
    box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--primary-color) 45%, transparent);
}
/* 公式列只读单元格 — 自动计算，用户不可手动编辑 */
.ld-calc {
    background: color-mix(in srgb, var(--success-color) 7%, transparent);
    color: var(--text-color);
    font-size: 13px;
    cursor: not-allowed;
    font-style: italic;
}
.ld-calc:focus {
    background: color-mix(in srgb, var(--success-color) 12%, transparent);
    box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--success-color) 40%, transparent);
}
.ld-op {
    width: 34px;
}
.ld-op .btn {
    padding: 0 4px;
}
.ld-footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 4px;
    padding: 8px 2px 0;
    font-size: 14px;
    font-weight: 600;
}
.ld-total {
    color: var(--primary-color);
    font-size: 16px;
}

/* 单元格选中样式 */
.ld-cell.ld-selected {
    position: relative;
    outline: 2px solid var(--primary-color);
    outline-offset: -2px;
    background: color-mix(in srgb, var(--primary-color) 15%, transparent);
}

.ld-cell.ld-selected-range {
    background: color-mix(in srgb, var(--primary-color) 8%, transparent);
    outline: 1px solid color-mix(in srgb, var(--primary-color) 50%, transparent);
    outline-offset: -1px;
}

/* 填充柄 - 右下角的小点 */
.ld-fill-handle {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 8px;
    height: 8px;
    background: var(--primary-color);
    cursor: crosshair;
    border-radius: 0;
    opacity: 0.7;
    z-index: 10;
}

.ld-fill-handle:hover {
    opacity: 1;
    transform: scale(1.3);
}

/* 单元格选中时输入框样式调整（同时兼容 ld-in / lgs-in 双 class） */
.ld-cell.ld-selected .ld-in,
.ld-cell.ld-selected .lgs-in {
    background: transparent;
}

.ld-cell.ld-selected .ld-in:focus,
.ld-cell.ld-selected .lgs-in:focus {
    background: transparent;
    box-shadow: none;
}

/* ---------- 编辑模版（类 Excel 可视化表格编辑器，config.js editLedgerSheet） ---------- */
.xls-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
    height: 100%;
    min-height: 0;
}
.xls-toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}
.xls-sep {
    width: 1px;
    height: 20px;
    background: var(--border-color);
    margin: 0 2px;
}
.xls-toolbar .xls-border-sel {
    padding: 4px 6px;
    font-size: 12px;
}
/* 可视化模板编辑器 — 工具栏模板名称输入框 */
.xls-toolbar .xls-tpl-name-wrap {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 2px 8px;
    background: color-mix(in srgb, var(--primary-color) 5%, transparent);
    border: 1px solid color-mix(in srgb, var(--primary-color) 30%, var(--border-color));
    border-radius: 6px;
}
.xls-toolbar .xls-tpl-name-label {
    font-size: 12px;
    font-weight: 600;
    color: var(--primary-color);
    white-space: nowrap;
}
.xls-toolbar .xls-tpl-name-input {
    min-width: 220px;
    width: 30vw;
    max-width: 460px;
    padding: 2px 8px;
    font-size: 13px;
    border: 1px solid transparent;
    border-radius: 4px;
    background: #fff;
    color: var(--text-color);
    outline: none;
    transition: border-color .15s, box-shadow .15s;
}
.xls-toolbar .xls-tpl-name-input:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary-color) 25%, transparent);
}
.xls-toolbar .xls-tpl-name-input[readonly] {
    background: var(--table-header-bg);
    color: var(--text-secondary);
    cursor: not-allowed;
}
.xls-head-info {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}
.xls-head-info label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--text-secondary);
    flex: 1;
    min-width: 160px;
}
.xls-head-info input {
    flex: 1;
    padding: 4px 8px;
    font-size: 12px;
}
/* 公式栏 */
.xls-fxbar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 8px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background: var(--card-bg);
}
.xls-fx-ref {
    min-width: 52px;
    text-align: center;
    font-weight: 700;
    font-size: 12px;
    color: var(--primary-color);
    border-right: 1px solid var(--border-color);
    padding-right: 8px;
}
.xls-fx-tag {
    font-style: italic;
    font-weight: 700;
    font-size: 12px;
    color: var(--text-secondary);
}
.xls-fxbar input {
    flex: 1;
    border: none;
    background: transparent;
    outline: none;
    font-size: 13px;
    color: var(--text-color);
    font-family: Consolas, monospace;
}
/* 网格滚动区 */
.xls-scroll {
    flex: 1;
    min-height: 120px;
    overflow: auto;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background: var(--card-bg);
    outline: none;
}
.xls-table {
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 13px;
}
.xls-rhcol { width: 46px; }
.xls-table .xls-corner,
.xls-table .xls-colh,
.xls-table .xls-rowh {
    position: sticky;
    z-index: 3;
    background: var(--table-header-bg);
    color: var(--text-secondary);
    font-weight: 600;
    font-size: 12px;
    text-align: center;
    border: 1px solid var(--border-color);
    user-select: none;
}
.xls-table .xls-corner { top: 0; left: 0; z-index: 6; width: 46px; height: 26px; }
.xls-table .xls-colh { top: 0; height: 26px; cursor: pointer; }
.xls-table .xls-colh:hover { color: var(--primary-color); }
.xls-table .xls-rowh { left: 0; width: 46px; cursor: pointer; }
.xls-table .xls-rowh:hover { color: var(--primary-color); }
/* 拖拽调整柄 */
.xls-rs { position: absolute; z-index: 5; }
.xls-rs-c { right: 0; top: 0; width: 5px; height: 100%; cursor: col-resize; }
.xls-rs-r { left: 0; bottom: 0; width: 100%; height: 5px; cursor: row-resize; }
.xls-rs:hover { background: color-mix(in srgb, var(--primary-color) 45%, transparent); }
.xls-table .xls-colh, .xls-table .xls-rowh { position: sticky; }
.xls-table th { position: sticky; }
.xls-cell {
    position: relative;
    height: 26px;
    padding: 2px 6px;
    border: 1px solid color-mix(in srgb, var(--border-color) 60%, transparent);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: cell;
    background: transparent;
}
.xls-cell.xls-sel {
    background: color-mix(in srgb, var(--primary-color) 14%, transparent);
}
.xls-cell.xls-act {
    outline: 2px solid var(--primary-color);
    outline-offset: -2px;
}
/* 只读模式视觉反馈（不阻止选择/导航，仅视觉提示） */
.xls-readonly-hint {
    display: block;
    padding: 6px 12px;
    background: color-mix(in srgb, var(--warning-color) 12%, transparent);
    color: var(--warning-color);
    font-size: 13px;
    font-weight: 500;
    border-bottom: 1px solid color-mix(in srgb, var(--warning-color) 30%, transparent);
    text-align: center;
    transition: opacity 0.2s;
}
.editing-mode .xls-readonly-hint {
    display: none;
}
.xls-readonly .xls-cell {
    cursor: default !important;
    opacity: 0.88;
}
.xls-readonly .xls-cell.xls-act {
    outline: 2px dashed var(--border-color);
    outline-offset: -2px;
    background: color-mix(in srgb, var(--border-color) 12%, transparent);
}
.xls-readonly .xls-cell:hover {
    background: color-mix(in srgb, var(--border-color) 8%, transparent);
}
.xls-readonly .xls-cell .xls-fill-handle {
    display: none;
}
/* 只读状态下列名/标题输入框样式 */
.xls-title-input[readonly],
#xls-title[readonly],
#xls-metal[readonly],
#xls-metar[readonly],
#xls-fx-in[readonly] {
    background: color-mix(in srgb, var(--border-color) 8%, transparent);
    color: var(--text-secondary);
    cursor: not-allowed;
}
/* 编辑模式下的视觉提示 */
.xls-wrap.editing-mode .xls-readonly-badge {
    display: none;
}
.xls-readonly-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    background: color-mix(in srgb, var(--warning-color) 15%, transparent);
    color: var(--warning-color);
    font-size: 12px;
    font-weight: 500;
    border-radius: 12px;
    margin-left: 8px;
}
/* 填充柄 — 活动单元格右下角小方块，拖拽可向下/向右批量填充
   注意：.xls-cell 有 overflow:hidden，填充柄必须在单元格内部边界内，否则被裁剪 */
.xls-fill-handle {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 8px;
    height: 8px;
    background: var(--primary-color);
    cursor: crosshair;
    z-index: 10;
    border: 1px solid #fff;
    box-sizing: border-box;
}
.xls-fill-handle:hover {
    transform: scale(1.5);
    transform-origin: bottom right;
}
.xls-cell.xls-fill-src {
    outline: 2px dashed var(--primary-color);
    outline-offset: -2px;
}
.xls-cell.xls-f {
    color: color-mix(in srgb, var(--primary-color) 72%, var(--text-color));
}
.xls-cell.xls-bold { font-weight: 700; }
.xls-cell.xls-inh {
    background: color-mix(in srgb, var(--warning-color) 14%, transparent);
}
.xls-edit {
    width: 100%;
    height: 100%;
    padding: 0 4px;
    margin: 0;
    border: none;
    outline: none;
    background: var(--card-bg);
    color: var(--text-color);
    font-size: 13px;
    font-family: inherit;
    box-shadow: inset 0 0 0 2px var(--primary-color);
    box-sizing: border-box;
    display: block;
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 20;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
/* 右键菜单 */
.xls-ctx {
    display: none;
    position: fixed;
    z-index: 9999;
    min-width: 170px;
    padding: 4px 0;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    box-shadow: var(--shadow);
}
.xls-ctx.show { display: block; }
.xls-ctx-item {
    padding: 6px 16px;
    font-size: 13px;
    cursor: pointer;
    white-space: nowrap;
}
.xls-ctx-item:hover {
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    color: var(--primary-color);
}
.xls-ctx-sep {
    height: 1px;
    margin: 4px 8px;
    background: var(--border-color);
}
/* 油品多选卡片 */
.xls-oil-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.xls-oil-card {
    position: relative;
    cursor: pointer;
}
.xls-oil-card input {
    position: absolute;
    opacity: 0;
}
.xls-oil-card span {
    display: inline-block;
    padding: 9px 18px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    font-size: 13px;
    transition: all 0.15s;
}
.xls-oil-card input:checked + span {
    border-color: var(--primary-color);
    color: var(--primary-color);
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    font-weight: 600;
}
@media (max-width: 900px) {
    .xls-head-info label { min-width: 120px; }
}

/* ---------- A4 在线打印 ---------- */
#ld-print-area {
    display: none;
}
/* 打印时隐藏页面其余部分，仅显示打印区（屏幕与打印媒介一致） */
body.ledger-printing > *:not(#ld-print-area) {
    display: none !important;
}
body.ledger-printing {
    background: #fff;
}
body.ledger-printing #ld-print-area {
    display: block;
}
/* ---------- 图1样式账页（管理端预览 / 在线打印 共用） ---------- */
.lgs-sheet {
    padding: 4px 0;
}
/* 统一：账页抬头区（标题/日期/单位）始终无边框；.lgs-table 全局 td/th 默认边框不会误加 */
.lgs-table .xls-ch-title,
.lgs-table .xls-ch-metal,
.lgs-table .xls-ch-metar,
.lgs-table .xls-ch-title *,
.lgs-table .xls-ch-metal *,
.lgs-table .xls-ch-metar * {
    border: none !important;
}
/* 标题行/日期行的行号占位格（.xls-ch）无边框 */
.lgs-table th.xls-ch,
.lgs-table td.xls-ch {
    border: none !important;
}
/* 图1样式原抬头（非 sheet 模板分支）：.lgs-title/.lgs-meta 不在表格内，不会被加框——仅保障视觉与 sheet 模板一致 */
.lgs-title {
    font-size: 20px;
    font-weight: 700;
    text-align: center;
    letter-spacing: 3px;
    margin: 6px 0 10px;
    color: var(--text-color);
}
.lgs-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 6px;
    color: var(--text-color);
}
.lgs-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    background: var(--card-bg);
}
.lgs-table th,
.lgs-table td {
    border: 1px solid var(--text-color);
    padding: 5px 8px;
    text-align: center;
    color: var(--text-color);
}
.lgs-table thead th {
    font-weight: 700;
    background: color-mix(in srgb, var(--text-color) 6%, var(--card-bg));
}
.lgs-corner {
    width: 74px;
    font-size: 12px;
    line-height: 1.4;
}
.lgs-numrow td {
    font-weight: 600;
    font-size: 12px;
    background: color-mix(in srgb, var(--text-color) 4%, var(--card-bg));
}
.lgs-num {
    font-variant-numeric: tabular-nums;
}
.lgs-total-row td {
    font-weight: 700;
}
/* 预览编辑：行号列（与表头「#」角格对齐） */
.lgs-table .lgs-rownum {
    width: 46px;
    min-width: 46px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-secondary);
    background: color-mix(in srgb, var(--primary-color) 6%, var(--table-header-bg));
    text-align: center;
}
/* 预览编辑：输入框撑满单元格，去除默认边框，与只读单元格视觉一致 */
.lgs-table .lgs-in {
    width: 100%;
    min-width: 0;
    border: none;
    background: transparent;
    padding: 3px 6px;
    font: inherit;
    color: inherit;
    text-align: inherit;
    box-sizing: border-box;
}
.lgs-table .lgs-in:focus {
    outline: 2px solid var(--primary-color);
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
}
/* 预览编辑：公式计算列只读单元格（灰底，区别于可编辑列） */
.lgs-table .lgs-calc {
    background: color-mix(in srgb, var(--text-color) 3%, var(--card-bg));
    color: var(--text-secondary);
}
body.ledger-printing .lgs-table .lgs-rownum,
body.ledger-printing .lgs-table .lgs-calc {
    background: #f0f0f0;
    color: #000;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}
.ldp-sub {
    margin-top: 8px;
    text-align: center;
    font-size: 11px;
    color: var(--text-secondary);
}
/* 打印时账页固定黑字黑框白底，不受主题影响 */
body.ledger-printing .lgs-title,
body.ledger-printing .lgs-meta,
body.ledger-printing .lgs-table th,
body.ledger-printing .lgs-table td {
    color: #000;
    border-color: #000;
}
body.ledger-printing .lgs-table {
    background: #fff;
}
body.ledger-printing .lgs-table thead th,
body.ledger-printing .lgs-numrow td {
    background: #f0f0f0;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}
body.ledger-printing .ldp-sub {
    color: #555;
}
@media print {
    body.ledger-printing {
        margin: 0;
    }
}

/* ---------- 台账响应式 ---------- */
@media (max-width: 768px) {
    .ld-toolbar {
        gap: 8px;
    }
    .ld-grid-wrap thead th {
        font-size: 12px;
    }
}

/* ==================== 液位录入分步向导 ==================== */
/* 遵循系统视觉语言：CSS 变量、Ant Design 蓝主题、字体排版 */

/* 步骤条 */
.wz-steps {
    display: flex;
    align-items: center;
    padding: 0 8px 16px;
    margin-bottom: 8px;
    border-bottom: 1px solid var(--border-color);
}
.wz-step {
    display: flex;
    align-items: center;
    gap: 8px;
}
.wz-step-dot {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    border: 2px solid var(--border-color);
    color: var(--text-secondary);
    background: var(--card-bg);
    transition: all 0.3s;
    flex-shrink: 0;
}
.wz-step-label {
    font-size: 13px;
    color: var(--text-secondary);
}
.wz-step-line {
    flex: 1;
    height: 2px;
    background: var(--border-color);
    margin: 0 8px;
    min-width: 24px;
}
.wz-step-pending .wz-step-dot {
    color: var(--text-secondary);
}
.wz-step-active .wz-step-dot {
    border-color: var(--primary-color);
    color: #fff;
    background: var(--primary-color);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary-color) 15%, transparent);
}
.wz-step-active .wz-step-label {
    color: var(--text-color);
    font-weight: 700;
}
.wz-step-done .wz-step-dot {
    border-color: var(--success-color);
    color: #fff;
    background: var(--success-color);
    font-size: 0;
}
.wz-step-done .wz-step-dot::before {
    content: '✓';
    font-size: 14px;
}
.wz-step-done .wz-step-label {
    color: var(--text-color);
}
.wz-step-done + .wz-step-line {
    background: var(--success-color);
}

/* 步骤内容容器 */
.wz-step-body {
    padding: 4px 4px 8px;
    min-height: 220px;
}
.wz-hint {
    font-size: 12px;
    color: var(--primary-color);
    padding: 8px 12px;
    background: color-mix(in srgb, var(--primary-color) 8%, transparent);
    border-radius: 6px;
    margin-bottom: 14px;
    line-height: 1.6;
}

/* 步骤2：油罐网格（带可视化） */
.wz-tanks-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.wz-tank-row {
    display: flex;
    gap: 14px;
    padding: 12px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: var(--hover-bg);
    align-items: center;
}
.wz-tank-vis {
    text-align: center;
    flex-shrink: 0;
}
.wz-tank-name {
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 6px;
    color: var(--text-color);
    white-space: nowrap;
}
.wz-tank-input {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
    justify-content: center;
}
.wz-tank-input label {
    font-size: 11px;
    color: var(--text-secondary);
}
.wz-tank-calc {
    display: flex;
    gap: 12px;
    align-items: baseline;
    margin-top: 4px;
}
.wz-liters {
    font-size: 16px;
    font-weight: 700;
    color: var(--primary-color);
}
.wz-tons {
    font-size: 13px;
    color: var(--text-secondary);
}

/* 中型立式罐（向导步骤2 用） */
.ll-cylinder-md .ll-cylinder-cap {
    width: 70px;
    height: 9px;
}
.ll-cylinder-md .ll-cylinder-body {
    width: 68px;
    height: 110px;
}
.ll-cylinder-md .ll-cylinder-base {
    width: 74px;
    height: 9px;
}

/* 步骤3：是否卸油 询问面板 */
.wz-ask-panel {
    text-align: center;
    padding: 30px 20px 20px;
}
.wz-ask-icon {
    font-size: 40px;
    margin-bottom: 12px;
}
.wz-ask-title {
    font-size: 16px;
    font-weight: 700;
    color: var(--text-color);
    margin-bottom: 22px;
}
.wz-ask-actions {
    display: flex;
    gap: 12px;
    justify-content: center;
}

/* 步骤3：卸油表单 */
.wz-unload-added-list {
    margin-top: 10px;
    max-height: 180px;
    overflow-y: auto;
}

/* 底部按钮区：主操作按钮居中，取消/上一步靠左 */
.wz-footer {
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 14px 4px 4px;
    margin-top: 12px;
    border-top: 1px solid var(--border-color);
    position: relative;
}
.wz-footer-spacer {
    flex: 1;
}
/* 让主操作按钮（下一步/完成）绝对居中 */
.wz-footer .wz-btn-next {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
/* 步骤3「添加卸油记录」按钮：大号绿色居中，与主操作视觉一致 */
.wz-add-unload-btn {
    min-width: 220px;
    padding: 10px 24px;
    font-size: 15px;
    font-weight: 600;
    border-radius: 4px;
}

/* 响应式：移动端油罐网格单列 */
@media (max-width: 600px) {
    .wz-tanks-grid {
        grid-template-columns: 1fr;
    }
    .wz-steps {
        flex-wrap: wrap;
        gap: 8px;
    }
    .wz-step-line {
        display: none;
    }
}