@import url("/assets/lexxy-content-887ae3e2.css");
@import url("/assets/lexxy-editor-84aedae1.css");

:root,
:where(html[data-theme], [data-theme]) {
  --lexxy-color-canvas: var(--color-base-100);
  --lexxy-color-ink: var(--color-base-content);
  --lexxy-color-ink-medium: color-mix(in oklab, var(--color-base-content) 70%, transparent);
  --lexxy-color-ink-light: color-mix(in oklab, var(--color-base-content) 50%, transparent);
  --lexxy-color-ink-lighter: var(--color-base-300);
  --lexxy-color-ink-lightest: var(--color-base-200);

  --lexxy-color-accent-dark: var(--color-primary);
  --lexxy-color-accent-medium: var(--color-primary);
  --lexxy-color-accent-light: color-mix(in oklab, var(--color-primary) 20%, var(--color-base-100));
  --lexxy-color-accent-lightest: color-mix(in oklab, var(--color-primary) 12%, var(--color-base-100));

  --lexxy-color-text: var(--color-base-content);
  --lexxy-color-text-subtle: color-mix(in oklab, var(--color-base-content) 65%, transparent);
  --lexxy-color-link: var(--color-primary);
  --lexxy-color-selected: color-mix(in oklab, var(--color-primary) 22%, var(--color-base-100));
  --lexxy-color-selected-hover: color-mix(in oklab, var(--color-primary) 30%, var(--color-base-100));
  --lexxy-color-selected-dark: var(--color-primary);
  --lexxy-color-code-bg: var(--color-base-200);
  --lexxy-focus-ring-color: var(--color-primary);
}

:where(lexxy-editor) {
  color: var(--lexxy-color-text);
}

:where(lexxy-toolbar) {
  background-color: var(--lexxy-color-canvas);
  border-color: var(--lexxy-color-ink-lighter);
}

:where(.lexxy-editor__content) {
  caret-color: var(--lexxy-color-text);
  color: var(--lexxy-color-text);
}

:where(.lexxy-editor--empty) .lexxy-editor__content::before {
  color: var(--lexxy-color-text-subtle);
  opacity: 0.9;
}

:where(.lexxy-editor__toolbar-button) {
  color: var(--lexxy-color-text);
}

:where(.lexxy-editor__toolbar-dropdown-content, .lexxy-editor__toolbar-overflow-menu) {
  background-color: var(--lexxy-color-canvas);
  border-color: var(--lexxy-color-ink-lighter);
  color: var(--lexxy-color-text);
}

:where(lexxy-link-dropdown) input[type="url"] {
  background-color: var(--lexxy-color-canvas);
  color: var(--lexxy-color-text);
}

:where(.lexxy-content pre, .lexxy-content code) {
  background-color: var(--lexxy-color-code-bg);
  color: var(--lexxy-color-text);
}
