/*
Theme Name: StoryThings
Theme URI: https://storythings.nl/
Author: StoryThings
Author URI: https://storythings.nl/
Description: Custom block theme for StoryThings. Patterns can be added in the patterns folder.
Version: 1.10.13
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: storythings
Tags: full-site-editing, block-patterns, block-styles, editor-style, custom-colors, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

img,
video,
svg {
	max-width: 100%;
	height: auto;
}

.wp-block-cover .wp-block-group.has-base-background-color {
	color: var(--wp--preset--color--contrast);
}

.wp-block-group.has-forest-background-color a,
.wp-block-group.has-terracotta-background-color a,
.wp-block-group.has-bordeaux-background-color a {
	color: var(--wp--preset--color--gold);
}

.wp-site-blocks > * {
	margin-block-start: 0;
}

.wp-block-post-content > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

.has-tangerine-font-family {
	font-weight: 700;
	letter-spacing: 0.01em;
	line-height: 1.25;
}

.wp-block-group.has-terracotta-background-color,
.wp-block-group.has-bordeaux-background-color,
.wp-block-group.has-forest-background-color,
.wp-block-group.is-style-muur {
	background-image: var(--storythings-wall, url("../images/wall-plaster.jpg"));
	background-repeat: repeat;
	background-size: 42rem;
	background-position: center;
	background-blend-mode: multiply;
}

.wc-block-components-product-name,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce div.product .product_title {
	font-family: var(--wp--preset--font-family--libre-bodoni);
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce button.button.alt,
.wp-block-button__link.add_to_cart_button {
	border-radius: 0;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	font-weight: 600;
	font-family: var(--wp--preset--font-family--source-sans-3);
}

.storythings-header-tools {
	margin-left: auto;
}

.storythings-header-tools .wp-block-navigation {
	margin-inline-end: 0.75rem;
}

.storythings-header-tools .wp-block-woocommerce-customer-account,
.storythings-header-tools .wp-block-woocommerce-mini-cart {
	flex: 0 0 auto;
}

.wp-block-navigation .wp-block-navigation-item__content {
	text-decoration: none;
	border-bottom: 2px solid transparent;
	padding-bottom: 0.12em;
	transition: border-color 0.2s ease;
}

.wp-block-navigation .wp-block-navigation-item:not(.current-menu-item):not(.current-menu-ancestor) > .wp-block-navigation-item__content:hover,
.wp-block-navigation .wp-block-navigation-item:not(.current-menu-item):not(.current-menu-ancestor) > .wp-block-navigation-item__content:focus-visible {
	border-bottom-color: var(--wp--preset--color--gold);
}

.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content,
.wp-block-navigation .current-menu-ancestor > .wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation-item__content[aria-current="page"] {
	border-bottom-color: var(--wp--preset--color--gold);
}

:root {
	--wc-form-color-background: var(--wp--preset--color--base);
	--wc-form-color-border: var(--wp--preset--color--gold);
	--wc-form-color-text: var(--wp--preset--color--contrast);
	--wc-form-border-color: var(--wp--preset--color--gold);
	--wc-form-background-color: var(--wp--preset--color--base);
	--wc-form-text-color: var(--wp--preset--color--contrast);
}

button,
input,
select,
textarea,
.wp-element-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce button.button.alt,
.woocommerce #respond input#submit,
.woocommerce span.onsale,
.woocommerce .quantity .qty,
.wc-block-components-button,
.wc-block-components-chip,
.wc-block-components-notice-banner,
.wc-block-components-panel,
.wc-block-components-sidebar,
.wc-block-components-order-summary,
.wc-block-components-text-input,
.wc-block-components-combobox-control,
.wc-block-components-select-control,
.wc-block-components-textarea,
.wc-block-components-checkbox,
.wc-block-components-radio-control,
.wc-block-components-quantity-selector,
.wc-block-components-order-summary-item__image,
.wc-block-components-order-summary-item__quantity,
.wp-block-woocommerce-checkout-totals-block,
.wp-block-woocommerce-checkout-order-summary-block,
.wc-block-mini-cart__drawer,
.wp-block-woocommerce-product-image,
.wc-block-grid__product,
.wc-block-grid__product-onsale,
.wc-block-components-product-sale-badge,
.wc-block-next-previous-buttons__button {
	border-radius: 0 !important;
}

.wc-block-mini-cart__badge {
	border-radius: 999px !important;
	background-color: var(--wp--preset--color--terracotta) !important;
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--source-sans-3);
	font-weight: 600;
}

.wp-block-woocommerce-mini-cart-title-items-counter-block {
	display: none !important;
}

.wp-block-woocommerce-checkout-order-summary-block,
.wc-block-components-order-summary .wc-block-components-order-summary-item__quantity,
.wp-block-woocommerce-checkout-order-summary-block .wc-block-components-order-summary-item__quantity {
	border-radius: 0 !important;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"]:not(.wc-block-components-quantity-selector__input),
input[type="tel"],
input[type="date"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="time"],
textarea,
select,
.wp-block-search__input,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.wc-block-components-text-input input,
.wc-block-components-text-input input[type="text"],
.wc-block-components-text-input input[type="email"],
.wc-block-components-text-input input[type="tel"],
.wc-block-components-text-input input[type="url"],
.wc-block-components-text-input input[type="password"],
.wc-block-components-form .wc-block-components-text-input input[type="text"],
.wc-block-components-form .wc-block-components-text-input input[type="email"],
.wc-block-components-form .wc-block-components-text-input input[type="tel"],
.wc-block-components-form .wc-block-components-text-input input[type="url"],
.wc-block-components-form .wc-block-components-text-input input[type="password"],
.wc-block-components-form .wc-block-components-text-input input[type="number"],
.wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-components-combobox-control input,
.wc-block-components-combobox-control input[type="text"],
.wc-block-components-combobox .components-form-token-field__input,
.wc-block-components-validated-text-input input,
.wc-block-components-validated-text-input input[type="text"],
.wc-block-components-validated-text-input input[type="email"],
.wc-block-components-validated-text-input input[type="tel"],
.wc-block-checkout input[type="text"]:not(.wc-block-components-quantity-selector__input),
.wc-block-checkout input[type="email"],
.wc-block-checkout input[type="tel"],
.wc-block-checkout textarea,
.wc-block-checkout select,
.wc-block-components-select-control select,
.wc-block-components-textarea textarea {
	appearance: none;
	background-color: var(--wp--preset--color--base) !important;
	border: 1px solid var(--wp--preset--color--gold) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	color: var(--wp--preset--color--contrast) !important;
	font-family: var(--wp--preset--font-family--source-sans-3);
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.4;
	padding: 0.65rem 0.85rem;
	width: 100%;
}

select {
	background-color: var(--wp--preset--color--base-2) !important;
	background-image: none;
}

input::placeholder,
textarea::placeholder {
	color: var(--wp--preset--color--muted);
	opacity: 1;
}

input:focus,
textarea:focus,
select:focus,
.wp-block-search__input:focus,
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.wc-block-components-text-input input:focus,
.wc-block-components-text-input input[type="text"]:focus,
.wc-block-components-text-input input[type="email"]:focus,
.wc-block-components-text-input input[type="tel"]:focus,
.wc-block-components-text-input input[type="url"]:focus,
.wc-block-components-form .wc-block-components-text-input input[type="text"]:focus,
.wc-block-components-form .wc-block-components-text-input input[type="email"]:focus,
.wc-block-components-form .wc-block-components-text-input input[type="tel"]:focus,
.wc-block-components-form .wc-block-components-text-input input[type="url"]:focus,
.wc-block-components-form .wc-block-components-text-input input[type="password"]:focus,
.wc-blocks-components-select .wc-blocks-components-select__select:focus,
.wc-block-components-combobox-control input:focus,
.wc-block-components-validated-text-input input:focus,
.wc-block-checkout input:not(.wc-block-components-quantity-selector__input):focus,
.wc-block-checkout textarea:focus,
.wc-block-checkout select:focus,
.wc-block-components-select-control select:focus,
.wc-block-components-textarea textarea:focus {
	border-color: var(--wp--preset--color--forest) !important;
	box-shadow: none !important;
	outline: 1px solid var(--wp--preset--color--forest);
	outline-offset: 0;
}

label,
.woocommerce form .form-row label,
.wc-block-components-text-input label,
.wc-block-components-combobox-control label,
.wc-block-components-checkbox label {
	color: var(--wp--preset--color--muted);
	font-family: var(--wp--preset--font-family--source-sans-3);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	letter-spacing: 0.04em;
}

input[type="checkbox"],
input[type="radio"],
.wc-block-components-checkbox .wc-block-components-checkbox__input,
.wc-block-components-radio-control__input {
	appearance: none;
	background-color: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--gold);
	border-radius: 0 !important;
	box-shadow: none;
	height: 1.1rem;
	margin: 0;
	padding: 0;
	width: 1.1rem;
}

input[type="checkbox"]:checked,
.wc-block-components-checkbox .wc-block-components-checkbox__input:checked {
	accent-color: var(--wp--preset--color--forest);
	background-color: var(--wp--preset--color--forest);
	border-color: var(--wp--preset--color--forest);
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='%23F5F1E9' stroke-width='2' d='M3 8.5 6.5 12 13 4'/></svg>");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 0.8rem;
}

.woocommerce .woocommerce-error,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-message,
.wc-block-components-notice-banner {
	background-color: var(--wp--preset--color--base-2);
	border: 1px solid var(--wp--preset--color--gold);
	border-radius: 0;
	color: var(--wp--preset--color--contrast);
}

.wc-block-components-chip,
.woocommerce span.onsale,
.wc-block-grid__product-onsale,
.wc-block-components-product-sale-badge {
	background-color: var(--wp--preset--color--bordeaux);
	border-radius: 0 !important;
	color: var(--wp--preset--color--base);
}

.wc-block-components-form .wc-block-components-text-input input[type="text"],
.wc-block-components-form .wc-block-components-text-input input[type="email"],
.wc-block-components-form .wc-block-components-text-input input[type="tel"],
.wc-block-components-form .wc-block-components-text-input input[type="url"],
.wc-block-components-form .wc-block-components-text-input input[type="password"],
.wc-block-components-form .wc-block-components-text-input input[type="number"],
.wc-block-components-text-input input[type="text"],
.wc-block-components-text-input input[type="email"],
.wc-block-components-text-input input[type="tel"],
.wc-block-components-text-input input[type="url"],
.wc-block-components-text-input input[type="password"] {
	height: 50px;
	padding: 16px 12px;
}

.wc-block-components-form .wc-block-components-text-input.is-active input[type="text"],
.wc-block-components-form .wc-block-components-text-input.is-active input[type="email"],
.wc-block-components-form .wc-block-components-text-input.is-active input[type="tel"],
.wc-block-components-form .wc-block-components-text-input.is-active input[type="url"],
.wc-block-components-form .wc-block-components-text-input.is-active input[type="password"],
.wc-block-components-form .wc-block-components-text-input.is-active input[type="number"],
.wc-block-components-text-input.is-active input[type="text"],
.wc-block-components-text-input.is-active input[type="email"],
.wc-block-components-text-input.is-active input[type="tel"],
.wc-block-components-text-input.is-active input[type="url"],
.wc-block-components-text-input.is-active input[type="password"] {
	padding: 1.5em 12px 0.3em !important;
}

.wc-blocks-components-select .wc-blocks-components-select__select {
	height: 50px;
	padding: 16px 9px 0 !important;
}

.wc-block-components-quantity-selector {
	align-items: stretch;
	background: var(--wp--preset--color--base) !important;
	border: 1px solid var(--wp--preset--color--gold) !important;
	border-radius: 0 !important;
	box-sizing: border-box;
	display: flex;
	overflow: hidden;
	width: 107px !important;
}

.wc-block-components-quantity-selector input,
.wc-block-components-quantity-selector input[type="number"],
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__input {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	flex: 1 1 auto;
	height: auto;
	max-width: none;
	min-width: 2.25rem;
	outline: none !important;
	padding: 0.45em 0 !important;
	text-align: center;
	width: auto !important;
}

.wc-blocks-components-select .wc-blocks-components-select__container {
	background-color: var(--wp--preset--color--base) !important;
	border-radius: 0 !important;
}

.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
	align-items: center;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	color: var(--wp--preset--color--contrast) !important;
	display: inline-flex;
	flex: 0 0 30px;
	font-size: 1rem !important;
	font-weight: 400 !important;
	height: auto;
	justify-content: center;
	letter-spacing: 0 !important;
	line-height: 1 !important;
	min-height: 0 !important;
	min-width: 30px;
	opacity: 1;
	padding: 0 !important;
	text-transform: none !important;
	width: 30px;
}

.woocommerce .quantity .qty {
	max-width: 4.5rem;
	text-align: center;
	width: auto;
}

.wp-block-woocommerce-product-collection {
	margin-bottom: 0;
}

.wc-product-collection-carousel-header {
	margin-bottom: 1rem;
	width: 100%;
}

.wc-block-product-template.is-product-collection-layout-carousel {
	display: flex;
	gap: 1.25em;
}

.wc-block-product-template.is-product-collection-layout-carousel > .wc-block-product {
	box-sizing: border-box;
	flex: 0 0 calc((100% - 3.75em) / 4);
	max-width: none;
	min-width: calc((100% - 3.75em) / 4);
}

@media (max-width: 781px) {
	.wc-block-product-template.is-product-collection-layout-carousel > .wc-block-product {
		flex-basis: calc((100% - 1.25em) / 2);
		min-width: calc((100% - 1.25em) / 2);
	}
}

.wp-block-woocommerce-product-collection:has(.is-product-collection-layout-carousel) .wc-block-next-previous-buttons[hidden] {
	display: flex !important;
}

.wc-block-next-previous-buttons__button {
	background: var(--wp--preset--color--base) !important;
	border: 1px solid var(--wp--preset--color--gold) !important;
	color: var(--wp--preset--color--contrast) !important;
}

.wc-block-next-previous-buttons__button[aria-disabled="true"] {
	cursor: pointer;
	opacity: 1;
}
