/* Falha ao minimizar. Retornando o conteúdo não minimizado.
(30,21): run-time error CSS1039: Token not allowed after unary operator: '-corSecundaria'
(32,27): run-time error CSS1039: Token not allowed after unary operator: '-fontPadrao'
(42,39): run-time error CSS1039: Token not allowed after unary operator: '-corSecundaria'
(48,32): run-time error CSS1039: Token not allowed after unary operator: '-corSecundaria'
(50,27): run-time error CSS1039: Token not allowed after unary operator: '-fontPadrao'
(86,27): run-time error CSS1039: Token not allowed after unary operator: '-fontPadrao'
(98,25): run-time error CSS1039: Token not allowed after unary operator: '-corSecundaria'
(103,29): run-time error CSS1039: Token not allowed after unary operator: '-corSecundariaEscuro'
(107,23): run-time error CSS1039: Token not allowed after unary operator: '-fontPadrao'
(108,28): run-time error CSS1039: Token not allowed after unary operator: '-corPrincipal'
(113,23): run-time error CSS1039: Token not allowed after unary operator: '-fontPadrao'
(114,28): run-time error CSS1039: Token not allowed after unary operator: '-corSecundaria'
(119,32): run-time error CSS1039: Token not allowed after unary operator: '-corSecundariaEscuro'
 */
@import url('variaveis.css');
@import url('Fonts/fonts.css');

body {
    width: 100vw;
    height: 100vh;
    background: url(/Content/Imagens/fundo-login.jpg) no-repeat;
    background-size: cover;
    background-position: center;
    overflow: hidden;
}

    body::before {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background-color: #372A5688;
        z-index: -1;
    }

.container-login {
    max-width: 40rem;
    padding: 3rem;
}

    .container-login header {
        color: var(--corSecundaria);
        font-size: 3rem;
        font-family: var(--fontPadrao);
        display: flex;
        align-items: center;
        gap: 1rem;
        margin-bottom: 2rem;
    }

        .container-login header span {
            width: 5rem;
            height: 5rem;
            border: .85rem solid var(--corSecundaria);
            border-radius: 50%;
        }

    .container-login form input {
        margin-bottom: 1.5rem;
        background-color: var(--corSecundaria);
        border: 0;
        font-family: var(--fontPadrao);
        color: #fff;
        padding: 0.5rem 2.5rem 0.5rem 0.7rem;
    }

        .container-login form input:focus,
        .container-login form input:focus::placeholder {
            color: #000;
        }

        .container-login form input::placeholder {
            color: #fff;
        }

    .container-login form .input-password {
        position: relative;
    }

        .container-login form .input-password i {
            position: absolute;
            top: .5rem;
            right: .7rem;
            color: #fff;
            font-size: 1.5rem;
            cursor: pointer;
        }

        .container-login form .input-password input:focus + i {
            color: #000;
        }

    .container-login form .opcoes {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 2rem;
        font-family: var(--fontPadrao);
    }

        .container-login form .opcoes a {
            font-size: 1.2rem;
            color: #fff;
            text-decoration: none;
        }

        .container-login form .opcoes .btn-entrar {
            padding: 0;
            font-size: 2.5rem;
            color: var(--corSecundaria);
            line-height: 1;
        }

            .container-login form .opcoes .btn-entrar:hover {
                color: var(--corSecundariaEscuro);
            }

.btn-principal {
    font-family: var(--fontPadrao);
    background-color: var(--corPrincipal);
    color: #fff;
}

.btn-secundario {
    font-family: var(--fontPadrao);
    background-color: var(--corSecundaria);
    color: #fff;
}

    .btn-secundario:hover {
        background-color: var(--corSecundariaEscuro);
        color: #fff;
    }

