.ncl-edit-version-code {
    height: 100%;
    display: flex;
    justify-content: space-between;
    padding-bottom: 24px !important;
    position: relative;

    &.ui-layout-column {
        overflow: hidden;

        .ui-layout-container {
            overflow: hidden;
        }

        .ui-splitbar {
            background: @pale-grey;

            a {
                display: none;
            }
        }
    }

    .code-section {
        width: 100%;

        .code-wrapper-block {
            position: absolute;
            height: 100%;
            width: 100%;

            .igz-scrollable-container {
                flex-grow: 1;
                height: 100%;
                min-width: 0;

                .ncl-monaco {
                    height: 100%;
                }

                .ncl-edit-version-code-wrapper {
                    height: 100%;
                    padding: 24px 41px 0;
                    min-width: 700px;
                    display: flex;
                    flex-direction: column;

                    .ncl-code-entry-url,
                    .ncl-code-entry-s3 {
                        max-width: 700px;
                    }

                    .ncl-code-entry-url {
                        .field-label {
                            margin-top: 10px;
                        }
                    }

                    .ncl-code-entry-s3 {
                        .field-label {
                            margin-top: 15px;
                        }
                    }
                }

                .section-wrapper {
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    padding: 18px 39px 0 23px;
                }

                .code-edit-section {
                    display: flex;
                    flex-direction: column;
                    flex: 1;
                    position: relative;

                    .code-editor-drop-zone {
                        position: absolute;
                        top: 0;
                        left: 0;
                        right: 0;
                        bottom: 0;
                        background-color: rgb(200, 200, 200);
                        outline: 3px dashed black;
                        outline-offset: -10px;
                        display: none;

                        &.dragover {
                            display: block;

                            &:before {
                                content: 'Drop files here';
                                display: inline-block;
                                position: absolute;
                                top: 50%;
                                left: 50%;
                                transform: translate(-50%, -50%);
                                font-size: xx-large;
                            }
                        }
                    }

                    .monaco-code-editor {
                        width: 100%;
                        height: 100%;
                        position: relative;
                        display: flex;
                        flex-direction: column;

                        .ncl-monaco {
                            position: relative;
                            flex-direction: column;
                        }
                    }
                }

                .code-entry-section {
                    margin-bottom: 20px;
                    background-color: @white;
                    border: 1px solid @pale-grey-two;

                    .code-entry-row {
                        display: flex;
                        margin-bottom: 24px;

                        .code-entry-col {
                            margin-right: 16px;

                            .col-label {
                                margin-bottom: 2px;
                                font-size: 14px;
                                color: @dusk-three;
                            }
                        }

                        .code-entry-type-col {
                            width: 25%;
                        }

                        .code-entry-runtime-col {
                            width: 21%;
                        }

                        .code-entry-handler-col {
                            width: 39%;
                        }

                        .code-entry-theme-col {
                            width: 15%;
                        }

                        .code-entry-button-col {
                            min-width: 128px;

                            .upload-button {
                                height: 36px;
                                width: 128px;
                                margin: 21px 0 0 0;
                                padding: 0;

                                i {
                                    display: inline-block;
                                    font-size: 16px;
                                    margin-left: 20px;
                                    vertical-align: middle;
                                }

                                span {
                                    margin-left: 4px;
                                    letter-spacing: 1px;
                                    vertical-align: middle;
                                }
                            }
                        }

                        .code-entry-url-col {
                            width: 100%;
                            margin-right: 160px;
                        }
                    }
                }
            }
        }
    }
}

@media screen and (min-height: 850px) {
    .ncl-edit-version-code {
        .code-edit-section {
            height: 500px;
        }
    }
}

@media screen and (min-height: 900px) {
    .ncl-edit-version-code {
        .code-edit-section {
            height: 600px;
        }
    }
}

@media screen and (min-height: 1300px) {
    .ncl-edit-version-code {
        .code-edit-section {
            height: 900px;
        }
    }
}