/* --- CONFIGURAÇÕES GERAIS E VARIÁVEIS --- 1C3D2B
   Centralize aqui as cores do site. Se mudar aqui, muda em tudo. D97706 areia CDBA96
*/
:root { 
    --cor-marca: #163224; 
    --cor-marca-hover: #163224; 
    --cor-fundo: #FAFAF8; 
    --cor-texto: #111111;
	--cor-h-info: #999999;	
    --cor-texto-suave: #666666; 
    --cor-branco: #FFFFFF; 
    --cor-borda: #EAEAEA; 
	--cor-areia: #B79455; 
    --cor-ouro: #FFD700;
    --cor-prata: #C0C0C0;
    --radius: 8px; 
    --container-min: 680px;
	--container-max: 1100px; 
    --transicao: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); 
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background-color: var(--cor-fundo); color: var(--cor-texto); line-height: 1.6; }
span { font-size:0.8rem; }
h1 { margin-bottom: 0px; font-size: 32px;}
h2 { margin-bottom: 0px; font-size: 24px; font-weight: 500;}
h5 { margin-bottom: 0px; font-size: 20px;}
hr { color: var(--cor-prata); }
.container { max-width: var(--container-max); margin: 0 auto; padding: 0 10px; }
.container-min { max-width: var(--container-min); margin: 0 auto; padding: 0 10px; }
.theader { max-width: 680px; line-height: 1.5; }

/* --- UTILITÁRIOS (Classes rápidas para usar no PHP) --- */
.text-center { text-align: center !important; }
.text-right { text-align: right !important; }
.mt-10 { margin-top: 10px; }
.mt-20 { margin-top: 20px; }
.mb-0 { margin-bottom: 0 !important; }
.mb-20 { margin-bottom: 20px; }
.mb-40 { margin-bottom: 40px; }
.fw-800 { font-weight: 800; }

.texto-longo h5 { margin: 8px 0px; }
.texto-longo p { line-height: 1.5em; margin-bottom: 1.5em; }
.texto-longo a { text-decoration: none; font-weight: 600; color: var(--cor-areia); }
.disclaimer-main { border-left: 3px solid #eee; margin: 15px 0; padding: 15px; line-height: 1.5; font-size: 0.9rem; font-style: italic;}
/* Classe para os links dinâmicos do resumo */
.link-destaque { color: var(--cor-areia); font-weight: bold; text-decoration: none; border-bottom: 1px dashed var(--cor-areia); transition: all 0.2s ease; padding-bottom: 1px; }
.link-destaque:hover { }

/* --- CARDS (CALENDARIO) --- */
.card-box { background: var(--cor-branco); padding: 10px; border-radius: var(--radius); border: 1px solid var(--cor-borda); box-shadow: 0 2px 8px rgba(0,0,0,0.04); margin-bottom: 0; display: flex; align-items: start; text-decoration: none; color: inherit; transition: var(--transicao); }
.card-box:hover { }
.card-box h3, .card-box h4 { margin-bottom: 15px; border-left: 4px solid var(--cor-marca); padding-left: 15px; text-transform: uppercase; font-size: 0.85rem; letter-spacing: 1px; color: var(--cor-marca); }
.data-box { background: var(--cor-marca); color: var(--cor-branco); padding: 10px; border-radius: var(--radius); text-align: center; min-width: 65px; flex-shrink: 0; margin-right: 12px; }
.data-box .dia { display: block; font-size: 26px; font-weight: 800; line-height: 1; }
.data-box .mes { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 4px; }
.localizacao-txt { font-size: 0.9rem; color: var(--cor-texto-suave); font-weight: 600; margin-top: 0px; }

.grid-eventos { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 15px; }

/* --- INFO CARDS (GERAL PARA BOX DE INFORMAÇÕES) --- */
.info-box { background: #ffffff; border-radius: 8px; padding: 4px 10px; margin-bottom: 10px; border: 1px solid #eee; }
.info-box-destaque { background: #ffffff; color: var(--cor-texto-suave); border-radius: 8px; padding: 30px; margin-bottom: 20px; border: 1px solid #eee; }
.info-box h3, 
.info-box h4 { margin-top: 0px; margin-bottom: 5px; color: var(--cor-h-info); padding-bottom: 8px; text-transform: uppercase; letter-spacing: 0.5px; font-size: 0.8rem; }
.info-box ul { list-style: none; padding: 0; margin: 0; }
.info-box li { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; border-bottom: 1px solid #f0f0f0; transition: background 0.2s; }
.info-box li:hover { background-color: #fafafa; }
.info-box li:last-child { border-bottom: none; }
.info-box li .atleta-nome { font-weight: 600; color: #444; }
.info-box li .atleta-dados { font-weight: 800; color: #222; text-align: right; }
.info-box li small { color: #999; font-weight: 400; margin-left: 5px; }
.info-box a { color: var(--cor-texto); text-decoration: none; transition: opacity 0.2s; }
.info-box a:hover { color: var(--cor-marca); }
.info-box li a { display: flex; justify-content: space-between; width: 100%; color: inherit; }

/* --- INFO CARDS (GERAL PARA BOX DE INFORMAÇÕES) --- */
    .evento-info-container {
        display: flex;
        gap: 20px;
        flex-wrap: wrap;
        margin-bottom: 30px;
    }

    .info-card {
        background: #fff;
        border: 1px solid #f0f0f0;
        border-radius: 8px;
        padding: 10px;
        flex: 1;
        min-width: 200px; /* Garante que fiquem bem em telas menores */
        box-shadow: 0 4px 6px rgba(0,0,0,0.02);
        transition: transform 0.2s;
        position: relative;
    }
	
.info-card a { color: var(--cor-texto); text-decoration: none; transition: opacity 0.2s; }
.info-card a:hover { color: var(--cor-marca); }

.item-ranking { display: flex; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid #f0f0f0; }

    .info-card-label {
        font-size: 0.85rem;
        color: #666;
        display: flex;
        align-items: center;
        gap: 5px;
        margin-bottom: 2px;
        text-transform: capitalize;
    }

    .info-card-value {
        font-size: 1.8rem;
        font-weight: 700;
        color: #111;
        display: block;
    }

    .info-card-sub {
        font-size: 0.9rem;
        color: #888;
    }

    .info-card-icon {
        position: absolute;
        top: 20px;
        right: 20px;
        color: #ddd;
        font-size: 1rem;
    }

.stats-grid { display: grid; 
    /* Isso garante que no desktop fiquem 3 colunas e no mobile 1 */
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); 
    gap: 10px; 
    width: 100%;
    margin-top: 20px;
    align-items: stretch;
}
.stats-grid .card { 
    background: #fff; 
    border: 1px solid var(--cor-borda); 
    padding: 25px; 
    border-radius: 15px; 
    box-shadow: 0 2px 5px rgba(0,0,0,0.02);
    /* Removemos qualquer display:flex que possa estar avacalhando o conteúdo interno */
    display: block; 
}
.card-label { 
    color: #999; 
    text-transform: uppercase; 
    font-size: 0.7rem; 
    font-weight: bold; 
    margin-bottom: 20px; 
    display: block; 
}

/* --- BADGES E STATUS (Usados no Functions PHP) --- */
.badge { display: inline-block; padding: 3px 8px; border-radius: 4px; font-size:0.65rem; font-weight:600;  text-transform: uppercase; }
.badge-info { color:#666; padding:2px 8px; border-radius:4px; font-size:0.85rem; border: 1px dashed #ccc; }
.badge-winner { background: var(--cor-ouro); color: #000; }
.badge-assist { background: var(--cor-prata); color: #000; }
.badge-lws, .badge-lms { background: var(--cor-marca); color: #fff; }
.badge-mq { background: var(--cor-marca); color: #fff; }
.badge-rq { background: var(--cor-marca); color: #000; }
.badge-rp-atual { background:#e8f5e9; color:var(--cor-marca); border:1px solid #c8e6c9; }
.badge-rp-superado { color: #bbb; border: 1px solid #DDD; opacity: 0.7; }
.status-dnf { color: #888; border: 1px solid #DDD; letter-spacing:0px; }

/* --- TABELAS --- */
.tabela-scroll { width: 100%; overflow-x: auto; border-radius: var(--radius); border: 1px solid var(--cor-borda); }
.tabela-scroll a { color: var(--cor-texto); text-decoration: none; transition: opacity 0.2s; }
.tabela-scroll a:hover { color: var(--cor-marca); }
table { width: 100%; border-collapse: collapse; background: var(--cor-branco); font-size: 0.9rem; }
table thead th { background: var(--cor-marca); color: var(--cor-branco); padding: 8px; text-align: left; font-size: 0.75rem; text-transform: uppercase; }
table td { padding: 8px; border-bottom: 1px solid var(--cor-borda); }

/* Cores de linha especiais */
.linha-ouro { background: #FFFDF0 !important; font-weight: bold; }
.linha-prata { background: #F8F9FA !important; }

/* --- DASHBOARD DARK --- */
.dashboard { background: var(--cor-marca); color: var(--cor-branco); padding: 20px; border-radius: var(--radius); text-align: center; margin-bottom: 25px; }
.big-km { font-size: 3.0rem; font-weight: 800; color: var(--cor-areia); line-height: 1; margin: 15px 0; }

/* --- CORREÇÃO DO LAYOUT DOS CARDS --- */

/* Ajuste para os itens do Top 3 não ficarem em linha vertical doida */
.top3-item {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
    text-align: left;
}

/* Garante que o botão de ver tabela não suba para o lado dos cards */
.btn-container {
    width: 100%;
    clear: both;
    display: block;
    text-align: center;
	padding: 2px;
}



/* --- RESPONSIVIDADE --- */
@media (max-width: 992px) {
    .evento-main { flex-direction: column; }
    .col-sidebar { width: 100% !important; position: static !important; margin-bottom: 20px; }
    .big-km { font-size: 2.5rem; }
}

/* Ajuste específico para garantir que no mobile não fique nada 'espremido' */
@media (max-width: 480px) { .stats-grid { grid-template-columns: 1fr; /* Força 1 coluna total em celulares pequenos */ }}
}