/* 赛事中心页面样式 - 简洁风格，与系统统一 */

.container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 20px 24px;
}

.match-filter {
    display: flex;
    gap: 8px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.filter-btn {
    padding: 8px 20px;
    border: 1px solid #E2E8F0;
    background: #fff;
    color: #64748B;
    border-radius: 20px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    transition: all 0.2s;
}

.filter-btn:hover { color: #2563EB; border-color: #93C5FD; }

.filter-btn.active {
    background: #2563EB;
    color: #fff;
    border-color: #2563EB;
    box-shadow: 0 2px 8px rgba(37,99,235,0.25);
}

.match-list { display: flex; flex-direction: column; gap: 16px; }

.match-card {
    background: #fff;
    border-radius: 16px;
    border: 1px solid #E2E8F0;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
    overflow: hidden;
    transition: transform 0.18s, box-shadow 0.18s;
}

.match-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(15,23,42,0.08);
}

.match-card-header {
    padding: 16px 20px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.match-card-title {
    font-size: 18px;
    font-weight: 700;
    color: #0F172A;
    display: flex;
    align-items: center;
    gap: 8px;
}

.match-card-title i { color: #2563EB; }

/* ===== 状态口径表（2026-10-25 全站统一，改色前必须先对齐这里）=====
   赛事：草稿 灰#F1F5F9/#64748B · 报名中 蓝#EFF6FF/#2563EB · 进行中 绿#ECFDF5/#059669 · 已结束 灰#F1F5F9/#94A3B8 · 已归档 深灰#E2E8F0/#475569
   报名审核：待审核 琥珀#FEF3C7/#B45309 · 已通过 绿#D1FAE5/#047857 · 已拒绝 红#FEE2E2/#B91C1C · 未报名 灰#F1F5F9/#94A3B8
   比赛项目：未开始 灰#F1F5F9/#64748B · 检录中 青#CCFBF1/#0F766E · 比赛中 绿#ECFDF5/#059669 · 已完成 灰#F1F5F9/#94A3B8
   同一状态在列表徽章(.status-*/.tag-*)、详情弹窗(.signup-*)、我的赛事、管理后台、现场大屏必须同色（大屏为暗色变体同色相） */
/* 状态徽章：对齐桌面端 Tailwind 色板 */
.match-status {
    padding: 3px 12px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
}

.status-signing { background: #EFF6FF; color: #2563EB; }
.status-scoring { background: #ECFDF5; color: #059669; }
.status-ongoing { background: #ECFDF5; color: #059669; }
.status-finished { background: #F1F5F9; color: #94A3B8; }
.status-draft { background: #F1F5F9; color: #64748B; }
.status-archived { background: #E2E8F0; color: #475569; }

.match-card-body { padding: 12px 20px 4px; }

/* 时间 chips（桌面端同款） */
.match-chips { display: flex; gap: 8px; flex-wrap: wrap; }

.chip {
    background: #F1F5F9;
    color: #475569;
    border-radius: 4px;
    padding: 3px 10px;
    font-size: 11px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.chip i { color: #64748B; }

.match-desc {
    font-size: 13px;
    color: #64748B;
    margin-top: 10px;
    line-height: 1.5;
    word-break: break-word;
}

.match-card-footer {
    padding: 12px 20px;
    background: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    border-top: 1px solid #F1F5F9;
    margin-top: 12px;
}

.match-deadline { font-size: 12px; color: #94A3B8; }

.match-deadline.urgent { color: #DC2626; font-weight: 600; }

.match-action {
    padding: 8px 22px;
    background: #2563EB;
    color: #fff;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    transition: all 0.2s;
    margin-left: auto;
}

.match-action:hover { background: #1D4ED8; }

.match-action:disabled { background: #E2E8F0; color: #94A3B8; cursor: not-allowed; }

.empty-state {
    text-align: center;
    padding: 60px 20px;
    color: #aaa;
}

.empty-state i {
    font-size: 40px;
    margin-bottom: 12px;
    display: block;
}

.empty-state p {
    font-size: 14px;
    margin: 0;
}

/* ==================== v20260923g 新增 ==================== */

/* 赛事封面横幅 */
.match-cover {
    height: 130px;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid #f0f0f0;
}

.match-cover-default {
    background: linear-gradient(135deg, #1a2980 0%, #26d0ce 100%);
    color: rgba(255,255,255,0.85);
    font-size: 40px;
}

.match-status { flex-shrink: 0; }
/* .status-ongoing 旧黄色定义（#fff3cd/#856404）已于 2026-10-25 删除：
   它与后定义的 .status-scoring 同指「进行中」，曾因排在后面而覆盖绿色，导致同一状态两个色 */

.match-info-row { flex-wrap: wrap; }
.match-desc { word-break: break-word; }

.match-card-footer { gap: 8px; flex-wrap: wrap; }

/* 报名状态徽标（与详情弹窗 .signup-* 严格同色：同一状态全站一个色） */
.match-signup-tag {
    font-size: 12px;
    padding: 3px 10px;
    border-radius: 10px;
    font-weight: 500;
    display: inline-block;
}

.tag-none { background: #F1F5F9; color: #94A3B8; }
.tag-pending { background: #FEF3C7; color: #B45309; }
.tag-approved { background: #D1FAE5; color: #047857; }
.tag-rejected { background: #FEE2E2; color: #B91C1C; }

.match-action { margin-left: auto; }

/* ==================== 详情弹窗 ==================== */
.match-modal-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.55);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.match-modal {
    background: #fff;
    border-radius: 12px;
    width: 100%;
    max-width: 720px;
    max-height: 88vh;
    overflow-y: auto;
    position: relative;
    box-shadow: 0 8px 40px rgba(0,0,0,0.25);
}

.match-modal-close {
    width: 32px; height: 32px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: #64748B;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    flex: 0 0 auto;
    transition: background .15s, color .15s;
}

.match-modal-close:hover { background: #F1F5F9; color: #e74c3c; }

/* 封面降级：信息区左侧 96×60 缩略图（识别辅助，不再做 180px 门帘） */
.match-cover-thumb {
    width: 96px; height: 60px;
    border-radius: 8px;
    background-size: cover;
    background-position: center;
    flex: 0 0 auto;
}

.match-modal-header {
    padding: 16px 22px 6px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.match-modal-title { font-size: 19px; font-weight: 700; color: #222; flex: 1; min-width: 0; }

.match-modal-body { padding: 8px 22px 22px; }

.match-modal-info {
    background: #f8fafc;
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 16px;
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.match-info-rows { flex: 1; min-width: 0; }

.match-modal-section-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin: 18px 0 10px;
    padding-left: 8px;
    border-left: 3px solid #3498db;
}

/* 比赛项目列表 */
.subject-list { display: flex; flex-direction: column; gap: 10px; }

.subject-item {
    border: 1px solid #eef0f2;
    border-radius: 8px;
    padding: 12px 14px;
    background: #fff;
}

.subject-name {
    font-size: 14px;
    font-weight: 600;
    color: #222;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.subject-name i { color: #3498db; }

.subject-task {
    font-size: 12px;
    color: #888;
    font-weight: 400;
    background: #f0f4f8;
    padding: 2px 8px;
    border-radius: 10px;
}

.subject-meta { font-size: 12px; color: #888; margin-top: 6px; }

.badge-challenge {
    font-size: 11px;
    color: #9b59b6;
    background: #f3e8fb;
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 500;
}

/* 报名状态区 */
.signup-box {
    margin-top: 18px;
    padding: 14px 16px;
    border-radius: 8px;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    border: 1px dashed #d5dbe1;
}

.signup-box .signup-hint { color: #555; }
.signup-box i { margin-right: 6px; }

/* 报名状态区与列表徽章同色板：待审核=琥珀 / 已通过=绿 / 已拒绝=红 / 进行中=绿 / 已结束=灰 */
.signup-pending { background: #FEF3C7; color: #B45309; border-color: #FDE68A; }
.signup-approved { background: #D1FAE5; color: #047857; border-color: #A7F3D0; }
.signup-rejected { background: #FEE2E2; color: #B91C1C; border-color: #FECACA; }
/* 进行中与状态徽章 .status-scoring 严格同色（#ECFDF5/#059669），全站「进行中」一个色 */
.signup-ongoing { background: #ECFDF5; color: #059669; border-color: #A7F3D0; }
.signup-finished { background: #F1F5F9; color: #94A3B8; border-color: #E2E8F0; }

.signup-btn {
    padding: 7px 22px;
    background: #3498db;
    color: #fff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
}

.signup-btn:hover { background: #2980b9; }

/* 实时成绩榜 */
.rank-section { margin-top: 6px; }

/* 现场直播入口（大屏/手机观赛） */
.live-links {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin: 4px 0 10px;
}
.live-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 16px;
    border-radius: 8px;
    background: linear-gradient(135deg, #667eea, #764ba2);
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s;
}
.live-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(102,126,234,0.4);
}
.live-btn.live-btn-light {
    background: #fff;
    color: #5b3cc4;
    border: 1px solid #d5d9f2;
}
.live-btn.live-btn-light:hover { background: #f0f2ff; }

.rank-loading { color: #aaa; font-size: 13px; padding: 10px 0; text-align: center; }

.rank-subject { margin-bottom: 14px; }

.rank-subject-name {
    font-size: 13px;
    font-weight: 600;
    color: #444;
    margin-bottom: 6px;
}

.rank-subject-name i { color: #f39c12; margin-right: 4px; }

.rank-list { display: flex; flex-direction: column; gap: 4px; }

.rank-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 12px;
    border-radius: 6px;
    background: #fafbfc;
    font-size: 13px;
}

.rank-item.rank-1 { background: #fff9e6; }
.rank-item.rank-2 { background: #f4f6f8; }
.rank-item.rank-3 { background: #fdf1ec; }

.rank-no {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #e0e6ec;
    color: #555;
    font-weight: 600;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.rank-1 .rank-no { background: #f39c12; color: #fff; }
.rank-2 .rank-no { background: #95a5a6; color: #fff; }
.rank-3 .rank-no { background: #d35400; color: #fff; }

.rank-name {
    color: #333;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rank-school {
    color: #999;
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
}

.rank-score { color: #e67e22; font-weight: 600; flex-shrink: 0; }

.rank-empty { color: #aaa; font-size: 13px; padding: 8px 0; }

/* ==================== v20261025a 项目紧凑行（去大图，信息密度优先） ==================== */
.subject-name {
    font-size: 14.5px;
    font-weight: 700;
    color: #0F172A;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    min-width: 0;
}

.subject-name i { color: #3498db; }

.subject-task {
    font-size: 12px;
    color: #64748B;
    font-weight: 400;
    background: #F1F5F9;
    padding: 2px 8px;
    border-radius: 10px;
}

.subject-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 7px; }

.chip-challenge { background: #F3E8FF; color: #9B59B6; }

.subject-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border: 1px solid #eef0f2;
    border-radius: 10px;
    padding: 12px 14px;
    background: #fff;
    transition: border-color .15s, box-shadow .15s;
}

.subject-row:hover { border-color: #cbd5e1; box-shadow: 0 4px 14px rgba(15,23,42,0.06); }

.subject-row-main { flex: 1; min-width: 0; }

.subject-row-side { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }

.subject-test { font-size: 12px; color: #94A3B8; white-space: nowrap; }

.subject-btn {
    padding: 6px 14px;
    background: #2563EB;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.2s;
}

.subject-btn:hover { background: #1D4ED8; }

/* ==================== v20260930s 赛事总览统计条 ==================== */
.match-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-bottom: 14px;
}

.stat-item { background: #F8FAFC; border-radius: 10px; padding: 12px 6px; text-align: center; }

.stat-num { font-size: 22px; font-weight: 800; color: #0F172A; }

.stat-num small { font-size: 11px; color: #94A3B8; font-weight: 600; }

.stat-label { font-size: 11px; color: #64748B; margin-top: 2px; }

@media (max-width: 480px) { .match-stats { grid-template-columns: repeat(2, 1fr); } }

/* 窄屏：项目紧凑行纵向堆叠，信息区小封面与文字仍并排 */
@media (max-width: 560px) {
    .subject-row { flex-direction: column; align-items: stretch; gap: 10px; }
    .subject-row-side { justify-content: space-between; }
    .match-modal-header { padding: 14px 16px 4px; }
    .match-modal-body { padding: 6px 16px 18px; }
}

/* ===== M3 报名表单（2026-10-24，纯追加） ===== */
.signup-form-row { margin-bottom: 14px; }
.signup-form-row label {
    display: block; font-size: 13px; font-weight: 600;
    color: #444; margin-bottom: 6px;
}
.signup-form-row label i { font-style: normal; font-weight: 400; color: #9a9ab5; font-size: 12px; }
.signup-form-row input {
    width: 100%; border: 1px solid #d9ddf0; border-radius: 10px;
    padding: 10px 12px; font-size: 14px; font-family: inherit; outline: none;
    transition: border-color 0.2s;
}
.signup-form-row input:focus { border-color: #667eea; }
.match-format-row span {
    background: #eef4ff; color: #2b5cb8; border-radius: 8px;
    padding: 6px 12px; display: inline-flex; align-items: center; gap: 8px;
    font-weight: 600; font-size: 13px;
}
