/*
 * Dark-mode theme for Lexxy.
 *
 * The gem defines its colors as CSS custom properties in :root with only light
 * values. This app uses media-query dark mode (Tailwind `dark:` resolves to
 * prefers-color-scheme). Lexxy's surface/text tokens all derive from a neutral
 * "ink" ramp plus a couple of accents, so we remap those under the dark media
 * query and both the rendered content (.lexxy-content) and the editor
 * (<lexxy-editor>, --lexxy-color-canvas) follow automatically.
 *
 * IMPORTANT: this must be loaded *after* lexxy.css so these :root overrides win
 * the cascade (see app/views/layouts/application.html.erb).
 */
@media (prefers-color-scheme: dark) {
  :root {
    /* Neutral ramp flipped: light text on dark surfaces (≈ stone-900/800/100) */
    --lexxy-color-ink: oklch(95% 0 0);
    --lexxy-color-ink-medium: oklch(75% 0 0);
    --lexxy-color-ink-light: oklch(62% 0 0);
    --lexxy-color-ink-lighter: oklch(45% 0 0);
    --lexxy-color-ink-lightest: oklch(33% 0.005 60);
    --lexxy-color-ink-inverted: oklch(27% 0.006 56); /* canvas / editor bg ≈ stone-800 */

    /* Brighter link for contrast on dark */
    --lexxy-color-link: var(--lexxy-color-accent-medium);

    /* Code tokens tuned for dark backgrounds */
    --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;
  }
}