@import url("/assets/lexxy-variables-3fef4323.css") layer(base);
@import url("/assets/lexxy-content-0ff2f961.css") layer(base);
@import url("/assets/lexxy-editor-5b842411.css") layer(base);

/*
 * Map Lexxy's own design tokens onto this app's slate/primary palette so the
 * editor and its read-only rendering (.lexxy-content) match every other
 * field/typography choice instead of Lexxy's default light-gray theme.
 * Unlayered, so it wins over the `layer(base)` imports above regardless of
 * source order (see app/assets/stylesheets/application.tailwind.css for the
 * same primary/secondary tokens these reference).
 */
:root {
  --lexxy-color-ink: var(--color-slate-900);
  --lexxy-color-ink-medium: var(--color-slate-500);
  --lexxy-color-ink-light: var(--color-slate-400);
  --lexxy-color-ink-lighter: var(--color-slate-200);
  --lexxy-color-ink-lightest: var(--color-slate-50);

  --lexxy-color-accent-dark: var(--color-primary);
  --lexxy-color-accent-medium: color-mix(in oklch, var(--color-primary) 70%, white);
  --lexxy-color-accent-light: color-mix(in oklch, var(--color-primary) 25%, white);
  --lexxy-color-accent-lightest: color-mix(in oklch, var(--color-primary) 12%, white);

  --lexxy-font-base: inherit;
  --lexxy-radius: 0.5rem;
}

/* Editor chrome (border/padding) is supplied by field_class in the view
   instead, so the two don't stack into a double box. */
lexxy-editor {
  --lexxy-border-color: transparent;
  --lexxy-editor-padding: 0;
}