/* Upgrade oktober 2026: header banners that replace the Slider Revolution 4 sliders (see functions.php). */
.zwf-banner {
	position: relative;
	height: 400px;
	overflow: hidden;
	background-color: #232c6f;
	background-repeat: no-repeat;
	background-position: center top;
	container-type: inline-size;
}

/* 1250x400 layer grid, centred and scaled down with the banner width like the slider did (1em = 1 grid pixel). */
.zwf-banner__grid {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 1250em;
	height: 400em;
	margin: -200em 0 0 -625em;
	font-size: 1px;
	font-size: min(1px, calc(100cqw / 1250));
}

.zwf-banner__text {
	position: absolute;
	color: #fff;
	font-family: "Libre Baskerville", serif;
	font-weight: 700;
	text-transform: uppercase;
	text-shadow: 5em 5em 5em #4a4a4a;
}

.zwf-banner__text--middle {
	transform: translateY(-50%);
}

.zwf-banner__text span {
	display: block;
	color: inherit;
	font-size: 58em;
	line-height: 1.0345;
}

.zwf-banner__img {
	position: absolute;
	max-width: none;
}

.zwf-banner__text,
.zwf-banner__img {
	animation: zwf-banner-fade .3s ease-in-out both;
}

@keyframes zwf-banner-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
	.zwf-banner__text,
	.zwf-banner__img {
		animation: none;
	}
}

/* Royal 2.7 sizes and spacing that Royal 6 changed. */
@media (min-width: 992px) {
	/* The header row was 65px high; logo and menu are centred in it. */
	.main-header .navbar .container-fluid {
		height: 65px;
	}

	/* Royal 2.7 floated the slider over the breadcrumb band; this keeps the same distance below the banner. */
	.page-heading {
		padding-top: 35px;
	}
}

/* Royal 6 sets no top margin on the home page content. */
.home .page-content {
	margin-top: 30px;
}

/* Sidebar category list: 16px links, list straight under the title (Royal 6 adds a smaller size and -15px). */
.sidebar-widget .product-categories > li > a {
	font-size: 16px;
	line-height: 18px;
	padding: 17px 0;
}

.sidebar-widget.widget_product_categories .widget-title {
	margin-bottom: 0;
}

.sidebar-widget.widget_product_categories > ul {
	margin-top: 0;
}

/* Add-to-cart button on the product page, next to the quantity field (WooCommerce 11 writes type="submit "). */
.product-information .cart .single_add_to_cart_button {
	float: right;
	margin-left: 15px;
	font-size: 13px !important;
	line-height: 40px !important;
}

@media only screen and (min-width: 980px) and (max-width: 1199px) {
	.product-information .cart .single_add_to_cart_button {
		width: 230px !important;
	}
}

@media only screen and (max-width: 480px) {
	.product-information .cart .single_add_to_cart_button {
		width: auto !important;
	}
}

/* Product grid: title and price spacing. */
.products-grid .product-title {
	margin: 0 0 15px;
}

.products-grid .price {
	margin: 0 0 11px;
	line-height: 20px;
}

/* WPBakery 9 gives custom headings a small bottom margin; the child theme uses 1.1em for headings. */
h1.vc_do_custom_heading,
h2.vc_do_custom_heading,
h3.vc_do_custom_heading,
h4.vc_do_custom_heading,
h5.vc_do_custom_heading {
	margin-bottom: 1.1em;
}

/* WPBakery 6+ wraps page content in .wpb-content-wrapper; the same rule as css/mobile.less for the new structure. */
@media only screen and (max-width: 800px) {
	.page-content > .row > .content > .wpb-content-wrapper > .vc_row {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.page-content > .row > .content > .wpb-content-wrapper > .vc_row > .vc_column_container {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	/* YITH Wishlist 4 builds its button as a flex box, which collapses to 0px in this mobile layout. */
	.product-information .yith-wcwl-add-to-wishlist .yith-wcwl-add-button {
		display: block;
	}
}

/* Blog sidebar "recent posts": plain links as in Royal 2.7 (Royal 6 styles every sidebar list like the category menu). */
.sidebar-widget.widget_recent_entries > ul {
	margin-top: 0;
}

.sidebar-widget.widget_recent_entries ul > li a {
	display: inline;
	padding: 0;
	font-size: 16px;
	line-height: inherit;
	text-transform: none;
}

.sidebar-widget.widget_recent_entries > ul > li:not(:last-child) {
	border-bottom: 0;
}