body {
    background-color: #fff;
    height: 100vh;
    .block-element {
        display: flex;
        height: 100%;
        justify-content: center;
        align-items: center;
        text-align: center;
        padding: 0 2rem;
        @media (min-width: 992px) {
            display: none;
            pointer-events: none;
            visibility: hidden;
        }
    }
}

.alert-danger{
    --bs-alert-border-color: none;
}

table {
    th, td {
        align-content: center;
    }
}

form {
    h1 {
        font-weight: 700;
        text-align: center;
        margin-bottom: 3rem;
        font-size: 1.8em;
    }

    label {
        font-weight: 600;
        font-size: 1em;
    }

    .form-control, .form-select {
        background-color: #ededed;
        padding: 0.75rem 1rem;
        border: none;

        &:focus {
            background-color: #efefef;
            border-color: transparent;
            box-shadow: none;
        }
    }

    .btn {
        --bs-btn-font-weight: 600;
        font-size: 1.1em;
        padding: 0.6rem 1rem;
    }
}

#main.auth {
    background: radial-gradient(circle at 60.52% 67.2%, #264697, transparent 41%), radial-gradient(circle at 56.14% 12.23%, #232b69, transparent 85%), radial-gradient(circle at 6.01% 1.34%, #8dd989, transparent 25%), radial-gradient(circle at 75.71% 4.03%, #0a0d66, transparent 34%), radial-gradient(circle at 99.31% 70.7%, #eb2f2f, transparent 75%), radial-gradient(circle at 76.91% 59.14%, #0a0d66, transparent 71%), radial-gradient(circle at 71.07% 83.33%, #0a0d66, transparent 71%), radial-gradient(circle at 15.11% 70.43%, #1556a1, transparent 64%), radial-gradient(circle at 65.49% 37.9%, #3058a5, transparent 100%), radial-gradient(circle at 99.4% 93.55%, #ff1212, transparent 100%), radial-gradient(circle at 50% 50%, #7baa62, #68aa62 100%);

    .login {
        .card {
            width: 100%;
            box-shadow: #0000001f 0 8px 24px;

            @media screen and (min-width: 992px){
                width: 50%;
            }

            input {
                margin-bottom: 1.5rem;
            }
        }
    }
}

#main.home {
    display: none;
    @media screen and (min-width: 992px) {
        display: flex;
        flex-direction: row;
    }
    .sidebar {
        position: relative;
        min-width: 350px;
        .aside-container {
            display: none;
            @media screen and (min-width: 992px){
                display: flex;
                flex-direction: row;
                color: #fff;
                position: fixed;
                top: 0;
                left: 0;
                background: #000;
                height: 100vh;
                width: 350px;
                .aside {
                    padding: 1rem 1.5rem;
                    width: 100%;
                    .sidebar-layout {
                        display: flex;
                        flex-direction: column;
                        height: 100%;
                        .sidebar-header .sidebar-logo {
                            h5{
                                font-size: 1.8em;
                                font-weight: 600;
                                margin: 0;
                            }
                        }
                        .sidebar-content {
                            margin-top: 1.5rem;
                            flex-grow: 1;
                            ul {
                                list-style-type: none;
                                padding: 0;
                                .menu-item {
                                    margin-bottom: .5rem;
                                    padding: 0.5rem 0.5rem 0.5rem 0.75rem;

                                    &.active {
                                        background: #efefef2e;
                                        border-radius: 10px;
                                    }

                                    a {
                                        text-decoration: none;
                                        color: #efefef;
                                        display: flex;
                                        flex-direction: row;

                                        .menu-icon {
                                            font-size: 20px;
                                            margin-right: 0.75em;
                                            align-self: center;
                                        }

                                        .menu-title {
                                            font-size: 1.1em;
                                            font-weight: 600;
                                            align-self: center;
                                        }
                                    }
                                }
                            }
                        }
                        .sidebar-footer {
                            .inside {
                                line-height: 1.2;
                                cursor: pointer;
                                transition: 0.3s background-color;
                                border-radius: 10px;
                                padding: 0.5rem;

                                &:hover {
                                    background-color: #efefef2e;
                                    transition: 0.3s background-color;
                                }

                                p {
                                    margin: 0;
                                    font-weight: 700;
                                    font-size: 1.2em;
                                }

                                span {
                                    font-size: 0.8em;
                                    font-weight: 400;
                                    color: #c3c3c3;
                                }

                                .dropdown-menu {
                                    margin-bottom: 0.6rem!important;
                                    border: none;

                                    li {
                                        padding: 0.4rem 0;
                                        --bs-dropdown-link-hover-bg: #e3e3e3;
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    .content {
        @media screen and (min-width: 992px){
            padding: 3rem;
            margin-top: 0;
        }
        margin-top: 1.5rem;
        width: 100%;
    }
}