/* TinyMCE UI overrides to align with site CSS variables */

/* Editor chrome container */
.tox-tinymce {
  --tinymce-border-color: var(--color-background-3);
  color: var(--text-color);
}

/* Header + toolbars + menubar + statusbar */
.tox .tox-editor-header,
.tox .tox-toolbar,
.tox .tox-menubar,
.tox .tox-statusbar {
  background-color: var(--color-background-2);
  border-color: var(--color-background-1);
}

/* Buttons */
.tox .tox-tbtn {
  color: var(--text-color-light) !important;
  background-color: var(--color-primary-3) !important;
  border-radius: 3px;
  cursor: pointer;
}
.tox .tox-tbtn:hover {
  background-color: var(--color-primary-4) !important;
}
.tox .tox-tbtn svg {
  fill: var(--text-color-light) !important;
}
.tox .tox-tbtn--enabled:hover,
.tox .tox-tbtn:focus {
  background-color: var(--color-primary-4) !important;
}
.tox .tox-tbtn--active {
  background-color: var(--color-primary-4) !important;
}

/* Disabled state should not show pointer */
.tox .tox-tbtn--disabled {
  cursor: not-allowed;
}

/* Dropdowns and menus */
.tox .tox-menu,
.tox .tox-collection__item {
  background-color: var(--color-background-2);
  color: var(--text-color);
}

/* Remove chrome borders to eliminate top/bottom lines */
.tox .tox-editor-header,
.tox .tox-toolbar,
.tox .tox-menubar,
.tox .tox-statusbar {
  border-top: none !important;
  border-bottom: none !important;
}

/* Edit area wrapper (outside iframe) */
.tox .tox-edit-area {
  background-color: var(--color-background-1);
  border: none !important;
}

/* Ensure iframe has no border */
.tox .tox-edit-area iframe {
  border: none !important;
}