/* ====================================================
    UNIKUM PYRAMID 4 - ELINE DESIGN A
    "DMR", "DATUM (2021-11-26)"
==================================================== */

/* Variabler */
:root {
    --white: #FFFFFF;
    --black: #000000;
    --primary: #F5F5F5;
}

/* ====================================================
Globalt
==================================================== */
body {
    color: var(--black);
}

/* ====================================================
Varukorg
==================================================== */
/* Tom varukorg */
/* Bakgrundfärg */
.empty .cart-header {
    background-color: var(--black);
}

/* Ikonfärg */
.empty .cart-header::before,
.empty .cart-open-btn::before {
    color: var(--white);
}

/* Varukorg med artiklar */
/* Bakgrundfärg */
.cart-header {
    background-color: var(--black);
}

/* Ikonfärg */
.cart-header::before,
.cart-open-btn::before {
    color: var(--primary);
}

/* Antal bakgrundsfärg */
.cart-header .cartquantity .quantity,
.cart-open-btn .quantity,
.scrolled .cart-open-btn .quantity:not(.empty) {
    background-color: var(--white);
    color: var(--black);
}

/* ====================================================
Meny
==================================================== */
/* Bakgrundfärg */
.nav-menu {
    background-color: var(--white);
}

/* Textfärg */
.nav-menu li span,
.nav-menu li a,
.nav-menu .close-btn::before,
.header-icons a,
.scrolled .header-icons a {
    color: var(--black);
}

/* Textfärg vid hover */
.nav-menu li.level1:hover > a,
.nav-menu li.level1:hover > span,
.nav-menu li.level1.active_last > a,
.nav-menu li.level1.active_last > span,
.nav-menu li.level1.active > a,
.nav-menu li.level1.active > span,
.nav-menu .close-btn:hover::before,
.header-icons a:hover
.scrolled .header-icons a:hover {
    color: var(--black);
}

/* ====================================================
Navigeringsträd (produktträd)
==================================================== */
/* Bakgrundfärg */
.nav-wrapper,
.nav-tree .level1 > ul {
    background-color: var(--white);
}

/* Textfärg */
.nav-wrapper,
.nav-wrapper a,
.nav-wrapper .close-btn::before {
    color: var(--black);
}

/* Textfärg vid hover */
.nav-wrapper a:hover {
    color: var(--black);
}

/* ====================================================
Huvud sida
==================================================== */
.prodlist-header-image-wrapper {
    width: 100%;
}
 
.list_image {
    width: 100%;
}


/* ====================================================
Sidhuvud
==================================================== */
.header,
.scrolled .logo {
    background-color: var(--white);
}

/* ====================================================
Sidfot
==================================================== */
footer {
    background-color: rgba(#F5F5F5, 0.6);
}

footer .footer-inner > div {
    background-color: rgba(#F5F5F5, 0.6);
}

/* ====================================================
Filtrering
==================================================== */
.filters {
    background-color: rgba(#F5F5F5, 0.6);
}

/* ====================================================
Tabellhuvud
==================================================== */
.table .header {
    background-color: var(--white);
}

/* ====================================================
Formulär
==================================================== */
.form-wrapper {
    background-color: var(--primary);
}

/* ====================================================
Knappar
==================================================== */
button, .fw-button, .buttonColumn input {
	background-color: (var(--black) !important;
    border-color: var(--black) !important;
    color: var(--white);!important;
}



@media screen and (min-width: 951px) {
    .nav-tree .level1 li {
        display: flex !important;
        flex-direction: column;
    }
}