.ProseMirror [data-indent][data-indent='1'] {
  padding-left: 30px;
}

.ProseMirror [data-indent][data-indent='2'] {
  padding-left: 60px;
}

.ProseMirror [data-indent][data-indent='3'] {
  padding-left: 90px;
}

.ProseMirror [data-indent][data-indent='4'] {
  padding-left: 120px;
}

.ProseMirror [data-indent][data-indent='5'] {
  padding-left: 150px;
}

.ProseMirror [data-indent][data-indent='6'] {
  padding-left: 180px;
}

.ProseMirror [data-indent][data-indent='7'] {
  padding-left: 210px;
}

.ProseMirror [data-indent][data-indent='8'] {
  padding-left: 240px;
}

.ProseMirror [data-indent][data-indent='9'] {
  padding-left: 270px;
}

.ProseMirror [data-indent][data-indent='10'] {
  padding-left: 300px;
}

.ProseMirror [data-indent][data-indent='11'] {
  padding-left: 330px;
}

.ProseMirror [data-indent][data-indent='12'] {
  padding-left: 360px;
}

.ProseMirror [data-indent][data-indent='13'] {
  padding-left: 390px;
}

.ProseMirror [data-indent][data-indent='14'] {
  padding-left: 420px;
}

.ProseMirror [data-indent][data-indent='15'] {
  padding-left: 450px;
}

.ProseMirror [data-indent][data-indent='16'] {
  padding-left: 480px;
}

.ProseMirror [data-indent][data-indent='17'] {
  padding-left: 510px;
}

.ProseMirror [data-indent][data-indent='18'] {
  padding-left: 540px;
}

.ProseMirror [data-indent][data-indent='19'] {
  padding-left: 570px;
}

.ProseMirror [data-indent][data-indent='20'] {
  padding-left: 600px;
}

.ProseMirror span {
  line-height: normal !important;
}

.ProseMirror *,
.text {
  font-family: 'PP-Neue Montreal', sans-serif !important;
  text-align: justify;
}

.ProseMirror h1,
.ProseMirror h2,
.ProseMirror h3,
.ProseMirror h4,
.ProseMirror h5 * {
  letter-spacing: 0;
  text-align: justify;
  padding: 4px 0;
}

.ProseMirror h1,
.ProseMirror h2,
.ProseMirror h3,
.ProseMirror h4,
.ProseMirror h5,
.ProseMirror h6 {
  padding: 6px 0;
}

.ProseMirror h1 * {
  font-size: 32px !important;
  font-weight: 700 !important;
}

.ProseMirror h1 {
  font-size: 32px !important;
  font-weight: 700 !important;
  line-height: 44px;
}

.ProseMirror h2 {
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  margin-top: 32px;
  margin-bottom: 16px;
}

.ProseMirror h3 {
  font-size: 22px;
  font-weight: 600;
  line-height: 30px;
  margin-top: 16px;
  margin-bottom: 8px;
}

.ProseMirror h4 {
  font-size: 18px;
  font-weight: 500;
  line-height: 26px;
  margin-top: 12px;
  margin-bottom: 6px;
}

.ProseMirror h5 {
  font-size: 16px;
  font-weight: 500;
  line-height: 22px;
}

/* 
.ProseMirror h2 {
  font-size: 18px;
  line-height: 24px;
} */

.ProseMirror ul {
  list-style-type: disc;
  margin-left: 36px;
  padding: 5px 0;
  display: flex;
  flex-direction: column;
}

.ProseMirror ol {
  list-style-type: decimal;
  margin-left: 36px;
  padding: 5px 0;
  display: flex;
  flex-direction: column;
}

.ProseMirror ol li p:first-child::before {
  content: counter(list-counter) '. ';
  display: inline-block;
  margin-right: 5px;
}

.ProseMirror button {
  display: flex;
  align-items: center;
  position: relative;
  max-width: 100%;
  padding: 6px 20px;
  border-radius: 4px;
  line-height: 20px;
  margin: 8px 12px;

  color: rgb(255, 255, 255);
  background: rgb(48, 49, 51);
  border: 0px solid rgb(48, 49, 51);
}

.ProseMirror ol li {
  counter-increment: list-counter;
}

img[imagealign='center'] {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}

img[imagealign='start'] {
  position: relative;
  left: 0;
}

img[imagealign='end'] {
  position: relative;
  left: 100%;
  transform: translateX(-100%);
}

/* .ProseMirror h2 * {
  font-size: 24px !important;
  font-weight: 400 !important;
}

.ProseMirror h3 * {
  font-size: 18px !important;
  font-weight: 400 !important;
}

.ProseMirror h4 * {
  font-size: 16px !important;
  font-weight: 400 !important;
}

.ProseMirror h5 * {
  font-size: 12px !important;
  font-weight: 500 !important;
} */

/* .ProseMirror h1 * {
  font-size: 32px !important;
  font-weight: 700 !important;
} */
.ProseMirror h1 * {
  color: #111111;
  font-size: 44px !important;
  font-weight: 600 !important;
  line-height: 130% !important;
}

.ProseMirror h2 * {
  color: #111111;
  font-size: 40px !important;
  font-weight: 500 !important;
  line-height: 130% !important;
}

.ProseMirror h3 * {
  color: #111111;
  font-size: 36px !important;
  font-weight: 500 !important;
  line-height: 130% !important;
}

.ProseMirror h4 * {
  color: #111111;
  font-size: 32px !important;
  font-weight: 400 !important;
  line-height: 130% !important;
}

.ProseMirror h5 * {
  color: #111111;
  font-size: 28px !important;
  font-weight: 400 !important;
  line-height: 130% !important;
}

@media screen and (max-width: 768px) {
  .ProseMirror h1 * {
    font-size: 36px !important;
    font-weight: 600 !important;
    line-height: 130% !important;
  }

  .ProseMirror h2 * {
    font-size: 32px !important;
    font-weight: 500 !important;
    line-height: 130% !important;
  }

  .ProseMirror h3 * {
    font-size: 28px !important;
    font-weight: 500 !important;
    line-height: 130% !important;
  }

  .ProseMirror h4 * {
    font-size: 24px !important;
    font-weight: 400 !important;
    line-height: 130% !important;
  }

  .ProseMirror h5 * {
    font-size: 24px !important;
    font-weight: 400 !important;
    line-height: 130% !important;
  }
}

em {
  font-style: italic;
}

em * {
  font-style: italic;
}

.ProseMirror a {
  color: #409eff;
  text-decoration: underline;
  cursor: pointer;
}

.ProseMirror strong {
  font-weight: 700;
}

.ProseMirror b {
  font-weight: 700;
}

.ProseMirror mark {
  font-size: 100% !important;
}

.ProseMirror ul li div {
  min-width: 4px;
}

.ProseMirror blockquote {
  border-left: 4px solid #edf2fc;
  border-radius: 2px;
  color: #606266;
  margin: 8px 0;
  padding-left: 1em;
}

.ProseMirror .italic * {
  font-style: italic;
}

.ProseMirror .font-bold * {
  font-weight: 500 !important;
 }

.ProseMirror .underline * {
  text-decoration: underline;
}

.ProseMirror p {
  padding: 4px 0;
  min-height: 32px;
}

.ProseMirror p.placeholder:before {
  color: #adb5bd;
  content: attr(data-placeholder);
  float: left;
  height: 0;
  pointer-events: none;
}

.ProseMirror .youtube-embed {
  max-width: 100%;
  margin: auto;
}

.ProseMirror pre {
  background: #0d0d0d;
  color: #fff;
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  margin: 0.5rem;
}

.ProseMirror pre code {
  color: inherit;
  padding: 0;
  background: none;
  font-size: 0.8rem;
}

.ProseMirror pre .hljs-comment,
.ProseMirror pre .hljs-quote {
  color: #616161;
}

.ProseMirror pre .hljs-attribute,
.ProseMirror pre .hljs-link,
.ProseMirror pre .hljs-name,
.ProseMirror pre .hljs-regexp,
.ProseMirror pre .hljs-selector-class,
.ProseMirror pre .hljs-selector-id,
.ProseMirror pre .hljs-tag,
.ProseMirror pre .hljs-template-variable,
.ProseMirror pre .hljs-variable {
  color: #f98181;
}

.ProseMirror pre .hljs-built_in,
.ProseMirror pre .hljs-builtin-name,
.ProseMirror pre .hljs-literal,
.ProseMirror pre .hljs-meta,
.ProseMirror pre .hljs-number,
.ProseMirror pre .hljs-params,
.ProseMirror pre .hljs-type {
  color: #fbbc88;
}

.ProseMirror pre .hljs-bullet,
.ProseMirror pre .hljs-string,
.ProseMirror pre .hljs-symbol {
  color: #b9f18d;
}

.ProseMirror pre .hljs-section,
.ProseMirror pre .hljs-title {
  color: #faf594;
}

.ProseMirror pre .hljs-keyword,
.ProseMirror pre .hljs-selector-tag {
  color: #70cff8;
}

.ProseMirror pre .hljs-emphasis {
  font-style: italic;
}

.ProseMirror pre .hljs-strong {
  font-weight: 700;
}

.ProseMirror .tableWrapper {
  padding: 1rem 0;
  overflow-x: auto;
}

.ProseMirror .tableWrapper table .selectedCell:after {
  z-index: 2;
  position: absolute;
  content: '';
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(142, 162, 250, 0.4);
  pointer-events: none;
}

.ProseMirror .tableWrapper table .column-resize-handle {
  position: absolute;
  right: -2px;
  top: 0;
  bottom: -2px;
  width: 4px;
  background-color: #adf;
  pointer-events: none;
}

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

.ProseMirror table td,
.ProseMirror table th {
  position: relative;
  min-width: 1em;
  border-width: 1px;
  padding: 4px;
  vertical-align: top;
  box-sizing: border-box;
}

.ProseMirror table td > *,
.ProseMirror table th > * {
  margin-bottom: 0;
}

.ProseMirror table th {
  font-weight: 700;
  text-align: left;
  background-color: #f1f3f5;
}

.ProseMirror table p {
  margin: 0;
}

.columns {
  display: flex;
  flex-direction: row;
  grid-gap: 12px;
  gap: 12px;
  padding: 8px 0;
}

.column {
  border: 1px solid #f0f0f0;
  width: 100%;
  padding: 10px;
  border-radius: 4px;
}

.image-node {
  position: relative;
  display: flex;
  margin: 4px 0;
  color: #595a5c;
}

.image-node--start {
  justify-content: start;
}

.image-node--center {
  justify-content: center;
}

.image-node--end {
  justify-content: end;
}

.image-node__resize {
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  max-width: 100%;
}

.image-node__resize .end-resizer {
  cursor: ew-resize;
  height: 100%;
  width: 3px;
  position: absolute;
  right: 0;
  top: 0;
}

.image-node__resize .start-resizer {
  cursor: ew-resize;
  height: 100%;
  width: 3px;
  position: absolute;
  left: 0;
  top: 0;
}

.image-node__resize .bottom-resizer {
  cursor: ns-resize;
  height: 3px;
  width: 100%;
  position: absolute;
  right: 0;
  bottom: 0;
}

.image-node__resize .bottom-resizer:before,
.image-node__resize .end-resizer:before,
.image-node__resize .start-resizer:before {
  content: '';
  width: 16px;
  height: 16px;
  border-radius: 8px;
  border: 2px solid #3cb4e7;
  position: absolute;
  background: #fff;
  top: 50%;
  left: 50%;
  z-index: 1;
  transform: translate(-50%, -50%);
}

.image-node__resize .bottom-resizer.active,
.image-node__resize .bottom-resizer:hover,
.image-node__resize .end-resizer.active,
.image-node__resize .end-resizer:hover,
.image-node__resize .start-resizer.active,
.image-node__resize .start-resizer:hover {
  background: #3cb4e7;
}

.image-node__popover {
  position: absolute;
  z-index: 1;
  background: #fff;
  padding: 4px;
  margin-top: 8px;
  border: 1px solid #ebeef5;
  border-radius: 4px;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  display: flex;
  align-items: center;
  justify-items: center;
}

.image-node__empty {
  position: relative;
  background-color: #f0f2f5;
  width: 100%;
  height: 200px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  padding: 24px;
  grid-gap: 12px;
  gap: 12px;
  border-radius: 4px;
}

.image-node__empty .delete-image {
  position: absolute;
  top: 19px;
  right: 19px;
  padding: 5px;
  border-radius: 8px;
}

.image-node__empty .delete-image:focus {
  outline: none;
}

.image-node__empty .delete-image:hover {
  opacity: 0.5;
}

ul[data-type='taskList'] {
  list-style-type: none;
  margin-left: 24px;
  padding: 6px 0;
}

ul[data-type='taskList'] li {
  display: flex;
  align-items: center;
}

ul[data-type='taskList'] li label {
  height: 100%;
  display: flex;
  align-items: center;
}

ul[data-type='taskList'] li[data-checked='true'] p {
  text-decoration: line-through;
  color: grey;
}

ul[data-type='taskList'] li input[type='checkbox'] {
  margin-right: 10px;
  pointer-events: none !important;
}

.table-cell-setting-node {
  position: relative;
  background: #fff;
  padding: 4px 0;
  color: rgba(0, 0, 0, 0.8);
  overflow: hidden;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}

.table-cell-setting-node__item .el-divider--horizontal {
  margin: 4px 0;
}

.table-cell-setting-node__button {
  display: flex;
  margin: 0;
  width: 100%;
  align-items: center;
  border-radius: 4px;
  grid-gap: 4px;
  gap: 4px;
  padding: 6px 12px;
}

.table-cell-setting-node__button > div {
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.table-cell-setting-node__button:hover {
  color: #3cb4e7;
  background: rgba(34, 186, 255, 0.08) !important;
}

.table-cell-setting-node__button:focus {
  outline: none;
}

.unorder-list-node .disc {
  list-style-type: none;
  margin-left: 24px;
  padding: 5px 0;
}

.unorder-list-node .disc li p:first-child:before {
  content: '\2022';
  margin-right: 5px;
}

.unorder-list-node .asterisk {
  list-style-type: none;
  margin-left: 24px;
  padding: 5px 0;
}

.unorder-list-node .asterisk li p:first-child:before {
  content: '\2217';
  margin-right: 5px;
}

.unorder-list-node .hyphen {
  list-style-type: none;
  margin-left: 24px;
  padding: 5px 0;
}

.unorder-list-node .hyphen li p:first-child:before {
  content: '\2043';
  margin-right: 5px;
}

.ordered-list-node .decimal {
  list-style-type: none;
  margin-left: 24px;
  padding: 5px 0;
}

.ordered-list-node .decimal li {
  counter-increment: list-counter;
}

.ordered-list-node .decimal li p:first-child:before {
  content: counter(list-counter) '. ';
  display: inline-block;
  margin-right: 5px;
}

.ordered-list-node .alpha {
  list-style-type: none;
  margin-left: 24px;
  padding: 5px 0;
}

.ordered-list-node .alpha li {
  counter-increment: list-counter-alpha;
}

.ordered-list-node .alpha li p:first-child:before {
  content: counter(list-counter-alpha, upper-alpha) '. ';
  display: inline-block;
  margin-right: 5px;
}

.ordered-list-node .roman {
  list-style-type: none;
  margin-left: 24px;
  padding: 5px 0;
}

.ordered-list-node .roman li {
  counter-increment: list-counter-roman;
}

.ordered-list-node .roman li p:first-child:before {
  content: counter(list-counter-roman, upper-roman) '. ';
  display: inline-block;
  margin-right: 5px;
}

.code-block-low-light-node[data-v-d4aaa85c] {
  position: relative;
  padding: 8px 0;
}

.code-block-low-light-node select[data-v-d4aaa85c] {
  position: absolute;
  top: 12px;
  right: 8px;
}

.tiptap-node-empty-state[data-v-f3c27274] {
  display: flex;
  align-items: center;
  flex-direction: column;
}

.tiptap-node-empty-state span[data-v-f3c27274] {
  margin-top: 8px;
  color: #989899;
}

.setting-sprint-node {
  color: #595a5c;
  padding: 12px;
  cursor: pointer;
}

.setting-sprint-node--not-display {
  display: none;
}

.setting-sprint-node__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.setting-sprint-node__header > span {
  font-size: 24px;
  font-weight: 500;
}

.setting-sprint-node__table {
  color: #595a5c;
}

.setting-sprint-node__table tr {
  border-bottom: 1px solid #dcdfe6;
  background: #f5f7fa;
}

.setting-sprint-node__table td.el-table_1_column_1 div {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.setting-sprint-node__table .date {
  display: flex;
  align-items: center;
  grid-gap: 4px;
  gap: 4px;
}

.setting-sprint-node__table .action {
  display: flex;
  align-items: center;
  height: 32px;
}

.panel-node {
  position: relative;
}

.panel-node.editable {
  cursor: pointer;
}

.panel-node__title-wrapper {
  display: flex;
  align-items: center;
}

.panel-node__title-wrapper--start {
  justify-content: flex-start;
}

.panel-node__title-wrapper--start > span,
.panel-node__title-wrapper--start input {
  border-radius: 8px 0 0 0;
}

.panel-node__title-wrapper--end {
  justify-content: flex-end;
}

.panel-node__title-wrapper--end > span,
.panel-node__title-wrapper--end input {
  border-radius: 0 8px 0 0;
}

.panel-node__title {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  /* background-color: #29b3e5; */
  padding: 4px 12px;
  color: #fff;
  cursor: text;
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
  min-width: 100px;
  z-index: 20;
}

.panel-node__title::-moz-placeholder {
  color: #fff;
  opacity: 0.5;
}

.panel-node__title:-ms-input-placeholder {
  color: #fff;
  opacity: 0.5;
}

.panel-node__title::placeholder {
  color: #fff;
  opacity: 0.5;
}

.panel-node__content {
  position: relative;
  padding: 8px;
  word-wrap: break-word;
  word-break: break-all;
}

.panel-node__content.placeholder:after {
  content: 'Nội dung...';
  position: absolute;
  top: 50%;
  left: 40px;
  transform: translate(-50%, -50%);
  opacity: 0.5;
}

.button-node {
  padding: 8px 12px;
  display: flex;
  align-items: center;
}

.button-node--start {
  justify-content: start;
}

.button-node--center {
  justify-content: center;
}

.button-node--end {
  justify-content: end;
}

.button-node__link {
  color: inherit !important;
  text-decoration: inherit !important;
}

.button-node__button {
  display: flex;
  align-items: center;
  position: relative;
  max-width: 100%;
  padding: 6px 20px;
}

.button-node__button:focus {
  outline: none;
}

.button-node__button--border-default {
  border-radius: 4px;
}

.button-node__button--border-sharp {
  border-radius: none;
}

.button-node__button--border-round {
  border-radius: 100px;
}

[dir='ltr'] .button-node__button__text {
  text-align: left;
}

[dir='rtl'] .button-node__button__text {
  text-align: right;
}

.button-node__button__text {
  position: relative;
  white-space: normal !important;
  word-break: break-word;
  word-wrap: break-word;
  cursor: text;
  min-width: 68px;
  min-height: 20px;
}

.button-node__button__text.placeholder:after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 68px;
  content: 'Nội dung...';
  opacity: 0.5;
}

.button-node__button__icon {
  margin-right: 8px;
}

.title-node {
  position: relative;
  display: flex;
  flex-direction: column;
  margin-bottom: 8px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.title-node__button {
  display: flex;
  align-items: center;
  grid-gap: 8px;
  gap: 8px;
  margin-bottom: 8px;
  border-radius: 8px;
  border: 1px solid #dcdfe6;
  color: #595a5c;
  padding: 6px 12px;
  outline: none;
}

.title-node__button span {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.title-node__button:hover {
  opacity: 0.5;
  background-color: transparent;
}

.title-node__content {
  position: relative;
  font-size: 28px;
  font-weight: 700;
  line-height: 36px;
}

.title-node__content.preview {
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
  cursor: text;
}

.title-node__content.preview.placeholder:after {
  content: '';
}

.title-node__content.placeholder:after {
  content: 'Tiêu đề bài viết';
  position: absolute;
  top: 0;
  opacity: 0.5;
}

.title-node__cover-image {
  margin-bottom: 8px;
  width: 100%;
  height: 250px;
  object-fit: cover;
}

.title-node__clear-cover {
  position: absolute;
  right: 16px;
  top: 16px;
  background-color: #f0f2f5;
  padding: 8px;
  border-radius: 8px;
  outline: none;
}

.title-node__clear-cover:hover {
  opacity: 0.5;
}

.title-node__wrapper .is-show-clear-cover {
  display: none;
}

.title-node__wrapper:hover .is-show-clear-cover {
  display: block;
}

.custom-button-node {
  align-items: center;
  justify-content: space-between;
  grid-gap: 16px;
  gap: 16px;
  color: #595a5c;
}

.custom-button-node,
.custom-button-node__item {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.custom-button-node__item .item-name {
  font-weight: 500;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.custom-button-node__item.alignment,
.custom-button-node__item.icon {
  align-items: center;
  flex-direction: row;
  justify-content: space-between;
}

.custom-button-node__item.icon > div {
  display: flex;
  align-items: center;
}

.custom-button-node__item.icon > div .el-switch {
  margin-left: 8px;
}

.custom-button-node__item .alignment__button {
  display: flex;
  justify-content: center;
  align-items: center;
  grid-gap: 4px;
  gap: 4px;
  border-radius: 4px;
  padding: 4px;
  background: #f5f7fa;
}

.custom-button-node__item .alignment__button button {
  margin: 0;
  border: none;
  padding: 6px;
  width: 28px;
  height: 28px;
  background: #f5f7fa;
}

.custom-button-node__item .alignment__button button.is-active {
  background: #e4f4fc;
}

.custom-button-node__item .slider {
  display: flex;
}

.custom-button-node__item .slider__button {
  display: flex;
  align-items: center;
}

.custom-button-node__item .slider__button span {
  font-weight: 400;
  margin-left: 8px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.custom-button-node__item .slider__button span:hover {
  color: #3cb4e7;
}

.custom-button-node__item .slider__button input {
  width: 48px;
  text-align: center;
}

.custom-button-node__item .slider__button .el-input {
  width: 48px;
}

.custom-button-node__item .slider .el-slider {
  width: 65%;
  margin-right: 16px;
}

.custom-button-node__item .style,
.custom-button-node__item .style-corner {
  display: flex;
  flex-direction: column;
}

.custom-button-node__item.size {
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: space-between;
}

.custom-button-node__item.size .el-select {
  max-width: 30%;
}

.custom-button-node__item.text {
  flex-direction: row;
  justify-content: space-between;
}

.custom-button-node__item.text > div {
  display: flex;
  align-items: center;
}

.custom-button-node__item.text .button-open {
  width: 28px;
  height: 28px;
  text-align: center;
}

.custom-button-node__item.text .button-open svg {
  margin: auto;
}

.custom-button-node__item.text .button-open div {
  width: 100%;
  height: 26px;
}

.custom-button-node__item.text .button-open div .underscore {
  margin-bottom: 4px;
  height: 4px;
  width: 100%;
  border-radius: 8px;
  background: linear-gradient(
    90deg,
    #00d1ff 19.49%,
    #0053f8 19.87%,
    #6c2cf9 50.04%,
    #e600fa 0,
    #fd900f 80.15%,
    #ebff00 80.21%
  );
}

.custom-button-node__item.text .button-open div .text {
  font-size: 14px;
  height: 14px;
}

.custom-button-emoji-picker {
  position: absolute;
  right: 5%;
  max-width: 296px;
  margin-top: 8px;
  padding: 4px 8px;
}

.custom-button-emoji-picker .emojis {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
}

.custom-button-emoji-picker .emojis button {
  font-size: 18px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  padding: 4px;
  border: none;
  outline: none;
  border-radius: 4px;
}

.custom-button-emoji-picker .emojis button:hover {
  background-color: #dcdfe6;
}

.custom-button-emoji-picker .emojis .el-tabs,
.custom-button-emoji-picker .emojis .el-tabs__header {
  width: 100%;
}

.custom-button-emoji-picker .emojis .el-tabs__content {
  width: 100%;
  height: 168px;
  overflow: auto;
}

.custom-panel-node {
  align-items: center;
  grid-gap: 16px;
  gap: 16px;
  color: #595a5c;
}

.custom-panel-node,
.custom-panel-node__item {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.custom-panel-node__item .item-name {
  font-weight: 500;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.custom-panel-node__item.alignment,
.custom-panel-node__item.panel-color {
  flex-direction: row;
  justify-content: space-between;
}

.custom-panel-node__item .alignment__button {
  display: flex;
  justify-content: center;
  align-items: center;
  grid-gap: 4px;
  gap: 4px;
  border-radius: 4px;
  padding: 4px;
  background: #f5f7fa;
}

.custom-panel-node__item .alignment__button button {
  margin: 0;
  border: none;
  padding: 6px;
  width: 28px;
  height: 28px;
  background: #f5f7fa;
}

.custom-panel-node__item .alignment__button button.is-active {
  background: #e4f4fc;
}

.custom-columns-node {
  display: flex;
  align-items: center;
  flex-direction: column;
  width: 100%;
  grid-gap: 16px;
  gap: 16px;
  color: #595a5c;
}

.custom-columns-node__item {
  display: flex;
  flex-direction: row;
  width: 100%;
  align-items: center;
  justify-content: space-between;
}

.custom-columns-node__item .item-name {
  font-weight: 500;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.custom-table-node {
  align-items: center;
  flex-direction: column;
  grid-gap: 16px;
  gap: 16px;
  color: #595a5c;
}

.custom-table-node,
.custom-table-node__item {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.custom-table-node__item .item-name {
  font-weight: 500;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.custom-table-node__item .select {
  display: flex;
  align-items: center;
  grid-gap: 4px;
  gap: 4px;
}

.custom-node-setting,
.custom-node-setting__container {
  display: flex;
  align-items: center;
  flex-direction: column;
}

.custom-node-setting__container {
  grid-gap: 8px;
  gap: 8px;
  width: 100%;
}

.custom-node-setting__header {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.custom-node-setting__header .title {
  color: #303133;
  font-weight: 500;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.custom-node-setting__header .title:first-letter {
  text-transform: uppercase;
}

.ProseMirror {
  position: relative;
  display: flex;
  flex-direction: column;
}

.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 [contenteditable='false'] {
  white-space: normal;
}

.ProseMirror [contenteditable='false'] [contenteditable='true'] {
  white-space: pre-wrap;
}

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

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

.ProseMirror-gapcursor {
  display: none;
  pointer-events: none;
  position: absolute;
  margin: 0;
}

.ProseMirror-gapcursor:after {
  content: '';
  display: block;
  position: absolute;
  top: -2px;
  width: 20px;
  border-top: 1px solid black;
  animation: ProseMirror-cursor-blink 1.1s steps(2, start) infinite;
}

@keyframes ProseMirror-cursor-blink {
  to {
    visibility: hidden;
  }
}

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

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

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

.ProseMirror-focused .ProseMirror-gapcursor {
  display: block;
}

.tippy-box[data-animation='fade'][data-state='hidden'] {
  opacity: 0;
}

ol.decimal {
  list-style-type: none;
  margin-left: 24px;
  padding: 5px 0;
}

ol.decimal li {
  counter-increment: list-counter;
}

ol.decimal li p:first-child::before {
  content: counter(list-counter) '. ';
  display: inline-block;
  margin-right: 5px;
}

ol.alpha {
  list-style-type: none;
  margin-left: 24px;
  padding: 5px 0;
}

ol.alpha li {
  counter-increment: list-counter-alpha;
}

ol.alpha li p:first-child::before {
  content: counter(list-counter-alpha, upper-alpha) '. ';
  display: inline-block;
  margin-right: 5px;
}

ol.roman {
  list-style-type: none;
  margin-left: 24px;
  padding: 5px 0;
}

ol.roman li {
  counter-increment: list-counter-roman;
}

ol.roman li p:first-child::before {
  content: counter(list-counter-roman, upper-roman) '. ';
  display: inline-block;
  margin-right: 5px;
}

ul.disc {
  list-style-type: none;
  margin-left: 24px;
  padding: 5px 0;
}

ul.disc li p:first-child::before {
  content: '\2022';
  margin-right: 5px;
}

.ProseMirror ul.disc li::before {
  content: '';
  margin-right: 0px;
}

.ProseMirror ul.asterisk li::before {
  content: '';
  margin-right: 0px;
}

.ProseMirror ul.hyphen li::before {
  content: '';
  margin-right: 0px;
}

ul.asterisk {
  list-style-type: none;
  margin-left: 24px;
  padding: 5px 0;
}

ul.asterisk li p:first-child::before {
  content: '\2217';
  margin-right: 5px;
}

ul.hyphen {
  list-style-type: none;
  margin-left: 24px;
  padding: 5px 0;
}

ul.hyphen li p:first-child::before {
  content: '\2043';
  margin-right: 5px;
}

/* Fix for nested list counter issue */
.ProseMirror ol > li {
  counter-increment: list-counter;
}

.ProseMirror ol ul li {
  counter-increment: none;
}

.ordered-list-node .decimal > li {
  counter-increment: list-counter;
}

.ordered-list-node .decimal ul li {
  counter-increment: none;
}

.ordered-list-node .alpha > li {
  counter-increment: list-counter-alpha;
}

.ordered-list-node .alpha ul li {
  counter-increment: none;
}

.ordered-list-node .roman > li {
  counter-increment: list-counter-roman;
}

.ordered-list-node .roman ul li {
  counter-increment: none;
}

.table-of-content-node {
  min-width: 56px;
  padding: 12px;
  border-radius: 8px;
  background: #f9f9f9;
  width: auto;
  margin: 8px 0px;
  padding-right: 0px;
}

.table-of-content-node__panel {
  float: left;
  height: 100%;
  border-right: 1px solid #dcdfe6;
  padding: 16px;
  width: 56px;
  transition: width 0.5s;
}

.table-of-content-node__panel.is-open {
  width: 100%;
}

.table-of-content-node__header {
  display: flex;
  align-items: center;
  gap: 8px;
}

.table-of-content-node__header > span {
  font-weight: 500;
  color: #303133;
}

.table-of-content-node__open-button {
  outline: none;
  width: 24px;
  height: 36px;
  color: #989899;
  display: flex;
  align-items: center;
}

.table-of-content-node__open-button:focus {
  outline: none;
}

.table-of-content-node__body {
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-items: flex-start;
  max-height: 350px;
  overflow-y: scroll;
}

.table-of-content-node__body .child {
  cursor: pointer;
  /* white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
    */
  width: 100%;
  margin-top: 12px;
  font-size: 15px;
}

.table-of-content-node__body .child::before {
  content: '\2022';
  margin-right: 4px;
}

.table-of-content-node__body .child:hover {
  opacity: 0.6;
}

.table-of-content-node__body .level-1 {
  padding-left: 0;
  font-weight: bold;
}

.table-of-content-node__title {
  font-weight: bold;
}

.table-of-content-node__body .level-1.is-active {
  color: #3cb4e7;
}

.table-of-content-node__body .level-2 {
  padding-left: 8px;
  font-weight: bold;
}

html[lang='ja'] .table-of-content-node__body .level-2 {
  display: block !important;
}

.table-of-content-node__body .level-2.is-active {
  color: #3cb4e7;
}

.table-of-content-node__body .level-3 {
  padding-left: 16px;
}

.table-of-content-node__body .level-3.is-active {
  color: #3cb4e7;
}

.table-of-content-node__body .level-4 {
  padding-left: 24px;
}

.table-of-content-node__body .level-4.is-active {
  color: #3cb4e7;
}

.table-of-content-node__body .level-5 {
  padding-left: 32px;
}

.table-of-content-node__body .level-5.is-active {
  color: #3cb4e7;
}

.table-of-content-node__body {
  display: flex;
  flex-direction: column;
}

.wrap-content-node {
  margin: 36px 0;
}

.ProseMirror img {
  margin: 24px 0;
}

/* Fix for nested list counter issue */
.ProseMirror ol > li {
  counter-increment: list-counter;
}

.ProseMirror ol ul li {
  counter-increment: none;
}

.ordered-list-node .decimal > li {
  counter-increment: list-counter;
}

.ordered-list-node .decimal ul li {
  counter-increment: none;
}

.ordered-list-node .alpha > li {
  counter-increment: list-counter-alpha;
}

.ordered-list-node .alpha ul li {
  counter-increment: none;
}

.ordered-list-node .roman > li {
  counter-increment: list-counter-roman;
}

.ordered-list-node .roman ul li {
  counter-increment: none;
}

.force-font p, 
.force-font p span {
    font-family: 'PP-Neue Montreal', sans-serif !important;
    font-size: 20px !important;
    line-height: 130% !important;
    color: #565656 !important;
    font-weight: 400 !important;;
}

.force-font ul span {
    color: #111 !important;
}