form[data-op3-element-options-type="form"] {

    // children property
    .op3-element-options-property[data-op3-element-options-property-name="children"] {
        .op3-element-options-property-children-list {
            &:empty::after {
                content: "Empty Children List";
                display: block;
                font-size: 12px;
                color: #8e8e8e;
            }
        }

        .op3-element-options-property-children-list-item-clone,
        .op3-element-options-property-children-list-item-remove {
            display: none;
        }

        .op3-element-options-property-children-list-item-visible {
            display: flex;
        }
    }

    // Field Layout Inline/Stacked
    // [data-op3-element-options-property-name="optinFieldLayout"],
    [data-op3-element-options-property-id="verticalSpacing"],
    [data-op3-element-options-property-id="horizontalSpacing"],
    [data-op3-element-options-property-id="labelSpacing"],
    [data-op3-element-options-property-id="labelFontSize"],
    [data-op3-element-options-property-id="labelColor"] {
        display: none;
    }

    [data-op3-element-options-property-name="optinFieldLayout"] {
        &[data-op3-element-options-property-value="stacked"] {
            ~ [data-op3-element-options-property-id="verticalSpacing"] {
                display: flex;
            }
        }

        &[data-op3-element-options-property-value="inline"] {
            ~ [data-op3-element-options-property-id="horizontalSpacing"],
            ~ [data-op3-element-options-property-id="verticalSpacing"] {
                display: flex;
            }

            ~ [data-op3-element-options-property-id="alignItems"] {
                display: none;
            }
        }
    }

    // Label Spacing
    [data-op3-element-options-property-id="labelVisible"][data-op3-element-options-property-value="1"] {
        ~ [data-op3-element-options-property-id="labelSpacing"],
        ~ [data-op3-element-options-property-id="labelFontSize"],
        ~ [data-op3-element-options-property-id="labelColor"] {
            display: flex;
        }
    }

    .op3-element-options-container {
        &::before {
            display: none;
        }
    }

    // Default Field Width in Optin Form is related
    // to Field Layout value (OP3-784, OP3-785)
    &[data-op3-parent-options-property-value-optinfieldlayout="stacked"] {
        [data-op3-element-options-property-id="fieldWidthDefaultInline"] { display: none; }
        [data-op3-element-options-property-id="fieldWidthDefault"] { display: flex; }
    }

    &[data-op3-parent-options-property-value-optinfieldlayout="inline"] {
        [data-op3-element-options-property-id="fieldWidthDefaultInline"] { display: flex; }
        [data-op3-element-options-property-id="fieldWidthDefault"] { display: none; }
    }
}

// hide some properties for form children (fields/button)
form[data-op3-element-options-path*="/form/"] {
    .op3-element-options-group[data-op3-element-options-group-id="responsive"],
    [data-op3-element-options-property-name="href"],
    [data-op3-element-options-property-name="target"],
    [data-op3-element-options-property-name="action"],
    [data-op3-element-options-property-name="name"] {
        display: none;
    }
}

// disable margins on form element for input/select
// (using field-gap properties to set this)
form[data-op3-element-options-path*="/form/"] {
    &[data-op3-element-options-type="input"],
    &[data-op3-element-options-type="select"],
    &[data-op3-element-options-type="checkbox"] {
        .op3-boxmodel[data-boxmodel-id$="-boxModel"] {
            .op3-boxmodel-margin-top,
            .op3-boxmodel-margin-bottom,
            .op3-boxmodel-margin-left,
            .op3-boxmodel-margin-right {
                pointer-events: none;
                opacity: 0.5;

                & + .op3-boxmodel-handler {
                    display: none;
                }
            }
        }
    }
}

// sidebar tweaks
#sidebar form[data-op3-element-options-type="form"] {
    .op3-element-options-container {
        margin: 0;
        padding-top: 0;
    }
}

#op3-context-menu {
    &[data-op3-element-path*="/form/"] {
        .op3-context-menu-list-item[data-op3-action="markAsGlobalElement"],
        .op3-context-menu-list-separator[data-op3-separator="clipboard/export"],
        .op3-context-menu-list-separator[data-op3-separator="global/delete"],
        .op3-context-menu-list-item[data-op3-action="clone"],
        .op3-context-menu-list-separator[data-op3-separator="clone/clipboard"],
        .op3-context-menu-list-separator[data-op3-separator="export/delete"],
        .op3-context-menu-list-item[data-op3-action="delete"] {
            display: none;
        }

        .op3-context-menu-list-item[data-op3-action="cut"],
        .op3-context-menu-list-item[data-op3-action="copy"],
        .op3-context-menu-list-item[data-op3-action="paste"] {
            opacity: 0.33;
            pointer-events: none;
        }
    }
}

.op3-toolbar {
    form[data-op3-element-options-path*="/form/"] {
        [data-op3-toolbar-nav-id="clone"],
        [data-op3-toolbar-nav-id="move"],
        [data-op3-toolbar-nav-id="delete"] {
            display: none;
        }

        // non-GDPR compliant form
        &[data-op3-element-options-type="checkbox"][data-op3-element-options-spec="gdpr1"],
        &[data-op3-element-options-type="checkbox"][data-op3-element-options-spec="gdpr2"] {
            .op3-element-options-property[data-op3-element-options-property-id="required"][data-op3-element-options-property-value="1"] ~ .op3-element-options-property[data-op3-element-options-property-id="checked"],
            .op3-element-options-property[data-op3-element-options-property-id="checked"][data-op3-element-options-property-value="1"] {
                &::after {
                    content: "Making this field required or checked may make your form non-GDPR compliant.";
                    display: block;
                    width: 100%;
                    margin-top: 16px;
                    font-size: 11px;
                    font-style: italic;
                    color: #333;
                    opacity: .8;
                }
            }
        }
    }
}