:root {
    --color-body: var(--theme-catppuccin-base);
    --color-text: var(--theme-catppuccin-text);
    --color-text-light: var(--theme-catppuccin-subtext0);
    --color-text-light-2: var(--theme-catppuccin-subtext1);
    --color-text-light-3: var(--theme-catppuccin-subtext1);
    --color-text-dark: var(--theme-catppuccin-subtext0);
    --color-text-dark-2: var(--theme-catppuccin-subtext1);
    --color-text-dark-3: var(--theme-catppuccin-subtext1);
    --color-secondary: var(--theme-catppuccin-surface1);
    --color-caret: var(--theme-catppuccin-text);
    --color-navbar: var(--theme-catppuccin-surface0);
    --color-footer: var(--theme-catppuccin-surface0);

    --color-red: var(--theme-catppuccin-red);
    --color-orange: var(--theme-catppuccin-peach);
    --color-yellow: var(--theme-catppuccin-yellow);
    --color-olive: var(--theme-catppuccin-green);
    --color-green: var(--theme-catppuccin-green);
    --color-teal: var(--theme-catppuccin-teal);
    --color-blue: var(--theme-catppuccin-blue);
    --color-violet: var(--theme-catppuccin-mauve);
    --color-purple: var(--theme-catppuccin-mauve);
    --color-grey: var(--theme-catppuccin-overlay0);
    --color-gold: var(--theme-catppuccin-yellow);
    --color-red-light: var(--theme-catppuccin-red);
    --color-orange-light: var(--theme-catppuccin-peach);
    --color-yellow-light: var(--theme-catppuccin-yellow);
    --color-olive-light: var(--theme-catppuccin-green);
    --color-green-light: var(--theme-catppuccin-green);
    --color-teal-light: var(--theme-catppuccin-teal);
    --color-blue-light: var(--theme-catppuccin-blue);
    --color-violet-light: var(--theme-catppuccin-mauve);
    --color-purple-light: var(--theme-catppuccin-mauve);
    --color-grey-light: var(--theme-catppuccin-overlay2);
    --color-gold-light: var(--theme-catppuccin-yellow);
    --color-black: var(--theme-catppuccin-crust);
    --color-white: var(--theme-catppuccin-text);

    --color-primary: var(--theme-catppuccin-blue);

    --color-console-fg: var(--theme-catppuccin-text);
    --color-console-bg: var(--theme-catppuccin-base);

    --color-error-border: var(--theme-catppuccin-maroon);
    --color-error-bg: var(--theme-catppuccin-overlay0);
    --color-error-text: var(--theme-catppuccin-subtext1);

    --color-success-border: var(--theme-catppuccin-green);
    --color-success-bg: var(--theme-catppuccin-overlay0);
    --color-success-text: var(--theme-catppuccin-subtext1);

    --color-warning-border: var(--theme-catppuccin-orange);
    --color-warning-bg: var(--theme-catppuccin-overlay1);
    --color-warning-text: var(--theme-catppuccin-subtext1);

    --color-info-border: var(--theme-catppuccin-overlay0);
    --color-info-bg: var(--theme-catppuccin-surface0);
    --color-info-text: var(--theme-catppuccin-subtext1);

    --color-box-header: var(--theme-catppuccin-surface1);
    --color-box-body: var(--theme-catppuccin-surface0);

    --color-markup-code-block: var(--theme-catppuccin-surface2);

    --color-input-background: var(--theme-catppuccin-base);
    --color-input-border: var(--theme-catppuccin-surface1);
    --color-input-text: var(--theme-catppuccin-text);

    --color-card: var(--theme-catppuccin-surface0);

    --color-active: var(--theme-catppuccin-surface0);
    --color-menu: var(--theme-catppuccin-surface1);

    --color-button: var(--theme-catppuccin-overlay0);
    --color-light-border: var(--theme-catppuccin-surface1);
    --color-dark-border: var(--theme-catppuccin-overlay0);

    --color-diff-removed-row-bg: rgba(
        var(--theme-catppuccin-red),
        0.2
    ) !important;
    --color-diff-removed-row-border: rgba(
        var(--theme-catppuccin-red),
        0.2
    ) !important;
    --color-diff-removed-word-bg: rgba(
        var(--theme-catppuccin-red),
        0.4
    ) !important;

    --color-diff-added-row-bg: rgba(
        var(--theme-catppuccin-green),
        0.2
    ) !important;
    --color-diff-added-row-border: rgba(
        var(--theme-catppuccin-green),
        0.2
    ) !important;
    --color-diff-added-word-bg: rgba(
        var(--theme-catppuccin-green),
        0.4
    ) !important;

    --color-diff-inactive: var(--theme-catppuccin-surface1);

    --color-code-bg: var(--theme-catppuccin-surface0);
    --color-expand-button: var(--theme-catppuccin-surface1);
}

body {
    background-color: var(--theme-catppuccin-base);
    color: var(--theme-catppuccin-text);
}

.ui.table {
    color: var(--theme-catppuccin-text);
}

.repository-summary {
    background-color: var(--theme-catppuccin-surface0);
}

.ui.green.button {
    background-color: var(--theme-catppuccin-green);
    color: var(--theme-catppuccin-base);
}

.ui.red.button {
    background-color: var(--theme-catppuccin-red);
    color: var(--theme-catppuccin-base);
    border-color: var(--theme-catppuccin-overlay0);
}

.ui.basic.red.button {
    color: var(--theme-catppuccin-red);
}

.ui.negative.button {
    background-color: var(--theme-catppuccin-red);
    color: var(--theme-catppuccin-base);
}

.ui.basic.green.button {
    color: var(--theme-catppuccin-green);
}

.ui.breadcrumb {
    color: var(--theme-catppuccin-text);
}

.following.bar #navbar {
    background-color: var(--theme-catppuccin-blue) !important;
}

#navbar .item {
    color: var(--theme-catppuccin-surface0);
}

* {
    caret-color: var(--theme-catppuccin-text);
}

@media (prefers-color-scheme: dark) {
    .ui.red.label,
    .ui.red.labels .label {
        background-color: var(--theme-catppuccin-red) !important;
        border-color: var(--theme-catppuccin-red) !important;
        color: var(--theme-catppuccin-base) !important;
    }
    .ui.green.label,
    .ui.green.labels,
    .ui.basic.green.label {
        background-color: var(--theme-catppuccin-green) !important;
        border-color: var(--theme-catppuccin-green) !important;
        color: var(--theme-catppuccin-base) !important;
    }

    .repository.file.list #repo-files-table tr {
        background-color: var(--theme-catppuccin-base);
    }
    .repository.file.list #repo-files-table tr:hover {
        background-color: var(--theme-catppuccin-surface1) !important;
    }

    .ui.horizontal.segments > .segment {
        background-color: var(--theme-catppuccin-surface0);
    }

    .tag-code td.lines-type-marker,
    td.blob-hunk {
        color: var(--theme-catppuccin-text) !important;
    }

    .tag-code,
    .tag-code td {
        background: var(--theme-catppuccin-surface1) !important;
    }

    .tag-code td.lines-num {
        background-color: var(--theme-catppuccin-surface1) !important;
    }

    .chroma .sb {
        color: var(--theme-catppuccin-subtext1);
    }

    .chroma .nt {
        color: rgba(var(--theme-catppuccin-mauve), 0.7) !important;
    }

    .chroma .na {
        color: rgba(var(--theme-catppuccin-teal), 0.7) !important;
    }

    .chroma .nb {
        color: rgba(var(--theme-catppuccin-mauve), 0.7);
    }

    .chroma .s2 {
        color: rgba(var(--theme-catppuccin-teal), 0.7);
    }

    .chroma .si {
        color: rgba(var(--theme-catppuccin-peach), 0.6);
    }

    .chroma .nv {
        color: rgba(var(--theme-catppuccin-peach), 0.6);
    }

    .chroma .nx {
        color: var(--theme-catppuccin-text);
    }

    .chroma .nf {
        color: var(--theme-catppuccin-yellow);
    }

    .chroma .s {
        color: rgba(var(--theme-catppuccin-teal), 0.7);
    }
}