@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-focus-ring-color: var(--color-primary);
  /* Atom One Dark — code blocks in `.lexxy-content` (Prism + Lexxy tokens) */
  --lexxy-color-code-bg: #282c34;
  --lexxy-color-code-token-att: #c678dd;
  --lexxy-color-code-token-comment: #5c6370;
  --lexxy-color-code-token-function: #61afef;
  --lexxy-color-code-token-operator: #56b6c2;
  --lexxy-color-code-token-property: #d19a66;
  --lexxy-color-code-token-punctuation: #abb2bf;
  --lexxy-color-code-token-selector: #98c379;
  --lexxy-color-code-token-variable: #e06c75;
}

: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) {
  background-color: var(--lexxy-color-code-bg);
  border-radius: var(--lexxy-radius);
  color: #abb2bf;
  font-family: var(--lexxy-font-mono, ui-monospace, monospace);
  font-size: 0.875rem;
  line-height: 1.5;
  margin-block: 0 var(--lexxy-content-margin, 1rem);
  overflow-x: auto;
  padding: 1ch 1.25ch;
  tab-size: 2;
}

:where(.lexxy-content pre code) {
  background: transparent;
  color: inherit;
  font-size: inherit;
  padding: 0;
}

:where(.lexxy-content :not(pre) > code) {
  background-color: color-mix(in oklab, var(--lexxy-color-code-bg) 85%, var(--color-base-100));
  border-radius: 0.25ch;
  color: var(--lexxy-color-code-token-variable);
  font-size: 0.875em;
  padding: 0.15em 0.4em;
}