/* ==================== Reset e Base ==================== */
html, body { height: 100%; margin: 0; padding: 0; }
body { font-family: "Open Sans", Arial, sans-serif; background-color: #f5f5f5; color: #333; line-height: 1.6; display: flex; flex-direction: column; min-height: 100vh; }
main { flex: 1 0 auto; }

/* ==================== Links ==================== */
a { text-decoration: none; color: #0073aa; transition: color 0.3s ease; }
a:hover { color: #005177; text-decoration: underline; }

/* ==================== Postagens ==================== */
.post { background: #fff; padding: 2rem; border-radius: 0.375rem; box-shadow: 0 2px 10px rgba(0,0,0,0.05); margin-bottom: 2rem; }
.entry-title { font-size: 1.75rem; margin-bottom: 0.5rem; }
.entry-content p { margin-bottom: 1rem; }
.btn-outline-primary { border-color: #0073aa; color: #0073aa; transition: all 0.3s ease; }
.btn-outline-primary:hover { background-color: #0073aa; color: #fff; }

/* ==================== Aside ==================== */
aside { margin-top: 2rem; }
aside h3 { margin-bottom: 1rem; font-weight: 600; }
aside ul li a { color: #333; transition: color 0.3s ease; }
aside ul li a:hover { color: #0073aa; }

/* ==================== Tabelas ==================== */
.table { background: #fff; border-radius: 0.375rem; overflow: hidden; }
.table th { background-color: #006699; color: #fff; text-align: center; }
.table td { text-align: center; }
.table-hover tbody tr:hover { background-color: #f1f1f1; }

/* Grupo 1 - Albufeira Challenge */
.th-albufeira {
    background-color: #207286 !important; /* dourado */
    text-align: center;
}

/* Grupo 2 - Soc. C. Albufeira */
.th-socalbufeira {
    background-color: #0f5157 !important; /* azul claro */
    text-align: center;
}

/* Grupo 3 - ACD Faro */
.th-acdfaro {
    background-color: #076507 !important; /* verde claro */
    text-align: center;
}

/* Cabeçalhos normais (fora dos grupos) */
.th-normal {
    background-color: #f8f9fa !important; /* cor padrão da tabela bootstrap */
    text-align: center;
}






/* ==================== Botões ==================== */
.wp-btn { background-color: #136348; color: #ffffff; border: 1px solid #13a132; padding: 10px 18px; font-size: 14px; font-weight: 600; border-radius: 6px; cursor: pointer; transition: all 0.2s ease-in-out; box-shadow: 0 3px 6px rgba(0,0,0,0.25); display: inline-block; }
.wp-btn:hover { background-color: #eaec42; color: #136348; box-shadow: 0 4px 10px rgba(0,0,0,0.35); }
.wp-btn:active { background-color: #0a7a55; transform: scale(0.97); }
.wp-btn:disabled { opacity: 0.6; cursor: not-allowed; }

/* ==================== Mensagens ==================== */
.msg { font-weight: 600; margin-bottom: 15px; }
.msg.error { color: #d63638; }
.msg.success { text-align: center; color: #154919; }

/* ==================== Formulários ==================== */
.wp-form { max-width: 500px; margin: 0 auto; background-color: #055339; color: #ffffff; padding: 20px; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
.wp-form .form-label { font-weight: 600; }
.wp-form .msg { text-align: center; font-weight: 600; padding: 5px 10px; border-radius: 4px; margin-top: 10px; }
.wp-form .msg.success { color: #92e905; }
.wp-form .msg.error { color: #d63638; }
.wp-form .form-button-container { margin-top: 20px; }
#treinoForm #msgForm { display: block; width: 100%; text-align: center; margin-top: 15px; }

/* ==================== Top 3 Cards Desktop com Medalhas ==================== */
.top3-cards { display: flex; gap: 1rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.top3-cards .card { border-width: 2px; text-align: center; flex: 1 1 200px; min-width: 180px; box-shadow: 0 2px 6px rgba(0,0,0,0.05); position: relative; }
.top3-cards .top1 { border-color: #adb5bd; background-color: #ffc107; }
.top3-cards .top2 { border-color: silver; background-color: #e6e6e6; }
.top3-cards .top3 { border-color: #cd7f32; background-color: #f2e0d9; }
.top3-cards .medal { position: relative; top: -0.3rem; left: 50%; transform: translateX(-50%); font-size: 2.0rem; }

/* ==================== Tabela Desktop com Medalhas ==================== */
tr.top1 td:first-child::before { content: '🥇 '; }
tr.top2 td:first-child::before { content: '🥈 '; }
tr.top3 td:first-child::before { content: '🥉 '; }

/* ==================== Cards Mobile Treino ==================== */
.cards-list { display: none; }
.treino-card { display: block; background-color: #ffffff; border: 1px solid #d0d0d0; border-radius: 12px; padding: 1rem; margin-bottom: 1rem; box-shadow: 0 4px 12px rgba(0,0,0,0.08); text-decoration: none; color: #222; transition: all 0.2s ease-in-out; }
.treino-card:hover { transform: translateY(-3px); box-shadow: 0 6px 18px rgba(0,0,0,0.15); }
.treino-card .equipe-row, .treino-card .rank-pring-row { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; }
.treino-card .flag-col { width: 28px; display: flex; align-items: center; justify-content: center; }
.treino-card .team-col { flex: 1; font-weight: 600; font-size: 0.95rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ==================== Cards Mobile Treinos ==================== */
.cards-list-treinos { display: none; }
.treinos-card { display: block; background-color: #ffffff; border: 1px solid #d0d0d0; border-radius: 12px; padding: 1rem; margin-bottom: 1rem; box-shadow: 0 4px 12px rgba(0,0,0,0.08); text-decoration: none; color: #222; transition: all 0.2s ease-in-out; }
.treinos-card:hover { transform: translateY(-3px); box-shadow: 0 6px 18px rgba(0,0,0,0.15); }
.treinos-card .card-row-main { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem; gap: 0.5rem; }
.treinos-card .live { flex: 0 0 auto; margin-right: 0.5rem; font-size: 1.2rem; }
.treinos-card .local { flex: 1 1 auto; font-weight: 600; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.treinos-card .ordem-decrescente { flex: 0 0 auto; font-weight: bold; font-size: 1.1rem; margin-left: 1rem; }
.treinos-card .kms { flex: 0 0 auto; font-weight: normal; margin-left: 1rem; color: #555; }
.treinos-card .data { font-size: 0.95rem; color: #333; }
.treinos-card .card-row-hora { font-size: 0.9rem; color: #555; margin-top: 0.25rem; }

/* Linha principal: local à esquerda, ordem decrescente à direita */
.treinos-card .card-row-main { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem; }
.treinos-card .local { font-weight: 600; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; flex: 1 1 auto; margin-right: 0.5rem; }
.treinos-card .ordem-decrescente { font-weight: bold; font-size: 1.2rem; flex: 0 0 auto; text-align: right; }

/* Linha seguinte: kms à esquerda, live à direita */
.treinos-card .card-row-kms { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem; }

/* Hora em linha separada */
.treinos-card .card-row-hora { font-size: 0.9rem; color: #555; }

/* Labels linha única */
.card-row.card-tabela { display: flex; justify-content: space-between; font-weight: 600; font-size: 0.9rem; color: #555; margin-top: 0.5rem; text-align: left; }

/* Valores abaixo das labels */
.card-row.card-tabela + .card-row.card-tabela { font-weight: normal; color: #222; display: flex; justify-content: space-between; }
.card-row.card-tabela .value { flex: 1; text-align: left; padding-right: 0.5rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Navbar toggler com 3 riscos brancos */
.navbar-toggler { border-color: #ffffff; }
.navbar-toggler-icon { display: inline-block; width: 1.5em; height: 1.5em; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='white' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; background-size: 100% 100%; }

/* ==================== Responsividade ==================== */
@media (max-width: 800px) { 
    .cards-list { display: block !important; } 
    .cards-list-treinos { display: block !important; } 
    .table-responsive { display: none !important; } 
}
