@import url("https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,400;0,600;0,700;0,900;1,400;1,600;1,700;1,900&family=Open+Sans:wght@400;500;600;700&display=swap");

:root {
    --primary-color: #a3d133;
    --secundary-color: #3eb1fc;
}

body {
    background: linear-gradient(
        -60deg,
        #786fff 0%,
        var(--secundary-color) 100%
    ) !important;
    font-family: "Open Sans";
}

main {
    margin-top: 40px;
    display: flex;
    align-items: center;

    .card-body {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
}

.card {
    min-height: 60vh;
    background: linear-gradient(
        120deg,
        #fff 70%,
        var(--primary-color) 0%
    ) !important;
    border: 6px solid #fff;
    border-radius: 16px;
}

.card-header {
    background-color: #fff;
}

form {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;

    .form-control:focus,
    .form-check-input:focus {
        border-color: #bdd975;
        box-shadow: 0 0 0 0.25rem rgba(163, 209, 51, 0.4);
    }

    .form-check-input:checked {
        background-color: var(--primary-color);
        border-color: var(--primary-color);
    }
}

button[type="submit"] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}
button[type="submit"]:hover {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

a.btn-link {
    color: #000;
    text-decoration: none;
}
a.btn-link:hover {
    color: #708b2b;
    text-decoration: underline;
}
