/* Lexxy theme overrides - maps Lexxy CSS variables to FoundersBoxx theme */

/* Light mode - Lexxy variables mapped to your theme */
:root,
.light {
  /* Canvas/Background */
  --lexxy-color-canvas: var(--base-bg-low);
  --lexxy-color-ink-inverted: white;

  /* Text/Ink colors */
  --lexxy-color-ink: var(--base-text);
  --lexxy-color-ink-medium: var(--base-text-secondary);
  --lexxy-color-ink-light: var(--base-text-tertiary);
  --lexxy-color-ink-lighter: var(--color-base-300);
  --lexxy-color-ink-lightest: var(--color-base-100);

  /* Derived colors */
  --lexxy-color-text: var(--lexxy-color-ink);
  --lexxy-color-text-subtle: var(--lexxy-color-ink-medium);
  --lexxy-color-code-bg: var(--lexxy-color-ink-lightest);

  /* Accent colors - using your primary violet */
  --lexxy-color-accent-dark: var(--color-primary-700);
  --lexxy-color-accent-medium: var(--color-primary-500);
  --lexxy-color-accent-light: var(--color-primary-100);
  --lexxy-color-accent-lightest: var(--color-primary-50);

  /* Semantic colors */
  --lexxy-color-red: var(--color-red-600);
  --lexxy-color-green: var(--color-emerald-600);
  --lexxy-color-blue: var(--color-blue-600);
  --lexxy-color-purple: var(--color-primary-600);

  /* Links and selection */
  --lexxy-color-link: var(--text-primary);
  --lexxy-color-selected: var(--lexxy-color-accent-lightest);
  --lexxy-color-selected-hover: var(--lexxy-color-accent-light);
  --lexxy-color-selected-dark: var(--lexxy-color-blue);

  /* Focus ring */
  --lexxy-focus-ring-color: var(--lexxy-color-accent-dark);

  /* Code syntax highlighting - light mode */
  --lexxy-color-code-token-att: #d73a49;
  --lexxy-color-code-token-comment: #6a737d;
  --lexxy-color-code-token-function: #6f42c1;
  --lexxy-color-code-token-operator: #d73a49;
  --lexxy-color-code-token-property: #005cc5;
  --lexxy-color-code-token-punctuation: #24292e;
  --lexxy-color-code-token-selector: #22863a;
  --lexxy-color-code-token-variable: #e36209;
}

/* Dark mode - override Lexxy variables */
:root.dark,
.dark {
  /* Canvas/Background - match form inputs */
  --lexxy-color-canvas: var(--base-bg-low);
  --lexxy-color-ink-inverted: var(--color-base-950);

  /* Text/Ink colors - light text for dark mode */
  --lexxy-color-ink: var(--base-text);
  --lexxy-color-ink-medium: var(--base-text-secondary);
  --lexxy-color-ink-light: var(--base-text-tertiary);
  --lexxy-color-ink-lighter: var(--color-base-500);
  --lexxy-color-ink-lightest: var(--color-base-700);

  /* Derived colors */
  --lexxy-color-text: var(--lexxy-color-ink);
  --lexxy-color-text-subtle: var(--lexxy-color-ink-medium);
  --lexxy-color-code-bg: var(--lexxy-color-ink-lightest);

  /* Accent colors - brighter for dark mode */
  --lexxy-color-accent-dark: var(--color-primary-400);
  --lexxy-color-accent-medium: var(--color-primary-300);
  --lexxy-color-accent-light: var(--color-primary-800);
  --lexxy-color-accent-lightest: var(--color-primary-900);

  /* Semantic colors - brighter for dark mode */
  --lexxy-color-red: var(--color-red-400);
  --lexxy-color-green: var(--color-emerald-400);
  --lexxy-color-blue: var(--color-blue-400);
  --lexxy-color-purple: var(--color-primary-400);

  /* Links and selection */
  --lexxy-color-link: var(--text-primary);
  --lexxy-color-selected: var(--lexxy-color-accent-lightest);
  --lexxy-color-selected-hover: var(--lexxy-color-accent-light);
  --lexxy-color-selected-dark: var(--lexxy-color-blue);

  /* Focus ring */
  --lexxy-focus-ring-color: var(--lexxy-color-accent-dark);

  /* Code syntax highlighting - dark mode (GitHub dark theme) */
  --lexxy-color-code-token-att: #ff7b72;
  --lexxy-color-code-token-comment: #8b949e;
  --lexxy-color-code-token-function: #d2a8ff;
  --lexxy-color-code-token-operator: #ff7b72;
  --lexxy-color-code-token-property: #79c0ff;
  --lexxy-color-code-token-punctuation: #c9d1d9;
  --lexxy-color-code-token-selector: #7ee787;
  --lexxy-color-code-token-variable: #ffa657;
}

/* Mention attachment styling - remove extra spacing */
action-text-attachment[content-type="application/vnd.actiontext.mention"] {
  display: inline;
}

/* Override prose styles for mention images */
.prose action-text-attachment[content-type="application/vnd.actiontext.mention"] img,
action-text-attachment[content-type="application/vnd.actiontext.mention"] img {
  display: inline-block;
  margin: 0 !important;
  vertical-align: middle;
}