.ProseMirror {
  position: relative;
}

.ProseMirror {
  word-wrap: break-word;
  white-space: pre-wrap;
  white-space: break-spaces;
  -webkit-font-variant-ligatures: none;
  font-variant-ligatures: none;
  font-feature-settings: "liga" 0; /* the above doesn't seem to work in Edge */
}

.ProseMirror pre {
  white-space: pre-wrap;
}

.ProseMirror li {
  position: relative;
}

.ProseMirror-hideselection *::selection { background: transparent; }
.ProseMirror-hideselection *::-moz-selection { background: transparent; }
.ProseMirror-hideselection { caret-color: transparent; }

/* See https://github.com/ProseMirror/prosemirror/issues/1421#issuecomment-1759320191 */
.ProseMirror [draggable][contenteditable=false] { user-select: text }

.ProseMirror-selectednode {
  outline: 2px solid #8cf;
}

/* Make sure li selections wrap around markers */

li.ProseMirror-selectednode {
  outline: none;
}

li.ProseMirror-selectednode:after {
  content: "";
  position: absolute;
  left: -32px;
  right: -2px; top: -2px; bottom: -2px;
  border: 2px solid #8cf;
  pointer-events: none;
}

/* Protect against generic img rules */

img.ProseMirror-separator {
  display: inline !important;
  border: none !important;
  margin: 0 !important;
}

/* Table editing: cell selection and resize decorations are supplied by
 * prosemirror-tables. Keep editor-only controls out of serialized HTML. */
.ProseMirror .tableWrapper {
  overflow-x: auto;
  margin: 1em 0;
}

.ProseMirror table {
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
  margin: 0;
}

.ProseMirror td,
.ProseMirror th {
  position: relative;
  box-sizing: border-box;
  min-width: 50px;
  border: 1px solid #9ca3af;
  padding: 6px 8px;
  vertical-align: top;
}

.ProseMirror th {
  background: #f3f4f6;
  font-weight: 600;
}

.ProseMirror :is(td, th) > p {
  margin: 0;
  min-height: 1.5em;
}

.ProseMirror .selectedCell::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgb(191 219 254 / 55%);
  pointer-events: none;
  z-index: 2;
}

.ProseMirror .column-resize-handle {
  position: absolute;
  right: -2px;
  top: 0;
  bottom: 0;
  width: 4px;
  background: #93c5fd;
  pointer-events: none;
  z-index: 20;
}

.ProseMirror.resize-cursor { cursor: col-resize; }
.editor-table-menu {
  width: min(280px, calc(100vw - 16px));
  max-height: calc(100vh - 16px);
  overscroll-behavior: contain;
}
