/* ======================================================= */
/* 足球比分直播 - 最终完整修复版（已修复当前时间 + 倒计时） */
/* ======================================================= */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { 
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; 
    background: #f8f9fa; 
    color: #1f2937; 
}

/* 容器 */
.hoy-wrapper { display:block; margin:0 auto; padding:16px; background:#f8f9fa; min-height:100vh; }
.hoy-main { width:80%; margin:0 auto;background:#fff; border-radius:12px; box-shadow:0 10px 25px rgba(0,0,0,.08); overflow:hidden; }

/* 动态导航栏 */
.data-nav {
    display: flex; background: #fff; border-bottom: 1px solid #e5e7eb; padding: 0 20px;
    flex-wrap: wrap; gap: 4px;
}
.data-nav a {
    padding: 14px 20px; font-size: 15px; font-weight: 600; color: #475569;
    text-decoration: none; border-bottom: 3px solid transparent;
    display: flex; align-items: center; gap: 6px; white-space: nowrap;
}
.data-nav a.active { color: #dc2626; border-bottom: 3px solid #dc2626; }
.data-nav .count {
    background: #e2e8f0; color: #475569; font-size: 13px;
    padding: 2px 8px; border-radius: 9999px; font-weight: 500;
}

/* 顶部操作栏 */
.hoy-topbar { padding: 20px; background: #fff; border-bottom: 1px solid #e5e7eb; }
.hoy-topbar-content { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }

.hoy-date-picker, .hoy-filter-select, .hoy-search-box { flex: 1; min-width: 200px; }
#date-input { padding:12px 16px; border:1px solid #d1d5db; border-radius:8px; font-size:16px; }
.hoy-btn-primary {
    padding:12px 28px; background:linear-gradient(135deg,#1e40af,#1e3a8a);
    color:#fff; border:none; border-radius:8px; font-weight:600; font-size:16px; cursor:pointer;
}
.hoy-btn-small {
    padding:12px 20px; background:#64748b; color:#fff; border:none; border-radius:8px; cursor:pointer;
}

/* 当前时间条 + 自动刷新指示器（关键修复） */
.info-bar {
    display:flex; justify-content:center; align-items:center;
    padding:14px 20px; background:#f0f7ff; border-bottom:1px solid #e5e7eb;
    font-size:15px; font-weight:600; color:#1e40af;
}


/* 主表格 */
#table-matches-content table { width:100%; border-collapse:collapse; font-size:15px; background:#fff; }
#table-matches-content thead th {
    background:#f8fafc; color:#475569; padding:12px 8px; font-weight:600;
    text-align:center; border-bottom:2px solid #e2e8f0;
}
#table-matches-content tbody tr { border-bottom:1px solid #f1f5f9; }
#table-matches-content tbody tr:hover { background:#f8fafc; }
#table-matches-content td { padding:14px 8px; vertical-align:middle; text-align:center; }

/* 联赛彩标 + 球队 + 比分 + 状态 */
.league-tag { display:inline-block; padding:4px 12px; border-radius:4px; font-size:13px; font-weight:600; color:#fff; }
.team-cell { display:flex; align-items:center; gap:8px; justify-content:center; }
.team-logo { width:28px; height:28px; border-radius:50%; flex-shrink:0; }
.team-name { font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:160px; }
.score-cell { font-size:24px; font-weight:800; color:#dc2626; min-width:80px; }
.score-details { font-size:12px; color:#64748b; margin-top:4px; }
.status { display:inline-block; padding:6px 16px; border-radius:9999px; font-size:13.5px; font-weight:700; min-width:68px; }
.not-started .status { background:#64748b; color:#fff; }
.in-progress .status { background:#dc2626; color:#fff; animation:pulse 2s infinite; }
.match-finished .status { background:#16a34a; color:#fff; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:0.75} }

/* 其他 */
.notice { text-align:center; padding:20px; background:#f8fafc; color:#64748b; border-radius:8px; margin:20px; }

/* 响应式 */
@media (max-width:768px) {
    .hoy-main { width:100%;}
    .hoy-topbar-content { flex-direction:column; }
    #table-matches-content td, #table-matches-content th { padding:10px 6px; font-size:14px; }
}


@keyframes spin {
    to { transform: rotate(360deg); }
}

/* 倒计时数字高亮 */
#refresh-countdown {
    font-weight: 700;
    min-width: 24px;
    text-align: center;
}

/* ====================== 角球 / 黄牌 / 红牌 统计列优化 ====================== */
#table-matches-content td:nth-child(7),  /* 角球列 */
#table-matches-content td:nth-child(8),  /* 黄牌列 */
#table-matches-content td:nth-child(9) { /* 红牌列 */
    width: 68px !important;
    min-width: 68px !important;
    max-width: 68px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #1e40af !important;
    text-align: center !important;
    letter-spacing: -0.5px;
    padding: 14px 4px !important;
}

/* 角球列（绿色调，更突出） */
#table-matches-content td:nth-child(7) {
    color: #10b981 !important;
    background: rgba(16, 185, 129, 0.08);
}

/* 黄牌列（橙色调） */
#table-matches-content td:nth-child(8) {
    color: #f59e0b !important;
    background: rgba(245, 158, 11, 0.08);
}

/* 红牌列（红色调） */
#table-matches-content td:nth-child(9) {
    color: #ef4444 !important;
    background: rgba(239, 68, 68, 0.08);
}

/* 移动端适配（防止挤压） */
@media (max-width: 768px) {
    #table-matches-content td:nth-child(7),
    #table-matches-content td:nth-child(8),
    #table-matches-content td:nth-child(9) {
        width: 55px !important;
        min-width: 55px !important;
        font-size: 14px !important;
        padding: 12px 2px !important;
    }
}