import { EditorView } from "@codemirror/view";

export const oneDark = EditorView.theme(
  {
    "&": {
      backgroundColor: "var(--background)",
      color: "var(--foreground)",
    },
    ".cm-cursor, .cm-cursor-primary": {
      borderLeftColor: "var(--primary)",
      borderLeftWidth: "0.5em",
    },
    ".cm-selectionBackground, &.cm-focused .cm-selectionBackground": {
      backgroundColor: "color-mix(in oklch, var(--primary) 25%, transparent)",
    },
    ".cm-activeLine": {
      backgroundColor: "color-mix(in oklch, var(--primary) 8%, transparent)",
    },
    ".cm-gutters": {
      backgroundColor: "var(--background)",
      color: "var(--muted-foreground)",
      borderRight: "1px solid var(--border)",
    },
    ".cm-activeLineGutter": {
      backgroundColor: "color-mix(in oklch, var(--primary) 8%, transparent)",
      color: "var(--primary)",
    },
  },
  { dark: true }
);
