/**
 * DawaDose Brand Store — front end.
 * Ported from the approved reference template. Every rule is scoped under
 * .dwd-bs so nothing leaks into the rest of the WoodMart site.
 * Colours arrive as custom properties, injected per store from term meta.
 */

.dwd-bs {
	--dwd-primary: #0a5ca8;
	--dwd-primary-dark: #09345d;
	--dwd-accent: #63a5e8;
	--dwd-tint: #edf5ff;
	--dwd-hero: #f2f7fc;
	--dwd-text: #10253a;
	--dwd-muted: #687683;
	--dwd-border: #e0e6eb;

	color: var(--dwd-text);
}

.dwd-bs-wrap {
	width: min(1400px, calc(100% - 64px));
	margin-inline: auto;
}

/* -------------------------------------------------------- hide theme chrome
   The rules that hide WoodMart's header, sticky clone, page title and footer
   are NOT here. They are printed inline into <head> by
   DWD_BS_Template::print_chrome_css() so they work even if this file is stale
   in a cache or fails to load. Change the list there, not here. */

body.dwd-brand-store .site-content {
	margin-bottom: 0 !important;
	padding-top: 0 !important;
}

/* --------------------------------------------------------- platform bar */

.dwd-bs-platform {
	background: var(--dwd-primary-dark);
	color: #fff;
}

.dwd-bs-platform-in {
	min-height: 44px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	direction: ltr;
}

.dwd-bs-platform a {
	color: #fff;
	text-decoration: none;
	font-weight: 700;
	font-size: 14px;
}

.dwd-bs-platform a:hover {
	opacity: .85;
}

.dwd-bs-back {
	direction: rtl;
}

.dwd-bs-platform-brand {
	letter-spacing: .02em;
}

/* ---------------------------------------------------------------- store nav */

.dwd-bs-nav {
	background: #fff;
	border-bottom: 1px solid var(--dwd-border);
	position: relative;
}

/* Laid out LTR to match the approved reference: identity left, links centre,
   tools right. Children with text restore RTL for correct Arabic rendering. */
.dwd-bs-nav-in {
	display: flex;
	align-items: center;
	gap: 32px;
	min-height: 110px;
	direction: ltr;
}

.dwd-bs-identity {
	display: flex;
	align-items: center;
	gap: 16px;
	direction: rtl;
	text-decoration: none;
	color: inherit;
}

.dwd-bs-identity img {
	width: 84px;
	height: 84px;
	object-fit: contain;
	border-radius: 50%;
	border: 1px solid var(--dwd-border);
	padding: 6px;
	background: #fff;
	flex: 0 0 auto;
}

.dwd-bs-identity strong {
	display: block;
	font-size: 22px;
	line-height: 1.3;
}

.dwd-bs-identity small {
	display: block;
	color: var(--dwd-muted);
	font-size: 14px;
	margin-top: 3px;
}

.dwd-bs-links {
	display: flex;
	align-items: center;
	gap: 38px;
	margin-inline: auto;
	direction: rtl;
}

.dwd-bs-links a {
	color: var(--dwd-text);
	font-weight: 700;
	text-decoration: none;
	padding: 8px 0;
	white-space: nowrap;
	border-bottom: 3px solid transparent;
}

.dwd-bs-links a:hover {
	color: var(--dwd-primary);
}

.dwd-bs-links a.is-active {
	color: var(--dwd-primary);
	border-bottom-color: var(--dwd-primary);
}

.dwd-bs-nav-tools {
	display: flex;
	align-items: center;
	gap: 18px;
	direction: rtl;
	margin-inline-start: auto;
}

.dwd-bs-search-toggle {
	width: 34px;
	height: 34px;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
	position: relative;
}

.dwd-bs-search-toggle::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--dwd-text);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 22px;
	mask-size: 22px;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 2a8 8 0 1 0 4.9 14.3l5.4 5.4 1.4-1.4-5.4-5.4A8 8 0 0 0 10 2Zm0 2a6 6 0 1 1 0 12 6 6 0 0 1 0-12Z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 2a8 8 0 1 0 4.9 14.3l5.4 5.4 1.4-1.4-5.4-5.4A8 8 0 0 0 10 2Zm0 2a6 6 0 1 1 0 12 6 6 0 0 1 0-12Z'/%3E%3C/svg%3E");
}

.dwd-bs-search-toggle:hover::before {
	background: var(--dwd-primary);
}

.dwd-bs-cart {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	color: var(--dwd-text);
	font-weight: 700;
	font-size: 14px;
	text-decoration: none;
	white-space: nowrap;
}

.dwd-bs-cart::after {
	content: "";
	width: 24px;
	height: 24px;
	flex: 0 0 24px;
	background: currentColor;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 18a2 2 0 1 0 0 4 2 2 0 0 0 0-4Zm10 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4ZM1 2h3l3.6 12h9.8l2.7-8H7'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 18a2 2 0 1 0 0 4 2 2 0 0 0 0-4Zm10 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4ZM1 2h3l3.6 12h9.8l2.7-8H7'/%3E%3C/svg%3E");
}

.dwd-bs-cart:hover {
	color: var(--dwd-primary);
}

.dwd-bs-cart-count {
	position: absolute;
	inset-inline-end: -8px;
	top: -10px;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 10px;
	background: var(--dwd-primary);
	color: #fff;
	font-size: 11px;
	font-style: normal;
	font-weight: 700;
	line-height: 20px;
	text-align: center;
}

.dwd-bs-cart-count[hidden] {
	display: none;
}

/* Burger — mobile only.
   Selector is doubled up (.dwd-bs .dwd-bs-burger) because WoodMart's button
   resets were out-specifying a bare .dwd-bs-burger and leaking it onto desktop.
   See the explicit min-width guard at the end of this file too. */
.dwd-bs .dwd-bs-burger {
	display: none;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1px solid var(--dwd-border);
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
	position: relative;
}

.dwd-bs-burger span,
.dwd-bs-burger span::before,
.dwd-bs-burger span::after {
	position: absolute;
	left: 50%;
	width: 18px;
	height: 2px;
	margin-left: -9px;
	background: var(--dwd-text);
}

.dwd-bs-burger span {
	top: 50%;
	margin-top: -1px;
}

.dwd-bs-burger span::before,
.dwd-bs-burger span::after {
	content: "";
	left: 0;
	margin-left: 0;
}

.dwd-bs-burger span::before {
	top: -6px;
}

.dwd-bs-burger span::after {
	top: 6px;
}

/* ------------------------------------------------------------------ search */

.dwd-bs-search {
	border-top: 1px solid var(--dwd-border);
	background: var(--dwd-tint);
}

.dwd-bs-search[hidden] {
	display: none;
}

.dwd-bs-search-in {
	display: flex;
	gap: 10px;
	padding: 16px 0;
}

.dwd-bs-search-in input[type="search"] {
	flex: 1;
	min-width: 0;
	height: 44px;
	padding: 0 14px;
	border: 1px solid var(--dwd-border);
	border-radius: 8px;
	background: #fff;
	font: inherit;
}

.dwd-bs-search-in button {
	height: 44px;
	padding: 0 26px;
	border: 0;
	border-radius: 8px;
	background: var(--dwd-primary);
	color: #fff;
	font-weight: 700;
	cursor: pointer;
}

.dwd-bs-search-in button:hover {
	opacity: .9;
}

/* -------------------------------------------------------------------- hero */

.dwd-bs-hero {
	border-radius: 22px 22px 0 0;
	background:
		radial-gradient(circle at 20% 50%, #fff 0, transparent 28%),
		linear-gradient(245deg, var(--dwd-hero), #fff, var(--dwd-tint));
	display: grid;
	grid-template-columns: 1fr 1.1fr;
	align-items: center;
	overflow: hidden;
	min-height: 355px;
	/* LTR so the copy takes the left column and the artwork the right, matching
	   the approved reference. Children restore RTL for correct Arabic text. */
	direction: ltr;
}

.dwd-bs-copy {
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* Trimmed from 70px: long Arabic store names were wrapping the headline to
	   three lines, which stretched the hero well past its intended height. */
	padding: 48px 52px;
	direction: rtl;
	text-align: right;
}

.dwd-bs-hero-media {
	direction: rtl;
}

.dwd-bs-copy h1 {
	font-size: clamp(28px, 3.2vw, 43px);
	line-height: 1.35;
	margin: 0 0 14px;
	color: var(--dwd-text);
}

.dwd-bs-copy h1 span {
	color: var(--dwd-primary);
}

.dwd-bs-copy p {
	line-height: 1.7;
	color: var(--dwd-muted);
	font-size: 16px;
	max-width: 560px;
	margin: 0;
}

.dwd-bs-actions {
	display: flex;
	gap: 14px;
	margin-top: 22px;
	flex-wrap: wrap;
}

.dwd-bs-btn {
	padding: 15px 30px;
	border-radius: 10px;
	font-weight: 700;
	text-decoration: none;
	display: inline-block;
	transition: opacity .15s ease;
}

.dwd-bs-btn:hover {
	opacity: .88;
}

.dwd-bs-solid {
	background: var(--dwd-primary-dark);
	color: #fff;
}

.dwd-bs-outline {
	border: 1.5px solid var(--dwd-primary);
	color: var(--dwd-primary);
	background: #fff;
}

.dwd-bs-hero-media {
	height: 100%;
	align-self: stretch;
	display: flex;
	min-height: 0;
}

/* --- background: the image IS the hero. Text overlays it. ----------------
   The image renders at its natural aspect ratio and defines the hero height,
   so the artwork is never cropped. The copy is then positioned over the empty
   side of the banner. */

.dwd-bs-hero--background {
	display: block;
	position: relative;
	min-height: 0;
	background: var(--dwd-hero);
}

.dwd-bs-hero--background .dwd-bs-hero-media {
	display: block;
	height: auto;
}

.dwd-bs-hero--background .dwd-bs-hero-media img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: contain;
}

.dwd-bs-hero--background .dwd-bs-copy {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 52%;
	z-index: 1;
	justify-content: center;
	padding: 3% 4%;
}

/* Headline scales with the banner so the overlay keeps its proportions
   instead of overflowing on narrower screens. */
.dwd-bs-hero--background .dwd-bs-copy h1 {
	font-size: clamp(20px, 3vw, 43px);
	margin-bottom: .4em;
}

.dwd-bs-hero--background .dwd-bs-copy p {
	font-size: clamp(12px, 1.15vw, 16px);
}

.dwd-bs-hero--background .dwd-bs-actions {
	margin-top: 1.2em;
}

/* --- contain: whole image visible, never cropped ------------------------- */

.dwd-bs-hero-media.is-contain {
	align-items: center;
	justify-content: center;
	padding: 16px 0;
}

.dwd-bs-hero-media.is-contain img {
	display: block;
	width: 100%;
	height: 100%;
	max-height: 340px;
	object-fit: contain;
	object-position: center;
}

/* --- fill: crops to cover the half -------------------------------------- */

.dwd-bs-hero-media.is-fill {
	align-items: stretch;
	justify-content: stretch;
}

.dwd-bs-hero-media.is-fill img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

/* --- cutout: transparent PNG floating on the hero background ------------- */

.dwd-bs-hero-media.is-cutout {
	align-items: flex-end;
	justify-content: center;
	padding: 20px 0 0;
}

.dwd-bs-hero-media.is-cutout img {
	max-width: 100%;
	max-height: 340px;
	width: auto;
	height: auto;
	object-fit: contain;
	filter: drop-shadow(0 17px 12px rgba(12, 50, 80, .18));
}

/* --------------------------------------------------------------- trust bar */

.dwd-bs-trust {
	border: 1px solid var(--dwd-border);
	border-radius: 0 0 22px 22px;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	background: #fff;
}

.dwd-bs-trust article {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	padding: 24px 20px;
	border-inline-start: 1px solid var(--dwd-border);
}

.dwd-bs-trust article:first-child {
	border-inline-start: 0;
}

.dwd-bs-trust b,
.dwd-bs-trust small {
	display: block;
}

.dwd-bs-trust small {
	color: var(--dwd-muted);
	margin-top: 5px;
}

.dwd-bs-ico {
	width: 40px;
	height: 40px;
	flex: 0 0 40px;
	background: var(--dwd-primary);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.dwd-bs-ico-shield {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 4 5v6c0 5 3.4 9.7 8 11 4.6-1.3 8-6 8-11V5l-8-3Zm-1 14-4-4 1.4-1.4L11 13.2l5.6-5.6L18 9l-7 7Z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 4 5v6c0 5 3.4 9.7 8 11 4.6-1.3 8-6 8-11V5l-8-3Zm-1 14-4-4 1.4-1.4L11 13.2l5.6-5.6L18 9l-7 7Z'/%3E%3C/svg%3E");
}

.dwd-bs-ico-truck {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 4h11v10H3V4Zm12 3h3.5L21 10.5V14h-6V7ZM6.5 20a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm11 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4Z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 4h11v10H3V4Zm12 3h3.5L21 10.5V14h-6V7ZM6.5 20a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm11 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4Z'/%3E%3C/svg%3E");
}

.dwd-bs-ico-support {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a9 9 0 0 0-9 9v6a3 3 0 0 0 3 3h2v-8H5v-1a7 7 0 0 1 14 0v1h-3v8h2a3 3 0 0 0 3-3v-6a9 9 0 0 0-9-9Z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a9 9 0 0 0-9 9v6a3 3 0 0 0 3 3h2v-8H5v-1a7 7 0 0 1 14 0v1h-3v8h2a3 3 0 0 0 3-3v-6a9 9 0 0 0-9-9Z'/%3E%3C/svg%3E");
}

/* -------------------------------------------------------------- categories */

.dwd-bs-categories {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	margin-top: 24px;
}

.dwd-bs-categories article {
	min-height: 100px;
	border: 1px solid var(--dwd-border);
	border-radius: 15px;
	background: linear-gradient(120deg, #fff, var(--dwd-tint));
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 18px 24px;
}

.dwd-bs-categories i {
	order: -1;
	width: 62px;
	height: 62px;
	flex: 0 0 62px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: color-mix(in srgb, var(--dwd-accent) 18%, white);
	overflow: hidden;
}

.dwd-bs-categories i img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Built-in icons for categories with no thumbnail set in WooCommerce.
   Cycles by position so a row of four never repeats. */
.dwd-bs-cat-ico::before {
	content: "";
	width: 32px;
	height: 32px;
	background: var(--dwd-primary);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-image: var(--dwd-cat-icon);
	mask-image: var(--dwd-cat-icon);
}

/* 1 — pill / medicines */
.dwd-bs-categories article:nth-child(4n + 1) .dwd-bs-cat-ico {
	--dwd-cat-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.9 3.1a5.5 5.5 0 0 1 7.8 7.8l-7.8 7.8a5.5 5.5 0 0 1-7.8-7.8l7.8-7.8Zm-1.4 4.2-4.3 4.3a3.5 3.5 0 0 0 5 5l4.2-4.3-4.9-5Z'/%3E%3C/svg%3E");
}

/* 2 — supplement bottle */
.dwd-bs-categories article:nth-child(4n + 2) .dwd-bs-cat-ico {
	--dwd-cat-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 2h6v3H9V2Zm-1 4h8a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2Zm3 3v2H9v2h2v2h2v-2h2v-2h-2V9h-2Z'/%3E%3C/svg%3E");
}

/* 3 — personal care */
.dwd-bs-categories article:nth-child(4n + 3) .dwd-bs-cat-ico {
	--dwd-cat-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 2h4v2h-4V2ZM9.5 5h5L16 7.5V9H8V7.5L9.5 5ZM8 10h8a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H8a1 1 0 0 1-1-1V11a1 1 0 0 1 1-1Zm1.5 2.5v2h5v-2h-5Z'/%3E%3C/svg%3E");
}

/* 4 — baby care */
.dwd-bs-categories article:nth-child(4n + 4) .dwd-bs-cat-ico {
	--dwd-cat-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20ZM8.75 9.5a1.25 1.25 0 1 1 2.5 0 1.25 1.25 0 0 1-2.5 0Zm4 0a1.25 1.25 0 1 1 2.5 0 1.25 1.25 0 0 1-2.5 0ZM8 14h8a4 4 0 0 1-8 0Z'/%3E%3C/svg%3E");
}

.dwd-bs-categories b {
	display: block;
	font-size: 17px;
}

.dwd-bs-categories a {
	display: block;
	color: var(--dwd-primary);
	margin-top: 8px;
	text-decoration: none;
	font-size: 14px;
}

.dwd-bs-categories a:hover {
	text-decoration: underline;
}

/* ---------------------------------------------------------------- products */

.dwd-bs-products {
	padding: 34px 0 70px;
}

.dwd-bs-heading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 22px;
	flex-wrap: wrap;
}

.dwd-bs-heading h2 {
	border-inline-start: 4px solid var(--dwd-primary);
	padding-inline-start: 12px;
	margin: 0;
	font-size: 24px;
}

.dwd-bs-tools {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

.dwd-bs-tools .woocommerce-result-count {
	margin: 0;
	color: var(--dwd-muted);
	font-size: 14px;
}

/* --------------------------------------------------------- product cards */

.dwd-bs-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 28px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.dwd-bs-card {
	position: relative;
	display: grid;
	grid-template-columns: 1.05fr .95fr;
	align-items: center;
	gap: 12px;
	min-height: 220px;
	padding: 16px;
	background: #fff;
	border: 1px solid var(--dwd-border);
	border-radius: 15px;
	transition: box-shadow .18s ease, border-color .18s ease;
}

.dwd-bs-card:hover {
	border-color: color-mix(in srgb, var(--dwd-primary) 40%, white);
	box-shadow: 0 10px 26px rgba(12, 50, 80, .10);
}

/* The page is RTL, so grid column 1 lands on the right. Details go there and
   the image sits on the left, matching the approved reference. */
.dwd-bs-card-info {
	order: 1;
	min-width: 0;
}

.dwd-bs-card-media {
	order: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	text-decoration: none;
}

.dwd-bs-card-img {
	max-width: 100%;
	max-height: 170px;
	width: auto;
	height: auto;
	object-fit: contain;
	filter: drop-shadow(0 10px 8px rgba(12, 50, 80, .11));
}

.dwd-bs-card-title {
	margin: 0 0 6px;
	font-size: 16px;
	line-height: 1.4;
	font-weight: 700;
}

.dwd-bs-card-title a {
	color: var(--dwd-text);
	text-decoration: none;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.dwd-bs-card-title a:hover {
	color: var(--dwd-primary);
}

.dwd-bs-card-meta {
	display: block;
	color: var(--dwd-muted);
	font-size: 13px;
	line-height: 1.5;
}

.dwd-bs-card-price {
	display: block;
	margin-top: 14px;
	color: var(--dwd-primary-dark);
	font-size: 20px;
	font-weight: 700;
}

.dwd-bs-card-price .amount,
.dwd-bs-card-price ins {
	color: var(--dwd-primary-dark);
	text-decoration: none;
}

.dwd-bs-card-price del {
	display: inline-block;
	margin-inline-start: 6px;
	color: var(--dwd-muted);
	font-size: 13px;
	font-weight: 400;
}

.dwd-bs-card-price .woocommerce-Price-currencySymbol {
	font-size: 12px;
	font-weight: 500;
}

/* CTA — outlined button, icon-only where the action really is add-to-cart. */
.dwd-bs-card-cta {
	margin-top: 10px;
}

.dwd-bs-card-cta .button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	min-height: 38px;
	padding: 0 12px;
	border: 1.5px solid var(--dwd-primary);
	border-radius: 7px;
	background: #fff;
	color: var(--dwd-primary);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	transition: background-color .15s ease, color .15s ease;
}

.dwd-bs-card-cta .button:hover,
.dwd-bs-card-cta .button:focus {
	background: var(--dwd-primary);
	color: #fff;
}

/* WoodMart's loop/add-to-cart.php injects its own .wd-action-icon. Suppress it
   so it doesn't sit next to the cart glyph we draw below. Scoped to the CTA so
   the wishlist button keeps its icon. */
.dwd-bs-card-cta .button .wd-action-icon {
	display: none;
}

.dwd-bs-card-cta .button .wd-action-text {
	font-size: 13px;
}

.dwd-bs-card-cta .button::before {
	content: "";
	width: 18px;
	height: 18px;
	flex: 0 0 18px;
	background: currentColor;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 18a2 2 0 1 0 0 4 2 2 0 0 0 0-4Zm10 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4ZM1 2h3l3.6 12h9.8l2.7-8H7'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 18a2 2 0 1 0 0 4 2 2 0 0 0 0-4Zm10 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4ZM1 2h3l3.6 12h9.8l2.7-8H7'/%3E%3C/svg%3E");
}

/* Icon-only. font-size:0 on the button covers both markup shapes — WoodMart's
   .wd-action-text span and a bare text node if another plugin filters the link.
   The glyph is unaffected: it is sized in px, not em. */
.dwd-bs-card--icon-cta .dwd-bs-card-cta .button,
.dwd-bs-card--icon-cta .dwd-bs-card-cta .button .wd-action-text {
	font-size: 0;
	gap: 0;
}

.dwd-bs-card-cta .button.loading::before {
	animation: dwd-bs-spin .8s linear infinite;
}

@keyframes dwd-bs-spin {
	to {
		transform: rotate(360deg);
	}
}

.dwd-bs-card-cta .added_to_cart {
	display: block;
	margin-top: 6px;
	color: var(--dwd-primary);
	font-size: 12px;
	text-align: center;
}

/* Corner badges. Discount sits over the image (left), heart opposite (right). */
.dwd-bs-card-badge {
	position: absolute;
	left: 12px;
	top: 12px;
	z-index: 2;
	padding: 4px 9px;
	border-radius: 7px;
	background: var(--dwd-primary);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
}

.dwd-bs-card-wish {
	position: absolute;
	right: 8px;
	top: 8px;
	z-index: 2;
}

.dwd-bs-card-wish .wd-wishlist-btn a {
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	color: var(--dwd-muted);
}

.dwd-bs-card-wish .wd-wishlist-btn a:hover,
.dwd-bs-card-wish .wd-wishlist-btn a.added {
	color: var(--dwd-primary);
}

/* WoodMart renders the label inline; the card only has room for the icon. */
.dwd-bs-card-wish .wd-action-text {
	display: none;
}

/* Pagination */
.dwd-bs .woocommerce-pagination {
	margin-top: 32px;
	text-align: center;
}

.dwd-bs .woocommerce-pagination .page-numbers li .current,
.dwd-bs .woocommerce-pagination .page-numbers li a:hover {
	background-color: var(--dwd-primary);
	border-color: var(--dwd-primary);
	color: #fff;
}

/* -------------------------------------------------------- floating buttons */

.dwd-bs-contact {
	position: fixed;
	/* Physical left, not inset-inline-start — the page is RTL, which would flip
	   these to the right and collide with the site's own chat widget. */
	left: 24px;
	bottom: 24px;
	z-index: 380;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.dwd-bs-contact a {
	height: 48px;
	border-radius: 24px;
	padding: 0 18px;
	display: flex;
	align-items: center;
	gap: 8px;
	color: #fff;
	text-decoration: none;
	font-weight: 700;
	font-size: 13px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
}

.dwd-bs-contact a::before {
	content: "";
	width: 20px;
	height: 20px;
	background: #fff;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-position: center;
	mask-position: center;
}

.dwd-bs-chatbot {
	background: var(--dwd-primary);
}

.dwd-bs-chatbot::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 2H4a2 2 0 0 0-2 2v18l4-4h14a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2Z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 2H4a2 2 0 0 0-2 2v18l4-4h14a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2Z'/%3E%3C/svg%3E");
}

.dwd-bs-whatsapp {
	background: #20b15a;
}

.dwd-bs-whatsapp::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-8.7 15L2 22l5.2-1.3A10 10 0 1 0 12 2Zm5.5 14.2c-.2.6-1.2 1.2-1.7 1.2-.5.1-1 .1-1.7-.1a12 12 0 0 1-6.6-5.7c-.5-.9-.8-1.8-.8-2.6 0-.9.5-1.4.7-1.6.2-.2.5-.3.7-.3h.5c.2 0 .4 0 .6.5l.8 2c.1.2.1.4 0 .5l-.3.5-.3.3c-.1.2-.3.3-.1.6.2.3.8 1.3 1.7 2.1 1.1 1 2 1.3 2.3 1.4.3.1.5.1.6-.1l.9-1c.2-.2.3-.2.6-.1l2 .9c.3.2.5.2.5.4v.7Z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-8.7 15L2 22l5.2-1.3A10 10 0 1 0 12 2Zm5.5 14.2c-.2.6-1.2 1.2-1.7 1.2-.5.1-1 .1-1.7-.1a12 12 0 0 1-6.6-5.7c-.5-.9-.8-1.8-.8-2.6 0-.9.5-1.4.7-1.6.2-.2.5-.3.7-.3h.5c.2 0 .4 0 .6.5l.8 2c.1.2.1.4 0 .5l-.3.5-.3.3c-.1.2-.3.3-.1.6.2.3.8 1.3 1.7 2.1 1.1 1 2 1.3 2.3 1.4.3.1.5.1.6-.1l.9-1c.2-.2.3-.2.6-.1l2 .9c.3.2.5.2.5.4v.7Z'/%3E%3C/svg%3E");
}

/* ------------------------------------------------------------- responsive */

@media (max-width: 1100px) {
	.dwd-bs-nav-in {
		flex-wrap: wrap;
		gap: 16px;
		min-height: 0;
		padding: 14px 0;
	}

	.dwd-bs .dwd-bs-burger {
		display: block;
		order: 3;
	}

	.dwd-bs-nav-tools {
		order: 2;
		margin-inline-start: auto;
	}

	/* Collapsed menu drops to its own full-width row. */
	.dwd-bs-links {
		order: 4;
		display: none;
		width: 100%;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		margin: 0;
		border-top: 1px solid var(--dwd-border);
		padding-top: 8px;
	}

	.dwd-bs-links.is-open {
		display: flex;
	}

	.dwd-bs-links a {
		padding: 12px 4px;
		border-bottom: 1px solid var(--dwd-border);
	}

	.dwd-bs-links a:last-child {
		border-bottom: 0;
	}

	.dwd-bs-links a.is-active {
		border-bottom-color: var(--dwd-border);
	}
}

@media (max-width: 950px) {
	.dwd-bs-hero {
		grid-template-columns: 1fr;
	}

	.dwd-bs-copy {
		padding: 42px;
		text-align: center;
		align-items: center;
	}

	/* Below this width the overlay is unreadable, so the banner and the copy
	   stack: artwork on top, text underneath on the hero background. */
	.dwd-bs-hero--background .dwd-bs-copy {
		position: static;
		width: 100%;
		padding: 32px 24px;
	}

	.dwd-bs-hero--background .dwd-bs-copy h1 {
		font-size: clamp(24px, 5vw, 34px);
	}

	.dwd-bs-hero--background .dwd-bs-copy p {
		font-size: 15px;
	}

	/* The artwork is hidden on the smallest screens by the rule below; keep it
	   visible here so the banner still reads on tablets. */
	.dwd-bs-hero--background .dwd-bs-hero-media {
		display: block;
	}

	.dwd-bs-actions {
		justify-content: center;
	}

	.dwd-bs-trust,
	.dwd-bs-categories,
	.dwd-bs-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.dwd-bs-grid {
		gap: 16px;
	}

	.dwd-bs-trust article:nth-child(odd) {
		border-inline-start: 0;
	}
}

@media (max-width: 782px) {
	.dwd-bs-card {
		min-height: 0;
		grid-template-columns: 1fr;
		text-align: center;
	}

	/* Stacked: image above the details. */
	.dwd-bs-card-media {
		order: 1;
	}

	.dwd-bs-card-info {
		order: 2;
	}

	.dwd-bs-card-img {
		max-height: 130px;
	}
}

@media (max-width: 600px) {
	.dwd-bs-wrap {
		width: calc(100% - 24px);
	}

	.dwd-bs-identity img {
		width: 56px;
		height: 56px;
	}

	.dwd-bs-identity strong {
		font-size: 17px;
	}

	.dwd-bs-identity small {
		font-size: 12px;
	}

	/* Cart label collapses to the icon + bubble. */
	.dwd-bs-cart span {
		display: none;
	}

	.dwd-bs-search-in {
		flex-wrap: wrap;
	}

	.dwd-bs-search-in button {
		width: 100%;
	}

	.dwd-bs-copy {
		padding: 32px 18px;
	}

	.dwd-bs-hero-media {
		display: none;
	}

	.dwd-bs-trust,
	.dwd-bs-categories {
		grid-template-columns: 1fr;
	}

	.dwd-bs-heading {
		flex-direction: column;
		align-items: flex-start;
	}

	.dwd-bs-trust article {
		border-inline-start: 0;
		border-top: 1px solid var(--dwd-border);
	}

	.dwd-bs-trust article:first-child {
		border-top: 0;
	}

	.dwd-bs-contact a {
		font-size: 0;
		padding: 0 14px;
	}
}

/* ---------------------------------------------------------- desktop guard
   Explicit counterpart to the mobile burger rule. Without this the theme's
   own button styling could re-show the burger on wide screens, and the
   collapsed menu could stay stuck closed after a resize. */

@media (min-width: 1101px) {
	.dwd-bs .dwd-bs-burger {
		display: none !important;
	}

	/* The JS toggle adds .is-open; on desktop the nav is always a row. */
	.dwd-bs .dwd-bs-links {
		display: flex !important;
	}
}