/* ============================================================
   📅 RESULTADOS DE ONTEM — estilos completos V3
   Paleta: Preto/Cinza + Amarelo #FFC300
   ============================================================ */

/* Grid de bilhetes */
.bilhetes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 20px;
    margin-top: 30px;
}

/* Card do bilhete */
.bilhete-card {
    background: #141414;
    border-radius: 16px;
    padding: 20px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.bilhete-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
}

.bilhete-card.status-green {
    border-color: #22C55E;
    box-shadow: 0 4px 24px rgba(34, 197, 94, 0.2);
}
.bilhete-card.status-green::before {
    background: linear-gradient(90deg, #16A34A, #22C55E);
}

.bilhete-card.status-red {
    border-color: #ef4444;
    box-shadow: 0 4px 24px rgba(239, 68, 68, 0.2);
}
.bilhete-card.status-red::before {
    background: linear-gradient(90deg, #dc2626, #ef4444);
}

/* Header do card */
.bilhete-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid #3C3C3C;
}

.bilhete-tipo-small {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    color: #F0F0F0;
    font-size: 0.95rem;
}

/* Badge de status no topo do card (GREEN / RED) */
.bilhete-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 14px;
    border-radius: 20px;
    font-weight: 800;
    font-size: 0.8rem;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: #fff !important;
}

.bilhete-odd-small {
    color: #A0A0A0;
    margin-bottom: 18px;
    font-size: 0.88rem;
}
.bilhete-odd-small strong {
    color: #FFC300;
    font-size: 1.05rem;
}

/* Lista de jogos dentro do card */
.bilhete-jogos-resultado {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* ── Cada linha de jogo ───────────────────────────── */
.jogo-resultado {
    border-radius: 12px;
    padding: 0;
    overflow: hidden;
    border: 1px solid #3C3C3C;
    transition: transform 0.2s ease;
}
.jogo-resultado:hover {
    transform: translateX(3px);
}

/* Faixa colorida no topo do jogo */
.jogo-resultado-inner {
    display: flex;
    align-items: stretch;
    min-height: 68px;
}

/* Coluna lateral colorida (verde ou vermelha) */
.jogo-resultado-lateral {
    width: 48px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.3rem;
    font-weight: 900;
}

/* GREEN */
.jogo-resultado.jogo-acertou {
    background: #0D2818;
    border-color: rgba(34, 197, 94, 0.3);
}
.jogo-resultado.jogo-acertou .jogo-resultado-lateral {
    background: linear-gradient(180deg, #16A34A, #22C55E) !important;
    color: #fff !important;
}

/* RED */
.jogo-resultado.jogo-errou {
    background: #2D0A0A;
    border-color: rgba(239, 68, 68, 0.3);
}
.jogo-resultado.jogo-errou .jogo-resultado-lateral {
    background: linear-gradient(180deg, #dc2626, #ef4444) !important;
    color: #fff !important;
}

/* Conteúdo principal do jogo */
.jogo-resultado-body {
    flex: 1;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
}

.jogo-times-small {
    font-size: 0.87rem;
    color: #F0F0F0;
    font-weight: 600;
    line-height: 1.3;
}

.jogo-palpite-resultado {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.78rem;
    color: #A0A0A0;
    gap: 8px;
}

.jogo-placar {
    font-weight: 800;
    font-size: 0.88rem;
    white-space: nowrap;
}

/* Placar verde para green */
.jogo-resultado.jogo-acertou .jogo-placar {
    color: #22C55E;
}
/* Placar vermelho para red */
.jogo-resultado.jogo-errou .jogo-placar {
    color: #ef4444;
}

/* Ícone no lado direito */
.jogo-resultado-icone {
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.jogo-resultado.jogo-acertou .jogo-resultado-icone {
    color: #22C55E;
}
.jogo-resultado.jogo-errou .jogo-resultado-icone {
    color: #ef4444;
}

/* ── Liga pequena acima dos times ────────────────── */
.jogo-liga-small {
    font-size: 0.70rem;
    color: #FFC300;
    font-weight: 600;
    margin-bottom: 2px;
    letter-spacing: 0.3px;
}

/* ── Separador "vs" entre os times ───────────────── */
.jogo-vs-sep {
    color: #A0A0A0;
    margin: 0 5px;
    font-weight: 400;
    font-size: 0.78rem;
}

/* ── Texto do mercado + odd ──────────────────────── */
.jogo-mercado-text {
    font-size: 0.78rem;
    color: #A0A0A0;
    flex: 1;
}

/* Responsivo */
@media (max-width: 768px) {
    .bilhetes-grid {
        grid-template-columns: 1fr;
    }
    .jogo-resultado-lateral {
        width: 40px;
        font-size: 1.1rem;
    }
}