.games-wrapper{max-width:1240px;margin:40px auto 0 auto;color:#fff;}
.games-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:20px;margin-bottom:30px;}
.games-header h2{font-size:28px;font-weight:700;margin:0;}
.games-header select{background:#332b57;color:#fff;border:1px solid #4a4270;padding:8px 14px;border-radius:8px;font-size:14px;cursor:pointer;}
.games-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.game-card{background:#332b57;border-radius:14px;padding:18px;padding-top:5px;position:relative;overflow:hidden;display:flex;flex-direction:column;}
.kit-split{position:absolute;top:50px;left:0;width:100%;height:100%;display:flex;z-index:0;}
.kit-side{width:50%;height:100%;background-repeat:no-repeat;background-size:200% 200%;opacity:0.55;}
.kit-home{background-position:100% 0;}
.kit-away{background-position:0 0;}
.game-card-inner{position:relative;z-index:2;display:flex;flex-direction:column;height:100%;}
.game-teams{display:grid;grid-template-columns:1fr auto 1fr;align-items:flex-start;gap:10px;}

.game-teams a,.game-teams .team{padding-top:0;display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;color:#fff;font-weight:600;font-size:14px;text-align:center;}
.game-teams a span{min-height:40px;display:flex;align-items:center;justify-content:center;line-height:1.2;}
.game-teams img{width:75px;height:75px;border-radius:50%;object-fit:cover;}
.game-time{font-size:40px;font-weight:700;text-align:center;align-self:center;margin-top:10px;}
.game-preview{margin-top:auto;align-self:center;font-size:13px;color:#8b74f1;text-decoration:none;display:inline-flex;justify-content:center;}
.game-preview:hover{text-decoration:underline;}

.game-status-badge {
    align-self: flex-start;
    margin-bottom: 8px;
    border-radius: 30px;
    padding: 4px 12px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}
.game-status-badge.postponed {
    border: 1px solid #facc15;
    color: #facc15;
    background: transparent;
}
.game-status-badge.postponed.fill {
    background-color: #facc15;
    color: #2b2149;
}
.game-status-badge.canceled {
    background-color: #9ca3af;
    color: #fff;
}

.postponed-card .game-teams img,
.postponed-card .game-teams span {
    opacity: 0.6;
}

.strikethrough {
    text-decoration: line-through;
    opacity: 0.6;
    color: #9ca3af;
}

.team{display:flex;flex-direction:column;align-items:center;text-align:center;}
.team span{display:block;line-height:1.2;}
@media(max-width:1300px){.games-wrapper{width:calc(100% - 24px);}}
@media(max-width:1100px){.games-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:768px){
    .games-wrapper{width:94%;}
    .games-header{flex-direction:column;align-items:stretch;gap:10px;}
    .games-header h2{font-size:20px;line-height:28px;}
    .games-header .socca-select-shell,
    .games-header .socca-select,
    .games-header select{width:100%;min-width:0;}
    .games-grid{grid-template-columns:1fr;gap:10px;}
    .game-teams img{width:36px;height:36px;}
    .game-teams a,.game-teams .team{font-size:12px;}
    .game-teams a span{min-height:30px;}
    .game-time{font-size:28px;margin-top:6px;}
}