/* Customizer presentation layer. Defaults mirror the existing Yokuchi design. */
html,
body,
.site {
	background: var(--yokuchi-page-bg, #faf9f7);
}

body,
button,
input,
select,
textarea {
	font-family: var(
		--yokuchi-font-family,
		Inter,
		-apple-system,
		BlinkMacSystemFont,
		'Segoe UI',
		sans-serif
	);
}

body {
	color: var(--yokuchi-text-color, #2b2b2b);
	font-size: var(--yokuchi-body-font-size, 16px);
	line-height: var(--yokuchi-body-line-height, 1.65);
}

a:hover,
a:focus {
	color: var(--yokuchi-red-dark, #c5161b);
}

:where(a, button, input, select, textarea):focus-visible {
	outline: 2px solid var(--yokuchi-focus, #e31e24);
	outline-offset: 3px;
}

.yokuchi-shell,
.yokuchi-container,
.ast-container {
	max-width: var(--yokuchi-container-width, 1440px);
}

.site-branding {
	width: var(--yokuchi-header-logo-width, 156px);
	flex-basis: var(--yokuchi-header-logo-width, 156px);
}

.site-branding img {
	width: var(--yokuchi-header-logo-width, 156px);
	height: auto;
}

footer .yokuchi-footer-logo,
footer .yokuchi-footer-logo img {
	width: var(--yokuchi-footer-logo-width, 156px) !important;
	height: auto !important;
}

.site-header__inner {
	min-height: var(--yokuchi-header-height, 92px);
}

.site-header .main-navigation a {
	color: var(--yokuchi-header-text, #2b2b2b);
}

.site-header .main-navigation a:hover,
.site-header .main-navigation a:focus,
.site-header .main-navigation .current-menu-item > a {
	color: var(--yokuchi-header-hover, #e31e24);
}

input[type='button'],
input[type='submit'],
.button,
.wp-element-button,
.yokuchi-read-more,
.yokuchi-related-more {
	min-height: var(--yokuchi-button-height, 48px);
	border-radius: var(--yokuchi-button-radius, 0);
}

.yokuchi-button-filled
	:where(.button, .wp-element-button, button[type='submit']),
.yokuchi-button-outline
	:where(.button, .wp-element-button, button[type='submit']) {
	border-color: var(--yokuchi-button-bg, #e31e24);
}

.yokuchi-button-filled
	:where(.button, .wp-element-button, button[type='submit']) {
	background: var(--yokuchi-button-bg, #e31e24);
	color: var(--yokuchi-button-text, #fff);
}

.yokuchi-button-filled
	:where(.button, .wp-element-button, button[type='submit']):hover {
	background: var(--yokuchi-button-hover-bg, #c5161b);
}

:where(input:not([type='checkbox']):not([type='radio']), select, textarea) {
	background: var(--yokuchi-field-bg, #fff);
	border-color: var(--yokuchi-field-border, #d8d8d8);
	border-radius: var(--yokuchi-field-radius, 0);
	color: var(--yokuchi-field-text, #2b2b2b);
}

.site-footer {
	background: var(--yokuchi-footer-bg, #fff);
	color: var(--yokuchi-footer-text, #6e6e6e);
}

.yokuchi-footer-grid {
	padding-top: var(--yokuchi-footer-spacing, 74px);
}

.site-footer h3,
.site-footer h3 button {
	color: var(--yokuchi-footer-heading, #2b2b2b);
}

.site-footer a {
	color: var(--yokuchi-footer-link, #6e6e6e);
}

.site-footer a:hover,
.site-footer a:focus {
	color: var(--yokuchi-footer-link-hover, #e31e24);
}

.yokuchi-footer-bottom {
	padding-bottom: 24px;
	color: var(--yokuchi-footer-text, #6e6e6e);
	font-size: var(--yokuchi-small-text-size, 12px);
	text-align: center;
}

.yokuchi-products-grid,
.woocommerce ul.products {
	grid-template-columns: repeat(var(--yokuchi-shop-columns, 4), minmax(0, 1fr));
	gap: var(--yokuchi-shop-gap, 24px);
}

.yokuchi-product-gallery-horizontal .yokuchi-product-gallery {
	grid-template-columns: 1fr;
}

.yokuchi-product-gallery-horizontal .yokuchi-product-thumbnails-slider {
	order: 2;
	display: block;
	width: 100%;
}

.yokuchi-product-gallery-horizontal .yokuchi-product-thumbnails {
	display: flex;
	flex-direction: row;
	max-height: none;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
}

.yokuchi-product-gallery-horizontal .yokuchi-product-thumbnails-slider__nav {
	display: none;
}

body.single-product {
	--product-red: var(--yokuchi-red, #e31e24);
	--product-red-dark: var(--yokuchi-red-dark, #c5161b);
	background: var(--product-bg, #faf9f7);
}

/* Block-level values exist only when a non-empty Customizer override is saved. */
:where(
	.yokuchi-intro,
	.yokuchi-brand-text,
	.yokuchi-brand-columns,
	.yokuchi-inspiration,
	.yokuchi-contact,
	.yokuchi-distributors-map,
	.yokuchi-qa-list,

) {
	background-color: var(--yokuchi-block-bg);
	color: var(--yokuchi-block-text);
	padding: 46px 20px 0;
}

.yokuchi-intro {
	padding-bottom: 46px;
}

:where(.yokuchi-cooperate) {
	margin-top: 46px;
}

@media screen and (min-width: 768px) {
	:where(
		.yokuchi-intro,
		.yokuchi-brand-text,
		.yokuchi-brand-columns,
		.yokuchi-inspiration,
		.yokuchi-contact,
		.yokuchi-distributors-map,
		.yokuchi-qa-list,

	) {
		padding: 96px 20px 0;
	}

	:where(.yokuchi-cooperate) {
		margin-top: 96px;
	}

	.yokuchi-intro {
		padding-bottom: 96px;
	}
}

@media screen and (min-width: 992px) {
	:where(
		.yokuchi-intro,
		.yokuchi-brand-text,
		.yokuchi-brand-columns,
		.yokuchi-inspiration,
		.yokuchi-contact,
		.yokuchi-distributors-map,
		.yokuchi-qa-list,

	) {
		padding: 185px 20px 0;
	}

	:where(.yokuchi-cooperate) {
		margin-top: 185px;
	}

	.yokuchi-intro {
		padding-bottom: 185px;
	}
}

:where(
		.yokuchi-hero,
		.yokuchi-universal-hero,
		.kan-hero,
		.yokuchi-intro,
		.yokuchi-brand-text,
		.yokuchi-brand-columns,
		.yokuchi-products,
		.yokuchi-inspiration,
		.yokuchi-cooperate,
		.yokuchi-contact,
		.yokuchi-contact-section,
		.yokuchi-distributors-map,
		.yokuchi-qa-list,
		.yokuchi-production-calculator
	)
	:where(a, button, .yokuchi-heading-line) {
	--yokuchi-red: var(--yokuchi-block-accent, var(--yokuchi-accent, #e31e24));
}

.gen-calculator.yokuchi-production-calculator {
	margin-right: auto;
	margin-left: auto;
	color: var(--yokuchi-calculator-text, #1d1d1b);
}

.kan-calculator.yokuchi-production-calculator {
	max-width: var(--yokuchi-kan-calculator-width, 676px);
	margin-right: auto;
	margin-left: auto;
	background: var(--yokuchi-calculator-bg, #fff);
	color: var(--yokuchi-calculator-text, #1d1d1b);
}

@media (max-width: 1320px) {
	.site-header .main-navigation {
		background: var(--yokuchi-mobile-menu-bg, #fff) !important;
	}
}

@media (max-width: 781px) {
	.yokuchi-shell,
	.yokuchi-container,
	.ast-container,
	[class$='__container'] {
		width: calc(100% - (2 * var(--yokuchi-mobile-gutter, 24px)));
	}

	.site-branding img {
		width: var(--yokuchi-header-logo-width, 163px);
		height: auto;
		max-height: 24px;
	}

	.site-branding {
		width: auto;
		flex-basis: auto;
	}

	.yokuchi-products-grid,
	.woocommerce ul.products {
		grid-template-columns: repeat(var(--yokuchi-shop-columns, 2), minmax(0, 1fr));
	}

	.yokuchi-footer-grid {
		padding-top: var(--yokuchi-footer-spacing, 30px);
	}

	.yokuchi-footer-static .yokuchi-footer-col__toggle {
		pointer-events: none;
	}

	.yokuchi-footer-static .yokuchi-footer-col__toggle::after {
		display: none;
	}

	.yokuchi-footer-static .yokuchi-footer-col ul {
		display: block;
		margin-top: 14px;
	}
}