@import "../helpers/colors.scss";

main {
    section {
        &.loginForm,
        &.registerForm {
            .cardsContainer {
                .container-card {
                    #txtTipoOrdine {
                        background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTYgOSI+DQogIDxwYXRoIGlkPSJQb2x5Z29uXzYiIGRhdGEtbmFtZT0iUG9seWdvbiA2IiBkPSJNOCwwbDgsOUgwWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTYgOSkgcm90YXRlKDE4MCkiIGZpbGw9IiM2Y2FhYTgiLz4NCjwvc3ZnPg0K)
                            no-repeat 98% 50%;
                        -moz-appearance: none;
                        -webkit-appearance: none;
                        appearance: none;
                    }
                    h2 {
                        color: $green;
                        line-height: 8rem;
                        font-size: 4rem;
                    }

                    min-height: 70vh;
                    padding: 0 25px;

                    form {
                        input,
                        select {
                            border: 1px solid $lightGray;
                            font-size: 1.5rem;
                            height: 50px;
                            padding: 5px 20px;
                            border-radius: 20px;
                            margin-bottom: 20px;

                            &:focus {
                                outline: none;
                            }
                        }

                        select {
                            padding: 0 25px;
                            color: #757575;
                        }

                        button {
                            display: block;
                            border-radius: 20px;
                            background: $green;
                            color: #fff;
                            border: 1px solid $green;
                            width: 200px;
                            height: 40px;
                            font-size: 2rem;
                            margin: 20px auto;

                            &:focus {
                                outline: none;
                            }

                            &:hover {
                                background: $hoverGreen;
                            }
                        }

                        a {
                            color: $green;
                            font-size: 1.5rem;
                        }

                        &.login {
                            input {
                                width: 50%;
                            }
                        }

                        &.register {
                            input,
                            select {
                                width: 100%;
                            }

                            button {
                                width: 200px;
                            }
                        }
                    }
                }
            }
        }

        &.registerCompany {
            form {
                &.addCompany {
                    input {
                        width: 100%;
                    }

                    .custom-file-label {
                        height: 50px;
                        font-size: 2rem;
                        line-height: 4rem;
                        border-radius: 20px;
                        // color: $green;

                        &::after {
                            opacity: 0;
                        }
                    }

                    .custom-file {
                        margin-bottom: 50px;
                    }
                }
            }
        }

        &.loginForm {
            .cardsContainer {
                .container-card {
                    padding: 5% 25px;
                }
            }
        }

        &.registerForm {
            .custom-file-label {
                height: 50px;
                font-size: 2rem;
                line-height: 4rem;
                border-radius: 20px;
                // color: $green;

                &::after {
                    opacity: 0;
                }
            }
            .cardsContainer {
                .container-card {
                    min-height: 70vh;
                    padding: 1% 25px;
                }
            }
        }
    }
}

#forgotPasswordModal {
    .modal-content {
        border-radius: 20px;
    }

    .modal-header {
        h5 {
            color: $green;
            font-size: 2rem;
            width: 100%;
            text-align: center;
        }

        .close {
            span {
                font-size: 3rem;
            }
        }
    }

    .modal-body {
        p {
            display: block;
            font-size: 1.5rem;
        }

        form {
            input {
                width: 90%;
                margin: 0 auto;
                border: 1px solid $lightGray;
                font-size: 1.5rem;
                height: 50px;
                padding: 5px 20px;
                border-radius: 20px;
                margin-bottom: 20px;

                &:focus {
                    outline: none;
                }
            }

            button {
                display: block;
                border-radius: 20px;
                background: $green;
                color: #fff;
                border: 1px solid $green;
                width: 200px;
                height: 40px;
                font-size: 2rem;
                margin: 20px auto;

                &:focus {
                    outline: none;
                }

                &:hover {
                    background: $hoverGreen;
                }
            }
        }
    }
}