/**
	!!! ATTENTION - This file will not be loaded if there is a file with the same name in the OVERRIDED THEME
		- if we want to load _theme_variables for new theme and NOT OVERRIDE the current file, 
		- we should name the theme variables file like this ex: _theme_variables_designplus
	If we add a variable into a theme, we should add the variable here and explain what is used for.
*/
@charset "utf-8";

/* Define theme color as variable */
:root {
	--header-override-color: #eee;
	--header-icons-text-override-color: #000;
	--header-icons-background-override-hover-color: #000;
	--header-topbar-background-color: #333;
	--header-topbar-text-color: #eee;
	--header-topbar-text-color-hover: #fff;
	/* The background color of the page, defaults to transparent */
	--main-body-background-color: var(--main-bg-color, var(--main-override-body-background-color, #fffff9));
	--main-body-text-color: var(--main-override-body-text-color, #333333);
	
	/* The background color of the different elements/boxes defaults to #fff */
	--main-elements-background-color: var(--main-override-elements-background-color, #fff);
	
	/* Main color theme */
	--main-color: var(--main-override-color, #383b42);
	
	/* Text in main pane of pages. This will be on white background */
	--main-text-color: var(--main-text-override-color, var(--main-color));
	
	--main-card-color: var(--main-override-card-color, var(--main-color));
	--main-card-text-color: var(--main-override-card-text-color, var(--header-text-color));
	
	/* Background colors of the page. complete page and/or just the central content */
	--main-background-color: var(--main-override-background-color, #fff);
	
	/* List separator color. Used in between elements in lists dropdowns etc */
	--main-list-separator-color: var(--main-override-list-separator-color, var(--main-color, #eee));
	
	/* Secondary text. Default for menus, header and footer */
	--secondary-text-color: var(--secondary-text-override-color, #fff);
	--secondary-button-background-color: var(--main-card-color, #6c757d);
	--secondary-button-background-color-hover: var(--main-card-color, #7e878f);
	
	/* Header text. Default for page headers H1, H2, H3*/
	--main-header-text-color: var(--main-color, var(--main-color));
	--main-inverted-header-text-color: var(--secondary-text-color, #fff);
	
	/* Hover color for buttons and stuff. Not used alot, but possible to override where it looks weird. */
	--main-hover-color: var(--main-hover-override-color, #5bf);
	
	/* Possible override for header */
	--header-color: var(--header-override-color, var(--main-color));
	--header-text-color: var(--header-text-override-color, var(--secondary-text-color));
	
	/* Possible override for menu */
	--menu-override-hover-color: #999;
	--menu-color: var(--menu-override-color, var(--main-color));
	--menu-hover-color: var(--menu-override-hover-color, var(--menu-color));
	--menu-text-color: var(--menu-text-override-color, var(--secondary-text-color));
	--menu-hover-text-color: var(--menu-override-hover-text-color, var(--menu-text-color));
	--menu-dropdown-color: var(--menu-override-dropdown-color, var(--menu-color));
	--menu-seperator-color: var(--menu-override-seperator-color, var(--menu-color));
	--menu-article-text-color: var(--menu-article-text-override-color, var(--main-body-text-color));
	/*--menu-dropdown-text-color: var(--menu-override-dropdown-text-color, var(--menu-text-color));*/
	
	--main-button-primary-color: #0754af;
	
	--price-before-discount-strike-color: rgba(111, 161, 255, 0.5);
	
	/* Override icons in the header */
	--header-icons-text-color: var(--header-icons-text-override-color, var(--header-text-color));
	--header-icons-background-color: var(--header-icons-background-override-color, var(--header-color));
	--header-icons-text-hover-color: var(--header-icons-text-override-hover-color, var(--header-color));
	--header-icons-background-hover-color: var(--header-icons-background-override-hover-color, var(--header-text-color));
	
	
	/* Prev selection in small screen menu. Should be faded menucolor */
	--menu-entered-color: var(--menu-entered-override-color, #555);
	--menu-entered-text-color: var(--menu-entered-text-override-color, #eef6ff59);
	
	/* Possible override for footer */
	--footer-color: var(--footer-override-color, var(--main-color));
	--footer-text-color: var(--footer-text-override-color, var(--secondary-text-color));
	
	
	/* Variables for details lists, e.g spesifications in product item */
	--detaillist-header-background-color: var(--detaillist-override-header-background-color, var(--main-color));
	--detaillist-header-text-color: var(--detaillist-override-header-text-color, var(--header-text-color));
	--detaillist-list-border-color: var(--detaillist-override-list-border-color, var(--main-list-separator-color));
	
	
	--table-header-background-color: #eee;
	--table-header-text-color: #000;
	
	
	/* Inverted headers */
	--main-inverted-header-backgroundcolor: var(--main-override-inverted-header-backgroundcolor, var(--main-elements-background-color));
	--main-inverted-header-color: var(--main-override-inverted-header-color, var(--main-body-text-colorcolor));
	
	
	--main-link-color: var(--main-override-link-color, var(--main-color));
	--main-link-hover-color: var(--main-override-link-hover-color, var(--main-color));
	--main-fulltile-text-color: var(--main-override-fulltile-text-color, var(--main-card-text-color));
	--main-fulltile-text-hover-color: var(--main-override-fulltile-text-hover-color, var(--main-card-text-color));
	--main-fulltile-color: var(--main-override-fulltile-color, var(--main-card-color));
	
	
	/* Wishlist overrides */
	--main-wishlist-color: var(--main-override-wishlist-color, rgba(0, 0, 0, 0));
	--main-wishlist-text-color: var(--main-override-wishlist-text-color, var(--main-card-text-color));
	--main-wishlist-text-color: var(--header-icons-background-hover-color, var(--main-card-text-color));
	--main-wishlist-underlayer-color: 52, 52, 52;
	--main-wishlist-underlayer-opacity: 0.06;
	
	--qtab-mobile-primary-font-size: 80%;
	--qtab-mobile-primary-padding: 0.5em 1em;
	--qtab-mobile-primary-margin: 0;
	
	--form-element-background-color: white;
	--form-element-text-color: black;
	
	--main-font-family: var(--main-override-font-family, 'PT Sans', Arial, Helvetica, sans-serif);
	--main-font-size: 14px;
	--icon-font-family: "Font Awesome";
	--box-shadow: 0px 0px 7px -3px rgba(0, 0, 0, 0.18);
	--box-shadow-hover: 0px 0px 15px -3px rgba(0, 0, 0, 0.27);
	
	/** top search bar **/
	--top-search-bar-background-color: #fafafa;
	--top-search-bar-text-color: #333;
	--diabled-element-background-color: #ffffffab;
	
	/** Stock status */
	--main-stock-status-underlayer-color: 128, 128, 128;
	--main-stock-status-underlayer-opacity: 0.06;
	
	/* Stock colors for pickuppoints */
	--notinstock-color: #b22222;
	--instock-color: #47b821;
	--fewinstock-color: #ff8c00;
	--pickuppointsinfo-icon-color: #1b74c9;
	
	/* Cards */
	--tiles-default-background: #ccc;
	--tiles-default-color: #000023;
	--tiles-default-background-hover: #ddd;
	--tiles-default-color-hover: #ccc;
	--tiles-default-border-color: #c9c9c9;
	
	/* Footer */
	--main-footer-font-link-hover: #777;
	
	
	/* Added variables from Design Plus */
	--aticle-h1-background-color: #303030;
	
	--main-bg-color: #eeeeee;
	
	--main-button-buy-color: #ffffff;
	--main-button-buy-color-hover: #ffffff;
	
	--main-button-danger-color: #ff5b4e;
	--main-button-danger-color-hover: #f25043;
	--main-button-danger-font-color: #ffffff;
	--main-button-danger-font-color-hover: #ffffff;
	
	--main-button-info-color: #00bcd4;
	--main-button-info-color-hover: #009aae;
	--main-button-info-font-color: #fffff;
	--main-button-info-font-color-hover: #ffffff;
	
	--main-button-primary-color-hover: #4695ff;
	--main-button-primary-font-color: #f3fbff;
	--main-button-primary-font-color-hover: #ffffff;
	
	--main-button-secondary-color: #7d8a93;
	--main-button-secondary-color-hover: #626c73;
	--main-button-secondary-font-color: #ffffff;
	--main-button-secondary-font-color-hover: #ffffff;
	
	--main-button-success-color: #2ed8b6;
	--main-button-success-color-hover: #23bd9e;
	--main-button-success-font-color: #ffffff;
	--main-button-success-font-color-hover: #ffffff;
	
	--main-button-warning-color: #2ca5fc;
	--main-button-warning-color-hover: #2c9efc;
	--main-button-warning-font-color: #212529;
	--main-button-warning-font-color-hover: #212529;
	
	--main-footer-color: #001a33;
	--main-footer-font: #8a8a8a;
	--main-footer-font-hover: #ffffff;
	--main-footer-font-link: #75b3ff;
	--main-footer-header-font: #ffffff;
	
	--main-header-bg-color: #ffffff;
	--main-header-font-color: rgba(0, 0, 0, 0.8);
	--main-header-font-color-hover: rgba(0, 0, 0, 1);
	
	--main-header-menu-bg-color: #0071ce;
	--main-header-menu-font-color: #f3fbff;
	--main-header-menu-font-color-hover: #ffffff;
	
	--main-header-submenu-back-bg: rgba(0, 0, 0, 0.09);
	--main-header-submenu-bg-color: #ffffff;
	--main-header-submenu-bg-hover: #f9f9f9;
	--main-header-submenu-border-color: #ccc;
	--main-header-submenu-font-color: #000000;
	--main-header-submenu-font-color-hover: #000000;
	--main-header-submenu-title-bg: rgba(0, 0, 0, 0.03);
	
	--main-link-color-hover: #0c4b8e;
	
	--main-page-content-background-color: #fff;
	--main-page-crumbs-background-color: #d7d7d7;
	
	--product-descr-font-color: #868383;
	--product-discount-color: #005fc6;
	--product-discount-font-color: #ffffff;
	--product-discount-shadow-color: #0f5398;
	--product-subtitles-active: #14679b;
	--product-subtitles-border-thickness: 2px;
	--product-title-font-color: #1b1b1b;
	--product-title-font-color-hover: #000000;
	
	--title-font-family: "Assistant", sans-serif !important;
	
	--wishlist-active-color: #0072ff;
	--wishlist-font-color: #444444;
	
	
	/* Cookie consent */
	--cookie-icon-bg: var(--main-link-color);
	--cc-bg: #ffffff;
	--cc-text: var(--main-text-color);
	
	--cc-btn-primary-bg: var(--main-link-hover-color);
	--cc-btn-primary-text: var(--menu-text-color);
	--cc-btn-primary-hover-bg: var(--main-link-color);
	
	--cc-btn-secondary-bg: var(--main-color);
	--cc-btn-secondary-text: var(--header-text-color);
	--cc-btn-secondary-hover-bg: var(--main-color);
	
	--cc-toggle-bg-off: #667481;
	--cc-toggle-bg-on: var(--cc-btn-primary-bg);
	--cc-toggle-bg-readonly: #343e45;
	--cc-toggle-knob-bg: var(--cc-cookie-category-block-bg);
	--cc-toggle-knob-icon-color: var(--cc-bg);
	
	--cc-cookie-category-block-bg: #eee;
	--cc-cookie-category-block-bg-hover: #eee;
	
	--cc-section-border: #eee;
	--cc-block-text: var(--main-text-color);
	--cc-cookie-table-border: #eee;
	--cc-overlay-bg: #fff;
	
	--cc-webkit-scrollbar-bg: #eee;
	--cc-webkit-scrollbar-bg-hover: var(--main-button-primary-color);
	
	--cc-font-family: var(--main-font-family);
	--cc-font-size: var(--main-font-size);
	--cc-z-index: 2147483647;
	--cc-border-radius: .45rem;
	--cc-btn-primary-hover-text: var(--cc-btn-primary-text);
	--cc-btn-secondary-hover-text: var(--cc-btn-secondary-text);
	--cc-btn-border-radius: 0.375rem;
	--cc-overlay-opacity: .85;
	--cc-consent-modal-box-shadow: 0 0.625rem 1.875rem rgba(2, 2, 3, 0.28);
	--cc-bar-max-width: 32rem;
	
	--checkout-progress-line: var(--main-link-color);
	--checkout-progress-line-alt: #ddd;
	
	--country-selector-bg-color: #fff;
	--country-selector-label-color: #333;
	
	

}