/*
Theme Name: Customized theme for WOCA 
Theme URI: https://brightsolutions.dk
Description: Child theme for the BrightSky Master theme, designed for WOCA
Author: Tommy Martinsen
Author URI: https://brightsolutions.dk
Template: brightsky-master
Version: 0.0.09
Text Domain: brightsky-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
*/

html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
	font-family: var(--primary-font);
}
.page {
	font-family: var(--primary-font);
}

/* HEADER STYLE 
	================================================== */
.sp-secondrow-right-content.main-navigation {
    display: flex;
}
	header#masthead, .sp-topbar {
		color: white;
		text-decoration: none;
		background-color: var(--default-color);
		font-size: var(--default-font-size);
		font-weight: var(--default-font-weight);
	}
	.sp-topbar {
		width: 100%;
		border-bottom: 1px solid var(--wocastroke);
	}
	.sp-topbar a {
		color: white;
		text-decoration: none;
	}
	.sp-topbar a:hover {
		color: white;
	}
	.sp-topbar-content {
		width: var(--default-page-width);
		max-width: var(--max-default-page-width);
		margin-left: auto;
		margin-right: auto;
		display: flex;
		justify-content: space-between;
	}
	.sp-topbar-text {
		display: flex;
		gap: 10px;
		font-size: var(--default-font-size);
		font-weight: var(--default-font-weight);
	}
	.sp-search-button {
		display: flex;
		gap: 5px;
		justify-items: center;
	}
	@media screen and (min-width: 768px) {
	.sp-mobile-search-symbol {
		display: none;
	}
}
	.sp-topbar-actions {
		display: flex;
		gap: 25px;
	}
	ul#ffh-menu {
		display: none;
	}
	@media screen and (min-width: 768px) {
		ul#ffh-menu {
			display: flex;
		}
	}
.sp-header-secondrow {
    height: 80px;
    font-weight: var(--default-font-weight);
    border-bottom: 1px solid var(--default-stroke-color);
    align-content: center;
	background-color: var(--bg-dark-color);
	color: white;
	width: 100%;
}
.sp-header-secondrow a {
	text-decoration: none;
	color: white;
}
.sp-header-secondrow-content {
    height: 100%;
	width: var(--default-page-width);
	max-width: var(--max-default-page-width);
	margin-left: auto;
	margin-right: auto;
	display: flex;
	justify-content: space-between;
}
.sp-secondrow-left-content {
	display: flex;
	gap: 30px;
}
nav#site-navigation {
	border-top: unset;
}
.sp-header-thirdrow {
	padding-top: 5px;
	padding-bottom: 5px;
}
@media screen and (min-width: 768px) {
.sp-header-thirdrow {
    height: 50px;
    border-bottom: 1px solid var(--bg-dark-color);
	padding-top: 15px;
}
	.sp-menu-section {
		width: unset;
		max-width: unset;
	}
}
.sp-header-thirdrow-content {
	width: var(--default-page-width);
	max-width: var(--max-default-page-width);
	margin-left: auto;
	margin-right: auto;
	height: 100%;
}
.menu-section {
	width: auto;
    grid-column: span 5;
    align-content: center;
}
.sp-actual-menu ul > li a, .sp-actual-menu ul > li {
	color: white;
}

.sp-infosection {
    grid-column: span 5;
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 30px;
} 
.sp-outer-mainmenu-container a {
	text-transform: uppercase;
	font-family: var(--primary-font);
    font-size: var(--p-regular-size);
    line-height: var(--p-regular-lineheight);
    font-weight: var( --p-regular-weight);
	
}
.sp-infosection-menu .menu-item a, .sp-infosection-menu .menu-item a:visited {
    color: white;
}
.main-navigation ul {
	background-color: var(--primary-color);
}
.main-navigation ul li > ul > li a {
	color: var(--wocadark);
}
.menu-item-has-children {
    margin-right: 20px;
}
.menu-item-has-children>a {
	padding-right: 0px;
		padding-bottom: 0px;
}
.site-branding {
	width: max-content;
	max-width: unset;
}
.site-branding img {
    height: 43px;
}

.sp-infosection-menu ul {
    list-style: none;
    margin: unset;
}
@media screen and (max-width: 37.5em) {
.main-navigation ul {
	background-color: white;
	padding: 10px;
	border-radius: var(--default-border-radius);
	box-shadow: var(--box-shadow-light);
}
header#masthead {
z-index: 999;
position: relative;
}
}
/* langage selector */
.sp-langselector-outer a {
    color: var(--ringsted-text);
    position: relative;
    display: flex;
    gap: 10px;
}



.sp-currentlang {
    cursor: pointer;
	display: flex;
	gap: 10px;
}

.sp-langselector-listbox {
    display: none;
    position: absolute;
    top: calc(100% + 5px);
    background-color: white;
    padding: 15px;
    border-radius: 15px;
    width: max-content;
}
.sp-infosection img.sp-langflag {
    width: 24px;
}

.sp-infosection .sp-langselector-item {
    display: flex;
    gap: 10px;
}

.sp-langselector-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: max-content;
}
/* =========== FIBOSEARCH ======================= */
.sp-mobile-search-symbol {
    display: flex;
    flex-direction: column;
    justify-content:center;
}
.sp-mobile-search-symbol svg {
    width: 50px;
}
.sp-mobile-search-symbol .sp-searchicon-text {
        display: none;
    }
.dgwt-wcas-search-form {
    top: calc(100% + 45px) !important;
}
.dgwt-wcas-search-input {
    border: 1px solid var(--ringsted-bg-dark) !important;
    border-radius: unset !important;
    width: 98% !important;
    margin-left: 1% !important;
}
@media screen and (min-width: 768px) {
    .sp-mobile-search-symbol {
        display: none;
    }
.dgwt-wcas-search-input {
    border-radius: 30px !important;
}
.dgwt-wcas-search-form {
    position: absolute;
    top: calc(100% + 35px) !important;
}

.dgwt-wcas-ico-magnifier, 
.dgwt-wcas-ico-magnifier-handler, 
html:not(.dgwt-wcas-overlay-mobile-on) .dgwt-wcas-search-wrapp.dgwt-wcas-layout-icon {
    max-width: unset;
    width: auto;
}
a.dgwt-wcas-search-icon.js-dgwt-wcas-search-icon-handler {
    width: unset;
}
.searchicon-text {
    display: block;
}
.dgwt-wcas-search-form .sp-searchicon-text {
    display: none;
}
.dgwt-wcas-preloader.dgwt-wcas-close {
    top: calc(100% + 7px);
}
}

/* ========= MISC WORDPRESS STYLING =========*/
.sp-wp {
    width: var(--default-page-width);
	max-width: var(--max-default-page-width);
    margin-left: auto;
    margin-right: auto;
    padding-top: 50px;
}
/* ========= FOOTER STYLE ------------- */
.site-footer {
	background-color: var(--default-color);
	
}
.sp-footer-standardcolumns-left-upper, .sp-footer-standardcolumns-right-upper {
	height: 400px;
}
.sp-footer-standardcolumns-left {
	grid-column: span 3;
	
}
.sp-footer-standardcolumns-right {
	grid-column: span 9;
}
.sp-footer-standardcolumns-right-upper, .sp-footer-standardcolumns-right-lower {
	display: flex;
	justify-content: space-between;
}
ul#footer-menu-4 {
    display: flex;
    gap:  30px;
}
/* ===== PRODUCT PAGE ===== */
.sp-product-features {
    margin-top: 20px;
    border-top: 1px solid var(--default-stroke-color);
}
.sp-product-features ul {
    list-style: none;
	padding-left: 0;
	margin-left: 0;
}
.sp-product-features ul li {
	display: flex;
	gap: 15px;
	margin-bottom: 10px;
}
.sp-product-features ul li::before {
    content: url("assets/icons/feature-checkmark.svg");
	width: 15px;
}
.sp-swatches {
	flex-wrap: nowrap;
	overflow-x: auto;
}
@media screen and (min-width: 768px) {
	 .sp-swatches {
		display: grid;
		 grid-template-columns: repeat(5, 1fr);
		 width: 600px;
		 grid-gap: 25px 25px;
}
}
.sp-swatch {
	width: 25%;
	flex-shrink: 0;
	padding: 10px;
}
@media screen and (min-width: 768px) {
	.sp-swatch {
	width: 100%;
	padding: 10px;
		font-size: 12px;
		font-weight: 600;
}	
}
.sp-swatch-image {
	aspect-ratio: 1 / 1;
	width: 100%;
}
.sp-swatch img {
	border-radius: 50%;
}
.sp-sizes {
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
}
.sp-var-size {
	background-color: unset;
	color: var(--default-text-color);
	padding: 25px 25px;
	font-weight: 600;
}
.sp-prodpage-button {
	margin-top: 25px;
	width: 100%;
	padding: 25px;
}
.sp-product-details {
	background-color: var(--light-background);
	padding: 15px;
}
/* ========== TEEMP TEMP  - FILTER FAKE ================= */
.entry-content:has(.filters) {
    display: grid;
    grid-template-columns: 1fr 4fr;
    width: var(--default-page-width);
    margin-left: auto;
    margin-right: auto;
}
.filters {
    width: unset;
}
.sp-repeater.sp-product-items {
    width: unset;
}
.care.product { 
	width: unset !important;
	display: block;
}
.sp-filter-dropdown.open label {
	padding: 1px;
}