/* I do not know what this file does, but if it is deleted, the shop crashes. SO DON'T TOUCH THIS */

/*
#####
BASE
#####
 */

:root {
    --border-radius-xl:8px;
    --border-radius-lg:4px;
    --border-radius-sm:2px;
    --icon-lg:48px;
    --icon-md:32px;
    --icon-sm:24px;
    --be-blue-gray:#F7F8FA;
    }

/*
#####
RESETS
#####
 */


.container {
    max-width:1440px;
}

hr {
    border-top:1px solid var(--be-blue-gray);
}

/*
#####
HELPER
#####
 */

.mix-blend-darken, .mix-blend-darken img {
    mix-blend-mode: darken;
}

.no-padding .dzm-ps-track {
    padding:0 !important;
}


/*
#####
ITEMBOX
#####
 */

.niu-itembox-option--has-border.productbox-inner, .niu-card-style--border {
    border:1px solid var(--be-blue-gray) !important;
}



/*
#####
HEADER
#####
 */

header {
    border-bottom:none;

    .niu-inputgroup-bordered, .niu-input-group.niu-header-search {
        border-top: 1px solid var(--gray-light) !important;
        border-bottom: 1px solid var(--gray-light) !important;
        border-right: 1px solid var(--gray-light) !important;
        border-left: 1px solid var(--gray-light) !important;
        border-radius:var(--border-radius-lg) !important;
    }

    .niu-categories-color-wrap {
        border-bottom:1px solid var(--be-blue-gray) !important;
        border-top: 1px solid var(--be-blue-gray) !important;
    }

    .niu-nav-icon-container i {
        color:var(--primary);
    }

    .niu-nav-icon-headline strong {
        font-weight:500 !important;
    }

}


/*
#####
CATEGORY PAGE
#####
 */

.niu-cat-wrapper .dzm-btn-group-subcats {
    background-color:var(--be-blue-gray);
}

/*
#####
CUSTOM ICONS
#####
 */


.be-icon {
    height:var(--icon-lg);
    width:var(--icon-lg);
    display:block;
}

.be-icon-energy-box::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-energy-box.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}

.be-icon-energy-home::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-energy-home.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}

.be-icon-green-home::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-green-home.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}


.be-icon-light-bulb::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-light-bulb.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}

.be-icon-roof-work::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-roof-work.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}

.be-icon-save-money::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-save-money.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}

.be-icon-setup::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-setup.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}

.be-icon-sun-energy::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-sun-energy.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}

.be-icon-energy-box-red::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-energy-box-red.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}

.be-icon-energy-home-red::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-energy-home-red.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}

.be-icon-green-home-red::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-green-home-red.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}


.be-icon-light-bulb-red::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-light-bulb-red.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}

.be-icon-roof-work-red::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-roof-work-red.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}

.be-icon-save-money-red::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-save-money-red.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}

.be-icon-setup-red::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-setup-red.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}

.be-icon-sun-energy-red::before {
    content: "";
    display: block;
    background-image: url(../base/images/icons/icon-sun-energy-red.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width:var(--icon-lg);
    height:var(--icon-lg);
}


/*
#####
FOOTER
#####
 */

.niu-footer-topbar-headline {
    color:#fff;
}

.niu-footer-topbar {
    background-color: var(--secondary) !important;
}



/*
#####
OPC PLUGINS
#####
 */


.dzm-hl-wrapper h6.p {
    margin-bottom:.25rem;
}


/*
#####
SOLAR MWST PLUGIN
#####
 */

.ribbon.ribbon-solar-mwst.has-ribbon {
    top:2rem !important;
}