@charset "UTF-8";

@import "lib/variables";
@import "lib/prefixes";
        
.editormd {
    width: 90%;
    height: 640px;
    margin: 0 auto;
    text-align: left;
    overflow: hidden;  
    position: relative;
    margin-bottom: 15px;
    border: 1px solid $borderColor;
    font-family: "Meiryo UI", "Microsoft YaHei", "Malgun Gothic", "Segoe UI", "Trebuchet MS", Helvetica, "Monaco", monospace, Tahoma, STXihei, "华文细黑", STHeiti, "Helvetica Neue", "Droid Sans", "wenquanyi micro hei", FreeSans, Arimo, Arial, SimSun, "宋体", Heiti, "黑体", sans-serif;

    *, *:before, *:after {
        @include box-sizing(border-box);
    }
    
    a {
        text-decoration: none;
    }

    img {
        border: none;
        vertical-align: middle;
    }            

    > textarea,
    #{$prefix}html-textarea,
    #{$prefix}markdown-textarea {
        width: 0;
        height: 0;
        outline: 0;
        resize:none;
    }
    
    #{$prefix}html-textarea,
    #{$prefix}markdown-textarea {
        display : none;
    }

    input[type="text"], 
    input[type="button"], 
    input[type="submit"], 
    select, textarea, button {
        @include appearance(none);
    }
            
    ::-webkit-scrollbar {
        height: 10px;
        width: 7px;
        background: rgba(0, 0, 0, .1);

        &:hover {
            background: rgba(0, 0, 0, .2);
        }
    }

    ::-webkit-scrollbar-thumb {
        background: rgba(0,0,0,0.3);
        @include border-radius(6px);

        &:hover {
            @include box-shadow(inset 1px 1px 1px rgba(0, 0, 0, .25));
            background-color: rgba(0, 0, 0, .4);
        }
    }
}
            
#{$prefix}user-unselect { 
    @include user-select(none); 
}

#{$prefix}toolbar {
    width: 100%;
    min-height: 37px;
    background: #fff;
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    border-bottom: 1px solid $borderColor;
}

#{$prefix}toolbar-container {
    padding: 0 8px;
    min-height: 35px;
    @include user-select(none);
}

@import "editormd.menu";

#{$prefix}container {
    margin: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding: 35px 0 0;
    position: relative;   
    background: #fff;
    @include box-sizing(border-box);
}

@import "editormd.dialog"; 
@import "editormd.grid"; 
@import "editormd.tab"; 
@import "editormd.form"; 
@import "editormd.CodeMirror";
@import "editormd.preview";
@import "editormd.preview.themes";

#{$prefix}onlyread {
    #{$prefix}toolbar {
        display: none;
    }

    .CodeMirror {
        margin-top: 0;
    }

    #{$prefix}preview {
        top: 0;
    }
}

#{$prefix}fullscreen {
    position: fixed; 
    top   : 0; 
    left  : 0; 
    border: none;
    margin: 0 auto;
}

@import "editormd.themes";