.app {
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: url('../../../../img/svg/home-menu-bg-overlay.svg'), linear-gradient(to right bottom, var(--color_deeppurple), var(--color_subdeeppurple));
    background-size: cover;
}

input, textarea, select {
    outline: none;
}

.app h1 {
    color: #fff;
    margin-bottom: 20px;
}

.install_db_form {
    width: 40%;
    background: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px 0;
}

.install_db_form span {
    width: 90%;
    font-size: 18px;
    padding: 5px 0;
}

.input_group {
    width: 90%;
    display: flex;
    flex-direction: column;
    margin-bottom: 15px;
}

.input_group label {
    font-size: 18px;
}

.input_group input {
    font-size: 20px;
    border: none;
    border-bottom: 2px solid var(--color_deepblue);
}

.submit {
    width: 90%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.submit .spinner {
    opacity: 0;
}

/* From uiverse.io by @AqFox */
.spinner {
    width: 56px;
    height: 56px;
    display: grid;
    color: #004dff;
    background: radial-gradient(farthest-side, currentColor calc(100% - 7px),#0000 calc(100% - 6px) 0);
    -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 15px),#000 calc(100% - 13px));
    border-radius: 50%;
    animation: spinner-sm4bhi 2s infinite linear;
}

.spinner::before,
.spinner::after {
    content: "";
    grid-area: 1/1;
    background: linear-gradient(currentColor 0 0) center, linear-gradient(currentColor 0 0) center;
    background-size: 100% 11px,11px 100%;
    background-repeat: no-repeat;
}

.spinner::after {
    transform: rotate(45deg);
}

@keyframes spinner-sm4bhi {
    100% {
        transform: rotate(1turn);
    }
}

/* From uiverse.io by @adamgiebl */
.submit button {
    height: 50px;
    display: flex;
    align-items: center;
    font-family: inherit;
    font-weight: 500;
    font-size: 17px;
    padding: 0.8em 1.3em 0.8em 0.9em;
    color: white;
    background: #ad5389;
    background: linear-gradient(to right, #0f0c29, #302b63, #24243e);
    border: none;
    letter-spacing: 0.05em;
    border-radius: 16px;
    cursor: pointer;
}

.submit button svg {
    margin-right: 3px;
    transform: rotate(30deg);
    transition: transform 0.5s cubic-bezier(0.76, 0, 0.24, 1);
}

.submit button span {
    transition: transform 0.5s cubic-bezier(0.76, 0, 0.24, 1);
}

.submit button:hover svg {
    transform: translateX(5px) rotate(90deg);
}

.submit button:hover span {
    transform: translateX(7px);
}