.ContractTermsDistroFormFields {
    width: 80%;
    font-weight: 400;
    .form-label,
    label {
        font-size: 14px;
        font-weight: 500;
    }

    .FormControl-error-message {
        display: flex;
    }

    &-FormRow {
        flex-wrap: nowrap;
        padding-top: 20px;
        gap: 40px;
        &-Attachments {
            display: block;
        }
        &-Buttons {
            display: flex;
            justify-content: flex-end;
            float: right;
            gap: 8px;
            margin-top: 20px;
        }
    }
    &-Header {
        display: flex;
        flex-direction: column;
        &-Button {
            float: right;
        }
    }

    &-VendorSearch {
        width: 50%;
        float: right;
    }

    &-TermName {
        width: 50%;
        float: left;
        .FormControl-error-message {
            display: flex;
        }
    }

    &-ContractTermsConditionsForm {
        width: 100%;
        margin-top: 40px;
        &-header,
        &-row {
            display: grid;
            grid-template-columns: 40px 0.8fr 0.8fr 0.8fr 0.4fr;
            align-items: center;
            gap: 16px;
            width: 100%;
        }

        // maybe less styles here
        &-header {
            font-size: 13px;
            color: #5f5f5f;
            padding-bottom: 8px;
            border-bottom: 1px solid #e0e0e0;
            margin-bottom: 8px;
        }

        &-row {
            margin-bottom: 12px;
        }

        .priorityControl {
            display: flex;
            justify-content: center;
            align-items: center;
            color: #333;
        }

        .contractTermConditionRate {
            display: flex;
            align-items: center;
            gap: 8px;

            .deleteTermCondition {
                margin-left: 8px;
            }

            .disableDelete {
                opacity: 0.4;
                pointer-events: none;
            }
        }

        &-actions {
            display: flex;
            justify-content: space-between;
            width: 100%;
        }

        &-CopyConditions {
            display: flex;
            .ReactModal-content {
                width: 100%;
                height: 100%;
            }
            .FormField {
                padding-top: 20px;
            }
        }
    }
}