/*
Theme Name: Kadence Child
Theme URI: https://inspry.com
Template: kadence
Author: Inspry
Author URI: https://inspry.com
Description: A child theme for the Kadence Theme.
Version: 1.0.0
*/

/* Theme customization starts here
-------------------------------------------------------------- */

/* Site-wide styles
 * Moved from the Customizer's Additional CSS on 2026-10-20 (backup of the original:
 * wp-content/novamira-sandbox/backups/2026-10-20-product-cards/). This stylesheet is
 * enqueued last (functions.php) so it prints where Additional CSS printed and keeps
 * winning ties the same way. Colours come from the Kadence palette only. Media
 * queries are at the end of the file, one block per breakpoint.
-------------------------------------------------------------- */

/* General
-------------------------------------------------------------- */
.kt-row-column-wrap {
	--global-content-edge-padding: 0 !important;
}

#inner-wrap {
	padding-left: 25px;
	padding-right: 25px;
}

.product-template-default #inner-wrap {
	padding: 0;
}

/* Lets badges and other overlays sit absolutely inside any Kadence column. */
.wp-block-kadence-column > .kt-inside-inner-col {
	position: relative;
}

/* Gradient rows: pull from the live Kadence palette, fade with opacity. */
.kb-row-layout-wrap.gradient {
	--grad-start: var(--global-palette9);
	--grad-mid: var(--global-palette1);
	--grad-end: var(--global-palette2);
	background-image:
		linear-gradient(
			180deg,
			var(--grad-start) 0%,
			color-mix(in srgb, var(--grad-mid) 17%, transparent) 49%,
			color-mix(in srgb, var(--grad-end) 24%, transparent) 100%
		) !important;
}

/* Homepage: Kadence image blocks fill their row. */
.home .wp-block-kadence-image,
.home .wp-block-kadence-image .kb-advanced-image-link {
	display: block;
	width: 100%;
}

/* Images. Grouped here, lowest specificity first: rules that end on the same
 * element must not go down in specificity through the file (stylelint). */
.comment_container img {
	display: none;
}

.ksk-gallery img {
	border-radius: 10px;
}

.kt-woo-gallery-thumbnail img {
	border: 1px solid var(--global-palette3) !important;
}

.post img {
	border: 1px solid var(--global-palette3);
	border-radius: 10px;
}

.kwt-gallery-wrap .kadence-product-gallery-main img,
.kwt-gallery-wrap .kadence-product-gallery-thumbnails img {
	mix-blend-mode: multiply;
}

.kadence-product-gallery-main .splide__slide img {
	display: block;
	height: auto !important;
}

.post .entry-content img {
	margin-top: 15px;
}

.home .wp-block-kadence-image img {
	width: 100%;
	height: auto;
}

/* Header
-------------------------------------------------------------- */
.site-header-main-section-left .site-header-item[data-section="kadence_customizer_header_html"] {
	flex: 1 1 auto;
}

.site-header-main-section-left .header-html {
	width: 100%;
}

/* FiboSearch bar in the header. */
.site-header-main-section-left .dgwt-wcas-search-wrapp {
	max-width: none;
}

.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input {
	border: 1px solid;
	background: var(--global-palette9);
}

.header-search-bar form input.search-field {
	padding-left: 15px;
	border-radius: 50px;
}

/* Shop
-------------------------------------------------------------- */
.loop-entry {
	margin-bottom: 0 !important;
	box-shadow: none !important;
}

/* Wholesale and YayPricing prices. */
.kwt-price-wrap del.original-computed-price,
.swiper-slide del.original-computed-price {
	display: none !important;
}

.wholesale_price_container {
	color: var(--global-palette1) !important;
}

.kb-query-label {
	font-weight: 400 !important;
	color: var(--global-palette6) !important;
}

/* Keep swatch hover titles from being cut off in the shop and category grids.
   min-width: 0 lets the grid columns shrink to fit, which overflow: visible would otherwise block. */
.woocommerce ul.products li.product.kb-query-item {
	overflow: visible;
	min-width: 0;
}

.archive .variations .kt-variation-label {
	display: none;
}

.kadence-sk-variation-wrap .variations_form p,
.kadence-sk-variation-wrap .cwginstock-outofstock {
	display: none;
}

/* Mini-cart and the "View cart" link WooCommerce adds after an AJAX add. */
.woocommerce-mini-cart__buttons .checkout {
	background: var(--global-palette1) !important;
	color: var(--global-palette9);
}

.added_to_cart {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	background: var(--global-palette9) !important;
}

.added {
	background: var(--global-palette9);
}

/* Cart block: the Kadence button border moves from the wrapper to the button. */
.wc-block-cart .wc-block-cart__submit {
	padding: 0;
	border: 0;
	border-radius: 0;
}

.wc-block-cart .wc-block-cart__submit-button {
	padding: 12px 20px;
	border: 2px solid var(--global-palette3);
	border-radius: 5px;
}

.woocommerce .woocommerce-message .button,
.woocommerce .woocommerce-error .button,
.woocommerce .woocommerce-info .button {
	font-size: 16px;
}

.woocommerce-privacy-policy-text {
	margin-bottom: 20px;
}

/* Homepage product carousels (Kadence): arrows under the track. */
.home-slider .kt-product-carousel-wrap.splide {
	display: flex;
	flex-direction: column;
}

.home-slider .splide__track {
	order: 1;
}

.home-slider .splide__arrows {
	position: relative;
	display: flex;
	order: 2;
	justify-content: flex-start;
	gap: 10px;
	width: 100%;
	margin-top: 20px;
	transform: none;
}

.home-slider .kt-product-carousel-wrap .splide__arrow,
.home-slider .kt-product-carousel-wrap:hover .splide__arrow {
	position: static;
	width: 44px;
	height: 44px;
	border-radius: 4px;
	background-color: var(--global-palette1) !important;
	box-shadow: none;
	opacity: 1 !important;
	transform: none;
	transition: opacity 0.2s ease;
}

.home-slider .kt-product-carousel-wrap .splide__arrow:hover {
	opacity: 0.8 !important;
}

.home-slider .splide__arrow svg {
	fill: var(--global-palette9) !important;
}

/* Single product
-------------------------------------------------------------- */
.kwt-description-wrap h1 {
	font-size: 30px;
	line-height: 1.2;
}

.kwt-description-wrap h2 {
	font-size: 28px;
}

.kadence-product-gallery-main {
	border: 1px solid var(--global-palette3);
	border-radius: 10px;
}

/* Main gallery: only the active slide takes height, so the thumbnails sit right under it. */
.kadence-product-gallery-main .splide__list {
	align-items: flex-start;
}

.kadence-product-gallery-main .splide__slide:not(.is-active) {
	height: 0;
	overflow: hidden;
}

.kadence-product-gallery-main .splide__slide.is-active {
	height: auto;
}

.splide--nav > .splide__track > .splide__list > .splide__slide.is-active,
.splide--nav > .splide__slider > .splide__track > .splide__list > .splide__slide.is-active {
	border: none !important;
	outline: none !important;
}

.kwt-add-to-cart-single.kwt-add-to-cart-_955807-5c .cart .button.single_add_to_cart_button,
.woocommerce div.product .kwt-add-to-cart-single.kwt-add-to-cart-_955807-5c .cart .button.single_add_to_cart_button {
	width: 60%;
	font-weight: 600;
}

.asnp_easy_product_bundle {
	margin-top: 40px;
}

.wholesale_saved_price_container {
	position: relative;
	top: -15px;
	color: var(--global-palette3);
}

.wholesale_saved_price_text {
	font-size: 14px;
}

.yay-currency-single-page-switcher .yay-currency-custom-select {
	padding-top: 10px;
}

/* Single product swatches; the product card swatches are under "Loop variation swatches". */
.kt-image-color-sw label {
	border: 1px solid var(--global-palette3) !important;
	border-radius: 5px !important;
}

.kad_radio_variations label.selectedValue .kt_color_sw_span {
	outline: 2px solid var(--global-palette1) !important;
}

/* Back in stock notifier form. */
.cwginstock-subscribe-form .panel-primary {
	border-color: var(--global-palette3);
	border-radius: 10px;
}

.cwginstock-subscribe-form .panel-primary > .panel-heading {
	background-color: var(--global-palette1);
}

.cwg-design-card .cwginstock-panel-heading h4 {
	color: var(--global-palette9);
}

.cwg-design-card .cwgstock_button {
	background: var(--global-palette3);
}

.cwg-design-card .cwgstock_button:hover {
	background-color: var(--global-palette1);
}

/* Related products carousel. */
.wt-crp-heading {
	display: none;
}

.related .carousel-wrap {
	padding: 14px !important;
}

.related li {
	background: transparent !important;
}

.related .kb-section-has-link .kt-inside-inner-col {
	background: var(--global-palette9);
}

.related .variations {
	display: none;
}

.related.products ul.products {
	gap: 1em !important;
	padding-top: 20px !important;
}

/* Reviews. */
.comment-text {
	margin-left: 0 !important;
	border-radius: 10px !important;
	background: var(--global-palette9);
}

/* Shop sidebar: category accordion (inc/shop-category-accordion.php)
-------------------------------------------------------------- */
.zeevapor-accordion {
	margin: 0;
	padding: 0;
	list-style: none;
	font-family: sans-serif;
	text-transform: uppercase;
}

.zeevapor-accordion li {
	border-bottom: 2px solid var(--global-palette9);
}

.zeevapor-accordion li.menu-item {
	margin-bottom: 5px;
}

.zeevapor-accordion li:hover {
	border-bottom-color: var(--global-palette1);
}

/* Rows with children: the link and its toggle side by side, the submenu below. */
.zeevapor-accordion .menu-item-has-children {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.zeevapor-accordion a {
	display: block;
	flex-grow: 1;
	padding: 8px 0;
	color: var(--global-palette3);
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
}

.zeevapor-accordion a:hover {
	color: var(--global-palette1) !important;
}

.zeevapor-accordion button.toggle {
	display: flex;
	align-items: center;
	margin-left: auto;
	padding: 10px;
	border: none;
	background: none;
	color: var(--global-palette3);
	cursor: pointer;
	transition: transform 0.3s ease;
}

.zeevapor-accordion button:hover {
	box-shadow: none;
}

.zeevapor-accordion button.toggle.open {
	transform: rotate(180deg);
}

.zeevapor-accordion .sub-menu {
	display: none;
	width: 100%;
	margin-top: 5px;
	margin-bottom: 10px;
	padding-left: 15px;
	list-style: none;
}

.zeevapor-accordion .sub-menu a {
	padding: 5px 0;
	color: var(--global-palette5);
	font-size: 13px;
}

/* Category menu toggle and collapsible sidebar toggle: shown only by the media queries at the end. */
.zv-cat-toggle {
	display: none;
}

.zv-sidebar-toggle {
	display: none;
}

/* Account
-------------------------------------------------------------- */
.woocommerce .woocommerce-form-login {
	max-width: 500px;
}

.woocommerce-account h2 {
	margin-top: 0;
	font-size: 28px;
}

/* Forms
-------------------------------------------------------------- */
.wsf-form button.wsf-button.wsf-button-primary {
	background: var(--global-palette1) !important;
}

/* Newsletter signup (Constant Contact): the plugin greys the opt-in label; use the page text colour. */
.ctct-form-wrapper .ctct-input-container label {
	color: inherit;
}

.ctct-form-field {
	margin-bottom: 0 !important;
}

.ctct-form-field input {
	border-radius: 10px !important;
}

/* Footer signup strip: hidden on /newsletter/, which already has the full signup form. */
.page-id-1000064 .kb-row-layout-id71613_5e1a7c-01 {
	display: none;
}

/* Blog
-------------------------------------------------------------- */
.entry-related-carousel .entry {
	background: transparent !important;
}

/* Loop variation swatches
 * Product card swatches from the [kadence_loop_swatches] shortcode; see
 * inc/loop-variation-swatches.php. Moved from the Code Snippets plugin
 * ("Shop Variation Swatches", #6) on 2026-10-14.
-------------------------------------------------------------- */
.kb-loop-swatches-only .single_variation_wrap {
	display: none !important;
}

/* Colour-only swatches and swatches past the display limit, flagged by the script. */
.kb-loop-swatches-only .hide-color-swatch,
.kb-loop-swatches-only .swatch-over-limit {
	display: none !important;
}

/* Out-of-stock swatches, flagged by the script: crossed out, not pickable. */
.kb-loop-swatches-cart fieldset.kad_radio_variations label.swatch-out-of-stock {
	position: relative;
	opacity: 0.45;
	cursor: not-allowed;
	pointer-events: none;
}

.kb-loop-swatches-cart fieldset.kad_radio_variations label.swatch-out-of-stock::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: linear-gradient(to top right, transparent 46%, var(--global-palette13) 46%, var(--global-palette13) 54%, transparent 54%);
}

/* Shop Kit's archive form inside the card (2026-10-20): swatches stay inside the
 * card, the attribute label is hidden, then the "Select options / Add to cart" button
 * (it carries kb-button, which exempts it from Kadence's text-style archive button rule).
 * Cards without swatches get the same wrapper and button (kb-loop-cart-simple). The wrapper
 * keeps room for one swatch row on every card, so prices line up across a row. */
.kb-loop-swatches-cart {
	position: relative;
	z-index: 3; /* above the card's whole-column link overlay, so swatches and the button take the click */
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 8px;
	min-height: 78px; /* one 34px swatch row + gap + the 36px button */
	margin-top: 10px;
}

.kb-loop-swatches-cart .kadence-sk-variation-wrap,
.kb-loop-swatches-cart form.kadence_catalog_variations_form,
.kb-loop-swatches-cart table.variations {
	margin: 0 !important;
	padding: 0;
}

.kb-loop-swatches-cart .kadence-sk-variation-wrap {
	display: flex;
	flex-direction: column; /* no stray line box around the form */
}

.kb-loop-swatches-cart table.variations,
.kb-loop-swatches-cart table.variations tbody,
.kb-loop-swatches-cart table.variations tr,
.kb-loop-swatches-cart table.variations td,
.kb-loop-swatches-cart table.variations th {
	display: block;
	width: 100%;
	padding: 0;
	border: 0;
	background: transparent;
}

/* Equal card heights in the catalog grid and the sliders. The design's card CSS fixes a
 * min-height and centres the column vertically, which kept cards even only while the
 * swatches sat outside the card; now the card chain stretches to the grid row / slide
 * and the inner column keeps its top-aligned content and bottom-aligned price + swatches. */
li.kb-query-item:has(> .product-card),
li.splide__slide:has(> .product-card) {
	display: flex;
	flex-direction: column;
}

/* Related products: Owl floats its slides, so each was only as tall as its own card. A flex
 * stage stretches every slide to the tallest. */
.related .owl-stage {
	display: flex;
}

.related .owl-stage::after {
	display: none; /* Owl's float clearfix, an empty flex item here */
}

.related .owl-item {
	display: flex;
	flex: 0 0 auto;
	float: none;
}

.related .owl-item > .product {
	display: flex;
	flex-direction: column;
	width: 100%;
}

/* Kept below the li selectors' specificity and ahead of them (stylelint no-descending-specificity). */
.related .product-card {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
}

li.kb-query-item > .product-card,
li.splide__slide > .product-card {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
}

.product-card > .kt-row-column-wrap {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
}

.product-card > .kt-row-column-wrap > .wp-block-kadence-column {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	align-self: stretch;
	min-width: 100% !important; /* the column is the whole-card link (kb-section-has-link) */
}

.product-card > .kt-row-column-wrap > .wp-block-kadence-column > .kt-inside-inner-col {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-height: 0;
	justify-content: flex-start; /* the template's space-between spread the stretched card's free space between icon, image, title and price */
	padding: 10px 10px 12px;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.product-card:hover > .kt-row-column-wrap > .wp-block-kadence-column > .kt-inside-inner-col {
	box-shadow: inset 0 0 0 2px var(--global-palette1) !important;
}

.kb-loop-swatches-cart table.variations th.label,
.kb-loop-swatches-cart .kt_variation_label_wrap,
.kb-loop-swatches-cart .reset_variations {
	display: none !important;
}

.kb-loop-swatches-cart fieldset.kad_radio_variations {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 0 !important; /* Additional CSS gives single-product swatches a 5px top margin */
	padding: 0;
	border: 0;
}

/* Round swatches (2026-10-20 card redesign). */
.kb-loop-swatches-cart fieldset.kad_radio_variations label {
	box-sizing: border-box;
	margin: 0 !important;
	padding: 2px !important;
	width: 34px;
	height: 34px;
	flex: 0 0 34px;
	border: 1px solid color-mix(in srgb, var(--global-palette6) 40%, transparent) !important;
	border-radius: 50% !important;
	background: var(--global-palette9);
	transition: border-color 0.15s ease;
}

.kb-loop-swatches-cart fieldset.kad_radio_variations label:hover {
	border-color: var(--global-palette3) !important;
}

/* The picked swatch: a dark ring (Shop Kit marks its label selectedValue). */
.kb-loop-swatches-cart fieldset.kad_radio_variations input:checked + label,
.kb-loop-swatches-cart fieldset.kad_radio_variations label.selectedValue {
	border-color: var(--global-palette3) !important;
	box-shadow: 0 0 0 1px var(--global-palette3);
}

.kb-loop-swatches-cart fieldset.kad_radio_variations label .kt_color_sw_span {
	display: block;
	width: 100% !important;
	height: 100% !important;
	border-radius: 50%;
	outline: none !important;
}

.kb-loop-swatches-cart fieldset.kad_radio_variations label img.kt-sw-img {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	object-fit: cover;
}

.kb-loop-swatches-cart .swatch-more-link {
	font-size: 0.8em;
	line-height: 34px;
	white-space: nowrap;
	text-decoration: underline;
}

.kb-loop-swatches-cart .ksk-catalog-price {
	display: none;
}

.kb-loop-swatches-cart a.kb-loop-swatches-button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 36px;
	box-sizing: border-box;
	padding: 8px 10px; /* kept short so the cards stay compact */
	margin: 0;
	border: 1px solid var(--global-palette3);
	border-radius: 8px;
	background: var(--global-palette9);
	color: var(--global-palette3);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.08em;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
}

/* The card button shows the tick when added; WooCommerce's extra "View cart" link would only
 * make the card taller (the header cart already updates). */
.kb-loop-swatches-cart .added_to_cart {
	display: none !important;
}

.kb-loop-swatches-cart a.kb-loop-swatches-button:hover,
.kb-loop-swatches-cart a.kb-loop-swatches-button[data-variation_id]:not([data-variation_id=""]) {
	background: var(--global-palette3);
	border-color: var(--global-palette3);
	color: var(--global-palette9);
}

.kb-loop-swatches-cart a.kb-loop-swatches-button.loading {
	opacity: 0.6;
	pointer-events: none;
}

.kb-loop-swatches-cart a.kb-loop-swatches-button.added::after {
	content: " \2713";
}

/* Sliders (the homepage Kadence product carousels and the related-products Owl carousel): the
 * swatches only preview the variation image there; the "Select options / Add to cart" button is
 * catalog-only (Matt, 2026-10-20), so the card's "+" stays as the way to the product.
 * Outweighs the display:flex button rule above. */
.wp-block-kadence-productcarousel .kb-loop-swatches-cart a.kb-loop-swatches-button,
.owl-carousel .kb-loop-swatches-cart a.kb-loop-swatches-button {
	display: none;
}

.wp-block-kadence-productcarousel .kb-loop-swatches-cart,
.owl-carousel .kb-loop-swatches-cart {
	min-height: 0;
}

.wp-block-kadence-productcarousel .kb-loop-cart-simple,
.owl-carousel .kb-loop-cart-simple {
	display: none;
}

.kwt-image-wrap .woocommerce-loop-image-link,
.wp-block-kadence-wootemplate-blocks-image .woocommerce-loop-image-link {
	position: relative;
	display: block;
}

.swatch-crossfade-image {
	position: absolute !important;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	object-fit: contain;
	background: var(--global-palette9); /* the card image's backdrop: nothing shows through */
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.18s ease !important;
	z-index: 2;
}

.swatch-crossfade-image.is-visible {
	opacity: 1;
}

/* Product cards: layout
 * The card template ("Product Card Layout", kadence_wootemplate 71764) used by the Query Loop
 * grids and the product sliders. A square, rounded image that fills the card; the "+" over the
 * image's top-right corner; the brand line (inc/product-card-brand.php), name and price; then
 * the swatches and the full-width button (see "Loop variation swatches" above).
 * 2026-10-20 card redesign. It replaces the fixed-height image and min-height rules that were
 * in Additional CSS (backup: wp-content/novamira-sandbox/backups/2026-10-20-product-cards/).
-------------------------------------------------------------- */

/* The carousels run the template through wpautop, which wraps the swatch shortcode in empty
 * paragraphs (32px bottom margin each); the catalog grid has none. */
.product-card .kt-inside-inner-col > p:empty {
	display: none;
}

/* The whole-card link sits under everything clickable in the card. */
.product-card .kb-section-link-overlay {
	z-index: 1 !important;
}

/* Sale / Out of Stock badge ([custom_oos_badge], inc/product-badges.php), over the image's top-left corner. */
.custom-oos-badge,
.custom-sale-badge {
	position: absolute;
	top: 15px;
	left: 15px;
	z-index: 10;
	padding: 6px 12px;
	border-radius: 4px;
	background-color: var(--global-palette2);
	color: var(--global-palette9);
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.5px;
	text-transform: uppercase;
}

/* "+": out of the flow, over the image. */
.product-card .kt-inside-inner-col > .wp-block-kadence-icon {
	position: absolute;
	top: 18px;
	right: 18px;
	z-index: 4;
	margin: 0 !important;
}

.product-card .kt-svg-icon-link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	position: relative;
	z-index: 1000;
	border-radius: 50%;
	background: var(--global-palette9);
	pointer-events: auto;
	transition: background-color 0.2s ease;
}

.product-card .kt-svg-icon-link:hover,
.product-card .kt-svg-icon-link:focus-visible {
	background: var(--global-palette1);
}

/* Hovering the card tints the "+" and grows it a little. The block's 10px bottom
   margin on mobile pushes the "+" above the center of its circle. */
.product-card .kb-svg-icon-wrap {
	margin: 0 !important;
	transition: color 0.2s ease;
}

.product-card:hover .kb-svg-icon-wrap {
	color: var(--global-palette1) !important;
}

.product-card:hover .kt-svg-icons span {
	transform: scale(1.2);
	transition: 0.2s;
}

/* On its own filled circle the icon stays dark: palette1 there would hide the "+". */
.product-card .kt-svg-icon-link:hover .kb-svg-icon-wrap,
.product-card .kt-svg-icon-link:focus-visible .kb-svg-icon-wrap {
	color: var(--global-palette3) !important;
}

.product-card .kt-svg-icon-link svg {
	width: 18px;
	height: 18px;
}

.product-card .kt-inside-inner-col > .kwt-image-wrap {
	width: 100%;
	margin: 0 !important; /* the template's 10px top margin on mobile */
}

.product-card .kwt-image-wrap a.woocommerce-loop-image-link {
	overflow: hidden;
	aspect-ratio: 1 / 1;
	border-radius: 10px;
	background: var(--global-palette9);
}

.product-card .kwt-image-wrap img,
.woocommerce ul.products li.product .product-card .kwt-image-wrap img {
	display: block;
	width: 100%;
	max-width: none;
	height: 100%;
	margin: 0;
	object-fit: contain;
}

.product-card .kt-inside-inner-col > h2.wp-block-kadence-advancedheading {
	margin: 12px 0 0 !important;
	font-size: 13px !important;
	line-height: 1.35 !important;
	letter-spacing: 0.02em;
}

.product-card .zv-card-brand {
	display: block;
	margin-bottom: 4px;
	color: var(--global-palette4);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
}

/* Price: pushed down with the swatches and button, so it lines up across a row. */
.product-card .kt-inside-inner-col > .kwt-price-wrap {
	margin: auto 0 0 !important;
	padding-top: 8px;
	line-height: 1.3;
}


/* Single product swatch row: a little room under the attribute label. After the card swatch
 * rules, which end on the same element and must not outrank it later in the file (stylelint). */
.variations .kt-radio-variation-container fieldset.kad_radio_variations {
	margin-top: 5px;
}

/* Sezzle product banner
 * See inc/sezzle-product-banner.php. Moved from the Code Snippets plugin
 * ("Sezzle", #13) on 2026-10-14.
-------------------------------------------------------------- */

/* Drop the WooCommerce summary layout the target's class brings with it. */
.woocommerce div.product .sezzle-kadence-target.summary {
	float: none !important;
	width: auto !important;
	margin: 0 !important;
	clear: none !important;
}

/*
 * Keep the price available to Sezzle but visually hide the duplicate. Shrink
 * the text rather than clipping the box: Sezzle renders inside this element
 * and would be clipped too.
 */
.sezzle-kadence-target > .price {
	font-size: 0 !important;
	line-height: 0 !important;
	margin: 0 !important;
}

.sezzle-kadence-target .sezzle-shopify-info-button {
	font-size: 14px !important;
	line-height: normal !important;
}

/* Logged-out My Account (login and lost password): centre the page heading,
   the "Login" heading and the form on every screen size. Logged-in account
   pages keep their dashboard layout.
   The forms keep to the left edge of that column (as the site has shown them
   since the Additional CSS override); they are 500px wide, the lost-password
   form matched to the login form here. */
body.woocommerce-account:not(.logged-in) .entry-content h1.wp-block-kadence-advancedheading,
body.woocommerce-account:not(.logged-in) .woocommerce > h2 {
	text-align: center;
}

body.woocommerce-account:not(.logged-in) .woocommerce-form-login,
body.woocommerce-account:not(.logged-in) .woocommerce-ResetPassword {
	margin-left: 0;
	margin-right: auto;
}

body.woocommerce-account:not(.logged-in) .woocommerce-ResetPassword {
	max-width: 500px;
}

/* Same pages: error and confirmation messages ("incorrect password", "password
   reset email has been sent") match the form's width and centre, instead of
   spanning the full page above a narrow centred form. */
body.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-notices-wrapper,
body.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-message,
body.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-info,
body.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-error {
	max-width: 500px;
	margin-left: auto;
	margin-right: auto;
}

/* [product_rating] shortcode under the single product price: stars plus "Reviews",
   linking down to the #reviews row. */
.zeevapor-product-rating {
	display: inline-flex;
	margin-top: 10px;
	align-items: center;
	gap: 8px;
	color: var(--global-palette5);
	font-size: 14px;
	text-decoration: none;
}

.zeevapor-product-rating .star-rating {
	float: none;
	margin: 0;
}

.zeevapor-product-rating:hover .zeevapor-product-rating__label,
.zeevapor-product-rating:focus-visible .zeevapor-product-rating__label {
	text-decoration: underline;
}

/* Land the #reviews jump below the fixed announcement bar (and admin bar). */
.single-product #reviews {
	scroll-margin-top: 80px;
}

/* Laptop (1440px and below)
-------------------------------------------------------------- */
@media (max-width: 1440px) {

	.header-search-bar {
		margin-left: 20px;
	}

	.header-search-bar form {
		width: 250px;
	}

	.main-navigation .primary-menu-container > ul > li.menu-item > a {
		padding: 12px;
		font-size: 15px;
	}

	.shop-sidebar {
		flex: 0 1 220px !important;
	}

	.kadence-query-init .wp-block-kadence-column > .kt-inside-inner-col {
		column-gap: 40px !important;
	}
}

/* Tablet and mobile (1024px and below)
-------------------------------------------------------------- */
@media (max-width: 1024px) {

	/* Product carousels: cards match height within a slide row. */
	li.product {
		box-sizing: border-box;
	}

	.home-slider li.product,
	.related li.product {
		display: flex !important;
		flex-direction: column;
	}

	li.product > .product-card {
		display: flex !important;
		flex: 1 1 auto;
		flex-direction: column;
	}

	.product-card > .kt-row-column-wrap {
		min-height: 0;
	}

	.kb-query-item.product > .kb-query-item-flip-back {
		display: none;
	}

	/* ZV product slider: card width is set per breakpoint with --zv-card-w. */
	.zv-product-slider .zv-product-slider__inner {
		gap: 10px !important;
	}

	.zv-product-slider .zv-product-slider__swiper {
		padding-top: calc(var(--zv-card-w) * 0.7);
		container-type: inline-size;
	}

	.zv-product-slider .zv-card {
		box-sizing: border-box;
		width: var(--zv-card-w);
		max-width: none;
	}

	.zv-product-slider .swiper-slide-active + .swiper-slide {
		margin-left: calc(var(--zv-card-w) * 0.35);
	}

	.zv-product-slider .zv-card__title {
		min-height: 2.4em;
		max-height: 2.4em;
	}
}

/* Tablet (768px to 1024px): 3 cards per view
-------------------------------------------------------------- */
@media (min-width: 768px) and (max-width: 1024px) {

	.home-slider .splide__track li.product {
		width: calc((100% - 30px) / 3) !important;
		margin-right: 15px !important;
	}

	.zv-product-slider .zv-product-slider__swiper {
		--zv-card-w: calc((100cqi - 30px) / 3.35);
	}
}

/* Tablet and desktop (768px and up): collapsible shop sidebar (inc/collapsible-shop-sidebar.php)
-------------------------------------------------------------- */
@media (min-width: 768px) {

	.shop-sidebar {
		--zv-tab-w: 48px;
		transition: flex-basis 0.3s ease;
	}

	.shop-sidebar > .kt-inside-inner-col {
		min-width: 220px;
	}

	.zv-sidebar-toggle {
		display: flex;
		align-items: center;
		gap: 10px;
		width: 100%;
		min-height: 44px;
		padding: 10px 16px;
		border: 0;
		border-radius: 5px;
		background: var(--global-palette3);
		color: var(--global-palette9);
		font-size: 16px;
		font-weight: 600;
		line-height: 1.2;
		white-space: nowrap;
		cursor: pointer;
	}

	.zv-sidebar-toggle:focus-visible {
		outline: 2px solid var(--global-palette1);
		outline-offset: 2px;
	}

	.zv-sidebar-toggle svg {
		flex-shrink: 0;
	}

	.zv-sidebar-toggle .zv-chev {
		margin-left: auto;
		transform: rotate(90deg);
	}

	.shop-sidebar .zv-sidebar-toggle + .kt-inside-inner-col {
		margin-top: 20px;
	}

	/* Collapsed: a vertical tab on the left. */
	.shop-sidebar.zv-collapsed {
		flex: 0 0 var(--zv-tab-w) !important;
		overflow: hidden;
	}

	.shop-sidebar.zv-collapsed > .kt-inside-inner-col {
		display: none;
	}

	.shop-sidebar.zv-collapsed .zv-sidebar-toggle {
		flex-direction: column;
		width: var(--zv-tab-w);
		padding: 14px 0;
	}

	.shop-sidebar.zv-collapsed .zv-sidebar-toggle span {
		writing-mode: vertical-rl;
		transform: rotate(180deg);
	}

	.shop-sidebar.zv-collapsed .zv-sidebar-toggle .zv-chev {
		display: none;
	}
}

@media (min-width: 768px) and (prefers-reduced-motion: reduce) {

	.shop-sidebar {
		transition: none;
	}
}

/* Mobile (767px and below)
-------------------------------------------------------------- */
@media (max-width: 767px) {

	#inner-wrap {
		padding-left: 15px;
		padding-right: 15px;
	}

	.dgwt-wcas-search-icon path {
		fill: var(--global-palette3) !important;
	}

	.kwt-description-wrap h1 {
		font-size: 20px;
		line-height: 1.2;
	}

	.kwt-description-wrap h2 {
		font-size: 20px;
	}

	/* Shop sidebar: stacked above the products, with a collapsible category menu. */
	.shop-sidebar {
		flex: 0 0 auto !important;
		height: auto !important;
	}

	/* The toggle button replaces the "By Category" heading. */
	.shop-sidebar p:has(+ .zv-cat-wrap) {
		display: none;
	}

	.zv-cat-toggle {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		margin: 0 0 10px;
		padding: 12px 15px;
		border: 1px solid var(--global-palette3);
		border-radius: 5px;
		background: var(--global-palette9);
		color: var(--global-palette3);
		font-size: 14px;
		font-weight: 700;
		letter-spacing: 0.05em;
		text-transform: uppercase;
		cursor: pointer;
	}

	.zv-cat-toggle:hover,
	.zv-cat-toggle:focus {
		background: var(--global-palette9);
		color: var(--global-palette3);
		box-shadow: none;
	}

	.zv-cat-toggle svg {
		transition: transform 0.3s ease;
	}

	.zv-cat-toggle[aria-expanded="true"] svg {
		transform: rotate(180deg);
	}

	.zv-cat-wrap .menu-inventory-menu-container {
		display: none;
	}

	.zv-cat-wrap.is-open .menu-inventory-menu-container {
		display: block;
	}

	/* Homepage product carousels: 2 cards per view. */
	.home-slider .splide__track li.product {
		width: calc((100% - 12px) / 2) !important;
		margin-right: 12px !important;
	}

	/* ZV product slider: the active card plus a cut-off preview of the next one. */
	.zv-product-slider .zv-product-slider__swiper {
		--zv-card-w: calc((100cqi - 15px) / 1.75);
		margin-right: calc(50% - 50vw);
	}

	.zv-product-slider .zv-product-slider__aside {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		column-gap: 12px;
		width: 100%;
	}

	.zv-product-slider .zv-product-slider__aside > * {
		flex: 0 0 100%;
	}

	.zv-product-slider .zv-product-slider__aside > .zv-product-slider__nav,
	.zv-product-slider .zv-product-slider__aside > .zv-product-slider__shop-all {
		flex: 0 0 auto;
		margin-bottom: 0;
	}

	.zv-product-slider .zv-card__link {
		padding: 8px 8px 14px;
	}

	.zv-product-slider .zv-card__title {
		font-size: 12px;
	}

	.zv-product-slider .zv-card__price {
		margin-top: 6px;
		font-size: 13px;
	}

	/* Product cards. */
	.custom-oos-badge,
	.custom-sale-badge {
		top: 10px;
		left: 10px;
		font-size: 10px;
	}

	.product-card > .kt-row-column-wrap > .wp-block-kadence-column > .kt-inside-inner-col {
		padding: 8px 8px 10px;
	}

	.product-card .kt-inside-inner-col > .wp-block-kadence-icon {
		top: 14px;
		right: 14px;
	}

	.product-card .kt-svg-icon-link {
		width: 32px;
		height: 32px;
	}

	.product-card .kt-svg-icon-link svg {
		width: 16px;
		height: 16px;
	}

	.product-card .kwt-image-wrap a.woocommerce-loop-image-link {
		border-radius: 8px;
	}

	.product-card .kt-inside-inner-col > h2.wp-block-kadence-advancedheading {
		margin-top: 10px !important;
		font-size: 12px !important;
	}

	.product-card .zv-card-brand {
		font-size: 10px;
	}

	.product-card .kt-inside-inner-col > .kwt-price-wrap,
	.product-card .kwt-price-wrap .amount {
		font-size: 14px !important;
	}

	.kb-loop-swatches-cart {
		gap: 6px;
		min-height: 66px; /* 28px swatch row + gap + 32px button */
	}

	.kb-loop-swatches-cart fieldset.kad_radio_variations {
		gap: 6px;
	}

	.kb-loop-swatches-cart fieldset.kad_radio_variations label {
		width: 28px;
		height: 28px;
		flex-basis: 28px;
		padding: 1px !important;
	}

	.kb-loop-swatches-cart .swatch-more-link {
		line-height: 28px;
	}

	.kb-loop-swatches-cart a.kb-loop-swatches-button {
		min-height: 32px;
		padding: 7px 6px;
		font-size: 11px;
		letter-spacing: 0.05em;
	}
}
