@import "tailwindcss";

@custom-variant dark (&:is(.dark *));

:root {
    --background: oklch(0.97 0.004 285.8);
    --foreground: oklch(0.15 0.008 285.88);
    --muted: oklch(0.92 0.006 285.8);
    --muted-foreground: oklch(0.4 0.015 285.7);
    --popover: oklch(1 0 0);
    --popover-foreground: oklch(0.15 0.008 285.88);
    --card: oklch(1 0 0);
    --card-foreground: oklch(0.15 0.008 285.88);
    --border: oklch(0.88 0.008 285.9);
    --input: oklch(1 0 0);
    --primary: oklch(0.65 0.21 327.35);
    --primary-foreground: oklch(1 0 0);
    --secondary: oklch(0.91 0.008 285.9);
    --secondary-foreground: oklch(0.15 0.008 285.88);
    --accent: oklch(0.91 0.008 285.9);
    --accent-foreground: oklch(0.15 0.008 285.88);
    --destructive: oklch(0.62 0.22 31.65);
    --destructive-foreground: oklch(1 0 0);
    --ring: oklch(0.65 0.21 327.35);
    --radius: 0.45rem;
    --sidebar-background: oklch(0.98 0 0);
    --sidebar-foreground: oklch(0.37 0.012 285.8);
    --sidebar-primary: oklch(0.21 0.0059 285.88);
    --sidebar-primary-foreground: oklch(0.98 0 0);
    --sidebar-accent: oklch(0.97 0.0013 286.38);
    --sidebar-accent-foreground: oklch(0.21 0.0059 285.88);
    --sidebar-border: oklch(0.93 0.0058 264.53);
    --sidebar-ring: oklch(0.62 0.1879 259.8);
    --chart-1: oklch(0.488 0.243 264.376);
    --chart-2: oklch(0.696 0.17 162.48);
    --chart-3: oklch(0.769 0.188 70.08);
    --chart-4: oklch(0.627 0.265 303.9);
    --chart-5: oklch(0.645 0.246 16.439);
    --method-get: oklch(0.6 0.14 150);
    --method-post: oklch(0.65 0.16 45);
    --method-delete: oklch(0.6 0.18 15);
    --method-put: oklch(0.55 0.14 240);
    --method-patch: oklch(0.5 0.12 270);
    --method-head: oklch(0.68 0.15 70);
    --method-options: oklch(0.65 0.18 320);
    --method-default: oklch(0.55 0.06 285);
    --success: oklch(0.5 0.15 140);
    --success-bg: oklch(0.94 0.05 140);
    --success-border: oklch(0.88 0.08 140);
    --failure: oklch(0.45 0.18 25);
    --failure-bg: oklch(0.94 0.05 25);
    --failure-border: oklch(0.88 0.08 25);
}

.dark {
    --background: oklch(0.17 0 0);
    --foreground: oklch(0.88 0.0426 272.09);
    --muted: oklch(0.29 0.021 285.03);
    --muted-foreground: oklch(0.73 0.0272 285.71);
    --popover: oklch(0.25 0.006657 285.9145);
    --popover-foreground: oklch(0.98 0.0068 272.58);
    --card: oklch(0.2 0.0055 285.9);
    --card-foreground: oklch(0.93 0.0244 272.37);
    --border: oklch(0.38 0.0267 285.05);
    --input: oklch(0.33 0.0226 285.1);
    --primary: oklch(0.8 0.1773 327.08);
    --primary-foreground: oklch(0.17 0.0766 328.36);
    --secondary: oklch(0.33 0.0684 303.66);
    --secondary-foreground: oklch(0.86 0.0332 305.94);
    --accent: oklch(0.35 0.0105 285.85);
    --accent-foreground: oklch(0.91 0.0145 286.11);
    --destructive: oklch(0.65 0.2262 31.65);
    --destructive-foreground: oklch(1 0 0);
    --ring: oklch(0.81 0.1699 327.01);
    --sidebar-background: oklch(0.21 0.0059 285.88);
    --sidebar-foreground: oklch(0.97 0.0013 286.38);
    --sidebar-primary: oklch(0.49 0.217 264.39);
    --sidebar-primary-foreground: oklch(1 0 0);
    --sidebar-accent: oklch(0.27 0.0055 286.03);
    --sidebar-accent-foreground: oklch(0.97 0.0013 286.38);
    --sidebar-border: oklch(0.27 0.0055 286.03);
    --sidebar-ring: oklch(0.62 0.1879 259.8);
    --chart-1: oklch(0.488 0.243 264.376);
    --chart-2: oklch(0.696 0.17 162.48);
    --chart-3: oklch(0.769 0.188 70.08);
    --chart-4: oklch(0.627 0.265 303.9);
    --chart-5: oklch(0.645 0.246 16.439);
    --method-get: oklch(0.78 0.1 150);
    --method-post: oklch(0.8 0.12 45);
    --method-delete: oklch(0.72 0.13 12);
    --method-put: oklch(0.7 0.1 240);
    --method-patch: oklch(0.65 0.08 270);
    --method-head: oklch(0.88 0.11 70);
    --method-options: oklch(0.8 0.14 320);
    --method-default: oklch(0.7 0.02 285);
    --success: oklch(0.8 0.15 140);
    --success-bg: oklch(0.25 0.05 140);
    --success-border: oklch(0.35 0.08 140);
    --failure: oklch(0.75 0.18 25);
    --failure-bg: oklch(0.25 0.05 25);
    --failure-border: oklch(0.35 0.08 25);
}

@theme inline {
    --radius-sm: calc(var(--radius) - 4px);
    --radius-md: calc(var(--radius) - 2px);
    --radius-lg: var(--radius);
    --radius-xl: calc(var(--radius) + 4px);
    --color-background: var(--background);
    --color-foreground: var(--foreground);
    --color-card: var(--card);
    --color-card-foreground: var(--card-foreground);
    --color-popover: var(--popover);
    --color-popover-foreground: var(--popover-foreground);
    --color-primary: var(--primary);
    --color-primary-foreground: var(--primary-foreground);
    --color-secondary: var(--secondary);
    --color-secondary-foreground: var(--secondary-foreground);
    --color-muted: var(--muted);
    --color-muted-foreground: var(--muted-foreground);
    --color-accent: var(--accent);
    --color-accent-foreground: var(--accent-foreground);
    --color-destructive: var(--destructive);
    --color-destructive-foreground: var(--destructive-foreground);
    --color-border: var(--border);
    --color-input: var(--input);
    --color-ring: var(--ring);
    --color-chart-1: var(--chart-1);
    --color-chart-2: var(--chart-2);
    --color-chart-3: var(--chart-3);
    --color-chart-4: var(--chart-4);
    --color-chart-5: var(--chart-5);
    --color-sidebar: var(--sidebar);
    --color-sidebar-foreground: var(--sidebar-foreground);
    --color-sidebar-primary: var(--sidebar-primary);
    --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
    --color-sidebar-accent: var(--sidebar-accent);
    --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
    --color-sidebar-border: var(--sidebar-border);
    --color-sidebar-ring: var(--sidebar-ring);
    --color-method-get: var(--method-get);
    --color-method-post: var(--method-post);
    --color-method-delete: var(--method-delete);
    --color-method-put: var(--method-put);
    --color-method-patch: var(--method-patch);
    --color-method-head: var(--method-head);
    --color-method-options: var(--method-options);
    --color-method-default: var(--method-default);
    --color-success: var(--success);
    --color-success-bg: var(--success-bg);
    --color-success-border: var(--success-border);
    --color-failure: var(--failure);
    --color-failure-bg: var(--failure-bg);
    --color-failure-border: var(--failure-border);
}

@theme {
    --text-micro: 0.5625rem;
    --text-micro--line-height: calc(1.25 / 0.5625);
    --text-tiny: 0.6875rem;
    --text-tiny--line-height: calc(1.25 / 0.6875);
    --text-small: 0.8125rem;
    --text-small--line-height: calc(1.25 / 0.8125);
    --text-medium: 0.9375rem;
    --text-medium--line-height: calc(1.25 / 0.9375);
    --text-large: 1.0625rem;
    --text-large--line-height: calc(1.25 / 1.0625);
}

@layer base {
    * {
        @apply border-border overscroll-none select-none;
    }
    body {
        @apply text-small text-foreground bg-transparent;
    }
}

.cm-editor {
    height: 100%;
}
