// Sourcegraph-like theme overrides, later when we adjust our reference token
// layer to be a bit closer to Standard Sourcegraph UI we will get rid of literal
// values here and this theme will become a standard one.

[data-sg-theme='sourcegraph'] {
    // Common for both modes CSS design tokens
    --sg-sys-space: 1rem;
    --sg-sys-border-radius: 4px;
    --sg-sys-font-size: 1rem;
    --sg-sys-font-family: var(--sg-ref-font-family-sans);
    --sg-sys-font-family-code: var(--sg-ref-font-family-monospace);

    &[data-sg-theme-mode='light'] {
        --sg-sys-primary: oklch(0.5558 0.1835 255.82);
        --sg-sys-primary-foreground: oklch(1 0 0);
        --sg-sys-secondary: oklch(0.9576 0.0087 264.52);
        --sg-sys-secondary-foreground: oklch(0.351 0.0342 270.95);
        --sg-sys-destructive: oklch(0.5457 0.1949 26.61);
        --sg-sys-background: oklch(0.9846 0.0017 247.84);
        --sg-sys-foreground: oklch(0.351 0.0342 270.95);
        --sg-sys-card-background: oklch(1 0 0);
        --sg-sys-card-foreground: oklch(0.351 0.0342 270.95);
        --sg-sys-popover-background: oklch(1 0 0);
        --sg-sys-popover-foreground: oklch(0.351 0.0342 270.95);
        --sg-sys-muted-foreground: oklch(0.5367 0.0511 262.82);
        --sg-sys-accent: oklch(0.5558 0.1835 255.82);
        --sg-sys-accent-foreground: oklch(1 0 0);
        --sg-sys-border-color: oklch(0.9383 0.0109 256.7);
        --sg-sys-border-subtle: oklch(0.9116 0.0205 264.47);
        --sg-sys-input-background: oklch(1 0 0);
        --sg-sys-shadow-color: oklch(0.18 0.0188 274.65 / 10%);
    }

    &[data-sg-theme-mode='dark'] {
        --sg-sys-primary: oklch(0.5558 0.1835 255.82);
        --sg-sys-primary-foreground: oklch(1 0 0);
        --sg-sys-secondary: oklch(0.2819 0.0251 268.36);
        --sg-sys-secondary-foreground: oklch(0.9116 0.0205 264.47);
        --sg-sys-destructive: oklch(0.5457 0.1949 26.61);
        --sg-sys-background: oklch(0.2052 0.0167 268.83);
        --sg-sys-foreground: oklch(0.9116 0.0205 264.47);
        --sg-sys-card-background: oklch(0.2243 0.022 272.68);
        --sg-sys-card-foreground: oklch(0.9116 0.0205 264.47);
        --sg-sys-popover-background: oklch(0.2243 0.022 272.68);
        --sg-sys-popover-foreground: oklch(0.9116 0.0205 264.47);
        --sg-sys-muted-foreground: oklch(0.6358 0.0583 264.03);
        --sg-sys-accent: oklch(0.5558 0.1835 255.82);
        --sg-sys-accent-foreground: oklch(1 0 0);
        --sg-sys-border-color: oklch(0.29 0.0249 268.4);
        --sg-sys-border-subtle: oklch(0.351 0.0342 270.95);
        --sg-sys-input-background: oklch(0.2504 0.0273 271.98);
        --sg-sys-shadow-color: oklch(0.1327 0.0256 272.3 / 10%);

        // Special override
        --sg-sys-border-active-color: var(--sg-ref-blue-600);
        --sg-sys-focus-shadow: 0 0 0 3px
            color-mix(in oklch, var(--sg-sys-accent) 70%, transparent);
    }
}