/* Estilos CSS para as abas */
.tabs {
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
    display: flex; /* Alinha os botões horizontalmente */
}
.tab-button {
    background-color: inherit;
    border: none;
    color: #333;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
    font-size: 17px;
}
/* Mudar a cor de fundo do botão quando o mouse passa por cima */
.tab-button:hover {
    background-color: #ddd;
}
/* Estilo para o botão da aba ativa */
.tab-button.active {
    background-color: #ed841e;
    border-bottom: 2px solid #007bff; /* Linha azul para indicar a aba ativa */
}
/* Estilos para o conteúdo das abas */
.tab-content {
    display: none; /* Inicia todo o conteúdo escondido */
    padding: 20px;
    border: 1px solid #ccc;
    border-top: none; /* Remove a borda superior para conectar ao botão */
}