/* 优化版访问统计样式（解决陛下指出的三个问题） */

/* 1. 解决字体灰色看不清问题 */
.stats-list.optimized .stat-label {
    font-size: 14px;
    color: #2c3e50;  /* 深蓝色，清晰可见 */
    font-weight: 500;
    opacity: 0.9;
}

/* 2. 解决数据白底黑字太难看问题 */
.stats-list.optimized .stat-value {
    font-size: 14px;
    font-weight: 600;
    color: #2c3e50;  /* 深蓝色文字，清晰可见 */
    padding: 2px 8px;
    border-radius: 4px;
    background: transparent;  /* 透明背景 */
    transition: all 0.2s ease;
    min-width: 60px;
    text-align: right;
}

/* 高亮数值（总浏览量和今日浏览） */
.stats-list.optimized .stat-value.highlight {
    color: #e74c3c;  /* 红色文字，突出重要数据 */
    font-weight: 700;
    background: transparent;  /* 透明背景 */
}

/* 百分比数值 */
.stats-list.optimized .stat-value.percentage {
    color: #27ae60;  /* 绿色文字，表示比例 */
    background: transparent;  /* 透明背景 */
}

/* 分类数值 */
.stats-list.optimized .stat-value.category {
    color: #8e44ad;  /* 紫色文字，表示分类 */
    background: transparent;  /* 透明背景 */
}

/* 3. 解决更新时间重复问题 - 确保只有一个footer */
.stats-list.optimized + .stats-footer {
    margin-top: 15px;
    padding-top: 12px;
    border-top: 1px solid #ecf0f1;
    text-align: center;
}

.stats-footer .update-time {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #7f8c8d;  /* 灰色文字，作为次要信息 */
    font-size: 12px;
    opacity: 0.8;
}

.stats-footer .time-icon {
    font-size: 11px;
}

.stats-footer .time-text {
    font-weight: 500;
}

/* 悬停效果优化 */
.stats-list.optimized .stat-row:hover {
    background-color: rgba(44, 62, 80, 0.5);
    border-radius: 6px;
    padding-left: 8px;
    padding-right: 8px;
}

.stats-list.optimized .stat-row:hover .stat-value {
    background: rgba(236, 240, 241, 0.3);  /* 悬停时添加轻微背景 */
    transform: translateX(-2px);
}

/* 响应式设计 */
@media (max-width: 768px) {
    .stats-list.optimized .stat-row {
        padding: 7px 0;
    }
    
    .stats-list.optimized .stat-label,
    .stats-list.optimized .stat-value {
        font-size: 13px;
    }
    
    .stats-list.optimized .stat-value {
        padding: 1px 6px;
        min-width: 50px;
    }
}