/* 知音 · 艺学堂AI经营系统 - 全局样式 */
/* 版本：v1.0 | 日期：2026-06-04 */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --primary: #F18D24;
    --primary-dark: #d97a1f;
    --primary-light: #fce6c8;
    --secondary: #149EBB;
    --secondary-dark: #0f7d9a;
    --secondary-light: #e0f7fb;
    --success: #28a745;
    --warning: #ffc107;
    --danger: #dc3545;
    --light: #f8f9fa;
    --dark: #343a40;
    --gray: #6c757d;
    --gray-light: #e9ecef;
    --white: #ffffff;
    --sidebar-width: 250px;
    --navbar-height: 60px;
    --font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
    /* 阴影系统 */
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
    --shadow-md: 0 4px 12px rgba(0,0,0,0.08);
    --shadow-lg: 0 8px 24px rgba(0,0,0,0.12);
    --shadow-xl: 0 20px 60px rgba(0,0,0,0.3);
    /* 圆角系统 */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;
    --radius-xl: 20px;
    /* 过渡系统 */
    --transition-fast: 0.15s ease;
    --transition-normal: 0.25s ease;
    --transition-slow: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

body {
    font-family: var(--font-family);
    background-color: #f5f6fa;
    color: var(--dark);
    line-height: 1.6;
}

/* 导航栏 */
.navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--navbar-height);
    background: linear-gradient(135deg, var(--primary), var(--primary-dark));
    color: var(--white);
    display: flex;
    align-items: center;
    padding: 0 20px;
    z-index: 1000;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.nav-brand {
    display: flex;
    align-items: center;
    font-size: 1.5rem;
    font-weight: bold;
    margin-right: 40px;
}

.nav-brand i {
    margin-right: 10px;
    font-size: 1.8rem;
}

.nav-menu {
    display: flex;
    flex: 1;
    gap: 5px;
}

.nav-item {
    color: rgba(255,255,255,0.8);
    text-decoration: none;
    padding: 10px 15px;
    border-radius: 6px;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    gap: 8px;
}

.nav-item:hover {
    color: var(--white);
    background: rgba(255,255,255,0.1);
}

.nav-item.active {
    color: var(--white);
    background: rgba(255,255,255,0.2);
    font-weight: 500;
}

.nav-user {
    display: flex;
    align-items: center;
    gap: 15px;
}

.btn {
    padding: 8px 16px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.btn-primary {
    background: var(--primary);
    color: var(--white);
}

.btn-primary:hover {
    background: var(--primary-dark);
}

.btn-secondary {
    background: var(--secondary);
    color: var(--white);
}

.btn-secondary:hover {
    background: var(--secondary-dark);
}

.btn-outline {
    background: transparent;
    color: var(--white);
    border: 1px solid rgba(255,255,255,0.5);
}

.btn-outline:hover {
    background: rgba(255,255,255,0.1);
}

.btn-sm {
    padding: 5px 10px;
    font-size: 12px;
}

/* 主容器 */
.main-container {
    display: flex;
    margin-top: var(--navbar-height);
    height: calc(100vh - var(--navbar-height));
}

/* 侧边栏 */
.sidebar {
    width: var(--sidebar-width);
    background: var(--white);
    border-right: 1px solid var(--gray-light);
    overflow-y: auto;
    padding: 20px;
}

.sidebar-header {
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 2px solid var(--primary);
}

.sidebar-header h3 {
    color: var(--primary);
    font-size: 1.2rem;
}

.sidebar-content {
    /* 动态内容 */
}

/* 主内容区域 */
.content {
    flex: 1;
    padding: 30px;
    overflow-y: auto;
}

.page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding-bottom: 15px;
    border-bottom: 2px solid var(--gray-light);
}

.page-header h1 {
    color: var(--dark);
    font-size: 1.8rem;
}

.page-actions {
    display: flex;
    gap: 10px;
}

.page-content {
    /* 动态内容 */
}

/* 加载提示 */
.loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255,255,255,0.9);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loading-spinner {
    text-align: center;
    color: var(--primary);
}

.loading-spinner i {
    font-size: 3rem;
    margin-bottom: 15px;
}

/* 消息提示 */
.toast-container {
    position: fixed;
    top: 80px;
    right: 20px;
    z-index: 10000;
}

.toast {
    background: var(--white);
    border-radius: 8px;
    padding: 15px 20px;
    margin-bottom: 10px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 300px;
    animation: slideIn 0.3s ease;
}

.toast.success {
    border-left: 4px solid var(--success);
}

.toast.error {
    border-left: 4px solid var(--danger);
}

.toast.warning {
    border-left: 4px solid var(--warning);
}

.toast i {
    font-size: 1.2rem;
}

.toast.success i {
    color: var(--success);
}

.toast.error i {
    color: var(--danger);
}

.toast.warning i {
    color: var(--warning);
}

@keyframes slideIn {
    from {
        transform: translateX(400px);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* 响应式设计 */
@media (max-width: 768px) {
    .sidebar {
        width: 100%;
        height: auto;
        border-right: none;
        border-bottom: 1px solid var(--gray-light);
    }

    .main-container {
        flex-direction: column;
    }

    .nav-menu {
        overflow-x: auto;
    }

    .page-header {
        flex-direction: column;
        gap: 15px;
        align-items: flex-start;
    }
}

/* 通用工具类 */
.text-primary { color: var(--primary); }
.text-secondary { color: var(--secondary); }
.text-success { color: var(--success); }
.text-warning { color: var(--warning); }
.text-danger { color: var(--danger); }
.text-gray { color: var(--gray); }

.bg-primary { background-color: var(--primary); }
.bg-secondary { background-color: var(--secondary); }
.bg-success { background-color: var(--success); }
.bg-warning { background-color: var(--warning); }
.bg-danger { background-color: var(--danger); }

.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 1.5rem; }
.mb-1 { margin-bottom: 0.5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }

.pt-1 { padding-top: 0.5rem; }
.pt-2 { padding-top: 1rem; }
.pt-3 { padding-top: 1.5rem; }
.pb-1 { padding-bottom: 0.5rem; }
.pb-2 { padding-bottom: 1rem; }
.pb-3 { padding-bottom: 1.5rem; }

.d-flex { display: flex; }
.align-items-center { align-items: center; }
.justify-content-between { justify-content: space-between; }
.gap-1 { gap: 0.5rem; }
.gap-2 { gap: 1rem; }
.gap-3 { gap: 1.5rem; }

/* ==================== 数据表格 ==================== */
.table-container {
    overflow-x: auto;
    background: var(--white);
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.data-table th {
    background: #f8f9fa;
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    color: var(--gray);
    border-bottom: 2px solid var(--gray-light);
    white-space: nowrap;
}

.data-table td {
    padding: 12px 16px;
    border-bottom: 1px solid var(--gray-light);
    color: var(--dark);
}

.data-table tr:hover {
    background: #fef9f0;
}

.data-table tr:last-child td {
    border-bottom: none;
}

/* 状态徽章 */
.status-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
}

.status-new { background: #e0f7fb; color: #0f7d9a; }
.status-following { background: #fff3cd; color: #856404; }
.status-trial { background: #cce5ff; color: #004085; }
.status-trialed { background: #d4edda; color: #155724; }
.status-deal { background: #d4edda; color: #28a745; font-weight: 600; }
.status-closed { background: #f8d7da; color: #721c24; }
.status-pool { background: #e2e3e5; color: #383d41; }
.status-default { background: #e2e3e5; color: #6c757d; }

/* 看板网格 */
.dashboard-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.dashboard-card {
    background: var(--white);
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.dashboard-card h3 {
    font-size: 16px;
    color: var(--dark);
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--gray-light);
}

/* 图表条形 */
.chart-bar-container {
    display: flex;
    align-items: center;
    gap: 10px;
}

.chart-label {
    width: 80px;
    text-align: right;
    font-size: 13px;
    color: var(--gray);
}

.chart-bar-bg {
    flex: 1;
    height: 20px;
    background: var(--gray-light);
    border-radius: 10px;
    overflow: hidden;
}

.chart-bar {
    height: 100%;
    border-radius: 10px;
    transition: width 0.5s ease;
}

.chart-value {
    width: 80px;
    font-size: 12px;
    color: var(--gray);
}

/* 统计卡片 */
.stats-card {
    background: linear-gradient(135deg, var(--primary), var(--primary-dark));
    color: var(--white);
    border-radius: 8px;
    padding: 15px;
    text-align: center;
}

.stats-card h4 {
    font-size: 13px;
    opacity: 0.9;
    margin-bottom: 5px;
}

.stats-number {
    font-size: 2rem;
    font-weight: 700;
}

.stats-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--gray-light);
    font-size: 14px;
}

.stats-badge {
    background: var(--secondary-light);
    color: var(--secondary-dark);
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
}

/* 筛选区 */
.filter-section h4 {
    font-size: 14px;
    color: var(--primary);
    margin-bottom: 12px;
}

.form-group {
    margin-bottom: 12px;
}

.form-group label {
    display: block;
    font-size: 13px;
    color: var(--gray);
    margin-bottom: 4px;
}

.form-group select,
.form-group input {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid var(--gray-light);
    border-radius: 6px;
    font-size: 13px;
    font-family: var(--font-family);
    outline: none;
}

.form-group select:focus,
.form-group input:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 2px rgba(241, 141, 36, 0.15);
}

.btn-block {
    width: 100%;
    justify-content: center;
}

.btn-danger {
    background: var(--danger);
    color: var(--white);
}

.btn-danger:hover {
    background: #c82333;
}

/* 空状态 */
.empty-state {
    text-align: center;
    padding: 60px 20px;
    color: var(--gray);
}

.empty-state i {
    font-size: 3rem;
    margin-bottom: 15px;
    opacity: 0.3;
}

.empty-state p {
    font-size: 16px;
}

/* 分页 */
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
    padding: 15px 0;
}

.pagination-info {
    font-size: 14px;
    color: var(--gray);
}

/* 快速操作按钮 */
.quick-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* 列表容器 */
.list-container {
    max-height: 300px;
    overflow-y: auto;
}

/* 概览统计卡 */
.overview-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    margin-bottom: 20px;
}

.overview-stat {
    background: var(--white);
    border-radius: 8px;
    padding: 15px;
    text-align: center;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

.overview-stat .stat-value {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--primary);
}

.overview-stat .stat-label {
    font-size: 13px;
    color: var(--gray);
    margin-top: 4px;
}

/* ==================== 弹窗 ==================== */
/* ===== 唯一定义：弹窗遮罩（不可重复覆盖！）===== */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    animation: fadeIn 0.2s ease;
}

.modal-container {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--white);
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
    z-index: 5001;
    min-width: 480px;
    max-width: 90vw;
    max-height: 85vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    animation: modalIn 0.25s ease;
}

.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 24px;
    border-bottom: 1px solid var(--gray-light);
    background: #fafbfc;
}

.modal-header h3 {
    font-size: 16px;
    color: var(--dark);
    font-weight: 600;
}

.modal-close {
    background: none;
    border: none;
    font-size: 18px;
    color: var(--gray);
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: all 0.2s;
}

.modal-close:hover {
    background: var(--gray-light);
    color: var(--dark);
}

.modal-body {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes modalIn {
    from { opacity: 0; transform: translate(-50%, -45%) scale(0.95); }
    to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

/* ==================== 线索 Tab 栏 ==================== */
.clues-tab-bar {
    display: flex;
    gap: 4px;
    margin-bottom: 16px;
    padding: 4px;
    background: var(--bg-secondary, #f5f5f5);
    border-radius: 8px;
    width: fit-content;
}
.clues-tab {
    padding: 8px 18px;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: var(--text-secondary, #666);
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s;
    white-space: nowrap;
}
.clues-tab:hover {
    color: var(--primary, #F18D24);
    background: rgba(241, 141, 36, 0.08);
}
.clues-tab.active {
    background: #fff;
    color: var(--primary, #F18D24);
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

/* ==================== 线索卡片 ==================== */
.clue-cards {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.clue-card {
    background: var(--white);
    border-radius: 10px;
    padding: 16px 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    display: flex;
    align-items: flex-start;
    gap: 16px;
    transition: all 0.2s ease;
    position: relative;
    border: 1px solid transparent;
}

.clue-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
    border-color: var(--primary-light);
}

/* 紧急度颜色条 - 卡片左侧 */
.clue-card-urgency {
    width: 5px;
    min-height: 100px;
    border-radius: 3px;
    flex-shrink: 0;
    align-self: stretch;
}

.urgency-new { background: var(--primary); }
.urgency-urgent { background: var(--danger); }
.urgency-warning { background: var(--warning); }
.urgency-normal { background: var(--secondary); }
.urgency-deal { background: var(--success); }

/* 卡片主内容 */
.clue-card-body {
    flex: 1;
    min-width: 0;
}

.clue-card-row1 {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.clue-card-name {
    font-size: 16px;
    font-weight: 600;
    color: var(--dark);
}

.clue-card-phone {
    font-size: 13px;
    color: var(--gray);
}

.clue-card-source {
    font-size: 12px;
    color: var(--secondary-dark);
    background: var(--secondary-light);
    padding: 2px 8px;
    border-radius: 4px;
}

.clue-card-row2 {
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 13px;
    color: var(--gray);
    margin-bottom: 6px;
}

.clue-card-row2 i {
    margin-right: 4px;
    width: 14px;
    text-align: center;
}

.clue-card-row3 {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    color: #999;
}

.clue-card-row3 .follow-warning {
    color: var(--danger);
    font-weight: 500;
}

/* 卡片右侧操作区 */
.clue-card-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex-shrink: 0;
    min-width: 100px;
}

.clue-card-actions .btn {
    width: 100%;
    font-size: 13px;
    padding: 6px 12px;
    border-radius: 6px;
}

.btn-follow {
    background: var(--primary);
    color: var(--white);
    border: none;
}

.btn-follow:hover {
    background: var(--primary-dark);
}

.btn-trial {
    background: var(--secondary);
    color: var(--white);
    border: none;
}

.btn-trial:hover {
    background: var(--secondary-dark);
}

.btn-detail {
    background: transparent;
    color: var(--gray);
    border: 1px solid var(--gray-light);
}

.btn-detail:hover {
    background: var(--gray-light);
    color: var(--dark);
}

/* ==================== 跟进弹窗表单 ==================== */
.follow-form-group {
    margin-bottom: 16px;
}

.follow-form-group label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: var(--dark);
    margin-bottom: 6px;
}

.follow-form-group label .required {
    color: var(--danger);
    margin-left: 2px;
}

.follow-form-group select,
.follow-form-group input,
.follow-form-group textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--gray-light);
    border-radius: 8px;
    font-size: 14px;
    font-family: var(--font-family);
    outline: none;
    transition: border-color 0.2s;
}

.follow-form-group select:focus,
.follow-form-group input:focus,
.follow-form-group textarea:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(241, 141, 36, 0.1);
}

.follow-form-group textarea {
    min-height: 80px;
    resize: vertical;
}

/* 跟进类型选择按钮组 */
.follow-type-group {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.follow-type-btn {
    padding: 8px 16px;
    border: 2px solid var(--gray-light);
    border-radius: 8px;
    background: var(--white);
    cursor: pointer;
    font-size: 13px;
    transition: all 0.2s;
    font-family: var(--font-family);
    color: var(--dark);
}

.follow-type-btn:hover {
    border-color: var(--primary-light);
    background: var(--primary-light);
}

.follow-type-btn.active {
    border-color: var(--primary);
    background: var(--primary-light);
    color: var(--primary-dark);
    font-weight: 500;
}

/* 客户反馈选择 */
.feedback-group {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.feedback-btn {
    padding: 6px 14px;
    border: 1px solid var(--gray-light);
    border-radius: 20px;
    background: var(--white);
    cursor: pointer;
    font-size: 12px;
    transition: all 0.2s;
    font-family: var(--font-family);
}

.feedback-btn:hover { background: #f0f0f0; }

.feedback-btn.active-positive {
    background: #d4edda;
    border-color: var(--success);
    color: #155724;
}

.feedback-btn.active-neutral {
    background: #fff3cd;
    border-color: var(--warning);
    color: #856404;
}

.feedback-btn.active-negative {
    background: #f8d7da;
    border-color: var(--danger);
    color: #721c24;
}

/* 下一步行动选择 */
.next-action-group {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.next-action-btn {
    padding: 8px 14px;
    border: 2px solid var(--gray-light);
    border-radius: 8px;
    background: var(--white);
    cursor: pointer;
    font-size: 13px;
    transition: all 0.2s;
    font-family: var(--font-family);
}

.next-action-btn:hover {
    border-color: var(--secondary-light);
}

.next-action-btn.active {
    border-color: var(--secondary);
    background: var(--secondary-light);
    color: var(--secondary-dark);
    font-weight: 500;
}

/* 弹窗底部按钮 */
.modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--gray-light);
}

/* ==================== 线索详情弹窗 ==================== */
.detail-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--gray-light);
}

.detail-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--primary-light);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: var(--primary);
    font-weight: 600;
    flex-shrink: 0;
}

.detail-info h2 {
    font-size: 20px;
    color: var(--dark);
    margin-bottom: 4px;
}

.detail-info .detail-phone {
    font-size: 14px;
    color: var(--gray);
}

.detail-section {
    margin-bottom: 20px;
}

.detail-section h4 {
    font-size: 14px;
    color: var(--primary);
    margin-bottom: 10px;
    padding-bottom: 6px;
    border-bottom: 1px dashed var(--gray-light);
}

.detail-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.detail-item {
    font-size: 13px;
}

.detail-item .label {
    color: var(--gray);
    margin-right: 6px;
}

.detail-item .value {
    color: var(--dark);
    font-weight: 500;
}

/* 跟进时间线 */
.follow-timeline {
    position: relative;
    padding-left: 24px;
}

.follow-timeline::before {
    content: '';
    position: absolute;
    left: 8px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--gray-light);
}

.timeline-item {
    position: relative;
    padding-bottom: 16px;
}

.timeline-item::before {
    content: '';
    position: absolute;
    left: -20px;
    top: 6px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--secondary);
    border: 2px solid var(--white);
    box-shadow: 0 0 0 2px var(--secondary-light);
}

.timeline-time {
    font-size: 12px;
    color: var(--gray);
    margin-bottom: 4px;
}

.timeline-content {
    font-size: 13px;
    color: var(--dark);
    background: #f8f9fa;
    padding: 10px 14px;
    border-radius: 8px;
}

.timeline-meta {
    display: flex;
    gap: 10px;
    margin-top: 6px;
    font-size: 12px;
    color: var(--gray);
}

/* ==================== 新增线索弹窗 ==================== */
.add-clue-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.add-clue-form .full-width {
    grid-column: 1 / -1;
}

/* ==================== 线索统计横条 ==================== */
.clue-stats-bar {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.clue-stat-chip {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--white);
    padding: 10px 16px;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    font-size: 13px;
    cursor: pointer;
    transition: all 0.2s;
    border: 2px solid transparent;
}

.clue-stat-chip:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.clue-stat-chip.active {
    border-color: var(--primary);
}

.clue-stat-chip .chip-count {
    font-size: 20px;
    font-weight: 700;
}

.clue-stat-chip .chip-label {
    color: var(--gray);
}

.chip-new .chip-count { color: var(--primary); }
.chip-following .chip-count { color: #856404; }
.chip-trial .chip-count { color: var(--secondary); }
.chip-deal .chip-count { color: var(--success); }
.chip-pool .chip-count { color: #6c757d; }
.chip-urgent .chip-count { color: var(--danger); }

/* ==================== 活动管理 - 流程驱动式 ==================== */

/* 快速统计列表 */
.quick-stats-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.quick-stat-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 6px;
    background: var(--white);
    font-size: 13px;
}

.stat-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.dot-orange { background: var(--primary); }
.dot-yellow { background: var(--warning); }
.dot-blue { background: var(--secondary); }
.dot-green { background: var(--success); }

.stat-label {
    flex: 1;
    color: var(--dark);
}

.stat-value {
    font-weight: 600;
    color: var(--dark);
}

/* 活动流程卡片 */
.activities-container {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.activity-flow-card {
    background: var(--white);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    border: 1px solid #eee;
    transition: all 0.2s ease;
    overflow: hidden;
}

.activity-flow-card:hover {
    box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}

.activity-flow-card.expanded {
    border-color: var(--primary-light);
    box-shadow: 0 4px 24px rgba(241,141,36,0.12);
}

/* 卡片头部 */
.activity-card-header {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 20px 24px;
    cursor: pointer;
    transition: background 0.2s;
}

.activity-card-header:hover {
    background: #fefcf8;
}

.activity-card-main {
    flex: 1;
    min-width: 0;
}

.activity-title-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.activity-name {
    font-size: 18px;
    font-weight: 600;
    color: var(--dark);
    margin: 0;
}

.mode-badge {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 500;
}

.mode-ai {
    background: #e0f7fb;
    color: #0f7d9a;
}

.mode-manual {
    background: #f0f0f0;
    color: #666;
}

.activity-meta-row {
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 13px;
    color: var(--gray);
    flex-wrap: wrap;
}

.activity-meta-row i {
    width: 14px;
    text-align: center;
}

/* 指标区 */
.activity-card-metrics {
    display: flex;
    gap: 24px;
    flex-shrink: 0;
}

.metric-item {
    text-align: center;
}

.metric-value {
    font-size: 20px;
    font-weight: 700;
    color: var(--dark);
}

.metric-label {
    font-size: 12px;
    color: var(--gray);
    margin-top: 2px;
}

/* 进度环 */
.metric-progress {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.progress-ring {
    width: 44px;
    height: 44px;
    position: relative;
}

.progress-ring svg {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.progress-ring-bg {
    fill: none;
    stroke: #eee;
    stroke-width: 3;
}

.progress-ring-fill {
    fill: none;
    stroke: var(--primary);
    stroke-width: 3;
    stroke-linecap: round;
    transition: stroke-dasharray 0.5s ease;
}

.progress-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 11px;
    font-weight: 600;
    color: var(--primary);
}

/* 展开箭头 */
.activity-card-toggle {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--gray-light);
    color: var(--gray);
    transition: all 0.2s;
}

.activity-card-toggle:hover {
    background: var(--primary-light);
    color: var(--primary);
}

/* 4步法流程管道 */
.activity-pipeline {
    padding: 16px 24px 20px;
    border-top: 1px solid #f0f0f0;
    cursor: pointer;
    transition: background 0.2s;
}

.activity-pipeline:hover {
    background: #fafbfc;
}

.pipeline-track {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 4px;
}

.pipeline-node {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    flex: 1;
    min-width: 0;
    cursor: pointer;
    padding: 4px 2px;
    border-radius: 8px;
    transition: all 0.2s;
}

.pipeline-node:hover {
    background: rgba(241,141,36,0.08);
    transform: scale(1.05);
}

.pipeline-node:hover .node-circle {
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

.node-circle {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 600;
    transition: all 0.2s;
    border: 2px solid;
}

.node-label {
    font-size: 11px;
    font-weight: 600;
    color: var(--dark);
    white-space: nowrap;
}

.node-status {
    font-size: 10px;
    color: var(--gray);
    white-space: nowrap;
}

/* 节点状态样式 */
.step-done .node-circle {
    background: var(--success);
    border-color: var(--success);
    color: var(--white);
}

.step-active .node-circle {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--white);
    box-shadow: 0 0 0 4px rgba(241,141,36,0.2);
    animation: pulse 2s infinite;
}

.step-pending .node-circle {
    background: var(--warning);
    border-color: var(--warning);
    color: var(--dark);
}

.step-todo .node-circle {
    background: var(--white);
    border-color: #ddd;
    color: #ccc;
}

.pipeline-node.current .node-label {
    color: var(--primary);
}

@keyframes pulse {
    0%, 100% { box-shadow: 0 0 0 4px rgba(241,141,36,0.2); }
    50% { box-shadow: 0 0 0 8px rgba(241,141,36,0.1); }
}

/* 管道连接线 */
.pipeline-connector {
    width: 20px;
    height: 2px;
    margin-top: 16px;
    flex-shrink: 0;
    background: #eee;
    transition: background 0.3s;
}

.pipeline-connector.step-done {
    background: var(--success);
}

.pipeline-connector.step-active {
    background: linear-gradient(90deg, var(--success), var(--primary));
}

/* 展开详情面板 */
.activity-detail-panel {
    padding: 20px 24px;
    border-top: 1px solid var(--gray-light);
    background: #fafbfc;
    animation: slideDown 0.25s ease;
}

@keyframes slideDown {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

.detail-current-step {
    background: var(--white);
    padding: 16px 20px;
    border-radius: 10px;
    margin-bottom: 16px;
    border-left: 4px solid var(--primary);
}

.step-badge {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.step-num {
    background: var(--primary);
    color: var(--white);
    padding: 2px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
}

.step-name {
    font-size: 16px;
    font-weight: 600;
    color: var(--dark);
}

.step-desc {
    font-size: 13px;
    color: var(--gray);
}

.detail-actions {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

/* 历史步骤 */
.detail-history h4 {
    font-size: 14px;
    color: var(--dark);
    margin-bottom: 10px;
}

.history-steps {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.history-step-item {
    display: flex;
    align-items: center;
    gap: 6px;
    background: var(--white);
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 12px;
}

.history-step-num {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--success);
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 600;
}

.history-step-name {
    color: var(--dark);
}

.history-step-status {
    color: var(--success);
    font-size: 11px;
}

.history-edit-icon {
    font-size: 11px;
    color: var(--primary);
    margin-left: auto;
    opacity: 0;
    transition: opacity 0.2s;
}

.history-step-item:hover .history-edit-icon {
    opacity: 1;
}

/* 步骤表单 */
.step-form-intro {
    background: #fefcf8;
    padding: 12px 16px;
    border-radius: 8px;
    font-size: 13px;
    margin-bottom: 8px;
}

/* 完成状态 */
.detail-completed {
    text-align: center;
    padding: 40px 20px;
}

.detail-completed h3 {
    color: var(--dark);
    margin: 12px 0 8px;
}

.detail-completed p {
    color: var(--gray);
    margin-bottom: 20px;
}

/* ==================== v1.3: 顶部导航栏重构 ==================== */

.top-bar {
    position: fixed;
    top: 0; left: 0; right: 0;
    height: 56px;
    background: linear-gradient(135deg, var(--primary), var(--primary-dark));
    color: var(--white);
    display: flex;
    align-items: center;
    padding: 0 20px;
    z-index: 1000;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.brand {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-right: 30px;
    white-space: nowrap;
}

.brand-icon { font-size: 22px; }
.brand-text { font-size: 16px; font-weight: 700; letter-spacing: 1px; text-shadow: 0 1px 3px rgba(0,0,0,0.25); }

.nav-tabs {
    display: flex;
    gap: 4px;
    flex: 1;
}

.nav-item {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 8px 14px;
    border-radius: 8px;
    cursor: pointer;
    color: rgba(255,255,255,0.8);
    font-size: 13px;
    transition: all 0.2s;
    white-space: nowrap;
}

.nav-item:hover { background: rgba(255,255,255,0.15); color: #fff; }
.nav-item.active { background: rgba(255,255,255,0.25); color: #fff; font-weight: 600; }

.nav-icon { font-size: 15px; }

.user-area {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
}

.user-role-badge {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 600;
}

.role-超级管理员 { background: #e53935; color: #fff; }
.role-校区校长 { background: #f18d24; color: #fff; }
.role-市场主管, .role-教务主管 { background: #149ebb; color: #fff; }
.role-老师, .role-市场专员 { background: rgba(255,255,255,0.3); color: #fff; }

.user-name { font-size: 13px; }

/* ==================== v1.3: 主内容区 ==================== */

/* ==================== v5.1: 左侧边栏布局 ==================== */
.app-layout {
    display: flex;
    margin-top: 56px;
    min-height: calc(100vh - 56px);
}

.main-sidebar {
    width: var(--sidebar-width);
    flex-shrink: 0;
    background: linear-gradient(180deg, #2c3e50 0%, #1a252f 100%);
    color: var(--white);
    padding: 16px 12px;
    overflow-y: auto;
    position: fixed;
    top: 56px;
    bottom: 0;
    left: 0;
    z-index: 900;
    box-shadow: 2px 0 8px rgba(0,0,0,0.15);
}

.main-content {
    margin-left: var(--sidebar-width);
    flex: 1;
    padding: 20px;
    min-height: calc(100vh - 56px);
    background: #f5f6fa;
}

/* 侧边栏导航文字 */
.nav-text {
    font-size: 13px;
    line-height: 1.4;
}

.nav-group-header .nav-text {
    font-size: 14px;
    font-weight: 600;
}

/* 带侧边栏的页面布局 */
.layout-with-sidebar {
    display: flex;
    gap: 20px;
    min-height: calc(100vh - 96px);
}

.layout-with-sidebar .sidebar {
    width: 260px;
    flex-shrink: 0;
    background: #fff;
    border-radius: 8px;
    padding: 16px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    height: fit-content;
}

.layout-with-sidebar .page-content {
    flex: 1;
    min-width: 0;
}

.page-header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 14px;
    border-bottom: 2px solid var(--gray-light);
}

.page-header-row h2 {
    font-size: 20px;
    color: var(--dark);
}

.header-actions {
    display: flex;
    gap: 8px;
}

/* ==================== v1.3: 公海池样式 ==================== */

.claim-info-bar {
    margin-bottom: 12px;
}

.claim-limit {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    background: linear-gradient(135deg, #e0f7fb, #fce6c8);
    border-radius: 10px;
    font-size: 13px;
    color: var(--dark);
}

.claim-limit.exhausted {
    background: linear-gradient(135deg, #fde8e8, #fce6c8);
}

.claim-icon { font-size: 18px; }
.claim-remaining { font-weight: 600; color: var(--secondary); }
.claim-hint { margin-left: auto; font-size: 11px; color: var(--gray); }

.public-sea-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.public-sea-card {
    background: var(--white);
    border-radius: 12px;
    padding: 16px;
    border-left: 4px solid var(--secondary);
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    transition: box-shadow 0.2s;
}

.public-sea-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.1); }

.ps-card-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.ps-card-info {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ps-name { font-size: 16px; font-weight: 700; color: var(--dark); }
.ps-age { font-size: 12px; color: var(--gray); }
.ps-grade { font-size: 12px; font-weight: 600; border: 1px solid; padding: 1px 6px; border-radius: 4px; }

.reason-tag {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 600;
}

.reason-timeout { background: #fde8e8; color: #e53935; }
.reason-new-timeout { background: #fff3e0; color: #f18d24; }
.reason-trial-timeout { background: #e8eaf6; color: #3f51b5; }
.reason-returned { background: #e8f5e9; color: #28a745; }

.ps-card-mid {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 13px;
    color: var(--gray);
    margin-bottom: 10px;
}

.ps-detail { white-space: nowrap; }

.ps-card-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 10px;
    border-top: 1px solid var(--gray-light);
    font-size: 12px;
    color: var(--gray);
}

.ps-actions {
    display: flex;
    gap: 6px;
}

.ps-claim-count { font-size: 11px; }

.claim-disabled {
    font-size: 11px;
    color: #999;
    background: #f0f0f0;
    padding: 3px 8px;
    border-radius: 4px;
}

/* 统计横条 */
.stats-bar {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
}

.stat-item {
    flex: 1;
    background: var(--white);
    border-radius: 10px;
    padding: 12px;
    text-align: center;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}

.stat-num { display: block; font-size: 24px; font-weight: 700; color: var(--primary); }
.stat-label { display: block; font-size: 12px; color: var(--gray); margin-top: 2px; }

.stat-total .stat-num { color: var(--primary); }
.stat-timeout .stat-num { color: #e53935; }
.stat-new-timeout .stat-num { color: #f18d24; }
.stat-returned .stat-num { color: #28a745; }

/* 筛选器 */
.filter-bar {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
    flex-wrap: wrap;
    align-items: center;
}

.filter-bar select,
.filter-bar input {
    padding: 6px 10px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 13px;
    font-family: var(--font-family);
}

.filter-bar input { min-width: 160px; }

/* ==================== v1.3: 弹窗/消息（已废弃：由v1.0弹窗 + v6.0打磨层统一接管） ==================== */

.toast-container {
    position: fixed;
    top: 70px;
    right: 20px;
    z-index: 3000;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.toast {
    padding: 10px 16px;
    border-radius: 8px;
    font-size: 13px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    animation: slideIn 0.3s ease;
}

.toast-success { background: #d4edda; color: #155724; }
.toast-error { background: #f8d7da; color: #721c24; }
.toast-info { background: #d1ecf1; color: #0c5460; }

@keyframes slideIn {
    from { transform: translateX(100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

/* 分配表单 */
.assign-form { display: flex; flex-direction: column; gap: 12px; }

.form-select, .form-textarea {
    width: 100%;
}

/* ==================== 通知中心 ==================== */

/* 铃铛容器 */
.notification-bell-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    margin-right: 8px;
}

.notification-bell {
    position: relative;
    cursor: pointer;
    padding: 6px 8px;
    border-radius: 8px;
    transition: background 0.2s;
    display: flex;
    align-items: center;
}

.notification-bell:hover {
    background: rgba(255,255,255,0.15);
}

.bell-icon {
    font-size: 18px;
    line-height: 1;
}

.notification-badge {
    position: absolute;
    top: -2px;
    right: -2px;
    min-width: 18px;
    height: 18px;
    border-radius: 9px;
    background: #e53935;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    animation: badgePop 0.3s ease;
}

@keyframes badgePop {
    0% { transform: scale(0); }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); }
}

/* 下拉面板 */
.notification-dropdown {
    position: absolute;
    top: 44px;
    right: 0;
    width: 360px;
    max-height: 480px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.15);
    z-index: 2000;
    overflow: hidden;
    animation: dropdownIn 0.2s ease;
}

@keyframes dropdownIn {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: translateY(0); }
}

.dropdown-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    border-bottom: 1px solid #eee;
    font-weight: 600;
    font-size: 14px;
    color: #333;
}

.dropdown-mark-all {
    background: none;
    border: none;
    color: var(--secondary);
    font-size: 12px;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: background 0.2s;
}

.dropdown-mark-all:hover {
    background: var(--secondary-light);
}

.dropdown-body {
    max-height: 340px;
    overflow-y: auto;
}

.dropdown-loading,
.dropdown-empty {
    padding: 30px 16px;
    text-align: center;
    color: #999;
    font-size: 13px;
}

.dropdown-notif-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 16px;
    cursor: pointer;
    transition: background 0.15s;
    border-bottom: 1px solid #f5f5f5;
}

.dropdown-notif-item:hover {
    background: #fefcf8;
}

.notif-item-icon {
    font-size: 20px;
    flex-shrink: 0;
    margin-top: 2px;
}

.notif-item-content {
    flex: 1;
    min-width: 0;
}

.notif-item-title {
    font-size: 13px;
    font-weight: 600;
    color: #333;
    margin-bottom: 3px;
    line-height: 1.3;
}

.notif-item-desc {
    font-size: 12px;
    color: #999;
    line-height: 1.3;
    margin-bottom: 4px;
}

.notif-item-time {
    font-size: 11px;
    color: #bbb;
}

.notif-unread-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--primary);
    flex-shrink: 0;
    margin-top: 6px;
}

.dropdown-footer {
    padding: 12px 16px;
    text-align: center;
    font-size: 13px;
    color: var(--secondary);
    cursor: pointer;
    border-top: 1px solid #eee;
    transition: background 0.2s;
}

.dropdown-footer:hover {
    background: var(--secondary-light);
}

/* ==================== 通知中心页面 ==================== */

.notif-stats-bar {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
}

.notif-stats-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    cursor: pointer;
    transition: all 0.2s;
    border: 2px solid transparent;
}

.notif-stats-item:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.notif-stats-item.active {
    border-color: var(--primary);
    background: var(--primary-light);
}

.notif-stat-num {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary);
}

.notif-stat-label {
    font-size: 13px;
    color: #666;
}

/* 通知卡片列表 */
.notif-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.notif-card {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 20px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
    cursor: pointer;
    transition: all 0.2s;
    border: 1px solid #f0f0f0;
}

.notif-card:hover {
    box-shadow: 0 3px 12px rgba(0,0,0,0.08);
    border-color: var(--primary-light);
}

.notif-card-unread {
    border-left: 3px solid var(--primary);
    background: #fefcf8;
}

.notif-card-left {
    position: relative;
    flex-shrink: 0;
    width: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.notif-card-icon {
    font-size: 24px;
}

.notif-card-unread-dot {
    position: absolute;
    top: 0;
    right: -2px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--primary);
}

.notif-card-body {
    flex: 1;
    min-width: 0;
}

.notif-card-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 6px;
    line-height: 1.4;
}

.notif-card-desc {
    font-size: 13px;
    color: #666;
    line-height: 1.5;
    margin-bottom: 8px;
}

.notif-card-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    color: #999;
    flex-wrap: wrap;
}

.notif-card-time {
    color: #bbb;
}

.notif-card-student {
    color: var(--secondary);
}

.notif-card-status {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 500;
}

.status-read {
    background: #f0f0f0;
    color: #999;
}

.status-unread {
    background: var(--primary-light);
    color: var(--primary-dark);
}

/* 分页 */
.notif-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 20px;
    padding: 16px 0;
}

.notif-page-btn {
    padding: 6px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
    font-size: 13px;
    color: #666;
    transition: all 0.2s;
    font-family: var(--font-family);
}

.notif-page-btn:hover:not(:disabled) {
    border-color: var(--primary);
    color: var(--primary);
}

.notif-page-btn.active {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

.notif-page-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.notif-page-info {
    font-size: 12px;
    color: #999;
    margin-left: 8px;
}

/* 头部按钮样式 */
.btn-outline-notif {
    background: #fff;
    border: 1px solid #ddd;
    color: #666;
    cursor: pointer;
    transition: all 0.2s;
    font-family: var(--font-family);
}

.btn-outline-notif:hover {
    border-color: var(--primary);
    color: var(--primary);
}
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 13px;
    font-family: var(--font-family);
}

.form-textarea { min-height: 60px; resize: vertical; }

.form-input {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    font-family: var(--font-family);
}

.form-input:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 2px rgba(241, 141, 36, 0.15);
    outline: none;
}

/* ==================== 步骤表单样式 ==================== */
.step-form-fields {
    max-height: 60vh;
    overflow-y: auto;
    padding-right: 4px;
}

.step-form-fields .form-group {
    margin-bottom: 16px;
}

.step-form-fields .form-label {
    display: block;
    font-size: 13px;
    font-weight: 500;
    color: var(--text);
    margin-bottom: 6px;
}

.step-form-fields .form-textarea,
.step-form-fields .form-input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    font-size: 14px;
    font-family: var(--font-family);
    background: #fafafa;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.step-form-fields .form-textarea:focus,
.step-form-fields .form-input:focus {
    border-color: var(--primary);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(241, 141, 36, 0.1);
    outline: none;
}

.step-form-fields .form-textarea {
    min-height: 80px;
    resize: vertical;
    line-height: 1.6;
}

.step-form-fields input[type="number"] {
    max-width: 200px;
}

.step-form-intro {
    background: linear-gradient(135deg, #fff8f0 0%, #fff 100%);
    border-left: 3px solid var(--primary);
    padding: 12px 16px;
    border-radius: 0 8px 8px 0;
    margin-bottom: 16px;
    font-size: 13px;
    color: #555;
}

/* checkbox group */
.checkbox-group label {
    font-size: 13px;
    color: #444;
    padding: 4px 0;
}

.checkbox-group input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: var(--primary);
}

/* 空状态和错误 */
.empty-state, .error-state {
    text-align: center;
    padding: 40px;
    color: var(--gray);
}

.empty-state h3, .error-state h3 { margin-bottom: 8px; }
.hint { font-size: 12px; margin-top: 4px; }
.loading { text-align: center; padding: 40px; color: var(--gray); }

/* ==================== v1.3: 跟进时间线 ==================== */

.follow-timeline {
    position: relative;
    padding-left: 30px;
}

.timeline-item {
    position: relative;
    padding-bottom: 20px;
    display: flex;
    gap: 12px;
}

.timeline-marker {
    position: absolute;
    left: -30px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--white);
    border: 2px solid var(--secondary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    z-index: 1;
}

.timeline-item:not(:last-child)::before {
    content: '';
    position: absolute;
    left: -19px;
    top: 24px;
    bottom: 0;
    width: 2px;
    background: var(--gray-light);
}

.timeline-content {
    flex: 1;
    background: var(--white);
    border-radius: 10px;
    padding: 12px 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}

.timeline-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

.timeline-person { font-weight: 600; color: var(--dark); font-size: 14px; }
.timeline-type { font-size: 11px; color: var(--secondary); background: var(--secondary-light); padding: 1px 6px; border-radius: 4px; }
.timeline-time { margin-left: auto; font-size: 11px; color: var(--gray); }

.timeline-clue { font-size: 13px; color: var(--dark); margin-bottom: 4px; }

.timeline-body { font-size: 13px; color: #555; margin-bottom: 6px; line-height: 1.5; }

.timeline-footer {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    font-size: 11px;
}

.feedback-tag { padding: 1px 8px; border-radius: 10px; font-weight: 600; }
.next-tag { color: var(--secondary); }
.next-time { color: var(--gray); }

/* ==================== v1.3: 试听卡片 ==================== */

.trial-list, .deal-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.trial-card {
    background: var(--white);
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    border-left: 4px solid var(--secondary);
}

.trial-card.cancelled { border-left-color: #999; opacity: 0.6; }
.trial-card.noshow { border-left-color: #dc3545; }

.trial-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.trial-student { font-size: 16px; font-weight: 700; }

.trial-status-badge {
    font-size: 11px;
    padding: 2px 10px;
    border-radius: 10px;
    font-weight: 600;
}

.status-已预约 { background: #fff3e0; color: #f18d24; }
.status-已确认 { background: #e3f2fd; color: #1976d2; }
.status-已到店 { background: #e8f5e9; color: #28a745; }
.status-未到店 { background: #fce4ec; color: #dc3545; }
.status-已完成 { background: #e8f5e9; color: #28a745; }
.status-已取消 { background: #f5f5f5; color: #999; }

.trial-card-body {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 13px;
    color: var(--gray);
    margin-bottom: 10px;
}

/* 试听进度条 */
.trial-progress {
    display: flex;
    align-items: center;
    margin: 10px 0;
    gap: 0;
}

.progress-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 60px;
}

.step-dot {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #eee;
    color: #999;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 600;
    margin-bottom: 4px;
}

.progress-step.done .step-dot { background: var(--success); color: #fff; }
.progress-step.current .step-dot { background: var(--primary); color: #fff; animation: pulse 1.5s infinite; }

@keyframes pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(241, 141, 36, 0.4); }
    50% { box-shadow: 0 0 0 8px rgba(241, 141, 36, 0); }
}

.step-label { font-size: 10px; color: var(--gray); }
.progress-step.done .step-label { color: var(--success); }
.progress-step.current .step-label { color: var(--primary); font-weight: 600; }

.progress-line {
    flex: 1;
    height: 2px;
    background: #eee;
    min-width: 20px;
}

.progress-line.done { background: var(--success); }

.trial-feedback {
    display: flex;
    gap: 12px;
    font-size: 12px;
    color: var(--gray);
    padding: 6px 0;
    border-top: 1px solid var(--gray-light);
    margin-top: 6px;
}

.trial-actions {
    display: flex;
    gap: 6px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--gray-light);
}

/* ==================== v1.3: 成交卡片 ==================== */

.deal-card {
    background: var(--white);
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    border-left: 4px solid var(--success);
}

.deal-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
}

.deal-student { font-size: 16px; font-weight: 700; }
.deal-amount { font-size: 20px; font-weight: 700; color: #e53935; }

.deal-card-body {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 13px;
    color: var(--gray);
    margin-bottom: 8px;
}

.sync-status { font-size: 11px; }
.sync-status.synced { color: var(--success); }
.sync-status.unsynced { color: var(--warning); }

.deal-commission {
    display: flex;
    gap: 10px;
    font-size: 12px;
    padding: 6px 0;
    border-top: 1px solid var(--gray-light);
}

.comm-item { padding: 2px 8px; border-radius: 4px; }
.comm-lead { background: #fff3e0; color: #f18d24; }
.comm-sale { background: #e0f7fb; color: #149ebb; }
.comm-total { margin-left: auto; font-weight: 700; color: var(--dark); }

.commission-preview {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 12px;
    margin-top: 8px;
    font-size: 13px;
}

.commission-preview h4 { font-size: 13px; color: var(--primary); margin-bottom: 6px; }
.commission-preview p { margin: 2px 0; }

/* 按钮补充 */
.btn-success { background: var(--success); color: #fff; border: none; }
.btn-danger { background: var(--danger); color: #fff; border: none; }
.btn-outline { background: transparent; border: 1px solid #ddd; color: var(--gray); }
.btn-outline:hover { border-color: var(--primary); color: var(--primary); }

/* ==================== v1.4: 用户下拉框 ==================== */

.user-dropdown {
    position: relative;
    cursor: pointer;
}

.user-dropdown-trigger {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    border-radius: 8px;
    transition: background 0.2s;
}

.user-dropdown-trigger:hover {
    background: rgba(255,255,255,0.15);
}

.dropdown-arrow {
    font-size: 10px;
    transition: transform 0.2s;
}

.user-dropdown.show .dropdown-arrow {
    transform: rotate(180deg);
}

.user-dropdown-menu {
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 6px;
    background: var(--white);
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.15);
    min-width: 220px;
    z-index: 3000;
    display: none;
    overflow: hidden;
}

.user-dropdown.show .user-dropdown-menu {
    display: block;
    animation: dropDown 0.2s ease;
}

@keyframes dropDown {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: translateY(0); }
}

.user-dropdown-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    font-size: 13px;
    color: var(--dark);
    cursor: pointer;
    transition: background 0.15s;
}

.user-dropdown-item:hover {
    background: #f5f6fa;
}

.user-dropdown-item.active {
    background: #e0f7fb;
    color: var(--secondary);
    font-weight: 600;
}

.role-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.role-dot.超级管理员 { background: #e53935; }
.role-dot.校区校长 { background: #f18d24; }
.role-dot.市场主管 { background: #149ebb; }
.role-dot.教务主管 { background: #149ebb; }
.role-dot.老师 { background: #28a745; }
.role-dot.市场专员 { background: #28a745; }

.check-mark {
    margin-left: auto;
    color: var(--secondary);
    font-weight: 700;
}

/* ==================== v1.4: 数据看板优化 ==================== */

/* 角色提示条 */
.role-hint-bar {
    background: linear-gradient(135deg, #e0f7fb, #fce6c8);
    border-radius: 10px;
    padding: 10px 16px;
    margin-bottom: 16px;
    font-size: 13px;
    color: var(--dark);
    display: flex;
    align-items: center;
    gap: 8px;
}

.role-hint-bar .hint-icon {
    font-size: 18px;
}

/* 看板网格 */
.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.dashboard-card {
    background: var(--white);
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}

.dashboard-card h3 {
    font-size: 14px;
    color: var(--dark);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 6px;
}

/* 转化漏斗 */
.funnel-chart {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 12px 0;
}

.funnel-step {
    display: flex;
    align-items: center;
    gap: 10px;
}

.funnel-bar-bg {
    flex: 1;
    height: 28px;
    background: #f0f0f0;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
}

.funnel-bar {
    height: 100%;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 8px;
    font-size: 11px;
    color: #fff;
    font-weight: 600;
    transition: width 0.6s ease;
}

.funnel-label {
    min-width: 60px;
    font-size: 12px;
    color: var(--gray);
}

.funnel-count {
    min-width: 40px;
    text-align: right;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark);
}

/* 渠道排行 */
.channel-rank {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.channel-rank-item {
    display: flex;
    align-items: center;
    gap: 10px;
}

.channel-rank-bar-bg {
    flex: 1;
    height: 20px;
    background: #f0f0f0;
    border-radius: 4px;
    overflow: hidden;
}

.channel-rank-bar {
    height: 100%;
    border-radius: 4px;
    background: var(--secondary);
    transition: width 0.6s ease;
}

.channel-rank-name {
    min-width: 70px;
    font-size: 12px;
    color: var(--dark);
}

.channel-rank-count {
    min-width: 30px;
    text-align: right;
    font-size: 12px;
    font-weight: 600;
    color: var(--secondary);
}

/* 活动ROI卡片 */
.activity-roi-card {
    border: 1px solid var(--gray-light);
    border-radius: 8px;
    padding: 12px;
    margin-bottom: 8px;
    transition: box-shadow 0.2s;
}

.activity-roi-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.activity-roi-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.activity-roi-name {
    font-size: 14px;
    font-weight: 600;
    color: var(--dark);
}

.activity-roi-status {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
}

.roi-metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    font-size: 12px;
}

.roi-metric-label {
    color: var(--gray);
}

.roi-metric-value {
    font-weight: 600;
    color: var(--dark);
}

/* 我的待办 */
.my-tasks {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.task-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    background: #fafafa;
    border-radius: 8px;
    font-size: 13px;
}

.task-icon {
    font-size: 16px;
}

.task-content {
    flex: 1;
}

.task-title {
    font-weight: 600;
    color: var(--dark);
}

.task-hint {
    font-size: 11px;
    color: var(--gray);
}

.task-action {
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 11px;
    background: var(--secondary);
    color: #fff;
    border: none;
    cursor: pointer;
}

/* ==================== v1.4: 模板库样式 ==================== */

.template-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 12px;
}

.template-card {
    background: var(--white);
    border: 1px solid #eee;
    border-radius: 10px;
    padding: 14px;
    cursor: pointer;
    transition: all 0.2s;
}

.template-card:hover {
    border-color: var(--secondary);
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    transform: translateY(-2px);
}

.tpl-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.tpl-icon {
    font-size: 24px;
}

.tpl-scope-tag {
    font-size: 10px;
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 600;
}

.tpl-card-body {
    margin-bottom: 10px;
}

.tpl-name {
    font-size: 14px;
    font-weight: 700;
    color: var(--dark);
    margin: 0 0 4px 0;
    line-height: 1.3;
}

.tpl-desc {
    font-size: 12px;
    color: var(--gray);
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.4;
}

.tpl-card-footer {
    display: flex;
    gap: 8px;
    font-size: 11px;
    color: var(--gray);
    padding-top: 8px;
    border-top: 1px solid #f0f0f0;
}

.tpl-stat {
    white-space: nowrap;
}

.tpl-card-creator {
    font-size: 10px;
    color: #bbb;
    margin-top: 6px;
}

/* 评分星星 */
.rating-star {
    transition: color 0.15s, transform 0.15s;
    user-select: none;
}

.rating-star:hover {
    transform: scale(1.2);
}

/* 模板详情预览 */
.tpl-preview-steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}

.tpl-preview-step {
    background: #f8f9fa;
    border-radius: 6px;
    padding: 6px 8px;
    font-size: 11px;
}

.tpl-preview-step strong {
    color: var(--dark);
}

/* 按钮行内间距修正 */
.header-actions {
    display: flex;
    gap: 8px;
    align-items: center;
}

.btn-block {
    display: block;
    width: 100%;
}

/* ==================== v5.0: 两级导航样式 ==================== */
.nav-group {
    margin-bottom: 4px;
}

.nav-group-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    cursor: pointer;
    border-radius: 6px;
    transition: background 0.2s;
    user-select: none;
    font-weight: 600;
    font-size: 14px;
}

.nav-group-header:hover {
    background: rgba(255, 255, 255, 0.1);
}

.nav-group-header .nav-group-arrow {
    margin-left: auto;
    font-size: 10px;
    transition: transform 0.2s;
}

.nav-group-header.collapsed .nav-group-arrow {
    transform: rotate(-90deg);
}

.nav-group-items {
    padding-left: 8px;
    overflow: hidden;
    transition: max-height 0.3s ease;
    max-height: 600px;
}

.nav-group-items.collapsed {
    max-height: 0;
}

.nav-group-items .nav-item {
    padding: 6px 12px 6px 28px;
    font-size: 13px;
    font-weight: 400;
}

.nav-item-disabled {
    opacity: 0.4;
    cursor: not-allowed !important;
    pointer-events: none;
}

/* ==================== v2.0: 二级子菜单样式（营收管理） ==================== */
.nav-sub-group {
    position: relative;
}

.nav-sub-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px 6px 28px;
    cursor: pointer;
    border-radius: 6px;
    transition: background 0.2s;
    user-select: none;
    font-size: 13px;
    font-weight: 500;
    color: rgba(255,255,255,0.75);
}

.nav-sub-header:hover {
    background: rgba(255,255,255,0.1);
    color: #fff;
}

.nav-sub-header .nav-sub-arrow {
    margin-left: auto;
    font-size: 10px;
    transition: transform 0.2s;
}

.nav-sub-header.collapsed .nav-sub-arrow {
    transform: rotate(90deg);
}

.nav-sub-items {
    padding-left: 8px;
    overflow: hidden;
    transition: max-height 0.3s ease;
    max-height: 300px;
}

.nav-sub-items.collapsed {
    max-height: 0;
}

.nav-sub-item {
    padding: 5px 12px 5px 40px !important;
    font-size: 12px !important;
    font-weight: 400 !important;
}

.nav-sub-item .nav-icon {
    font-size: 10px !important;
}

/* ==================== v5.0: AI聊天气泡样式 ==================== */
.ai-chat-message.assistant {
    max-width: 75%;
    background: #f0f4ff;
    border-radius: 12px 12px 12px 4px;
    padding: 12px 16px;
    margin: 8px 0;
    line-height: 1.6;
    word-break: break-word;
}

.ai-chat-message.user {
    max-width: 75%;
    background: var(--primary, #f18d24);
    color: #fff;
    border-radius: 12px 12px 4px 12px;
    padding: 10px 14px;
    margin: 8px 0 8px auto;
    text-align: right;
    word-break: break-word;
}

/* ==================== v5.0: Markdown渲染样式 ==================== */
.ai-chat-message.assistant h1,
.ai-chat-message.assistant h2,
.ai-chat-message.assistant h3,
.ai-chat-message.assistant h4 {
    margin: 12px 0 6px;
    font-weight: 600;
    color: #1a1a2e;
}

.ai-chat-message.assistant h1 { font-size: 18px; }
.ai-chat-message.assistant h2 { font-size: 16px; }
.ai-chat-message.assistant h3 { font-size: 15px; }
.ai-chat-message.assistant h4 { font-size: 14px; }

.ai-chat-message.assistant p {
    margin: 6px 0;
    line-height: 1.7;
}

.ai-chat-message.assistant ul,
.ai-chat-message.assistant ol {
    margin: 6px 0;
    padding-left: 20px;
}

.ai-chat-message.assistant li {
    margin: 3px 0;
    line-height: 1.6;
}

.ai-chat-message.assistant code {
    background: rgba(0, 0, 0, 0.06);
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 12px;
    font-family: 'SF Mono', 'Fira Code', monospace;
}

.ai-chat-message.assistant pre {
    background: #1e1e2e;
    color: #cdd6f4;
    padding: 12px;
    border-radius: 8px;
    overflow-x: auto;
    margin: 8px 0;
    font-size: 12px;
}

.ai-chat-message.assistant pre code {
    background: none;
    padding: 0;
    color: inherit;
}

.ai-chat-message.assistant blockquote {
    border-left: 3px solid #1890ff;
    padding-left: 12px;
    margin: 8px 0;
    color: #666;
    font-style: italic;
}

.ai-chat-message.assistant table {
    border-collapse: collapse;
    width: 100%;
    margin: 8px 0;
    font-size: 13px;
}

.ai-chat-message.assistant th,
.ai-chat-message.assistant td {
    border: 1px solid #ddd;
    padding: 6px 10px;
    text-align: left;
}

.ai-chat-message.assistant th {
    background: #e8edf5;
    font-weight: 600;
}

.ai-chat-message.assistant hr {
    border: none;
    border-top: 1px solid #ddd;
    margin: 12px 0;
}

.ai-chat-message.assistant strong {
    color: #1a1a2e;
    font-weight: 600;
}

.ai-suggestion-actions {
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px dashed #c0c8e0;
}

/* ==================== 批次2: 线索详情页样式 ==================== */
.detail-page {
    padding: 0;
    min-height: calc(100vh - var(--navbar-height));
}

.detail-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 20px;
    background: #fff;
    border-bottom: 1px solid #eee;
    position: sticky;
    top: 0;
    z-index: 10;
}

.detail-topbar-center {
    display: flex;
    align-items: center;
    gap: 8px;
}

.detail-topbar-name {
    font-size: 18px;
    font-weight: 600;
    color: var(--dark);
}

.detail-topbar-actions {
    display: flex;
    gap: 8px;
}

.detail-layout {
    display: grid;
    grid-template-columns: 340px 1fr;
    gap: 20px;
    padding: 20px;
    max-width: 1200px;
}

.detail-left {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.detail-right {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.detail-card {
    background: #fff;
    border-radius: 10px;
    border: 1px solid #eee;
    overflow: hidden;
}

.detail-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: #fafbfc;
    border-bottom: 1px solid #f0f0f0;
}

.detail-card-header h3 {
    font-size: 14px;
    font-weight: 600;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--dark);
}

.detail-card-body {
    padding: 14px 16px;
}

/* 信息网格 */
.info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.info-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.info-label {
    font-size: 11px;
    color: var(--gray);
}

.info-value {
    font-size: 13px;
    color: var(--dark);
    word-break: break-all;
}

/* 协作信息 */
.coop-info {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.coop-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 0;
    border-bottom: 1px solid #f5f5f5;
}

.coop-row:last-child {
    border-bottom: none;
}

.coop-label {
    font-size: 12px;
    color: var(--gray);
}

.coop-value {
    font-size: 13px;
    font-weight: 500;
}

/* AI推荐卡片 */
.ai-next-card {
    border-left: 3px solid #1890ff;
}

.ai-suggestion-text {
    font-size: 14px;
    line-height: 1.7;
    color: var(--dark);
    padding: 4px 0;
}

.ai-urgency {
    margin-right: 4px;
}

.ai-action-btn {
    border-radius: 6px !important;
    font-size: 13px !important;
}

/* ==================== 批次2: 时间轴样式 ==================== */
.timeline {
    position: relative;
    padding-left: 20px;
}

.timeline-item {
    position: relative;
    padding-bottom: 20px;
    padding-left: 20px;
}

.timeline-item:last-child {
    padding-bottom: 0;
}

.timeline-dot {
    position: absolute;
    left: -6px;
    top: 4px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid #fff;
    box-shadow: 0 0 0 2px rgba(0,0,0,0.1);
    z-index: 1;
}

.timeline-line {
    position: absolute;
    left: 0;
    top: 16px;
    bottom: 0;
    width: 2px;
    background: #e9ecef;
}

.timeline-item.latest .timeline-dot {
    width: 14px;
    height: 14px;
    left: -7px;
    box-shadow: 0 0 0 3px rgba(24, 144, 255, 0.2);
}

.timeline-item.latest .timeline-line {
    background: linear-gradient(to bottom, #1890ff, #e9ecef);
}

.timeline-content {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 10px 14px;
}

.timeline-item.latest .timeline-content {
    background: #f0f5ff;
    border: 1px solid #d6e4ff;
}

.timeline-header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
}

.timeline-icon {
    font-size: 14px;
}

.timeline-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--dark);
    flex: 1;
}

.timeline-time {
    font-size: 11px;
    color: var(--gray);
    white-space: nowrap;
}

.timeline-detail {
    font-size: 13px;
    color: #555;
    line-height: 1.5;
    margin: 4px 0;
}

.timeline-meta {
    font-size: 11px;
    color: var(--gray);
    margin-top: 4px;
}

/* ==================== 批次2: 待办增强样式 ==================== */
.task-section {
    margin-bottom: 12px;
}

.task-section-header {
    font-size: 12px;
    font-weight: 600;
    color: var(--gray);
    padding: 6px 0 4px;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.task-section-urgent .task-section-header {
    color: var(--danger);
}

.task-item.task-urgent {
    background: #fff5f5;
    border-radius: 6px;
    padding: 8px 10px;
}

.task-action-urgent {
    background: var(--danger) !important;
    color: #fff !important;
    border: none !important;
}

/* ==================== 批次2: 导航Badge样式 ==================== */
.nav-badge {
    display: none;
    min-width: 18px;
    height: 18px;
    line-height: 18px;
    text-align: center;
    font-size: 10px;
    font-weight: 600;
    color: #fff;
    background: var(--danger);
    border-radius: 9px;
    padding: 0 4px;
    margin-left: 4px;
}

/* ==================== 批次2: AI气泡优化 ==================== */
.ai-chat-message.assistant {
    max-width: 80%;
    background: linear-gradient(135deg, #f0f4ff, #f8faff);
    border-radius: 12px 12px 12px 4px;
    padding: 14px 18px;
    margin: 8px 0;
    line-height: 1.7;
    word-break: break-word;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

.ai-chat-message.user {
    max-width: 70%;
    background: linear-gradient(135deg, var(--primary), var(--primary-dark));
    color: #fff;
    border-radius: 12px 12px 4px 12px;
    padding: 10px 14px;
    margin: 8px 0 8px auto;
    text-align: left;
    word-break: break-word;
    font-size: 14px;
}

/* AI消息内的分隔线美化 */
.ai-chat-message.assistant hr {
    border: none;
    border-top: 1px solid #e0e5f0;
    margin: 12px 0;
}

/* AI消息内的引用块美化 */
.ai-chat-message.assistant blockquote {
    border-left: 3px solid #1890ff;
    padding: 8px 12px;
    margin: 10px 0;
    background: rgba(24, 144, 255, 0.05);
    border-radius: 0 6px 6px 0;
    color: #555;
    font-style: normal;
}

/* AI消息内的列表缩进优化 */
.ai-chat-message.assistant ul,
.ai-chat-message.assistant ol {
    margin: 6px 0;
    padding-left: 22px;
}

.ai-chat-message.assistant li {
    margin: 4px 0;
    line-height: 1.7;
}

/* AI建议按钮美化 */
.ai-apply-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 14px;
    background: linear-gradient(135deg, #1890ff, #096dd9);
    color: #fff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 12px;
    transition: all 0.2s;
}

.ai-apply-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(24, 144, 255, 0.3);
}

.ai-suggestion-count {
    font-size: 11px;
    color: var(--gray);
    margin-left: 8px;
}

/* ==================== 响应式 ==================== */
@media (max-width: 768px) {
    .detail-layout {
        grid-template-columns: 1fr;
    }
}

/* ==================== T02: 权限管理页样式 ==================== */

/* Tab 切换 */
.perm-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 20px;
    border-bottom: 2px solid var(--gray-light);
}

.perm-tab {
    padding: 10px 24px;
    font-size: 14px;
    font-weight: 500;
    color: var(--gray);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all 0.2s;
}

.perm-tab:hover {
    color: var(--primary);
}

.perm-tab.active {
    color: var(--primary);
    border-bottom-color: var(--primary);
    font-weight: 600;
}

/* 矩阵工具栏 */
.perm-matrix-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

.perm-hint {
    font-size: 12px;
    color: var(--gray);
}

.perm-hint i {
    color: var(--secondary);
    margin-right: 4px;
}

/* 矩阵表格容器 */
.perm-matrix-wrapper {
    overflow-x: auto;
    background: var(--white);
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}

/* 权限矩阵表格 */
.perm-matrix-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}

.perm-matrix-table th {
    background: #f8f9fa;
    padding: 8px 10px;
    text-align: center;
    font-weight: 600;
    color: var(--gray);
    border-bottom: 2px solid var(--gray-light);
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 1;
}

.perm-th-module {
    min-width: 80px;
}

.perm-th-perm {
    min-width: 160px;
    text-align: left;
}

.perm-th-role {
    min-width: 70px;
}

/* 模块分组头 */
.perm-module-header {
    background: #f0f7ff;
    font-weight: 700;
    font-size: 13px;
    color: var(--dark);
    text-align: center;
    vertical-align: middle;
    border-right: 2px solid #d6e4ff;
    padding: 6px 8px;
    writing-mode: horizontal-tb;
}

/* 权限项单元格 */
.perm-perm-cell {
    padding: 5px 10px;
    border-bottom: 1px solid #f0f0f0;
}

.perm-code {
    display: inline-block;
    font-family: 'SF Mono', 'Fira Code', monospace;
    font-size: 11px;
    color: var(--secondary-dark);
    background: var(--secondary-light);
    padding: 1px 6px;
    border-radius: 3px;
    margin-right: 6px;
}

.perm-name {
    font-size: 12px;
    color: var(--dark);
}

/* 权限状态单元格 */
.perm-cell {
    text-align: center;
    padding: 5px 8px;
    border-bottom: 1px solid #f0f0f0;
    cursor: pointer;
    transition: background 0.15s;
    user-select: none;
}

.perm-cell:hover {
    background: #fef9f0;
}

.perm-cell-yes {
    background: #f0fff0;
}

.perm-cell-no {
    background: #fff8f8;
}

.perm-cell-na {
    color: #ccc;
    background: #fafafa;
}

.perm-cell-locked {
    cursor: default;
    background: #e8f5e9;
}

.perm-cell-locked:hover {
    background: #e8f5e9;
}

/* 来源列 */
.perm-source-cell {
    font-size: 11px;
    padding: 5px 8px;
    border-bottom: 1px solid #f0f0f0;
    text-align: center;
}

/* 覆盖项高亮 */
.perm-override-add {
    background: #e8f5e9 !important;
    font-weight: 600;
}

.perm-override-remove {
    background: #fde8e8 !important;
    font-weight: 600;
}

/* 用户权限调整布局 */
.perm-user-layout {
    display: flex;
    gap: 20px;
    min-height: 500px;
}

.perm-user-list {
    width: 220px;
    flex-shrink: 0;
    background: var(--white);
    border-radius: 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    overflow: hidden;
}

.perm-user-list-header {
    padding: 12px 16px;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark);
    background: #f8f9fa;
    border-bottom: 1px solid #eee;
}

.perm-user-list-body {
    max-height: 600px;
    overflow-y: auto;
}

.perm-user-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    font-size: 13px;
    cursor: pointer;
    transition: background 0.15s;
    border-bottom: 1px solid #f5f5f5;
}

.perm-user-item:hover {
    background: #f5f6fa;
}

.perm-user-item.active {
    background: #e0f7fb;
    font-weight: 600;
}

.perm-user-name {
    color: var(--dark);
}

.perm-user-role {
    margin-left: auto;
    font-size: 11px;
    color: var(--gray);
}

/* 权限详情区 */
.perm-detail {
    flex: 1;
    min-width: 0;
    background: var(--white);
    border-radius: 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    padding: 20px;
}

.perm-detail-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    color: var(--gray);
    gap: 12px;
}

.perm-detail-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid #eee;
}

.perm-detail-header h3 {
    font-size: 18px;
    color: var(--dark);
    margin: 0 0 4px;
}

.perm-detail-section {
    margin-bottom: 24px;
}

.perm-detail-section h4 {
    font-size: 14px;
    color: var(--dark);
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.perm-detail-hint {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
    font-size: 12px;
}

.perm-legend {
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--gray);
}

.perm-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 2px;
}

.perm-dot-yes { background: #e8e8e8; }
.perm-dot-add { background: #28a745; }
.perm-dot-remove { background: #dc3545; }

/* 用户矩阵紧凑 */
.perm-user-matrix {
    font-size: 11px;
}

.perm-user-matrix .perm-perm-cell {
    padding: 3px 8px;
}

.perm-user-matrix .perm-cell {
    padding: 3px 6px;
    cursor: default;
}

.perm-user-matrix .perm-cell:hover {
    background: inherit;
}

/* 个性化调整 */
.perm-adjust-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    font-size: 13px;
}

.perm-adjust-row label {
    min-width: 140px;
    color: var(--dark);
    font-weight: 500;
}

.perm-adjust-actions {
    display: flex;
    gap: 10px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #eee;
}

/* 覆盖项chips */
.perm-current-overrides {
    margin-top: 16px;
    padding: 12px;
    background: #fafbfc;
    border-radius: 8px;
}

.perm-current-overrides h5 {
    font-size: 13px;
    margin: 0 0 8px;
    color: var(--dark);
}

.perm-override-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.perm-override-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 16px;
    font-size: 11px;
    font-weight: 500;
}

.perm-override-chip i {
    cursor: pointer;
    margin-left: 4px;
    opacity: 0.5;
    transition: opacity 0.2s;
}

.perm-override-chip i:hover {
    opacity: 1;
    color: var(--danger);
}

.chip-add {
    background: #d4edda;
    color: #155724;
}

.chip-remove {
    background: #f8d7da;
    color: #721c24;
}

/* 响应式：权限管理页 */
@media (max-width: 768px) {
    .perm-user-layout {
        flex-direction: column;
    }
    .perm-user-list {
        width: 100%;
    }
}

/* ==================== T03: 转介绍模块样式 ==================== */

/* 转介绍卡片列表 */
.referral-cards {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.referral-card {
    background: var(--white);
    border-radius: 10px;
    padding: 16px 20px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    display: flex;
    align-items: flex-start;
    gap: 16px;
    transition: all 0.2s ease;
    cursor: pointer;
    border-left: 4px solid var(--gray-light);
}

.referral-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}

.referral-card.referral-status-pending { border-left-color: #adb5bd; }
.referral-card.referral-status-following { border-left-color: #007bff; }
.referral-card.referral-status-trial { border-left-color: #fd7e14; }
.referral-card.referral-status-deal { border-left-color: #28a745; }
.referral-card.referral-status-invalid { border-left-color: #dc3545; opacity: 0.7; }
.referral-card.referral-status-rewarded { border-left-color: #6f42c1; }

.referral-card-main {
    flex: 1;
    min-width: 0;
}

.referral-card-row1 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.referral-names {
    font-size: 15px;
    font-weight: 600;
    color: var(--dark);
}

.referral-card-row1 .status-badge {
    margin-left: auto;
}

.referral-card-row2 {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 13px;
    color: var(--gray);
    margin-bottom: 6px;
}

.referral-card-row2 i {
    margin-right: 4px;
    width: 14px;
    text-align: center;
}

.referral-card-row3 {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 12px;
    color: #888;
    margin-bottom: 4px;
}

.referral-card-row3 i {
    margin-right: 3px;
}

.referral-card-row4 {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    color: #aaa;
}

.referral-card-row4 i {
    margin-right: 3px;
}

.entry-tag {
    background: var(--secondary-light);
    color: var(--secondary-dark);
    padding: 1px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 500;
}

.referral-card-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex-shrink: 0;
    min-width: 90px;
}

.referral-card-actions .btn {
    width: 100%;
    font-size: 12px;
    padding: 5px 10px;
    border-radius: 6px;
}

/* 状态标签颜色 */
.status-badge.referral-status-pending { background: #e9ecef; color: #6c757d; }
.status-badge.referral-status-following { background: #cce5ff; color: #004085; }
.status-badge.referral-status-trial { background: #fff3cd; color: #856404; }
.status-badge.referral-status-deal { background: #d4edda; color: #155724; font-weight: 600; }
.status-badge.referral-status-invalid { background: #f8d7da; color: #721c24; }
.status-badge.referral-status-rewarded { background: #e2d9f3; color: #6f42c1; font-weight: 600; }

/* 详情页状态步骤条 */
.referral-stepper {
    display: flex;
    align-items: flex-start;
    padding: 10px 0;
    overflow-x: auto;
}

.stepper-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 70px;
    flex: 1;
}

.stepper-circle {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 600;
    border: 2px solid #ddd;
    background: var(--white);
    color: #ccc;
    transition: all 0.3s;
}

.stepper-label {
    font-size: 12px;
    margin-top: 8px;
    color: var(--gray);
    white-space: nowrap;
    text-align: center;
}

.stepper-line {
    flex: 1;
    height: 3px;
    background: #e9ecef;
    margin-top: 18px;
    min-width: 20px;
    border-radius: 2px;
    transition: background 0.3s;
}

.stepper-line.line-done {
    background: var(--success);
}

/* 步骤状态 */
.stepper-step.step-done .stepper-circle {
    background: var(--success);
    border-color: var(--success);
    color: var(--white);
}

.stepper-step.step-done .stepper-label {
    color: var(--success);
    font-weight: 500;
}

.stepper-step.step-active .stepper-circle {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--white);
    box-shadow: 0 0 0 4px rgba(241, 141, 36, 0.2);
    animation: pulse 2s infinite;
}

.stepper-step.step-active .stepper-label {
    color: var(--primary);
    font-weight: 600;
}

.stepper-step.step-todo .stepper-circle {
    background: var(--white);
    border-color: #ddd;
    color: #ccc;
}

.stepper-step.step-todo .stepper-label {
    color: #ccc;
}

/* 响应式：转介绍模块 */
@media (max-width: 768px) {
    .referral-card {
        flex-direction: column;
    }
    .referral-card-actions {
        flex-direction: row;
        min-width: auto;
        width: 100%;
        padding-top: 10px;
        border-top: 1px solid var(--gray-light);
    }
    .referral-card-actions .btn {
        flex: 1;
    }
    .referral-stepper {
        padding: 10px 0;
    }
    .stepper-step {
        min-width: 56px;
    }
    .stepper-circle {
        width: 30px;
        height: 30px;
        font-size: 11px;
    }
    .stepper-label {
        font-size: 10px;
    }
}

/* ==================== T04: 续费扩科模块样式 ==================== */

/* Tab切换 */
.renewal-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 20px;
    border-bottom: 2px solid var(--gray-light);
}

.renewal-tab {
    padding: 12px 28px;
    font-size: 15px;
    font-weight: 500;
    color: var(--gray);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 8px;
}

.renewal-tab:hover {
    color: var(--primary);
}

.renewal-tab.active {
    color: var(--primary);
    border-bottom-color: var(--primary);
    font-weight: 600;
}

.tab-content-area {
    animation: fadeIn 0.2s ease;
}

/* 看板统计卡片 */
.renewal-stats-row {
    display: flex;
    gap: 16px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.renewal-stat-card {
    background: var(--white);
    border-radius: 10px;
    padding: 16px 20px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1;
    min-width: 150px;
    transition: all 0.2s;
}

.renewal-stat-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    transform: translateY(-1px);
}

.renewal-stat-icon {
    font-size: 28px;
    flex-shrink: 0;
}

.renewal-stat-body {
    flex: 1;
}

.renewal-stat-count {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.1;
}

.renewal-stat-label {
    font-size: 13px;
    color: var(--gray);
    margin-top: 2px;
}

/* 筛选栏增强 */
.renewal-filter-bar {
    margin-bottom: 16px;
}

/* 评分详情展开面板 */
.renewal-detail-panel {
    background: #fafbfc;
    border-radius: 10px;
    padding: 20px 24px;
    margin: 8px 0;
    border: 1px solid #e8e8e8;
}

.renewal-detail-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e8e8e8;
}

.renewal-detail-info strong {
    font-size: 16px;
    color: var(--dark);
}

.renewal-detail-score {
    font-size: 20px;
    font-weight: 700;
}

/* 6维进度条 */
.renewal-dimensions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 24px;
}

.renewal-dimension-item {
    display: flex;
    align-items: center;
    gap: 10px;
}

.renewal-dimension-label {
    min-width: 70px;
    font-size: 13px;
    color: var(--dark);
    font-weight: 500;
    text-align: right;
}

.renewal-dimension-bar-bg {
    flex: 1;
    height: 14px;
    background: #eee;
    border-radius: 7px;
    overflow: hidden;
}

.renewal-dimension-bar {
    height: 100%;
    border-radius: 7px;
    transition: width 0.5s ease;
    min-width: 2px;
}

.renewal-dimension-value {
    min-width: 40px;
    font-size: 12px;
    color: var(--gray);
    font-weight: 600;
}

/* 课消记录 */
.renewal-lesson-section {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid #e8e8e8;
}

.renewal-lesson-section h4 {
    font-size: 14px;
    color: var(--dark);
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.renewal-lesson-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.renewal-lesson-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 12px;
    background: var(--white);
    border-radius: 6px;
    font-size: 13px;
    border: 1px solid #f0f0f0;
}

.renewal-lesson-period {
    min-width: 70px;
    font-weight: 600;
    color: var(--dark);
}

.renewal-lesson-course {
    min-width: 80px;
    color: var(--secondary-dark);
}

.renewal-lesson-nums {
    color: var(--gray);
}

/* 设置弹窗 */
.renewal-setting-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.renewal-setting-row label {
    min-width: 120px;
    font-size: 14px;
    color: var(--dark);
    font-weight: 500;
}

.renewal-weight-input {
    width: 80px;
    padding: 6px 10px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 14px;
    text-align: center;
    font-family: var(--font-family);
}

.renewal-weight-input:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 2px rgba(241, 141, 36, 0.15);
    outline: none;
}

.renewal-weight-unit {
    font-size: 13px;
    color: var(--gray);
}

.renewal-weight-total {
    margin-top: 12px;
    padding: 10px 14px;
    background: #f8f9fa;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    color: var(--dark);
}

/* 扩科推荐卡片 */
.expansion-cards {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.expansion-card {
    background: var(--white);
    border-radius: 10px;
    padding: 16px 20px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    display: flex;
    align-items: flex-start;
    gap: 16px;
    transition: all 0.2s ease;
    border-left: 4px solid var(--secondary);
}

.expansion-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}

.expansion-card-main {
    flex: 1;
    min-width: 0;
}

.expansion-card-row1 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.expansion-card-row1 .status-badge {
    margin-left: auto;
}

.expansion-student-name {
    font-size: 16px;
    font-weight: 600;
    color: var(--dark);
}

.expansion-card-row2 {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: var(--dark);
    margin-bottom: 6px;
    flex-wrap: wrap;
}

.expansion-card-row2 i {
    color: var(--gray);
    font-size: 13px;
}

.expansion-card-row2 .fa-arrow-right {
    color: var(--primary);
    font-weight: bold;
}

.expansion-card-row2 strong {
    color: var(--secondary-dark);
}

.expansion-card-row3 {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 12px;
    color: #888;
}

.expansion-card-row3 i {
    margin-right: 3px;
}

.expansion-reason {
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.expansion-card-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex-shrink: 0;
    min-width: 90px;
}

.expansion-card-actions .btn {
    width: 100%;
    font-size: 12px;
    padding: 5px 10px;
    border-radius: 6px;
}

/* 老师评估下拉框 */
.renewal-eval-select {
    cursor: pointer;
    transition: border-color 0.2s;
}

.renewal-eval-select:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 2px rgba(241, 141, 36, 0.15);
    outline: none;
}

/* ==================== 排课模块 ==================== */

/* Tab切换（v7.1全面接管） */

/* 统计badge */
.schedule-stat {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 12px;
    background: #e3f2fd;
    color: #1565c0;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 500;
}

/* ==================== 周课表网格 ==================== */
.weekly-grid {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
}

/* 表头 */
.weekly-grid-header {
    display: grid;
    grid-template-columns: 70px repeat(7, 1fr);
    background: #f8f9fa;
    border-bottom: 2px solid #e0e0e0;
    position: sticky;
    top: 0;
    z-index: 2;
}
.weekly-time-col {
    padding: 10px 6px;
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    color: #666;
    border-right: 1px solid #e8e8e8;
}
.weekly-day-col {
    padding: 10px 4px;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    border-right: 1px solid #e8e8e8;
}
.weekly-day-col:last-child {
    border-right: none;
}
.weekly-day-small {
    font-size: 11px;
    font-weight: 400;
    color: #999;
    display: block;
    margin-top: 2px;
}

/* 表格体 — 单一grid容器 */
.weekly-grid-body {
    position: relative;
    overflow-y: auto;
    max-height: 70vh;
    background:
        /* 横向交替行色 */
        repeating-linear-gradient(
            to bottom,
            #fff 0px, #fff 18px,
            #f9fafb 18px, #f9fafb 36px
        ),
        /* 竖向列分隔线（7列，不含时间列） */
        linear-gradient(to right,
            transparent 0px, transparent 70px,
            #e8e8e8 70px, #e8e8e8 71px,
            transparent 71px
        );
    border-left: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
}

/* 网格背景单元格 — 仅用于提供点击区域和交替色 */
.weekly-bg-cell {
    pointer-events: none;
    z-index: 0;
}

/* 时间标签 */
.weekly-time-cell {
    padding: 4px 6px;
    text-align: center;
    font-size: 11px;
    color: #999;
    background: #f8f8f8;
    border-right: 1px solid #e0e0e0;
    border-bottom: 1px solid #e8e8e8;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
}

/* 课表单元格（背景格上方的卡片） */
.weekly-cell {
    border-right: 1px solid #f0f0f0;
    min-height: 100%;
    z-index: 1;
}
.weekly-cell:last-child {
    border-right: none;
}

/* 排课卡片 */
.weekly-cell.schedule-cell {
    cursor: pointer;
    transition: transform 0.15s, box-shadow 0.15s;
    z-index: 1;
}
.weekly-cell.schedule-cell:hover {
    transform: scale(1.02);
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    z-index: 10;
}

/* 模态框按钮栏 */
.modal-buttons {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #e8e8e8;
}

/* 响应式：排课 */
@media (max-width: 768px) {
    .weekly-grid-header {
        font-size: 11px;
    }
    .weekly-time-cell {
        font-size: 10px;
        padding: 2px;
    }
    .weekly-cell.schedule-cell {
        font-size: 9px;
        padding: 1px 2px;
    }
    .schedule-tab {
        padding: 8px 12px;
        font-size: 12px;
    }
}

/* 响应式：续费扩科 */
@media (max-width: 768px) {
    .renewal-stats-row {
        flex-wrap: wrap;
    }
    .renewal-stat-card {
        min-width: calc(50% - 12px);
    }
    .renewal-dimensions {
        grid-template-columns: 1fr;
    }
    .expansion-card {
        flex-direction: column;
    }
    .expansion-card-actions {
        flex-direction: row;
        min-width: auto;
        width: 100%;
        padding-top: 10px;
        border-top: 1px solid var(--gray-light);
    }
    .expansion-card-actions .btn {
        flex: 1;
    }
}

/* ==================== 小艺AI助手 — 浮动按钮 ==================== */

.xiaoyi-fab {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, #1890ff, #096dd9);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 9999;
    box-shadow: 0 4px 16px rgba(24, 144, 255, 0.4);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    user-select: none;
    overflow: hidden;
}

.xiaoyi-fab:hover {
    transform: scale(1.08);
    box-shadow: 0 6px 24px rgba(24, 144, 255, 0.55);
}

.xiaoyi-fab:active {
    transform: scale(0.95);
}

.xiaoyi-fab-icon {
    font-size: 26px;
    line-height: 1;
    transition: opacity 0.3s;
}

.xiaoyi-fab-label {
    position: absolute;
    font-size: 11px;
    font-weight: 600;
    opacity: 0;
    transition: opacity 0.3s;
    white-space: nowrap;
}

.xiaoyi-fab:hover .xiaoyi-fab-icon {
    opacity: 0;
}

.xiaoyi-fab:hover .xiaoyi-fab-label {
    opacity: 1;
}

.xiaoyi-fab-hidden {
    transform: scale(0);
    opacity: 0;
    pointer-events: none;
}

/* ==================== 小艺AI助手 — 遮罩层 ==================== */

.xiaoyi-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: 9997;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.xiaoyi-overlay-visible {
    opacity: 1;
    pointer-events: auto;
}

/* ==================== 小艺AI助手 — 侧滑面板 ==================== */

.xiaoyi-panel {
    position: fixed;
    right: 0;
    top: 0;
    height: 100vh;
    width: 380px;
    max-width: 100vw;
    background: #fff;
    z-index: 9998;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.12);
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
}

.xiaoyi-panel-open {
    transform: translateX(0);
}

/* ==================== 小艺面板 — 头部 ==================== */

.xiaoyi-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    background: linear-gradient(135deg, #1890ff, #096dd9);
    color: #fff;
    flex-shrink: 0;
}

.xiaoyi-panel-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 600;
}

.xiaoyi-panel-title i {
    font-size: 18px;
}

.xiaoyi-panel-header-actions {
    display: flex;
    gap: 4px;
}

.xiaoyi-btn-icon {
    background: rgba(255, 255, 255, 0.2);
    border: none;
    color: #fff;
    width: 30px;
    height: 30px;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    transition: background 0.2s;
}

.xiaoyi-btn-icon:hover {
    background: rgba(255, 255, 255, 0.35);
}

/* ==================== 小艺面板 — 消息区域 ==================== */

.xiaoyi-panel-messages {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    background: #f8f9fb;
}

/* 欢迎区域 */
.xiaoyi-welcome {
    text-align: center;
    padding: 32px 16px;
}

.xiaoyi-welcome-icon {
    font-size: 48px;
    margin-bottom: 16px;
    animation: xiaoyi-float 3s ease-in-out infinite;
}

@keyframes xiaoyi-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

.xiaoyi-welcome p {
    color: #666;
    font-size: 14px;
    line-height: 1.8;
    margin: 0;
}

.xiaoyi-welcome strong {
    color: #1890ff;
    font-weight: 600;
}

.xiaoyi-quick-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 20px;
}

.xiaoyi-quick-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    font-size: 13px;
    color: #333;
    cursor: pointer;
    transition: all 0.2s;
    text-align: left;
}

.xiaoyi-quick-btn:hover {
    background: #e6f7ff;
    border-color: #91d5ff;
    color: #1890ff;
}

.xiaoyi-quick-btn i {
    color: #1890ff;
    width: 16px;
    text-align: center;
}

/* ==================== 小艺面板 — 消息气泡 ==================== */

.xiaoyi-message {
    display: flex;
    gap: 10px;
    margin-bottom: 16px;
    animation: xiaoyi-msg-in 0.3s ease;
}

@keyframes xiaoyi-msg-in {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.xiaoyi-msg-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 600;
    flex-shrink: 0;
    margin-top: 2px;
}

.xiaoyi-msg-user .xiaoyi-msg-avatar {
    background: linear-gradient(135deg, #1890ff, #096dd9);
    color: #fff;
}

.xiaoyi-msg-assistant .xiaoyi-msg-avatar {
    background: #f0f0f0;
    font-size: 18px;
}

.xiaoyi-msg-user {
    flex-direction: row-reverse;
}

.xiaoyi-msg-bubble {
    max-width: 78%;
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 13px;
    line-height: 1.7;
    word-break: break-word;
}

.xiaoyi-msg-user .xiaoyi-msg-bubble {
    background: linear-gradient(135deg, #1890ff, #096dd9);
    color: #fff;
    border-bottom-right-radius: 4px;
}

/* 用户消息内的代码块：深底浅字，确保可读 */
.xiaoyi-msg-user .xiaoyi-msg-content pre {
    background: rgba(0, 0, 0, 0.3);
    color: #e6f7ff;
    border-radius: 6px;
}
.xiaoyi-msg-user .xiaoyi-msg-content code {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
}

.xiaoyi-msg-assistant .xiaoyi-msg-bubble {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-bottom-left-radius: 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.xiaoyi-msg-content {
    /* Markdown rendered content */
}

.xiaoyi-msg-content p {
    margin: 0 0 6px 0;
}

.xiaoyi-msg-content p:last-child {
    margin-bottom: 0;
}

.xiaoyi-msg-content ul,
.xiaoyi-msg-content ol {
    margin: 6px 0;
    padding-left: 18px;
}

.xiaoyi-msg-content li {
    margin-bottom: 3px;
}

.xiaoyi-msg-content code {
    background: rgba(0, 0, 0, 0.06);
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 12px;
    font-family: 'SF Mono', 'Consolas', monospace;
}

.xiaoyi-msg-user .xiaoyi-msg-content code {
    background: rgba(255, 255, 255, 0.2);
}

.xiaoyi-msg-content pre {
    background: #f5f5f5;
    padding: 10px 12px;
    border-radius: 6px;
    overflow-x: auto;
    font-size: 12px;
    margin: 8px 0;
}

.xiaoyi-msg-content pre code {
    background: none;
    padding: 0;
}

.xiaoyi-msg-content strong {
    font-weight: 600;
}

.xiaoyi-msg-content blockquote {
    border-left: 3px solid #1890ff;
    margin: 8px 0;
    padding: 4px 12px;
    color: #555;
    background: rgba(24, 144, 255, 0.04);
    border-radius: 0 4px 4px 0;
}

/* ==================== 小艺消息 — 标题/分割线 ==================== */
.xiaoyi-msg-content h1 { font-size: 17px; font-weight: 700; margin: 14px 0 8px; color: #1a1a1a; }
.xiaoyi-msg-content h2 { font-size: 15px; font-weight: 700; margin: 12px 0 6px; color: #1a1a1a; }
.xiaoyi-msg-content h3 { font-size: 14px; font-weight: 600; margin: 10px 0 5px; color: #333; }
.xiaoyi-msg-content h4 { font-size: 13px; font-weight: 600; margin: 8px 0 4px; color: #555; }
.xiaoyi-msg-content h1:first-child,
.xiaoyi-msg-content h2:first-child,
.xiaoyi-msg-content h3:first-child { margin-top: 0; }

.xiaoyi-msg-content hr {
    border: none;
    border-top: 1px solid #e8e8e8;
    margin: 12px 0;
}

/* ==================== 小艺消息 — Callout高亮卡片 ==================== */
.xiaoyi-callout {
    display: flex;
    gap: 8px;
    margin: 10px 0;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 13px;
    line-height: 1.7;
    align-items: flex-start;
}
.xiaoyi-callout .callout-emoji {
    font-size: 16px;
    flex-shrink: 0;
    line-height: 1.7;
}
.xiaoyi-callout .callout-text {
    flex: 1;
}

/* 💡 提示/建议 — 绿色系 */
.xiaoyi-callout-tip {
    background: #f0faf5;
    border: 1px solid #b7ebd0;
}
.xiaoyi-callout-tip .callout-text { color: #1e6f3e; }

/* ⚠️ 注意事项/警告 — 橙色系 */
.xiaoyi-callout-warning {
    background: #fff8ed;
    border: 1px solid #ffd9a3;
}
.xiaoyi-callout-warning .callout-text { color: #8a4d0f; }

/* 📊 数据/分析 — 蓝色系 */
.xiaoyi-callout-data {
    background: #f0f5ff;
    border: 1px solid #b7d4ff;
}
.xiaoyi-callout-data .callout-text { color: #1a4578; }

/* ℹ️ 补充信息 — 灰色系 */
.xiaoyi-callout-info {
    background: #f5f5f5;
    border: 1px solid #ddd;
}
.xiaoyi-callout-info .callout-text { color: #555; }

/* 🎯 行动建议 — 紫色系 */
.xiaoyi-callout-action {
    background: #f8f0ff;
    border: 1px solid #d4b8ff;
}
.xiaoyi-callout-action .callout-text { color: #5e2d91; }

/* ==================== 小艺消息 — 淡化文字 ==================== */
.xiaoyi-muted {
    color: #aaa;
    font-size: 12px;
}

/* ==================== 小艺消息 — emoji放大 ==================== */
.xiaoyi-msg-content .emoji-lg {
    font-size: 18px;
    vertical-align: -2px;
}

.xiaoyi-msg-time {
    font-size: 10px;
    margin-top: 4px;
    opacity: 0.6;
}

.xiaoyi-msg-user .xiaoyi-msg-time {
    color: rgba(255, 255, 255, 0.7);
    text-align: right;
}

.xiaoyi-msg-assistant .xiaoyi-msg-time {
    color: #999;
}

/* ==================== 小艺面板 — 加载状态 ==================== */

.xiaoyi-panel-status {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 16px;
    color: #1890ff;
    font-size: 13px;
    background: #e6f7ff;
    border-top: 1px solid #bae7ff;
    flex-shrink: 0;
}

/* ==================== 小艺面板 — 输入区域 ==================== */

.xiaoyi-panel-input {
    display: flex;
    align-items: flex-end;
    gap: 6px;
    padding: 12px 16px;
    border-top: 1px solid #f0f0f0;
    background: #fff;
    flex-shrink: 0;
}

.xiaoyi-panel-input textarea {
    flex: 1;
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 13px;
    font-family: inherit;
    resize: none;
    outline: none;
    line-height: 1.5;
    max-height: 120px;
    transition: border-color 0.2s;
}

.xiaoyi-panel-input textarea:focus {
    border-color: #1890ff;
    box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.1);
}

.xiaoyi-panel-input textarea::placeholder {
    color: #bbb;
}

.xiaoyi-btn-send {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: none;
    background: linear-gradient(135deg, #1890ff, #096dd9);
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    flex-shrink: 0;
    transition: all 0.2s;
}

.xiaoyi-btn-send:hover {
    transform: scale(1.08);
    box-shadow: 0 2px 8px rgba(24, 144, 255, 0.35);
}

.xiaoyi-btn-send:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

/* ==================== 语音按钮 ==================== */

.xiaoyi-btn-voice {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: none;
    background: #f5f5f5;
    color: #666;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    flex-shrink: 0;
    transition: all 0.2s;
}

.xiaoyi-btn-voice:hover {
    background: #e8e8e8;
    color: #1890ff;
}

/* 录音激活状态 */
.xiaoyi-voice-active {
    background: #ff4d4f !important;
    color: #fff !important;
    animation: xiaoyi-pulse 1.2s ease-in-out infinite;
}

@keyframes xiaoyi-pulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(255, 77, 79, 0.5);
    }
    50% {
        box-shadow: 0 0 0 10px rgba(255, 77, 79, 0);
    }
}

/* ==================== 响应式：小艺面板 ==================== */

@media (max-width: 480px) {
    .xiaoyi-panel {
        width: 100vw;
    }

    .xiaoyi-fab {
        bottom: 16px;
        right: 16px;
        width: 48px;
        height: 48px;
    }

    .xiaoyi-fab-icon {
        font-size: 22px;
    }

    .xiaoyi-panel-header {
        padding: 12px 14px;
    }

.xiaoyi-panel-input {
    padding: 10px 12px;
    }
}

/* ==========================================================
   🎨  UI 打磨层 v6.0 — 体系化统一样式
   说明：本层旨在统一全系统的视觉语言，不覆盖已有功能样式。
   位置：放在文件末尾确保最高优先级覆盖已有的零散定义。
   ========================================================== */

/* ---------- 1. 阴影工具类 ---------- */
.shadow-sm { box-shadow: var(--shadow-sm); }
.shadow-md { box-shadow: var(--shadow-md); }
.shadow-lg { box-shadow: var(--shadow-lg); }

/* ---------- 2. 卡片系统 ---------- */
.card {
    background: var(--white);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    transition: box-shadow var(--transition-normal), transform var(--transition-normal);
}
.card:hover {
    box-shadow: var(--shadow-md);
}
.card-clickable {
    cursor: pointer;
}
.card-clickable:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}
.card-bordered {
    border: 1px solid var(--gray-light);
}
.card-active {
    border-left: 4px solid var(--primary);
}

/* ---------- 3. 统一的空状态 ---------- */
.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
}
.empty-state-icon {
    font-size: 48px;
    color: var(--gray-light);
    margin-bottom: 16px;
    opacity: 0.6;
}
.empty-state-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--dark);
    margin-bottom: 8px;
}
.empty-state-desc {
    font-size: 13px;
    color: var(--gray);
    max-width: 300px;
    line-height: 1.6;
    margin-bottom: 20px;
}
.empty-state-action {
    margin-top: 4px;
}

/* ---------- 4. 加载骨架屏 ---------- */
.skeleton {
    background: linear-gradient(90deg, #f0f0f0 25%, #e8e8e8 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer 1.5s ease-in-out infinite;
    border-radius: var(--radius-sm);
}
@keyframes skeleton-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
.skeleton-text {
    height: 14px;
    margin-bottom: 8px;
    width: 80%;
}
.skeleton-text:last-child { width: 50%; }
.skeleton-title {
    height: 20px;
    margin-bottom: 12px;
    width: 60%;
}
.skeleton-card {
    height: 120px;
    border-radius: var(--radius-md);
}

/* ---------- 5. 统一徽章/标签系统 ---------- */
.badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
    line-height: 1.6;
}
.badge-primary {
    background: var(--primary-light);
    color: var(--primary-dark);
}
.badge-secondary {
    background: var(--secondary-light);
    color: var(--secondary-dark);
}
.badge-success {
    background: #e8f5e9;
    color: #2e7d32;
}
.badge-warning {
    background: #fff8e1;
    color: #f57f17;
}
.badge-danger {
    background: #fde8e8;
    color: #c62828;
}
.badge-info {
    background: #e3f2fd;
    color: #1565c0;
}
.badge-neutral {
    background: #f5f5f5;
    color: #666;
}

/* 等级颜色（A/B/C/D类） */
.grade-a { color: var(--danger); border-color: var(--danger); }
.grade-b { color: var(--primary); border-color: var(--primary); }
.grade-c { color: var(--secondary); border-color: var(--secondary); }
.grade-d { color: var(--gray); border-color: var(--gray); }

/* 成交Tab颜色 */
.deal-tab-course.active {
    border-bottom-color: var(--secondary);
    color: var(--secondary) !important;
    font-weight: 600 !important;
}
.deal-tab-instrument.active {
    border-bottom-color: #ff9800;
    color: #ff9800 !important;
    font-weight: 600 !important;
}

/* 成交Tab基础样式（替换inline重复） */
.deal-tab {
    padding: 8px 20px;
    border: none;
    background: none;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: #666;
    border-bottom: 3px solid transparent;
    transition: all var(--transition-fast);
}
.deal-tab:hover {
    color: var(--dark);
    background: rgba(0,0,0,0.02);
}
.deal-tab.active {
    font-weight: 600;
}

/* 成交类型标签 */
.type-tag {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 11px;
    color: #fff;
    margin-right: 6px;
}
.type-tag-course { background: var(--secondary); }
.type-tag-instrument { background: #ff9800; }

/* 成交类型选择框 */
.type-radio-label {
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    padding: 6px 12px;
    border: 2px solid #ddd;
    border-radius: var(--radius-sm);
    transition: all var(--transition-fast);
}
.type-radio-label:hover {
    border-color: var(--gray);
}
.type-radio-label.selected-course {
    border-color: var(--secondary);
    background: var(--secondary-light);
}
.type-radio-label.selected-instrument {
    border-color: #ff9800;
    background: #fff3e0;
}

/* 库存标识 */
.stock-badge { color: var(--success); }

/* 乐器提成标识 */
.comm-instrument { color: #ff9800; }

/* 进度条颜色 */
.progress-bar-bg {
    flex: 1; height: 4px; background: #e0e0e0; border-radius: 2px; overflow: hidden;
}
.progress-bar-fill {
    height: 100%; border-radius: 2px; transition: width 0.3s ease;
}
.progress-bar-fill.done { background: var(--success); }
.progress-bar-fill.pending { background: var(--secondary); }

/* 章节标题带色下划线 */
.section-header-primary {
    margin: 0 0 8px 0;
    font-size: 14px;
    color: var(--dark);
    border-bottom: 2px solid var(--secondary);
    padding-bottom: 4px;
}

/* 带accent-color的checkbox统一 */
.checkbox-accent {
    width: 16px; height: 16px;
    accent-color: var(--secondary);
}

/* 活动统计颜色类 */
.stat-card-danger { border-left: 4px solid var(--danger); }
.stat-card-danger .stat-val { color: var(--danger); }
.stat-card-success { border-left: 4px solid var(--success); }
.stat-card-success .stat-val { color: var(--success); }
.stat-card-purple { border-left: 4px solid #9c27b0; }
.stat-card-purple .stat-val { color: #9c27b0; }

/* 活动模板作用域标签 */
.scope-tag {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 8px;
    font-size: 11px;
    color: #fff;
    margin-left: 6px;
}
.scope-hq { background: var(--danger); }
.scope-campus { background: var(--primary); }
.scope-team { background: var(--secondary); }
.scope-individual { background: var(--success); }

/* 活动参与人角色圆点 */
.role-dot {
    display: inline-block;
    width: 8px; height: 8px;
    border-radius: 50%;
}
.role-planner { background: #e91e63; }
.role-approver { background: #ff9800; }
.role-participant { background: var(--secondary); }

/* 活动参与人角色文字色 */
.role-text-planner { color: #e91e63; }
.role-text-approver { color: #ff9800; }
.role-text-participant { color: var(--secondary); }

/* 排课模块徽章 */
.badge-blue { background: #e3f2fd; color: #1565c0; }
.badge-purple { background: #f3e5f5; color: #7b1fa2; }
.badge-orange { background: #fff3e0; color: #e65100; }

/* 冲突严重度颜色 */
.severity-high { color: var(--danger); border-left-color: var(--danger); }
.severity-medium { color: var(--primary); border-left-color: var(--primary); }
.severity-low { color: #ffa000; border-left-color: #ffa000; }

/* 冲突检测结果 */
.conflict-alert {
    background: #fff3e0; border: 1px solid #ffcc02; border-radius: var(--radius-sm); padding: 8px 12px;
}
.conflict-clear {
    background: #e8f5e9; border: 1px solid var(--success); border-radius: var(--radius-sm);
    padding: 8px 12px; color: #2e7d32; font-weight: 500;
}
.conflict-item {
    font-size: 12px; margin: 3px 0; padding: 4px 8px; background: #fff;
    border-radius: 4px; border-left: 3px solid;
}

/* ---------- 6. 统一定义：副按钮/文本按钮/危险按钮 ---------- */
.btn-secondary {
    background: var(--secondary);
    color: var(--white);
}
.btn-secondary:hover {
    background: var(--secondary-dark);
    box-shadow: 0 2px 8px rgba(20, 158, 187, 0.3);
    transform: translateY(-1px);
}
.btn-outline-primary {
    background: transparent;
    color: var(--primary);
    border: 1px solid var(--primary);
}
.btn-outline-primary:hover {
    background: var(--primary-light);
    border-color: var(--primary-dark);
}
.btn-outline-secondary {
    background: transparent;
    color: var(--secondary);
    border: 1px solid var(--secondary);
}
.btn-outline-secondary:hover {
    background: var(--secondary-light);
    border-color: var(--secondary-dark);
}
.btn-outline-default {
    background: transparent;
    color: var(--dark);
    border: 1px solid #ddd;
}
.btn-outline-default:hover {
    background: #f8f9fa;
    border-color: #ccc;
}
.btn-ghost {
    background: transparent;
    color: var(--gray);
    border: none;
}
.btn-ghost:hover {
    background: #f5f5f5;
    color: var(--dark);
}
.btn-danger {
    background: var(--danger);
    color: var(--white);
}
.btn-danger:hover {
    background: #c82333;
    box-shadow: 0 2px 8px rgba(220, 53, 69, 0.3);
    transform: translateY(-1px);
}
.btn-sm {
    padding: 5px 10px;
    font-size: 12px;
}
.btn-lg {
    padding: 12px 24px;
    font-size: 16px;
}
/* 所有按钮点击反馈 */
.btn:active {
    transform: scale(0.97);
}

/* ---------- 7. 统一表格增强 ---------- */
.table-enhanced {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 13px;
}
.table-enhanced thead th {
    background: #f8f9fa;
    padding: 12px 14px;
    text-align: left;
    font-weight: 600;
    color: var(--dark);
    border-bottom: 2px solid var(--gray-light);
    position: sticky;
    top: 0;
    z-index: 1;
}
.table-enhanced tbody td {
    padding: 10px 14px;
    border-bottom: 1px solid #f0f0f0;
    color: var(--dark);
    transition: background var(--transition-fast);
}
.table-enhanced tbody tr {
    transition: background var(--transition-fast);
}
.table-enhanced tbody tr:hover td {
    background: #f8f9ff;
}
.table-enhanced tbody tr:nth-child(even) td {
    background: #fafbfc;
}
.table-enhanced tbody tr:nth-child(even):hover td {
    background: #f0f2ff;
}

/* ---------- 8. 统一表单系统 ---------- */
.form-field {
    margin-bottom: 16px;
}
.form-field label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark);
    margin-bottom: 6px;
}
.form-field .hint {
    font-size: 12px;
    color: var(--gray);
    margin-top: 4px;
}
.form-control {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: var(--radius-sm);
    font-size: 14px;
    font-family: var(--font-family);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
    background: var(--white);
}
.form-control:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(241, 141, 36, 0.12);
    outline: none;
}
.form-control.error {
    border-color: var(--danger);
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1);
}
.form-control:disabled {
    background: #f5f5f5;
    color: #999;
    cursor: not-allowed;
}
select.form-control {
    cursor: pointer;
    appearance: auto;
}
textarea.form-control {
    resize: vertical;
    min-height: 60px;
    line-height: 1.6;
}
/* 行内表单组 */
.form-row {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}
.form-row > .form-field {
    flex: 1;
    margin-bottom: 0;
}

/* ---------- 9. 深色侧边栏导航增强 ---------- */
/* 侧边栏导航项微交互 */
.main-sidebar .nav-item {
    position: relative;
    padding: 8px 12px 8px 32px;
    border-radius: var(--radius-sm);
    cursor: pointer;
    color: rgba(255,255,255,0.88);
    font-size: 13px;
    transition: all var(--transition-fast);
    user-select: none;
    display: flex;
    align-items: center;
    gap: 8px;
}
.main-sidebar .nav-item:hover {
    background: rgba(255,255,255,0.12);
    color: #fff;
    transform: translateX(2px);
}
.main-sidebar .nav-item.active {
    background: rgba(255,255,255,0.18);
    color: #fff;
    font-weight: 600;
    box-shadow: inset 3px 0 0 var(--primary);
}
.main-sidebar .nav-item:active {
    transform: scale(0.97);
}
/* 侧边栏分组头（可点击折叠） */
.main-sidebar .nav-group-header {
    color: rgba(255,255,255,0.7);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 12px 12px 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
}
.main-sidebar .nav-group-header:hover {
    color: rgba(255,255,255,0.9);
}

/* 侧边栏二级子菜单头（营收管理） */
.main-sidebar .nav-sub-header {
    color: rgba(255,255,255,0.65);
    font-size: 12px;
    padding: 6px 12px 6px 28px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 6px;
    transition: all 0.2s;
    user-select: none;
}
.main-sidebar .nav-sub-header:hover {
    background: rgba(255,255,255,0.1);
    color: #fff;
}
.main-sidebar .nav-sub-header .nav-sub-arrow {
    margin-left: auto;
    font-size: 10px;
    transition: transform 0.2s;
}
.main-sidebar .nav-sub-header.collapsed .nav-sub-arrow {
    transform: rotate(90deg);
}
/* 侧边栏二级子菜单项 */
.main-sidebar .nav-sub-items {
    padding-left: 8px;
    overflow: hidden;
    transition: max-height 0.3s ease;
    max-height: 300px;
}
.main-sidebar .nav-sub-items.collapsed {
    max-height: 0;
}
.main-sidebar .nav-sub-item {
    padding: 5px 12px 5px 40px !important;
    font-size: 12px !important;
    font-weight: 400 !important;
}
/* 侧边栏分隔线 */
.main-sidebar .nav-divider {
    height: 1px;
    background: rgba(255,255,255,0.08);
    margin: 8px 12px;
}
/* 侧边栏品牌区增强 */
.main-sidebar .brand-area {
    padding: 12px 12px 16px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.main-sidebar .brand-area .brand-icon {
    font-size: 24px;
}
.main-sidebar .brand-area .brand-text {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 1px;
}

/* ---------- 10. 筛选栏统一 ---------- */
.filter-bar-unified {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
    flex-wrap: wrap;
    align-items: center;
}
.filter-bar-unified .form-control {
    padding: 6px 10px;
    font-size: 13px;
    min-width: 140px;
}
.filter-bar-unified .btn {
    flex-shrink: 0;
}
.filter-bar-unified .filter-label {
    font-size: 13px;
    font-weight: 500;
    color: var(--gray);
    white-space: nowrap;
}

/* ---------- 11. 统计卡片统一 ---------- */
.stat-card {
    background: var(--white);
    border-radius: var(--radius-md);
    padding: 16px 20px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1;
    min-width: 150px;
    transition: all var(--transition-normal);
}
.stat-card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}
.stat-card-icon {
    width: 44px;
    height: 44px;
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    flex-shrink: 0;
}
.stat-card-icon.primary { background: var(--primary-light); color: var(--primary); }
.stat-card-icon.secondary { background: var(--secondary-light); color: var(--secondary); }
.stat-card-icon.success { background: #e8f5e9; color: #28a745; }
.stat-card-icon.warning { background: #fff8e1; color: #ffc107; }
.stat-card-icon.danger { background: #fde8e8; color: #dc3545; }
.stat-card-body { flex: 1; }
.stat-card-value {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--dark);
}
.stat-card-label {
    font-size: 13px;
    color: var(--gray);
    margin-top: 2px;
}
.stat-card-trend {
    font-size: 12px;
    font-weight: 600;
    margin-top: 4px;
}
.stat-card-trend.up { color: var(--success); }
.stat-card-trend.down { color: var(--danger); }

/* ---------- 12. 弹窗样式增强 ---------- */
/* .modal-overlay 已统一定义在 L637，禁止在此覆盖 */
.modal-container {
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xl);
}
.modal-header {
    padding: 18px 24px;
}
.modal-body {
    padding: 20px 24px;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
}
.modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 16px 24px;
    border-top: 1px solid var(--gray-light);
    background: #fafbfc;
}
/* 弹窗进入/退出动画增强 */
@keyframes modalIn {
    from {
        opacity: 0;
        transform: translate(-50%, -48%) scale(0.96);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}
/* Toast去重覆盖 — 使用v1.0的样式 + 增强 */
.toast {
    background: var(--white);
    border-radius: 10px;
    padding: 12px 18px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 300px;
    animation: toastIn 0.3s ease;
    border: none;
}
.toast.success { border-left: 4px solid var(--success); }
.toast.error { border-left: 4px solid var(--danger); }
.toast.warning { border-left: 4px solid var(--warning); }
.toast.info { border-left: 4px solid var(--secondary); }

/* ---------- 13. Timeline 去重覆盖 ---------- */
/* 统一使用 v1.3 的 timeline 布局（更灵活） */
.follow-timeline {
    padding-left: 30px;
}
.follow-timeline .timeline-item {
    padding-bottom: 20px;
    display: flex;
    gap: 12px;
}
.timeline-content {
    flex: 1;
    background: var(--white);
    border-radius: var(--radius-md);
    padding: 12px 16px;
    box-shadow: var(--shadow-sm);
    transition: box-shadow var(--transition-fast);
}
.timeline-content:hover {
    box-shadow: var(--shadow-md);
}

/* ---------- 14. 标签/分隔线 ---------- */
.tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 1px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}
.tag-primary { background: var(--primary-light); color: var(--primary-dark); }
.tag-secondary { background: var(--secondary-light); color: var(--secondary-dark); }
.tag-success { background: #e8f5e9; color: #2e7d32; }
.tag-warning { background: #fff8e1; color: #f57f17; }
.tag-danger { background: #fde8e8; color: #c62828; }
.tag-neutral { background: #f0f0f0; color: #666; }

/* ---------- 15. 分割线 ---------- */
.divider {
    border: none;
    height: 1px;
    background: var(--gray-light);
    margin: 16px 0;
}
.divider-dashed {
    border: none;
    border-top: 1px dashed var(--gray-light);
    margin: 16px 0;
}
.divider-text {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--gray);
    font-size: 12px;
    margin: 20px 0;
}
.divider-text::before,
.divider-text::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--gray-light);
}

/* ---------- 16. 工具类 ---------- */
.text-primary { color: var(--primary); }
.text-secondary { color: var(--secondary); }
.text-success { color: var(--success); }
.text-danger { color: var(--danger); }
.text-warning { color: var(--warning); }
.text-muted { color: var(--gray); }
.text-white { color: var(--white); }
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-left { text-align: left; }
.font-bold { font-weight: 700; }
.font-medium { font-weight: 500; }
.font-normal { font-weight: 400; }

.mt-0 { margin-top: 0; }
.mt-1 { margin-top: 4px; }
.mt-2 { margin-top: 8px; }
.mt-3 { margin-top: 12px; }
.mt-4 { margin-top: 16px; }
.mt-5 { margin-top: 24px; }
.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: 4px; }
.mb-2 { margin-bottom: 8px; }
.mb-3 { margin-bottom: 12px; }
.mb-4 { margin-bottom: 16px; }
.mb-5 { margin-bottom: 24px; }
.ml-auto { margin-left: auto; }
.mr-auto { margin-right: auto; }

.p-1 { padding: 4px; }
.p-2 { padding: 8px; }
.p-3 { padding: 12px; }
.p-4 { padding: 16px; }
.p-5 { padding: 24px; }

.gap-1 { gap: 4px; }
.gap-2 { gap: 8px; }
.gap-3 { gap: 12px; }
.gap-4 { gap: 16px; }

.flex { display: flex; }
.flex-col { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.justify-between { justify-content: space-between; }
.justify-center { justify-content: center; }
.flex-1 { flex: 1; }
.flex-shrink-0 { flex-shrink: 0; }
.w-full { width: 100%; }

.truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ---------- 17. 滚动条美化 ---------- */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 3px;
    transition: background 0.2s;
}
::-webkit-scrollbar-thumb:hover {
    background: #aaa;
}
.main-content::-webkit-scrollbar-thumb {
    background: #d0d0d0;
}

/* ---------- 18. 响应式增强 ---------- */
@media (max-width: 768px) {
    .stat-card {
        min-width: calc(50% - 8px);
    }
    .form-row {
        flex-direction: column;
    }
    .filter-bar-unified {
        gap: 6px;
    }
    .filter-bar-unified .form-control {
        min-width: 100px;
    }
    .modal-container {
        min-width: auto;
        width: 95vw;
        max-width: 95vw;
    }
}
@media (max-width: 480px) {
    .stat-card {
        min-width: 100%;
    }
    .page-header-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    .header-actions {
        width: 100%;
        justify-content: flex-end;
    }
}

/* ---------- 19. 排课图例颜色 ---------- */
.legend-swatch-1v1 { display:inline-block;width:12px;height:12px;border-radius:2px;background:#4CAF50;margin-right:4px;vertical-align:middle; }
.legend-swatch-group { display:inline-block;width:12px;height:12px;border-radius:2px;background:#2196F3;margin-right:4px;vertical-align:middle; }
.legend-swatch-class { display:inline-block;width:12px;height:12px;border-radius:2px;background:#FF9800;margin-right:4px;vertical-align:middle; }
.legend-swatch-unlimited { display:inline-block;width:12px;height:12px;border-radius:2px;background:#9C27B0;margin-right:4px;vertical-align:middle; }
.legend-swatch-other { display:inline-block;width:12px;height:12px;border-radius:2px;background:#607D8B;margin-right:4px;vertical-align:middle; }

/* ---------- 20. 冲突检测消息 ---------- */
.msg-error { color:#e65100;font-weight:500; }
.msg-error i { margin-right:4px; }
.msg-warning { color:#ffa000;font-weight:500; }
.msg-warning i { margin-right:4px; }
.msg-info { color:#666; }
.loading-text { color:#666; }
.loading-text i { margin-right:4px; }

/* ---------- 21. 排课详情卡 ---------- */
.detail-card-bg { background:#f5f5f5;border-radius:8px;padding:12px; }

/* ---------- 22. 活动概览统计卡（左边框色） ---------- */
.stat-card-primary { border-left-color:#f18d24 !important; }
.stat-card-info { border-left-color:#149ebb !important; }
.stat-card-green { border-left-color:#28a745 !important; }
.stat-card-danger { border-left-color:#e53935 !important; }
.stat-card-purple { border-left-color:#9c27b0 !important; }
.stat-card-gray { border-left-color:#607D8B !important; }

/* 数字颜色 */
.stat-val-primary { color:#f18d24; }
.stat-val-info { color:#149ebb; }
.stat-val-green { color:#28a745; }
.stat-val-danger { color:#e53935; }
.stat-val-purple { color:#9c27b0; }

/* ---------- 23. 活动迷你统计盒子 ---------- */
.stat-box-primary { background:#fff8f0;border-radius:6px;padding:8px 4px; }
.stat-box-info { background:#f0f9fb;border-radius:6px;padding:8px 4px; }
.stat-box-green { background:#f0faf2;border-radius:6px;padding:8px 4px; }
.stat-box-danger { background:#fdf0f0;border-radius:6px;padding:8px 4px; }
.stat-box-purple { background:#f5f0fa;border-radius:6px;padding:8px 4px; }

/* 迷你统计数字 */
.stat-box-val { font-size:16px;font-weight:700; }
.stat-box-label { color:#999;font-size:12px; }

/* ---------- 24. 活动详情标签栏 ---------- */
.detail-tab-btn { padding:8px 20px;border:none;background:none;font-size:13px;color:#999;border-bottom:2px solid transparent;margin-bottom:-2px;cursor:pointer; }
.detail-tab-btn.active { color:#333;border-bottom-color:#f18d24;font-weight:500; }

/* ---------- 25. 活动概览统计值（综合看板） ---------- */
.stat-dashboard-card { border-radius:8px;padding:16px;text-align:center; }
.stat-dashboard-card .stat-val { font-size:28px;font-weight:700; }
.stat-dashboard-card .stat-label { font-size:12px;color:#666;margin-top:4px; }

/* ---------- 26. 用灰标签、数据项 ---------- */
.label-muted { color:#999;font-weight:normal; }

/* ==================== v7.0: 硬编码色值抽象层 结束 ==================== */

/* ==========================================================
   🎯  UI 打磨层 v7.1 — 页面级UI一致性
   说明：统一各页面中的页头、筛选条、搜索框、Tab切换等页面级模式。
   ========================================================== */

/* ---------- 1. 搜索输入框（带图标） ---------- */
.search-wrapper {
    position: relative;
}
.search-wrapper .search-icon {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #999;
    font-size: 12px;
    pointer-events: none;
}
.search-input {
    padding: 6px 12px 6px 32px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 13px;
    width: 180px;
    font-family: var(--font-family);
    transition: border-color var(--transition-fast);
}
.search-input:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 2px rgba(241, 141, 36, 0.15);
}
.search-input-wide { width: 220px; }
.search-input-narrow { width: 140px; }

/* ---------- 2. 排课Tab栏 ---------- */
.schedule-tabs {
    display: flex;
    gap: 4px;
    margin: 12px 0 16px;
    border-bottom: 2px solid #e8e8e8;
    padding-bottom: 0;
}
.schedule-tab {
    padding: 8px 16px;
    cursor: pointer;
    font-size: 13px;
    color: #666;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all var(--transition-fast);
}
.schedule-tab:hover { color: var(--dark); background: #f8f9fa; }
.schedule-tab.active {
    color: var(--primary);
    border-bottom-color: var(--primary);
    font-weight: 600;
}

/* ---------- 3. 视图切换Tab（看板/列表模式） ---------- */
.view-mode-tabs {
    display: flex;
    background: #f0f0f0;
    border-radius: 8px;
    overflow: hidden;
}
.view-tab {
    padding: 6px 14px;
    font-size: 12px;
    border: none;
    cursor: pointer;
    transition: all 0.2s;
    background: transparent;
    color: #666;
    font-family: var(--font-family);
}
.view-tab.active {
    background: var(--primary);
    color: #fff;
}
.view-tab:hover:not(.active) {
    background: rgba(0,0,0,0.05);
}

/* ---------- 4. 统计条装饰 ---------- */
.stats-bar-tight {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
}
.stat-item-tight {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--gray);
}

/* ---------- 5. 数据列表摘要 ---------- */
.list-summary {
    font-size: 13px;
    color: #666;
    white-space: nowrap;
}

/* ---------- 6. 教室筛选栏 ---------- */
.filter-bar-inline {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

/* ==================== v7.1: 页面级UI一致性层 结束 ==================== */

/* ==================== v7.2: 全局 Tooltip 样式层 ==================== */
/*
 * 使用方法：
 * 方法A（原生title）：直接在元素上加 title="说明" 即可，由浏览器渲染
 * 方法B（自定义美观版）：在元素上加 data-tip="说明" 和 class="tip" 即可
 * 两种方法均可，data-tip 外观更统一
 */

/* ---------- 自定义 tooltip：data-tip 属性 ---------- */
[data-tip] {
    position: relative;
}
[data-tip]::after {
    content: attr(data-tip);
    position: absolute;
    bottom: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%);
    background: rgba(30, 30, 30, 0.88);
    color: #fff;
    font-size: 12px;
    line-height: 1.4;
    padding: 5px 9px;
    border-radius: 6px;
    white-space: nowrap;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.15s ease, transform 0.15s ease;
    z-index: 9999;
    transform: translateX(-50%) translateY(4px);
    box-shadow: 0 2px 8px rgba(0,0,0,0.25);
}
[data-tip]::before {
    content: '';
    position: absolute;
    bottom: calc(100% + 2px);
    left: 50%;
    transform: translateX(-50%);
    border: 4px solid transparent;
    border-top-color: rgba(30, 30, 30, 0.88);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.15s ease;
    z-index: 9999;
}
[data-tip]:hover::after {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}
[data-tip]:hover::before {
    opacity: 1;
}
/* tooltip 朝下展示（data-tip-pos="bottom"） */
[data-tip][data-tip-pos="bottom"]::after {
    bottom: auto;
    top: calc(100% + 6px);
    transform: translateX(-50%) translateY(-4px);
}
[data-tip][data-tip-pos="bottom"]::before {
    bottom: auto;
    top: calc(100% + 2px);
    border-top-color: transparent;
    border-bottom-color: rgba(30, 30, 30, 0.88);
}
[data-tip][data-tip-pos="bottom"]:hover::after {
    transform: translateX(-50%) translateY(0);
}
/* tooltip 靠右展示（data-tip-pos="right"） */
[data-tip][data-tip-pos="right"]::after {
    bottom: auto;
    left: calc(100% + 6px);
    top: 50%;
    transform: translateY(-50%) translateX(-4px);
}
[data-tip][data-tip-pos="right"]::before {
    bottom: auto;
    left: calc(100% + 2px);
    top: 50%;
    transform: translateY(-50%);
    border-top-color: transparent;
    border-right-color: rgba(30, 30, 30, 0.88);
}
[data-tip][data-tip-pos="right"]:hover::after {
    transform: translateY(-50%) translateX(0);
}
/* ==================== v7.2: 全局 Tooltip 样式层 结束 ==================== */

/* ==================== v10.0: 营收管理页面 ==================== */

.revenue-page { padding: 20px; min-height: 80vh; }
.revenue-header { margin-bottom: 20px; }
.revenue-header h2 { margin: 0; font-size: 22px; color: #333; }
.revenue-header h2 i { margin-right: 8px; color: #e74c3c; }
.revenue-header-info { margin-top: 6px; }
.revenue-subtitle { font-size: 13px; color: #888; }
.revenue-subtitle small { color: #bbb; font-size: 11px; }

/* 筛选栏 */
.revenue-filters { background: #fff; border-radius: 12px; padding: 16px 20px; margin-bottom: 20px; box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
.revenue-filter-row { display: flex; gap: 16px; align-items: flex-end; flex-wrap: wrap; }
.revenue-filter-group { display: flex; flex-direction: column; gap: 4px; }
.revenue-filter-group label { font-size: 12px; color: #888; font-weight: 500; }
.revenue-filter-group select { padding: 6px 12px; border: 1px solid #ddd; border-radius: 8px; font-size: 13px; min-width: 120px; background: #fff; }

/* 快捷时间按钮组 */
.revenue-quick-btns { display: flex; gap: 4px; flex-wrap: wrap; }
.revenue-quick-btn { padding: 4px 12px; font-size: 12px; border: 1px solid #ddd; background: #fff; border-radius: 6px; cursor: pointer; color: #666; transition: all 0.2s; }
.revenue-quick-btn:hover { background: #f0f0f0; border-color: #ccc; }
.revenue-quick-btn.active { background: var(--primary); color: #fff; border-color: var(--primary); }

/* 自定义日期输入 */
.revenue-date-range { display: flex; align-items: center; gap: 6px; }
.revenue-date-input { padding: 5px 8px; border: 1px solid #ddd; border-radius: 6px; font-size: 13px; color: #333; background: #fff; }
.revenue-date-input:focus { border-color: var(--primary); outline: none; box-shadow: 0 0 0 2px rgba(241,141,36,0.15); }
.revenue-date-sep { color: #aaa; font-size: 13px; user-select: none; }

/* 聚合粒度按钮组 */
.revenue-granularity-btns { display: flex; gap: 4px; }
.revenue-granularity-btn { padding: 4px 12px; font-size: 12px; border: 1px solid #ddd; background: #fff; border-radius: 6px; cursor: pointer; color: #666; transition: all 0.2s; }
.revenue-granularity-btn:hover { background: #f0f0f0; }
.revenue-granularity-btn.active { background: var(--secondary); color: #fff; border-color: var(--secondary); }

/* 高级筛选折叠 */
.revenue-advanced-toggle { margin-top: 10px; padding: 6px 0; font-size: 12px; color: #888; cursor: pointer; user-select: none; display: flex; align-items: center; gap: 4px; }
.revenue-advanced-toggle:hover { color: #666; }
.revenue-advanced-toggle i { font-size: 10px; transition: transform 0.2s; }
.revenue-advanced-filters { margin-top: 10px; padding-top: 12px; border-top: 1px solid #f0f0f0; }

/* 概览卡片 */
.revenue-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 20px; }
.revenue-card { background: #fff; border-radius: 12px; padding: 20px; box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
.revenue-card-label { font-size: 12px; color: #888; margin-bottom: 8px; font-weight: 500; }
.revenue-card-value { font-size: 28px; font-weight: 700; margin-bottom: 4px; }
.revenue-card-sub { font-size: 12px; color: #aaa; }
.revenue-card-primary .revenue-card-value { color: #e74c3c; }
.revenue-card-course .revenue-card-value { color: #4caf50; }
.revenue-card-instrument .revenue-card-value { color: #ff9800; }
.revenue-card-avg .revenue-card-value { color: #2196f3; }

/* 子Tab栏 */
.revenue-sub-tabs { display: flex; gap: 0; background: #fff; border-radius: 12px; overflow: hidden; margin-bottom: 20px; box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
.revenue-sub-tab { padding: 12px 20px; cursor: pointer; font-size: 14px; color: #666; border-bottom: 2px solid transparent; transition: all 0.2s; user-select: none; }
.revenue-sub-tab:hover { color: #333; background: #f8f9fa; }
.revenue-sub-tab.active { color: #e74c3c; font-weight: 600; border-bottom-color: #e74c3c; background: #fff5f5; }

/* 图表区域 */
.revenue-charts { }
.revenue-charts-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.revenue-chart-card { background: #fff; border-radius: 12px; padding: 20px; box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
.revenue-chart-title { font-size: 14px; font-weight: 600; color: #333; margin-bottom: 16px; }
.revenue-chart-container { height: 280px; position: relative; display: flex; align-items: center; justify-content: center; }

/* 表格 */
.revenue-table-card { background: #fff; border-radius: 12px; padding: 20px; box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
.revenue-table-title { font-size: 14px; font-weight: 600; color: #333; margin-bottom: 16px; }
.revenue-table { width: 100%; border-collapse: collapse; }
.revenue-table th { padding: 10px 12px; text-align: left; font-size: 12px; color: #888; border-bottom: 2px solid #f0f0f0; font-weight: 600; }
.revenue-table td { padding: 10px 12px; font-size: 13px; color: #444; border-bottom: 1px solid #f5f5f5; }
.revenue-table tr:hover td { background: #fafafa; }
.revenue-amount { font-weight: 600; font-family: 'SF Mono', monospace; }
.revenue-bar-bg { display: inline-block; width: 80px; height: 6px; background: #f0f0f0; border-radius: 3px; vertical-align: middle; margin-right: 8px; }
.revenue-bar-fill { height: 100%; background: linear-gradient(90deg, #4caf50, #81c784); border-radius: 3px; transition: width 0.3s; }
.revenue-pct { font-size: 12px; color: #888; }
.empty-row { text-align: center; color: #bbb; padding: 40px !important; }
.empty-chart { text-align: center; color: #bbb; font-size: 14px; padding: 40px; }
.empty-chart i { font-size: 32px; display: block; margin-bottom: 8px; color: #ddd; }

/* ==================== 课消分析 ==================== */

/* 概览卡片 */
.cons-cards { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 16px; }
.cons-card { background: #fff; border-radius: 10px; padding: 16px; box-shadow: 0 1px 4px rgba(0,0,0,0.06); border-left: 3px solid #e0e0e0; }
.cons-card-primary { border-left-color: #4caf50; }
.cons-card-rate { border-left-color: #ff9800; }
.cons-card-base { border-left-color: #2196f3; }
.cons-card-basic { border-left-color: #9c27b0; }
.cons-card-challenge { border-left-color: #f44336; }
.cons-card-empty { border-left-color: #ccc; }
.cons-card-label { font-size: 12px; color: #888; margin-bottom: 4px; }
.cons-card-value { font-size: 24px; font-weight: 700; color: #333; font-family: 'SF Mono', monospace; margin-bottom: 4px; }
.cons-card-sub { font-size: 11px; color: #aaa; }

/* 进度条（三级目标） */
.cons-progress-bar-wrapper { background: #fff; border-radius: 10px; padding: 16px 20px; margin-bottom: 16px; box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
.cons-progress-label { display: flex; justify-content: space-between; font-size: 12px; color: #888; margin-bottom: 8px; }
.cons-progress-bars { display: flex; flex-direction: column; gap: 6px; }
.cons-progress-track { height: 8px; background: #f0f0f0; border-radius: 4px; overflow: hidden; }
.cons-progress-fill { height: 100%; border-radius: 4px; transition: width 0.5s ease; }
.cons-fill-base { background: linear-gradient(90deg, #2196f3, #64b5f6); }
.cons-fill-basic { background: linear-gradient(90deg, #9c27b0, #ba68c8); }
.cons-fill-challenge { background: linear-gradient(90deg, #f44336, #ef9a9a); }
.cons-target-actions { display: flex; gap: 8px; margin-top: 10px; justify-content: flex-end; }

/* 图表区 */
.cons-chart-section { background: #fff; border-radius: 10px; padding: 16px 16px 8px; margin-bottom: 16px; box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
.cons-chart-title { font-size: 14px; font-weight: 600; color: #555; margin-bottom: 12px; display: flex; align-items: center; gap: 6px; }
.cons-chart-container { height: 320px; width: 100%; }

/* 响应式 */
@media (max-width: 1200px) { .cons-cards { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px) { .cons-cards { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .cons-cards { grid-template-columns: 1fr; } }

/* 工具按钮 */
.btn-xs { padding: 2px 8px; font-size: 11px; }

/* ==================== v10.0: 营收管理页面 结束 ==================== */

/* ==================== 线索面板增强：方向1-5 开始 ==================== */

/* 高级筛选折叠面板 */
.advanced-filter-toggle {
    cursor: pointer;
    user-select: none;
    padding: 4px 0;
    transition: color 0.2s;
}
.advanced-filter-toggle:hover {
    color: var(--primary-dark);
}
.advanced-filter-panel {
    padding: 8px 0 4px;
    border-top: 1px dashed var(--gray-light);
    margin-top: 4px;
    animation: slideDown 0.2s ease;
}

/* 筛选条件标签 */
.filter-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 12px;
    align-items: center;
}
.filter-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-light);
    color: var(--primary-dark);
    padding: 3px 10px;
    border-radius: 14px;
    font-size: 12px;
    font-weight: 500;
}
.filter-tag-remove {
    background: none;
    border: none;
    color: var(--primary-dark);
    cursor: pointer;
    font-size: 16px;
    line-height: 1;
    padding: 0 2px;
    opacity: 0.6;
    transition: opacity 0.2s;
}
.filter-tag-remove:hover {
    opacity: 1;
}

/* 统计卡片行（方向4） */
.clue-stats-cards {
    display: flex;
    gap: 10px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}
.stats-card-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--white);
    border-radius: 10px;
    padding: 12px 14px;
    min-width: 90px;
    flex: 1;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    cursor: pointer;
    transition: all 0.2s ease;
    border: 1px solid transparent;
    position: relative;
    overflow: hidden;
}
.stats-card-item:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
    transform: translateY(-2px);
}
.stats-card-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
}
.stats-card-new::before { background: var(--primary); }
.stats-card-unassigned::before { background: var(--secondary); }
.stats-card-following::before { background: var(--warning); }
.stats-card-week::before { background: var(--success); }
.stats-card-public::before { background: #6c757d; }
.stats-card-overdue::before { background: var(--danger); }
.stats-card-overdue-danger {
    animation: subtlePulse 2s infinite;
}
@keyframes subtlePulse {
    0%, 100% { box-shadow: 0 2px 8px rgba(0,0,0,0.05); }
    50% { box-shadow: 0 2px 16px rgba(220,53,69,0.15); }
}
.stats-card-icon {
    font-size: 20px;
    margin-bottom: 4px;
}
.stats-card-num {
    font-size: 22px;
    font-weight: 700;
    color: var(--dark);
    line-height: 1.2;
}
.stats-card-label {
    font-size: 11px;
    color: var(--gray);
    white-space: nowrap;
}

/* 列表工具栏（排序+全选） */
.clue-list-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    padding: 8px 12px;
    background: var(--white);
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}
.clue-toolbar-left {
    display: flex;
    align-items: center;
    gap: 10px;
}
.clue-toolbar-right {
    display: flex;
    align-items: center;
    gap: 8px;
}
.sort-label {
    font-size: 13px;
    color: var(--gray);
    white-space: nowrap;
}
.sort-select {
    padding: 5px 10px;
    border: 1px solid var(--gray-light);
    border-radius: 6px;
    font-size: 13px;
    font-family: var(--font-family);
    outline: none;
    cursor: pointer;
    background: var(--white);
}
.sort-select:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 2px rgba(241,141,36,0.15);
}
.selected-count {
    font-size: 13px;
    color: var(--gray);
    font-weight: 500;
}

/* Checkbox 样式 */
.checkbox-wrapper {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
}
.checkbox-wrapper input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}
.checkbox-custom {
    width: 18px;
    height: 18px;
    border: 2px solid #ccc;
    border-radius: 4px;
    display: inline-block;
    transition: all 0.2s;
    position: relative;
    flex-shrink: 0;
}
.checkbox-wrapper input[type="checkbox"]:checked + .checkbox-custom {
    background: var(--primary);
    border-color: var(--primary);
}
.checkbox-wrapper input[type="checkbox"]:checked + .checkbox-custom::after {
    content: '';
    position: absolute;
    left: 5px;
    top: 2px;
    width: 5px;
    height: 9px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.clue-checkbox {
    flex-shrink: 0;
    margin-right: 0;
    padding: 8px 0 8px 4px;
}

/* 批量操作工具栏（浮动） */
.batch-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: linear-gradient(135deg, var(--primary-light), #fff);
    border: 1px solid var(--primary);
    border-radius: 10px;
    margin-bottom: 12px;
    box-shadow: 0 4px 16px rgba(241,141,36,0.15);
    animation: slideDown 0.25s ease;
    flex-wrap: wrap;
}
.batch-toolbar-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--primary-dark);
    margin-right: 4px;
}
.batch-status-select {
    padding: 5px 10px;
    border: 1px solid var(--primary);
    border-radius: 6px;
    font-size: 13px;
    font-family: var(--font-family);
    outline: none;
    cursor: pointer;
    background: var(--white);
    color: var(--dark);
}

/* AI评分标签样式 */
.ai-score-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
    line-height: 1.5;
}
.ai-score-high {
    background: #fde8e8;
    color: #dc3545;
    border: 1px solid #f5c6cb;
}
.ai-score-medium {
    background: #fff3cd;
    color: #856404;
    border: 1px solid #ffeeba;
}
.ai-score-low {
    background: #e2e3e5;
    color: #6c757d;
    border: 1px solid #d6d8db;
}
.ai-score-text {
    font-size: 11px;
    color: var(--gray);
    font-weight: 500;
}

/* 协作标识 */
.coop-badge {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    font-size: 12px;
    color: var(--primary-dark);
    background: var(--primary-light);
    padding: 1px 6px;
    border-radius: 4px;
    font-weight: 500;
}

/* 卡片主体调整，适应checkbox */
.clue-card {
    padding-left: 12px !important;
}

/* ==================== 线索面板增强：方向1-5 结束 ==================== */

/* ==================== 运营总览 v2.0 模块化看板 ==================== */

/* 自定义看板按钮 */
.dashboard-config-btn {
    margin-left: auto;
    padding: 4px 12px;
    font-size: 12px;
    color: var(--primary);
    background: var(--primary-light);
    border: 1px solid var(--primary);
    border-radius: 6px;
    cursor: pointer;
    transition: all var(--transition-fast);
}
.dashboard-config-btn:hover {
    background: var(--primary);
    color: var(--white);
}

/* 营收饼图布局 */
.revenue-pie-layout {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}
.revenue-pie-ring {
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    margin-top: 4px;
}
.revenue-pie-legend {
    flex: 1;
    min-width: 0;
}
.pie-legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 0;
    font-size: 12px;
}
.pie-legend-dot {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
}
.pie-legend-label {
    flex: 1;
    color: var(--dark);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.pie-legend-value {
    font-weight: 600;
    color: var(--dark);
    white-space: nowrap;
}
.pie-legend-pct {
    color: var(--gray);
    min-width: 40px;
    text-align: right;
}

/* 营收趋势图 */
.trend-chart {
    display: flex;
    align-items: flex-end;
    gap: 4px;
    height: 120px;
    padding: 8px 0;
}
.trend-bar-wrapper {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    justify-content: flex-end;
}
.trend-bar {
    width: 80%;
    max-width: 30px;
    background: linear-gradient(to top, var(--primary), var(--primary-light));
    border-radius: 3px 3px 0 0;
    transition: height 0.3s ease;
    min-height: 2px;
}
.trend-bar:hover {
    opacity: 0.8;
}
.trend-label {
    font-size: 10px;
    color: var(--gray);
    margin-top: 4px;
}

/* 课程排行 */
.ranking-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.ranking-item {
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.ranking-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
}
.ranking-rank {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--primary);
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 600;
}
.ranking-item:nth-child(1) .ranking-rank { background: #F18D24; }
.ranking-item:nth-child(2) .ranking-rank { background: #6c757d; }
.ranking-item:nth-child(3) .ranking-rank { background: #cd7f32; }
.ranking-item:nth-child(n+4) .ranking-rank { background: #e9ecef; color: #666; }
.ranking-name {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ranking-num {
    font-weight: 600;
    color: var(--dark);
    white-space: nowrap;
}
.ranking-rate {
    color: var(--gray);
    min-width: 36px;
    text-align: right;
}
.ranking-bar-bg {
    height: 6px;
    background: #f0f0f0;
    border-radius: 3px;
    overflow: hidden;
}
.ranking-bar {
    height: 100%;
    border-radius: 3px;
    transition: width 0.3s ease;
}

/* 看板配置面板 */
.config-hint {
    font-size: 13px;
    color: var(--gray);
    margin-bottom: 12px;
}
.config-module-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.config-module-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    background: var(--light);
    border-radius: 8px;
    cursor: pointer;
    transition: background var(--transition-fast);
}
.config-module-item:hover {
    background: var(--primary-light);
}
.config-module-checkbox {
    width: 18px;
    height: 18px;
    accent-color: var(--primary);
    cursor: pointer;
}
.config-module-title {
    font-size: 14px;
    color: var(--dark);
}

/* 统计项颜色扩展 */
.stat-primary .stat-num { color: var(--primary); }

/* ==================== 课消分析页面 ==================== */

/* 课消页面Tab栏 */
#lc-tab-bar .tab-item {
    padding: 8px 16px;
    font-size: 13px;
}

/* 课消表格紧凑样式 */
#lc-content .table th {
    font-size: 12px;
    white-space: nowrap;
}
#lc-content .table td {
    font-size: 12px;
    padding: 8px 10px;
}

/* 课消搜索输入框 */
#lc-content .filter-input {
    padding: 6px 10px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 13px;
    width: 200px;
}
#lc-content .filter-select {
    padding: 6px 10px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 13px;
}

/* 签到弹窗表单 */
#lc-content .form-group {
    margin-bottom: 12px;
}
#lc-content .form-group label {
    display: block;
    font-size: 13px;
    font-weight: 500;
    color: var(--dark);
    margin-bottom: 4px;
}
#lc-content .form-group .required {
    color: var(--danger);
}

/* 课消页面空状态 */
#lc-content .empty-state {
    text-align: center;
    padding: 60px 20px;
    color: var(--gray);
}
#lc-content .empty-state h3 {
    font-size: 18px;
    margin-bottom: 8px;
}

/* ==================== 营收个性化模板 ==================== */

/* 模板通用布局 */
.revenue-tpl-cards-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.revenue-tpl-card {
    background: #fff;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    transition: transform 0.2s;
}
.revenue-tpl-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.revenue-tpl-card-label {
    font-size: 14px;
    color: #666;
    margin-bottom: 8px;
}
.revenue-tpl-card-value {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 4px;
}
.revenue-tpl-card-sub {
    font-size: 12px;
    color: #999;
}

/* 图表网格 */
.revenue-tpl-charts-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 20px;
}
@media (max-width: 900px) {
    .revenue-tpl-charts-grid {
        grid-template-columns: 1fr;
    }
}

.revenue-tpl-chart-card {
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}
.revenue-tpl-chart-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #f0f0f0;
}
.revenue-tpl-chart-container {
    height: 300px;
    position: relative;
}
.revenue-tpl-chart-note {
    font-size: 12px;
    color: #999;
    margin-top: 8px;
    padding: 8px 12px;
    background: #f9f9f9;
    border-radius: 6px;
}

/* 明细表格 */
.revenue-tpl-table-card {
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    margin-bottom: 20px;
}
.revenue-tpl-table-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #f0f0f0;
}
.revenue-tpl-table {
    width: 100%;
    border-collapse: collapse;
}
.revenue-tpl-table th {
    background: #f5f5f5;
    padding: 10px 12px;
    text-align: left;
    font-weight: 600;
    font-size: 13px;
    color: #666;
    border-bottom: 2px solid #e0e0e0;
}
.revenue-tpl-table td {
    padding: 10px 12px;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
}
.revenue-tpl-table tr:hover td {
    background: #f9f9f9;
}

/* 占位提示 */
.revenue-tpl-placeholder {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 24px 20px;
    background: #f9f9f9;
    border: 1px dashed #ddd;
    border-radius: 10px;
    margin: 12px 0;
}
.revenue-tpl-placeholder-icon {
    font-size: 28px;
    flex-shrink: 0;
}
.revenue-tpl-placeholder-text {
    font-size: 13px;
    color: #888;
    line-height: 1.5;
}

/* 课程模板 */
.revenue-tpl-course .revenue-tpl-table td:first-child {
    font-weight: 600;
}

/* 乐器模板 - 关联分析 */
.revenue-tpl-association {
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    margin-bottom: 20px;
}
.revenue-tpl-association-header {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #f0f0f0;
}

/* 考级通过率 */
.revenue-tpl-exam-passrate {
    margin-bottom: 20px;
}

/* 比赛级别说明 */
.revenue-tpl-competition .revenue-tpl-table td:first-child {
    font-weight: 600;
}

/* 夏令营转化漏斗 */
.revenue-tpl-camp-funnel {
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    margin-bottom: 20px;
}
.revenue-tpl-funnel-header {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #f0f0f0;
}

/* 活动ROI */
.revenue-tpl-roi-info {
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    margin-bottom: 20px;
}
.revenue-tpl-roi-header {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
}
.revenue-tpl-roi-desc {
    font-size: 13px;
    color: #888;
    line-height: 1.6;
}
.revenue-tpl-roi-desc p {
    margin: 4px 0;
}

/* 营收金额列右对齐 */
.revenue-tpl-table .revenue-amount {
    font-family: 'SF Mono', 'Menlo', monospace;
    text-align: right;
}

/* ===== 营收模板 v1.0 ===== */

/* 双列网格布局 */
.revenue-tpl-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 20px;
}

/* 洞察卡片 */
.revenue-tpl-insight-card {
    background: linear-gradient(135deg, #f0fdf4, #ecfdf5);
    border-radius: 12px;
    padding: 16px 20px;
    margin-bottom: 20px;
    border-left: 4px solid #4caf50;
}
.revenue-tpl-insight-header {
    font-size: 14px;
    font-weight: 600;
    color: #2e7d32;
    margin-bottom: 6px;
}
.revenue-tpl-insight-header i {
    margin-right: 6px;
}
.revenue-tpl-insight-body {
    font-size: 13px;
    color: #555;
}
.revenue-tpl-insight-body strong {
    color: #2e7d32;
}

/* 统计卡片行 */
.revenue-tpl-card-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}
.revenue-tpl-stat-card {
    display: flex;
    align-items: center;
    gap: 14px;
    background: #fff;
    border-radius: 12px;
    padding: 18px 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}
.revenue-tpl-stat-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
}
.revenue-tpl-stat-body {
    flex: 1;
    min-width: 0;
}
.revenue-tpl-stat-value {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 2px;
}
.revenue-tpl-stat-label {
    font-size: 12px;
    color: #888;
}
/* 统计卡片配色 */
.revenue-tpl-stat-blue .revenue-tpl-stat-icon { background: #e3f2fd; color: #1976d2; }
.revenue-tpl-stat-blue .revenue-tpl-stat-value { color: #1976d2; }
.revenue-tpl-stat-orange .revenue-tpl-stat-icon { background: #fff3e0; color: #f57c00; }
.revenue-tpl-stat-orange .revenue-tpl-stat-value { color: #f57c00; }
.revenue-tpl-stat-green .revenue-tpl-stat-icon { background: #e8f5e9; color: #388e3c; }
.revenue-tpl-stat-green .revenue-tpl-stat-value { color: #388e3c; }
.revenue-tpl-stat-purple .revenue-tpl-stat-icon { background: #f3e5f5; color: #7b1fa2; }
.revenue-tpl-stat-purple .revenue-tpl-stat-value { color: #7b1fa2; }
.revenue-tpl-stat-red .revenue-tpl-stat-icon { background: #fce4ec; color: #c62828; }
.revenue-tpl-stat-red .revenue-tpl-stat-value { color: #c62828; }
.revenue-tpl-stat-cyan .revenue-tpl-stat-icon { background: #e0f7fa; color: #00838f; }
.revenue-tpl-stat-cyan .revenue-tpl-stat-value { color: #00838f; }

/* 品牌排行列表（乐器模板） */
.revenue-tpl-brand-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 4px 0;
}
.revenue-tpl-brand-item {
    display: grid;
    grid-template-columns: 1fr 1fr 80px 50px;
    gap: 8px;
    align-items: center;
    font-size: 13px;
}
.revenue-tpl-brand-name {
    font-weight: 600;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.revenue-tpl-brand-bar-bg {
    height: 8px;
    background: #f0f0f0;
    border-radius: 4px;
    overflow: hidden;
}
.revenue-tpl-brand-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, #ff9800, #ffb74d);
    border-radius: 4px;
    transition: width 0.6s ease;
}
.revenue-tpl-brand-amount {
    font-weight: 600;
    color: #f57c00;
    text-align: right;
    font-family: 'SF Mono', monospace;
    font-size: 12px;
}
.revenue-tpl-brand-count {
    color: #999;
    font-size: 11px;
    text-align: right;
}
.revenue-tpl-brand-rank {
    /* 排行高亮占位 */
}
.revenue-tpl-medal {
    font-size: 16px;
    margin-right: 2px;
}

/* 空状态图表示例 */
.empty-chart {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #bbb;
    font-size: 13px;
    height: 100%;
    min-height: 120px;
}
.empty-chart i {
    font-size: 32px;
    color: #ddd;
}

/* 加载状态 */
.loading {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #888;
    font-size: 14px;
    padding: 40px;
}
.loading i {
    margin-right: 8px;
}

/* 错误状态 */
.error-state {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #c62828;
    font-size: 14px;
    padding: 40px;
    background: #fce4ec;
    border-radius: 12px;
}

/* 移动端适配 */
@media (max-width: 900px) {
    .revenue-tpl-grid {
        grid-template-columns: 1fr;
    }
    .revenue-tpl-card-row {
        grid-template-columns: repeat(2, 1fr);
    }
    .revenue-tpl-brand-item {
        grid-template-columns: 1fr auto 70px;
    }
    .revenue-tpl-brand-bar-bg {
        display: none;
    }
}
@media (max-width: 600px) {
    .revenue-tpl-card-row {
        grid-template-columns: 1fr;
    }
}

/* ===================================================================
   我的收入·设置 — my-income-settings.css
   提成配置系统的前端样式
   =================================================================== */

.my-income-settings-page {
    padding: 24px;
    max-width: 1200px;
    margin: 0 auto;
}

.my-income-settings-page .page-header {
    margin-bottom: 20px;
}

.my-income-settings-page .page-header h2 {
    margin: 0 0 6px;
    font-size: 22px;
    font-weight: 600;
}

.my-income-settings-page .page-header .page-desc {
    margin: 0;
    color: var(--text-muted);
    font-size: 14px;
}

/* Tab 栏 */
.my-income-tabs {
    display: flex;
    gap: 4px;
    border-bottom: 2px solid var(--border);
    margin-bottom: 20px;
    background: var(--card-bg);
    border-radius: 8px 8px 0 0;
    padding: 4px 4px 0;
}

.my-income-tab {
    padding: 10px 18px;
    cursor: pointer;
    border-radius: 6px 6px 0 0;
    font-size: 14px;
    font-weight: 500;
    color: var(--text-muted);
    transition: all 0.2s;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    user-select: none;
}

.my-income-tab:hover {
    color: var(--text);
    background: rgba(79, 70, 229, 0.05);
}

.my-income-tab.active {
    color: var(--primary);
    border-bottom-color: var(--primary);
    background: rgba(79, 70, 229, 0.08);
    font-weight: 600;
}

/* Tab 内容区 */
.my-income-content {
    min-height: 300px;
}

.my-income-tab-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
}

.my-income-tab-header h3 {
    margin: 0 0 4px;
    font-size: 18px;
    font-weight: 600;
}

.my-income-tab-header .sub-desc {
    margin: 0;
    color: var(--text-muted);
    font-size: 13px;
}

/* 表格 */
.my-income-table-wrap {
    overflow-x: auto;
    border-radius: 8px;
    border: 1px solid var(--border);
}

.my-income-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.my-income-table th {
    background: var(--bg-secondary);
    padding: 10px 12px;
    text-align: left;
    font-weight: 600;
    color: var(--text-muted);
    border-bottom: 2px solid var(--border);
    white-space: nowrap;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.my-income-table td {
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}

.my-income-table tr:last-child td {
    border-bottom: none;
}

.my-income-table tr:hover td {
    background: rgba(79, 70, 229, 0.02);
}

.my-income-table td.desc-cell {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text-muted);
}

.my-income-table .empty-row {
    text-align: center;
    padding: 40px 16px;
    color: var(--text-muted);
    font-size: 14px;
}

.my-income-table code {
    background: var(--bg-secondary);
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 12px;
    font-family: 'SF Mono', 'Menlo', monospace;
}

/* 状态徽章 */
.status-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
}

.status-badge.active {
    background: #dcfce7;
    color: #16a34a;
}

.status-badge.inactive {
    background: #fef2f2;
    color: #dc2626;
}

/* 分类徽章 */
.badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 4px;
    background: var(--bg-secondary);
    color: var(--text);
    font-size: 12px;
    font-weight: 500;
}

/* 图标按钮 */
.btn-icon {
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px 6px;
    border-radius: 4px;
    font-size: 14px;
    transition: background 0.15s;
}

.btn-icon:hover {
    background: var(--bg-secondary);
}

/* 分配比例卡片网格 */
.my-income-alloc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 16px;
}

.my-income-alloc-card {
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--card-bg);
    overflow: hidden;
    transition: box-shadow 0.2s;
}

.my-income-alloc-card:hover {
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}

.alloc-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border);
}

.alloc-card-body {
    padding: 12px 16px;
}

.alloc-table {
    width: 100%;
    font-size: 13px;
}

.alloc-table th {
    text-align: left;
    padding: 4px 8px;
    color: var(--text-muted);
    font-weight: 500;
    font-size: 11px;
    text-transform: uppercase;
}

.alloc-table td {
    padding: 6px 8px;
    border-top: 1px solid var(--border);
}

.role-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
}

.role-teacher { background: #dbeafe; color: #2563eb; }
.role-teaching_manager { background: #f3e8ff; color: #9333ea; }
.role-operator { background: #d1fae5; color: #059669; }
.role-headmaster { background: #fef3c7; color: #d97706; }
.role-campus_manager { background: #ffe4e6; color: #e11d48; }
.role-sales { background: #e0e7ff; color: #4f46e5; }
.role-super_admin { background: #fce7f3; color: #db2777; }
.role-admin { background: #f5f5f4; color: #78716c; }
.role-financial { background: #ccfbf1; color: #0d9488; }

/* 空状态迷你 */
.empty-mini {
    padding: 20px;
    text-align: center;
    color: var(--text-muted);
    font-size: 13px;
}

/* 弹窗统一 .modal-overlay 已归一到 L638，不再重复定义 */
.modal-content {
    background: var(--card-bg);
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.15);
    max-height: 85vh;
    overflow-y: auto;
    width: 90%;
}

.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid var(--border);
}

.modal-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
}

.modal-close {
    background: none;
    border: none;
    font-size: 18px;
    cursor: pointer;
    color: var(--text-muted);
    padding: 4px;
    border-radius: 4px;
}

.modal-close:hover {
    background: var(--bg-secondary);
    color: var(--text);
}

.modal-body {
    padding: 20px;
}

.modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 12px 20px;
    border-top: 1px solid var(--border);
}

/* 表单控件 */
.form-group {
    margin-bottom: 12px;
}

.form-group label {
    display: block;
    margin-bottom: 4px;
    font-size: 13px;
    font-weight: 500;
    color: var(--text);
}

.form-input, .form-select {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid var(--border);
    border-radius: 6px;
    font-size: 13px;
    background: var(--card-bg);
    color: var(--text);
    box-sizing: border-box;
    transition: border-color 0.2s;
}

.form-input:focus, .form-select:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1);
}

textarea.form-input {
    resize: vertical;
    min-height: 60px;
}

.form-row {
    display: flex;
    gap: 12px;
}

/* 按钮 */
.btn {
    padding: 8px 16px;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.15s;
}

.btn-sm {
    padding: 6px 12px;
    font-size: 12px;
}

.btn-primary {
    background: var(--primary, #4f46e5);
    color: #fff;
}

.btn-primary:hover {
    background: var(--primary-hover, #4338ca);
}

.btn-secondary {
    background: var(--bg-secondary);
    color: var(--text);
    border: 1px solid var(--border);
}

.btn-secondary:hover {
    background: var(--border);
}

/* 分配行 */
.alloc-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
    padding: 8px 10px;
    background: var(--bg-secondary);
    border-radius: 6px;
}

.alloc-percent-input {
    width: 100px;
}

/* 加载状态 */
.loading {
    text-align: center;
    padding: 60px 20px;
    color: var(--text-muted);
    font-size: 16px;
}

/* 响应式 */
@media (max-width: 768px) {
    .my-income-alloc-grid {
        grid-template-columns: 1fr;
    }
    .form-row {
        flex-direction: column;
    }
    .my-income-tabs {
        overflow-x: auto;
        flex-wrap: nowrap;
    }
    .my-income-tab {
        white-space: nowrap;
        padding: 8px 12px;
        font-size: 13px;
    }
}

/* my-income-modal 弹窗 class 化 */
.my-income-modal {
    display: none;
}
.my-income-modal.modal--open {
    display: flex;
}

/* 加载状态 */
.loading-spinner {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    gap: 12px;
    color: var(--text-muted);
}
.loading-spinner i {
    animation: spin 1s linear infinite;
}
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* 空状态 */
.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
}

/* 折叠筛选面板 */
.filter-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border: 1px solid var(--border);
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    color: var(--text-muted);
    margin-bottom: 12px;
    transition: all 0.2s;
}
.filter-toggle:hover {
    border-color: var(--primary);
    color: var(--primary);
}
.filter-panel {
    background: var(--bg-secondary);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 16px;
}
.filter-row {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
.filter-group {
    flex: 1;
    min-width: 180px;
}
.filter-group label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-muted);
    margin-bottom: 4px;
}

/* 分配进度条 */
.alloc-progress-wrap {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}
.alloc-progress-bar {
    flex: 1;
    height: 8px;
    background: var(--bg-secondary);
    border-radius: 4px;
    overflow: hidden;
}
.alloc-progress-fill {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s, background 0.3s;
    background: var(--primary, #4f46e5);
}

/* ===================================================================
   财务设置 — financial-settings.css
   知音·财务板块独立设置页
   =================================================================== */

.fin-settings-page {
    padding: 0;
    max-width: 1200px;
    margin: 0 auto;
}

.fin-settings-header {
    margin-bottom: 20px;
    background: #fff;
    border-radius: 12px;
    padding: 20px 24px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.fin-settings-header h2 {
    margin: 0 0 6px;
    font-size: 22px;
    font-weight: 600;
    color: var(--dark);
}

.fin-settings-header .page-desc {
    margin: 0;
    color: var(--text-muted);
    font-size: 14px;
}

/* 主Tab栏 */
.fin-settings-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 20px;
    background: #fff;
    border-radius: 12px;
    padding: 6px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.fin-settings-tab {
    flex: 1;
    padding: 14px 20px;
    cursor: pointer;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 500;
    color: var(--text-muted);
    transition: all 0.2s;
    user-select: none;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.fin-settings-tab .fin-tab-desc {
    font-size: 11px;
    font-weight: 400;
    opacity: 0.7;
}

.fin-settings-tab:hover {
    color: var(--text);
    background: rgba(241, 141, 36, 0.05);
}

.fin-settings-tab.active {
    color: #fff;
    background: linear-gradient(135deg, var(--primary), var(--primary-dark));
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(241, 141, 36, 0.3);
}

.fin-settings-tab.active .fin-tab-desc {
    opacity: 0.9;
}

/* 内容区 */
.fin-settings-content {
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    min-height: 400px;
}

/* 工资设置 - 子Tab */
.salary-sub-header {
    margin-bottom: 20px;
}

.salary-sub-tabs {
    display: flex;
    gap: 4px;
    border-bottom: 2px solid var(--border);
    padding: 0 0 0;
}

.salary-sub-tab {
    padding: 10px 18px;
    cursor: pointer;
    border-radius: 6px 6px 0 0;
    font-size: 14px;
    font-weight: 500;
    color: var(--text-muted);
    transition: all 0.2s;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    user-select: none;
}

.salary-sub-tab:hover {
    color: var(--text);
    background: rgba(241, 141, 36, 0.05);
}

.salary-sub-tab.active {
    color: var(--primary);
    border-bottom-color: var(--primary);
    background: rgba(241, 141, 36, 0.08);
    font-weight: 600;
}

/* Tab通用头部 */
.fin-tab-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
}

.fin-tab-header h3 {
    margin: 0 0 4px;
    font-size: 18px;
    font-weight: 600;
}

.fin-tab-header .sub-desc {
    margin: 0;
    color: var(--text-muted);
    font-size: 13px;
}

/* 通用表格 */
.fin-table-wrap {
    overflow-x: auto;
    border-radius: 8px;
    border: 1px solid var(--border);
}

.fin-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.fin-table th {
    background: var(--bg-secondary);
    padding: 10px 12px;
    text-align: left;
    font-weight: 600;
    color: var(--text-muted);
    border-bottom: 2px solid var(--border);
    white-space: nowrap;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.fin-table td {
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}

.fin-table tr:last-child td {
    border-bottom: none;
}

.fin-table tr:hover td {
    background: rgba(241, 141, 36, 0.02);
}

.fin-table td.desc-cell {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text-muted);
}

.fin-table .empty-row {
    text-align: center;
    padding: 40px 16px;
    color: var(--text-muted);
    font-size: 14px;
}

.fin-table code {
    background: var(--bg-secondary);
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 12px;
    font-family: 'SF Mono', 'Menlo', monospace;
}

/* 分配卡片网格 */
.fin-alloc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 16px;
}

.fin-alloc-card {
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
}

.fin-alloc-card .alloc-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border);
}

.fin-alloc-card .alloc-card-body {
    padding: 12px 16px;
}

/* 提成发放原则横幅 */
.fin-commission-rule-banner {
    display: flex;
    gap: 12px;
    padding: 14px 18px;
    background: #fff8e1;
    border-radius: 8px;
    margin-bottom: 20px;
    border-left: 4px solid var(--primary);
    font-size: 13px;
    line-height: 1.6;
    color: #5d4037;
}

.fin-commission-rule-banner .rule-banner-icon {
    font-size: 20px;
    color: var(--primary);
    flex-shrink: 0;
    margin-top: 2px;
}

.fin-commission-rule-banner .rule-banner-content strong {
    color: var(--primary-dark);
}

/* 教学过程5组卡片 */
.fin-process-groups {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.fin-process-group-card {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    transition: box-shadow 0.2s;
}

.fin-process-group-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.group-card-header {
    padding: 16px 20px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 8px;
}

.group-card-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    font-weight: 600;
}

.group-card-title .group-name {
    color: var(--dark);
}

.group-card-title .group-percentage {
    font-size: 12px;
    font-weight: 700;
    padding: 2px 10px;
    border-radius: 12px;
}

.group-meta {
    display: flex;
    gap: 16px;
    font-size: 12px;
    color: var(--text-muted);
}

.group-meta span {
    display: flex;
    align-items: center;
    gap: 4px;
}

.group-card-body {
    padding: 16px 20px;
}

.group-items {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}

.group-item-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    background: var(--bg-secondary);
    border-radius: 20px;
    font-size: 13px;
    color: var(--dark);
    border: 1px solid var(--border);
}

.group-item-chip code {
    font-size: 10px;
    color: var(--text-muted);
    background: transparent;
    padding: 0;
}

.group-commission-desc {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 12px;
    color: var(--text-muted);
    padding-top: 10px;
    border-top: 1px dashed var(--border);
}

.group-commission-desc i {
    margin-top: 2px;
}

/* 通用弹窗覆盖（保持与已有弹窗一致） */
.fin-modal .modal-content {
    background: #fff;
    border-radius: 12px;
}

/* ===================================================================
   背景修复 — 确保所有设置页不透明
   =================================================================== */

.main-content {
    background: #f5f6fa;
}

/* 确保设置页内容区在白色背景上 */
.fin-settings-page,
.my-income-settings-page {
    background: transparent;
}

.fin-settings-header,
.fin-settings-tabs,
.fin-settings-content {
    background: #fff;
}

/* 修复通用设置页面的白色卡片背景 */
.page-content:has(.fin-settings-page),
.page-content:has(.my-income-settings-page),
.page-content:has(.board-settings-page) {
    background: transparent;
}

/* ==========================================================
   Phase 1 权限管理体验升级 — 树形权限 + 搜索 + 操作日志
   前缀：perm-tree- / perm-search- / perm-logs-
   ========================================================== */

/* ---- 工具栏 ---- */
.perm-tree-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

/* ---- 搜索框 ---- */
.perm-search {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    min-width: 250px;
}
.perm-search-input {
    flex: 1;
    padding: 8px 14px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 14px;
    font-family: inherit;
    transition: border-color 0.2s, box-shadow 0.2s;
    outline: none;
    max-width: 400px;
}
.perm-search-input:focus {
    border-color: #1890ff;
    box-shadow: 0 0 0 3px rgba(24, 144, 255, 0.1);
}
.perm-search-input::placeholder {
    color: #bbb;
}
.perm-search-count {
    font-size: 13px;
    color: #888;
    white-space: nowrap;
}

/* ---- 树容器 ---- */
.perm-tree-wrapper {
    background: #fff;
    border-radius: 10px;
    border: 1px solid #e8e8e8;
    overflow-x: auto;
    overflow-y: visible;
}
.perm-tree {
    min-width: 800px;
}

/* ---- 表头行 ---- */
.perm-tree-header-row {
    display: flex;
    align-items: center;
    background: #f8f9fa;
    border-bottom: 2px solid #e0e0e0;
    position: sticky;
    top: 0;
    z-index: 10;
    padding: 0;
    min-height: 44px;
}
.perm-tree-header-cell {
    padding: 10px 8px;
    font-size: 13px;
    font-weight: 600;
    color: #333;
    text-align: center;
    border-right: 1px solid #e8e8e8;
    box-sizing: border-box;
}
.perm-tree-header-cell:last-child {
    border-right: none;
}
.perm-tree-col-name {
    flex: 2;
    min-width: 280px;
    text-align: left;
    padding-left: 52px;
}
.perm-tree-col-role {
    flex: 0 0 90px;
    min-width: 90px;
}
.perm-tree-col-super {
    flex: 0 0 90px;
    min-width: 90px;
    font-size: 11px;
    color: #888;
}
.perm-tree-col-super small {
    display: block;
    font-size: 10px;
    font-weight: 400;
    color: #aaa;
}

/* ---- 树节点行 ---- */
.perm-tree-node {
    border-bottom: 1px solid #f0f0f0;
}
.perm-tree-node:last-child {
    border-bottom: none;
}
.perm-tree-node-header {
    display: flex;
    align-items: center;
    padding: 6px 0;
    min-height: 38px;
    transition: background 0.15s;
}
.perm-tree-node-header:hover {
    background: #fafbfc;
}

/* ---- 展开/折叠箭头 ---- */
.perm-tree-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    font-size: 10px;
    color: #999;
    cursor: pointer;
    flex-shrink: 0;
    margin-right: 4px;
    border-radius: 4px;
    transition: transform 0.2s, color 0.15s;
    user-select: none;
}
.perm-tree-toggle:hover {
    color: #333;
    background: #f0f0f0;
}
.perm-tree-toggle.expanded {
    transform: rotate(0deg);
}
.perm-tree-toggle.collapsed {
    transform: rotate(0deg);
}

/* ---- 空白占位（操作行左侧） ---- */
.perm-tree-spacer {
    display: inline-block;
    width: 24px;
    flex-shrink: 0;
}

/* ---- Checkbox 包装 ---- */
.perm-tree-cb-wrap {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    user-select: none;
}
.perm-tree-cb {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: #1890ff;
    flex-shrink: 0;
    margin: 0;
}
.perm-tree-cb-tri {
    accent-color: #1890ff;
}

/* ---- 权限名称 ---- */
.perm-tree-name {
    font-size: 14px;
    color: #333;
    font-weight: 500;
}
.perm-tree-node-op .perm-tree-name {
    font-size: 13px;
}

/* ---- 权限码 ---- */
.perm-tree-code {
    font-size: 11px;
    color: #aaa;
    font-family: 'SF Mono', 'Consolas', 'Monaco', monospace;
    background: #f5f5f5;
    padding: 1px 6px;
    border-radius: 3px;
    margin-left: 6px;
    white-space: nowrap;
}

/* ---- 操作行布局 ---- */
.perm-tree-op-row {
    display: flex;
    align-items: center;
}
.perm-tree-op-label {
    flex: 2;
    min-width: 260px;
}

/* ---- 角色 checkbox 列 ---- */
.perm-tree-role-check {
    flex: 0 0 90px;
    min-width: 90px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-right: 1px solid #f0f0f0;
    padding: 0;
}
.perm-tree-role-slot {
    flex: 0 0 90px;
    min-width: 90px;
    border-right: 1px solid #f0f0f0;
}

/* ---- 超管徽章 ---- */
.perm-tree-super-badge {
    flex: 0 0 90px;
    min-width: 90px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    opacity: 0.5;
    cursor: default;
}

/* ---- 折叠动画 ---- */
.perm-tree-children {
    overflow: hidden;
    transition: max-height 0.3s ease;
}

/* ---- 搜索高亮 ---- */
.perm-tree-node mark {
    background: #fff3cd;
    color: #856404;
    padding: 1px 2px;
    border-radius: 2px;
}

/* ==========================================================
   操作日志 Tab
   ========================================================== */

/* ---- 日志容器 ---- */
.perm-logs-container {
    background: #fff;
    border-radius: 10px;
    border: 1px solid #e8e8e8;
    overflow: hidden;
}

/* ---- 日志表格 ---- */
.perm-logs-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.perm-logs-table thead th {
    background: #f8f9fa;
    padding: 10px 14px;
    text-align: left;
    font-weight: 600;
    color: #333;
    border-bottom: 2px solid #e0e0e0;
    white-space: nowrap;
}
.perm-logs-table tbody td {
    padding: 10px 14px;
    border-bottom: 1px solid #f0f0f0;
    color: #333;
    vertical-align: top;
}
.perm-logs-table tbody tr:hover td {
    background: #f8f9ff;
}
.perm-logs-table tbody tr:last-child td {
    border-bottom: none;
}
.perm-logs-empty {
    text-align: center;
    padding: 40px 20px;
    color: #999;
    font-size: 14px;
}

/* ---- 日志时间列 ---- */
.perm-logs-time {
    white-space: nowrap;
    font-size: 12px;
    color: #888;
    font-family: 'SF Mono', 'Consolas', monospace;
}

/* ---- 日志详情列 ---- */
.perm-logs-detail {
    font-size: 12px;
    color: #666;
    max-width: 300px;
    word-break: break-all;
    line-height: 1.5;
}

/* ---- 日志动作标签 ---- */
.perm-logs-action {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}
.perm-logs-action-green {
    background: #d4edda;
    color: #155724;
}
.perm-logs-action-blue {
    background: #cce5ff;
    color: #004085;
}
.perm-logs-action-red {
    background: #f8d7da;
    color: #721c24;
}
.perm-logs-action-orange {
    background: #fff3cd;
    color: #856404;
}
.perm-logs-action-gray {
    background: #e9ecef;
    color: #6c757d;
}

/* ---- 日志分页 ---- */
.perm-logs-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 14px 16px;
    border-top: 1px solid #f0f0f0;
    flex-wrap: wrap;
}
.perm-logs-page-info {
    font-size: 12px;
    color: #888;
    margin-right: 12px;
}
.perm-logs-page-btn {
    padding: 5px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    background: #fff;
    font-size: 13px;
    cursor: pointer;
    color: #333;
    transition: all 0.15s;
    font-family: inherit;
}
.perm-logs-page-btn:hover {
    background: #f0f0f0;
    border-color: #bbb;
}
.perm-logs-page-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}
.perm-logs-page-active {
    background: #1890ff;
    color: #fff;
    border-color: #1890ff;
}
.perm-logs-page-active:hover {
    background: #096dd9;
    border-color: #096dd9;
}
.perm-logs-page-dots {
    padding: 5px 6px;
    font-size: 13px;
    color: #999;
}

/* ---- 响应式：权限树 ---- */
@media (max-width: 768px) {
    .perm-tree-col-role,
    .perm-tree-role-check,
    .perm-tree-role-slot,
    .perm-tree-col-super,
    .perm-tree-super-badge {
        flex-basis: 60px;
        min-width: 60px;
    }
    .perm-tree-col-name {
        min-width: 180px;
    }
    .perm-tree-col-role {
        font-size: 11px;
    }
    .perm-tree-wrapper {
        font-size: 12px;
    }
    .role-mgmt-modal-content {
        width: 95%;
    }
    .role-mgmt-actions {
        flex-direction: column;
        gap: 4px;
    }
}

/* ==================== Tab0: 角色管理 CRUD ==================== */

/* 工具栏 */
.role-mgmt-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}
.role-mgmt-count {
    font-size: 13px;
    color: var(--gray);
}

/* 表格容器 */
.role-mgmt-table-wrap {
    background: var(--white);
    border-radius: 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    overflow-x: auto;
}

/* 表格 */
.role-mgmt-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.role-mgmt-table thead {
    background: #f8f9fb;
}
.role-mgmt-table th {
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    color: #555;
    border-bottom: 2px solid #e8ecf1;
    white-space: nowrap;
}
.role-mgmt-table td {
    padding: 12px 16px;
    border-bottom: 1px solid #f0f0f0;
    color: #333;
    vertical-align: middle;
}
.role-mgmt-table tbody tr:hover {
    background: #f8faff;
}
.role-mgmt-table tbody tr.role-mgmt-row-system {
    background: #fffbeb;
}
.role-mgmt-table tbody tr.role-mgmt-row-system:hover {
    background: #fef3c7;
}

/* 角色名称 */
.role-mgmt-name {
    font-weight: 600;
    color: #1a1a2e;
}

/* 系统标签 */
.role-mgmt-badge-system {
    display: inline-block;
    margin-left: 8px;
    padding: 1px 8px;
    background: #fef3c7;
    color: #92400e;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    vertical-align: middle;
}

/* 角色描述 */
.role-mgmt-desc {
    font-size: 11px;
    color: #999;
    margin-top: 2px;
}

/* 编码 */
.role-mgmt-code {
    font-family: 'SF Mono', 'Fira Code', monospace;
    font-size: 12px;
    background: #f3f4f6;
    padding: 2px 8px;
    border-radius: 4px;
    color: #555;
}

/* 等级 */
.role-mgmt-level {
    font-weight: 600;
    color: #3b82f6;
}

/* 状态 */
.role-mgmt-status {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}
.role-mgmt-status-active {
    background: #d1fae5;
    color: #065f46;
}
.role-mgmt-status-inactive {
    background: #fee2e2;
    color: #991b1b;
}

/* 操作按钮组 */
.role-mgmt-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.role-mgmt-btn-edit {
    color: #3b82f6;
    border-color: #bfdbfe;
}
.role-mgmt-btn-edit:hover {
    background: #eff6ff;
    border-color: #3b82f6;
}
.role-mgmt-btn-toggle-off {
    color: #f59e0b;
    border-color: #fde68a;
}
.role-mgmt-btn-toggle-off:hover {
    background: #fffbeb;
    border-color: #f59e0b;
}
.role-mgmt-btn-toggle-on {
    color: #10b981;
    border-color: #a7f3d0;
}
.role-mgmt-btn-toggle-on:hover {
    background: #ecfdf5;
    border-color: #10b981;
}
.role-mgmt-btn-delete {
    color: #ef4444;
    border-color: #fecaca;
}
.role-mgmt-btn-delete:hover {
    background: #fef2f2;
    border-color: #ef4444;
}
.role-mgmt-btn-disabled {
    color: #ccc !important;
    border-color: #eee !important;
    cursor: not-allowed !important;
}

/* 弹窗 */
.role-mgmt-modal-content {
    width: 520px;
}
.role-mgmt-modal-content .form-group small {
    display: block;
    margin-top: 4px;
}

/* ============================================================================
   角色权限 Tab → 权限管理重定向页面
   ============================================================================ */

.role-redirect-page {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 400px;
    padding: 40px 20px;
}

.role-redirect-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 48px 40px;
    max-width: 560px;
    width: 100%;
    text-align: center;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    transition: box-shadow 0.2s;
}

.role-redirect-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.06);
}

.role-redirect-icon {
    margin-bottom: 24px;
    display: flex;
    justify-content: center;
}

.role-redirect-card h3 {
    font-size: 20px;
    font-weight: 700;
    color: #1f2937;
    margin-bottom: 12px;
}

.role-redirect-desc {
    font-size: 14px;
    color: #6b7280;
    line-height: 1.7;
    margin-bottom: 28px;
    padding: 0 10px;
}

.role-redirect-features {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 32px;
    text-align: left;
    background: #f9fafb;
    border-radius: 10px;
    padding: 16px 20px;
}

.redirect-feature-item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: #374151;
}

.redirect-feature-item .feature-icon {
    font-size: 16px;
    flex-shrink: 0;
}

.role-redirect-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 32px;
    background: linear-gradient(135deg, #3b82f6, #2563eb);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.15s, box-shadow 0.15s;
    box-shadow: 0 2px 8px rgba(59,130,246,0.3);
}

.role-redirect-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(59,130,246,0.4);
}

.role-redirect-btn:active {
    transform: translateY(0);
}

.role-redirect-noaccess {
    font-size: 14px;
    color: #f59e0b;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 8px;
    padding: 10px 16px;
    display: inline-block;
}

.role-redirect-hint {
    margin-top: 20px;
    font-size: 12px;
    color: #9ca3af;
    line-height: 1.6;
}

/* ==================== T032-D: 发布总台样式 ==================== */

.publish-page {
    padding: 24px;
    max-width: 100%;
}

.publish-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 20px;
}

.publish-header h2 {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
}

/* 统计卡片 */
.publish-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}

.publish-stat-card {
    background: #fff;
    border-radius: 10px;
    padding: 16px;
    box-shadow: var(--shadow-sm);
    transition: box-shadow 0.2s;
}

.publish-stat-card:hover {
    box-shadow: var(--shadow-md);
}

.publish-stat-icon {
    font-size: 24px;
    margin-bottom: 6px;
}

.publish-stat-value {
    font-size: 22px;
    font-weight: 700;
    color: #1f2937;
}

.publish-stat-label {
    font-size: 12px;
    color: #6b7280;
    margin-top: 2px;
}

/* 筛选区 */
.publish-filters {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 16px;
    align-items: center;
}

.publish-filters select,
.publish-filters input {
    padding: 8px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 13px;
    background: #fff;
    outline: none;
    transition: border-color 0.2s;
}

.publish-filters select:focus,
.publish-filters input:focus {
    border-color: var(--primary);
}

.publish-filters input[type="text"] {
    min-width: 180px;
}

/* 表格 */
.publish-table-wrapper {
    overflow-x: auto;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    background: #fff;
}

.publish-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.publish-table th {
    background: #f9fafb;
    padding: 10px 14px;
    text-align: left;
    font-weight: 600;
    color: #374151;
    border-bottom: 1px solid #e5e7eb;
    white-space: nowrap;
}

.publish-table td {
    padding: 12px 14px;
    border-bottom: 1px solid #f3f4f6;
    vertical-align: middle;
}

.publish-row {
    transition: background 0.15s;
}

.publish-row:hover {
    background: #f9fafb;
}

.publish-title {
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 4px;
}

.publish-material-type {
    display: inline-block;
    font-size: 11px;
    background: #eef2ff;
    color: #4338ca;
    padding: 2px 8px;
    border-radius: 4px;
    margin-left: 6px;
    vertical-align: middle;
}

.publish-preview {
    font-size: 12px;
    color: #6b7280;
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 2px;
}

.publish-platform-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

.publish-actions {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}

.publish-actions button {
    border: none;
    background: none;
    cursor: pointer;
    font-size: 14px;
    padding: 4px 8px;
    border-radius: 4px;
    color: #6b7280;
    transition: all 0.15s;
}

.publish-actions button:hover {
    background: var(--primary-light);
    color: var(--primary);
}

/* 发布状态标签 */
.pq-status-draft { background: #f3f4f6; color: #6b7280; }
.pq-status-pending { background: #fef3c7; color: #b45309; }
.pq-status-published { background: #d1fae5; color: #059669; }
.pq-status-failed { background: #fee2e2; color: #dc2626; }
.pq-status-scheduled { background: #e0f2fe; color: #0369a1; }

.pq-status-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
}

/* 分页 */
.publish-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 16px;
}

.publish-pagination button {
    padding: 6px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    background: #fff;
    font-size: 13px;
    cursor: pointer;
    transition: all 0.15s;
}

.publish-pagination button:hover:not(:disabled) {
    border-color: var(--primary);
    color: var(--primary);
}

.publish-pagination button:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.publish-pagination .pq-page-indicator {
    font-size: 13px;
    color: #6b7280;
}

/* ==================== T032-D: 甘特图自定义样式 ==================== */

.gantt-container {
    background: #fff;
    border-radius: 10px;
    padding: 16px;
    box-shadow: var(--shadow-sm);
}

.gantt-container .gantt {
    font-family: var(--font-family);
}

.gantt-container .bar-label {
    font-size: 12px;
}

.gantt-container .bar-wrapper:hover .bar {
    filter: brightness(0.95);
}

/* ==================== T032-D: 看板组件样式 ==================== */

.kanban-board {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    padding: 8px 0;
    min-height: 400px;
    align-items: flex-start;
}

.kanban-column {
    flex: 1;
    min-width: 280px;
    max-width: 360px;
    background: #f9fafb;
    border-radius: 10px;
    padding: 12px;
    border: 1px solid #e5e7eb;
    display: flex;
    flex-direction: column;
}

.kanban-column-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 2px solid #e5e7eb;
}

.kanban-column-title {
    font-size: 14px;
    font-weight: 700;
    color: #1f2937;
}

.kanban-column-count {
    background: #e5e7eb;
    padding: 2px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
}

.kanban-cards {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 60px;
    transition: background 0.2s;
}

.kanban-cards.drag-over {
    background: #f0f5ff;
    border-radius: 8px;
}

.kanban-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 10px 12px;
    cursor: grab;
    transition: box-shadow 0.15s, transform 0.15s;
    box-shadow: var(--shadow-sm);
}

.kanban-card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

.kanban-card:active {
    cursor: grabbing;
}

.kanban-card.dragging {
    opacity: 0.5;
    transform: rotate(2deg);
}

.kanban-card-header {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-bottom: 6px;
}

.kanban-card-title {
    font-size: 13px;
    font-weight: 600;
    color: #1f2937;
    flex: 1;
    line-height: 1.4;
}

.kanban-priority {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 700;
    flex-shrink: 0;
}

.kanban-priority-P0 { background: #fee2e2; color: #dc2626; }
.kanban-priority-P1 { background: #fef3c7; color: #b45309; }
.kanban-priority-P2 { background: #dbeafe; color: #2563eb; }
.kanban-priority-P3 { background: #f3f4f6; color: #6b7280; }

.kanban-card-assignee {
    font-size: 11px;
    color: #6b7280;
    margin-top: 4px;
}

.kanban-card-date {
    font-size: 11px;
    color: #9ca3af;
    margin-top: 2px;
}

.kanban-card-overdue {
    color: #dc2626 !important;
    font-weight: 600;
}

/* ===== Phase 4: 三层指导输入框 ===== */
.guided-textarea {
    color: #999 !important;
    font-family: var(--font-family);
    transition: color var(--transition-fast);
}
.guided-textarea.guided-textarea-editing {
    color: var(--dark) !important;
}
.guided-clear-btn {
    font-size: 11px;
    color: #8c8c8c;
    background: none;
    border: none;
    cursor: pointer;
    padding: 2px 6px;
}
.guided-clear-btn:hover {
    color: var(--primary);
    text-decoration: underline;
}

/* ===== Phase 4: 预警维度标签 ===== */
.warning-dim-tag {
    display: inline-block;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 11px;
    margin-left: 4px;
    vertical-align: middle;
}
.warning-dim-tag.time         { background: #f8d7da; color: #721c24; }
.warning-dim-tag.dependency   { background: #fff3cd; color: #856404; }
.warning-dim-tag.quality      { background: #d4edda; color: #155724; }
.warning-dim-tag.progress     { background: #d1ecf1; color: #0c5460; }
.warning-dim-tag.collaboration{ background: #e8daef; color: #6c3483; }
.warning-dim-tag.scheduling   { background: #fdebd0; color: #7d6608; }

/* ===== Phase 4: 预警维度色标圆点 ===== */
.warning-dots {
    display: inline-flex;
    gap: 3px;
    margin-left: 6px;
    vertical-align: middle;
}
.warning-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}
.warning-dot-time          { background: #dc3545; }
.warning-dot-dependency    { background: #ffc107; }
.warning-dot-quality       { background: #28a745; }
.warning-dot-progress      { background: #149EBB; }
.warning-dot-collaboration { background: #8e44ad; }
.warning-dot-scheduling    { background: #e67e22; }

/* ===== Phase 4: 预警统计栏 ===== */
.warning-stats-bar {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    padding: 10px 14px;
    background: #fafafa;
    border-radius: 8px;
    margin-bottom: 14px;
    border: 1px solid #f0f0f0;
}
.warning-stat-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: #595959;
}
.warning-stat-count {
    font-weight: 700;
    color: var(--dark);
    margin-left: 2px;
}

/* ===== Phase 4: 维度筛选栏 ===== */
.dimension-filter {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.dimension-filter .filter-chip {
    cursor: pointer;
    padding: 4px 12px;
    border-radius: 16px;
    font-size: 12px;
    background: #f5f5f5;
    color: #595959;
    border: 1px solid #e9e9e9;
    transition: all var(--transition-fast);
}
.dimension-filter .filter-chip:hover {
    border-color: var(--primary);
    color: var(--primary);
}
.dimension-filter .filter-chip.active {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

/* ===== Phase 4: 模板管理后台 ===== */
.guidance-config-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.guidance-config-table th,
.guidance-config-table td {
    padding: 10px 12px;
    border-bottom: 1px solid #f0f0f0;
    text-align: left;
}
.guidance-config-table th {
    background: #fafafa;
    font-weight: 600;
    color: #333;
}
.guidance-config-table tr:hover td {
    background: #fafafa;
}
.guidance-config-template-preview {
    max-width: 300px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 12px;
    color: #8c8c8c;
    font-style: italic;
}

/* ===== Phase 4: 六维度我的待办统计栏 ===== */
.todos-dim-stats-row {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    padding: 8px 0;
}
.todos-dim-stat-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 14px;
    font-size: 12px;
    cursor: pointer;
    background: #f5f5f5;
    border: 1px solid transparent;
    transition: all var(--transition-fast);
}
.todos-dim-stat-item:hover {
    border-color: var(--primary);
}
.todos-dim-stat-item.active {
    background: var(--primary-light);
    border-color: var(--primary);
    color: var(--primary-dark);
}
.todos-dim-stat-count {
    font-weight: 700;
}
.todos-dim-tag {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 10px;
    margin-left: 4px;
}
.todos-dim-tag-time          { background: #f8d7da; color: #721c24; }
.todos-dim-tag-dependency    { background: #fff3cd; color: #856404; }
.todos-dim-tag-quality       { background: #d4edda; color: #155724; }
.todos-dim-tag-progress      { background: #d1ecf1; color: #0c5460; }
.todos-dim-tag-collaboration { background: #e8daef; color: #6c3483; }
.todos-dim-tag-scheduling    { background: #fdebd0; color: #7d6608; }

/* ===== Phase 4: 徽章墙 (P1预留) ===== */
.badge-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 12px;
}
.badge-card {
    text-align: center;
    padding: 16px;
    border-radius: 8px;
    transition: all var(--transition-fast);
}
.badge-card.earned {
    background: var(--primary-light);
    border: 1px solid var(--primary);
}
.badge-card.locked {
    background: #f5f5f5;
    border: 1px dashed #ccc;
    opacity: 0.6;
}

/* ===== Phase 4: 会议页面 (P1预留) ===== */
.meeting-layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 20px;
    min-height: 500px;
}
.meeting-sidebar {
    background: #fafafa;
    border-radius: var(--radius-md);
    padding: 16px;
}
.meeting-main {
    background: #fff;
    border-radius: var(--radius-md);
    padding: 20px;
    box-shadow: var(--shadow-sm);
}

/* ===== Phase 4 P1: 徽章墙页面 ===== */
.badge-wall-page {
    max-width: 960px;
    margin: 0 auto;
    padding: 0 8px;
}
.badge-wall-header {
    margin-bottom: 20px;
}
.badge-wall-header h2 {
    font-size: 20px;
    margin: 0 0 4px 0;
    color: #1a1a1a;
}
.badge-wall-subtitle {
    font-size: 13px;
    color: #6c757d;
}

/* 徽章统计卡片 */
.badge-wall-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 16px;
}
.badge-stats-card {
    background: #fff;
    border-radius: 8px;
    padding: 16px;
    text-align: center;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}
.badge-stats-label {
    font-size: 12px;
    color: #6c757d;
    margin-bottom: 4px;
}
.badge-stats-value {
    font-size: 28px;
    font-weight: 700;
}

/* 进度条 */
.badge-progress-section {
    margin-bottom: 24px;
}
.badge-progress-bar {
    height: 10px;
    background: #f0f0f0;
    border-radius: 5px;
    overflow: hidden;
}
.badge-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #faad14, #ffc107);
    border-radius: 5px;
    transition: width 0.6s ease;
}
.badge-progress-text {
    text-align: right;
    font-size: 12px;
    color: #6c757d;
    margin-top: 4px;
}

/* 分类区块 */
.badge-category-section {
    margin-bottom: 24px;
}
.badge-category-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 0;
    border-bottom: 2px solid #f0f0f0;
    margin-bottom: 12px;
}
.badge-category-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
}
.badge-category-count {
    font-size: 12px;
    margin-left: auto;
}
.badge-empty-cat {
    color: #bfbfbf;
    font-size: 13px;
}

/* 徽章网格 — 扩展 */
.badge-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 12px;
}
.badge-card {
    text-align: center;
    padding: 16px 10px;
    border-radius: 8px;
    transition: all 0.2s ease;
}
.badge-card.earned {
    background: #e6f7ff;
    border: 1px solid #91d5ff;
}
.badge-card.earned:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(24,144,255,0.15);
}
.badge-card.locked {
    background: #fafafa;
    border: 1px dashed #d9d9d9;
    opacity: 0.55;
}
.badge-card-icon {
    font-size: 32px;
    margin-bottom: 6px;
}
.badge-card-name {
    font-size: 13px;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}
.badge-card-desc {
    font-size: 11px;
    color: #8c8c8c;
    margin-bottom: 6px;
    line-height: 1.4;
}
.badge-card-status {
    font-size: 11px;
}
.badge-card.earned .badge-card-status {
    color: #1890ff;
}
.badge-card.locked .badge-card-status {
    color: #bfbfbf;
}
.badge-card-date {
    font-size: 10px;
    color: #8c8c8c;
    margin-top: 4px;
}

/* 最近获得时间线 */
.badge-recent-section {
    margin-top: 8px;
}
.badge-recent-header {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    padding: 10px 0;
    border-bottom: 2px solid #f0f0f0;
    margin-bottom: 12px;
}
.badge-recent-header i {
    margin-right: 6px;
}
.badge-timeline {
    padding-left: 12px;
}
.badge-timeline-item {
    display: flex;
    align-items: center;
    padding: 8px 0;
    border-left: 2px solid #f0f0f0;
    padding-left: 16px;
    position: relative;
}
.badge-timeline-dot {
    width: 8px;
    height: 8px;
    background: #faad14;
    border-radius: 50%;
    position: absolute;
    left: -5px;
    top: 14px;
}
.badge-timeline-content {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
}
.badge-timeline-icon {
    font-size: 18px;
}
.badge-timeline-name {
    font-size: 13px;
    color: #333;
}
.badge-timeline-cat {
    font-size: 11px;
    color: #8c8c8c;
    background: #f5f5f5;
    padding: 1px 6px;
    border-radius: 4px;
}
.badge-timeline-date {
    font-size: 11px;
    color: #8c8c8c;
}
.badge-wall-empty {
    text-align: center;
    padding: 60px 20px;
}

/* ===== Phase 4 P1: 执行人评价 — 徽章行 ===== */
.me-badges-section {
    margin: 0 0 16px 0;
}
.me-badges-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 8px 0;
}
.me-badge-item {
    display: flex;
    align-items: center;
    gap: 4px;
    background: #fff7e6;
    border: 1px solid #ffd591;
    border-radius: 16px;
    padding: 4px 12px;
    font-size: 12px;
}
.me-badge-icon {
    font-size: 14px;
}
.me-badge-name {
    color: #d46b08;
    font-weight: 500;
}
.me-badge-desc {
    color: #8c8c8c;
    font-size: 10px;
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.me-badges-empty {
    text-align: center;
    padding: 12px;
    color: #bfbfbf;
    font-size: 12px;
}

/* ===== Phase 4 P1: 团队评价 — 徽章列 ===== */
.col-badge {
    text-align: center;
    min-width: 60px;
}
.team-badge-icon {
    font-size: 14px;
    margin: 0 1px;
    cursor: default;
}
.team-badge-more {
    font-size: 11px;
    color: #8c8c8c;
    margin-left: 2px;
}

/* ===== Phase 4 P1: AI 预测卡片 ===== */
.ai-prediction-card {
    background: linear-gradient(135deg, #f0f5ff, #e6f7ff);
    border: 1px solid #91d5ff;
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 16px;
}
.ai-prediction-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #1890ff;
}
.ai-prediction-body {
    font-size: 13px;
    color: #333;
    line-height: 1.6;
}
.ai-prediction-status {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 11px;
    margin-left: 8px;
}
.ai-prediction-status.up {
    background: #f6ffed;
    color: #52c41a;
}
.ai-prediction-status.down {
    background: #fff2f0;
    color: #ff4d4f;
}
.ai-prediction-status.stable {
    background: #fffbe6;
    color: #faad14;
}

/* ===== Phase 4 P1: 会议页面增强 ===== */
.meeting-room-page {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 8px;
}
.meeting-layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 20px;
    min-height: 500px;
}
.meeting-sidebar {
    background: #fafafa;
    border-radius: 8px;
    padding: 16px;
    border: 1px solid #f0f0f0;
}
.meeting-sidebar h4 {
    font-size: 14px;
    margin: 0 0 12px 0;
    color: #333;
}
.meeting-list-item {
    padding: 10px 12px;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s ease;
    margin-bottom: 4px;
    font-size: 13px;
}
.meeting-list-item:hover {
    background: #e6f7ff;
}
.meeting-list-item.active {
    background: #bae7ff;
    font-weight: 500;
}
.meeting-main {
    background: #fff;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    border: 1px solid #f0f0f0;
}

/* ==================== 批次3 360° 客户画像卡片样式 ==================== */
/* 摘要引用区 */
.profile-summary { position:relative; padding:12px 14px; background:#f8f9fa; border-radius:8px; font-size:13px; line-height:1.6; color:#333; margin-bottom:14px; }
.profile-summary::before { content:''; position:absolute; left:0; top:4px; bottom:4px; width:3px; background:#722ed1; border-radius:2px; }

/* 标签区 */
.profile-tags { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:14px; }
.profile-tag { display:inline-block; padding:3px 10px; border-radius:12px; background:#f3e8ff; color:#722ed1; font-size:12px; }
.profile-tag-more { border:1px dashed #d9d9d9; background:transparent; color:#999; }

/* 意向度进度条（5格） */
.profile-intent { margin-bottom:14px; }
.profile-intent-label { font-size:12px; color:#666; margin-bottom:6px; }
.profile-intent-bars { display:flex; gap:4px; }
.profile-intent-bar { flex:1; height:8px; border-radius:4px; background:#f0f0f0; }
.profile-intent-bar.filled { }
.profile-intent-bar.level-1 { background:#ff4d4f; }
.profile-intent-bar.level-2 { background:#ff7a45; }
.profile-intent-bar.level-3 { background:#faad14; }
.profile-intent-bar.level-4 { background:#52c41a; }
.profile-intent-bar.level-5 { background:#389e0d; }

/* 四宫格详情区 */
.profile-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:14px; }
.profile-detail-item { padding:10px 12px; background:#fafafa; border-radius:8px; }
.profile-detail-item-label { font-size:11px; color:#999; margin-bottom:4px; }
.profile-detail-item-value { font-size:13px; font-weight:500; color:#333; }

/* 潜力标签 */
.potential-high { color:#52c41a; background:#f6ffed; padding:2px 8px; border-radius:4px; }
.potential-medium { color:#faad14; background:#fffbe6; padding:2px 8px; border-radius:4px; }
.potential-low { color:#999; background:#fafafa; padding:2px 8px; border-radius:4px; }

/* 骨架屏 */
.profile-loading { text-align:center; padding:20px; color:#999; }
.profile-skeleton { padding:4px 0; }
.skeleton-line { height:12px; background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%); background-size:200% 100%; border-radius:6px; margin-bottom:10px; animation:skeleton-shimmer 1.5s infinite; }
.skeleton-line-1 { width:100%; }
.skeleton-line-2 { width:85%; }
.skeleton-line-3 { width:60%; }
.skeleton-tags { display:flex; gap:8px; margin-top:12px; }
.skeleton-tag { width:50px; height:22px; border-radius:11px; background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%); background-size:200% 100%; animation:skeleton-shimmer 1.5s infinite; }
.skeleton-bar { height:8px; border-radius:4px; background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%); background-size:200% 100%; margin-top:14px; animation:skeleton-shimmer 1.5s infinite; }

@keyframes skeleton-shimmer {
    0% { background-position:200% 0; }
    100% { background-position:-200% 0; }
}

/* 错误/空态 */
.profile-error { text-align:center; padding:20px; color:#999; font-size:13px; }
.profile-error a { color:#722ed1; cursor:pointer; }
.profile-empty { text-align:center; padding:20px; color:#999; font-size:13px; }

/* 刷新按钮 */
.profile-refresh-btn { background:transparent; border:1px solid #d9d9d9; border-radius:4px; cursor:pointer; padding:4px 8px; color:#666; }
.profile-refresh-btn:hover { border-color:#722ed1; color:#722ed1; }
.profile-refresh-btn:disabled { opacity:0.5; cursor:not-allowed; }

/* ==================== C2 行为轨迹卡片样式 ==================== */
#behavior-card { margin-top: 12px; }
.behavior-loading { text-align:center; padding:20px; color:#999; font-size:13px; }
.behavior-empty { text-align:center; padding:20px; color:#999; font-size:13px; }
.behavior-list { max-height:320px; overflow-y:auto; }
.behavior-item { padding:8px 0; border-bottom:1px solid #f0f0f0; cursor:pointer; }
.behavior-item:last-child { border-bottom:none; }
.behavior-item-header { display:flex; align-items:center; gap:8px; font-size:13px; }
.behavior-icon { font-size:14px; }
.behavior-label { color:#666; font-size:12px; min-width:28px; }
.behavior-page { flex:1; color:#333; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.behavior-time { color:#999; font-size:11px; white-space:nowrap; }
.behavior-detail { margin-top:6px; padding:8px 10px; background:#fafafa; border-radius:6px; font-size:12px; color:#666; word-break:break-all; }
.behavior-detail-row { margin-bottom:4px; }
.behavior-detail-row:last-child { margin-bottom:0; }
.behavior-detail-label { color:#999; }
.behavior-view-all { float:right; }

/* ==================== D2 多活动对比复盘（Multi-Compare）样式 ==================== */

/* —— 页面头部 —— */
.mc-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; background: #fff; border-bottom: 1px solid #e8e8e8;
  position: sticky; top: 0; z-index: 10;
}
.mc-header-title { font-size: 16px; font-weight: 600; color: #1a1a2e; }

/* —— 返回按钮 —— */
.mc-back-btn {
  display: inline-block; margin: 8px 16px; padding: 6px 14px;
  background: #f5f5f5; border: 1px solid #d9d9d9; border-radius: 6px;
  color: #555; font-size: 13px; cursor: pointer; transition: all .2s;
}
.mc-back-btn:hover { background: #e6f7ff; border-color: #1890ff; color: #1890ff; }

/* —— 导出按钮 —— */
.mc-export-btn {
  padding: 5px 14px; background: #fff; border: 1px solid #52c41a;
  border-radius: 6px; color: #52c41a; font-size: 13px; cursor: pointer;
  transition: all .2s;
}
.mc-export-btn:hover { background: #f6ffed; border-color: #389e0d; color: #389e0d; }

/* —— 活动横幅（Banner）—— */
.mc-banner {
  display: flex; gap: 12px; padding: 12px 16px; overflow-x: auto;
  background: linear-gradient(135deg, #667eea0a 0%, #764ba20a 100%);
}
.mc-banner-card {
  flex: 1; min-width: 140px; padding: 12px 14px;
  background: #fff; border-radius: 8px; border: 1px solid #e8e8e8;
  box-shadow: 0 1px 3px rgba(0,0,0,.04); text-align: center;
}
.mc-banner-name { font-size: 14px; font-weight: 600; color: #1a1a2e; margin-bottom: 6px; }
.mc-banner-meta { display: flex; flex-direction: column; gap: 3px; }
.mc-banner-date { font-size: 11px; color: #999; }
.mc-banner-type {
  display: inline-block; padding: 1px 8px; background: #f0f0ff;
  border-radius: 10px; font-size: 11px; color: #667eea;
}

/* —— 指标选择器 —— */
.mc-metric-select-wrap {
  display: flex; align-items: center; gap: 10px; padding: 12px 16px;
  background: #fff; border-bottom: 1px solid #f0f0f0;
}
.mc-metric-label { font-size: 13px; color: #666; white-space: nowrap; }
.mc-metric-select {
  padding: 6px 10px; border: 1px solid #d9d9d9; border-radius: 6px;
  font-size: 13px; color: #333; background: #fff; cursor: pointer;
  min-width: 180px; outline: none;
}
.mc-metric-select:focus { border-color: #667eea; box-shadow: 0 0 0 2px rgba(102,126,234,.15); }

/* —— 图表容器 —— */
.mc-chart-container {
  margin: 16px; padding: 16px; background: #fff; border-radius: 8px;
  border: 1px solid #e8e8e8; min-height: 320px;
}
.mc-chart-container canvas { max-height: 380px; }

/* —— 主体内容 —— */
.mc-body { padding: 0 16px 24px; }

/* —— 对比表格 —— */
.mc-compare-table {
  width: 100%; margin-top: 16px; border-collapse: collapse;
  font-size: 13px; background: #fff; border-radius: 8px;
  overflow: hidden; border: 1px solid #e8e8e8;
}
.mc-compare-table thead th {
  padding: 10px 10px; background: #fafafa; border-bottom: 2px solid #e8e8e8;
  color: #555; font-weight: 600; text-align: center; white-space: nowrap;
}
.mc-compare-table tbody td {
  padding: 10px 10px; border-bottom: 1px solid #f0f0f0;
  text-align: center; color: #333;
}
.mc-compare-table tbody tr:last-child td { border-bottom: none; }
.mc-compare-table tbody tr:hover { background: #fafbff; }
.mc-metric-name { text-align: left !important; font-weight: 500; color: #1a1a2e; }
.mc-th-avg { color: #999; }
.mc-cell-best {
  color: #52c41a; font-weight: 600;
  background: linear-gradient(135deg, #f6ffed 0%, #fcffe6 100%);
}
.mc-cell-worst {
  color: #ff4d4f; font-weight: 600;
  background: linear-gradient(135deg, #fff2f0 0%, #fff1f0 100%);
}
.mc-cell-avg { color: #999; font-style: italic; }
.mc-cell-best-name { color: #52c41a; font-size: 12px; }

/* —— 规则洞察 —— */
.mc-insight-box {
  margin-top: 14px; padding: 14px 16px; background: #fffbe6;
  border: 1px solid #ffe58f; border-radius: 8px;
}
.mc-insight-title { font-size: 14px; font-weight: 600; color: #d48806; margin-bottom: 10px; }
.mc-insight-item {
  display: flex; align-items: flex-start; gap: 8px;
  padding: 6px 0; border-bottom: 1px dashed #ffe58f;
}
.mc-insight-item:last-child { border-bottom: none; }
.mc-insight-icon { font-size: 15px; flex-shrink: 0; margin-top: 1px; }
.mc-insight-text { font-size: 13px; color: #595959; line-height: 1.5; }

/* —— 加载状态 —— */
.mc-loading { text-align: center; padding: 48px 20px; }
.mc-loading-spinner {
  display: inline-block; width: 32px; height: 32px;
  border: 3px solid #e8e8e8; border-top-color: #667eea;
  border-radius: 50%; animation: mc-spin .7s linear infinite;
}
@keyframes mc-spin { to { transform: rotate(360deg); } }
.mc-loading-text { margin-top: 12px; color: #999; font-size: 13px; }

/* —— 错误状态 —— */
.mc-error { text-align: center; padding: 48px 20px; }
.mc-error-icon { font-size: 36px; margin-bottom: 10px; }
.mc-error-message { color: #666; font-size: 13px; margin-bottom: 16px; }
.mc-retry-btn {
  padding: 7px 20px; background: #667eea; color: #fff;
  border: none; border-radius: 6px; font-size: 13px; cursor: pointer;
  transition: background .2s;
}
.mc-retry-btn:hover { background: #5a6fd6; }

/* —— 浮动操作栏（review-list 内的复选框选择栏）—— */
.mc-float-bar {
  position: fixed; bottom: 0; left: 220px; right: 0; z-index: 100;
  display: flex; align-items: center; gap: 12px;
  padding: 10px 20px; background: #fff;
  border-top: 2px solid #667eea; box-shadow: 0 -2px 8px rgba(0,0,0,.08);
  transition: transform .25s ease;
}
.mc-float-count { font-size: 13px; color: #666; }
.mc-float-count strong { color: #667eea; font-size: 15px; }
.mc-float-btn-primary {
  padding: 7px 18px; background: #667eea; color: #fff;
  border: none; border-radius: 6px; font-size: 13px; cursor: pointer;
  transition: background .2s;
}
.mc-float-btn-primary:hover:not(:disabled) { background: #5a6fd6; }
.mc-float-btn-primary:disabled { opacity: .5; cursor: not-allowed; }
.mc-float-btn-cancel {
  padding: 7px 16px; background: #fff; color: #666;
  border: 1px solid #d9d9d9; border-radius: 6px;
  font-size: 13px; cursor: pointer; transition: all .2s;
}
.mc-float-btn-cancel:hover { border-color: #ff4d4f; color: #ff4d4f; }

/* —— 复选框（review-list 表格内）—— */
.mc-checkbox-cell { width: 40px; text-align: center; }
.mc-checkbox { width: 15px; height: 15px; cursor: pointer; accent-color: #667eea; }

/* ==================== CM1 AI 沟通话术生成（AI Script Generator）样式 ==================== */

/* —— 页面容器 —— */
.asg-page-container { padding: 0; }
.asg-page-title {
  font-size: 18px; font-weight: 600; color: #1a1a2e; padding: 14px 20px;
  background: linear-gradient(135deg, #f0f4ff 0%, #f8f0ff 100%);
  border-bottom: 1px solid #e0e7ff;
}
.asg-page-title span {
  font-size: 12px; font-weight: 400; color: #999; margin-left: 12px;
}

/* —— 筛选栏 —— */
.asg-filter-bar { padding: 12px 20px; background: #fff; border-bottom: 1px solid #f0f0f0; }
.asg-filter-row { display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.asg-filter-group { display: flex; flex-direction: column; gap: 4px; }
.asg-filter-label { font-size: 12px; color: #999; font-weight: 500; }
.asg-filter-actions { flex-direction: row; align-items: flex-end; margin-left: auto; }
.asg-select {
  padding: 7px 10px; border: 1px solid #d9d9d9; border-radius: 6px;
  font-size: 13px; color: #333; background: #fff; cursor: pointer;
  min-width: 160px; outline: none;
}
.asg-select:focus { border-color: #667eea; box-shadow: 0 0 0 2px rgba(102,126,234,.15); }

/* —— 按钮组 —— */
.asg-btn {
  padding: 7px 16px; border: 1px solid #d9d9d9; border-radius: 6px;
  font-size: 13px; cursor: pointer; transition: all .2s; white-space: nowrap;
}
.asg-btn:disabled { opacity: .5; cursor: not-allowed; }
.asg-btn-primary {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: #fff; border-color: transparent;
}
.asg-btn-primary:hover:not(:disabled) { background: linear-gradient(135deg, #5a6fd6 0%, #6a4192 100%); }
.asg-btn-outline {
  background: #fff; color: #667eea; border-color: #667eea;
}
.asg-btn-outline:hover:not(:disabled) { background: #f0f4ff; }
.asg-btn-default {
  background: #fff; color: #666; border-color: #d9d9d9;
}
.asg-btn-default:hover:not(:disabled) { border-color: #999; color: #333; }

/* —— 主布局（左预览 + 右历史）—— */
.asg-main-layout {
  display: flex; gap: 0; height: calc(100vh - 280px); min-height: 500px;
}
.asg-left-panel {
  flex: 1; display: flex; flex-direction: column; border-right: 1px solid #f0f0f0;
  overflow-y: auto;
}
.asg-right-panel { width: 300px; display: flex; flex-direction: column; }

/* —— 预览区域 —— */
.asg-preview-area { flex: 1; padding: 20px; overflow-y: auto; }
.asg-empty-preview { text-align: center; padding: 60px 20px; }
.asg-empty-icon { font-size: 48px; margin-bottom: 12px; opacity: .5; }
.asg-empty-text { color: #999; font-size: 13px; }

/* —— 话术内容块 —— */
.asg-block {
  margin-bottom: 14px; border-radius: 8px; overflow: hidden;
}
.asg-block-header {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 14px; font-weight: 600; font-size: 13px;
}
.asg-block-icon { font-size: 15px; }
.asg-block-title { color: inherit; }
.asg-block-body { padding: 10px 16px 14px; }
.asg-block-text { font-size: 13px; color: #333; line-height: 1.8; }

/* 区块配色（通过内联 border-left/background 控制，此处仅定义公用） */
.asg-block-header { border-bottom: 1px solid rgba(0,0,0,.06); }

/* —— 异议处理行 —— */
.asg-obj-row {
  display: flex; flex-direction: column; gap: 6px;
  padding: 10px 14px; margin-bottom: 8px; border-radius: 6px;
}
.asg-obj-question { font-size: 12px; color: #ff4d4f; font-weight: 500; }
.asg-obj-answer { font-size: 13px; color: #52c41a; line-height: 1.6; }

/* —— 操作栏 —— */
.asg-action-bar { padding: 14px 20px; border-top: 1px solid #f0f0f0; background: #fafafa; }
.asg-action-row { display: flex; gap: 10px; }

/* —— 历史面板 —— */
.asg-history-panel { display: flex; flex-direction: column; height: 100%; }
.asg-history-header-bar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px; background: #fafafa; border-bottom: 1px solid #f0f0f0;
  cursor: pointer; user-select: none;
}
.asg-history-title { font-size: 13px; font-weight: 600; color: #555; }
.asg-history-toggle { cursor: pointer; }
.asg-history-arrow {
  display: inline-block; font-size: 11px; color: #999; transition: transform .2s;
}
.asg-history-arrow.open { transform: rotate(180deg); }
.asg-history-body { flex: 1; overflow-y: auto; padding: 8px; }
.asg-history-body.collapsed { display: none; }

.asg-history-item {
  padding: 10px 12px; margin-bottom: 6px; background: #fff;
  border: 1px solid #f0f0f0; border-radius: 8px; cursor: pointer;
  transition: all .15s;
}
.asg-history-item:hover { border-color: #d0d5ff; background: #f8f9ff; }
.asg-history-header { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.asg-history-type {
  display: inline-block; padding: 2px 8px; background: #f0f4ff;
  border-radius: 10px; font-size: 11px; color: #667eea; font-weight: 500;
}
.asg-history-status { font-size: 11px; font-weight: 500; }
.asg-history-time { font-size: 11px; color: #bbb; margin-bottom: 4px; }
.asg-history-snippet {
  font-size: 12px; color: #999; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap;
}

/* —— 加载遮罩 —— */
.asg-loading-overlay {
  display: none; position: fixed; inset: 0; z-index: 9999;
  background: rgba(255,255,255,.85);
}
.asg-loading-overlay.show { display: flex; align-items: center; justify-content: center; }
.asg-loading-spinner {
  padding: 20px 36px; background: #fff; border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0,0,0,.1); font-size: 14px; color: #667eea;
}
.asg-loading-text { color: #999; font-size: 13px; text-align: center; padding: 20px; }
.asg-error-text { color: #ff4d4f; font-size: 13px; text-align: center; padding: 12px; }

/* —— 修改弹窗 —— */
.asg-modified-modal {
  display: none; position: fixed; inset: 0; z-index: 10000;
  background: rgba(0,0,0,.45); align-items: center; justify-content: center;
}
.asg-modified-modal.show { display: flex; }
.asg-modified-content {
  width: 600px; max-width: 90vw; max-height: 80vh;
  background: #fff; border-radius: 12px; box-shadow: 0 8px 40px rgba(0,0,0,.15);
  display: flex; flex-direction: column; overflow: hidden;
}
.asg-modified-title {
  padding: 16px 20px; font-size: 16px; font-weight: 600; color: #1a1a2e;
  border-bottom: 1px solid #f0f0f0;
}
.asg-modified-textarea {
  flex: 1; padding: 16px 20px; border: none; outline: none;
  font-size: 13px; color: #333; line-height: 1.8; resize: vertical;
  min-height: 300px; font-family: inherit;
}
.asg-modified-buttons {
  padding: 12px 20px; display: flex; justify-content: flex-end; gap: 10px;
  border-top: 1px solid #f0f0f0; background: #fafafa;
}

/* ============================================================
   C3 意向度动态评分 — intent-score / is-* 系列
   ============================================================ */

/* Tab 切换栏 */
.is-tab-bar {
  display: flex;
  gap: 0;
  margin-bottom: 16px;
  background: #f5f5f5;
  border-radius: 10px;
  padding: 4px;
}
.is-tab-btn {
  flex: 1;
  padding: 10px 20px;
  border: none;
  background: transparent;
  font-size: 14px;
  font-weight: 500;
  color: #666;
  cursor: pointer;
  border-radius: 8px;
  transition: all 0.2s;
}
.is-tab-btn:hover {
  color: #149ebb;
  background: rgba(20, 158, 187, 0.06);
}
.is-tab-btn.is-tab-active {
  background: #fff;
  color: #149ebb;
  font-weight: 700;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

/* C3 卡片 */
.is-card {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
  overflow: hidden;
  transition: box-shadow 0.2s;
  margin-bottom: 12px;
}
.is-card:hover {
  box-shadow: 0 3px 12px rgba(0,0,0,0.1);
}
.is-card-header {
  display: flex;
  align-items: center;
  padding: 14px 16px;
  cursor: pointer;
  gap: 14px;
}
.is-card-left { flex-shrink: 0; }
.is-score-badge {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-weight: 700;
}
.is-score-num { font-size: 24px; line-height: 1; }
.is-score-unit { font-size: 10px; line-height: 1; }
.is-card-info { flex: 1; min-width: 0; }
.is-card-name-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
  flex-wrap: wrap;
}
.is-student-name { font-size: 15px; font-weight: 600; color: #1a1a1a; }
.is-intent-tag {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 10px;
  font-weight: 500;
}
.is-trend-badge {
  font-size: 12px;
  font-weight: 600;
}
.is-sentiment-badge {
  font-size: 12px;
  color: #666;
  background: #f5f5f5;
  padding: 2px 8px;
  border-radius: 4px;
}
.is-card-meta {
  display: flex;
  gap: 14px;
  font-size: 12px;
  color: #888;
  flex-wrap: wrap;
}
.is-card-expand-icon { font-size: 12px; color: #bbb; flex-shrink: 0; }
.is-card-footer {
  padding: 10px 16px;
  border-top: 1px solid #f0f0f0;
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
}
.is-nba-text {
  flex: 1;
  font-size: 12px;
  color: #666;
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.is-refresh-single-btn {
  flex-shrink: 0;
  padding: 4px 12px;
  border: 1px solid #d9d9d9;
  border-radius: 6px;
  font-size: 12px;
  background: #fff;
  color: #666;
  cursor: pointer;
  white-space: nowrap;
}
.is-refresh-single-btn:hover { border-color: #149ebb; color: #149ebb; }

/* C3 展开区域 */
.is-expanded-content { padding: 0 16px 14px; }
.is-dim-section { margin-bottom: 12px; }
.is-dim-title { font-size: 14px; font-weight: 600; color: #333; margin-bottom: 10px; }
.is-dim-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}
.is-dim-label { width: 110px; font-size: 12px; color: #555; flex-shrink: 0; }
.is-dim-bar-wrap { flex: 1; min-width: 100px; }
.is-progress-bar {
  height: 10px;
  background: #f0f0f0;
  border-radius: 5px;
  overflow: hidden;
}
.is-progress-fill {
  height: 100%;
  border-radius: 5px;
  transition: width 0.3s ease;
}
.is-dim-value {
  width: 42px;
  font-size: 14px;
  font-weight: 700;
  text-align: right;
  flex-shrink: 0;
}
.is-dim-sub {
  width: 100%;
  font-size: 11px;
  color: #aaa;
  margin-left: 118px;
  margin-top: -4px;
  margin-bottom: 4px;
}

/* C3 情感关键词 */
.is-kw-section { background: #fafafa; border-radius: 8px; padding: 10px 12px; margin-top: 8px; }
.is-kw-title { font-size: 12px; font-weight: 600; color: #666; margin-bottom: 6px; }
.is-kw-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.is-kw-tag {
  display: inline-block;
  padding: 3px 10px;
  background: #e6f7ff;
  color: #149ebb;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 500;
}

/* C3 转换信号 */
.is-signal-badge {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 10px;
  font-weight: 500;
}
.is-signal-trial-booked { background: #e6f7ff; color: #149ebb; }
.is-signal-trial-completed { background: #f6ffed; color: #52c41a; }
.is-signal-deal-closed { background: #fff7e6; color: #fa8c16; }

/* C3 趋势图标 */
.is-trend-icon { font-weight: 700; margin-right: 2px; }
.is-trend-rising { color: #52c41a; }
.is-trend-declining { color: #ff4d4f; }
.is-trend-stable { color: #999; }

/* C3 筛选提示 */
.is-filter-hint {
  font-size: 12px;
  color: #999;
  white-space: nowrap;
}

/* ==================== A1: 自动跟进页面样式 ==================== */

/* ---- 页面容器 ---- */
.fu-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 0;
}

/* ---- 统计卡片行 ---- */
.fu-stats-row {
  display: flex;
  gap: 16px;
  margin-bottom: 4px;
  flex-wrap: wrap;
}

.fu-stat-card {
  background: var(--white);
  border-radius: 10px;
  padding: 16px 20px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  display: flex;
  align-items: center;
  gap: 14px;
  flex: 1;
  min-width: 140px;
  transition: all 0.2s;
  cursor: default;
}

.fu-stat-card:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  transform: translateY(-1px);
}

.fu-stat-pending { border-left: 4px solid #1890ff; }
.fu-stat-approved { border-left: 4px solid #52c41a; }
.fu-stat-sent { border-left: 4px solid #2f54eb; }
.fu-stat-replied { border-left: 4px solid #389e0d; }

.fu-stat-icon {
  font-size: 28px;
  flex-shrink: 0;
}

.fu-stat-body {
  flex: 1;
}

.fu-stat-count {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.1;
  color: var(--dark);
}

.fu-stat-label {
  font-size: 13px;
  color: var(--gray);
  margin-top: 2px;
}

/* ---- 筛选栏 ---- */
.fu-filter-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: var(--white);
  padding: 12px 16px;
  border-radius: 10px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  flex-wrap: wrap;
}

.fu-filter-left {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.fu-filter-right {
  display: flex;
  gap: 8px;
  align-items: center;
}

.fu-filter-select {
  padding: 6px 12px;
  border: 1px solid #d9d9d9;
  border-radius: 6px;
  font-size: 13px;
  color: var(--dark);
  background: var(--white);
  cursor: pointer;
  outline: none;
  font-family: var(--font-family);
  min-width: 120px;
}

.fu-filter-select:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 2px rgba(241, 141, 36, 0.15);
}

/* ---- 状态 Tabs ---- */
.fu-tabs {
  display: flex;
  gap: 0;
  background: var(--white);
  border-radius: 10px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  overflow: hidden;
}

.fu-tab {
  flex: 1;
  padding: 12px 20px;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  color: var(--gray);
  cursor: pointer;
  transition: all 0.2s;
  border-bottom: 3px solid transparent;
  user-select: none;
}

.fu-tab:hover {
  color: var(--dark);
  background: rgba(0,0,0,0.02);
}

.fu-tab-active {
  color: var(--primary);
  border-bottom-color: var(--primary);
  font-weight: 600;
  background: rgba(241, 141, 36, 0.04);
}

/* ---- 任务列表 ---- */
.fu-task-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* ---- 任务卡片 ---- */
.fu-task-card {
  background: var(--white);
  border-radius: 10px;
  padding: 16px 20px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  transition: all 0.2s;
  border-left: 4px solid transparent;
}

.fu-task-card:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* 根据状态设置左边框颜色 */
.fu-task-card:has(.fu-tag[style*="1890ff"]) { border-left-color: #1890ff; }
.fu-task-card:has(.fu-tag[style*="52c41a"]) { border-left-color: #52c41a; }
.fu-task-card:has(.fu-tag[style*="2f54eb"]) { border-left-color: #2f54eb; }
.fu-task-card:has(.fu-tag[style*="fa8c16"]) { border-left-color: #fa8c16; }
.fu-task-card:has(.fu-tag[style*="389e0d"]) { border-left-color: #389e0d; }

.fu-task-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 10px;
  gap: 12px;
}

.fu-task-card-left {
  flex: 1;
  min-width: 0;
}

.fu-task-name {
  font-size: 16px;
  font-weight: 600;
  color: var(--dark);
  margin-bottom: 2px;
}

.fu-task-subtitle {
  font-size: 12px;
  color: #999;
}

.fu-task-card-right {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-shrink: 0;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.fu-task-card-body {
  margin-bottom: 10px;
}

.fu-task-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  font-size: 12px;
  color: #888;
}

.fu-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}

.fu-countdown-overdue {
  color: #ff4d4f;
  font-weight: 600;
}

/* ---- 状态标签 ---- */
.fu-tag {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

.fu-tag-pending { background: #e6f7ff; color: #1890ff; }
.fu-tag-approved { background: #f6ffed; color: #52c41a; }
.fu-tag-sent { background: #f0f5ff; color: #2f54eb; }
.fu-tag-replied { background: #f6ffed; color: #389e0d; }
.fu-tag-opened { background: #fff7e6; color: #fa8c16; }
.fu-tag-skipped { background: #f5f5f5; color: #999; }
.fu-tag-failed { background: #fff2f0; color: #ff4d4f; }

/* ---- 意向度标签 ---- */
.fu-intent-tag {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

.fu-intent-high { background: #fff2f0; color: #ff4d4f; border: 1px solid #ffccc7; }
.fu-intent-medium { background: #fffbe6; color: #faad14; border: 1px solid #ffe58f; }
.fu-intent-low { background: #f5f5f5; color: #999; border: 1px solid #d9d9d9; }

/* ---- 阶段标签 ---- */
.fu-stage-tag {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 500;
  color: #666;
  background: #fafafa;
  border: 1px solid #e8e8e8;
  white-space: nowrap;
  gap: 3px;
}

/* ---- 话术预览 ---- */
.fu-script-preview {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #f0f0f0;
}

.fu-script-label {
  font-size: 13px;
  color: var(--secondary);
  cursor: pointer;
  font-weight: 500;
  user-select: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.fu-script-label:hover {
  color: var(--secondary-dark);
}

.fu-script-content {
  margin-top: 8px;
  padding: 12px 16px;
  background: #fafbfc;
  border-radius: 8px;
  border: 1px solid #e8e8e8;
  font-size: 13px;
  line-height: 1.8;
  color: #555;
}

.fu-script-collapsed {
  display: none;
}

.fu-script-expanded {
  display: block;
}

/* ---- 任务卡片底部 ---- */
.fu-task-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 10px;
  border-top: 1px solid #f5f5f5;
}

.fu-task-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

/* ---- 操作按钮 ---- */
.fu-btn {
  padding: 6px 14px;
  border: none;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  font-family: var(--font-family);
  white-space: nowrap;
}

.fu-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

.fu-btn:active {
  transform: translateY(0);
}

.fu-btn-approve {
  background: #52c41a;
  color: #fff;
}

.fu-btn-approve:hover {
  background: #389e0d;
}

.fu-btn-send {
  background: #1890ff;
  color: #fff;
}

.fu-btn-send:hover {
  background: #096dd9;
}

.fu-btn-skip {
  background: #f5f5f5;
  color: #666;
  border: 1px solid #d9d9d9;
}

.fu-btn-skip:hover {
  background: #e8e8e8;
}

.fu-btn-check {
  background: #fa8c16;
  color: #fff;
}

.fu-btn-check:hover {
  background: #d46b08;
}

.fu-btn-plan {
  background: var(--primary);
  color: #fff;
  font-weight: 600;
}

.fu-btn-plan:hover {
  background: var(--primary-dark);
}

/* ---- 分页 ---- */
.fu-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 16px 0;
}

.fu-page-btn {
  padding: 6px 14px;
  border: 1px solid #d9d9d9;
  border-radius: 6px;
  background: var(--white);
  color: var(--dark);
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
  font-family: var(--font-family);
}

.fu-page-btn:hover:not(:disabled) {
  border-color: var(--primary);
  color: var(--primary);
}

.fu-page-btn:disabled {
  color: #ccc;
  cursor: not-allowed;
  background: #f5f5f5;
}

.fu-page-active {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff !important;
  font-weight: 600;
}

.fu-page-ellipsis {
  padding: 6px 4px;
  color: #999;
  font-size: 13px;
}

/* ---- 响应式 ---- */
@media (max-width: 768px) {
  .fu-stats-row {
    gap: 8px;
  }

  .fu-stat-card {
    min-width: calc(50% - 8px);
    padding: 12px 14px;
  }

  .fu-stat-count {
    font-size: 22px;
  }

  .fu-filter-bar {
    flex-direction: column;
    align-items: stretch;
  }

  .fu-filter-left {
    flex-direction: column;
  }

  .fu-filter-select {
    width: 100%;
  }

  .fu-tabs {
    overflow-x: auto;
  }

  .fu-tab {
    flex: none;
    padding: 10px 14px;
    font-size: 12px;
    white-space: nowrap;
  }

  .fu-task-card-header {
    flex-direction: column;
  }

  .fu-task-card-right {
    justify-content: flex-start;
  }

  .fu-task-actions {
    flex-wrap: wrap;
  }
}
