/* 升单率统计模块样式 */

/* 升单率内容容器 */
.upgrade-rate-content {
    padding: 20px 0;
}

/* 汇总卡片容器 - 复用conversion-rate的样式 */
.upgrade-summary-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

/* 升单排行 */
.upgrade-ranking {
    margin-bottom: 30px;
}

.upgrade-ranking h4 {
    margin-bottom: 15px;
    color: #333;
}

/* 升单率样式 */
.upgrade-rate {
    font-weight: bold;
    padding: 4px 8px;
    border-radius: 4px;
}

/* 升单服务组合 */
.upgrade-combinations {
    margin-bottom: 30px;
}

.upgrade-combinations h4 {
    margin-bottom: 15px;
    color: #333;
}

.upgrade-paths {
    display: grid;
    gap: 15px;
}

/* 升单路径项 */
.upgrade-path-item {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 15px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: all 0.3s;
}

.upgrade-path-item:hover {
    background: white;
    border-color: #007bff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.path-arrow {
    display: flex;
    align-items: center;
    gap: 15px;
    flex: 1;
}

.original-service {
    font-size: 15px;
    color: #666;
}

.arrow {
    font-size: 20px;
    color: #28a745;
    font-weight: bold;
}

.upgraded-service {
    font-size: 16px;
    font-weight: bold;
    color: #333;
}

.path-stats {
    display: flex;
    align-items: center;
    gap: 15px;
    color: #666;
    font-size: 14px;
}

.path-stats .stat-label {
    font-size: 12px;
}

.path-stats .stat-value {
    font-weight: bold;
    color: #333;
}

/* 客户来源升单分析 */
.source-upgrade-analysis {
    margin-top: 30px;
}

.source-upgrade-analysis h4 {
    margin-bottom: 15px;
    color: #333;
}

.source-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
}

/* 来源卡片 - 复用channel-card样式 */
.source-card {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 20px;
    transition: all 0.3s;
}

.source-card:hover {
    border-color: #28a745;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.source-name {
    font-size: 16px;
    font-weight: bold;
    color: #333;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 2px solid #f0f0f0;
}

.source-stats {
    display: flex;
    justify-content: space-between;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .upgrade-summary-cards {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }
    
    .path-arrow {
        flex-direction: column;
        gap: 10px;
        text-align: center;
    }
    
    .arrow {
        transform: rotate(90deg);
    }
    
    .upgrade-path-item {
        flex-direction: column;
        gap: 15px;
    }
    
    .path-stats {
        width: 100%;
        justify-content: space-around;
    }
    
    .source-grid {
        grid-template-columns: 1fr;
    }
}

/* 特殊强调样式 */
.upgrade-path-item:first-child {
    border-color: #ffc107;
    background: #fffaf0;
}

.upgrade-path-item:first-child .arrow {
    color: #ff6b6b;
}

/* 升单率优秀的高亮 */
.upgrade-ranking tr:first-child td {
    background-color: rgba(40, 167, 69, 0.05);
}

/* 加载状态 */
.upgrade-rate-content .loading-spinner {
    text-align: center;
    color: #666;
    padding: 60px;
}

/* 错误和无数据状态 */
.upgrade-rate-content .error-message,
.upgrade-rate-content .no-data-message {
    text-align: center;
    padding: 60px;
}

.upgrade-rate-content .error-message {
    color: #dc3545;
}

.upgrade-rate-content .no-data-message {
    color: #666;
}