/* ========================================
   工资表统计插件 - 样式表
   Version: 4.2 — 移动端卡片网格
   ======================================== */

/* ---- CSS 变量：颜色主题 ---- */
:root {
    --salary-primary: #6c7cf6;
    --salary-primary-hover: #5b6bf0;
    --salary-primary-light: rgba(108, 124, 246, 0.12);
    --salary-primary-glow: rgba(108, 124, 246, 0.22);
    --salary-success: #67c9a6;
    --salary-success-hover: #56bb97;
    --salary-success-light: rgba(103, 201, 166, 0.18);
    --salary-danger: #f29aaa;
    --salary-danger-hover: #ea8698;
    --salary-danger-light: rgba(242, 154, 170, 0.18);
    --salary-warning: #f2c27b;
    --salary-warning-bg: #fff8ed;
    --salary-info: #8ab5ff;
    --salary-info-bg: #f2f7ff;
    --salary-info-border: #d8e5ff;
    --salary-text: #22304a;
    --salary-text-secondary: #5b6882;
    --salary-text-muted: #8d97ac;
    --salary-text-light: #b6bfd1;
    --salary-bg: #f4f6fb;
    --salary-bg-secondary: #eef2f9;
    --salary-bg-hover: #e8edf7;
    --salary-bg-stripe: #f7f9fd;
    --salary-border: rgba(255, 255, 255, 0.72);
    --salary-border-light: rgba(255, 255, 255, 0.82);
    --salary-border-input: #d9e0ee;
    --salary-shadow-xs: -3px -3px 8px rgba(255, 255, 255, 0.9), 3px 3px 8px rgba(194, 204, 225, 0.35);
    --salary-shadow: -5px -5px 14px rgba(255, 255, 255, 0.92), 6px 6px 16px rgba(194, 204, 225, 0.38);
    --salary-shadow-md: -8px -8px 18px rgba(255, 255, 255, 0.96), 10px 10px 24px rgba(184, 195, 216, 0.42);
    --salary-shadow-lg: -12px -12px 28px rgba(255, 255, 255, 0.98), 16px 16px 34px rgba(182, 192, 214, 0.46);
    --salary-shadow-xl: -16px -16px 36px rgba(255, 255, 255, 1), 20px 20px 42px rgba(176, 188, 211, 0.48);
    --salary-overlay: rgba(15, 23, 42, 0.75);
    --salary-toast-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
    --salary-amount-total: #e38b73;
    --salary-paid-bg: #eef9f4;
    --salary-paid-text: #5fae90;
    --salary-paid-border: rgba(103, 201, 166, 0.38);
    --salary-unpaid-bg: #fff0f3;
    --salary-unpaid-text: #d68999;
    --salary-unpaid-border: rgba(242, 154, 170, 0.36);
    --salary-gradient-header: linear-gradient(135deg, #f7f9fe 0%, #eef3fb 100%);
    --salary-gradient-summary: linear-gradient(135deg, #eef3ff 0%, #f4f7ff 100%);
    --salary-gradient-grand: linear-gradient(135deg, #fff6eb 0%, #fff2dd 100%);
    --salary-gradient-panel: linear-gradient(145deg, #f7f9fe 0%, #eef2f9 100%);
    --salary-gradient-stat: linear-gradient(145deg, rgba(255, 255, 255, 0.85) 0%, rgba(238, 242, 249, 0.95) 100%);
    --salary-gradient-card-glow: radial-gradient(circle at top left, rgba(255, 255, 255, 0.95), transparent 45%);
    --salary-inner-border: inset 1px 1px 0 rgba(255, 255, 255, 0.88), inset -1px -1px 0 rgba(212, 220, 236, 0.38);
    --salary-radius: 18px;
    --salary-radius-sm: 14px;
    --salary-radius-xs: 12px;
    --salary-radius-lg: 30px;
}

/* ---- 暗色模式 ---- */
@media (prefers-color-scheme: dark) {
    :root {
        --salary-primary: #7c89ff;
        --salary-primary-hover: #9ca6ff;
        --salary-primary-light: rgba(124, 137, 255, 0.12);
        --salary-primary-glow: rgba(124, 137, 255, 0.35);
        --salary-success: #34d399;
        --salary-success-hover: #6ee7b7;
        --salary-success-light: rgba(52, 211, 153, 0.15);
        --salary-danger: #f87171;
        --salary-danger-hover: #fca5a5;
        --salary-danger-light: rgba(248, 113, 113, 0.15);
        --salary-warning-bg: #1c1917;
        --salary-info: #60a5fa;
        --salary-info-bg: #111827;
        --salary-info-border: #1e3a5f;
        --salary-text: #f8fafc;
        --salary-text-secondary: #cbd5e1;
        --salary-text-muted: #64748b;
        --salary-text-light: #475569;
        --salary-bg: #0b0f1a;
        --salary-bg-secondary: #111827;
        --salary-bg-hover: #1f2937;
        --salary-bg-stripe: #0d1221;
        --salary-border: #1f2937;
        --salary-border-light: #161d2f;
        --salary-border-input: #374151;
        --salary-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.4);
        --salary-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
        --salary-shadow-md: 0 6px 12px -2px rgba(0, 0, 0, 0.6);
        --salary-shadow-lg: 0 12px 24px -4px rgba(0, 0, 0, 0.7);
        --salary-shadow-xl: 0 25px 50px -12px rgba(0, 0, 0, 0.8);
        --salary-overlay: rgba(0, 0, 0, 0.9);
        --salary-toast-shadow: 0 20px 40px rgba(0, 0, 0, 0.6);
        --salary-amount-total: #fb923c;
        --salary-paid-bg: rgba(5, 46, 22, 0.4);
        --salary-paid-text: #34d399;
        --salary-paid-border: rgba(6, 95, 70, 0.5);
        --salary-unpaid-bg: rgba(69, 10, 10, 0.4);
        --salary-unpaid-text: #f87171;
        --salary-unpaid-border: rgba(127, 29, 29, 0.5);
        --salary-gradient-header: linear-gradient(135deg, #4338ca 0%, #6d28d9 100%);
        --salary-gradient-summary: linear-gradient(135deg, #1e1b4b 0%, #1e3a8a 100%);
        --salary-gradient-grand: linear-gradient(135deg, #451a03 0%, #78350f 100%);
        --salary-gradient-panel: linear-gradient(180deg, #0b0f1a 0%, #0d1221 100%);
        --salary-gradient-stat: linear-gradient(135deg, rgba(124, 137, 255, 0.08) 0%, rgba(96, 165, 250, 0.02) 100%);
        --salary-gradient-card-glow: radial-gradient(circle at top right, rgba(124, 137, 255, 0.1), transparent 50%);
        --salary-inner-border: inset 0 1px 0 rgba(255, 255, 255, 0.05), inset 0 0 0 1px rgba(255, 255, 255, 0.02);
    }
}

body.salary-theme-light {
    --salary-primary: #6c7cf6;
    --salary-primary-hover: #5b6bf0;
    --salary-primary-light: rgba(108, 124, 246, 0.12);
    --salary-primary-glow: rgba(108, 124, 246, 0.22);
    --salary-success: #67c9a6;
    --salary-success-hover: #56bb97;
    --salary-success-light: rgba(103, 201, 166, 0.18);
    --salary-danger: #f29aaa;
    --salary-danger-hover: #ea8698;
    --salary-danger-light: rgba(242, 154, 170, 0.18);
    --salary-warning: #f2c27b;
    --salary-warning-bg: #fff8ed;
    --salary-info: #8ab5ff;
    --salary-info-bg: #f2f7ff;
    --salary-info-border: #d8e5ff;
    --salary-text: #22304a;
    --salary-text-secondary: #5b6882;
    --salary-text-muted: #8d97ac;
    --salary-text-light: #b6bfd1;
    --salary-bg: #f4f6fb;
    --salary-bg-secondary: #eef2f9;
    --salary-bg-hover: #e8edf7;
    --salary-bg-stripe: #f7f9fd;
    --salary-border: rgba(255, 255, 255, 0.72);
    --salary-border-light: rgba(255, 255, 255, 0.82);
    --salary-border-input: #d9e0ee;
    --salary-shadow-xs: -3px -3px 8px rgba(255, 255, 255, 0.9), 3px 3px 8px rgba(194, 204, 225, 0.35);
    --salary-shadow: -5px -5px 14px rgba(255, 255, 255, 0.92), 6px 6px 16px rgba(194, 204, 225, 0.38);
    --salary-shadow-md: -8px -8px 18px rgba(255, 255, 255, 0.96), 10px 10px 24px rgba(184, 195, 216, 0.42);
    --salary-shadow-lg: -12px -12px 28px rgba(255, 255, 255, 0.98), 16px 16px 34px rgba(182, 192, 214, 0.46);
    --salary-shadow-xl: -16px -16px 36px rgba(255, 255, 255, 1), 20px 20px 42px rgba(176, 188, 211, 0.48);
    --salary-overlay: rgba(15, 23, 42, 0.75);
    --salary-toast-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
    --salary-amount-total: #e38b73;
    --salary-paid-bg: #eef9f4;
    --salary-paid-text: #5fae90;
    --salary-paid-border: rgba(103, 201, 166, 0.38);
    --salary-unpaid-bg: #fff0f3;
    --salary-unpaid-text: #d68999;
    --salary-unpaid-border: rgba(242, 154, 170, 0.36);
    --salary-gradient-header: linear-gradient(135deg, #f7f9fe 0%, #eef3fb 100%);
    --salary-gradient-summary: linear-gradient(135deg, #eef3ff 0%, #f4f7ff 100%);
    --salary-gradient-grand: linear-gradient(135deg, #fff6eb 0%, #fff2dd 100%);
    --salary-gradient-panel: linear-gradient(145deg, #f7f9fe 0%, #eef2f9 100%);
    --salary-gradient-stat: linear-gradient(145deg, rgba(255, 255, 255, 0.85) 0%, rgba(238, 242, 249, 0.95) 100%);
    --salary-gradient-card-glow: radial-gradient(circle at top left, rgba(255, 255, 255, 0.95), transparent 45%);
    --salary-inner-border: inset 1px 1px 0 rgba(255, 255, 255, 0.88), inset -1px -1px 0 rgba(212, 220, 236, 0.38);
}

body.salary-theme-dark {
    --salary-primary: #8a97ff;
    --salary-primary-hover: #a8b0ff;
    --salary-primary-light: rgba(138, 151, 255, 0.16);
    --salary-primary-glow: rgba(138, 151, 255, 0.34);
    --salary-success: #5fd3af;
    --salary-success-hover: #78e0c1;
    --salary-success-light: rgba(95, 211, 175, 0.18);
    --salary-danger: #ff9db0;
    --salary-danger-hover: #ffb3c2;
    --salary-danger-light: rgba(255, 157, 176, 0.18);
    --salary-warning: #f4c56f;
    --salary-warning-bg: #302615;
    --salary-info: #8bb7ff;
    --salary-info-bg: #172234;
    --salary-info-border: #223555;
    --salary-text: #edf3ff;
    --salary-text-secondary: #bcc7dc;
    --salary-text-muted: #8895af;
    --salary-text-light: #61708e;
    --salary-bg: #141b28;
    --salary-bg-secondary: #1a2333;
    --salary-bg-hover: #233048;
    --salary-bg-stripe: #161f2e;
    --salary-border: rgba(255, 255, 255, 0.06);
    --salary-border-light: rgba(255, 255, 255, 0.04);
    --salary-border-input: #30405d;
    --salary-shadow-xs: inset 1px 1px 0 rgba(255,255,255,0.02), 0 6px 14px rgba(3, 8, 18, 0.28);
    --salary-shadow: inset 1px 1px 0 rgba(255,255,255,0.025), 0 10px 24px rgba(3, 8, 18, 0.36);
    --salary-shadow-md: inset 1px 1px 0 rgba(255,255,255,0.03), 0 16px 36px rgba(3, 8, 18, 0.42);
    --salary-shadow-lg: inset 1px 1px 0 rgba(255,255,255,0.035), 0 22px 48px rgba(3, 8, 18, 0.48);
    --salary-shadow-xl: inset 1px 1px 0 rgba(255,255,255,0.04), 0 30px 70px rgba(3, 8, 18, 0.54);
    --salary-overlay: rgba(2, 6, 23, 0.88);
    --salary-toast-shadow: 0 20px 40px rgba(0, 0, 0, 0.45);
    --salary-amount-total: #f9b27e;
    --salary-paid-bg: rgba(18, 63, 52, 0.55);
    --salary-paid-text: #76e3ba;
    --salary-paid-border: rgba(95, 211, 175, 0.28);
    --salary-unpaid-bg: rgba(78, 28, 45, 0.6);
    --salary-unpaid-text: #ffb0c0;
    --salary-unpaid-border: rgba(255, 157, 176, 0.24);
    --salary-gradient-header: linear-gradient(135deg, #222c40 0%, #1a2333 100%);
    --salary-gradient-summary: linear-gradient(135deg, #1b2940 0%, #1f314d 100%);
    --salary-gradient-grand: linear-gradient(135deg, #36291f 0%, #2d2219 100%);
    --salary-gradient-panel: linear-gradient(145deg, #1a2333 0%, #131b29 100%);
    --salary-gradient-stat: linear-gradient(145deg, rgba(31, 41, 59, 0.92) 0%, rgba(21, 28, 42, 0.98) 100%);
    --salary-gradient-card-glow: radial-gradient(circle at top left, rgba(138, 151, 255, 0.08), transparent 42%);
    --salary-inner-border: inset 1px 1px 0 rgba(255, 255, 255, 0.03), inset -1px -1px 0 rgba(0, 0, 0, 0.22);
}

/* ---- 图标样式 ---- */
html {
    scrollbar-gutter: stable;
}

.salary-icon {
    width: 16px;
    height: 16px;
    stroke-width: 2.5;
}

.salary-stat-icon {
    width: 14px;
    height: 14px;
    stroke-width: 2.5;
    color: var(--salary-text-muted);
    opacity: 0.8;
}

/* ---- 容器 ---- */
.salary-table-wrapper {
    position: relative;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 32px 0;
    padding: 28px;
    background:
        radial-gradient(circle at top left, rgba(255, 255, 255, 0.92), transparent 28%),
        radial-gradient(circle at bottom right, rgba(138, 181, 255, 0.1), transparent 34%),
        var(--salary-gradient-panel);
    border: 1px solid var(--salary-border);
    border-radius: 30px;
    box-shadow: var(--salary-shadow-xl);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 14px;
    color: var(--salary-text);
    line-height: 1.6;
}

.salary-table-wrapper::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    box-shadow: var(--salary-inner-border);
}

/* ---- 工具栏（卡片风格 + 毛玻璃） ---- */
.salary-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 24px;
    padding: 20px 24px;
    background:
        var(--salary-gradient-card-glow),
        var(--salary-gradient-panel);
    border: 1px solid var(--salary-border);
    border-radius: 24px;
    box-shadow: var(--salary-shadow-lg), var(--salary-inner-border);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.salary-toolbar label {
    font-weight: 600;
    font-size: 13px;
    color: var(--salary-text-secondary);
    letter-spacing: 0.02em;
}

.salary-toolbar select,
.salary-toolbar input[type="number"],
.salary-toolbar input[type="text"] {
    min-height: 44px;
    padding: 10px 16px;
    border: 1px solid var(--salary-border-input);
    border-radius: 15px;
    font-size: 13px;
    background: linear-gradient(145deg, #f7f9fe 0%, #edf2f9 100%);
    color: var(--salary-text);
    min-width: 80px;
    transition: all 0.2s ease;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.92), inset -1px -1px 0 rgba(214, 222, 237, 0.38);
}

.salary-toolbar input[type="text"] {
    flex: 1 1 220px;
    min-width: 180px;
}

.salary-toolbar select:focus,
.salary-toolbar input:focus {
    outline: none;
    border-color: var(--salary-primary);
    box-shadow: 0 0 0 4px rgba(108, 124, 246, 0.12), inset 1px 1px 0 rgba(255, 255, 255, 0.92);
    background: #f9fbff;
}

.salary-toolbar #salary-filter-year {
    min-width: 120px;
}

.salary-toolbar #salary-chart-toggle,
.salary-toolbar #salary-theme-toggle,
.salary-toolbar #salary-export-btn,
.salary-toolbar #salary-add-btn {
    min-height: 40px;
}

.salary-theme-toggle .salary-theme-icon {
    transition: transform 0.25s ease, opacity 0.25s ease;
}

.salary-theme-toggle.is-dark .salary-theme-icon {
    transform: rotate(180deg) scale(1.05);
}

/* ---- 按钮通用（圆润渐变） ---- */
.salary-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 18px;
    border: none;
    border-radius: 15px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    white-space: nowrap;
    line-height: 1.4;
    letter-spacing: 0.01em;
    position: relative;
    overflow: hidden;
}

.salary-btn::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255,255,255,0.24) 0%, rgba(255,255,255,0) 100%);
    pointer-events: none;
}

.salary-btn:hover {
    transform: translateY(-1px);
    box-shadow: var(--salary-shadow-md);
}

.salary-btn:active {
    transform: translateY(0);
    box-shadow: var(--salary-shadow-xs);
}

.salary-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.salary-btn-primary {
    background: linear-gradient(145deg, #7585fb 0%, #6877f3 100%);
    color: #fff;
    box-shadow: 0 10px 22px rgba(108, 124, 246, 0.22);
}

.salary-btn-primary:hover:not(:disabled) {
    background: var(--salary-primary-hover);
    box-shadow: 0 4px 14px var(--salary-primary-glow);
}

.salary-btn-secondary {
    background: linear-gradient(145deg, #f7f9fe 0%, #edf2f9 100%);
    color: var(--salary-text-secondary);
    border: 1px solid rgba(255, 255, 255, 0.82);
    box-shadow: var(--salary-shadow), var(--salary-inner-border);
}

.salary-btn-secondary::after { display: none; }

.salary-btn-secondary:hover:not(:disabled) {
    background: linear-gradient(145deg, #fbfcff 0%, #eef3fb 100%);
    border-color: var(--salary-primary);
    color: var(--salary-primary);
    box-shadow: var(--salary-shadow-md);
}

.salary-btn-success {
    background: var(--salary-success);
    color: #fff;
}

.salary-btn-success:hover:not(:disabled) {
    background: var(--salary-success-hover);
}

.salary-btn-danger {
    background: var(--salary-danger);
    color: #fff;
}

.salary-btn-danger:hover:not(:disabled) {
    background: var(--salary-danger-hover);
}

.salary-btn-sm {
    padding: 5px 12px;
    font-size: 12px;
    border-radius: var(--salary-radius-xs);
    min-height: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

/* ---- 数据图表（卡片） ---- */
.salary-chart-area {
    margin-bottom: 20px;
    padding: 22px 24px;
    background: linear-gradient(145deg, rgba(248, 250, 255, 0.94) 0%, rgba(238, 242, 249, 0.98) 100%);
    border: 1px solid var(--salary-border);
    border-radius: var(--salary-radius-lg);
    box-shadow: var(--salary-shadow-md), var(--salary-inner-border);
}

.salary-chart-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    gap: 10px;
}

.salary-chart-title {
    font-weight: 700;
    font-size: 16px;
    color: var(--salary-text);
    letter-spacing: 0.02em;
}

.salary-chart-actions {
    display: flex;
    gap: 4px;
    background: linear-gradient(145deg, #f7f9fe 0%, #edf2f9 100%);
    padding: 5px;
    border-radius: 999px;
    border: 1px solid var(--salary-border-light);
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.88), inset -1px -1px 0 rgba(214, 222, 237, 0.34);
}

.salary-chart-mode {
    background: transparent;
    color: var(--salary-text-muted);
    border: none;
    transition: all 0.2s;
    border-radius: 999px;
}

.salary-chart-mode::after { display: none; }

.salary-chart-mode.active {
    background: linear-gradient(145deg, #7484fb 0%, #6777f2 100%);
    color: #fff;
    box-shadow: 0 8px 18px rgba(108, 124, 246, 0.18);
}

#salary-chart {
    width: 100%;
    max-height: 320px;
}

/* ---- 表格（卡片 + 渐变表头） ---- */
.salary-table {
    width: 100%;
    min-width: 900px;
    table-layout: fixed;
    border-spacing: 0;
    border: none;
    background: linear-gradient(145deg, #f8faff 0%, #eef2f9 100%);
    border-radius: var(--salary-radius-lg);
    overflow: hidden;
    box-shadow: var(--salary-shadow-lg), var(--salary-inner-border);
}

.salary-col-id { width: 8%; }
.salary-col-year { width: 9%; }
.salary-col-month { width: 9%; }
.salary-col-company { width: 13%; }
.salary-col-employee { width: 13%; }
.salary-col-total { width: 13%; }
.salary-col-status { width: 13%; }
.salary-col-detail { width: 22%; }

.salary-table thead th {
    background: var(--salary-gradient-header);
    padding: 16px 18px;
    text-align: center;
    font-weight: 700;
    font-size: 13px;
    color: var(--salary-text-secondary);
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 10;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(214, 222, 237, 0.7);
    box-shadow: inset 0 -1px 0 rgba(212, 220, 236, 0.55);
    line-height: 1.5;
    min-height: 54px;
}

/* ---- 行内编辑增强 ---- */
.salary-table .editable-cell:focus-within::before {
    border-color: var(--salary-primary);
    border-style: solid;
    background: var(--salary-primary-light);
    animation: salaryPulse 2s infinite;
}

@keyframes salaryPulse {
    0% { box-shadow: 0 0 0 0 rgba(74, 108, 247, 0.4); }
    70% { box-shadow: 0 0 0 10px rgba(74, 108, 247, 0); }
    100% { box-shadow: 0 0 0 0 rgba(74, 108, 247, 0); }
}

.salary-table thead th:first-child {
    border-top-left-radius: var(--salary-radius);
}

.salary-table thead th:last-child {
    border-top-right-radius: var(--salary-radius);
}

.salary-table tbody td {
    padding: 14px 16px;
    border-bottom: 1px solid rgba(218, 225, 238, 0.72);
    text-align: center;
    vertical-align: middle;
    transition: all 0.2s ease;
    position: relative;
    overflow-wrap: anywhere;
    line-height: 1.5;
    min-height: 52px;
}

/* 针对明细列的特殊优化 */
.salary-table tbody td:nth-child(8) {
    padding: 7px 16px;
}

.salary-table tbody td:nth-child(8) .salary-detail-actions-inline {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.salary-table tbody td:nth-child(8) .salary-detail-images {
    flex: 0 0 auto;
}

.salary-table tbody td:nth-child(8) .salary-actions {
    flex: 0 0 auto;
}

/* 斑马纹 */
.salary-table tbody tr:nth-child(even):not(.year-summary-row):not(.grand-summary-row):not(.new-row) td {
    background: rgba(255, 255, 255, 0.34);
}

/* 行悬浮效果 */
.salary-table tbody tr:not(.year-summary-row):not(.grand-summary-row):hover td {
    background: rgba(255, 255, 255, 0.62);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), inset 0 -1px 0 rgba(214, 222, 237, 0.4);
}

/* 行入场动画 */
.salary-table tbody tr {
    animation: salaryRowFadeIn 0.35s ease both;
}

@keyframes salaryRowFadeIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 交错动画延迟（JS 通过 style 设置 --row-index） */
.salary-table tbody tr:nth-child(1)  { animation-delay: 0.02s; }
.salary-table tbody tr:nth-child(2)  { animation-delay: 0.04s; }
.salary-table tbody tr:nth-child(3)  { animation-delay: 0.06s; }
.salary-table tbody tr:nth-child(4)  { animation-delay: 0.08s; }
.salary-table tbody tr:nth-child(5)  { animation-delay: 0.10s; }
.salary-table tbody tr:nth-child(6)  { animation-delay: 0.12s; }
.salary-table tbody tr:nth-child(7)  { animation-delay: 0.14s; }
.salary-table tbody tr:nth-child(8)  { animation-delay: 0.16s; }
.salary-table tbody tr:nth-child(9)  { animation-delay: 0.18s; }
.salary-table tbody tr:nth-child(10) { animation-delay: 0.20s; }
.salary-table tbody tr:nth-child(11) { animation-delay: 0.22s; }
.salary-table tbody tr:nth-child(12) { animation-delay: 0.24s; }
.salary-table tbody tr:nth-child(n+13) { animation-delay: 0.26s; }

/* ---- 年份折叠板 (精仿 Zibll 样式) ---- */
.salary-table tbody tr.year-accordion-row td {
    padding: 0;
    border-bottom: none;
    background: transparent;
}

.salary-year-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    margin: 4px 0;
    padding: 10px 14px;
    border: 1px solid var(--salary-border-light);
    border-left: 4px solid rgba(108, 124, 246, 0.6);
    border-radius: var(--salary-radius-sm);
    background: linear-gradient(145deg, #f7f9fe 0%, #edf2f9 100%);
    color: var(--salary-text);
    text-align: left;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.25, 0.1, 0.25, 1);
    box-shadow: var(--salary-shadow), var(--salary-inner-border);
    min-height: 44px;
    line-height: 1.2;
}

.salary-year-toggle:hover {
    background: linear-gradient(145deg, #fbfcff 0%, #eef3fb 100%);
    border-color: rgba(108, 124, 246, 0.2);
    box-shadow: var(--salary-shadow-md);
    transform: translateY(-1px);
}

.salary-year-toggle[aria-expanded="true"] {
    background: linear-gradient(145deg, #fafcff 0%, #f0f4fb 100%);
    border-color: rgba(108, 124, 246, 0.16);
    box-shadow: var(--salary-shadow);
    margin-bottom: 6px;
}

.salary-year-toggle-main {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.salary-year-toggle-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: linear-gradient(145deg, #f8faff 0%, #e9eef8 100%);
    transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    flex: 0 0 auto;
    box-shadow: inset 1px 1px 0 rgba(255,255,255,0.9), inset -1px -1px 0 rgba(206, 215, 233, 0.45);
}

.salary-year-toggle-icon::before {
    content: '';
    width: 6px;
    height: 6px;
    border-right: 2px solid var(--salary-text-secondary);
    border-bottom: 2px solid var(--salary-text-secondary);
    transform: rotate(-45deg);
    margin-left: -2px;
    transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.salary-year-toggle[aria-expanded="true"] .salary-year-toggle-icon {
    background: linear-gradient(145deg, #7585fb 0%, #6877f3 100%);
}

.salary-year-toggle[aria-expanded="true"] .salary-year-toggle-icon::before {
    transform: rotate(45deg);
    border-color: #fff;
    margin-left: 0;
    margin-top: -2px;
}

.salary-year-toggle-title {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--salary-text);
}

.salary-year-toggle-meta {
    font-size: 12px;
    color: var(--salary-text-muted);
    white-space: nowrap;
    background: rgba(255,255,255,0.58);
    padding: 5px 12px;
    border-radius: 20px;
    box-shadow: inset 1px 1px 0 rgba(255,255,255,0.9), inset -1px -1px 0 rgba(212, 220, 236, 0.34);
}

.salary-table tbody tr.year-group-row.is-collapsed {
    display: none !important;
}

.salary-table tbody tr.year-group-row.is-expanding {
    display: table-row !important;
    pointer-events: none;
    will-change: transform, opacity, max-height;
    transform-origin: top;
}

.salary-table tbody tr.year-group-row.is-collapsing {
    pointer-events: none;
    will-change: transform, opacity, max-height;
    transform-origin: top;
}

/* ---- 年度合计行 ---- */
.salary-table tbody tr.year-summary-row td {
    background: var(--salary-gradient-summary);
    font-weight: 700;
    color: var(--salary-info);
    border-top: 1px solid var(--salary-info-border);
    border-bottom: 1px solid var(--salary-info-border);
    font-size: 13px;
    letter-spacing: 0.02em;
}

/* ---- 总计行 ---- */
.salary-table tbody tr.grand-summary-row td {
    background: var(--salary-gradient-grand);
    font-weight: 700;
    color: var(--salary-amount-total);
    border-top: 1px solid rgba(242, 194, 123, 0.55);
    font-size: 14px;
    letter-spacing: 0.02em;
}

/* ---- 行内编辑 ---- */
.salary-table .editable-cell {
    cursor: pointer;
    position: relative;
}

.salary-table .editable-cell::before {
    content: '';
    position: absolute;
    inset: 4px;
    border: 1px dashed transparent;
    border-radius: 10px;
    transition: border-color 0.2s;
    pointer-events: none;
}

.salary-table .editable-cell:hover::before {
    border-color: var(--salary-primary-glow);
}

.salary-table .editable-cell:hover {
    background: rgba(255, 248, 237, 0.72);
}

.salary-table .editable-cell input,
.salary-table .editable-cell select {
    width: 100%;
    padding: 6px 10px;
    border: 1px solid rgba(108, 124, 246, 0.24);
    border-radius: var(--salary-radius-xs);
    font-size: 13px;
    text-align: center;
    box-sizing: border-box;
    background: linear-gradient(145deg, #fbfcff 0%, #eef3fb 100%);
    color: var(--salary-text);
    transition: box-shadow 0.2s;
    box-shadow: inset 1px 1px 0 rgba(255,255,255,0.92), inset -1px -1px 0 rgba(214, 222, 237, 0.36);
    min-height: 30px;
    height: 30px;
}

.salary-table .editable-cell input:focus,
.salary-table .editable-cell select:focus {
    outline: none;
    box-shadow: 0 0 0 3px var(--salary-primary-glow);
}

/* ---- 金额样式 ---- */
.amount-cell {
    font-family: "JetBrains Mono", "Menlo", "Consolas", "Courier New", monospace;
    font-size: 13px;
    font-weight: 500;
    color: var(--salary-text);
    font-variant-numeric: tabular-nums;
}

.amount-total {
    color: var(--salary-amount-total);
    font-weight: 700;
    font-size: 14px;
}

/* ---- 发放状态（升级徽章） ---- */
.paid-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.02em;
    box-shadow: inset 1px 1px 0 rgba(255,255,255,0.75), inset -1px -1px 0 rgba(220, 227, 240, 0.34);
}

.paid-status::before {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.paid-status.paid {
    background: var(--salary-paid-bg);
    color: var(--salary-paid-text);
    border: 1px solid var(--salary-paid-border);
}

.paid-status.paid::before {
    background: var(--salary-paid-text);
    box-shadow: 0 0 0 4px rgba(103, 201, 166, 0.16);
}

.paid-status.unpaid {
    background: var(--salary-unpaid-bg);
    color: var(--salary-unpaid-text);
    border: 1px solid var(--salary-unpaid-border);
}

.paid-status.unpaid::before {
    background: var(--salary-unpaid-text);
    box-shadow: 0 0 0 4px rgba(242, 154, 170, 0.16);
}

/* ---- 明细图片 ---- */
.salary-detail-actions-inline {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex-wrap: nowrap;
    min-height: 38px;
    height: 38px;
    line-height: 38px;
    margin-bottom: 0 !important;
}

.salary-detail-images {
    display: inline-flex;
    gap: 8px;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    max-width: 220px;
    margin: 0 !important;
    margin-bottom: 0 !important;
    min-height: 38px;
    height: 38px;
    line-height: 38px;
}

.salary-detail-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: var(--salary-radius-xs);
    overflow: hidden;
    background: linear-gradient(145deg, #f9fbff 0%, #edf2f9 100%);
    box-shadow: var(--salary-shadow-xs);
    margin-bottom: 0 !important;
}

.salary-detail-images img {
    display: block;
    width: 34px;
    height: 34px;
    object-fit: cover;
    border-radius: var(--salary-radius-xs);
    border: 1px solid rgba(255,255,255,0.9);
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    margin-bottom: 0 !important;
}

.salary-detail-images img:hover {
    transform: scale(1.12);
    box-shadow: var(--salary-shadow-md);
    border-color: var(--salary-primary);
}

.salary-detail-link {
    cursor: pointer;
}

.salary-no-detail {
    color: var(--salary-text-light);
    font-style: italic;
    font-size: 12px;
}

/* ---- 图片项（含删除按钮） ---- */
.salary-img-item {
    position: relative;
    display: inline-flex;
    width: 34px;
    height: 34px;
    margin: 0;
    margin-bottom: 0 !important;
}

.salary-remove-img {
    position: absolute;
    top: -5px;
    right: -5px;
    background: var(--salary-danger);
    color: #fff;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    line-height: 16px;
    text-align: center;
    font-size: 10px;
    cursor: pointer;
    transition: all 0.2s;
    box-shadow: var(--salary-shadow);
}

.salary-remove-img:hover {
    background: var(--salary-danger-hover);
    transform: scale(1.15);
}

/* ---- 操作列 ---- */
.salary-actions {
    display: inline-flex;
    gap: 8px;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    white-space: nowrap;
    margin-top: 0;
    margin-bottom: 0 !important;
    padding: 4px 8px;
    border-radius: 16px;
    background: rgba(255,255,255,0.34);
    min-height: 38px;
    height: 38px;
    line-height: 38px;
}

.salary-actions-edit {
    margin-top: 0;
    margin-bottom: 0 !important;
}

.salary-actions:empty {
    display: none;
    margin-top: 0;
    margin-bottom: 0 !important;
}

/* ---- 新增行高亮 ---- */
.salary-table tbody tr.new-row td {
    background: linear-gradient(145deg, #fffaf0 0%, #fff4e5 100%);
    border-left: 3px solid var(--salary-warning);
}

.salary-table tbody tr.new-row td:first-child {
    border-left: 3px solid var(--salary-warning);
}

.salary-table tbody tr.new-row.is-new-highlight td {
    animation: salaryNewRowHighlight 1.6s ease;
}

@keyframes salaryNewRowHighlight {
    0% {
        background: linear-gradient(145deg, #fff7da 0%, #ffeab8 100%);
        box-shadow: inset 0 0 0 999px rgba(255, 236, 179, 0.28);
    }
    35% {
        background: linear-gradient(145deg, #fff9e6 0%, #fff0cb 100%);
        box-shadow: inset 0 0 0 999px rgba(255, 241, 204, 0.18);
    }
    100% {
        background: linear-gradient(145deg, #fffaf0 0%, #fff4e5 100%);
        box-shadow: inset 0 0 0 999px rgba(255, 244, 229, 0);
    }
}

/* ---- 骨架屏加载 ---- */
.salary-loading {
    text-align: center;
    padding: 48px 20px;
    color: var(--salary-text-muted);
    font-size: 14px;
}

.salary-skeleton {
    padding: 0 !important;
}

.salary-skeleton-row {
    display: flex;
    gap: 16px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--salary-border-light);
}

.salary-skeleton-cell {
    height: 16px;
    border-radius: 4px;
    background: linear-gradient(90deg, var(--salary-bg-hover) 25%, var(--salary-bg-secondary) 50%, var(--salary-bg-hover) 75%);
    background-size: 200% 100%;
    animation: salaryShimmer 1.5s infinite;
}

@keyframes salaryShimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.salary-skeleton-cell:nth-child(1) { width: 40px; }
.salary-skeleton-cell:nth-child(2) { width: 60px; }
.salary-skeleton-cell:nth-child(3) { width: 50px; }
.salary-skeleton-cell:nth-child(4) { width: 80px; }
.salary-skeleton-cell:nth-child(5) { width: 80px; }
.salary-skeleton-cell:nth-child(6) { width: 80px; }
.salary-skeleton-cell:nth-child(7) { width: 60px; }
.salary-skeleton-cell:nth-child(8) { flex: 1; }

/* ---- 空状态 ---- */
.salary-empty {
    text-align: center;
    padding: 64px 20px;
    color: var(--salary-text-light);
    font-size: 14px;
}

.salary-empty::before {
    content: '';
    display: block;
    width: 48px;
    height: 48px;
    margin: 0 auto 12px;
    background: var(--salary-bg-hover);
    border-radius: 50%;
    opacity: 0.6;
}

/* ---- 提示消息（带图标） ---- */
.salary-toast {
    position: fixed;
    top: 20px;
    right: 20px;
    padding: 14px 24px 14px 20px;
    border-radius: var(--salary-radius-sm);
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    z-index: 100000;
    opacity: 0;
    transform: translateX(100%);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: var(--salary-toast-shadow);
    pointer-events: none;
    display: flex;
    align-items: center;
    gap: 8px;
    max-width: 360px;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.salary-toast.show {
    opacity: 1;
    transform: translateX(0);
}

.salary-toast.success {
    background: linear-gradient(135deg, #10b981, #059669);
}

.salary-toast.error {
    background: linear-gradient(135deg, #ef4444, #dc2626);
}

.salary-toast.info {
    background: linear-gradient(135deg, #3b82f6, #2563eb);
}

/* ---- 删除确认模态框 ---- */
.salary-confirm-modal {
    position: fixed;
    inset: 0;
    z-index: 100001;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(34, 48, 74, 0.24);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.22s ease, visibility 0.22s ease;
}

.salary-confirm-modal.active {
    display: flex;
}

.salary-confirm-modal.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.salary-confirm-dialog {
    position: relative;
    width: min(92vw, 420px);
    padding: 28px 24px 22px;
    border: 1px solid var(--salary-border);
    border-radius: 28px;
    background:
        radial-gradient(circle at top left, rgba(255,255,255,0.96), transparent 42%),
        linear-gradient(145deg, #f8faff 0%, #eef2f9 100%);
    box-shadow: var(--salary-shadow-xl), var(--salary-inner-border);
    color: var(--salary-text);
    text-align: center;
    transform: translateY(10px) scale(0.98);
    transition: transform 0.22s ease;
}

.salary-confirm-modal.is-visible .salary-confirm-dialog {
    transform: translateY(0) scale(1);
}

.salary-confirm-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 34px;
    height: 34px;
    border: none;
    border-radius: 50%;
    background: linear-gradient(145deg, #f8faff 0%, #e9eef8 100%);
    color: var(--salary-text-muted);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    box-shadow: var(--salary-shadow-xs), var(--salary-inner-border);
    transition: all 0.2s ease;
}

.salary-confirm-close:hover {
    color: var(--salary-text);
    transform: translateY(-1px);
    box-shadow: var(--salary-shadow);
}

.salary-confirm-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    margin-bottom: 16px;
    border-radius: 22px;
    background: linear-gradient(145deg, #fff7f8 0%, #fdecef 100%);
    color: var(--salary-danger);
    box-shadow: var(--salary-shadow), var(--salary-inner-border);
}

.salary-confirm-icon svg {
    width: 28px;
    height: 28px;
}

.salary-confirm-title {
    margin: 0 0 10px;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--salary-text);
}

.salary-confirm-text {
    margin: 0;
    font-size: 14px;
    line-height: 1.7;
    color: var(--salary-text-secondary);
}

.salary-confirm-actions {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 22px;
}

.salary-confirm-actions .salary-btn {
    min-width: 112px;
}

body.salary-theme-dark .salary-table-wrapper {
    background:
        radial-gradient(circle at top left, rgba(138, 151, 255, 0.08), transparent 28%),
        radial-gradient(circle at bottom right, rgba(95, 211, 175, 0.07), transparent 34%),
        var(--salary-gradient-panel);
}

body.salary-theme-dark .salary-toolbar select,
body.salary-theme-dark .salary-toolbar input[type="number"],
body.salary-theme-dark .salary-toolbar input[type="text"],
body.salary-theme-dark .salary-btn-secondary,
body.salary-theme-dark .salary-chart-actions,
body.salary-theme-dark .salary-year-toggle,
body.salary-theme-dark .salary-year-toggle-icon,
body.salary-theme-dark .salary-detail-link,
body.salary-theme-dark .salary-confirm-close {
    background: linear-gradient(145deg, #1d2738 0%, #141d2b 100%);
    box-shadow: var(--salary-shadow), var(--salary-inner-border);
}

body.salary-theme-dark .salary-toolbar select:focus,
body.salary-theme-dark .salary-toolbar input:focus,
body.salary-theme-dark .salary-table .editable-cell input,
body.salary-theme-dark .salary-table .editable-cell select {
    background: linear-gradient(145deg, #202c40 0%, #162031 100%);
}

body.salary-theme-dark .salary-chart-area,
body.salary-theme-dark .salary-table,
body.salary-theme-dark .salary-stat-group,
body.salary-theme-dark .salary-stat-card,
body.salary-theme-dark .salary-confirm-dialog {
    background:
        radial-gradient(circle at top left, rgba(138, 151, 255, 0.05), transparent 38%),
        linear-gradient(145deg, #1a2333 0%, #131b29 100%);
}

body.salary-theme-dark .salary-table thead th {
    border-bottom-color: rgba(255, 255, 255, 0.06);
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.04);
}

body.salary-theme-dark .salary-table tbody td {
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

body.salary-theme-dark .salary-table tbody tr:nth-child(even):not(.year-summary-row):not(.grand-summary-row):not(.new-row) td {
    background: rgba(255, 255, 255, 0.015);
}

body.salary-theme-dark .salary-table tbody tr:not(.year-summary-row):not(.grand-summary-row):hover td {
    background: rgba(138, 151, 255, 0.07);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), inset 0 -1px 0 rgba(255, 255, 255, 0.03);
}

body.salary-theme-dark .salary-year-toggle:hover,
body.salary-theme-dark .salary-btn-secondary:hover:not(:disabled) {
    background: linear-gradient(145deg, #212d42 0%, #172132 100%);
}

body.salary-theme-dark .salary-year-toggle[aria-expanded="true"] {
    background: linear-gradient(145deg, #243047 0%, #182233 100%);
}

body.salary-theme-dark .salary-year-toggle-meta,
body.salary-theme-dark .salary-actions {
    background: rgba(255, 255, 255, 0.04);
    box-shadow: inset 1px 1px 0 rgba(255,255,255,0.03), inset -1px -1px 0 rgba(0,0,0,0.18);
}

body.salary-theme-dark .salary-table .editable-cell:hover {
    background: rgba(244, 197, 111, 0.08);
}

body.salary-theme-dark .salary-detail-images img {
    border-color: rgba(255,255,255,0.12);
}

body.salary-theme-dark .salary-stat-cn {
    border-top-color: rgba(255, 255, 255, 0.08);
    color: var(--salary-text-muted);
}

body.salary-theme-dark .salary-confirm-modal {
    background: rgba(2, 6, 23, 0.46);
}

body.salary-theme-dark .salary-confirm-icon {
    background: linear-gradient(145deg, #3a2430 0%, #261922 100%);
}

body.salary-theme-dark .salary-empty::before {
    background: rgba(255, 255, 255, 0.06);
}

/* ---- 统计摘要卡片（工具栏下方） ---- */
.salary-stats {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 20px;
}

.salary-stat-group {
    position: relative;
    padding: 18px;
    border: 1px solid var(--salary-border);
    border-radius: var(--salary-radius-lg);
    background: var(--salary-gradient-panel);
    box-shadow: var(--salary-shadow-md), var(--salary-inner-border);
}

.salary-stat-group-current {
    background:
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.96), transparent 32%),
        radial-gradient(circle at bottom left, rgba(108, 124, 246, 0.08), transparent 30%),
        var(--salary-gradient-panel);
}

.salary-stat-group-previous {
    background:
        linear-gradient(145deg, rgba(250, 245, 255, 0.96) 0%, rgba(240, 239, 251, 0.98) 100%),
        var(--salary-gradient-panel);
    border-color: rgba(222, 214, 241, 0.72);
}

/* ---- 分组标题美化 ---- */
.salary-stat-group-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    padding-left: 4px;
    font-size: 15px;
    font-weight: 800;
    color: var(--salary-text);
    letter-spacing: 0.02em;
}

.salary-stat-group-title::after {
    content: 'CURRENT';
    font-size: 10px;
    font-weight: 900;
    padding: 4px 10px;
    background: rgba(108, 124, 246, 0.14);
    color: var(--salary-primary);
    border-radius: 999px;
    letter-spacing: 0.05em;
    box-shadow: inset 1px 1px 0 rgba(255,255,255,0.88), inset -1px -1px 0 rgba(210, 219, 236, 0.32);
}

.salary-stat-group-previous .salary-stat-group-title::after {
    content: 'COMPARISON';
    background: rgba(181, 155, 224, 0.16);
    color: #8f77c8;
    opacity: 1;
}

.salary-stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 14px;
}

.salary-stat-card {
    position: relative;
    overflow: hidden;
    background:
        var(--salary-gradient-card-glow),
        var(--salary-gradient-stat),
        var(--salary-bg);
    border: 1px solid var(--salary-border);
    border-radius: var(--salary-radius-lg);
    padding: 20px 20px 18px;
    box-shadow: var(--salary-shadow-md), var(--salary-inner-border);
    transition: all 0.25s ease;
}

.salary-stat-card:hover {
    box-shadow: var(--salary-shadow-lg);
    transform: translateY(-2px);
}

.salary-stat-card::before {
    content: '';
    position: absolute;
    inset: 10px;
    border-radius: calc(var(--salary-radius-lg) - 8px);
    border: 1px solid rgba(255,255,255,0.45);
    pointer-events: none;
}

.salary-stat-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 700;
    color: var(--salary-text-muted);
    margin-bottom: 10px;
    letter-spacing: 0.04em;
    padding-left: 0;
    text-transform: uppercase;
}

.salary-stat-value {
    font-size: 26px;
    font-weight: 800;
    font-family: "JetBrains Mono", "Menlo", "Consolas", monospace;
    font-variant-numeric: tabular-nums;
    padding-left: 0;
    line-height: 1;
    letter-spacing: -0.03em;
}

.salary-stat-value.primary { color: var(--salary-primary); text-shadow: 0 10px 22px rgba(108, 124, 246, 0.12); }
.salary-stat-value.success { color: var(--salary-success); text-shadow: 0 10px 22px rgba(103, 201, 166, 0.12); }
.salary-stat-value.danger  { color: var(--salary-amount-total); text-shadow: 0 10px 22px rgba(227, 139, 115, 0.12); }
.salary-stat-value.info    { color: var(--salary-info); text-shadow: 0 10px 22px rgba(138, 181, 255, 0.12); }

.salary-stat-cn {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px dashed var(--salary-text-light);
    font-size: 11px;
    font-weight: 500;
    color: var(--salary-text-muted);
    letter-spacing: 0.04em;
    line-height: 1.5;
    word-break: break-all;
}

/* 移动端年月合并显示（桌面端隐藏伪元素） */
.salary-table tbody td.salary-mobile-year::after {
    display: none;
    content: '· ' attr(data-month);
}

/* ---- 防止主题隐藏列（仅桌面端生效） ---- */
@media screen and (min-width: 641px) {
    .salary-table th,
    .salary-table td {
        display: table-cell !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* ---- 响应式：平板 (≤768px) ---- */
@media screen and (max-width: 768px) {
    .salary-table-wrapper {
        padding: 14px;
        border-radius: var(--salary-radius);
    }

    .salary-toolbar {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
        padding: 12px;
    }

    .salary-toolbar label {
        display: none;
    }

    .salary-toolbar #salary-filter-year {
        flex: 0 0 100px;
        width: auto !important;
        min-width: 0;
    }

    .salary-toolbar input[type="text"] {
        flex: 1;
        width: auto !important;
        min-width: 0;
    }

    .salary-toolbar .salary-btn {
        flex: 1 1 auto;
        min-width: 80px;
    }

    .salary-chart-header {
        flex-direction: column;
        align-items: stretch;
    }

    .salary-chart-actions {
        align-self: flex-start;
    }

    .salary-table {
        font-size: 12px;
    }

    .salary-table thead th,
    .salary-table tbody td {
        padding: 8px 10px;
    }

    .salary-stats {
        gap: 12px;
    }

    .salary-stat-group {
        padding: 16px;
    }

    .salary-stat-group-title {
        font-size: 14px;
    }

    .salary-stat-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .salary-stat-card {
        padding: 16px 14px;
    }

    .salary-stat-value {
        font-size: 20px;
    }

    .salary-stat-cn {
        font-size: 10px;
        margin-top: 4px;
        padding-top: 4px;
    }

    .salary-year-toggle {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        padding: 14px 16px;
    }

    .salary-year-toggle-meta {
        white-space: normal;
        line-height: 1.5;
    }

    .salary-confirm-dialog {
        width: min(92vw, 400px);
        padding: 24px 20px 18px;
    }

}

/* ---- 响应式优化 (640px) 现代化卡片网格 ---- */
@media screen and (max-width: 640px) {
    .salary-table-wrapper {
        padding: 8px;
        overflow-x: hidden;
    }

    .salary-toolbar {
        padding: 10px;
        gap: 8px;
        margin-bottom: 14px;
    }

    .salary-toolbar .salary-btn {
        min-height: 40px;
        padding: 8px 12px;
        font-size: 12px;
        flex: 1 1 auto;
        min-width: 60px;
    }

    /* ========== 表格改为卡片流 ========== */
    .salary-table {
        display: block !important;
        min-width: 100% !important;
        width: 100% !important;
        background: transparent;
        box-shadow: none;
        border-radius: 0;
    }

    .salary-table thead {
        display: none !important;
    }

    .salary-table tbody {
        display: block !important;
        width: 100% !important;
    }

    .salary-table tbody tr {
        display: block !important;
        width: 100% !important;
        max-width: 100%;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }

    /* 所有 td 默认转为 block（消除 table-cell 残留） */
    .salary-table td {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* ---- 数据行：大卡片网格 ---- */
    .salary-table tbody tr.year-group-row {
        display: flex !important;
        flex-wrap: wrap;
        width: 100% !important;
        box-sizing: border-box;
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 14px;
        padding: 0;
        border: 1px solid var(--salary-border);
        border-radius: 20px;
        background: var(--salary-bg);
        box-shadow: var(--salary-shadow-lg);
        overflow: hidden;
        transform: none !important;
        animation: none !important;
    }

    /* 数据行 td 重置为 flex 子项 */
    .salary-table tbody tr.year-group-row td {
        display: flex !important;
        width: auto !important;
        box-sizing: border-box;
    }

    .salary-table tbody tr.year-group-row.is-expanding,
    .salary-table tbody tr.year-group-row.is-collapsing {
        display: flex !important;
        transform: none !important;
        will-change: max-height, opacity, margin-bottom;
    }

    .salary-table tbody tr.year-group-row:hover {
        box-shadow: var(--salary-shadow-xl);
    }

    /* ID 列隐藏 */
    .salary-table tbody tr.year-group-row td:nth-child(1) {
        display: none !important;
    }

    /* 月份列：与年份列并排显示 */
    .salary-table tbody tr.year-group-row td:nth-child(3) {
        flex: 1 1 auto;
        width: auto;
        order: 1;
        padding: 14px 14px 8px 4px;
        border-bottom: none;
        display: flex !important;
        align-items: baseline;
        gap: 6px;
        font-size: 15px;
        font-weight: 500;
        color: var(--salary-text-muted);
    }

    /* ===== 卡片头部：年月大标题 ===== */
    .salary-table tbody tr.year-group-row td:nth-child(2) {
        flex: 0 0 auto;
        width: auto;
        order: 1;
        padding: 14px 4px 8px 14px;
        border-bottom: none;
        display: flex !important;
        align-items: baseline;
        gap: 6px;
        font-size: 18px;
        font-weight: 800;
        color: var(--salary-text);
        letter-spacing: -0.01em;
    }

    .salary-table tbody tr.year-group-row td:nth-child(2)::before,
    .salary-table tbody tr.year-group-row td:nth-child(3)::before {
        display: none;
    }

    .salary-table tbody td.salary-mobile-year::after {
        display: none !important;
    }

    /* ===== 状态胶囊徽章（右上角） ===== */
    .salary-table tbody tr.year-group-row td:nth-child(7) {
        flex: 0 0 auto;
        width: auto;
        order: 2;
        padding: 12px 14px 8px;
        border-bottom: none;
        display: flex !important;
        align-items: center;
        justify-content: flex-end;
    }

    .salary-table tbody tr.year-group-row td:nth-child(7)::before {
        display: none;
    }

    .salary-table tbody tr.year-group-row td:nth-child(7) .paid-status {
        padding: 4px 14px;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.04em;
    }

    .salary-table tbody tr.year-group-row td:nth-child(7) .paid-status::before {
        width: 7px;
        height: 7px;
    }

    /* ===== 金额区：公司金额 & 派费直付 各50%并排 ===== */
    .salary-table tbody tr.year-group-row td:nth-child(4),
    .salary-table tbody tr.year-group-row td:nth-child(5) {
        flex: 1 1 50%;
        width: 50%;
        display: flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 12px 4px;
        border-bottom: none;
        border-top: 1px solid var(--salary-border-light);
        gap: 6px;
        box-sizing: border-box;
        font-size: 17px;
        font-weight: 700;
        font-family: "JetBrains Mono", "Menlo", "Consolas", monospace;
        font-variant-numeric: tabular-nums;
        color: var(--salary-text);
    }

    .salary-table tbody tr.year-group-row td:nth-child(4) {
        order: 3;
        border-right: 1px solid var(--salary-border-light);
    }

    .salary-table tbody tr.year-group-row td:nth-child(5) {
        order: 4;
    }

    .salary-table tbody tr.year-group-row td:nth-child(4)::before,
    .salary-table tbody tr.year-group-row td:nth-child(5)::before {
        content: attr(data-label);
        flex: none;
        text-align: center;
        font-size: 10px;
        font-weight: 700;
        color: var(--salary-text-muted);
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

    /* ===== 合计金额：独占一行居中，在公司金额和派费直付下方 ===== */
    .salary-table tbody tr.year-group-row td:nth-child(6) {
        flex: 1 1 100%;
        width: 100%;
        display: flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 8px 4px;
        border-bottom: none;
        border-top: 1px solid var(--salary-border-light);
        gap: 4px;
        box-sizing: border-box;
        order: 5;
        color: var(--salary-amount-total);
        font-size: 20px;
        font-weight: 800;
        font-family: "JetBrains Mono", "Menlo", "Consolas", monospace;
        font-variant-numeric: tabular-nums;
    }

    .salary-table tbody tr.year-group-row td:nth-child(6)::before {
        content: attr(data-label);
        flex: none;
        text-align: center;
        font-size: 10px;
        font-weight: 700;
        color: var(--salary-text-muted);
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

    /* ===== 底部明细(左) / 操作(右) ===== */
    .salary-table tbody tr.year-group-row td:nth-child(8) {
        width: 100% !important;
        order: 6;
        padding: 10px 14px 12px;
        border-bottom: none;
        border-top: 1px solid var(--salary-border-light);
        background: var(--salary-bg-secondary);
        border-radius: 0 0 20px 20px;
        display: flex !important;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8)::before {
        display: none;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8) .salary-detail-actions-inline {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        gap: 10px;
        min-height: 44px;
        height: 44px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8) .salary-detail-images {
        justify-content: flex-start;
        max-width: none;
        gap: 8px;
        flex-shrink: 1;
        min-width: 0;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8) .salary-detail-images {
        min-height: 44px;
        height: 44px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8) .salary-detail-images img {
        width: 40px;
        height: 40px;
        border-radius: 10px;
        border-width: 2px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8) .salary-detail-link {
        width: 40px;
        height: 40px;
        border-radius: 10px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8) .salary-actions {
        min-height: 44px;
        height: 44px;
        padding: 4px 10px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8) .salary-no-detail {
        color: var(--salary-text-muted);
        font-size: 12px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8) .salary-actions {
        flex-shrink: 0;
        justify-content: flex-end;
        gap: 8px;
        margin-left: auto;
    }

    /* ---- 折叠板按钮 ---- */
    .salary-table tbody tr.year-accordion-row {
        display: block !important;
        width: 100% !important;
        margin-bottom: 10px;
        border-radius: 16px;
        overflow: hidden;
        background: var(--salary-gradient-panel);
        box-shadow: var(--salary-shadow-md);
    }

    .salary-table tbody tr.year-accordion-row td {
        display: block !important;
        width: 100%;
        padding: 0;
        border-bottom: none;
        overflow-wrap: normal;
        word-break: keep-all;
    }

    .salary-year-toggle {
        display: flex;
        width: 100%;
        padding: 12px 14px;
        border-radius: 16px;
        margin: 0;
        box-sizing: border-box;
        justify-content: space-between;
        align-items: center;
        gap: 8px;
        min-height: 48px;
        line-height: 1.2;
    }

    .salary-year-toggle-title,
    .salary-year-toggle-meta {
        overflow-wrap: normal;
        word-break: keep-all;
    }

    /* ---- 年度合计 / 总计行（简化统计卡片） ---- */
    .salary-table tbody tr.year-summary-row,
    .salary-table tbody tr.grand-summary-row {
        margin-bottom: 14px;
        border-radius: 16px;
        position: relative;
        overflow: hidden;
        box-shadow: var(--salary-shadow-md);
        display: flex !important;
        flex-wrap: wrap;
        padding: 0;
        border: 1px solid var(--salary-border);
    }

    .salary-table tbody tr.year-summary-row::before,
    .salary-table tbody tr.grand-summary-row::before {
        content: attr(data-mobile-title);
        display: block;
        width: 100%;
        padding: 12px 16px 8px;
        font-size: 13px;
        font-weight: 700;
        text-align: left;
        background: var(--salary-gradient-summary);
        border-bottom: 1px solid var(--salary-info-border);
        position: static;
    }

    .salary-table tbody tr.grand-summary-row::before {
        background: var(--salary-gradient-grand);
        border-bottom-color: var(--salary-warning);
    }

    .salary-table tbody tr.year-summary-row td,
    .salary-table tbody tr.grand-summary-row td {
        display: flex !important;
        width: auto !important;
        align-items: center;
        justify-content: space-between;
        padding: 10px 16px;
        border-bottom: 1px solid var(--salary-border-light);
        font-size: 13px;
        background: transparent;
        border-top: 0;
    }

    /* 隐藏不需要的列 */
    .salary-table tbody tr.year-summary-row td:nth-child(1),
    .salary-table tbody tr.year-summary-row td:nth-child(2),
    .salary-table tbody tr.year-summary-row td:nth-child(3),
    .salary-table tbody tr.year-summary-row td:nth-child(7),
    .salary-table tbody tr.year-summary-row td:nth-child(8),
    .salary-table tbody tr.grand-summary-row td:nth-child(1),
    .salary-table tbody tr.grand-summary-row td:nth-child(2),
    .salary-table tbody tr.grand-summary-row td:nth-child(3),
    .salary-table tbody tr.grand-summary-row td:nth-child(7),
    .salary-table tbody tr.grand-summary-row td:nth-child(8) {
        display: none !important;
    }

    .salary-table tbody tr.year-summary-row td:last-child,
    .salary-table tbody tr.grand-summary-row td:last-child {
        border-bottom: none;
    }

    /* ---- 新增行 ---- */
    .salary-table tbody tr.new-row {
        display: flex !important;
        flex-wrap: wrap;
        margin-bottom: 14px;
        border-radius: 20px;
        padding: 0;
        overflow: hidden;
    }

    .salary-table tbody tr.new-row td {
        display: flex !important;
        width: auto !important;
        border-bottom: 1px solid var(--salary-border-light);
        padding: 10px 16px;
        box-sizing: border-box;
    }

    .salary-table tbody tr.new-row td:nth-child(1) {
        display: none !important;
    }

    .salary-table tbody tr.new-row td:nth-child(2) {
        width: 50% !important;
        order: 1;
    }

    .salary-table tbody tr.new-row td:nth-child(3) {
        width: 50% !important;
        order: 2;
    }

    .salary-table tbody tr.new-row td:nth-child(4),
    .salary-table tbody tr.new-row td:nth-child(5) {
        width: 50% !important;
        order: 3;
    }

    .salary-table tbody tr.new-row td:nth-child(6) {
        width: 100% !important;
        order: 5;
    }

    .salary-table tbody tr.new-row td:nth-child(7) {
        width: 100% !important;
        order: 4;
    }

    .salary-table tbody tr.new-row td:nth-child(8) {
        width: 100% !important;
        order: 6;
        border-radius: 0 0 20px 20px;
        background: var(--salary-bg-secondary);
    }

    /* ---- 摘要卡片 ---- */
    .salary-stats {
        gap: 10px;
    }

    .salary-stat-group {
        padding: 12px;
        border-radius: var(--salary-radius);
    }

    .salary-stat-group-title {
        margin-bottom: 8px;
        font-size: 13px;
    }

    .salary-stat-grid {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .salary-stat-card {
        padding: 14px 12px;
        border-radius: var(--salary-radius-sm);
    }

    .salary-stat-card::before {
        inset: 8px;
    }

    .salary-stat-value {
        font-size: 18px;
    }

    .salary-stat-cn {
        font-size: 10px;
        margin-top: 3px;
        padding-top: 3px;
    }

    /* ---- 确认模态框 ---- */
    .salary-confirm-modal {
        padding: 16px;
    }

    .salary-confirm-dialog {
        width: 92vw;
        padding: 20px 16px 16px;
    }

    .salary-confirm-title {
        font-size: 17px;
    }

    .salary-confirm-text {
        font-size: 13px;
    }

    .salary-confirm-actions .salary-btn {
        min-width: 90px;
    }

    /* ---- Toast ---- */
    .salary-toast {
        left: 10px;
        right: 10px;
        max-width: none;
    }
}

/* ---- 响应式：小屏手机 (≤480px) ---- */
@media screen and (max-width: 480px) {
    .salary-table-wrapper {
        padding: 6px;
    }

    .salary-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 6px;
        padding: 10px;
    }

    .salary-toolbar #salary-filter-year {
        width: 100% !important;
        flex: 1 1 auto;
        min-width: 0;
    }

    .salary-toolbar input[type="text"] {
        width: 100% !important;
        flex: 1 1 auto;
    }

    .salary-toolbar .salary-btn {
        width: 100%;
        flex: 1 1 auto;
    }

    /* ---- 数据卡片缩小 ---- */
    .salary-table tbody tr.year-group-row {
        margin-bottom: 12px;
        border-radius: 16px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(2) {
        padding: 14px 4px 8px 14px;
        font-size: 16px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(3) {
        padding: 14px 14px 8px 4px;
        font-size: 13px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(7) {
        padding: 12px 14px 8px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(7) .paid-status {
        padding: 3px 10px;
        font-size: 10px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(4),
    .salary-table tbody tr.year-group-row td:nth-child(5),
    .salary-table tbody tr.year-group-row td:nth-child(6) {
        padding: 10px 2px;
        gap: 4px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(4)::before,
    .salary-table tbody tr.year-group-row td:nth-child(5)::before,
    .salary-table tbody tr.year-group-row td:nth-child(6)::before {
        font-size: 9px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(4),
    .salary-table tbody tr.year-group-row td:nth-child(5) {
        font-size: 15px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(6) {
        font-size: 17px;
        padding: 8px 2px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8) {
        padding: 10px 14px 14px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8) .salary-detail-actions-inline {
        min-height: 42px;
        height: 42px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8) .salary-detail-images {
        min-height: 42px;
        height: 42px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8) .salary-detail-images img {
        width: 36px;
        height: 36px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8) .salary-detail-link {
        width: 36px;
        height: 36px;
    }

    .salary-table tbody tr.year-group-row td:nth-child(8) .salary-actions {
        min-height: 42px;
        height: 42px;
        padding: 4px 8px;
    }

    /* ---- 新增行 ---- */
    .salary-table tbody tr.new-row {
        border-radius: 16px;
        margin-bottom: 12px;
    }

    .salary-table tbody tr.new-row td {
        padding: 8px 12px;
    }

    .salary-table tbody tr.new-row td:nth-child(8) {
        border-radius: 0 0 16px 16px;
    }

    /* ---- 年度合计 / 总计 ---- */
    .salary-table tbody tr.year-summary-row,
    .salary-table tbody tr.grand-summary-row {
        border-radius: 14px;
        margin-bottom: 12px;
    }

    .salary-table tbody tr.year-summary-row::before,
    .salary-table tbody tr.grand-summary-row::before {
        padding: 10px 14px 6px;
        font-size: 12px;
    }

    .salary-table tbody tr.year-summary-row td,
    .salary-table tbody tr.grand-summary-row td {
        padding: 8px 14px;
        font-size: 12px;
    }

    /* ---- 统计卡片 ---- */
    .salary-stat-group-title::after {
        display: none;
    }

    .salary-stat-grid {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .salary-stat-card {
        padding: 12px 10px;
        border-radius: var(--salary-radius-xs);
    }

    .salary-stat-value {
        font-size: 16px;
    }

    .salary-stat-cn {
        font-size: 9px;
    }

    /* ---- 折叠板 ---- */
    .salary-year-toggle {
        padding: 10px 12px;
        gap: 8px;
        min-height: 44px;
    }

    .salary-year-toggle-title {
        font-size: 14px;
    }

    .salary-year-toggle-meta {
        font-size: 11px;
    }

    /* ---- 确认模态框 ---- */
    .salary-confirm-dialog {
        width: 94vw;
        padding: 18px 14px 14px;
        border-radius: 22px;
    }

    .salary-confirm-title {
        font-size: 16px;
    }

    .salary-confirm-actions {
        flex-direction: column;
        gap: 8px;
    }

    .salary-confirm-actions .salary-btn {
        width: 100%;
    }
}

/* ---- 安全区域适配 (iPhone 刘海屏) ---- */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
    .salary-table-wrapper {
        padding-left: max(28px, env(safe-area-inset-left));
        padding-right: max(28px, env(safe-area-inset-right));
    }

    .salary-toast {
        top: max(20px, env(safe-area-inset-top));
        right: max(20px, env(safe-area-inset-right));
    }

    @media screen and (max-width: 640px) {
        .salary-table-wrapper {
            padding-left: max(10px, env(safe-area-inset-left));
            padding-right: max(10px, env(safe-area-inset-right));
        }
    }
}

/* ---- 移动端触控优化 ---- */
@media (hover: none) and (pointer: coarse) {
    .salary-table .editable-cell {
        cursor: default;
    }

    .salary-table .editable-cell:hover {
        background: transparent;
    }

    .salary-table .editable-cell:active {
        background: rgba(255, 248, 237, 0.72);
    }

    .salary-btn {
        -webkit-tap-highlight-color: transparent;
    }
}

/* ---- 滚动条美化 ---- */
.salary-table-wrapper::-webkit-scrollbar {
    height: 6px;
}

.salary-table-wrapper::-webkit-scrollbar-track {
    background: var(--salary-bg-secondary);
    border-radius: 3px;
}

.salary-table-wrapper::-webkit-scrollbar-thumb {
    background: var(--salary-border);
    border-radius: 3px;
}

.salary-table-wrapper::-webkit-scrollbar-thumb:hover {
    background: var(--salary-text-muted);
}