/* Jodit an die Night-Farben anpassen. Wirkt nur mit theme "dark" aus dem Night-Skript. */

body .jodit_theme_dark,
body .jodit-dialog_theme_dark {
  --color-border: var(--border);
  --color-text: var(--text);
  --color-icon: var(--muted);
  --color-panel: var(--surface-2);
  --color-placeholder: var(--muted);
  --color-background-default: var(--inset);
  --color-background-light-gray: var(--surface);
  --color-background-gray: var(--border);
  --color-background-gray-hover: var(--surface-2);
  --color-background-button-hover: rgba(62, 207, 255, 0.16);
  --color-button-background-hover: rgba(62, 207, 255, 0.16);
  --color-button-background-hover-opacity40: rgba(62, 207, 255, 0.24);
  --color-button-background-hover-opacity60: rgba(62, 207, 255, 0.32);
  --color-border-selected: var(--accent);
  --dark-background-color: var(--inset);
  --dark-background-ligher: var(--surface);
  --dark-background-darknes: var(--bg);
  --dark-border-color: var(--border);
  --dark-text-color: var(--text);
  --dark-text-color-opacity80: rgba(232, 238, 246, 0.8);
  --dark-text-color-opacity50: rgba(154, 166, 181, 0.9);
  --dark-icon-color: var(--muted);
  --dark-toolbar-color: var(--surface-2);
  --dark-toolbar-seperator-color1: rgba(16, 21, 28, 0.92);
  --dark-toolbar-seperator-color2: var(--border-strong);
  --dark-toolbar-seperator-color-opacity80: rgba(61, 75, 94, 0.8);
  --dark-toolbar-seperator-color3: var(--border);
  --dark-color-border-selected: var(--accent);
  --border-radius-default: var(--radius-sm);
  --font-default: var(--font);
  color-scheme: dark;
  color: var(--text);
}

body .jodit_theme_dark.jodit-container,
body .jodit-dialog_theme_dark.jodit-dialog {
  border-color: var(--border) !important;
  background-color: var(--surface) !important;
  border-radius: var(--radius);
}

body .jodit_theme_dark .jodit-toolbar__box:not(:empty),
body .jodit_theme_dark .jodit-status-bar {
  background: var(--surface-2) !important;
  border-color: var(--border) !important;
  color: var(--muted) !important;
}

body .jodit_theme_dark .jodit-workplace {
  border-color: var(--border) !important;
  background: var(--inset);
}

body .jodit_theme_dark .jodit-wysiwyg,
body .jodit_theme_dark .jodit-wysiwyg_iframe,
body .jodit_theme_dark .jodit-source,
body .jodit_theme_dark .jodit-source__mirror,
body .jodit_theme_dark .jodit-source textarea {
  background-color: var(--inset) !important;
  color: var(--text) !important;
}

body .jodit_theme_dark .jodit-wysiwyg a {
  color: var(--accent);
}

body .jodit_theme_dark .jodit-placeholder {
  color: var(--muted) !important;
}

body .jodit_theme_dark .jodit-toolbar-button__button:hover:not([disabled]),
body .jodit_theme_dark .jodit-toolbar-button__trigger:hover:not([disabled]),
body .jodit_theme_dark .jodit-ui-button__button:hover:not([disabled]),
body .jodit_theme_dark .jodit-toolbar-button__button:focus-visible:not([disabled]),
body .jodit_theme_dark .jodit-toolbar-button[aria-pressed="true"] .jodit-toolbar-button__button,
body .jodit_theme_dark .jodit-toolbar-button button[aria-pressed="true"] {
  background-color: rgba(62, 207, 255, 0.16) !important;
  color: var(--accent) !important;
}

body .jodit_theme_dark .jodit-toolbar-button__button:hover:not([disabled]) svg,
body .jodit_theme_dark .jodit-toolbar-button__trigger:hover:not([disabled]) svg,
body .jodit_theme_dark .jodit-toolbar-button[aria-pressed="true"] svg,
body .jodit_theme_dark .jodit-ui-button__button:hover:not([disabled]) svg {
  fill: var(--accent) !important;
  stroke: var(--accent) !important;
}

body .jodit_theme_dark .jodit-toolbar-button__text,
body .jodit_theme_dark .jodit-ui-button__text,
body .jodit_theme_dark .jodit-status-bar a,
body .jodit_theme_dark .jodit-status-bar span {
  color: var(--muted);
}

body .jodit_theme_dark .jodit-popup__content,
body .jodit-dialog_theme_dark .jodit-dialog__panel,
body .jodit-dialog_theme_dark .jodit-dialog__content {
  background: var(--surface) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}

body .jodit-dialog_theme_dark .jodit-dialog__header {
  background: var(--surface-2) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}

body .jodit_theme_dark .jodit-ui-input__input,
body .jodit_theme_dark .jodit-ui-input__wrapper,
body .jodit-dialog_theme_dark .jodit-ui-input__input,
body .jodit-dialog_theme_dark input[type="text"],
body .jodit-dialog_theme_dark input[type="url"],
body .jodit-dialog_theme_dark textarea,
body .jodit-dialog_theme_dark select,
body .jodit_theme_dark .jodit-select,
body .jodit_theme_dark .jodit-input,
body .jodit-dialog_theme_dark .jodit-select,
body .jodit-dialog_theme_dark .jodit-input {
  background-color: var(--field) !important;
  color: var(--text) !important;
  border-color: var(--border-strong) !important;
}

body .jodit_theme_dark .cc-jodit-smileys img:hover,
body .jodit_theme_dark .cc-jodit-smileys img:focus {
  outline: 2px solid var(--accent);
  border-radius: 4px;
}

@media (max-width: 760px) {
  body .jodit_theme_dark.jodit-container {
    height: min(70vh, 520px) !important;
  }
}
