/* ==========================================================================
   Happy Treat – main stylesheet
   Every color, radius, shadow and transition comes from theme.json presets.
   The short aliases below exist only to keep the component code readable;
   change a value in theme.json and it updates everywhere.
   ========================================================================== */

:root {
	/* Colors */
	--ht-pink: var(--wp--preset--color--pink);
	--ht-pink-dark: var(--wp--preset--color--pink-dark);
	--ht-pink-nav: var(--wp--preset--color--pink-nav);
	--ht-pink-soft: var(--wp--preset--color--pink-soft);
	--ht-pink-wash: var(--wp--preset--color--pink-wash);
	--ht-plum: var(--wp--preset--color--plum);
	--ht-navy: var(--wp--preset--color--navy);
	--ht-navy-card: var(--wp--preset--color--navy-card);
	--ht-navy-hover: var(--wp--preset--color--navy-hover);
	--ht-cream: var(--wp--preset--color--cream);
	--ht-text: var(--wp--preset--color--text);
	--ht-gray: var(--wp--preset--color--gray);
	--ht-gray-light: var(--wp--preset--color--gray-light);
	--ht-line: var(--wp--preset--color--line);
	--ht-card-border: var(--wp--preset--color--card-border);
	--ht-gold: var(--wp--preset--color--gold);
	--ht-white: var(--wp--preset--color--white);
	--ht-black: var(--wp--preset--color--black);
	--ht-text-soft: color-mix(in srgb, var(--ht-text) 62%, transparent);
	--ht-border-soft: color-mix(in srgb, var(--ht-text) 15%, transparent);
	--ht-border-form: color-mix(in srgb, var(--ht-text) 30%, transparent);
	--ht-on-dark-line: rgba(255, 255, 255, 0.15);
	--ht-taurinas: var(--wp--preset--color--taurinas);
	--ht-taurinas-dark: var(--wp--preset--color--taurinas-dark);

	/* Shape */
	--ht-r-xs: var(--wp--custom--radius--xs);
	--ht-r-sm: var(--wp--custom--radius--sm);
	--ht-r-md: var(--wp--custom--radius--md);
	--ht-r-lg: var(--wp--custom--radius--lg);
	--ht-r-xl: var(--wp--custom--radius--xl);
	--ht-r-xxl: var(--wp--custom--radius--xxl);
	--ht-r-card: var(--wp--custom--radius--card);
	--ht-r-form: var(--wp--custom--radius--form);
	--ht-r-pill: var(--wp--custom--radius--pill);

	/* Depth & motion */
	--ht-shadow-card: var(--wp--preset--shadow--card);
	--ht-shadow-hover: var(--wp--preset--shadow--card-hover);
	--ht-shadow-lift: var(--wp--preset--shadow--lift);
	--ht-shadow-modal: var(--wp--preset--shadow--modal);
	--ht-t-fast: var(--wp--custom--transition--fast);
	--ht-t-base: var(--wp--custom--transition--base);
	--ht-lift-sm: translateY(var(--wp--custom--lift--sm));
	--ht-lift-md: translateY(var(--wp--custom--lift--md));
	--ht-lift-lg: translateY(var(--wp--custom--lift--lg));

	/* Type & layout */
	--ht-font-heading: var(--wp--preset--font-family--heading);
	--ht-font-body: var(--wp--preset--font-family--body);
	--ht-fs-tiny: var(--wp--preset--font-size--tiny);
	--ht-fs-xs: var(--wp--preset--font-size--x-small);
	--ht-fs-sm: var(--wp--preset--font-size--small);
	--ht-fs-md: var(--wp--preset--font-size--medium);
	--ht-fs-lg: var(--wp--preset--font-size--large);
	--ht-fs-xl: var(--wp--preset--font-size--x-large);
	--ht-fs-section: var(--wp--preset--font-size--section);
	--ht-fs-hero: var(--wp--preset--font-size--hero);
	--ht-max: var(--wp--style--global--wide-size, 1400px);
	--ht-gutter: var(--wp--custom--gutter);
	--ht-section-y: var(--wp--preset--spacing--section);
	--ht-logo-h: var(--wp--custom--header--logo-height);
}

@media (max-width: 767px) {
	:root {
		--ht-r-card: 15px;
		--ht-logo-h: var(--wp--custom--header--logo-height-mobile);
	}
}

/* --------------------------------------------------------------------------
   1. Base
   -------------------------------------------------------------------------- */
body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

::selection {
	background: var(--ht-pink-soft);
	color: var(--ht-navy);
}

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--ht-pink);
	outline-offset: 2px;
}

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

.wp-site-blocks {
	padding-left: 0;
	padding-right: 0;
}

/* Stack page chrome without the default block gap between them */
.wp-site-blocks > *,
.ht-header > *,
.ht-home > *,
.ht-footer > *,
.ht-footer__main,
main.wp-block-group {
	margin-block-start: 0;
}

.ht-container {
	width: 100%;
	max-width: var(--ht-max);
	margin-inline: auto;
	padding-inline: var(--ht-gutter);
	box-sizing: border-box;
}

.ht-section {
	padding-block: var(--ht-section-y);
	margin-block: 0;
}

.screen-reader-text:not(:focus) {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Shared hover lift used by cards and buttons */
.ht-lift {
	transition: transform var(--ht-t-base), box-shadow var(--ht-t-base);
}

/* --------------------------------------------------------------------------
   2. Shared section heading (eyebrow + title + subtitle)
      Replaces the identical copies that existed in 6 section stylesheets.
   -------------------------------------------------------------------------- */
.ht-section-head {
	text-align: center;
	margin-bottom: var(--wp--preset--spacing--xl);
}

.ht-section-head > * {
	margin-block: 0;
}

.ht-eyebrow {
	display: inline-block;
	padding: 4px 12px;
	margin: 0 0 20px !important;
	border-radius: var(--ht-r-xs);
	background: var(--ht-eyebrow-bg, var(--ht-pink-soft));
	color: var(--ht-eyebrow-color, var(--ht-pink));
	font-size: var(--ht-fs-tiny);
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.ht-eyebrow--plain {
	padding: 0;
	background: none;
	font-size: var(--ht-fs-sm);
	font-weight: 600;
	letter-spacing: 0.08em;
	margin-bottom: 24px !important;
}

.ht-section-title {
	margin: 0 0 12px !important;
	font-size: var(--ht-fs-section) !important;
	line-height: 1.05;
	color: var(--ht-title-color, var(--ht-navy));
}

.ht-section-subtitle {
	font-size: clamp(14px, 1.3vw, 16px);
	line-height: 1.4;
	color: var(--ht-subtitle-color, var(--ht-gray));
}

/* On dark sections */
.ht-on-dark {
	--ht-eyebrow-bg: var(--ht-plum);
	--ht-title-color: var(--ht-white);
	--ht-subtitle-color: var(--ht-gray-light);
}

/* --------------------------------------------------------------------------
   3. Buttons
   -------------------------------------------------------------------------- */
.wp-element-button,
.wp-block-button__link {
	transition: background-color var(--ht-t-fast), color var(--ht-t-fast), border-color var(--ht-t-fast), transform var(--ht-t-fast);
}

.wp-block-button__link:hover {
	transform: var(--ht-lift-sm);
}

/* Section CTA buttons use the smaller 12px radius from the original sections */
.ht-btn .wp-block-button__link,
.ht-btn.wp-block-button__link {
	border-radius: var(--ht-r-md);
	padding: 14px 32px;
	font-size: 16px;
	font-weight: 600;
}

.ht-btn--ghost .wp-block-button__link {
	background: transparent;
	color: var(--ht-navy);
	border: 1px solid color-mix(in srgb, var(--ht-navy) 10%, transparent);
}

.ht-btn--ghost .wp-block-button__link:hover {
	background: transparent;
	color: var(--ht-navy);
	border-color: var(--ht-navy);
}

.ht-btn--dark .wp-block-button__link {
	background: var(--ht-navy);
	color: var(--ht-white);
	border-radius: 10px;
	padding: 12px 22px;
	font-size: var(--ht-fs-sm);
}

.ht-btn--dark .wp-block-button__link:hover {
	background: var(--ht-navy-hover);
}

/* --------------------------------------------------------------------------
   4. Header
   -------------------------------------------------------------------------- */
.ht-header {
	position: relative;
	z-index: 50;
}

/* Announcement bar */
.ht-announcement {
	background: var(--ht-black);
	color: var(--ht-white);
	font-size: var(--ht-fs-sm);
}

.ht-announcement__inner {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 16px;
	min-height: 40px;
}

.ht-announcement__text {
	margin: 0;
	text-align: center;
	font-weight: 500;
	letter-spacing: 0.01em;
}

.ht-announcement__text a {
	color: inherit;
	text-decoration: none;
}

.ht-announcement__text a:hover {
	color: var(--ht-pink-nav);
}

.ht-announcement .wp-block-social-links {
	margin: 0;
	gap: 12px;
}

.ht-announcement .wp-block-social-links .wp-social-link {
	background: none !important;
	color: var(--ht-white) !important;
}

.ht-announcement .wp-block-social-links .wp-social-link svg {
	width: 18px;
	height: 18px;
}

.ht-announcement__end,
.ht-announcement__end > * {
	margin: 0 !important;
}

.ht-announcement__end {
	justify-self: end;
}

/* Language switcher */
.ht-lang {
	position: relative;
	font-size: var(--ht-fs-sm);
}

.ht-lang summary {
	display: flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
	list-style: none;
}

.ht-lang summary::-webkit-details-marker {
	display: none;
}

.ht-lang summary::after {
	content: "";
	width: 8px;
	height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
	transition: transform var(--ht-t-fast);
}

.ht-lang[open] summary::after {
	transform: translateY(2px) rotate(-135deg);
}

.ht-lang ul {
	display: grid;
	gap: 5px;
	position: absolute;
	right: 0;
	top: calc(100% + 10px);
	z-index: 60;
	min-width: 150px;
	margin: 0;
	padding: 6px;
	list-style: none;
	background: var(--ht-white);
	border-radius: var(--ht-r-md);
	box-shadow: var(--ht-shadow-modal);
}

.ht-lang li a {
	display: block;
	padding: 8px 12px;
	border-radius: var(--ht-r-sm);
	color: var(--ht-navy);
	text-decoration: none;
}

.ht-lang li a:hover,
.ht-lang li a[aria-current="true"] {
	background: var(--ht-pink-soft);
	color: var(--ht-pink);
}

/* Plugin-rendered switcher (GTranslate and friends).
   The plugin owns the markup, so these rules only make its control match the
   announcement bar: white text on pink, no chrome of its own. GTranslate ships
   three widget styles and the setting can be changed in its options at any
   time, so all three are covered. */
.ht-lang--plugin {
	display: flex;
	align-items: center;
	line-height: 1;
}

.ht-lang--plugin .gtranslate_wrapper {
	display: flex;
	align-items: center;
}

/* 1. "Dropdown" style – a native <select>. */
.ht-lang--plugin select,
.ht-lang--plugin select.gt_selector {
	max-width: 160px;
	padding: 2px 22px 2px 6px;
	border: 0;
	border-radius: var(--ht-r-sm);
	background: transparent;
	color: currentColor;
	font-family: inherit;
	font-size: var(--ht-fs-sm);
	line-height: 1.4;
	cursor: pointer;
	appearance: none;
	/* Chevron matching .ht-lang summary::after, drawn in currentColor. */
	background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
	background-position: calc(100% - 11px) center, calc(100% - 7px) center;
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
}

.ht-lang--plugin select:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

/* The options list is painted by the OS, so it needs readable colours. */
.ht-lang--plugin select option {
	color: var(--ht-navy);
	background: var(--ht-white);
}

/* 2. "Float switcher" style. */
.ht-lang--plugin .gt_float_switcher {
	position: static;
	box-shadow: none;
	background: transparent;
	font-family: inherit;
	font-size: var(--ht-fs-sm);
}

.ht-lang--plugin .gt_float_switcher .gt-selected {
	background: transparent;
	border-radius: var(--ht-r-sm);
}

.ht-lang--plugin .gt_float_switcher .gt-selected .gt-current-lang {
	padding: 4px 8px;
	color: currentColor;
	font-size: inherit;
}

.ht-lang--plugin .gt_float_switcher .gt-selected .gt-current-lang span.gt_float_switcher-arrow {
	filter: brightness(0) invert(1);
}

/* Closed by default so the panel never hangs open if the theme stylesheet
   loads before GTranslate's own; GTranslate adds .gt-open on click. */
.ht-lang--plugin .gt_float_switcher .gt_options {
	display: none;
}

.ht-lang--plugin .gt_float_switcher.gt-open .gt_options,
.ht-lang--plugin .gt_float_switcher:hover .gt_options {
	display: block;
}

.ht-lang--plugin .gt_float_switcher .gt_options {
	position: absolute;
	right: 0;
	top: calc(100% + 10px);
	z-index: 60;
	min-width: 150px;
	padding: 6px;
	background: var(--ht-white);
	border-radius: var(--ht-r-md);
	box-shadow: var(--ht-shadow-modal);
}

.ht-lang--plugin .gt_float_switcher .gt_options a {
	padding: 8px 12px;
	border-radius: var(--ht-r-sm);
	color: var(--ht-navy);
	font-size: inherit;
}

.ht-lang--plugin .gt_float_switcher .gt_options a:hover {
	background: var(--ht-pink-soft);
	color: var(--ht-pink);
}

/* 3. "Flags" / inline links style. */
.ht-lang--plugin [class*="gt_container-"],
.ht-lang--plugin .gtranslate_wrapper > div {
	display: flex;
	align-items: center;
	gap: 8px;
}

.ht-lang--plugin a.glink {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	color: currentColor;
	font-size: var(--ht-fs-sm);
	text-decoration: none;
	opacity: 0.8;
	transition: opacity var(--ht-t-fast);
}

.ht-lang--plugin a.glink:hover {
	opacity: 1;
	text-decoration: underline;
}

.ht-lang--plugin a.glink img {
	display: block;
	width: 18px;
	height: auto;
}

/* GTranslate's own floating widget would otherwise sit in the page corner on
   top of the one in the bar; and Google's translate toolbar pushes <body>
   down by ~40px, which breaks the sticky header. */
body > .gtranslate_wrapper,
body > .gt_float_switcher {
	display: none !important;
}

body {
	top: 0 !important;
}

.skiptranslate > iframe,
#goog-gt-tt,
.goog-te-balloon-frame {
	display: none !important;
	visibility: hidden !important;
	height: 0 !important;
}

/* Main header row */
.ht-header__top {
	background: var(--ht-pink);
	color: var(--ht-white);
}

/* Sticky main header row (see assets/js/header.js) */
.ht-header__top {
	--ht-sticky-offset: 0px;
}

.admin-bar .ht-header__top {
	--ht-sticky-offset: 32px;
}

@media (max-width: 782px) {
	.admin-bar .ht-header__top {
		--ht-sticky-offset: 46px;
	}
}

@media (max-width: 600px) {
	.admin-bar .ht-header__top {
		--ht-sticky-offset: 0px; /* The admin bar scrolls away on small screens. */
	}
}

.ht-header__top.is-fixed {
	position: fixed;
	top: calc(var(--ht-sticky-offset) - var(--ht-sticky-h, 100px) - 12px);
	left: 0;
	right: 0;
	z-index: 90;
	/* Animating "top" (not transform) keeps the mini-cart drawer and live search positioned correctly. */
	transition: top 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s ease;
}

.ht-header__top.is-fixed.is-shown {
	top: var(--ht-sticky-offset);
	box-shadow: var(--ht-shadow-hover);
}

.ht-header__spacer {
	display: block;
	margin: 0 !important;
}

.ht-header__top-inner {
	display: flex;
	align-items: center;
	gap: 24px;
	min-height: 100px;
}

.ht-header .wp-block-site-logo img {
	height: var(--ht-logo-h);
	width: auto;
	max-height: var(--ht-logo-h);
	object-fit: contain;
}

.ht-header .wp-block-site-logo + .wp-block-site-title,
.ht-footer .wp-block-site-logo + .wp-block-site-title {
	display: none;
}

.ht-header .wp-block-site-title {
	margin: 0;
	font-family: var(--ht-font-heading);
	font-size: 24px;
}

.ht-header .wp-block-site-title a {
	color: var(--ht-white);
	text-decoration: none;
}

.ht-announcement__inner > *,
.ht-header__top-inner > *,
.ht-header__actions > *,
.ht-header__actions [data-block-name="woocommerce/mini-cart"] {
	margin-block: 0 !important;
}

.ht-header__actions {
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 1;
	justify-content: flex-end;
}

/* Search pill */
.ht-search {
	flex: 1;
	max-width: 720px;
	margin: 0 auto 0 48px !important;
}

.ht-search .wp-block-search__inside-wrapper {
	flex-direction: row-reverse;
	padding: 0 18px !important;
	border: 0 !important;
	border-radius: var(--ht-r-pill);
	background: rgba(255, 255, 255, 0.2);
	transition: background-color var(--ht-t-fast);
}

.ht-search .wp-block-search__inside-wrapper:focus-within {
	background: rgba(255, 255, 255, 0.3);
}

.ht-search .wp-block-search__input {
	min-height: 44px;
	padding: 0 8px;
	border: 0;
	background: transparent;
	color: var(--ht-white);
	font-size: var(--ht-fs-md);
}

.ht-search .wp-block-search__input::placeholder {
	color: rgba(255, 255, 255, 0.8);
}

.ht-search .wp-block-search__input,
.ht-search .wp-block-search__input:focus {
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	outline: 0;
}

.ht-search .wp-block-search__button {
	margin: 0;
	padding: 0;
	background: transparent !important;
	color: var(--ht-white) !important;
	border: 0;
}

.ht-search .wp-block-search__button svg {
	width: 22px;
	height: 22px;
	fill: currentColor;
}

/* Live search dropdown */
form.ht-search,
.ht-search {
	position: relative;
}

.ht-live-search {
	position: absolute;
	top: calc(100% + 10px);
	left: 0;
	right: 0;
	z-index: 80;
	display: flex;
	flex-direction: column;
	max-height: min(70vh, 600px);
	overflow: hidden;
	border-radius: var(--ht-r-lg);
	background: var(--ht-white);
	color: var(--ht-text);
	box-shadow: var(--ht-shadow-modal);
	text-align: left;
	animation: ht-fade-in 0.15s ease both;
}

.ht-live-search[hidden] {
	display: none;
}

.ht-live-search__body {
	flex: 1;
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: 16px;
}

.ht-live-search__heading {
	margin: 4px 0 10px;
	font-size: var(--ht-fs-tiny);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--ht-gray-light);
}

.ht-live-search ul {
	margin: 0 0 16px;
	padding: 0;
	list-style: none;
}

.ht-live-search__cats {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.ht-live-search__cats a,
.ht-search-head__cats a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	border-radius: var(--ht-r-pill);
	background: var(--ht-pink-soft);
	color: var(--ht-navy);
	font-size: var(--ht-fs-sm);
	font-weight: 500;
	text-decoration: none;
	transition: background-color var(--ht-t-fast), color var(--ht-t-fast);
}

.ht-live-search__count,
.ht-search-head__cats a span {
	color: var(--ht-gray);
	font-size: var(--ht-fs-tiny);
}

.ht-live-search__cats a:hover,
.ht-live-search__cats a:focus-visible,
.ht-search-head__cats a:hover {
	background: var(--ht-pink);
	color: var(--ht-white);
}

.ht-live-search__cats a:hover .ht-live-search__count,
.ht-search-head__cats a:hover span {
	color: inherit;
}

.ht-live-search__products a {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr) auto;
	align-items: center;
	gap: 14px;
	padding: 8px;
	border-radius: var(--ht-r-md);
	color: var(--ht-navy);
	text-decoration: none;
	transition: background-color var(--ht-t-fast);
}

.ht-live-search__products a:hover,
.ht-live-search__products a:focus-visible {
	background: var(--ht-pink-wash);
	outline: 0;
}

.ht-live-search__products img {
	width: 56px;
	height: 56px;
	border-radius: var(--ht-r-sm);
	background: var(--ht-white);
	object-fit: contain;
}

.ht-live-search__name {
	font-size: var(--ht-fs-sm);
	font-weight: 600;
	line-height: 1.3;
}

.ht-live-search mark {
	background: var(--ht-pink-soft);
	color: inherit;
	border-radius: 3px;
}

.ht-live-search__price {
	font-size: var(--ht-fs-sm);
	font-weight: 700;
	color: var(--ht-pink);
	white-space: nowrap;
	text-align: right;
}

.ht-live-search__price del {
	display: block;
	font-size: var(--ht-fs-tiny);
	font-weight: 400;
	color: var(--ht-gray-light);
}

.ht-live-search__price ins {
	text-decoration: none;
}

.ht-live-search__price em {
	font-style: normal;
	font-weight: 500;
	color: var(--ht-gray);
}

.ht-live-search__empty {
	margin: 8px 0;
	color: var(--ht-gray);
	font-size: var(--ht-fs-sm);
}

.ht-live-search__footer {
	padding: 12px 16px 16px;
	border-top: 1px solid var(--ht-line);
	background: var(--ht-white);
}

.ht-live-search__all {
	display: flex;
	justify-content: center;
	padding: 13px 16px;
	border-radius: var(--ht-r-md);
	background: var(--ht-pink);
	color: var(--ht-white);
	font-size: var(--ht-fs-sm);
	font-weight: 700;
	text-decoration: none;
	transition: background-color var(--ht-t-fast);
}

.ht-live-search__all:hover,
.ht-live-search__all:focus-visible {
	background: var(--ht-pink-dark);
	color: var(--ht-white);
}

/* Search results page heading */
.ht-search-head__term {
	margin: 0 0 16px;
	color: var(--ht-gray);
}

.ht-search-head__cats {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Account + cart pills */
.ht-account a,
.ht-cart .wc-block-mini-cart__button {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 20px;
	border-radius: var(--ht-r-pill);
	font-size: var(--ht-fs-md);
	font-weight: 500;
	text-decoration: none;
	transition: background-color var(--ht-t-fast), color var(--ht-t-fast), border-color var(--ht-t-fast);
}

.ht-account a {
	border: 1px solid var(--ht-white);
	color: var(--ht-white);
}

.ht-account a:hover {
	background: var(--ht-white);
	color: var(--ht-pink);
}

.ht-account svg {
	width: 20px;
	height: 20px;
}

.ht-cart .wc-block-mini-cart__button {
	background: var(--ht-white);
	color: var(--ht-navy);
	border: 0;
	cursor: pointer;
}

.ht-cart .wc-block-mini-cart__button:hover {
	background: var(--ht-pink-soft);
}

.ht-cart .wc-block-mini-cart__amount {
	display: inline !important;
	color: var(--ht-navy);
}

.ht-cart .wc-block-mini-cart__badge {
	font-size: 0.7em; /* WooCommerce sizes the badge in em, so this shrinks the whole circle */
	font-weight: 700;
	line-height: 1;
	/* !important: WooCommerce writes the badge colours as an inline style */
	background-color: rgba(255, 255, 255, 0.7) !important;
	color: var(--ht-navy) !important;
	border: 1px solid rgba(0, 0, 0, 0.1);
}

.ht-cart .wc-block-mini-cart__icon {
	color: var(--ht-navy);
}

/* Navigation bar (classic menu per language via [ht_menu]) */
.ht-header__nav {
	background: var(--ht-pink-nav);
}

.ht-nav .ht-menu,
.ht-footer__menu .ht-menu {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ht-nav .ht-menu {
	display: flex;
	flex-wrap: wrap;
	gap: 0 40px;
}

.ht-nav .ht-menu > li {
	position: relative;
}

.ht-nav .ht-menu a {
	display: flex;
	align-items: center;
	gap: 8px;
	color: var(--ht-white);
	font-size: var(--ht-fs-lg);
	font-weight: 500;
	text-decoration: none;
	transition: color var(--ht-t-fast), background-color var(--ht-t-fast);
}

.ht-nav .ht-menu > li > a {
	min-height: 70px;
}

.ht-nav .ht-menu a:hover,
.ht-nav .ht-menu .current-menu-item > a,
.ht-nav .ht-menu .current-menu-ancestor > a {
	color: var(--ht-navy);
}

.ht-nav .menu-item-has-children > a::after {
	content: "";
	width: 7px;
	height: 7px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
}

.ht-nav .sub-menu {
	position: absolute;
	left: -14px;
	top: 100%;
	z-index: 40;
	min-width: 240px;
	margin: 0;
	padding: 10px;
	list-style: none;
	border-radius: 0 0 var(--ht-r-lg) var(--ht-r-lg);
	background: var(--ht-pink-nav);
	box-shadow: var(--ht-shadow-hover);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity var(--ht-t-fast), transform var(--ht-t-fast), visibility var(--ht-t-fast);
}

.ht-nav .sub-menu .sub-menu {
	position: static;
	min-width: 0;
	padding: 0 0 0 12px;
	box-shadow: none;
	opacity: 1;
	visibility: visible;
	transform: none;
}

.ht-nav .ht-menu > li:hover > .sub-menu,
.ht-nav .ht-menu > li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: none;
}

.ht-nav .sub-menu a {
	padding: 10px 14px;
	border-radius: var(--ht-r-sm);
	font-size: var(--ht-fs-md);
}

.ht-nav .sub-menu a:hover {
	background: rgba(255, 255, 255, 0.35);
}

.ht-nav .sub-menu .menu-item-has-children > a::after {
	display: none;
}

.ht-nav__toggle {
	display: none;
	align-items: center;
	gap: 10px;
	min-height: 52px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--ht-white);
	font: inherit;
	font-size: var(--ht-fs-lg);
	font-weight: 700;
	cursor: pointer;
}

.ht-nav__bars,
.ht-nav__bars::before,
.ht-nav__bars::after {
	display: block;
	width: 22px;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
	transition: transform var(--ht-t-fast), opacity var(--ht-t-fast);
}

.ht-nav__bars {
	position: relative;
}

.ht-nav__bars::before,
.ht-nav__bars::after {
	content: "";
	position: absolute;
	left: 0;
}

.ht-nav__bars::before { top: -7px; }
.ht-nav__bars::after { top: 7px; }

.ht-nav.is-open .ht-nav__bars { background: transparent; }
.ht-nav.is-open .ht-nav__bars::before { transform: translateY(7px) rotate(45deg); }
.ht-nav.is-open .ht-nav__bars::after { transform: translateY(-7px) rotate(-45deg); }

/* --------------------------------------------------------------------------
   5. Footer
   -------------------------------------------------------------------------- */
.ht-footer {
	margin-top: 30px;
}

/* Newsletter banner */
.ht-newsletter {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 306px;
	overflow: hidden;
	isolation: isolate;
	background: var(--ht-pink);
	color: var(--ht-white);
}

.ht-newsletter__image {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 28%;
	max-width: 420px;
	line-height: 0;
	pointer-events: none;
	z-index: 0;
}

.ht-newsletter__image--left {
	left: 0;
}

.ht-newsletter__image--right {
	right: 0;
}

.ht-newsletter__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: left bottom;
}

.ht-newsletter__image--right img {
	object-position: right bottom;
}

@media (max-width: 990px) {
	.ht-newsletter__image {
		width: 22%;
	}
}

@media (max-width: 767px) {
	.ht-newsletter__image {
		display: none;
	}
}

.ht-newsletter__inner {
	position: relative;
	z-index: 1;
	max-width: 640px;
	margin: 0 auto;
	padding: 56px 20px;
	text-align: center;
}

.ht-newsletter__title {
	margin: 0 0 12px;
	color: var(--ht-white);
	font-size: var(--ht-fs-section);
}

.ht-newsletter__subtitle {
	margin: 0 0 24px;
	font-size: clamp(13px, 1.1vw, 15px);
	line-height: 1.5;
	opacity: 0.95;
}

.ht-newsletter form,
.ht-newsletter__form {
	display: flex;
	gap: 12px;
	width: 100%;
}

.ht-newsletter input[type="email"],
.ht-newsletter input[type="text"] {
	flex: 1;
	min-width: 0;
	padding: 16px 20px;
	border: 0;
	border-radius: var(--ht-r-md);
	background: var(--ht-white);
	color: var(--ht-navy);
	font: inherit;
	font-size: 15px;
}

.ht-newsletter input::placeholder {
	color: var(--ht-gray-light);
}

.ht-newsletter button,
.ht-newsletter input[type="submit"] {
	flex-shrink: 0;
	padding: 16px 28px;
	border: 0;
	border-radius: var(--ht-r-md);
	background: var(--ht-navy);
	color: var(--ht-white);
	font: inherit;
	font-size: var(--ht-fs-sm);
	font-weight: 600;
	cursor: pointer;
	transition: background-color var(--ht-t-fast), transform var(--ht-t-fast);
}

.ht-newsletter button:hover,
.ht-newsletter input[type="submit"]:hover {
	background: var(--ht-navy-hover);
	transform: var(--ht-lift-sm);
}

.ht-newsletter__hp {
	position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	opacity: 0;
}

.ht-newsletter__terms {
	margin: 12px 0 0;
	font-size: var(--ht-fs-xs);
	opacity: 0.85;
}

.ht-newsletter__terms a {
	color: inherit;
	text-decoration: underline;
}

.ht-newsletter__result:empty {
	display: none;
}

.ht-newsletter__result {
	margin: 12px 0 0;
	font-size: var(--ht-fs-sm);
	font-weight: 600;
}

.ht-newsletter__result.is-error {
	color: #ffd9e2;
}

.ht-newsletter__notice.is-success {
	font-weight: 700;
}

.ht-newsletter__notice {
	margin: 12px 0 0;
	font-size: var(--ht-fs-xs);
	opacity: 0.85;
}

/* Newsletter form from a form plugin (WPForms, Fluent Forms, Contact Form 7):
   one row – e-mail field plus button – like the original banner. */
.ht-newsletter .ht-newsletter__form,
.ht-newsletter .wpforms-container,
.ht-newsletter .wpforms-container-full {
	width: 100%;
	max-width: 520px;
	margin: 0 auto !important;
	padding: 0;
}

.ht-newsletter form {
	width: 100%;
}

.ht-newsletter form,
.ht-newsletter .wpforms-field-container,
.ht-newsletter .frm_form_fields > .frm_fields_container,
.ht-newsletter .ff-el-group {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin: 0;
}

.ht-newsletter .wpforms-field-container {
	flex: 1 1 200px;
}

.ht-newsletter .wpforms-field {
	flex: 1 1 180px;
	min-width: 0;
	margin: 0 !important;
	padding: 0 !important;
}

/* The design has no labels – the placeholder carries the meaning. */
.ht-newsletter .wpforms-field-label,
.ht-newsletter .wpforms-field-sublabel,
.ht-newsletter .wpforms-field-description,
.ht-newsletter .wpforms-required-label,
.ht-newsletter .wpforms-error-noscript,
.ht-newsletter .ff-el-input--label {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

.ht-newsletter input[type="email"],
.ht-newsletter input[type="text"],
.ht-newsletter .wpforms-field-large,
.ht-newsletter .wpforms-field-medium {
	width: 100% !important;
	max-width: none !important;
	box-sizing: border-box;
	min-height: 54px;
	padding: 16px 20px !important;
	border: 0 !important;
	border-radius: var(--ht-r-md) !important;
	background: var(--ht-white) !important;
	color: var(--ht-navy) !important;
	font-family: inherit;
	font-size: 15px !important;
	box-shadow: none !important;
}

.ht-newsletter input::placeholder {
	color: var(--ht-gray-light);
	opacity: 1;
}

.ht-newsletter input:focus {
	outline: 2px solid var(--ht-navy);
	outline-offset: 2px;
}

.ht-newsletter .wpforms-submit-container,
.ht-newsletter .frm_submit,
.ht-newsletter .ff-el-group.ff-text-left {
	flex: 0 0 auto;
	margin: 0 !important;
	padding: 0 !important;
}

.ht-newsletter .wpforms-submit,
.ht-newsletter button[type="submit"],
.ht-newsletter input[type="submit"] {
	min-height: 54px;
	margin: 0 !important;
	padding: 0 28px !important;
	border: 0 !important;
	border-radius: var(--ht-r-md) !important;
	background: var(--ht-navy) !important;
	color: var(--ht-white) !important;
	font-family: inherit;
	font-size: var(--ht-fs-sm) !important;
	font-weight: 700 !important;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color var(--ht-t-fast), transform var(--ht-t-fast);
}

.ht-newsletter .wpforms-submit:hover,
.ht-newsletter button[type="submit"]:hover {
	background: var(--ht-navy-hover) !important;
	transform: var(--ht-lift-sm);
}

.ht-newsletter .wpforms-submit-spinner {
	margin-left: 8px;
}

/* Messages */
.ht-newsletter .wpforms-error,
.ht-newsletter .wpforms-error-container,
.ht-newsletter .ff-el-is-error .text-danger {
	flex: 1 1 100%;
	margin: 4px 0 0 !important;
	color: #ffd9e2 !important;
	font-size: var(--ht-fs-xs);
	text-align: center;
}

.ht-newsletter .wpforms-confirmation-container-full,
.ht-newsletter .wpforms-confirmation-container {
	max-width: 520px;
	margin: 0 auto !important;
	padding: 16px 20px;
	border: 0 !important;
	border-radius: var(--ht-r-md);
	background: rgba(255, 255, 255, 0.2) !important;
	color: var(--ht-white) !important;
	font-weight: 600;
}

.ht-newsletter .wpforms-confirmation-container p {
	margin: 0;
	color: inherit;
}

@media (max-width: 600px) {
	.ht-newsletter .wpforms-field-container {
		flex-direction: column;
		align-items: stretch;
	}

	.ht-newsletter .wpforms-submit-container {
		width: 100%;
	}

	.ht-newsletter .wpforms-submit,
	.ht-newsletter button[type="submit"] {
		width: 100%;
	}
}

/* Footer columns */
.ht-footer__main {
	background: var(--ht-navy);
	color: var(--ht-white);
}

.ht-footer__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 48px;
	padding-block: 64px;
}

.ht-footer__col > * {
	margin-block: 0 12px;
}

.ht-footer__title {
	margin: 0 0 20px !important;
	color: var(--ht-white);
	font-size: 18px;
}

.ht-footer a {
	color: var(--ht-white);
	text-decoration: none;
}

.ht-footer a:hover {
	color: var(--ht-pink);
}

.ht-footer .wp-block-site-logo img {
	max-height: 70px;
	width: auto;
	border-radius: var(--ht-r-md);
}

.ht-footer__menu .ht-menu {
	display: grid;
	gap: 10px;
}

.ht-footer__menu .sub-menu {
	display: none;
}

.ht-footer__menu a {
	opacity: 0.9;
	font-size: var(--ht-fs-md);
}

.ht-footer__menu a:hover {
	opacity: 1;
}

.ht-footer .wp-block-social-links .wp-social-link {
	background: rgba(255, 255, 255, 0.1) !important;
	color: var(--ht-white) !important;
}

/* Taurinas partner link: brand-orange circle with a "t" instead of the chain icon */
.ht-footer .wp-block-social-links .wp-social-link.ht-social-taurinas {
	background: var(--ht-taurinas) !important;
	color: var(--ht-taurinas-dark) !important;
}

.ht-social-taurinas svg {
	display: none;
}

.ht-social-taurinas .wp-block-social-link-anchor::before {
	content: "t";
	display: flex;
	align-items: center;
	justify-content: center;
	width: calc(1em / 1.35); /* same box as the other icons */
	height: calc(1em / 1.35);
	color: var(--ht-taurinas-dark);
	font-family: var(--ht-font-heading);
	font-size: 1.35em;
	font-weight: 800;
	line-height: 1;
}

.ht-footer .ht-social-taurinas a:hover::before {
	color: var(--ht-white);
}

.ht-footer__bottom {
	background: var(--ht-black);
	color: #cccccc;
	font-size: var(--ht-fs-sm);
}

.ht-footer__bottom p {
	margin: 0;
	padding-block: 18px;
}

/* Payment method logos */
.ht-payments {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ht-payments__icon {
	display: flex;
	line-height: 0;
}

.ht-payments__icon svg {
	display: block;
	width: 38px;
	height: 24px;
}

/* Names without a logo fall back to a small chip */
.ht-payments__text {
	display: flex;
	align-items: center;
	height: 24px;
	padding: 0 8px;
	border-radius: var(--ht-r-xs);
	background: var(--ht-white);
	color: var(--ht-navy);
	font-size: var(--ht-fs-tiny);
	font-weight: 700;
	line-height: 1;
}

/* --------------------------------------------------------------------------
   6. Homepage sections
   -------------------------------------------------------------------------- */

/* 6.1 Hero banner */
.ht-hero {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	background: var(--wp--preset--gradient--hero);
	margin-top: 0 !important;
}

.ht-hero__container {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
	align-items: center;
	gap: 40px;
	min-height: clamp(460px, 44vw, 640px);
}

.ht-hero__content {
	max-width: 640px;
	padding-block: 40px;
}

.ht-hero__title {
	margin: 0 0 24px !important;
	font-size: var(--ht-fs-hero) !important;
	line-height: 1.1;
	color: var(--ht-navy);
}

.ht-hero__title mark,
.ht-accent {
	background: none;
	color: var(--ht-pink);
}

.ht-hero__text {
	max-width: 440px;
	margin: 0 0 32px !important;
	font-size: var(--ht-fs-lg);
	line-height: 1.5;
	color: var(--ht-gray);
}

.ht-hero .wp-block-buttons {
	gap: 12px;
	margin-bottom: 36px;
}

.ht-hero__media {
	align-self: stretch;
	margin: 0 !important;
}

.ht-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: right center;
}

/* Trust items with CSS-mask icons (icon colour follows the text colour) */
.ht-trust {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ht-trust li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: var(--ht-fs-sm);
	color: var(--ht-gray);
}

.ht-trust li::before,
.ht-trust-list li::before {
	content: "";
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	background: var(--ht-pink);
	-webkit-mask: var(--ht-icon) center / contain no-repeat;
	mask: var(--ht-icon) center / contain no-repeat;
}

.ht-icon--lock { --ht-icon: url("../images/hero-banner-lock.svg"); }
.ht-icon--truck { --ht-icon: url("../images/hero-banner-truck.svg"); }
.ht-icon--star { --ht-icon: url("../images/hero-banner-star.svg"); }
.ht-icon--return { --ht-icon: url("../images/product-trust-return.svg"); }

/* 6.2 Stats bar */
.ht-stats {
	background: var(--ht-white);
	margin-top: 0 !important;
}

.ht-stats__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
	margin: 0 auto;
	padding-block: 28px;
	list-style: none;
	text-align: center;
}

.ht-stats__item {
	position: relative;
	display: flex;
	flex: 1 1 0;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-width: 0;
	padding: 0 16px;
}

.ht-stats__item + .ht-stats__item::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 1px;
	height: 32px;
	transform: translateY(-50%);
	background: var(--ht-line);
}

.ht-stats__value {
	font-size: var(--ht-fs-xl);
	font-weight: 800;
	line-height: 1;
	color: var(--ht-navy);
	white-space: nowrap;
}

.ht-stats__label {
	font-size: var(--ht-fs-sm);
	line-height: 1;
	color: var(--ht-gray);
}

/* 6.3 Categories grid */
.ht-cats__list {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 20px;
}

.ht-cat {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	aspect-ratio: 1 / 1.05;
	padding: 24px;
	overflow: hidden;
	isolation: isolate;
	border-radius: var(--ht-r-xxl);
	background: var(--ht-cat-bg, var(--wp--preset--gradient--cat-pink));
	color: var(--ht-white);
	text-decoration: none;
	transition: transform var(--ht-t-base), box-shadow var(--ht-t-base);
}

.ht-cat::after {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 40%;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(0deg, color-mix(in srgb, var(--ht-navy) 70%, transparent), transparent);
}

.ht-cat:hover {
	transform: var(--ht-lift-lg);
	box-shadow: var(--ht-shadow-hover);
	color: var(--ht-white);
}

.ht-cat__icon {
	position: relative;
	z-index: 2;
	display: flex;
	flex: 1;
	align-items: center;
	justify-content: center;
	font-size: 64px;
	line-height: 1;
}

.ht-cat__text {
	position: relative;
	z-index: 2;
}

.ht-cat__title {
	display: block;
	margin-bottom: 4px;
	font-size: clamp(13px, 1.2vw, 15px);
	font-weight: 700;
	line-height: 1;
}

.ht-cat__count {
	display: block;
	font-size: clamp(10px, 0.9vw, 11px);
	line-height: 1;
	opacity: 0.85;
}

.ht-cat--pink { --ht-cat-bg: var(--wp--preset--gradient--cat-pink); }
.ht-cat--yellow { --ht-cat-bg: var(--wp--preset--gradient--cat-yellow); }
.ht-cat--cyan { --ht-cat-bg: var(--wp--preset--gradient--cat-cyan); }
.ht-cat--purple { --ht-cat-bg: var(--wp--preset--gradient--cat-purple); }
.ht-cat--peach { --ht-cat-bg: var(--wp--preset--gradient--cat-peach); }

/* 6.4 Product cards (popular products, archives, related) */
.ht-products .wc-block-product-template,
.ht-products .wp-block-post-template {
	display: grid !important;
	grid-template-columns: repeat(var(--ht-cols, 4), minmax(0, 1fr)) !important;
	gap: var(--ht-grid-gap, 20px) !important;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ht-products--bundles {
	--ht-cols: 3;
	--ht-grid-gap: 24px; /* same spacing as the original section */
}

.ht-products .wc-block-product,
.ht-products .wp-block-post {
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
}

.ht-card {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	gap: 0 !important;
	padding: 16px;
	border-radius: var(--ht-r-lg);
	background: var(--ht-white);
	box-shadow: var(--ht-shadow-card);
	transition: transform var(--ht-t-base), box-shadow var(--ht-t-base);
}

.ht-card > *,
.ht-card__body > * {
	margin-block: 0 !important;
}

.ht-card:hover {
	transform: var(--ht-lift-md);
	box-shadow: var(--ht-shadow-hover);
}

.ht-card .wc-block-components-product-image {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1;
	margin: 0 0 16px !important;
	overflow: hidden;
}

.ht-card .wc-block-components-product-image > a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.ht-card .wc-block-components-product-image img {
	display: block;
	width: 75% !important;
	height: 75% !important;
	margin: auto;
	object-fit: contain !important;
	object-position: center !important;
}

.ht-card__brand {
	margin: 0 0 8px !important;
	font-size: var(--ht-fs-tiny);
	font-weight: 500;
	letter-spacing: 0.04em;
	line-height: 1;
	text-transform: uppercase;
	color: var(--ht-gray-light);
}

.ht-card__brand a {
	color: inherit;
	text-decoration: none;
	pointer-events: none;
}

.ht-card__title {
	margin: 0 0 16px !important;
	font-family: var(--ht-font-body) !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	text-align: left !important;
	color: var(--ht-navy);
}

.ht-card__title a {
	color: inherit;
	text-decoration: none;
}

.ht-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto !important;
}

.ht-card .wc-block-components-product-price {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px;
	margin: 0 !important;
	font-size: 18px !important;
	font-weight: 700;
	line-height: 1;
	text-align: left !important;
	color: var(--ht-pink);
}

.ht-card .wc-block-components-product-price del {
	order: 2;
	font-size: var(--ht-fs-xs);
	font-weight: 400;
	color: var(--ht-gray-light);
}

.ht-card .wc-block-components-product-price ins {
	text-decoration: none;
}

/* Square "+" add-to-cart button */
.ht-card__add {
	flex: 0 0 36px;
	width: 36px !important;
	min-width: 36px;
	margin: 0 !important;
}

.ht-card__add .wp-block-button__link,
.ht-card__add .add_to_cart_button {
	position: relative;
	width: 36px !important;
	min-width: 36px !important;
	height: 36px;
	min-height: 0 !important;
	padding: 0 !important;
	border-radius: var(--ht-r-sm) !important;
	background: var(--ht-navy) !important;
	color: transparent !important;
	font-size: 0 !important;
	overflow: hidden;
}

.ht-card__add .wp-block-button__link::before,
.ht-card__add .add_to_cart_button::before {
	content: "+";
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ht-white);
	font-size: 20px;
	font-weight: 500;
}

.ht-card__add .wp-block-button__link:hover {
	background: var(--ht-navy-hover) !important;
}

.ht-card__add .wp-block-button__link.ht-is-loading::before,
.ht-card__add .add_to_cart_button.ht-is-loading::before {
	content: "";
	width: 14px;
	height: 14px;
	border: 2px solid rgba(255, 255, 255, 0.35);
	border-top-color: var(--ht-white);
	border-radius: 50%;
	animation: ht-spin 0.7s linear infinite;
}

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

.ht-card__add .added_to_cart {
	display: none !important;
}

.ht-card__add .wp-block-button__link.ht-is-added,
.ht-card__add .add_to_cart_button.ht-is-added {
	background: #2e7d32 !important;
}

.ht-card__add .wp-block-button__link.ht-is-added::before,
.ht-card__add .add_to_cart_button.ht-is-added::before {
	content: "✓";
	font-size: 17px;
}

/* Sale badge */
.wc-block-components-product-sale-badge {
	top: 16px !important;
	left: 16px !important;
	right: auto !important;
	padding: 4px 10px !important;
	border: 0 !important;
	border-radius: 6px !important;
	background: var(--ht-pink) !important;
	color: var(--ht-white) !important;
	font-size: 12px !important;
	font-weight: 700;
	line-height: 1 !important;
	text-transform: none !important;
}

.ht-card .wc-block-components-product-sale-badge {
	position: absolute !important;
	z-index: 2;
}

/* 6.4b Product sliders (popular products, discount bundles) */
.ht-slider .wc-block-product-template {
	display: flex !important;
	gap: var(--ht-grid-gap, 20px) !important;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	/* Room for the card hover lift and shadow inside the scroll area */
	margin: -8px -8px 0 !important;
	padding: 8px 8px 20px !important;
	scroll-padding-inline: 8px;
}

.ht-slider .wc-block-product-template::-webkit-scrollbar {
	display: none;
}

.ht-slider .wc-block-product {
	flex: 0 0 calc((100% - (var(--ht-cols, 4) - 1) * var(--ht-grid-gap, 20px)) / var(--ht-cols, 4));
	scroll-snap-align: start;
}

.ht-slider.is-dragging .wc-block-product-template {
	scroll-snap-type: none;
	cursor: grabbing;
	user-select: none;
}

.ht-slider.is-dragging a {
	pointer-events: none;
}

.ht-slider__nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin-top: 10px;
	margin-bottom: -12px;
}

.ht-slider.is-static .ht-slider__nav {
	display: none;
}

.ht-slider__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	border-radius: 100%;
	background: transparent;
	color: var(--ht-text);
	opacity: 0.8;
	cursor: pointer;
	transition: opacity 100ms linear, background-color 100ms linear, color 100ms linear;
}

.ht-slider__btn--next svg {
	transform: scaleX(-1);
}

.ht-slider__btn:hover:not(:disabled) {
	opacity: 1;
	background: color-mix(in srgb, currentColor 10%, transparent);
}

.ht-slider__btn:disabled {
	opacity: 0.3;
	cursor: auto;
	pointer-events: none;
}

.ht-slider__dots {
	display: flex;
	align-items: center;
	gap: 10px;
}

.ht-slider__dot {
	width: 9px;
	height: 9px;
	padding: 0;
	border: 0;
	border-radius: 7px;
	background: var(--ht-text);
	opacity: 0.25;
	cursor: pointer;
	transition: width 100ms linear, opacity 100ms linear;
}

.ht-slider__dot:hover {
	opacity: 0.5;
}

.ht-slider__dot.is-active {
	width: 30px;
	opacity: 1;
}

/* Dark bundles section: white arrows and dots, like the original */
.ht-on-dark .ht-slider__btn {
	color: var(--ht-white);
}

.ht-on-dark .ht-slider__dot {
	background: var(--ht-white);
	opacity: 0.25;
}

.ht-on-dark .ht-slider__dot.is-active {
	opacity: 1;
}

@media (max-width: 474px) {
	.ht-slider__dots {
		display: none;
	}
}

/* 6.5 Discount bundles (dark section) */
.ht-bundles {
	background: var(--ht-navy);
	margin-top: 0 !important;
}

.ht-bundles .ht-card {
	padding: 0;
	overflow: hidden;
	border-radius: var(--ht-r-xl);
	background: var(--ht-navy-card);
	box-shadow: none;
}

.ht-bundles .ht-card:hover {
	transform: var(--ht-lift-lg);
	box-shadow: var(--ht-shadow-lift);
}

.ht-bundles .wc-block-components-product-image {
	aspect-ratio: auto;
	margin: 0 !important;
	background: var(--ht-white);
}

.ht-bundles .wc-block-components-product-image img {
	width: 100% !important;
	height: auto !important;
}

.ht-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 0 !important;
	padding: 24px;
}

.ht-bundles .ht-card__price-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0 0 20px !important;
}

.ht-bundles .ht-card__title {
	font-size: clamp(16px, 1.4vw, 18px) !important;
	margin-bottom: 12px !important;
	color: var(--ht-white);
}

.ht-card__excerpt {
	margin: 0 0 20px !important;
	font-size: var(--ht-fs-xs);
	line-height: 1.5;
	color: var(--ht-gray-light);
}

.ht-card__excerpt .wp-block-post-excerpt__more-text {
	display: none;
}

.ht-bundles .wc-block-components-product-price {
	margin-bottom: 20px !important;
	color: var(--ht-gold);
	font-size: clamp(20px, 1.8vw, 26px) !important;
	font-weight: 800;
}

.ht-bundles .wc-block-components-product-price del {
	font-size: var(--ht-fs-sm);
	color: var(--ht-gray);
}

.ht-bundles .wc-block-components-product-sale-badge {
	position: static !important;
	order: 3;
	background: var(--ht-plum) !important;
	color: var(--ht-pink) !important;
}

.ht-card__cta {
	display: flex !important;
	align-items: stretch !important;
	width: 100%;
	margin: auto 0 0 !important;
}

.ht-card__cta .wp-block-button__link,
.ht-card__cta .add_to_cart_button {
	display: flex;
	justify-content: center;
	width: 100% !important;
	flex: 1 1 auto;
	padding: 14px 16px;
	border-radius: var(--ht-r-md) !important;
	background: var(--ht-pink) !important;
	color: var(--ht-white) !important;
	font-size: var(--ht-fs-sm);
	font-weight: 600;
}

.ht-card__cta .wp-block-button__link:hover {
	background: var(--ht-pink-dark) !important;
}

.ht-card__cta .added_to_cart {
	display: block;
	margin-top: 8px;
	color: var(--ht-gray-light);
	font-size: var(--ht-fs-xs);
	text-align: center;
}

/* 6.6 Promo banner */
.ht-promo {
	background: var(--wp--preset--gradient--promo);
	margin-top: 0 !important;
}

.ht-promo__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
	padding: 18px 24px;
}

.ht-promo__inner > * {
	margin: 0 !important;
}

.ht-promo__icon {
	flex-shrink: 0;
	width: 56px;
	height: 56px;
	margin: 0 !important;
}

.ht-promo__icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.ht-promo__text > * {
	margin: 0;
}

.ht-promo__title {
	font-size: clamp(15px, 1.4vw, 18px);
	font-weight: 700;
	line-height: 1.2;
	color: var(--ht-navy);
}

.ht-promo__subtitle {
	margin-top: 4px !important;
	font-size: clamp(12px, 1.1vw, 14px);
	line-height: 1.3;
	color: color-mix(in srgb, var(--ht-navy) 70%, var(--ht-gray));
}

/* 6.7 Testimonials (best product reviews) */
.ht-testimonials {
	background: var(--ht-pink-wash);
	margin-top: 0 !important;
}

/* Average rating under the section heading */
.ht-testimonials__rating {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: -24px 0 40px;
}

.ht-testimonials__rating .ht-star {
	width: 24px;
	height: 24px;
	background: var(--ht-line);
}

.ht-testimonials__rating .ht-star.is-on {
	background: var(--ht-pink);
}

.ht-testimonials__rating-text {
	color: var(--ht-navy);
	font-size: var(--ht-fs-md);
}

/* One review at a time, arrows at the sides */
.ht-testimonials__carousel {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
	max-width: 1100px;
	margin: 0 auto;
}

.ht-testimonials__list {
	position: relative;
	flex: 1;
	min-height: 200px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ht-testimonial {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.5s ease-in-out;
}

.ht-testimonial.is-active {
	position: relative;
	opacity: 1;
	pointer-events: auto;
}

.ht-testimonial__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24px;
	padding: 40px;
	border-radius: var(--ht-r-sm);
	background: var(--ht-white);
	text-align: center;
}

.ht-testimonial__quote-mark {
	width: 33px;
	height: 24px;
	background: var(--ht-pink);
	-webkit-mask: var(--ht-quote-icon) center / contain no-repeat;
	mask: var(--ht-quote-icon) center / contain no-repeat;
}

:root {
	--ht-quote-icon: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 66 48'><path d='M65.6 2.2c-1.2 4.5-2.7 9.5-4.5 14.8-1.8 5.4-3.9 10.7-6.1 16.1-2.1 5.2-4.2 10.2-6.3 14.9H35.9c1.3-5 2.5-10.3 3.7-15.9 1.3-5.7 2.5-11.3 3.5-16.8C44.3 9.7 45.2 4.6 45.8 0h18.4l1.4 2.2zM29.4 2.2c-1.2 4.5-2.7 9.5-4.5 14.8-1.8 5.4-3.9 10.7-6.1 16.1-2.1 5.2-4.2 10.2-6.3 14.9H0c.9-3.7 1.8-7.6 2.7-11.8.9-4.2 1.8-8.4 2.6-12.5.9-4.3 1.7-8.5 2.3-12.5.8-4.1 1.5-7.8 2-11.2h18.4l1.4 2.2z'/></svg>");
}

.ht-testimonial__text {
	margin: 0;
	max-width: 760px;
	color: var(--ht-navy);
	font-size: 20px;
	line-height: 1.3;
}

.ht-testimonial__rating {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	width: 100%;
}

.ht-testimonial__rating .ht-stars {
	gap: 4px;
}

.ht-testimonial__rating .ht-star {
	width: 24px;
	height: 24px;
	background: var(--ht-line);
}

.ht-testimonial__rating .ht-star.is-on {
	background: var(--ht-pink);
}

.ht-testimonial__name {
	color: var(--ht-navy);
	font-size: var(--ht-fs-md);
	font-weight: 600;
	line-height: 1.5;
}

.ht-testimonial__product {
	max-width: 510px;
	color: var(--ht-navy);
	font-size: var(--ht-fs-md);
	text-decoration: underline;
	text-underline-position: from-font;
}

.ht-testimonial__product:hover {
	color: var(--ht-pink);
}

.ht-testimonials__arrow {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--ht-navy);
	cursor: pointer;
	transition: opacity 0.2s;
}

.ht-testimonials__arrow:hover {
	opacity: 0.7;
}

.ht-testimonials__arrow--next svg {
	transform: scaleX(-1);
}

.ht-testimonials__carousel.is-single .ht-testimonials__arrow {
	visibility: hidden;
}

@media (max-width: 767px) {
	.ht-testimonials__carousel {
		gap: 0;
	}

	.ht-testimonials__arrow {
		position: absolute;
		top: 50%;
		z-index: 3;
		transform: translateY(-50%);
	}

	.ht-testimonials__arrow--prev {
		left: -8px;
	}

	.ht-testimonials__arrow--next {
		right: -8px;
		transform: translateY(-50%);
	}

	.ht-testimonial__card {
		padding: 24px;
		gap: 16px;
	}

	.ht-testimonial__text {
		font-size: 16px;
	}

	.ht-testimonials__rating {
		margin-top: -16px;
	}
}

/* --------------------------------------------------------------------------
   7. WooCommerce – single product
   -------------------------------------------------------------------------- */
.ht-shop-main {
	padding-block: 16px var(--ht-section-y);
}

.woocommerce-breadcrumb,
.wc-block-breadcrumbs {
	margin: 0 0 24px !important;
	font-size: var(--ht-fs-md);
	color: var(--ht-text);
}

.woocommerce-breadcrumb a {
	color: inherit;
	text-decoration: none;
}

.woocommerce-breadcrumb a:hover {
	color: var(--ht-pink);
}

.ht-product {
	gap: clamp(24px, 4vw, 64px) !important;
	align-items: flex-start !important;
}

/* Gallery: full column width, and it follows the text while scrolling */
.woocommerce .wp-block-woocommerce-product-image-gallery,
.ht-product__media .wp-block-woocommerce-product-image-gallery {
	max-width: none !important;
	width: 100%;
}

@media (min-width: 992px) {
	.ht-product__media {
		position: sticky;
		top: calc(var(--wp--custom--header--logo-height, 60px) + 60px);
		align-self: flex-start;
	}
}

.ht-product__summary .ht-product-text--intro {
	margin-top: 0 !important;
	max-width: none;
}

.ht-product__summary .ht-product__description {
	font-size: var(--ht-fs-md);
	line-height: 1.6;
	color: var(--ht-text);
}

.ht-product__summary .ht-product__description h2,
.ht-product__summary .ht-product__description h3 {
	font-size: var(--ht-fs-lg);
	margin-bottom: 8px;
}

.ht-product__media .woocommerce-product-gallery,
.ht-product__media .wc-block-product-gallery {
	overflow: hidden;
	border-radius: var(--ht-r-card);
	background: var(--ht-white);
}

.ht-product__media .woocommerce-product-gallery__image img {
	border-radius: var(--ht-r-card);
}

/* Hover zoom: the image glides after the cursor instead of jumping on every mouse event */
.ht-product__media .woocommerce-product-gallery__image {
	cursor: zoom-in;
}

.ht-product__media .zoomImg {
	transition:
		top 0.22s cubic-bezier(0.22, 1, 0.36, 1),
		left 0.22s cubic-bezier(0.22, 1, 0.36, 1) !important;
	will-change: top, left, opacity;
	background: var(--ht-white);
}

.ht-product__media .flex-control-thumbs {
	display: flex;
	gap: 10px;
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}

.ht-product__media .flex-control-thumbs img {
	border-radius: var(--ht-r-md);
	cursor: pointer;
	opacity: 0.6;
	transition: opacity var(--ht-t-fast);
}

.ht-product__media .flex-control-thumbs img.flex-active,
.ht-product__media .flex-control-thumbs img:hover {
	opacity: 1;
}

.ht-product__summary > * {
	margin-block: 0 16px;
}

.ht-badge {
	display: inline-block;
	padding: 4px 12px;
	border-radius: var(--ht-r-xs);
	background: var(--ht-pink-soft);
	color: var(--ht-pink);
	font-size: var(--ht-fs-tiny);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.ht-badge a {
	color: inherit;
	text-decoration: none;
}

.ht-product__summary .wp-block-post-title {
	font-size: clamp(28px, 3vw, 44px);
	font-weight: 800;
}

.ht-product__price,
.ht-product__summary .wc-block-components-product-price {
	font-size: 26px !important;
	font-weight: 700;
	color: var(--ht-pink);
}

.ht-product__summary .wc-block-components-product-price del {
	margin-right: 8px;
	font-size: 18px;
	font-weight: 400;
	color: var(--ht-gray-light);
}

/* Add to cart form (quantity + button + variations) */
.ht-product__summary form.cart {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	padding-top: 20px;
	border-top: 1px solid var(--ht-border-soft);
}

.ht-product__summary form.cart.variations_form {
	display: block;
}

.ht-product__summary .variations {
	width: 100%;
	margin-bottom: 16px;
	border: 0;
}

.ht-product__summary .variations th,
.ht-product__summary .variations td {
	display: block;
	padding: 0 0 8px;
	text-align: left;
}

.ht-product__summary .variations label {
	font-weight: 700;
	color: var(--ht-navy);
}

.ht-product__summary .reset_variations {
	font-size: var(--ht-fs-xs);
	color: var(--ht-gray);
}

.ht-product__summary .woocommerce-variation-add-to-cart {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.quantity {
	display: inline-flex;
	align-items: center;
}

.quantity .qty {
	width: 96px !important;
	min-height: 54px;
	padding: 0 12px;
	border: 1px solid var(--ht-border-form);
	border-radius: var(--ht-r-form);
	background: var(--ht-white);
	color: var(--ht-navy);
	font: inherit;
	font-size: var(--ht-fs-lg);
	text-align: center;
}

.single_add_to_cart_button,
.ht-product__summary form.cart .button {
	flex: 1;
	min-height: 54px;
	padding: 0 28px;
	border: 0;
	border-radius: var(--ht-r-form);
	background: var(--ht-pink);
	color: var(--ht-white);
	font: inherit;
	font-weight: 700;
	cursor: pointer;
	transition: background-color var(--ht-t-fast), transform var(--ht-t-fast);
}

.single_add_to_cart_button:hover {
	background: var(--ht-pink-dark);
	transform: var(--ht-lift-sm);
}

.single_add_to_cart_button.disabled {
	opacity: 0.4;
	cursor: not-allowed;
}

.ht-product__media .onsale,
.woocommerce .wp-block-woocommerce-product-image-gallery span.onsale,
.woocommerce span.onsale {
	position: absolute;
	top: 16px;
	left: 16px !important;
	right: auto !important;
	z-index: 5;
	min-width: 0;
	min-height: 0;
	margin: 0;
	padding: 6px 12px;
	border-radius: 6px;
	background: var(--ht-pink);
	color: var(--ht-white);
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
}

.ht-product__media .woocommerce-product-gallery {
	position: relative;
}

.stock {
	font-size: var(--ht-fs-sm);
	font-weight: 500;
}

.stock.out-of-stock {
	color: var(--ht-pink-dark);
}

/* Bottle deposit note under the price */
.ht-deposit-note {
	display: block;
	margin-top: 4px;
	color: var(--ht-gray);
	font-size: var(--ht-fs-xs);
	font-weight: 400;
}

.ht-card .ht-deposit-note {
	font-size: var(--ht-fs-tiny);
}

/* Bundle contents on the product page */
.ht-bundle-contents {
	margin: 0 0 20px;
	padding: 16px 20px;
	border-radius: var(--ht-r-md);
	background: var(--ht-pink-wash);
}

.ht-bundle-contents__title {
	margin: 0 0 8px;
	font-size: var(--ht-fs-sm);
	font-weight: 700;
	color: var(--ht-navy);
}

.ht-bundle-contents ul,
.ht-bundle-contents__list {
	margin: 0;
	padding-left: 18px;
	font-size: var(--ht-fs-sm);
	line-height: 1.6;
}

/* Free shipping progress bar */
.ht-freeship {
	margin: 4px 0 20px;
}

.ht-freeship__text {
	margin: 0 0 10px;
	font-size: var(--ht-fs-md);
	font-weight: 700;
	color: var(--ht-navy);
}

.ht-freeship__text strong {
	color: var(--ht-pink);
}

.ht-freeship__track {
	height: 8px;
	overflow: hidden;
	border-radius: var(--ht-r-pill);
	background: var(--ht-line);
}

.ht-freeship__fill {
	height: 100%;
	width: var(--ht-progress, 0%);
	border-radius: inherit;
	background: var(--ht-pink);
	transition: width var(--ht-t-base);
}

.ht-freeship.is-empty {
	display: none;
}

.ht-freeship.is-complete .ht-freeship__text {
	color: var(--ht-pink);
}

/* In the mini-cart drawer, under the title */
.ht-freeship-drawer {
	/* WooCommerce pulls the next element 32px up under the title (fade effect); clear it */
	margin: 40px 16px 8px;
}

.ht-freeship-drawer .ht-freeship {
	margin: 0;
	padding: 14px 16px;
	border-radius: var(--ht-r-md);
	background: var(--ht-pink-wash);
}

.ht-freeship-drawer .ht-freeship__text {
	font-size: var(--ht-fs-sm);
}

/* Above the cart page */
.ht-freeship-cart {
	max-width: var(--ht-max);
	margin: 0 auto 24px;
}

.ht-freeship-cart .ht-freeship {
	margin: 0;
	padding: 18px 22px;
	border-radius: var(--ht-r-lg);
	background: var(--ht-pink-wash);
}

/* Product names in the cart and drawer: bold and a bit larger */
.wc-block-cart .wc-block-components-product-name,
.wc-block-mini-cart__drawer .wc-block-components-product-name {
	font-size: var(--ht-fs-md) !important;
	font-weight: 700 !important;
	line-height: 1.3;
	color: var(--ht-navy) !important;
}

/* Trust list on product page */
.ht-trust-list {
	display: grid;
	gap: 12px;
	margin: 8px 0 20px;
	padding: 0;
	list-style: none;
}

.ht-trust-list li {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: var(--ht-fs-md);
}

.ht-trust-list li::before {
	width: 20px;
	height: 20px;
}

.ht-payments-label {
	margin: 0 0 8px !important;
	font-size: var(--ht-fs-sm);
	color: var(--ht-gray);
}

.ht-product__summary .ht-payments__text {
	border: 1px solid var(--ht-card-border);
}

/* Product description: intro + toggles (outside the tabs) */
.ht-product-text {
	max-width: 900px;
	margin-top: var(--ht-section-y) !important;
}

.ht-product__description {
	line-height: 1.7;
}

.ht-product__description > :first-child {
	margin-top: 0;
}

.ht-product__description h2,
.ht-product__description h3 {
	margin: 0 0 16px;
	font-size: clamp(22px, 2vw, 28px);
}

.ht-toggles {
	margin-top: 32px;
	display: grid;
	gap: 12px;
}

.ht-toggle {
	overflow: hidden;
	border: 1px solid var(--ht-card-border);
	border-radius: var(--ht-r-lg);
	background: var(--ht-white);
}

.ht-toggle__title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 22px;
	color: var(--ht-navy);
	font-family: var(--ht-font-heading);
	font-size: var(--ht-fs-lg);
	font-weight: 800;
	cursor: pointer;
	list-style: none;
}

.ht-toggle__title::-webkit-details-marker {
	display: none;
}

.ht-toggle__icon {
	flex-shrink: 0;
	position: relative;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--ht-pink-soft);
}

.ht-toggle__icon::before,
.ht-toggle__icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 12px;
	height: 2px;
	border-radius: 2px;
	background: var(--ht-pink);
	transform: translate(-50%, -50%);
	transition: transform var(--ht-t-base), opacity var(--ht-t-base);
}

.ht-toggle__icon::after {
	transform: translate(-50%, -50%) rotate(90deg);
}

.ht-toggle[open] .ht-toggle__icon::after {
	opacity: 0;
	transform: translate(-50%, -50%) rotate(0deg);
}

.ht-toggle__content {
	padding: 0 22px 20px;
	line-height: 1.7;
}

.ht-toggle__content > :first-child {
	margin-top: 0;
}

/* Reviews */
.ht-reviews {
	max-width: 1200px;
	margin: var(--ht-section-y) auto 0;
}

.ht-reviews__header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 12px 24px;
	padding-bottom: 24px;
	margin-bottom: 24px;
	border-bottom: 1px solid var(--ht-border-soft);
	text-align: center;
}

.ht-reviews__title {
	flex: 1 1 100%;
	margin: 0;
	font-size: clamp(24px, 2.4vw, 32px);
}

.ht-reviews__summary {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
}

.ht-reviews__average {
	font-weight: 700;
	color: var(--ht-navy);
}

.ht-reviews__count,
.ht-reviews__empty {
	margin: 0;
	color: var(--ht-gray);
	font-size: var(--ht-fs-sm);
}

.ht-stars,
.ht-reviews .star-rating,
.ht-reviews .stars {
	display: inline-flex;
	gap: 2px;
}

.ht-star {
	width: 18px;
	height: 18px;
	background: var(--ht-line);
	-webkit-mask: var(--ht-star-icon) center / contain no-repeat;
	mask: var(--ht-star-icon) center / contain no-repeat;
}

.ht-star.is-on {
	background: var(--ht-gold);
}

:root {
	--ht-star-icon: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/></svg>");
}

/* WooCommerce review list */
.ht-reviews .commentlist {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 16px;
}

.ht-reviews .commentlist .review,
.ht-reviews .commentlist .comment {
	/* !important: WooCommerce styles these with id selectors */
	margin: 0 !important;
	padding: 20px 22px !important;
	border: 1px solid var(--ht-card-border) !important;
	border-radius: var(--ht-r-lg);
	background: var(--ht-white) !important;
}

/* Form opens directly under the header, above the list */
.ht-reviews #reviews {
	display: flex;
	flex-direction: column;
}

.ht-reviews #review_form_wrapper {
	order: -1;
}

/* Our own heading replaces "2 reviews for …" */
.ht-reviews .woocommerce-Reviews-title {
	display: none;
}

.ht-reviews .comment-form input,
.ht-reviews .comment-form textarea {
	box-sizing: border-box;
	max-width: 100%;
}

.ht-reviews .comment-form {
	max-width: 620px;
}

.ht-reviews .comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.ht-reviews .comment-form-cookies-consent label {
	margin: 0;
	font-weight: 400;
	font-size: var(--ht-fs-sm);
}

.ht-reviews .comment_container {
	display: block;
}

.ht-reviews .avatar {
	display: none;
}

.ht-reviews .comment-text {
	margin: 0 !important;
	border: 0 !important;
	padding: 0 !important;
}

.ht-reviews .woocommerce-review__author {
	display: block;
	margin-top: 6px;
	color: var(--ht-navy);
	font-size: var(--ht-fs-md);
	font-weight: 700;
}

.ht-reviews .woocommerce-review__dash {
	display: none;
}

.ht-reviews .woocommerce-review__published-date {
	color: var(--ht-gray-light);
	font-size: var(--ht-fs-xs);
}

.ht-reviews .meta {
	margin-bottom: 10px;
}

.ht-reviews .description {
	line-height: 1.6;
}

.ht-reviews .description > :last-child {
	margin-bottom: 0;
}

/* Star ratings rendered by WooCommerce (font-based) */
.ht-reviews .star-rating {
	color: var(--ht-gold);
	font-size: 15px;
}

/* Write-review button and form */
.ht-reviews__write {
	min-height: 44px;
	padding: 0 22px;
	border: 0;
	border-radius: var(--ht-r-form);
	background: var(--ht-pink);
	color: var(--ht-white);
	font: inherit;
	font-size: var(--ht-fs-sm);
	font-weight: 700;
	cursor: pointer;
	transition: background-color var(--ht-t-fast), transform var(--ht-t-fast);
}

.ht-reviews__write:hover {
	background: var(--ht-pink-dark);
	transform: var(--ht-lift-sm);
}

.ht-reviews #review_form_wrapper {
	display: none;
	margin-bottom: 24px;
	padding: 24px;
	border-radius: var(--ht-r-lg);
	background: var(--ht-pink-wash);
}

.ht-reviews.is-form-open #review_form_wrapper {
	display: block;
	animation: ht-fade-in 0.25s ease both;
}

.ht-reviews .comment-form label {
	display: block;
	margin-bottom: 6px;
	font-weight: 600;
}

.ht-reviews .comment-form input[type="text"],
.ht-reviews .comment-form input[type="email"],
.ht-reviews .comment-form textarea {
	width: 100%;
	padding: 12px 14px;
	background: var(--ht-white);
}

.ht-reviews .comment-form .submit {
	min-height: 48px;
	padding: 0 28px;
	border: 0;
	border-radius: var(--ht-r-form);
	background: var(--ht-pink);
	color: var(--ht-white);
	font-weight: 700;
	cursor: pointer;
}

.ht-reviews .comment-form .submit:hover {
	background: var(--ht-pink-dark);
}

.ht-reviews .comment-form .stars a {
	color: var(--ht-gold);
}

.ht-reviews .comment-reply-title {
	display: none;
}

@media (max-width: 767px) {
	.ht-reviews__header {
		justify-content: flex-start;
		text-align: left;
	}
}

/* Tabs */
.ht-product-details {
	margin-top: var(--ht-section-y) !important;
}

.woocommerce-tabs ul.tabs {
	display: flex;
	gap: 8px;
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
	border-bottom: 1px solid var(--ht-border-soft);
}

.woocommerce-tabs ul.tabs li {
	margin: 0;
}

.woocommerce-tabs ul.tabs li a {
	display: block;
	padding: 12px 20px;
	border-radius: var(--ht-r-md) var(--ht-r-md) 0 0;
	color: var(--ht-gray);
	font-weight: 700;
	text-decoration: none;
}

.woocommerce-tabs ul.tabs li.active a {
	background: var(--ht-white);
	color: var(--ht-navy);
	box-shadow: inset 0 -2px 0 var(--ht-pink);
}

.woocommerce-Tabs-panel {
	max-width: 820px;
}

/* Related */
.ht-related {
	margin-top: var(--ht-section-y) !important;
}

/* --------------------------------------------------------------------------
   8. WooCommerce – archives
   -------------------------------------------------------------------------- */
.ht-archive-head {
	padding: 40px 0 32px;
	margin-bottom: 32px;
	border-radius: var(--ht-r-card);
	background: var(--ht-pink-wash);
	text-align: center;
}

.ht-archive-head .wp-block-query-title,
.ht-archive-head h1 {
	margin: 0 0 8px;
}

.ht-archive-head .wp-block-term-description {
	max-width: 720px;
	margin: 0 auto;
	color: var(--ht-gray);
}

.ht-archive-tools {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 24px !important;
}

.woocommerce-result-count {
	margin: 0;
	color: var(--ht-gray);
	font-size: var(--ht-fs-sm);
}

.woocommerce-ordering select,
select {
	min-height: 44px;
	padding: 0 40px 0 16px;
	border: 1px solid var(--ht-border-form);
	border-radius: var(--ht-r-form);
	background: var(--ht-white) url("data:image/svg+xml;utf8,<svg width='13' height='8' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M1.4.1 7.9 6.6 6.5 8 0 1.5 1.4.1Z' fill='%23363d40'/><path d='M13 1.5 6.5 8 5.1 6.6 11.6.1 13 1.5Z' fill='%23363d40'/></svg>") right 16px center no-repeat;
	color: var(--ht-text);
	font: inherit;
	appearance: none;
}

.wp-block-query-pagination {
	gap: 8px;
	margin-top: var(--wp--preset--spacing--xl) !important;
}

.wp-block-query-pagination a,
.wp-block-query-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border-radius: var(--ht-r-pill);
	background: var(--ht-white);
	color: var(--ht-navy);
	text-decoration: none;
}

.wp-block-query-pagination .current,
.wp-block-query-pagination a:hover {
	background: var(--ht-pink);
	color: var(--ht-white);
}

/* --------------------------------------------------------------------------
   9. WooCommerce – cart, checkout, notices, forms
   -------------------------------------------------------------------------- */
.wc-block-components-button:not(.is-link):not(.wc-block-components-drawer__close),
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button,
.woocommerce .button,
.woocommerce button.button {
	border: 0 !important;
	border-radius: var(--ht-r-form) !important;
	background: var(--ht-pink) !important;
	color: var(--ht-white) !important;
	font-weight: 700 !important;
	transition: background-color var(--ht-t-fast);
}

.wc-block-components-button:not(.is-link):not(.wc-block-components-drawer__close):hover,
.woocommerce .button:hover {
	background: var(--ht-pink-dark) !important;
}

/* "View cart" and other forward links styled like the shop's pink buttons.
   The long selector outranks WooCommerce's notice rule, which also uses !important. */
a.wc-forward,
.button.wc-forward,
.wc-block-components-notice-banner > .wc-block-components-notice-banner__content .wc-forward {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 22px !important;
	border: 0;
	border-radius: var(--ht-r-form) !important;
	background: var(--ht-pink) !important;
	color: var(--ht-white) !important;
	font-family: var(--ht-font-body);
	font-size: var(--ht-fs-sm);
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	opacity: 1;
	transition: background-color var(--ht-t-fast), transform var(--ht-t-fast);
}

a.wc-forward:hover,
a.wc-forward:focus-visible,
.wc-block-components-notice-banner > .wc-block-components-notice-banner__content .wc-forward:hover,
.wc-block-components-notice-banner > .wc-block-components-notice-banner__content .wc-forward:focus-visible {
	background: var(--ht-pink-dark) !important;
	color: var(--ht-white) !important;
	text-decoration: none;
	transform: var(--ht-lift-sm);
}

.wc-block-components-notice-banner > .wc-block-components-notice-banner__content .wc-forward {
	margin-block: -10px;
}

.wc-block-components-text-input input,
.wc-block-components-textarea,
.wc-block-components-combobox .wc-block-components-combobox-control input,
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="search"],
input[type="number"],
textarea {
	border: 1px solid var(--ht-border-form) !important;
	border-radius: var(--ht-r-form) !important;
	background-color: var(--ht-white);
	font-family: inherit;
}

/* Company fields and the country select need the same spacing as text inputs */
.wc-block-components-address-form__country,
.wc-block-components-address-form [id^="billing-happytreat"],
.wc-block-components-address-form [id^="shipping-happytreat"] {
	margin-bottom: 12px;
}

.wc-block-components-address-form .wc-block-components-text-input,
.wc-block-components-address-form .wc-block-components-country-input,
.wc-block-components-address-form .wc-block-components-state-input {
	margin-bottom: 12px;
}

/* "Perku kaip įmonė" toggle and the fields it opens */
.ht-company-toggle {
	margin: 4px 0 12px;
}

.ht-company-field[hidden] {
	display: none !important;
}

/* Guest hint above the checkout */
.ht-checkout-login {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 20px;
	max-width: var(--ht-max);
	margin: 0 auto 24px;
	padding: 16px 22px;
	border-radius: var(--ht-r-lg);
	background: var(--ht-pink-wash);
}

.ht-checkout-login p {
	margin: 0;
	font-size: var(--ht-fs-sm);
	color: var(--ht-text);
}

.ht-checkout-login__link {
	flex-shrink: 0;
	padding: 10px 20px;
	border-radius: var(--ht-r-form);
	background: var(--ht-pink);
	color: var(--ht-white);
	font-size: var(--ht-fs-sm);
	font-weight: 700;
	text-decoration: none;
}

.ht-checkout-login__link:hover {
	background: var(--ht-pink-dark);
	color: var(--ht-white);
}

/* Checkout/cart selects (country, state) matching the text inputs */
.wc-blocks-components-select .wc-blocks-components-select__container {
	border-radius: var(--ht-r-form) !important;
	background: var(--ht-white);
}

.wc-blocks-components-select .wc-blocks-components-select__select {
	border: 1px solid var(--ht-border-form) !important;
	border-radius: var(--ht-r-form) !important;
	background-image: none !important;
	color: var(--ht-text);
	font-family: inherit;
	padding-inline: 12px 40px !important;
}

.wc-blocks-components-select .wc-blocks-components-select__label {
	left: 10px !important;
	inset-inline-start: 10px !important;
}

.wc-blocks-components-select .wc-blocks-components-select__select:focus {
	border-color: var(--ht-pink) !important;
	box-shadow: 0 0 0 3px var(--ht-pink-soft) !important;
	outline: 0 !important;
}

.wc-blocks-components-select .wc-blocks-components-select__expand {
	fill: var(--ht-text);
	right: 12px !important;
	inset-inline-end: 12px !important;
}

.wc-block-components-text-input input:focus,
input:focus,
textarea:focus {
	border-color: var(--ht-pink) !important;
	box-shadow: 0 0 0 3px var(--ht-pink-soft) !important;
	outline: 0;
}

.wc-block-cart,
.wc-block-checkout {
	--wc-radius: var(--ht-r-form);
}

.wc-block-components-sidebar-layout .wc-block-components-main,
.wc-block-components-sidebar {
	box-sizing: border-box;
}

.wc-block-components-totals-wrapper,
.wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-block {
	border-color: var(--ht-border-soft) !important;
}

.wc-block-components-product-name {
	color: var(--ht-navy) !important;
	font-weight: 700;
	text-decoration: none;
}

.wc-block-components-notice-banner,
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	border-radius: var(--ht-r-form) !important;
}

.wc-block-components-notice-banner.is-success {
	border-color: var(--ht-pink) !important;
	background: var(--ht-pink-wash) !important;
}

/* Mini-cart drawer: slide in from the right with a fading backdrop */
.wc-block-components-drawer__screen-overlay:not(.wc-block-components-drawer__screen-overlay--is-hidden) {
	animation: ht-fade-in 0.3s ease both;
}

.wc-block-components-drawer__screen-overlay:not(.wc-block-components-drawer__screen-overlay--is-hidden) .wc-block-components-drawer {
	animation: ht-drawer-in 0.35s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes ht-fade-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes ht-drawer-in {
	from { translate: 100% 0; }
	to { translate: 0 0; }
}

.wc-block-components-button.wc-block-components-drawer__close {
	background: transparent !important;
	color: var(--ht-text) !important;
	box-shadow: none !important;
	opacity: 1;
}

.wc-block-components-button.wc-block-components-drawer__close:hover {
	color: var(--ht-pink) !important;
}

.wc-block-components-drawer__close svg {
	fill: currentColor;
}

/* Quantity selector (mini-cart and cart blocks) */
.wc-block-components-quantity-selector {
	border: 1px solid var(--ht-border-form) !important;
	border-radius: var(--ht-r-form) !important;
	background: var(--ht-white);
}

.wc-block-components-quantity-selector::after {
	display: none !important;
}

.wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input {
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	background: transparent;
}

.wc-block-components-quantity-selector__button {
	color: var(--ht-text) !important;
	background: transparent !important;
}

/* Mini-cart drawer items: image on the left, line total above the product name */
.wc-block-mini-cart__drawer .wc-block-cart-items__row {
	grid-template-columns: 80px minmax(0, 1fr) !important;
	grid-template-areas:
		"image total"
		"image product" !important;
	column-gap: 16px !important;
	row-gap: 4px !important;
	align-items: start;
}

.wc-block-mini-cart__drawer .wc-block-cart-item__image {
	grid-area: image !important;
	padding: 0 !important;
}

.wc-block-mini-cart__drawer .wc-block-cart-item__total {
	grid-area: total !important;
	justify-self: start;
	padding: 0 !important;
	text-align: left !important;
}

.wc-block-mini-cart__drawer .wc-block-cart-item__total-price-and-sale-badge-wrapper {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	gap: 8px;
}

.wc-block-mini-cart__drawer .wc-block-cart-item__total .wc-block-components-product-price {
	color: var(--ht-pink);
	font-weight: 700;
}

.wc-block-mini-cart__drawer .wc-block-cart-item__product {
	grid-area: product !important;
	padding: 0 !important;
}

/* Hide the product's short description in the drawer (keeps variation details) */
.wc-block-mini-cart__drawer .wc-block-components-product-metadata__description {
	display: none !important;
}

/* VAT in the drawer footer (replaces WooCommerce's "taxes calculated at checkout" note) */
/* Our three totals rows replace WooCommerce's single subtotal line */
.wc-block-mini-cart__footer .wc-block-mini-cart__footer-subtotal {
	display: none !important;
}

.ht-cart-totals {
	display: grid;
	gap: 6px;
	margin: 8px 0 16px;
}

.ht-cart-totals__row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	font-size: var(--ht-fs-sm);
	color: var(--ht-gray);
}

.ht-cart-totals__row span:last-child {
	font-weight: 600;
	color: var(--ht-text);
	white-space: nowrap;
}

.ht-cart-totals__row--total {
	padding-top: 8px;
	margin-top: 2px;
	border-top: 1px solid var(--ht-line);
	font-size: var(--ht-fs-md);
	font-weight: 700;
	color: var(--ht-navy);
}

.ht-cart-totals__row--total span:last-child {
	font-size: var(--ht-fs-lg);
	color: var(--ht-navy);
}

.ht-cart-totals__note {
	margin: 2px 0 0;
	font-size: var(--ht-fs-xs);
	color: var(--ht-gray);
}

/* "Including … in taxes" under the cart / checkout total: easier to see */
.wc-block-components-totals-footer-item-tax {
	margin-top: 6px !important;
	font-size: var(--ht-fs-sm) !important;
	color: var(--ht-gray) !important;
	text-align: right;
}

.wc-block-components-totals-footer-item-tax .wc-block-formatted-money-amount {
	font-weight: 600;
	color: var(--ht-text);
}

/* Mini-cart drawer */
.wc-block-mini-cart__drawer .wc-block-components-drawer__content {
	background: var(--ht-cream);
}

.wc-block-mini-cart__footer-actions .wc-block-components-button.outlined {
	background: transparent !important;
	color: var(--ht-navy) !important;
	border: 1px solid var(--ht-navy) !important;
}

/* --------------------------------------------------------------------------
   10. Content pages & blog
   -------------------------------------------------------------------------- */
.ht-page {
	padding-block: 48px var(--ht-section-y);
}

.ht-page__title {
	margin-bottom: 32px !important;
}

.ht-prose {
	line-height: 1.7;
}

.ht-prose h2,
.ht-prose h3 {
	margin-top: 1.6em;
}

.ht-prose a {
	color: var(--ht-pink);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.ht-prose table {
	width: 100%;
	border-collapse: collapse;
}

.ht-prose th,
.ht-prose td {
	padding: 10px 12px;
	border-bottom: 1px solid var(--ht-border-soft);
	text-align: left;
}

/* FAQ / content toggles (core Details block) */
.wp-block-details {
	margin-block: 0 12px !important;
	padding: 0;
	overflow: hidden;
	border: 1px solid var(--ht-card-border);
	border-radius: var(--ht-r-lg);
	background: var(--ht-white);
}

.wp-block-details summary {
	position: relative;
	padding: 18px 56px 18px 22px;
	color: var(--ht-navy);
	font-weight: 700;
	cursor: pointer;
	list-style: none;
}

.wp-block-details summary::-webkit-details-marker {
	display: none;
}

.wp-block-details summary::after {
	content: "+";
	position: absolute;
	right: 20px;
	top: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	transform: translateY(-50%);
	border-radius: 50%;
	background: var(--ht-pink-soft);
	color: var(--ht-pink);
	font-size: 20px;
	transition: transform var(--ht-t-fast);
}

.wp-block-details[open] summary::after {
	content: "−";
}

.wp-block-details > :not(summary) {
	margin: 0;
	padding: 0 22px 18px;
	color: var(--ht-text);
}

/* FAQ page: centred heading, wider toggles */
.ht-page--faq .ht-page__title {
	text-align: center;
}

.ht-page--faq .wp-block-details {
	max-width: 820px;
	margin-inline: auto !important;
}

/* Policy pages: readable legal text */
.ht-prose h2 {
	margin-top: 2em;
	font-size: clamp(20px, 1.8vw, 26px);
}

.ht-prose h3 {
	font-size: clamp(18px, 1.5vw, 21px);
}

.ht-prose ul,
.ht-prose ol {
	padding-left: 1.25em;
}

.ht-prose li {
	margin-bottom: 6px;
}

/* Categories page: grid of category cards */
.ht-page--categories .ht-page__title {
	text-align: center;
	margin-bottom: 40px !important;
}

.ht-cat-grid {
	--ht-cat-cols: var(--ht-cat-cols-desktop, 5);
	display: grid;
	grid-template-columns: repeat(var(--ht-cat-cols), minmax(0, 1fr));
	gap: 24px 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ht-cat-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border-radius: var(--ht-r-lg);
	background: var(--ht-white);
	box-shadow: var(--ht-shadow-card);
	color: var(--ht-navy);
	text-decoration: none;
	transition: transform var(--ht-t-base), box-shadow var(--ht-t-base);
}

.ht-prose .ht-cat-card,
.ht-prose .ht-cat-card:hover {
	text-decoration: none;
}

.ht-prose .ht-cat-card {
	color: var(--ht-navy);
}

.ht-cat-card:hover {
	transform: var(--ht-lift-md);
	box-shadow: var(--ht-shadow-hover);
	color: var(--ht-pink);
}

.ht-cat-card__media {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1;
	overflow: hidden;
	background: var(--wp--preset--gradient--cat-pink);
}

.ht-cat-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ht-cat-card__placeholder {
	font-family: var(--ht-font-heading);
	font-size: clamp(32px, 4vw, 48px);
	font-weight: 800;
	color: var(--ht-white);
}

.ht-cat-card__text {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 14px 16px 18px;
	text-align: center;
}

.ht-cat-card__title {
	font-size: var(--ht-fs-md);
	font-weight: 700;
	line-height: 1.3;
}

.ht-cat-card__count {
	color: var(--ht-gray-light);
	font-size: var(--ht-fs-tiny);
}

@media (max-width: 1200px) {
	.ht-cat-grid {
		--ht-cat-cols: 4;
	}
}

@media (max-width: 990px) {
	.ht-cat-grid {
		--ht-cat-cols: 3;
	}
}

@media (max-width: 640px) {
	.ht-cat-grid {
		--ht-cat-cols: 2;
		gap: 16px 12px;
	}
}

.ht-form-notice {
	padding: 14px 18px;
	border: 1px dashed var(--ht-card-border);
	border-radius: var(--ht-r-md);
	color: var(--ht-gray);
	font-size: var(--ht-fs-sm);
}

/* Contact page: form beside the postal address card */
.ht-contact {
	gap: clamp(24px, 4vw, 56px) !important;
	align-items: flex-start !important;
	margin-top: 8px;
}

.ht-contact h2 {
	margin: 0 0 20px;
	font-size: clamp(20px, 1.8vw, 24px);
}

.ht-contact > .wp-block-column {
	flex-basis: 50% !important;
	flex-grow: 1;
}


.ht-contact-card {
	padding: 25px;
	border: 0;
	border-radius: var(--ht-r-card);
	background: var(--ht-pink-nav);
	color: var(--ht-navy);
}

.ht-contact-card p {
	margin: 0 0 14px;
	line-height: 1.6;
}

.ht-contact-card p:last-child {
	margin-bottom: 0;
}

.ht-contact-card__lead {
	font-weight: 700;
	color: var(--ht-navy);
}

.ht-contact-card__note {
	font-size: var(--ht-fs-sm);
	color: var(--ht-gray);
}

.ht-contact-card a {
	color: inherit;
	text-decoration: underline;
}

.ht-contact-card__note {
	color: var(--ht-navy);
	opacity: 0.8;
}

/* WPForms "Modern" markup styles itself through CSS variables, so those are set
   here as well as the plain rules below. */
.ht-contact__form .wpforms-container,
.ht-newsletter .wpforms-container {
	--wpforms-field-border-radius: var(--ht-r-form);
	--wpforms-field-border-style: solid;
	--wpforms-field-border-size: 1px;
	--wpforms-field-background-color: #ffffff;
	--wpforms-field-border-color: rgba(54, 61, 64, 0.3);
	--wpforms-field-text-color: var(--ht-navy);
	--wpforms-field-menu-color: #ffffff;
	--wpforms-label-color: var(--ht-navy);
	--wpforms-label-sublabel-color: var(--ht-gray);
	--wpforms-label-error-color: #c10041;
	--wpforms-button-border-radius: var(--ht-r-pill);
	--wpforms-button-background-color: var(--ht-pink-dark);
	--wpforms-button-text-color: #ffffff;
	--wpforms-button-border-color: var(--ht-pink-dark);
	--wpforms-button-size-height: 52px;
	--wpforms-button-size-padding-h: 32px;
	--wpforms-button-size-font-size: 15px;
	--wpforms-field-size-input-height: 54px;
	--wpforms-field-size-input-spacing: 14px;
	--wpforms-field-size-font-size: 16px;
	--wpforms-field-size-padding-h: 18px;
	--wpforms-field-size-checkbox-size: 18px;
	--wpforms-field-size-sublabel-spacing: 6px;
}

.ht-newsletter .wpforms-container {
	--wpforms-field-border-size: 0px;
	--wpforms-field-border-radius: var(--ht-r-md);
	--wpforms-button-border-radius: var(--ht-r-md);
	--wpforms-button-background-color: var(--ht-navy);
	--wpforms-button-border-color: var(--ht-navy);
	--wpforms-button-size-height: 54px;
}

/* The same values again with enough weight to beat WPForms' own stylesheet. */
.ht-contact__form div.wpforms-container .wpforms-form input[type="text"],
.ht-contact__form div.wpforms-container .wpforms-form input[type="email"],
.ht-contact__form div.wpforms-container .wpforms-form input[type="tel"],
.ht-contact__form div.wpforms-container .wpforms-form input[type="url"],
.ht-contact__form div.wpforms-container .wpforms-form textarea,
.ht-newsletter div.wpforms-container .wpforms-form input[type="text"],
.ht-newsletter div.wpforms-container .wpforms-form input[type="email"] {
	width: 100% !important;
	max-width: none !important;
	box-sizing: border-box !important;
	font-family: inherit !important;
}

.ht-contact__form div.wpforms-container .wpforms-form .wpforms-field,
.ht-newsletter div.wpforms-container .wpforms-form .wpforms-field {
	max-width: none !important;
}

.ht-contact__form div.wpforms-container .wpforms-form button[type="submit"],
.ht-newsletter div.wpforms-container .wpforms-form button[type="submit"] {
	font-family: inherit !important;
	font-weight: 700 !important;
}

/* Form plugin output on the contact page: placeholders only, like the original */
.ht-contact__form .wpforms-container,
.ht-contact__form .wpforms-container-full {
	margin: 0 !important;
	padding: 0;
}

.ht-contact__form .wpforms-field-container {
	display: grid;
	gap: 15px;
}

.ht-contact__form .wpforms-field {
	margin: 0 !important;
	padding: 0 !important;
}

.ht-contact__form .wpforms-field-label,
.ht-contact__form div.wpforms-container .wpforms-form .wpforms-field-label,
.ht-contact__form .wpforms-field-sublabel,
.ht-contact__form .wpforms-required-label,
.ht-contact__form .wpforms-error-noscript,
.ht-contact__form #wpforms-error-noscript,
.ht-newsletter #wpforms-error-noscript {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

.ht-contact__form input[type="text"],
.ht-contact__form input[type="email"],
.ht-contact__form input[type="tel"],
.ht-contact__form textarea,
.ht-contact__form .wpforms-field-large,
.ht-contact__form .wpforms-field-medium {
	width: 100% !important;
	max-width: none !important;
	box-sizing: border-box;
	min-height: 54px;
	padding: 15px 18px !important;
	border: 1px solid var(--ht-border-form) !important;
	border-radius: var(--ht-r-form) !important;
	background: var(--ht-white);
	font-family: inherit;
	font-size: var(--ht-fs-md) !important;
}

.ht-contact__form textarea {
	min-height: 228px;
	resize: vertical;
}

.ht-contact__form .wpforms-submit-container {
	margin-top: 15px !important;
}

.ht-contact__form .wpforms-submit,
.ht-contact__form button[type="submit"],
.ht-contact__form input[type="submit"] {
	min-height: 52px;
	padding: 0 40px !important;
	border: 0 !important;
	border-radius: var(--ht-r-pill) !important;
	background: var(--ht-pink-dark) !important;
	color: var(--ht-white) !important;
	font-family: inherit;
	font-weight: 700 !important;
	cursor: pointer;
	transition: background-color var(--ht-t-fast), transform var(--ht-t-fast);
}

.ht-contact__form .wpforms-submit:hover,
.ht-contact__form button[type="submit"]:hover {
	background: var(--ht-pink) !important;
	transform: var(--ht-lift-sm);
}

.ht-contact__form .wpforms-error {
	color: var(--ht-pink-dark) !important;
	font-size: var(--ht-fs-xs);
}

@media (max-width: 781px) {
	.ht-contact > .wp-block-column {
		flex-basis: 100% !important;
	}
}

/* Blog cards */
.ht-posts .wp-block-post-template {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

.ht-post-card {
	height: 100%;
	overflow: hidden;
	border-radius: var(--ht-r-lg);
	background: var(--ht-white);
	box-shadow: var(--ht-shadow-card);
	transition: transform var(--ht-t-base), box-shadow var(--ht-t-base);
}

.ht-post-card:hover {
	transform: var(--ht-lift-md);
	box-shadow: var(--ht-shadow-hover);
}

.ht-post-card .wp-block-post-featured-image {
	margin: 0;
	aspect-ratio: 16 / 10;
	overflow: hidden;
}

.ht-post-card .wp-block-post-featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ht-post-card__body {
	padding: 20px 24px 24px;
}

.ht-post-card__body > * {
	margin-block: 0 10px;
}

.ht-post-card .wp-block-post-date {
	font-size: var(--ht-fs-xs);
	color: var(--ht-gray);
}

.ht-post-card .wp-block-post-title {
	font-size: 20px;
	line-height: 1.25;
}

.ht-post-card .wp-block-post-title a {
	color: var(--ht-navy);
	text-decoration: none;
}

.ht-post-card .wp-block-post-excerpt {
	font-size: var(--ht-fs-sm);
	color: var(--ht-gray);
}

.ht-single__image img {
	width: 100%;
	border-radius: var(--ht-r-card);
}

.ht-single__meta {
	color: var(--ht-gray);
	font-size: var(--ht-fs-sm);
}

.ht-post-nav {
	padding-top: 24px;
	margin-top: 48px !important;
	border-top: 1px solid var(--ht-border-soft);
}

.ht-post-nav a {
	color: var(--ht-pink);
	font-weight: 700;
	text-decoration: none;
}

/* 404 */
.ht-404 {
	padding-block: 96px;
	text-align: center;
}

.ht-404__code {
	margin: 0 !important;
	font-family: var(--ht-font-heading);
	font-size: clamp(80px, 14vw, 160px);
	font-weight: 800;
	line-height: 1;
	color: var(--ht-pink);
}

/* --------------------------------------------------------------------------
   11. Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 1200px) {
	.ht-products .wc-block-product-template,
	.ht-products .wp-block-post-template {
		--ht-cols: 3;
	}

	.ht-search {
		margin-left: 24px !important;
	}
}

@media (max-width: 990px) {
	.ht-header__top-inner {
		flex-wrap: wrap;
		min-height: 0;
		padding-block: 14px;
		gap: 12px;
	}

	.ht-search {
		order: 3;
		flex: 1 1 100%;
		max-width: none;
		margin: 0 !important;
	}

	.ht-account .wc-block-customer-account__account-label,
	.ht-account a > span:not([class*="icon"]) {
		display: none;
	}

	.ht-account a,
	.ht-cart .wc-block-mini-cart__button {
		padding: 0 14px;
	}

	.ht-nav__toggle {
		display: inline-flex;
	}

	.ht-nav .ht-menu {
		display: none;
		flex-direction: column;
		gap: 0;
		padding-bottom: 12px;
	}

	.ht-nav.is-open .ht-menu {
		display: flex;
	}

	.ht-nav .ht-menu > li > a {
		min-height: 48px;
	}

	.ht-nav .sub-menu {
		position: static;
		min-width: 0;
		padding: 0 0 8px 14px;
		background: none;
		box-shadow: none;
		opacity: 1;
		visibility: visible;
		transform: none;
	}

	.ht-nav .menu-item-has-children > a::after {
		display: none;
	}

	.ht-hero__container {
		grid-template-columns: 1fr;
		min-height: 0;
		gap: 0;
		text-align: center;
	}

	.ht-hero__media {
		order: -1;
		height: 280px;
	}

	.ht-hero__media img {
		object-fit: cover;
		object-position: center;
	}

	.ht-hero__content {
		max-width: none;
		padding-block: 32px 40px;
	}

	.ht-hero__text {
		margin-inline: auto !important;
	}

	.ht-hero .wp-block-buttons,
	.ht-trust {
		justify-content: center;
	}

	.ht-stats__inner {
		flex-wrap: wrap;
		gap: 0;
		padding-block: 16px;
	}

	.ht-stats__item {
		flex: 1 1 50%;
		padding: 14px 12px;
	}

	.ht-stats__item + .ht-stats__item::before {
		height: 20px;
	}

	.ht-stats__item:nth-child(2n + 1)::before {
		display: none;
	}

	.ht-stats__item:nth-child(n + 3) {
		border-top: 1px solid var(--ht-line);
	}

	.ht-cats__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 14px;
	}

	.ht-products .wc-block-product-template,
	.ht-products .wp-block-post-template,
	.ht-products--bundles .wc-block-product-template {
		--ht-cols: 2;
	}

	.ht-section-head {
		margin-bottom: 32px;
	}

	.ht-footer__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ht-posts .wp-block-post-template {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ht-announcement__inner {
		grid-template-columns: 1fr auto;
	}

	.ht-announcement .wp-block-social-links {
		display: none;
	}

	.ht-announcement__text {
		text-align: left;
	}
}

@media (max-width: 767px) {
	.ht-promo__inner {
		flex-wrap: wrap;
		gap: 16px;
		padding: 16px 20px;
		text-align: center;
	}

	.ht-promo__text {
		flex: 1 1 100%;
	}

	.ht-promo__icon {
		width: 44px;
		height: 44px;
	}

	.ht-newsletter form,
	.ht-newsletter__form {
		flex-direction: column;
		gap: 10px;
	}

	.ht-product {
		flex-direction: column;
	}

	.ht-product > .wp-block-column {
		flex-basis: 100% !important;
		width: 100%;
	}
}

@media (max-width: 640px) {
	.ht-cats__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ht-cat {
		padding: 18px;
		border-radius: 18px;
	}

	.ht-cat__icon {
		font-size: 48px;
	}

	.ht-footer__grid,
	.ht-posts .wp-block-post-template {
		grid-template-columns: 1fr;
	}

	.ht-footer__grid {
		gap: 32px;
		padding-block: 48px;
	}
}

@media (max-width: 540px) {
	.ht-hero__title {
		font-size: 28px !important;
	}

	.ht-hero__text {
		font-size: 16px;
	}

	.ht-hero .wp-block-buttons {
		flex-direction: column;
		align-items: stretch;
	}

	.ht-hero .wp-block-button,
	.ht-hero .wp-block-button__link {
		width: 100%;
	}

	.ht-trust {
		flex-direction: column;
		align-items: center;
		gap: 12px;
	}

	.ht-stats__item {
		flex: 1 1 100%;
		padding: 12px 0;
	}

	.ht-stats__item + .ht-stats__item::before {
		display: none;
	}

	.ht-stats__item:not(:first-child) {
		border-top: 1px solid var(--ht-line);
	}

	.ht-products .wc-block-product-template {
		gap: 12px !important;
	}

	.ht-card {
		padding: 12px;
	}

	.ht-products--bundles .wc-block-product-template {
		--ht-cols: 1;
	}

	/* Sliders: show part of the next card so it is clear you can swipe */
	.ht-slider.ht-products--popular .wc-block-product-template {
		--ht-cols: 1.6;
	}

	.ht-slider.ht-products--bundles .wc-block-product-template {
		--ht-cols: 1.15;
	}
}

/* Highlight inside category chips (chip background is already pink-soft) */
.ht-live-search__cats mark {
	background: none;
	color: var(--ht-pink);
	font-weight: 700;
}

.ht-live-search__cats a:hover mark {
	color: inherit;
}