.editor-window {
  padding: 30px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  color: var(--fg);
}

.editor-window .image-tool {
  --bg-color: var(--surface);
  --border-color: var(--surface);
}

.editor-window .ce-popover {
  --color-border: var(--line);
  --color-shadow: var(--shadow);
  --color-background: var(--bg);
  --color-text-primary: var(--fg);
  --color-text-secondary: var(--muted);
  --color-background-item-hover: var(--surface);
  --color-background-item-focus: var(--surface);
  --color-background-icon-active: var(--surface);
}

.editor-window .ce-toolbar__plus,
.editor-window .ce-toolbar__settings-btn,
.editor-window .ce-inline-tool-input,
.editor-window .cdx-input,
.editor-window .cdx-search-field,
.editor-window .cdx-search-field__input,
.editor-window .cdx-list-start-with-field,
.editor-window .cdx-button {
  color: var(--fg);
  background: var(--bg);
  border-color: var(--line);
}

.editor-window .cdx-search-field__input {
  background: transparent;
}

.editor-window .ce-toolbar__plus:hover,
.editor-window .ce-toolbar__settings-btn:hover,
.editor-window .ce-toolbar__plus--active,
.editor-window .ce-toolbar__settings-btn--active,
.editor-window .ce-inline-tool:hover,
.editor-window .ce-inline-toolbar__dropdown:hover,
.editor-window .cdx-button:hover,
.editor-window .cdx-settings-button:hover {
  background: var(--surface);
}

.editor-window .codex-editor ::selection,
.editor-window .ce-block--selected .ce-block__content,
.editor-window .tc-row--selected,
.editor-window .tc-row--selected::after,
.editor-window .tc-cell--selected {
  background-color: color-mix(in srgb, var(--accent) 35%, var(--surface));
}

.editor-window .codex-editor [data-placeholder]:empty::before,
.editor-window .codex-editor [data-placeholder][data-empty="true"]::before,
.editor-window .codex-editor [data-placeholder-active]:empty::before,
.editor-window .codex-editor [data-placeholder-active][data-empty="true"]::before {
  color: var(--muted);
}

.editor-window .cdx-list {
  --checkbox-background: var(--bg);
  --color-border: var(--line);
}

.editor-window .image-tool--uploading .image-tool__image {
  background-color: var(--bg);
}

.editor-window .tc-wrap {
  --color-background: var(--surface);
  --color-text-secondary: var(--muted);
  --color-border: var(--line);
}

.editor-window .tc-toolbox {
  --toggler-dots-color: var(--muted);
  --toggler-dots-color-hovered: var(--fg);
}

.editor-window .tc-popover {
  --color-border: var(--line);
  --color-background: var(--bg);
  --color-background-hover: var(--surface);
}

.editor-window a {
  color: var(--accent);
}

.editor-error {
  margin: 24px;
  font-family: ui-sans-serif, system-ui, sans-serif;
}
