:root {
    --color-scania-background: #041e42;
    --color-scania-footer-background: rgb(17, 43, 60);
    /* Core app colors */
    --color-text: white;
    --color-title: white;
    /* Tabs */
    --color-tab-callib-1: oklch(0.55 0.16 25);
    --color-tab-callib-2: oklch(0.55 0.16 45);
    --color-tab-callib-3: oklch(0.55 0.16 55);
    --color-tab-home-1: oklch(0.55 0.13 160);
    --color-tab-home-2: oklch(0.55 0.13 180);
    --color-tab-home-3: oklch(0.55 0.13 200);
    --color-tab-operations-1: oklch(0.65 0.13 100);
    --color-tab-operations-2: oklch(0.65 0.13 110);
    --color-tab-operations-3: oklch(0.65 0.13 120);
    --color-tab-files-1: oklch(0.50 0.19 340);
    --color-tab-files-2: oklch(0.50 0.19 360);
    --color-tab-6-secondary: oklch(from var(--color-tab-6) calc(l + 0.3) c h);
    /* Light Mode */
    --light-bg: oklch(97% 0.015 250);
    --light-header: var(--color-scania-background);
    --light-link: oklch(50% 0.18 250);
    --light-text: oklch(24% 0.025 250);
    --light-divider: oklch(86% 0.025 250);
    --light-button: oklch(55% 0.18 250);
    --light-button-text: white;
    /* Dark Mode */
    --dark-bg: oklch(15% 0.055 250);
    --dark-header: var(--color-scania-background);
    --dark-bg-item: oklch(20% 0.065 250);
    --dark-header-item: oklch(30% 0.075 250);
    --dark-link: oklch(76% 0.13 250);
    --dark-text: oklch(88% 0.025 250);
    --dark-divider: oklch(34% 0.045 270);
    --dark-button: oklch(68% 0.16 250);
    --dark-button-text: oklch(14% 0.03 270);
    /* Active app theme defaults */
    --color-bg: var(--dark-bg);
    --color-header: var(--dark-header);
    --color-bg-item: var(--dark-bg-item);
    --color-header-item: var(--dark-header-item);
    --color-link: var(--dark-link);
    --color-text: var(--dark-text);
    --color-divider: var(--dark-divider);
    --color-button: var(--dark-button);
    --color-button-text: var(--dark-button-text);
}

[data-theme="light"] {
    --color-bg: var(--light-bg);
    --color-header: var(--light-header);
    --color-link: var(--light-link);
    --color-text: var(--light-text);
    --color-divider: var(--light-divider);
    --color-button: var(--light-button);
    --color-button-text: var(--light-button-text);
}

[data-theme="dark"] {
    --color-bg: var(--dark-bg);
    --color-header: var(--dark-header);
    --color-link: var(--dark-link);
    --color-text: var(--dark-text);
    --color-divider: var(--dark-divider);
    --color-button: var(--dark-button);
    --color-button-text: var(--dark-button-text);
}

[color-theme="rainbow"] {
    --color-tab-callib-1: oklch(0.55 0.16 25);
    --color-tab-callib-2: oklch(0.55 0.16 45);
    --color-tab-callib-3: oklch(0.55 0.16 55);
    --color-tab-home-1: oklch(0.55 0.13 160);
    --color-tab-home-2: oklch(0.55 0.13 180);
    --color-tab-home-3: oklch(0.55 0.13 200);
    --color-tab-operations-1: oklch(0.65 0.13 100);
    --color-tab-operations-2: oklch(0.65 0.13 110);
    --color-tab-operations-3: oklch(0.65 0.13 120);
}

[color-theme="blue"] {
    --color-blue: oklch(0.84 0.10 220);
    --color-tab-callib-1: var(--color-blue);
    --color-tab-callib-2: var(--color-blue);
    --color-tab-callib-3: var(--color-blue);
    --color-tab-home-1: var(--color-blue);
    --color-tab-home-2: var(--color-blue);
    --color-tab-home-3: var(--color-blue);
    --color-tab-operations-1: var(--color-blue);
    --color-tab-operations-2: var(--color-blue);
    --color-tab-operations-3: var(--color-blue);
}