.PayeeForm {
    max-width: 375px;
    display: flex;
    flex-direction: column;
    margin-left: calc(265px - var(--main-content-padding));

    &-Loader {
        margin-top: 10px;
        display: flex;
        flex-direction: column;
        gap: 20px;

        &-field {
            display: flex;
            flex-direction: column;
            gap: 4px;
        }

        &-buttons {
            margin-top: 20px;
            display: flex;
            justify-content: flex-end;

            .SkeletonLoader {
                &-item:last-child {
                    flex: 0;
                }
            }
        }
    }

    .Alert {
        margin: var(--padding-large) 0;
    }

    .AccountDetail-header {
        margin-bottom: 10px;
    }

    .form-group {
        margin-bottom: var(--padding-large);
    }

    .FormField-btn-wrap {
        margin: var(--padding-extra-large) 0;

        .PayeeForm-buttons {
            display: flex;
            justify-content: space-between;
        }
    }

    .paymentSection {
        i {
            color: var(--text-secondary);
        }

        .ReleasePayeeModal {
            &-Button-Container {
                display: flex;
                align-items: center;
                gap: var(--padding-medium);
                margin-top: var(--padding-large);
            }
        }
    }

    hr {
        margin: var(--padding-large) 0;
    }

    &-ConfirmMoveProgramModal {
        max-width: 540px;

        .ReactModal-body {
            padding-top: 40px;
        }
    }

    .paymentDescription {
        height: 80px;
    }
}

.ReleasePayeeModalPortal {
    .ReactModal {
        &-content {
            width: 500px;
        }

        .Alert {
            &-content {
                gap: var(--padding-extra-large);
            }
        }
        ul {
            list-style: disc;
        }
    }
}