body {}

h2,
h6,
p {
    color: #692772;
}

.topo {
    background-image: linear-gradient(to right, #692772, #872a93);
    background-position: center;
    background-size: cover;
    /* Fundo branco */
    color: #ffffff;
    /* Letra roxa (cor hexadecimal) */
    text-align: center;
    /* Centraliza o texto horizontalmente */
    display: flex;
    /* Ativa o layout flexbox */
    flex-direction: column;
    /* Define a direção do layout flexbox como coluna */
    align-items: center;
    /* Centraliza o conteúdo verticalmente */
    justify-content: center;
    /* Centraliza o conteúdo horizontalmente */
    height: 10vh;
    / * Altura da tela (100% da viewport) */
}

.card {
    border-color: #692772;
    color: #692772;
}

.card-header {
    background-color: #692772;
    color: #ffffff;
}

.btn-primary {
    background-color: #692772 !important;
    /* Cor de fundo #692772 */
    color: white !important;
    /* Letra branca */
}

a.btn.btn-primary {
    border: none;
}

.link {
    color: white;
    /* Define a cor branca para os links */
    text-decoration: none;
    /* Remove sublinhado padrão */
    transition: color 0.3s;
    /* Adiciona transição suave para a cor */
}

.link:hover {
    color: #ccc;
    /* Altera a cor para um tom mais claro ao passar o mouse */
}

h1 {
    color: #692772;
}

.title {
    color: #ffffff;
}

.btn-secondary {
    background-color: #692772;
    color: #ffffff;
}


.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
    background-color: #ffffff;
    /* Cor de fundo ao passar o mouse */
    color: #692772;
    /* Cor do texto ao passar o mouse */
    border-color: #692772;
    /* Cor da borda ao passar o mouse */
}

.btn-check:checked+.btn-secondary,
.btn-secondary.active {
    background-color: #ffffff;
    /* Cor de fundo ao clicar */
    color: #692772;
    /* Cor do texto ao clicar */
    border-color: #692772;
    /* Cor da borda ao clicar */
}

.custom-alert {
    position: fixed;
    top: 20px;
    right: 20px;
    width: 300px;
    z-index: 1050;
}

.fade-out {
    opacity: 0;
    transition: opacity 1s;
}