/* Paleta de Cores Sugerida:
   Verde-Azulado Principal: #4CAF50 (Verde Floresta), #2196F3 (Azul Vibrante), ou uma mistura.
   Para esse exemplo, vou usar um verde-azulado mais suave e agradável: #40B4B4 (Turquesa Médio)
   Cor Complementar/Destaque: #FFD700 (Amarelo Ouro suave), ou #FFAB91 (Pêssego)
   Para esse exemplo, vou usar um amarelo suave: #FFEB3B
   Texto: #333 (Preto Quase), #555 (Cinza Escuro)
   Fundo: #f8f9fa (Branco Suave do Bootstrap)
*/

body {
    font-family: 'Arial', sans-serif;
    background-color: #f8f9fa; /* Fundo leve do Bootstrap */
}

.container {
    max-width: 900px;
}

h1 {
    color: #343a40; /* Permanece um cinza escuro para contraste no título principal */
}

/* Espaço para o logotipo */
.logo-container {
    text-align: center;
    margin-bottom: 2rem;
}

.app-logo {
    max-width: 150px;
    height: auto;
    display: block;
    margin: 0 auto;
}

/* Cartões (Cards) - Estrutura principal */
.card {
    border: none;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.card-header {
    background-color: #40B4B4; /* Verde-azulado predominante */
    color: white;
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
    padding: 1rem;
    font-size: 1.25rem;
    font-weight: 500;
}

/* Labels dos formulários */
.form-label {
    font-weight: 600;
    color: #555; /* Um cinza um pouco mais escuro para as labels */
}

/* Inputs e selects - Bootstrap já cuida da maioria */
.form-control, .form-select {
    border-color: #a7d9d9; /* Uma borda sutil no tom verde-azulado */
}

/* Botões */
.btn-primary {
    background-color: #40B4B4; /* Verde-azulado para o botão principal */
    border-color: #40B4B4;
}
.btn-primary:hover {
    background-color: #339999; /* Um tom ligeiramente mais escuro no hover */
    border-color: #339999;
}

.btn-success { /* Botão de Registrar Treino */
    background-color: #28a745; /* Verde Bootstrap padrão para 'sucesso', você pode mudar */
    border-color: #28a745;
}
.btn-success:hover {
    background-color: #218838;
    border-color: #1e7e34;
}

.btn-info { /* Botão de Gerar Estatísticas */
    background-color: #FFEB3B; /* Amarelo suave como cor complementar */
    border-color: #FFEB3B;
    color: #333; /* Cor do texto no botão amarelo para melhor contraste */
}
.btn-info:hover {
    background-color: #FFD54F; /* Um amarelo ligeiramente mais escuro no hover */
    border-color: #FFD54F;
}


/* Lista de exercícios com checkboxes */
.lista-exercicios {
    max-height: 200px;
    overflow-y: auto;
    background-color: #e6f7f7; /* Fundo suave no tom verde-azulado claro */
    border-color: #b3e0e0; /* Borda mais clara */
}

.form-check-input:checked {
    background-color: #40B4B4; /* Checkmark na cor predominante */
    border-color: #40B4B4;
}

/* Último treino e estatísticas */
#ultimoTreino {
    background-color: #e6f7f7; /* Fundo do alerta no tom verde-azulado claro */
    border-color: #b3e0e0;
    color: #2a7a7a; /* Cor do texto para contraste */
}

.alert-light { /* Fundo das estatísticas detalhadas */
    background-color: #f0fafa; /* Um tom bem suave de verde-azulado para o fundo das estatísticas */
    border-color: #d9eded;
    color: #333;
}

.alert-info strong, .alert-light strong {
    color: #2a7a7a; /* Cor mais escura para o texto em negrito nas estatísticas */
}


/* Tabelas */
.table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: #e6f7f7; /* Linhas ímpares da tabela com fundo suave */
}

.table-hover > tbody > tr:hover > * {
    background-color: #d9eded; /* Fundo no hover da tabela */
}
