/* Burpi theme for the Lexxy rich text editor and rendered Action Text content (.lexxy-content).
   Lexxy's own stylesheet loads first and only uses :where() selectors, so these rules win. Colors
   fall back to the Tailwind palette values, matching .form-input and the secondary buttons. */

:root {
  --lexxy-color-ink: var(--color-gray-800, #1e2939);
  --lexxy-color-ink-medium: var(--color-gray-600, #4a5565);
  --lexxy-color-ink-light: var(--color-gray-400, #99a1af);
  --lexxy-color-ink-lighter: var(--color-gray-300, #d1d5dc);
  --lexxy-color-ink-lightest: var(--color-gray-100, #f3f4f6);
  --lexxy-color-link: var(--color-indigo-600, #4f39f6);
  --lexxy-color-selected: var(--color-gray-200, #e5e7eb);
  --lexxy-color-selected-hover: var(--color-gray-300, #d1d5dc);
  --lexxy-color-accent-dark: var(--color-gray-900, #101828);
  --lexxy-color-accent-medium: var(--color-gray-700, #364153);
  --lexxy-focus-ring-color: var(--color-gray-800, #1e2939);
  --lexxy-font-base: inherit;
  --lexxy-radius: 0.375rem;
}

/* Editor: a .form-input look, with the toolbar inside the box above the text */
lexxy-editor {
  --lexxy-editor-rows: 6lh;
  --lexxy-editor-padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
}

/* A form field fills its column, unlike the prose max-width of .lexxy-content */
lexxy-editor.lexxy-content {
  max-width: none;
}

lexxy-editor:focus-within {
  outline: 2px solid var(--lexxy-focus-ring-color);
  outline-offset: -2px;
}

lexxy-editor.rich-text-short {
  --lexxy-editor-rows: 3lh;
}

lexxy-editor .lexxy-editor__content:not(:has(h1, h2, ul, ol))::before {
  color: var(--color-gray-400, #99a1af);
  opacity: 1;
}

/* Lexxy sizes buttons in line heights, which the editor's prose-lg makes too big for phones */
lexxy-toolbar {
  --lexxy-toolbar-button-size: 1.75rem;
  --lexxy-toolbar-icon-size: 1rem;
}

lexxy-toolbar .lexxy-editor__toolbar-button {
  color: var(--color-gray-500, #6a7282);
}

lexxy-toolbar .lexxy-editor__toolbar-button[aria-pressed="true"],
lexxy-toolbar .lexxy-editor__toolbar-button[aria-pressed="true"]:hover {
  background-color: var(--color-gray-900, #101828);
  color: #fff;
}

/* Rendered content keeps the compact spacing coaches had with Trix: one line per paragraph,
   blank lines only where they typed them */
.lexxy-content {
  --lexxy-content-margin: 0;
  line-height: 1.5;
  overflow-wrap: break-word;
}

.lexxy-content :is(h1, h2) {
  line-height: 1.2;
  margin: 0;
}

.lexxy-content h1 {
  font-size: 1.2em;
}

.lexxy-content h2 {
  font-size: 1.1em;
}

.lexxy-content :is(p, ul, ol, li) {
  margin: 0;
}

.lexxy-content :is(ul, ol) {
  margin-inline-start: 1.25em;
  padding: 0;
}

.lexxy-content li::marker {
  color: var(--color-gray-500, #6a7282);
}

.lexxy-content .horizontal-divider {
  padding: 0.5em 0;
  margin: 0;
}

.lexxy-content .horizontal-divider hr,
.lexxy-content hr {
  border: 0;
  border-block-end: 1px solid var(--color-gray-300, #d1d5dc);
  inline-size: 100%;
  margin: 0;
}