/**
 * Theme Name: Bienen-Studio (Storefront Child)
 * Template: storefront
 */

/** Settings */

:root {
	/*
	--color__birght:#eeb;
	--color__bright:#fe8;
	--color__bright:#fff888;
	*/
	--color__bright:#fec;
	--color__bright-2:#ccc;
	--color__dark:#333;
	--color__dark-2:#0f0500;
	--color__splash:#f80;
	--color__splash--light:#fc4;
	--color__splash--light--transp:#fc48;
	--color__splash--dark:#c40;
	--color__splash--dark--transp:#c408;
	--color__splash--dark-x:#310;

	--color__base:var(--color__bright);
	--color__base-2:#fff;
	--color__contrast:var(--color__dark);
	--color__primary:var(--color__splash);
	--color__primary--light:var(--color__splash--light);
	--color__primary--light--transp:var(--color__splash--light--transp);
}

@media (prefers-color-scheme:dark) {
	:root {
		--color__base:var(--color__dark-2);
		--color__base-2:var(--color__splash--dark-x);
		--color__contrast:var(--color__bright-2);
	}
}

/** Base */

body {
	background-color:var(--color__base);
	color:var(--color__contrast);
}

/*
@media (prefers-color-scheme:dark) {
	:is(h1, h2, h3, h4, h5, h6) {
		color:#ccc;
	}
}
*/
h1, h2, h3, h4, h5, h6 {
	color:var(--color__contrast);
}

/* Links, Inputs, Forms */

a {
	color:var(--color__primary);
}

a:focus,
button:focus,
.button.alt:focus,
input:focus,
textarea:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus {
	outline-color:var(--color__primary);
}

input[type=text],
input[type=number],
input[type=email],
input[type=tel],
input[type=url],
input[type=password],
input[type=search],
textarea,
.input-text {
	background-color:var(--color__primary--bright--transp);
}

table:not( .has-background ) th {
	background-color:var(--color__base);
	color:var(--color__contrast);
}

.woocommerce-tabs ul.tabs li.active a,
ul.products li.product .price,
.onsale,
.wc-block-grid__product-onsale,
.widget_search form:before,
.widget_product_search form:before {
	color:var(--color__dark);
}




/** Header */

@media (min-width:768px) {
	.site-header .site-branding {
		position:relative;
		left:50%;
		top:-10px;
		transform:translateX(-50%);
	}
	.storefront-secondary-navigation .site-header .site-branding {
		width:auto;
	}

	.home.blog .site-header,
	.home.page:not(.page-template-template-homepage) .site-header,
	.home.post-type-archive-product .site-header {
		margin-bottom:8em;
	}
	@media (prefers-color-scheme:dark) {
		.site-header {
			border-bottom-color:var(--color__dark);
		}
	}
}

/* Logo */

.site-branding {
	width:auto;
}

.site-logo-link,
.custom-logo-link {
	/*
	clip-path:polygon(25% 5%, 75% 5%, 97% 26%,100% 50%, 75% 95%, 24% 95%,-1% 50%,3% 26%);
	clip-path:polygon(25% 5%, 76% 4%, 98% 26%,102% 50%, 75% 95%, 25% 97%,-1% 50%,3% 26%);
	*/
	/* Best
	clip-path:polygon(27% 5%, 74% 5%, 97% 26%,103% 50%, 77% 95%, 26% 95%,0% 50%,4% 26%);
	*/
	/*
	clip-path:polygon(22% 5%, 74% 5%, 97% 26%,103% 50%, 77% 95%, 22% 95%,0% 50%,1% 26%);
	*/
}

.site-logo-link:focus,
.site-logo-link:hover,
.custom-logo-link:focus,
.custom-logo-link:hover {
	/*
	filter:drop-shadow(3px 2px 2px #000);
	*/
	filter:drop-shadow(32px 2px 4px #000);
}

/* Nav primary */

@media (min-width:768px) {
	.storefront-primary-navigation {
		background-color:var(--color__splash--dark--transp);
	}
}

.main-navigation ul li a,
.site-title a,
ul.menu li a,
.site-branding h1 a,
button.menu-toggle,
button.menu-toggle:hover,
.handheld-navigation .dropdown-toggle {
	color:#000;
}

.main-navigation ul li a:hover,
.main-navigation ul li:hover > a,
.site-title a:hover,
.site-header ul.menu li.current-menu-item > a,
/* Mobile nav */
.main-navigation .current_page_item a {
	color:#000;
	text-shadow:0 0 0.5px #000;
}

a.cart-contents:hover,
.site-header-cart .widget_shopping_cart a:hover,
.site-header-cart:hover > li > a {
	color:var(--color__dark);
}




/** Main */

/* Heading, Post image */

.hentry .wp-post-image {
	float:right;
	width:40%;
}

@media (min-width:768px) {
	.hentry.has-post-thumbnail .entry-title:has(+ img) {
		float:left;
		margin-right:10%;
		width:50%;
}




/* Products */

.wc-block-grid__product-title {
	color:var(--color__contrast);
}




/** Footer */

.site-footer {
	background-color:var(--color__base-2);
	color:var(--color__contrast);
}

@media (min-width:768px) {
	.secondary-navigation ul.menu a:hover {
		color:var(--color__contrast);
	}
}

@media (prefers-color-scheme:dark) {
	.site-footer a:not(.button):not(.components-button) {
		color:var(--color__base-2);
	}
}