// Wrapper for inline text editor
.op-ckeditor-element
  min-height: 50px
  border: 1px solid #bfbfbf !important

  &.ck-editor__editable_inline
    padding-left: 2px !important

// Wrapper for full text element
.op-ckeditor--wrapper

  // Borders for the main editor
  .ck-editor__main, .ck-editor__preview
    border: 1px solid #bfbfbf
    margin-bottom: 2rem

  // Min height for the editable section
  .ck-editor__editable
    min-height: 20vh

// Correct code style
.ck-content pre
  margin: 10px 0

  code
    display: block

.ck .ck-widget.op-ckeditor--code-block
  // Display content as pre
  white-space: pre
  padding: 10px 5px 0 5px
  border: 1px dashed #eee
  background: #f1f1f1
  cursor: pointer

  .op-ckeditor--code-block-language
    text-align: right
    font-style: italic
    font-size: 0.8rem
    padding: 5px 0
    
.op-macro-list-button
  > .ck.ck-button
    text-align: left