@import url("../components/arts/day-shift-theme-preview.css") layer(components);
@import url("../components/arts/night-shift-theme-preview.css")
layer(components);
@import url("../components/arts/simple-bar-lite-preview.css") layer(components);
@import url("../components/arts/simple-bar-preview.css") layer(components);
@import url("../components/arts/simple-bar-server-preview.css")
layer(components);
@import url("../components/cubes.css") layer(components);
@import url("../components/page-header.css") layer(components);
@import url("../components/toolbox-entries.css") layer(components);

@layer variables {
  :root {
    --night-shift-blue-100: #98a8c5;
    --night-shift-blue-200: #74829b;
    --night-shift-blue-300: #39465e;
    --night-shift-blue-400: #1e2737;
    --night-shift-blue-500: #1b222d;
    --night-shift-blue-600: #141b27;
    --night-shift-red: #e78482;
    --night-shift-green: #8fc8bb;
    --night-shift-yellow: #ffd484;
    --night-shift-orange: #ffb374;
    --night-shift-blue: #6db3ce;
    --night-shift-magenta: #ad82cb;
    --night-shift-cyan: #7eddde;
    --night-shift-white: #f5f5f5;
    --night-shift-yellow-white: #fff9ee;
    --night-shift-background: var(--night-shift-blue-400);
    --night-shift-foreground: var(--night-shift-yellow-white);

    --day-shift-blue-100: #98a8c5;
    --day-shift-blue-200: #74829b;
    --day-shift-blue-300: #39465e;
    --day-shift-blue-400: #1e2737;
    --day-shift-blue-500: #1b222d;
    --day-shift-blue-600: #141b27;
    --day-shift-red: #e78482;
    --day-shift-green: #8fc8bb;
    --day-shift-yellow: #e0b972;
    --day-shift-orange: #ffb374;
    --day-shift-blue: #6db3ce;
    --day-shift-magenta: #ad82cb;
    --day-shift-cyan: #2fc2c3;
    --day-shift-white: #f5f5f5;
    --day-shift-yellow-white: #fff9ee;
    --day-shift-background: var(--day-shift-white);
    --day-shift-foreground: var(--day-shift-blue-200);

    --simple-bar-red: var(--night-shift-red);
    --simple-bar-green: var(--night-shift-green);
    --simple-bar-yellow: var(--night-shift-yellow);
    --simple-bar-orange: var(--night-shift-orange);
    --simple-bar-blue: var(--night-shift-blue);
    --simple-bar-magenta: var(--night-shift-magenta);
    --simple-bar-cyan: var(--night-shift-cyan);
    --simple-bar-primary-300: var(--night-shift-blue-300);
    --simple-bar-primary-400: var(--night-shift-blue-400);
    --simple-bar-primary-500: var(--night-shift-blue-500);
  }
}
