.dark-mode-switch {
    display: flex;
    cursor: pointer;
}

.dark-mode-icone {
    display: none;
}

body.dark-mode {
    background: #100f10;

    .dark-mode-icone {
        display: block;
    }

    .light-mode-icone {
        display: none;
    }

    #menu-container {
        background: rgba(255, 255, 255, 0.12);
    }
    
    .link {
        color: var(--branco);
    }
    
    .link:hover {
        color: var(--cor2);
    }

    h1 {
        text-shadow: -2px -2px 0 #000000, 3px -2px 0 #000000, -1px 2px 0 #000000, 2px 2px 0 #000000;
    }

    h1, h2 {
        color: var(--branco);
    }
    
    h5, span {
        color: #fff;
    }
    
    p, span {
        color: rgba(255, 255, 255, 0.82);
    }
    
    .sessao-titulo {
        background: var(--cinza2);
        color: var(--cor2);
    }
    
    /*h1 {
        text-shadow: unset;
    }*/
    
    #vantagens {
        background: unset;
        background-size: 0%;
    }

    #menu-container-sticky, #menu-container-mobile {
        background: rgb(30 30 30 / 82%);
    }

    .catalogo-titulo {
        color: var(--branco);
    }

    .lista-caracteristicas li {
        color: var(--branco);
    }

    #barra-numeros p {
        color: var(--branco);
    }

    #sobre-nos li img {
        filter: brightness(0) invert(1);
    }

    #rodape h5 {
        color: var(--cor1);
    }

    .card-programa img {
        filter: brightness(1.25);
    }

    .botao, .botao2 {
        border: 3px solid var(--branco);
        background: var(--branco);
        color: var(--cinza1);
        /*box-shadow: 0px 0px 10px 0px #fff;*/

        &:hover {
            border: 3px solid var(--cor2);
            background: var(--cor2);
            color: var(--branco);
        }
    }

    #botao-menu-mobile {
        filter: brightness(10);
    }

    #botao-emcasa, .botao3 {
        border: 3px solid var(--branco);
        background: transparent;
        color: var(--branco);

        &:hover {
            border: 3px solid var(--cor2);
            color: var(--cor2);
        }
    }

    .logo-termos {
        filter: brightness(10);
    }

    #logo {
        filter: brightness(10);
    }
}

