/* carregue esse arquivo antes dos outros, caso queira sobrescrever uma propriedade */
html::-webkit-scrollbar {
    width: 6px !important;
}

html::-webkit-scrollbar-thumb {
    background: white !important;
    border-radius: 5px !important;
}

html::-webkit-scrollbar-track {
    background: transparent !important;
}

.no-select {
    -webkit-user-select: none;
}


.background {
    background-image: linear-gradient(to bottom right, #007bff, #000077);
}

.foreground {
    background-color: white;
}

.text-error {
    color: red;
}

.input {
    border: 1px solid gray;
    border-radius: 25px;
    padding: 15px 10px 15px 10px;
    width: fit-content;
    text-align: center;
}

.input-disabled {
    background: rgb(244, 244, 244);
    cursor: pointer;
    text-align: center;
    color: #606060;
}

.input-disabled:focus {
    cursor: text;
    background-color: rgb(249, 249, 249);
}

.button {
    background: linear-gradient(to bottom right, rgb(0, 72, 255) 35%, rgb(95, 26, 255) 100%);
    color: white;
    padding: 11px;
    border-radius: 25px;
    border: none;
    cursor: pointer;
    transition: 2s;
}

.button:hover {
    background: linear-gradient(to bottom right, rgb(66, 117, 248) 35%, rgb(137, 87, 255) 100%);
}

@media screen and (prefers-color-scheme: dark) {
    .background {
        background-image: linear-gradient(to bottom right, #211f66, #114476);
    }

    .foreground {
        color: white;
        background: #242424;
    }

    .button {
        background: linear-gradient(to bottom right, #6a94d0, #4685dd) !important;
        font-weight: bold;
    }

    .button:hover {
        background: linear-gradient(to bottom right, #85b8ff, #4e98ff) !important;
    }

    .mono-chromatic {
        filter: invert(1);
    }

    .text-error {
        color: #ff5454;
    }

    .input {
        background: transparent;
        color: white;
        border-color: white;
    }

    .input::placeholder {
        color: white;
    }

    .input-disabled:focus {
        background-color: rgb(34, 34, 34);
    }

    .input::placeholder {
        color: rgb(190, 190, 190) !important;
    }
}