.match-card{

    background:#fff;

    border-radius:18px;

    padding:18px;

    margin-bottom:20px;

    box-shadow:0 2px 10px rgba(0,0,0,.08);

}
.match-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-bottom:15px;

    font-size:22px;

    font-weight:bold;

}
.match-title{

    font-size:24px;

    font-weight:bold;

    margin-bottom:15px;

}
.match-grid{

    display:grid;

    grid-template-columns:47% 6% 47%;

    gap:8px;

    align-items:stretch;

}
.team-panel{

    display:grid;

    grid-template-rows:1fr auto;

    border:1px solid #ddd;

    border-radius:14px;

    padding:8px;

    background:#fff;

    height:100%;

    align-self:stretch;

}
.player-card{

    display:flex;

    gap:10px;

    margin-bottom:12px;

}
.player-photo{

    width:60px;

    height:75px;

    object-fit:cover;

    border:1px solid #ddd;

}
.player-info{

    flex:1;

}
.score-row{

    display:grid;

    grid-template-columns:1fr 40px 1fr;

    align-items:end;

    gap:8px;

    margin-top:15px;

}
.score-input{

    width:100%;

    height:80px;

    border-radius:20px;

    border:2px solid #ddd;

    text-align:center;

    font-size:42px;

    font-weight:bold;

    margin-bottom:20px;

}
.score-win{

    background:#d9ffe0;

    border:2px solid #1ea84a;

    color:#008a2b;

}
.score-lose{

    background:#ffe0e0;

    border:2px solid #d72b2b;

    color:#b30000;

}
.progress-card{

    background:#fff;

    padding:15px;

    margin-bottom:18px;

    border-radius:16px;

    box-shadow:0 3px 12px rgba(0,0,0,.08);

}
.match-status{

    margin:8px 0 15px;

    text-align:center;

}
.btnSuaDiem{

    width:100%;

    height:52px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#ffc107 !important;

    color:#000 !important;

    border-radius:12px;

    font-size:18px;

    font-weight:700;

}
.btnLuuLai{

    width:100%;

    height:52px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#198754 !important;

    color:#fff !important;

    border-radius:12px;

    font-size:18px;

    font-weight:700;

}
.btnKetQua{

    display:block;

    width:100%;

    text-align:center;

    background:#0d6efd;

    color:#fff;

    text-decoration:none;

    margin-top:10px;

}

.btnKetQua:hover{

    color:#fff;

    background:#0b5ed7;

}
.btn-back-page{

    margin-top:12px;

    display:block;

    text-align:center;

    background:#6c757d;

    color:#fff;

    text-decoration:none;

}

.btn-back-page:hover{

    color:white;

}
.menu-btn:disabled{

    background:#9ca3af;

    border-color:#9ca3af;

    cursor:not-allowed;

    opacity:.7;

}