reichelt.de dark mode by s-light

/* ==UserStyle==
@name           reichelt.de dark mode
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    reichelt website in dark/night mode
@author         Stefan Krüger s-light.eu
==/UserStyle== */
@-moz-document domain("reichelt.de") {
    /* global */
    :root {
        --bg: black;
        --bg-light: hsl(250, 100%, 10%);
        --bg-highlight: hsl(250, 100%, 30%);
        --bg-highlight2: hsl(250, 100%, 50%);
        --bg-gradient: linear-gradient( to bottom,
        var(--bg-highlight),
        var(--bg-highlight2));
        --bg-gradient-dark: linear-gradient( to bottom,
        var(--bg-light),
        var(--bg-highlight));

        --text: hsl(42, 65%, 50%);
        --text-highlight: hsl(170, 100%, 50%);

        --back-color-2: transparent;
    }

    html,
    body {
        background-color: var(--bg);
        color: var(--text);
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        color: var(--text);
    }

    a {
        color: inherit;
    }

    select {
        border-color: var(--bg-highlight2);
        background-color: var(--bg-highlight);

        color: inherit;
    }

    .mfp-bg {
        background: inherit;
        filter: opacity(99%);
    }

    .mfp-figure::after {
        box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
        background: inherit;
    }


    .stickyheader {
        background: var(--bg-gradient-dark);
    }

    .searcharea select,
    .searcharea input {
        background: inherit;
        color: inherit
    }

    .breadcrumb {
        color: inherit;
    }

    #al_pagetitle .al_title_xofy {
        color: inherit;
    }

    .article .priceinfodiv {
        color: inherit;
    }

    #av_price_discount td {
        border-right: 1px solid var(--text);
    }

    #av_articletext {
        color: inherit;
    }

    .av_fontnormal {
        color: inherit;
    }


    .article .av_propview {
        color: inherit;
    }

    .article .av_propview:nth-of-type(2n+1) {
        background-color: var(--bg-light);
    }

    .article .av_inbasket_amount input {
        border-color: var(--text-highlight);
        color: inherit;
        background-color: inherit;
    }

    .quantity-button {
        border-color: var(--bg-highlight2);
        background-color: var(--bg-highlight);
        background-image: var(--bg-gradient);
    }


    .backLightGrey {
        background-color: inherit;
    }

    .backDarkGrey {
        background-color: var(--bg-light);
    }

    .oopen:nth-of-type(2n) {
        background-color: var(--bg-light);
    }

    .open-modal {
        background: hsla(0, 0%, 0%, 0.4);
    }
}