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

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

/* 2. 解决数据白底黑字太难看问题 */
.stats-list.optimized .stat-value {
    font-size: 14px;
    font-weight: 600;
    color: #ffffff;  /* 深蓝色，与标签协调 */
    padding: 2px 8px;
    border-radius: 4px;
    background: rgba(52, 73, 94, 0.7);  /* 非常浅的灰色背景，柔和 */
    transition: all 0.2s ease;
    min-width: 60px;
    text-align: right;
}

/* 高亮数值（总浏览量和今日浏览） */
.stats-list.optimized .stat-value.highlight {
    color: #ffffff;  /* 红色，突出重要数据 */
    font-weight: 700;
    background: rgba(231, 76, 60, 0.7);  /* 浅红色背景 */
}

/* 百分比数值 */
.stats-list.optimized .stat-value.percentage {
    color: #ffffff;  /* 绿色，表示比例 */
    background: rgba(39, 174, 96, 0.7);  /* 浅绿色背景 */
}

/* 分类数值 */
.stats-list.optimized .stat-value.category {
    color: #ffffff;  /* 紫色，表示分类 */
    background: rgba(142, 68, 173, 0.7);  /* 浅紫色背景 */
}

/* 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: #ffffff;  /* 灰色，作为次要信息 */
    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(52, 73, 94, 0.7);
    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;
    }
}