/* Isolated toolbar + content styles for reusable editor palettes */
body.feature-workitemmanager .rn-editor {
  /* Map editor palette to the app theme */
  --rn-toolbar-bg: var(--panel-2);
  --rn-content-bg: var(--panel);
  --rn-border: var(--border);
  --rn-text: var(--text);
  --rn-hover: var(--hover);
  --rn-active: var(--active);
  --rn-radius: 8px;
  --rn-min-height: 180px;
}

body.feature-workitemmanager .rn-editor .editor-toolbar {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  padding: 6px;
  background: var(--rn-toolbar-bg);
  border: 1px solid var(--rn-border);
  border-radius: 6px;
  position: sticky;
  top: 0;
  z-index: 1;
}

body.feature-workitemmanager .rn-editor .editor-toolbar .btn {
  background: var(--rn-toolbar-bg);
  color: var(--rn-text);
  border: 1px solid var(--rn-border);
  height: 30px;
  padding: 0 10px;
  border-radius: 6px;
  cursor: pointer;
}

body.feature-workitemmanager .rn-editor .editor-toolbar .btn:hover {
  background: var(--rn-hover);
}
body.feature-workitemmanager .rn-editor .editor-toolbar .btn.active {
  background: var(--rn-active);
  border-color: #4da3ff;
}

body.feature-workitemmanager .rn-editor .editor-toolbar .sep {
  width: 1px;
  height: 16px;
  background: var(--rn-border);
  margin: 0 4px;
  display: inline-block;
}

/* Color indicator on the color button */
body.feature-workitemmanager .rn-editor .editor-toolbar #btnTextColor {
  position: relative;
  padding-right: 18px;
}
body.feature-workitemmanager .rn-editor .editor-toolbar #btnTextColor::after {
  content: "";
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 1px solid var(--rn-border);
  background: var(--current-color, #111);
}

/* Content area */
body.feature-workitemmanager .rn-editor .rn-content {
  min-height: var(--rn-min-height);
  padding: 12px;
  background: var(--rn-content-bg);
  border: 1px solid var(--rn-border);
  border-radius: 6px;
  outline: none;
  font-size: 15px;
}

body.feature-workitemmanager .rn-editor .rn-content:focus {
  box-shadow: 0 0 0 2px rgba(77, 163, 255, 0.2);
}
