.markdown-editor-wrapper {
    border: 1px solid #ddd;
    position: relative;

    .float-left {
        float: left;
    }

    .float-right {
        float: right;
    }

    textarea {
        border: 0;
        resize: none;
        width: 100%;
        min-height: 200px;
    }

    .markdown-editor-preview {
        display: none;
        overflow-y: auto;
        height: 100%;
        padding: 20px;
    }

    .markdown-editor-row {
        height: 100%;
    }

    /* Modes */
    &[data-mode=editor] {
        textarea {
            display: block !important;
        }

        .markdown-editor-preview {
            display: none;
            width: 0;
        }
    }

    &[data-mode=preview] {
        textarea {
            display: none;
            width: 0;
        }

        .markdown-editor-preview {
            display: block !important;
        }
    }

    &[data-mode=split] {
        textarea {
            display: block;
            position: absolute;
            height: 100%;
            width: 50%;
            top: 0;
            left: 0;
        }

        .markdown-editor-preview {
            display: block;
            position: absolute;
            width: 50%;
            height: 100%;
            top: 0;
            left: 50%;
        }

        .markdown-editor-row {
            position: relative;
            min-height: 250px;
        }
    }
}

.markdown-editor-fullscreen {
    &.markdown-editor-wrapper {
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        margin: 0;
        padding: 0;
        z-index: 999999;
        border: none;
        background: white;

        padding-bottom: 45px !important;
       
        .markdown-editor-preview,
        textarea {
            height: 100% !important;
            resize: none;
            outline: none;
        }
    }
}

body.markdown-editor-fullscreen {
    overflow: hidden;
}

.markdown-editor-header {
    display: block;
    padding: 6px 4px;
    background: #f5f5f5;
    border-bottom: 1px dashed #ddd;

    &.btn-toolbar {
        margin: 0;
    }

    .markdown-toolbar-buttons {
        margin-left: 0;
    }
}


.btn-group.markdown-editor-mode label {
    width: 50px;
}
