/* ===================================================================
   ARQUIVO: css/cards.css
   DESCRIÇÃO: Estilos dos Cards (Separados: Clube vs Atleta)
   =================================================================== */

/* ===================================================================
   1. CARD DE CLUBE (DESIGN ORIGINAL "GORDINHO")
   Mantido exatamente como você gosta: Largo e Curva Suave
   =================================================================== */
.fut-club-card {
    width: 320px;
    height: 400px;
    position: relative;
    font-family: 'Roboto', sans-serif;
    margin: 0 auto;
    transition: 0.3s;
    
    /* Formato Original do Clube */
    border-radius: 15px 15px 130px 130px;
    overflow: hidden;
    
    /* Bordas e Sombras */
    border: 3px solid #ffd700;
    box-shadow: 0 0 30px rgba(255, 215, 0, 0.2);
    background: #000;
    z-index: 1;
}

/* Hover do Clube */
@media (min-width: 992px) {
    .fut-club-card:hover {
        transform: translateY(-5px) scale(1.02);
        z-index: 10;
    }
}

/* Estrutura Interna do Clube */
.club-card-top {
    position: absolute; top: 0; left: 0; width: 100%; height: 65%;
    background: linear-gradient(45deg, #1a1a1a, #000);
    display: flex; align-items: center; justify-content: center; z-index: 1;
}
.club-card-logo {
    width: 140px; height: 140px; object-fit: contain;
    filter: drop-shadow(0 10px 20px rgba(0,0,0,0.8)); z-index: 2;
}
.club-card-bottom {
    position: absolute; bottom: 0; left: 0; width: 100%; height: 35%;
    background: linear-gradient(180deg, #ffd700 0%, #b8860b 100%);
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    border-top: 2px solid #fff; z-index: 5; padding-bottom: 20px;
}
.club-card-tag {
    font-size: 38px; font-weight: 900; color: #1a1a1a;
    line-height: 1; margin-bottom: 5px; text-transform: uppercase;
    text-shadow: 0 1px 0 rgba(255,255,255,0.4);
}
.club-card-name {
    font-size: 14px; font-weight: 700; color: #332200;
    text-transform: uppercase; letter-spacing: 1px;
    max-width: 90%; text-align: center;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.club-card-city {
    font-size: 10px; color: #553300; text-transform: uppercase;
    margin-top: 5px; font-weight: 700;
    display: flex; align-items: center; gap: 5px;
}


/* ===================================================================
   2. CARD DE ATLETA (NOVO DESIGN "DEEP U")
   Baseado na referência: Mais alto, curva profunda, foto grande
   =================================================================== */

.fut-card-bronze,
.fut-card-silver,
.fut-card-gold,
.fut-card-diamond,
.fut-card {
    /* Dimensões: Um pouco mais estreito e mais alto que o clube */
    width: 300px; 
    height: 440px;
    
    position: relative;
    font-family: 'Roboto', sans-serif;
    margin: 0 auto;
    transition: 0.3s;
    
    /* A CURVA NOVA (DEEP U) - Igual à referência */
    /* Topo arredondado suave (25px), Fundo super arredondado (160px) */
    border-radius: 25px 25px 160px 160px;
    overflow: hidden;
    
    /* Sombra e Borda Fina */
    box-shadow: 0 15px 35px rgba(0,0,0,0.6);
    background: #000;
    border-width: 2px; /* Borda mais fina e elegante */
    border-style: solid;
    z-index: 1;
}

/* Hover do Atleta */
@media (min-width: 992px) {
    .fut-card-bronze:hover,
    .fut-card-silver:hover,
    .fut-card-gold:hover,
    .fut-card-diamond:hover {
        transform: translateY(-5px) scale(1.02);
        z-index: 10;
    }
}

/* --- CORES DOS RANKS (ATLETA) --- */
/* Bronze */
.fut-card-bronze { border-color: #cd7f32; }
.fut-card-bronze .card-info-area { background: #c58c58; /* Cor sólida baseada na imagem */ }
.fut-card-bronze .card-info-area { background: linear-gradient(180deg, #d69e6b 0%, #a67c52 100%); }
.fut-card-bronze .card-name-text, .fut-card-bronze .stat-val { color: #3b2615; /* Marrom Café Escuro */ }
.fut-card-bronze .stat-lbl { color: #5e4028; }

/* Silver */
.fut-card-silver { border-color: #c0c0c0; }
.fut-card-silver .card-info-area { background: linear-gradient(180deg, #e6e6e6 0%, #b3b3b3 100%); }
.fut-card-silver .card-name-text, .fut-card-silver .stat-val { color: #222; }

/* Gold */
.fut-card-gold { border-color: #ffd700; }
.fut-card-gold .card-info-area { background: linear-gradient(180deg, #ffdb4d 0%, #d4af37 100%); }
.fut-card-gold .card-name-text, .fut-card-gold .stat-val { color: #423108; }

/* Diamond */
.fut-card-diamond { border-color: #00e5ff; }
.fut-card-diamond .card-info-area { background: linear-gradient(180deg, #6effff 0%, #00acc1 100%); }
.fut-card-diamond .card-name-text, .fut-card-diamond .stat-val { color: #003d42; }


/* --- ESTRUTURA INTERNA DO ATLETA --- */

/* Área da Foto (Aumentada para o novo design) */
.card-face-box {
    position: absolute; top: 0; left: 0;
    width: 100%; 
    height: 68%; /* Foto ocupa quase 70% do card agora */
    z-index: 1;
    background-color: #333;
}
.card-face-box img {
    width: 100%; height: 100%;
    object-fit: cover;
    object-position: center top;
}

/* Área de Informações (Parte de baixo colorida) */
.card-info-area {
    position: absolute; bottom: 0; left: 0;
    width: 100%; 
    height: 32%; /* Restante do espaço */
    z-index: 5;
    display: flex; flex-direction: column;
    justify-content: center; align-items: center;
    
    /* Linha divisória sutil no topo da cor */
    border-top: 1px solid rgba(255,255,255,0.1);
    padding-bottom: 25px; /* Empurra o conteúdo um pouco pra cima por causa da curva */
}

/* Nome do Jogador */
.card-name-text {
    font-size: 22px; /* Fonte maior */
    font-weight: 900;
    text-transform: uppercase;
    margin: 5px 0 10px 0;
    letter-spacing: 0.5px;
    width: 90%; text-align: center;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    /* Sombra removida para ficar clean igual a referência */
    text-shadow: none; 
}

/* Grid de Stats (3 Colunas) */
.card-stats-grid {
    display: flex;
    justify-content: center;
    gap: 25px; /* Mais espaço entre os itens */
    width: 100%;
    margin-bottom: 5px;
}

.stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Valor (Ex: 32, DES) */
.stat-val {
    display: block;
    font-size: 18px; /* Valor Grande */
    font-weight: 900;
    line-height: 1;
}

/* Label (Ex: IDD, PÉ) */
.stat-lbl {
    display: block;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    margin-top: 3px;
    opacity: 0.8;
}

/* Posição Flutuante (ATA) */
.card-identity {
    position: absolute; 
    top: 20px; 
    left: 20px; 
    z-index: 10;
}
.card-position {
    font-size: 32px; 
    font-weight: 900; 
    color: #fff;
    text-transform: uppercase;
    /* Sombra forte para ler em cima da foto */
    text-shadow: 2px 2px 0px rgba(0,0,0,0.5); 
}

/* Ícones extras embaixo (Opcional, igual referência) */
.card-bottom-icons {
    margin-top: 5px;
    font-size: 10px;
    opacity: 0.5;
    color: inherit; /* Pega a cor do rank */
    display: flex; gap: 8px;
}

/* Icone de Câmera (Overlay de Edição) */
.camera-overlay-icon {
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    font-size: 40px; color: #fff;
    background: rgba(0,0,0,0.6); padding: 15px; border-radius: 50%;
    opacity: 0; transition: 0.3s; pointer-events: none; z-index: 30;
}
.fut-card-bronze:hover .camera-overlay-icon, 
.fut-card-silver:hover .camera-overlay-icon, 
.fut-card-gold:hover .camera-overlay-icon, 
.fut-card-diamond:hover .camera-overlay-icon { opacity: 1; }