/* 流量统计图表样式 */
.stats-tabs { margin-bottom: 20px; }
.stats-tabs ul { display: flex; list-style: none; padding: 0; margin: 0; border-bottom: 1px solid #e6e6e6; }
.stats-tabs li { padding: 8px 15px; cursor: pointer; font-size: 14px; border-bottom: 2px solid transparent; transition: all 0.3s ease; }
.stats-tabs li:hover { color: #4e73df; }
.stats-tabs li.active { color: #4e73df; border-bottom-color: #4e73df; font-weight: bold; }
.stats-chart-container { height: 250px; margin-bottom: 20px; }
.stats-summary { display: flex; justify-content: space-around; padding: 20px 0 0 0; border-top: 1px solid #e6e6e6; margin:20px 0;}
.stats-item { text-align: center; }
.stats-label { font-size: 14px; margin-bottom: 5px; }
.stats-value-wrapper { display: flex; justify-content: center; align-items: baseline; }
.stats-value { font-size: 24px; font-weight: bold; }
.stats-period { font-size: 12px; margin-left: 5px; color: #999;position: relative; top: -2px; }
.pv-color { color: #4e73df; }
.ip-color { color: #1cc88a; }
.click-color { color: #f6c23e; }
/* 暗黑模式适配 */
.fuinight .stats-tabs ul { border-bottom-color: #444444; }
.fuinight .stats-tabs li.active { color: #5e83ef; border-bottom-color: #5e83ef; }
.fuinight .stats-summary { border-top-color: #444444; }
.fuinight .stats-label.pv-color { color: #5e83ef; }
.fuinight .stats-label.ip-color { color: #2cd89a; }
.fuinight .stats-label.click-color { color: #f6d24e; }
.fuinight .stats-period{ color: #777; }
/* 移动端适配 */
@media screen and (max-width: 720px) {
    .stats-tabs li { padding: 8px 10px; font-size: 12px; }
    .stats-summary { flex-direction: column; padding:0;}
    .stats-item { padding-top: 20px;margin-top:20px;   border-top: .01rem solid #e6e6e6;}
    .stats-item:first-child {  border: 0; margin-top:0;}
    .stats-chart-container { height: 200px; }
    .fuinight .stats-item {border-top: .01rem solid #444444;}
}
