:root {
    /* Color used for the background */
    --color-bg: #FFF;

    /* Color used for the background of overlays. Ideally, this will be matched with a backdrop-blur */
    --color-bg-overlay: #FFFFFFDD;

    /* Color used for the text */
    --color-fg: #000;

    /* Color used for the accent */
    --color-accent: #E4010B;

    /* Color for the borders */
    --color-border-light: #E0E0E0;
    --color-border-dark: #000;

    /* Background of the selected text */
    --color-selection-bg: #E0E0E0;
    --color-selection-fg: var(--color-fg);

    /* Primary buttons */
    --color-btn-bg: #E4010B;
    --color-btn-bg-hover: #CB010A;
    --color-btn-fg: #FFF;
    --color-btn-fg-hover: #FFF;
}

/* Default theme */
.cp-theme-1 {}

.cp-theme-transparentbg {
    background-color: transparent;
}

/* Sticky header, Cookie Notice, Category Ancestor */
.cp-theme-2 {
    /* Color used for the background */
    --color-bg: #E4010B;

    /* Color used for the background of overlays. Ideally, this will be matched with a backdrop-blur */
    --color-bg-overlay: #E4010BDD;

    /* Color used for the text */
    --color-fg: #FFF;

    /* Color used for the accent */
    --color-accent: #FFF;

    /* Color for the borders */
    --color-border-light: #FFF;
    --color-border-dark: #cb010a;

    /* Primary buttons */
    --color-btn-bg: #111;
    --color-btn-bg-hover: #222;
    --color-btn-fg: #FFF;
    --color-btn-fg-hover: #FFF;
}

/* Category Child */
.cp-theme-3 {
    --color-bg: #FFF;
    --color-fg: #000;

    --color-btn-bg: #E0E0E0;
    --color-btn-bg-hover: #F0F0F0;
    --color-btn-fg: var(--color-fg);
    --color-btn-fg-hover: var(--color-btn-alt-fg);
}

/* Mobile menu */
.cp-theme-4 {
    --color-bg: #2C2C2C;
    --color-fg: #FFF;
    --color-bg-overlay: #2C2C2CEE;

    --color-btn-bg: #E4010B;
    --color-btn-bg-hover: #cb010a;
    --color-btn-fg: #FFF;
    --color-btn-fg-hover: #FFF
}

/* Navigation menu */
.cp-theme-5 {
    /* Color used for the background */
    --color-bg: #FFF;

    /* Color used for the background of overlays. Ideally, this will be matched with a backdrop-blur */
    --color-bg-overlay: #FFFFFFDD;

    /* Color used for the text */
    --color-fg: #000;

    /* Color used for the accent */
    --color-accent: #E4010B;

    /* Color for the borders */
    --color-border-light: #E0E0E0;
    --color-border-dark: #000;

    /* Background of the selected text */
    --color-selection-bg: #E0E0E0;
    --color-selection-fg: var(--color-fg);

    /* Primary buttons */
    --color-btn-bg: #FFF;
    --color-btn-bg-hover: #FFF;
    --color-btn-fg: #000;
    --color-btn-fg-hover: #CB010A;
}