/* ====================================================
    UNIKUM PYRAMID 4 - DESIGN B - Nyhléns Hugosons AB
    PDH, 2026-01-07
==================================================== */

/* Variabler */
:root {
    --red: #E4002B;
    --light-grey: #3F4E60; 
    --dark-grey: #3D3D3D;
    --black: #000000;
    --white: #FFFFFF;

/* ====================================================
Sidhuvud
==================================================== */
/* Bakgrundsfärg */
.header #top-header-container {
	background-color: var(--white);
}
/* Logga */
.header #top-header-container #Logo { 
	max-width: none; 
} 
.header #top-header-container #Logo #imgLogo { 
	padding-left: 0%;
}
.header #top-header-container #Logo #imgLogo {
	max-height: 100px;
}
.header #top-header-container #Logo {
	display: flex;
	justify-content: center;
	width: 80%;
}

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

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

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


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

.header #bottom-header-container .nav-menu ul.menu li.active>span, .header #bottom-header-container .nav-menu ul.menu li.active>a {
	color: white;
}
/* Text-färg*/ 
.header 
#bottom-header-container 
.nav-menu ul li a { 
	color: var(--white); 
}
.header #bottom-header-container .nav-menu ul li .dropdown li span, .header #bottom-header-container .nav-menu ul li .dropdown li a {
background-color: #E4002B;
}

.header #bottom-header-container .nav-menu .menu li span, .header #bottom-header-container .nav-menu .menu li a {
color: white;
}

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

/* Textfärg */
.nav-wrapper,
.nav-wrapper a,
.nav-wrapper .close-btn::before, 
#SidePanel, 
.aside .nav-tree li a,
.aside .nav-tree li a.current {
    color: var(--white);
}

/* Textfärg vid hover */
.nav-wrapper a:hover, 
#SidePanel:hover, 
.aside .nav-tree li a:hover,
.aside .nav-tree li a.current:hover {
    color: var(--white);
}

/* Backgroundsfärg - hover */
.aside .nav-tree li:hover, 
.aside .nav-tree li div:hover {
    background-color: var(--red); 
}


/* ====================================================
Sidfot
==================================================== */
/* Bakgrundsfärg */
footer {
    background-color: var(--white);
}

/* Textfärg */
footer,
footer a {
    color: var(--red);
}

footer a:hover,
footer a:focus {
    color: #3F4E6D; 
}


/* ====================================================
Tabellhuvud
==================================================== */
/* Textfärg */
.table .header .cell,
.table .header .cell.sort {
    color: #A6192E;
}


/* ====================================================
Formulär
==================================================== */
/* Textfärg */
.form-wrapper .form-group {
    color: #A6192E;
}


/* ====================================================
Knappar
==================================================== */
/* Spara
   Logga in
   Skicka
   Skapa konto */
.btn-action {
    background-color: #768AA4;
    border-color: #768AA4;
}
.breadcrumbs-section .breadcrumbs .breadnolink, .breadcrumbs-section .breadcrumbs span {
color: #3d3d3d;
}

}