/*
  rich text editor using ProseMirror

  container
  validation
*/



@layer common-styling {

  /* container
  ============================================================================ */
  .pos-markdown {
      width: 100%;
  }

  .EasyMDEContainer .editor-toolbar {
    height: var(--pos-height-input);
    padding-inline: var(--pos-padding-input);
    box-sizing: border-box;

    border-block-end-width: 0;
    border-start-start-radius: var(--pos-radius-input) !important;
    border-start-end-radius: var(--pos-radius-input) !important;
    border-style: solid;
    border-color: var(--pos-color-input-frame) !important;
    outline: none;
    background-color: var(--pos-color-input-background);
    
    text-align: start;
    color: var(--pos-color-input-text);
  }

  .EasyMDEContainer .CodeMirror {
    border-color: var(--pos-color-input-frame) !important;
    border-end-start-radius: var(--pos-radius-input) !important;
    border-end-end-radius: var(--pos-radius-input) !important;
  }

  .EasyMDEContainer .editor-preview-side {
    border-color: var(--pos-color-input-frame) !important;
  }

  .EasyMDEContainer .editor-preview {
    padding: var(--pos-padding-card);
    background-color: var(--pos-color-highlight-background) !important;
  }

  /* tailwind interferes with the .table button */
  .EasyMDEContainer .editor-toolbar button {
    width: auto;
  }


  /* validation
  ============================================================================ */
  .pos-markdown-error-disabled {
    display: none;
  }

}