// Extended from bootstrap

// Modal


.modal {
    backdrop-filter: saturate(10%);
    .modal-content {
        
        .modal-header {
            padding: 1rem 1.5rem;

            .modal-title {
                font-weight: 600;
            }

            .close {
                padding: 0.5rem 0.75rem;
                margin: -0.5rem -0.5rem -0.5rem auto;
                
                span {
                    font-size: 1.5rem;
                    font-weight: 700;
                }
            }
        }

        .modal-body {
            padding: 1.5rem;

            .form-label {
                font-weight: 500;
                margin-bottom: 0.5rem;

                sup {
                    font-weight: bold;
                    margin-left: 2px;
                }
            }

            .form-control {
                padding: 0.75rem 1rem;
                border-radius: 0.375rem;

                &::placeholder {
                    color: rgba($body-color-dark, 0.5);
                }
            }

            .help.text-danger {
                font-size: 0.875rem;
                margin-top: 0.375rem;
            }

            .mb-3 {
                margin-bottom: 1.5rem !important;
            }
        }

        .modal-footer {
            padding: 1rem 1.5rem;

            .btn {
                padding: 0.5rem 1.25rem;
                font-weight: 500;

                i {
                    margin-right: 0.5rem;
                }
            }
        }
    }
}