/*
 * Lexxy themed for ink and paper: a white writing surface framed in warm
 * stone, with rubric red — the editor's red pen — replacing the default
 * blue for links, focus marks and selection accents.
*/

:root {
  /* Warm stone neutrals in place of Lexxy's cold gray ramp */
  --lexxy-color-ink: #24272e;
  --lexxy-color-ink-medium: #57534e;   /* stone-600: secondary text */
  --lexxy-color-ink-light: #a8a29e;    /* stone-400 */
  --lexxy-color-ink-lighter: #e7e5e4;  /* stone-200: toolbar rule, separators */
  --lexxy-color-ink-lightest: #f5f5f4; /* stone-100: hovers, code blocks */

  /* Rubric red replaces the blue accent */
  --lexxy-color-accent-dark: #9e2f28;
  --lexxy-color-accent-medium: #b44f47;
  --lexxy-color-accent-light: #e7e5e4;    /* pressed-button hover stays neutral */
  --lexxy-color-accent-lightest: #f5f5f4; /* pressed-button ground stays neutral */
  --lexxy-color-link: #9e2f28;
  --lexxy-color-selected-dark: #9e2f28;

  /* Newsreader carries captions, matching note bodies */
  --lexxy-font-base: var(--font-serif, "Newsreader", Georgia, serif);

  /* Inner radius 4px + 2px toolbar gap = 6px outer, matching rounded-md inputs */
  --lexxy-radius: 4px;

  --lexxy-editor-padding: 0.75rem;

  /* Layered shadow for dropdown panels instead of a single hard drop */
  --lexxy-shadow:
    0 0 0 1px rgb(0 0 0 / 0.04),
    0 2px 4px rgb(0 0 0 / 0.06),
    0 8px 24px rgb(0 0 0 / 0.08);
}

/* Match the stone-300 border of the app's other form fields, darkening
   gently on focus since the content area suppresses its own outline. */
lexxy-editor {
  border-color: #d6d3d1;
  transition-property: border-color, opacity;
  transition-duration: 150ms;
}

lexxy-editor:focus-within {
  border-color: #a8a29e;
}