/**
 * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
 * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
 */
:root, :host {
  --ck-suggestion-marker-insertion-border-color: var(--ck-color-suggestion-marker-insertion-border, var(--ck-color-diff-insertion-border, #119c6780));
  --ck-suggestion-marker-insertion-active-border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-color-diff-insertion-border-active, #119c6799));
  --ck-suggestion-marker-insertion-background-color: var(--ck-color-suggestion-marker-insertion-background, var(--ck-color-diff-insertion-background, #119c6733));
  --ck-suggestion-marker-insertion-active-background-color: var(--ck-color-suggestion-marker-insertion-background-active, var(--ck-color-diff-insertion-background-active, #119c674d));
  --ck-suggestion-marker-deletion-border-color: var(--ck-color-suggestion-marker-deletion-border, var(--ck-color-diff-deletion-border, #e0292966));
  --ck-suggestion-marker-deletion-active-border-color: var(--ck-color-suggestion-marker-deletion-border-active, var(--ck-color-diff-deletion-border-active, #e0292980));
  --ck-suggestion-marker-deletion-background-color: var(--ck-color-suggestion-marker-deletion-background, var(--ck-color-diff-deletion-background, #e0292933));
  --ck-suggestion-marker-deletion-active-background-color: var(--ck-color-suggestion-marker-deletion-background-active, var(--ck-color-diff-deletion-background-active, #e029294d));
  --ck-suggestion-marker-deletion-stroke-color: var(--ck-color-suggestion-marker-deletion-stroke, var(--ck-color-diff-deletion-stroke, #c01b1b99));
  --ck-suggestion-marker-format-border-color: var(--ck-color-suggestion-marker-format-border, var(--ck-color-diff-format-border, #99d7e6));
  --ck-suggestion-marker-format-active-border-color: var(--ck-color-suggestion-marker-format-border-active, var(--ck-color-diff-format-border-active, #5cc0d6));
  --ck-suggestion-widget-insertion-background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-color-diff-insertion-widget-background, #66e5770d));
  --ck-suggestion-widget-insertion-active-background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-color-diff-insertion-widget-background-active, #25da3d12));
  --ck-suggestion-widget-deletion-background-color: var(--ck-color-suggestion-widget-deletion-background, var(--ck-color-diff-deletion-widget-background, #e566860d));
  --ck-suggestion-widget-deletion-active-background-color: var(--ck-color-suggestion-widget-deletion-background-active, var(--ck-color-diff-deletion-widget-background-active, #c4214a12));
  --ck-suggestion-widget-format-background-color: var(--ck-color-suggestion-widget-format-background, var(--ck-color-diff-format-widget-background, #0aa0c217));
  --ck-suggestion-widget-format-active-background-color: var(--ck-color-suggestion-widget-format-background-active, var(--ck-color-diff-format-widget-background-active, #0aa0c229));
  --ck-suggestion-widget-th-insertion-background-color: var(--ck-color-suggestion-widget-th-insertion-background, var(--ck-color-diff-insertion-widget-th-background, #66e5771f));
  --ck-suggestion-widget-th-insertion-active-background-color: var(--ck-color-suggestion-widget-th-insertion-background-active, var(--ck-color-diff-insertion-widget-th-background-active, #25da3d24));
  --ck-suggestion-widget-th-deletion-background-color: var(--ck-color-suggestion-widget-th-deletion-background, var(--ck-color-diff-deletion-widget-th-background, #e5668624));
  --ck-suggestion-widget-th-deletion-active-background-color: var(--ck-color-suggestion-widget-th-deletion-background-active, var(--ck-color-diff-deletion-widget-th-background-active, #c4214a29));
}

.ck-content .ck-suggestion-marker-insertion {
  border-top: 3px solid var(--ck-suggestion-marker-insertion-border-color);
  border-bottom: 3px solid var(--ck-suggestion-marker-insertion-border-color);
  background: var(--ck-suggestion-marker-insertion-background-color);

  &.ck-suggestion-marker--active {
    border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-suggestion-marker-insertion-active-border-color));
    background: var(--ck-color-suggestion-marker-insertion-background-active, var(--ck-suggestion-marker-insertion-active-background-color));
  }

  &.ck-widget {
    border: 3px solid var(--ck-suggestion-marker-insertion-border-color);
    background: none;
    text-decoration: none;

    &.ck-suggestion-marker--active {
      border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-suggestion-marker-insertion-active-border-color));
    }
  }
}

.ck-content .ck-suggestion-marker-deletion {
  border-top: 3px solid var(--ck-suggestion-marker-deletion-border-color);
  border-bottom: 3px solid var(--ck-suggestion-marker-deletion-border-color);
  text-decoration: line-through;
  text-decoration-color: var(--ck-suggestion-marker-deletion-stroke-color);
  background: var(--ck-suggestion-marker-deletion-background-color);
  text-decoration-thickness: 3px;

  &.ck-suggestion-marker--active {
    border-color: var(--ck-suggestion-marker-deletion-active-border-color);
    background: var(--ck-suggestion-marker-deletion-active-background-color);
  }

  &.ck-widget {
    border: 3px solid var(--ck-suggestion-marker-deletion-border-color);
    background: none;
    text-decoration: none;

    &.ck-suggestion-marker--active {
      border-color: var(--ck-suggestion-marker-deletion-active-border-color);
    }
  }
}

.ck-content .ck-suggestion-marker-merge {
  &:after {
    border-top: 3px solid var(--ck-suggestion-marker-deletion-border-color);
    border-bottom: 3px solid var(--ck-suggestion-marker-deletion-border-color);
    text-decoration: line-through;
    text-decoration-color: var(--ck-suggestion-marker-deletion-stroke-color);
    background: var(--ck-suggestion-marker-deletion-background-color);
    color: var(--ck-suggestion-marker-deletion-stroke-color);
    content: "¶";
  }

  &.ck-suggestion-marker--active:after {
    border-color: var(--ck-suggestion-marker-deletion-active-border-color);
    background: var(--ck-suggestion-marker-deletion-active-background-color);
  }
}

.ck-content .ck-suggestion-marker-split {
  &:after {
    border-top: 3px solid var(--ck-suggestion-marker-insertion-border-color);
    border-bottom: 3px solid var(--ck-suggestion-marker-insertion-border-color);
    background: var(--ck-suggestion-marker-insertion-background-color);
    color: var(--ck-suggestion-marker-insertion-border-color);
    content: "¶";
  }

  &.ck-suggestion-marker--active:after {
    border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-suggestion-marker-insertion-active-border-color));
    background: var(--ck-color-suggestion-marker-insertion-background-active, var(--ck-suggestion-marker-insertion-active-background-color));
  }
}

.ck-content .ck-suggestion-marker-formatInline {
  border-top: 3px solid var(--ck-color-suggestion-marker-format-border, var(--ck-suggestion-marker-format-border-color));
  border-bottom: 3px solid var(--ck-color-suggestion-marker-format-border, var(--ck-suggestion-marker-format-border-color));

  &.ck-suggestion-marker--active {
    border-color: var(--ck-color-suggestion-marker-format-border-active, var(--ck-suggestion-marker-format-active-border-color));
  }

  &.ck-widget {
    border: 3px solid var(--ck-color-suggestion-marker-format-border, var(--ck-suggestion-marker-format-border-color));
    background: none;

    &.ck-suggestion-marker--active {
      border-color: var(--ck-color-suggestion-marker-format-border-active, var(--ck-suggestion-marker-format-active-border-color));
    }
  }
}

.ck-content .ck-suggestion-marker-formatBlock {
  box-shadow: -7px 0 0 0 var(--ck-color-base-background), -10px 0 0 0 var(--ck-color-suggestion-marker-format-border, var(--ck-suggestion-marker-format-border-color));
  background: none;
  border: 0;

  &.ck-suggestion-marker--active {
    box-shadow: -5px 0 0 0 var(--ck-color-base-background), -8px 0 0 0 var(--ck-color-suggestion-marker-format-border-active, var(--ck-suggestion-marker-format-active-border-color));
  }
}

.ck-content ul .ck-suggestion-marker-formatBlock, .ck-content ol .ck-suggestion-marker-formatBlock {
  box-shadow: -2px 0 0 0 var(--ck-color-base-background), -5px 0 0 0 var(--ck-color-suggestion-marker-format-border, var(--ck-suggestion-marker-format-border-color));

  &.ck-suggestion-marker--active {
    box-shadow: -2px 0 0 0 var(--ck-color-base-background), -5px 0 0 0 var(--ck-color-suggestion-marker-format-border-active, var(--ck-suggestion-marker-format-active-border-color));
  }
}

.ck-content .ck-widget.image > figcaption {
  &.ck-suggestion-marker-deletion {
    background-color: var(--ck-suggestion-widget-deletion-background-color);
    border: none;

    &.ck-suggestion-marker--active {
      background-color: var(--ck-suggestion-widget-deletion-active-background-color);
    }
  }

  &.ck-suggestion-marker-insertion {
    background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));
    border: none;

    &.ck-suggestion-marker--active {
      background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
    }
  }
}

.ck-content .ck-suggestion-marker-deletion.ck-widget.image {
  background-color: var(--ck-suggestion-widget-deletion-background-color);

  & img {
    opacity: .6;
  }

  & figcaption {
    background-color: var(--ck-suggestion-widget-deletion-background-color);
  }

  &.ck-suggestion-marker--active {
    background-color: var(--ck-suggestion-widget-deletion-active-background-color);

    & figcaption {
      background-color: var(--ck-suggestion-widget-deletion-active-background-color);
    }
  }
}

.ck-content .ck-suggestion-marker-insertion.ck-widget.image {
  background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));

  & figcaption {
    background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));
  }

  &.ck-suggestion-marker--active {
    background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));

    & figcaption {
      background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
    }
  }
}

.ck-content .ck-suggestion-marker-deletion.ck-widget.ck-horizontal-line {
  background-color: var(--ck-suggestion-widget-deletion-background-color);

  &.ck-suggestion-marker--active {
    background-color: var(--ck-suggestion-widget-deletion-active-background-color);
  }
}

.ck-content .ck-suggestion-marker-insertion.ck-widget.ck-horizontal-line {
  background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));

  &.ck-suggestion-marker--active {
    background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
  }
}

.ck-content .ck-suggestion-marker-deletion.ck-widget.media {
  background-color: var(--ck-suggestion-widget-deletion-background-color);

  & .ck-media__wrapper {
    opacity: .6;
  }

  &.ck-suggestion-marker--active {
    background-color: var(--ck-suggestion-widget-deletion-active-background-color);
  }
}

.ck-content .ck-suggestion-marker-insertion.ck-widget.media {
  background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));

  &.ck-suggestion-marker--active {
    background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
  }
}

.ck-content .ck-suggestion-marker.ck-widget.ck-merge-field, .ck-content .ck-comment-marker.ck-widget.ck-merge-field {
  border-width: 2px medium;
  border-left-style: none;
  border-left-color: currentColor;
  border-right-style: none;
  border-right-color: currentColor;
  padding-top: 0;
  padding-bottom: 0;
}

.ck-content .ck-suggestion-marker-deletion.ck-widget.ck-merge-field {
  border-top-color: var(--ck-suggestion-marker-deletion-border-color);
  border-bottom-color: var(--ck-suggestion-marker-deletion-border-color);
  background: var(--ck-suggestion-marker-deletion-background-color);

  & :not(.ck-merge-field__affix), &.ck-merge-field_with-value, &.ck-merge-field_with-warning {
    text-decoration: line-through;
    text-decoration-color: var(--ck-suggestion-marker-deletion-stroke-color);
    text-decoration-thickness: 3px;
  }

  &.ck-suggestion-marker--active {
    background-color: var(--ck-suggestion-marker-deletion-active-background-color);
  }
}

.ck-content .ck-suggestion-marker-insertion.ck-widget.ck-merge-field {
  background-color: var(--ck-suggestion-marker-insertion-background-color);

  &.ck-suggestion-marker--active {
    background-color: var(--ck-color-suggestion-marker-insertion-background-active, var(--ck-suggestion-marker-insertion-active-background-color));
  }
}

.ck-content .ck-comment-marker.ck-widget.ck-merge-field {
  background: var(--ck-color-comment-marker, var(--ck-comment-marker-color));

  &.ck-comment-marker--active {
    background: var(--ck-color-comment-marker-active, var(--ck-comment-marker-active-color));
  }
}

.ck-content span.ck-comment-marker:has( + .ck-comment-marker.ck-widget.ck-merge-field), .ck-content span.ck-suggestion-marker:has( + .ck-suggestion-marker.ck-widget.ck-merge-field) {
  margin-right: -1px;
  padding-right: 1px;
}

.ck-content .ck-suggestion-marker-deletion.ck-widget.page-break {
  background-color: var(--ck-suggestion-widget-deletion-background-color);

  &.ck-suggestion-marker--active {
    background-color: var(--ck-suggestion-widget-deletion-active-background-color);
  }
}

.ck-content .ck-suggestion-marker-insertion.ck-widget.page-break {
  background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));

  &.ck-suggestion-marker--active {
    background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
  }
}

.ck-content figure.table .ck-suggestion-marker-formatBlock {
  box-shadow: -3px 0 0 0 var(--ck-color-suggestion-marker-format-border, var(--ck-suggestion-marker-format-border-color));

  &.ck-suggestion-marker--active {
    box-shadow: -3px 0 0 0 var(--ck-color-suggestion-marker-format-border-active, var(--ck-suggestion-marker-format-active-border-color));
  }
}

.ck-content .ck-widget.table {
  & > figcaption, & > table > caption {
    &.ck-suggestion-marker-deletion {
      background-color: var(--ck-suggestion-widget-deletion-background-color);
      border: none;

      &.ck-suggestion-marker--active {
        background-color: var(--ck-suggestion-widget-deletion-active-background-color);
      }
    }

    &.ck-suggestion-marker-insertion {
      background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));
      border: none;

      &.ck-suggestion-marker--active {
        background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
      }
    }
  }
}

.ck-content .ck-suggestion-marker-insertion.table {
  border-color: var(--ck-suggestion-marker-insertion-border-color);

  & > figcaption, & > table > caption {
    background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));
  }

  & > table {
    & > tbody > tr > th, & > thead > tr > th {
      background-color: var(--ck-color-suggestion-widget-th-insertion-background, var(--ck-suggestion-widget-th-insertion-background-color));
      border-color: var(--ck-suggestion-marker-insertion-border-color);
    }

    & > tbody > tr > td {
      background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));
      border-color: var(--ck-suggestion-marker-insertion-border-color);
    }
  }
}

.ck-content .ck-suggestion-marker-insertion.ck-suggestion-marker--active.table {
  border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-suggestion-marker-insertion-active-border-color));

  & > figcaption, & > table > caption {
    background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
  }

  & > table {
    & > tbody > tr > th, & > thead > tr > th {
      background-color: var(--ck-color-suggestion-widget-th-insertion-background-active, var(--ck-suggestion-widget-th-insertion-active-background-color));
      border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-suggestion-marker-insertion-active-border-color));
    }

    & > tbody > tr > td {
      background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
      border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-suggestion-marker-insertion-active-border-color));
    }
  }
}

.ck-content .ck-suggestion-marker-deletion.ck-widget.table {
  border-color: var(--ck-suggestion-marker-deletion-border-color);

  & > figcaption, & > table > caption {
    background-color: var(--ck-suggestion-widget-deletion-background-color);
  }

  & > table {
    & > tbody > tr > th, & > thead > tr > th {
      background-color: var(--ck-color-suggestion-widget-th-deletion-background, var(--ck-suggestion-widget-th-deletion-background-color));
      border-color: var(--ck-suggestion-marker-deletion-border-color);
      text-decoration: none;
    }

    & > tbody > tr > td {
      background-color: var(--ck-suggestion-widget-deletion-background-color);
      border-color: var(--ck-suggestion-marker-deletion-border-color);
      text-decoration: none;
    }
  }
}

.ck-content .ck-suggestion-marker-deletion.ck-suggestion-marker--active.table {
  border-color: var(--ck-suggestion-marker-deletion-active-border-color);

  & > figcaption, & > table > caption {
    background-color: var(--ck-suggestion-widget-deletion-active-background-color);
  }

  & > table {
    & > tbody > tr > th, & > thead > tr > th {
      background-color: var(--ck-color-suggestion-widget-th-deletion-background-active, var(--ck-suggestion-widget-th-deletion-active-background-color));
      border-color: var(--ck-suggestion-marker-deletion-active-border-color);
    }

    & > tbody > tr > td {
      background-color: var(--ck-suggestion-widget-deletion-active-background-color);
      border-color: var(--ck-suggestion-marker-deletion-active-border-color);
    }
  }
}

.ck-content .table {
  & th.ck-suggestion-marker-insertion {
    background-color: var(--ck-color-suggestion-widget-th-insertion-background, var(--ck-suggestion-widget-th-insertion-background-color));

    &.ck-suggestion-marker--active {
      background-color: var(--ck-color-suggestion-widget-th-insertion-background-active, var(--ck-suggestion-widget-th-insertion-active-background-color));
    }
  }

  & th.ck-suggestion-marker-deletion {
    background-color: var(--ck-color-suggestion-widget-th-deletion-background, var(--ck-suggestion-widget-th-deletion-background-color));
    text-decoration: none;

    &.ck-suggestion-marker--active {
      background-color: var(--ck-color-suggestion-widget-th-deletion-background-active, var(--ck-suggestion-widget-th-deletion-active-background-color));
    }
  }

  & td.ck-suggestion-marker-insertion {
    background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));

    &.ck-suggestion-marker--active {
      background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
    }
  }

  & td.ck-suggestion-marker-deletion {
    background-color: var(--ck-suggestion-widget-deletion-background-color);
    text-decoration: none;

    &.ck-suggestion-marker--active {
      background-color: var(--ck-suggestion-widget-deletion-active-background-color);
    }
  }

  & th.ck-suggestion-marker-formatInline, & td.ck-suggestion-marker-formatInline, & th.ck-suggestion-marker-formatBlock, & td.ck-suggestion-marker-formatBlock {
    background-color: var(--ck-color-suggestion-widget-format-background, var(--ck-suggestion-widget-format-background-color));
    box-shadow: none;

    &.ck-suggestion-marker--active {
      background-color: var(--ck-color-suggestion-widget-format-background-active, var(--ck-suggestion-widget-format-active-background-color));
      box-shadow: none;
    }
  }
}

.ck-content pre > code.ck-suggestion-marker-formatBlock {
  box-shadow: -7px 0 0 0 #ededed, -10px 0 0 0 var(--ck-color-suggestion-marker-format-border, var(--ck-suggestion-marker-format-border-color));
  display: block;

  &.ck-suggestion-marker--active {
    box-shadow: -5px 0 0 0 #ededed, -8px 0 0 0 var(--ck-color-suggestion-marker-format-border-active, var(--ck-suggestion-marker-format-active-border-color));
  }
}

.ck-content .ck-suggestion-marker-deletion.ck-widget.footnotes-wrapper {
  background-color: var(--ck-suggestion-widget-deletion-background-color);

  &.ck-suggestion-marker--active {
    background-color: var(--ck-suggestion-widget-deletion-active-background-color);
  }
}

.ck-content .ck-suggestion-marker-insertion.ck-widget.footnotes-wrapper {
  background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));

  &.ck-suggestion-marker--active {
    background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
  }
}

:root, :host {
  --ck-comment-marker-color: #fdecc3;
  --ck-comment-marker-active-color: #fbd988;
}

.ck-content .ck-comment-marker {
  background: var(--ck-color-comment-marker, var(--ck-comment-marker-color));
  border-top: 3px solid #0000;
  border-bottom: 3px solid #0000;

  &.ck-widget {
    border: 3px solid var(--ck-color-comment-marker, var(--ck-comment-marker-color));
    background-color: #0000;
  }
}

.ck-content .ck-comment-marker--active {
  background: var(--ck-color-comment-marker-active, var(--ck-comment-marker-active-color));

  & .ck-comment-marker {
    background: var(--ck-color-comment-marker-active, var(--ck-comment-marker-active-color));
  }

  &.ck-widget {
    border-color: var(--ck-color-comment-marker-active, var(--ck-comment-marker-active-color));

    & .ck-comment-marker {
      background-color: var(--ck-color-comment-marker, var(--ck-comment-marker-color));
    }
  }
}

:root, :host {
  --ck-content-table-of-contents-padding: 1em;
  --ck-content-table-of-contents-line-height: 1.5;
  --ck-content-table-of-contents-items-start-padding: 24px;
}

.ck-content {
  & .table-of-contents {
    margin: .9em auto;

    &.table-of-contents_empty {
      display: none;
    }

    & .table-of-contents__placeholder {
      padding: var(--ck-content-table-of-contents-padding);
      margin: 0;
      font-style: italic;
    }

    & > ol {
      padding: var(--ck-content-table-of-contents-padding);
    }

    & ol {
      line-height: var(--ck-content-table-of-contents-line-height);
      margin: 0;
      list-style-type: none;

      & ol {
        padding-inline-start: var(--ck-content-table-of-contents-items-start-padding);
      }

      & li {
        white-space: nowrap;
        text-overflow: ellipsis;
        cursor: default;
        overflow: hidden;
      }
    }
  }
}

:root, :host {
  --ck-content-footnotes-list-background-color: none;
  --ck-content-footnotes-list-separator-color: #000;
  --ck-content-footnote-font-size: var(--ck-content-font-size-small);
}

.ck-content {
  & .footnote {
    margin-inline-end: .2em;
  }

  & .footnotes {
    font-size: var(--ck-content-footnote-font-size);
    background-color: var(--ck-content-footnotes-list-background-color);
    margin: .9em 0 1.5em;
    position: relative;
  }

  & .footnotes-divider {
    border: none;
    border-top: 1px solid var(--ck-content-footnotes-list-separator-color);
    background: none;
    width: min(30%, 350px);
    height: 1px;
    margin: 0 0 1em;
    display: block;

    [dir="rtl"] & {
      margin-left: auto;
      margin-right: 0;
    }
  }

  & .footnotes-list {
    margin: 0;
    padding-inline-start: 3em;
  }

  & .footnote-backlink {
    -webkit-user-select: none;
    user-select: none;
    vertical-align: top;
    width: auto;
    margin-inline-end: 1ch;
    display: inline-block;
  }

  & .footnote-content {
    vertical-align: top;
    width: calc(100% - 2em);
    padding: 0 4px;
    display: inline-block;

    & > p:first-of-type {
      margin-top: 0;
    }

    & > p:last-of-type {
      margin-bottom: 0;
    }

    & ol {
      list-style-type: decimal;
    }

    & ol ol {
      list-style-type: lower-latin;
    }

    & ol ol ol {
      list-style-type: lower-roman;
    }

    & ol ol ol ol {
      list-style-type: upper-latin;
    }

    & ol ol ol ol ol {
      list-style-type: upper-roman;
    }
  }
}

.ck-content .line-height-single {
  line-height: 1;
}

.ck-content .line-height-double {
  line-height: 2;
}

:root, :host {
  --ck-content-list-marker-line-height: var(--ck-content-line-height);
}

.ck-content .todo-list {
  & li.ck-list-marker-line-height {
    &:before {
      line-height: var(--ck-content-list-marker-line-height);
      content: "";
    }

    & > .todo-list__label.todo-list__label_without-description {
      width: 0;
      line-height: var(--ck-content-list-marker-line-height);
      position: absolute;

      & input[type="checkbox"] {
        margin: 0;
        position: relative;
      }
    }
  }
}

.ck-content .multi-level-list {
  list-style: none;

  & li {
    position: relative;

    & .multi-level-list__marker {
      pointer-events: none;

      &::selection {
        background-color: #0000;
      }

      &:not(:has(span)) {
        padding-inline-end: 5px;
        position: absolute;
        transform: translate(-100%);
      }

      &:has(span) {
        text-wrap: nowrap;
        width: 0;
        display: inline-block;
        position: relative;

        &:before, & > span {
          padding-inline-end: 5px;
          position: absolute;
          transform: translate(-100%);
        }
      }
    }

    &.ck-list-marker-bold > .multi-level-list__marker, &.ck-list-marker-bold > * > .multi-level-list__marker {
      font-weight: bold;
    }

    &.ck-list-marker-italic > .multi-level-list__marker, &.ck-list-marker-italic > * > .multi-level-list__marker {
      font-style: italic;
    }

    &.ck-list-marker-color > .multi-level-list__marker, &.ck-list-marker-color > * > .multi-level-list__marker {
      color: var(--ck-content-list-marker-color);
    }

    &.ck-list-marker-font-family > .multi-level-list__marker, &.ck-list-marker-font-family > * > .multi-level-list__marker {
      font-family: var(--ck-content-list-marker-font-family);
    }

    &.ck-list-marker-font-size > .multi-level-list__marker, &.ck-list-marker-font-size > * > .multi-level-list__marker {
      font-size: var(--ck-content-list-marker-font-size);
    }

    &.ck-list-marker-font-size-tiny > .multi-level-list__marker, &.ck-list-marker-font-size-tiny > * > .multi-level-list__marker {
      font-size: var(--ck-content-font-size-tiny);
    }

    &.ck-list-marker-font-size-small > .multi-level-list__marker, &.ck-list-marker-font-size-small > * > .multi-level-list__marker {
      font-size: var(--ck-content-font-size-small);
    }

    &.ck-list-marker-font-size-big > .multi-level-list__marker, &.ck-list-marker-font-size-big > * > .multi-level-list__marker {
      font-size: var(--ck-content-font-size-big);
    }

    &.ck-list-marker-font-size-huge > .multi-level-list__marker, &.ck-list-marker-font-size-huge > * > .multi-level-list__marker {
      font-size: var(--ck-content-font-size-huge);
    }
  }
}

.ck-content[dir="rtl"] .multi-level-list {
  & li {
    & .multi-level-list__marker {
      &:not(:has(span)), &:before, & > span {
        transform: translate(100%);
      }
    }
  }
}

.ck-content {
  & .ck-suggestion-preview-marker, & .ck-suggestion-preview-marker-split {
    opacity: .75;
  }

  & .ck-suggestion-preview-marker-split:after {
    content: "¶";
  }

  & .ck-suggestion-preview-marker-merge {
    opacity: .75;
    text-decoration: line-through;
  }

  & .ck-suggestion-preview-marker-merge:after {
    content: "¶";
  }

  & .ck-suggestion-preview-marker-deletion {
    text-decoration: line-through;
  }

  & .ck-suggestion-marker-deletion-new:not(.ck-widget), & .ck-suggestion-marker-merge-new {
    --ck-suggestion-marker-deletion-border-color: none;
    --ck-suggestion-marker-deletion-active-border-color: none;
    --ck-suggestion-marker-deletion-background-color: none;
    --ck-suggestion-marker-deletion-active-background-color: none;
    --ck-suggestion-marker-deletion-stroke-color: #7a1f36cc;
    --ck-suggestion-widget-deletion-background-color: #e5668608;
    --ck-suggestion-widget-deletion-active-background-color: #c4214a0d;
  }

  & .ck-suggestion-marker-merge-new:after {
    color: inherit;
  }

  & .ck-suggestion-marker-insertion-new, & .ck-suggestion-marker-split-new {
    opacity: .75;
  }

  & .ck-suggestion-marker-deletion-new.ck-suggestion-marker--active:not(.table), & .ck-suggestion-marker-merge-new.ck-suggestion-marker--active {
    --ck-suggestion-marker-deletion-active-background-color: #da255214;
    --ck-suggestion-marker-deletion-stroke-color: #7a1f36;
    opacity: 1;
  }

  & .ck-suggestion-marker-insertion-new.ck-suggestion-marker--active, & .ck-suggestion-marker-split-new.ck-suggestion-marker--active {
    opacity: 1;
  }
}
