/* =========================================================================
   Aqunatech — shop styles
   WooCommerce's own stylesheets are dequeued, so everything the shop needs
   lives here: the product grid, filter rail, product page, cart, checkout.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. Product grid and card
   ---------------------------------------------------------------------- */
.aqt-grid {
	display: grid;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 768px) {
	.aqt-grid { gap: 20px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

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

@media (min-width: 768px) {
	.aqt-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Horizontal rail used by "Recently viewed". */
.aqt-scroller {
	margin-inline: calc(var(--aqt-gutter) * -1);
	padding-inline: var(--aqt-gutter);
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scroll-snap-type: x mandatory;
}

.aqt-grid--scroll {
	display: flex;
	gap: 12px;
	padding-bottom: 10px;
}

.aqt-grid--scroll > .aqt-card {
	flex: 0 0 62%;
	max-width: 260px;
	scroll-snap-align: start;
}

@media (min-width: 768px) {
	/* On desktop the rail lines up with the grid sections above and below it
	   rather than bleeding past the container, and exactly four cards fill the
	   row. The full-bleed treatment is kept for narrow screens, where running
	   off the edge is the cue that there is more to swipe to. */
	.aqt-scroller {
		margin-inline: 0;
		padding-inline: 0;
	}

	.aqt-grid--scroll > .aqt-card {
		flex-basis: calc((100% - 36px) / 4);
		max-width: none;
	}
}

.aqt-card {
	position: relative;
	display: flex;
	flex-direction: column;
	border: 1px solid var(--aqt-border);
	border-radius: var(--aqt-radius);
	background: var(--aqt-surface);
	overflow: hidden;
	transition: border-color var(--aqt-t) var(--aqt-ease), box-shadow var(--aqt-t) var(--aqt-ease);
}

@media (hover: hover) {
	.aqt-card:hover {
		border-color: transparent;
		box-shadow: var(--aqt-shadow-lg);
	}

	.aqt-card:hover .aqt-card__img { transform: scale(1.04); }
}

.aqt-card:focus-within {
	border-color: var(--aqt-teal);
	box-shadow: 0 0 0 1px var(--aqt-teal);
}

/* The photograph sits on a tinted pad rather than white, so cut-out product
   shots read as objects on a surface instead of floating in the page. */
.aqt-card__media {
	position: relative;
	display: block;
	aspect-ratio: 1 / 1;
	background: var(--aqt-surface-alt);
	overflow: hidden;
}

.aqt-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s var(--aqt-ease);
}

.aqt-product-badge {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	padding: 5px 10px;
	background: var(--aqt-teal);
	color: var(--aqt-navy);
	font-family: var(--aqt-font-heading);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.3;
	font-variant-numeric: tabular-nums;
}

.aqt-product-badge--oos {
	left: auto;
	right: 0;
	background: rgba(6, 16, 26, 0.88);
	color: #fff;
	font-size: 0.66rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.aqt-card__body {
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 1;
	padding: 13px 13px 15px;
	border-top: 1px solid var(--aqt-border);
}

@media (min-width: 768px) {
	.aqt-card__body { padding: 15px 16px 17px; }
}

/* Title and the add button share a row, as in the reference. */
.aqt-card__row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 8px;
}

.aqt-card__title {
	margin: 0;
	font-family: var(--aqt-font-body);
	font-size: 0.9rem;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0;
	color: var(--aqt-text);
	/* Two lines maximum, so a long name never makes one card taller than the
	   rest of the row. */
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* The stretched link makes the whole card a hit target without nesting
   the add button inside an anchor. */
.aqt-card__link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.aqt-card__link:hover { color: var(--aqt-teal-dark); }

/* Icon-only, but padded out to a 44px target — most of this traffic is
   thumbs on phones. */
.aqt-card__add {
	position: relative;
	z-index: 2;
	display: grid;
	place-items: center;
	flex: none;
	width: 34px;
	height: 34px;
	margin: -6px -5px 0 0;
	padding: 0;
	border: 0;
	border-radius: var(--aqt-radius);
	background: transparent;
	color: var(--aqt-text-muted);
	transition: background-color var(--aqt-t-fast) var(--aqt-ease), color var(--aqt-t-fast) var(--aqt-ease);
}

.aqt-card__add::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 44px;
	height: 44px;
	transform: translate(-50%, -50%);
}

.aqt-card__add:hover,
.aqt-card__add:focus-visible {
	background: var(--aqt-teal);
	color: var(--aqt-navy);
}

.aqt-card__add.is-loading {
	opacity: 0.5;
	pointer-events: none;
}

.aqt-card__price {
	margin-top: auto;
	font-family: var(--aqt-font-heading);
	font-size: 1rem;
	font-weight: 700;
	color: var(--aqt-navy);
	font-variant-numeric: tabular-nums;
}

/* On sale, WooCommerce prints <del> then <ins>. The sale figure leads in the
   accent colour and the old price follows it, struck through. */
.aqt-card__price del {
	order: 2;
	color: var(--aqt-text-muted);
	font-size: 0.85rem;
	font-weight: 400;
	opacity: 1;
	text-decoration-thickness: 1px;
}

.aqt-card__price ins {
	order: 1;
	color: var(--aqt-teal-dark);
	text-decoration: none;
}

.aqt-card__price:has(ins) {
	display: flex;
	align-items: baseline;
	gap: 8px;
	flex-wrap: wrap;
}

/* -------------------------------------------------------------------------
   2. Shop layout
   ---------------------------------------------------------------------- */
.aqt-shop {
	display: grid;
	gap: 32px;
	grid-template-columns: 1fr;
}

@media (min-width: 1024px) {
	.aqt-shop { grid-template-columns: 260px minmax(0, 1fr); gap: 44px; }
}

.aqt-shop__main { min-width: 0; }

/* The filter rail arrives at 1024px and takes 304px out of the row. Holding
   the grid at two columns through that band keeps the cards close to the size
   they were just below the breakpoint, rather than shrinking them by a third
   the moment the rail appears; the third column returns once the row is wide
   enough to carry it. */
@media (min-width: 1024px) and (max-width: 1199px) {
	.aqt-shop__main .aqt-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.aqt-shop__toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
	margin-bottom: 20px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--aqt-border);
}

.aqt-shop__count {
	margin: 0;
	color: var(--aqt-text-muted);
	font-size: 0.88rem;
}

.aqt-shop__controls {
	display: flex;
	align-items: center;
	gap: 10px;
}

.aqt-select--sm {
	width: auto;
	min-width: 168px;
	padding-block: 9px;
	font-size: 0.86rem;
}

.aqt-shop__filter-toggle { position: relative; }

@media (min-width: 1024px) {
	.aqt-shop__filter-toggle { display: none; }
}

.aqt-shop__filter-dot {
	position: absolute;
	top: 5px;
	right: 5px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--aqt-teal);
}

/* -------------------------------------------------------------------------
   3. Filter rail
   ---------------------------------------------------------------------- */
.aqt-filters__backdrop {
	position: fixed;
	inset: 0;
	z-index: 340;
	background: rgba(6, 16, 26, 0.5);
}

@media (min-width: 1024px) {
	.aqt-filters__backdrop { display: none !important; }
}

@media (max-width: 1023px) {
	.aqt-filters {
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		z-index: 350;
		width: min(340px, 88vw);
		background: var(--aqt-surface);
		box-shadow: var(--aqt-shadow-lg);
		transform: translateX(-100%);
		transition: transform var(--aqt-t) var(--aqt-ease);
		overflow-y: auto;
		overscroll-behavior: contain;
	}

	.aqt-filters.is-open { transform: none; }

	.aqt-filters__form { padding: 20px 22px 32px; }
}

@media (min-width: 1024px) {
	.aqt-filters {
		position: sticky;
		top: calc(var(--aqt-nav-h) + 24px);
		align-self: start;
		max-height: calc(100vh - var(--aqt-nav-h) - 48px);
		overflow-y: auto;
	}

	.aqt-filters__head,
	.aqt-filters__apply { display: none; }
}

.aqt-filters__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 18px;
	padding-bottom: 14px;
	border-bottom: 1px solid var(--aqt-border);
}

.aqt-filters__heading {
	margin: 0;
	font-size: 1.1rem;
}

.aqt-filters__close { color: var(--aqt-text-muted); }
.aqt-filters__close:hover { background: var(--aqt-surface-alt); color: var(--aqt-text); }

.aqt-filters__clear {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	margin-bottom: 20px;
	color: var(--aqt-teal-dark);
	font-size: 0.82rem;
	font-weight: 500;
}

.aqt-filters__clear:hover { color: var(--aqt-navy); }

.aqt-filters__group {
	padding-bottom: 22px;
	margin-bottom: 22px;
	border-bottom: 1px solid var(--aqt-border);
}

.aqt-filters__group:last-of-type { border-bottom: 0; }

.aqt-filters__title {
	margin: 0 0 12px;
	font-family: var(--aqt-font-heading);
	font-size: 0.74rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var(--aqt-text-muted);
}

.aqt-filters__list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 3px;
}

.aqt-filters__list--scroll {
	max-height: 260px;
	overflow-y: auto;
	padding-inline-end: 4px;
}

.aqt-filters__apply { margin-top: 8px; }

/* Custom check / radio */
.aqt-check {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 6px;
	border-radius: var(--aqt-radius-sm);
	cursor: pointer;
	transition: background-color var(--aqt-t-fast) var(--aqt-ease);
}

.aqt-check:hover { background: var(--aqt-surface-alt); }

.aqt-check input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
}

.aqt-check__box {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 19px;
	height: 19px;
	flex: none;
	border: 1.5px solid #C7D0D9;
	border-radius: 5px;
	background: var(--aqt-surface);
	color: transparent;
	transition: all var(--aqt-t-fast) var(--aqt-ease);
}

.aqt-check--radio .aqt-check__box { border-radius: 50%; }

.aqt-check__dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: currentColor;
	transform: scale(0);
	transition: transform var(--aqt-t-fast) var(--aqt-ease);
}

.aqt-check input:checked + .aqt-check__box {
	background: var(--aqt-teal);
	border-color: var(--aqt-teal);
	color: var(--aqt-navy);
}

.aqt-check input:checked + .aqt-check__box .aqt-check__dot { transform: scale(1); }

.aqt-check input:focus-visible + .aqt-check__box {
	outline: 2px solid var(--aqt-teal);
	outline-offset: 2px;
}

.aqt-check__label {
	font-size: 0.9rem;
	color: var(--aqt-text);
	line-height: 1.35;
}

.aqt-check__count {
	margin-inline-start: auto;
	font-size: 0.75rem;
	color: var(--aqt-text-muted);
	font-variant-numeric: tabular-nums;
}

.aqt-check--block { align-items: flex-start; padding-inline: 0; }
.aqt-check--block:hover { background: transparent; }
.aqt-check--block .aqt-check__box { margin-top: 1px; }

/* Active filter chips */
.aqt-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 22px;
	padding: 0;
	list-style: none;
}

.aqt-chip {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 6px 12px;
	border: 1px solid var(--aqt-border);
	border-radius: 999px;
	background: var(--aqt-surface);
	color: var(--aqt-text);
	font-size: 0.8rem;
	transition: all var(--aqt-t-fast) var(--aqt-ease);
}

.aqt-chip:hover {
	border-color: var(--aqt-danger);
	color: var(--aqt-danger);
}

/* -------------------------------------------------------------------------
   4. Single product
   ---------------------------------------------------------------------- */
.aqt-product__layout {
	display: grid;
	gap: 28px;
	grid-template-columns: 1fr;
	margin-bottom: 48px;
}

@media (min-width: 1024px) {
	.aqt-product__layout {
		grid-template-columns: 55fr 45fr;
		gap: 52px;
		margin-bottom: 72px;
	}
}

/* Gallery */
.aqt-gallery__main {
	position: relative;
	border-radius: var(--aqt-radius);
	background: var(--aqt-surface-alt);
	overflow: hidden;
}

.aqt-gallery__zoom {
	display: block;
	width: 100%;
	padding: 0;
	border: 0;
	background: none;
	cursor: zoom-in;
}

.aqt-gallery__img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	transition: opacity 0.18s var(--aqt-ease);
}

.aqt-gallery__zoom-hint {
	position: absolute;
	bottom: 12px;
	right: 12px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	color: var(--aqt-navy);
	box-shadow: var(--aqt-shadow);
	opacity: 0;
	transition: opacity var(--aqt-t) var(--aqt-ease);
}

.aqt-gallery__main:hover .aqt-gallery__zoom-hint { opacity: 1; }

.aqt-gallery__thumbs {
	display: flex;
	gap: 10px;
	margin: 10px 0 0;
	padding: 0;
	list-style: none;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.aqt-gallery__thumb {
	width: 72px;
	height: 72px;
	padding: 0;
	border: 1.5px solid transparent;
	border-radius: var(--aqt-radius-sm);
	background: var(--aqt-surface-alt);
	overflow: hidden;
	transition: border-color var(--aqt-t-fast) var(--aqt-ease), opacity var(--aqt-t-fast) var(--aqt-ease);
	opacity: 0.68;
}

@media (min-width: 768px) {
	.aqt-gallery__thumb { width: 84px; height: 84px; }
}

.aqt-gallery__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.aqt-gallery__thumb:hover,
.aqt-gallery__thumb.is-active {
	opacity: 1;
	border-color: var(--aqt-teal);
}

/* Lightbox */
.aqt-lightbox {
	position: fixed;
	inset: 0;
	z-index: 500;
	display: grid;
	place-items: center;
	padding: 24px;
	background: rgba(6, 16, 26, 0.94);
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--aqt-t) var(--aqt-ease), visibility var(--aqt-t);
	cursor: zoom-out;
}

.aqt-lightbox.is-open { opacity: 1; visibility: visible; }

.aqt-lightbox__img {
	max-width: 100%;
	max-height: 88vh;
	object-fit: contain;
	border-radius: var(--aqt-radius);
}

.aqt-lightbox__close {
	position: absolute;
	top: 16px;
	right: 16px;
	color: #fff;
}

.aqt-lightbox__close:hover { background: rgba(255, 255, 255, 0.1); }

/* Summary column */
.aqt-product__brand {
	display: inline-block;
	margin-bottom: 10px;
	font-size: 0.72rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var(--aqt-teal-dark);
}

.aqt-product__brand:hover { color: var(--aqt-navy); }

.aqt-product__title {
	font-size: clamp(1.5rem, 4vw, 2rem);
	margin-bottom: 12px;
}

.aqt-product__price {
	font-family: var(--aqt-font-heading);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--aqt-navy);
	font-variant-numeric: tabular-nums;
	margin-bottom: 14px;
}

.aqt-product__price del {
	margin-inline-end: 10px;
	color: var(--aqt-text-muted);
	font-size: 1.05rem;
	font-weight: 400;
}

.aqt-product__price ins {
	color: var(--aqt-teal-dark);
	text-decoration: none;
}

.aqt-product__guarantee {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 18px;
	color: var(--aqt-text-muted);
	font-size: 0.83rem;
}

.aqt-product__guarantee .aqt-icon { color: var(--aqt-teal-dark); }

.aqt-product__short {
	margin-bottom: 24px;
	color: var(--aqt-text-muted);
	font-size: 0.95rem;
	line-height: 1.7;
}

.aqt-product__short ul { padding-inline-start: 20px; margin: 0 0 1em; }
.aqt-product__short li { margin-bottom: 6px; }

.aqt-product__buy {
	display: flex;
	gap: 10px;
	margin-bottom: 10px;
}

.aqt-product__addtocart { flex: 1; }

.aqt-product__buynow { margin-bottom: 22px; }

.aqt-product__rule {
	border: 0;
	border-top: 1px solid var(--aqt-border);
	margin: 22px 0;
}

.aqt-product__delivery {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin: 0;
	color: var(--aqt-text-muted);
	font-size: 0.85rem;
	line-height: 1.55;
}

.aqt-product__delivery .aqt-icon { margin-top: 1px; color: var(--aqt-teal-dark); flex: none; }

/* Share row */
.aqt-share {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 20px;
}

.aqt-share__label {
	margin-inline-end: 2px;
	font-size: 0.82rem;
	color: var(--aqt-text-muted);
}

.aqt-share__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	padding: 0;
	border: 1px solid var(--aqt-border);
	border-radius: 10px;
	background: var(--aqt-surface);
	color: var(--aqt-text-muted);
	transition: all var(--aqt-t-fast) var(--aqt-ease);
}

.aqt-share__btn:hover {
	border-color: var(--aqt-teal);
	background: rgba(0, 206, 170, 0.08);
	color: var(--aqt-teal-dark);
}

/* Accordion */
.aqt-accordion {
	max-width: 860px;
	border-top: 1px solid var(--aqt-border);
}

.aqt-accordion__item { border-bottom: 1px solid var(--aqt-border); }

.aqt-accordion__head { margin: 0; }

.aqt-accordion__btn {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	padding: 20px 2px;
	border: 0;
	background: none;
	color: var(--aqt-text);
	font-family: var(--aqt-font-heading);
	font-size: 1.02rem;
	font-weight: 600;
	text-align: left;
	transition: color var(--aqt-t-fast) var(--aqt-ease);
}

.aqt-accordion__btn:hover { color: var(--aqt-teal-dark); }

.aqt-accordion__btn .aqt-icon {
	flex: none;
	color: var(--aqt-text-muted);
	transition: transform var(--aqt-t) var(--aqt-ease);
}

.aqt-accordion__item.is-open .aqt-accordion__btn .aqt-icon { transform: rotate(180deg); }

.aqt-accordion__panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows var(--aqt-t) var(--aqt-ease);
}

.aqt-accordion__panel > * { overflow: hidden; }

.aqt-accordion__item.is-open .aqt-accordion__panel { grid-template-rows: 1fr; }

.aqt-accordion__item.is-open .aqt-accordion__panel > * { padding-bottom: 24px; }

/* Older engines without grid-template-rows animation still reveal the panel. */
@supports not (grid-template-rows: 1fr) {
	.aqt-accordion__panel { display: none; }
	.aqt-accordion__item.is-open .aqt-accordion__panel { display: block; padding-bottom: 24px; }
}

/* -------------------------------------------------------------------------
   5. Cart
   ---------------------------------------------------------------------- */
.aqt-cart {
	display: grid;
	gap: 32px;
	grid-template-columns: 1fr;
	align-items: start;
}

@media (min-width: 1024px) {
	.aqt-cart { grid-template-columns: minmax(0, 1fr) 360px; gap: 44px; }
}

.aqt-cart__items { display: grid; gap: 12px; }

.aqt-cart-item {
	display: grid;
	gap: 12px 14px;
	align-items: center;
	padding: 14px;
	background: var(--aqt-surface);
	border: 1px solid var(--aqt-border);
	border-radius: var(--aqt-radius);
	grid-template-columns: 72px minmax(0, 1fr) auto;
	grid-template-areas:
		"media info remove"
		"media qty  total";
	transition: opacity var(--aqt-t) var(--aqt-ease), transform var(--aqt-t) var(--aqt-ease);
}

@media (min-width: 768px) {
	.aqt-cart-item {
		grid-template-columns: 76px minmax(0, 1fr) auto auto 40px;
		grid-template-areas: "media info qty total remove";
		padding: 16px 18px;
	}
}

.aqt-cart-item.is-busy { opacity: 0.55; pointer-events: none; }

.aqt-cart-item.is-removing {
	opacity: 0;
	transform: translateX(-10px);
}

.aqt-cart-item__media { grid-area: media; }

.aqt-cart-item__img,
.aqt-cart-item__media img {
	width: 72px;
	height: 72px;
	border-radius: var(--aqt-radius-sm);
	object-fit: cover;
	background: var(--aqt-surface-alt);
}

.aqt-cart-item__info { grid-area: info; min-width: 0; }

.aqt-cart-item__brand {
	display: block;
	font-size: 0.68rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--aqt-teal-dark);
	margin-bottom: 2px;
}

.aqt-cart-item__name {
	margin: 0 0 3px;
	font-family: var(--aqt-font-body);
	font-size: 0.95rem;
	font-weight: 500;
	letter-spacing: 0;
}

.aqt-cart-item__name a:hover { color: var(--aqt-teal-dark); }

.aqt-cart-item__unit {
	font-size: 0.8rem;
	color: var(--aqt-text-muted);
}

.aqt-cart-item__qty { grid-area: qty; }

.aqt-cart-item__qty-fixed {
	font-size: 0.85rem;
	color: var(--aqt-text-muted);
}

.aqt-cart-item__total {
	grid-area: total;
	font-family: var(--aqt-font-heading);
	font-size: 1rem;
	font-weight: 700;
	color: var(--aqt-navy);
	font-variant-numeric: tabular-nums;
	text-align: right;
	white-space: nowrap;
}

.aqt-cart-item__remove {
	grid-area: remove;
	justify-self: end;
}

.aqt-cart-item__remove-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 9px;
	color: var(--aqt-text-muted);
	transition: color var(--aqt-t-fast) var(--aqt-ease), background-color var(--aqt-t-fast) var(--aqt-ease);
}

.aqt-cart-item__remove-btn:hover {
	color: var(--aqt-danger);
	background: rgba(214, 69, 69, 0.08);
}

.aqt-cart__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-top: 8px;
}

.aqt-cart__coupon {
	display: flex;
	gap: 8px;
	flex: 1;
	min-width: 240px;
}

.aqt-cart__coupon .aqt-input { max-width: 200px; }

/* Summary panel (cart, checkout, thank-you all reuse it) */
.aqt-summary {
	position: sticky;
	top: calc(var(--aqt-nav-h) + 20px);
	padding: 24px;
	background: var(--aqt-surface);
	border: 1px solid var(--aqt-border);
	border-radius: var(--aqt-radius);
	box-shadow: var(--aqt-shadow-sm);
}

.aqt-summary__title {
	margin: 0 0 18px;
	font-size: 1.1rem;
}

.aqt-summary__row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	padding: 7px 0;
	font-size: 0.92rem;
}

.aqt-summary__row--muted { color: var(--aqt-text-muted); font-size: 0.86rem; }

.aqt-summary__row--total {
	font-family: var(--aqt-font-heading);
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--aqt-navy);
	font-variant-numeric: tabular-nums;
}

.aqt-summary__rule {
	height: 1px;
	margin: 12px 0;
	background: var(--aqt-border);
}

.aqt-summary__note {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin: 16px 0 0;
	padding: 12px 14px;
	border-radius: var(--aqt-radius-sm);
	background: rgba(0, 206, 170, 0.07);
	color: var(--aqt-text-muted);
	font-size: 0.8rem;
	line-height: 1.5;
}

.aqt-summary__note .aqt-icon { margin-top: 1px; color: var(--aqt-teal-dark); flex: none; }

.aqt-summary__cta { margin-top: 18px; }

.aqt-summary__cta .checkout-button,
.aqt-summary__cta .button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 16px 24px;
	border: 0;
	border-radius: var(--aqt-radius-sm);
	background: var(--aqt-navy);
	color: #fff;
	font-family: var(--aqt-font-heading);
	font-size: 1rem;
	font-weight: 600;
	transition: background-color var(--aqt-t-fast) var(--aqt-ease), color var(--aqt-t-fast) var(--aqt-ease);
}

.aqt-summary__cta .checkout-button:hover,
.aqt-summary__cta .button:hover {
	background: var(--aqt-teal);
	color: var(--aqt-navy);
}

.aqt-summary__back {
	display: block;
	margin-top: 14px;
	text-align: center;
	color: var(--aqt-teal-dark);
	font-size: 0.88rem;
	font-weight: 500;
}

.aqt-summary__back:hover { color: var(--aqt-navy); }

/* -------------------------------------------------------------------------
   6. Checkout
   ---------------------------------------------------------------------- */
.aqt-checkout {
	display: grid;
	gap: 28px;
	grid-template-columns: 1fr;
	align-items: start;
}

@media (min-width: 1024px) {
	.aqt-checkout {
		grid-template-columns: minmax(0, 60fr) minmax(0, 40fr);
		gap: 48px;
	}

	/* Form left, summary right — but summary comes first in the DOM so it
	   leads on mobile, where shoppers want to confirm before typing. */
	.aqt-checkout__form { order: 1; }
	.aqt-checkout__summary { order: 2; }
}

.aqt-checkout__heading {
	margin-bottom: 18px;
	font-size: 1.15rem;
}

.aqt-checkout__reassure {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	margin: 14px 0 0;
	color: var(--aqt-text-muted);
	font-size: 0.82rem;
}

.aqt-checkout__reassure .aqt-icon { color: var(--aqt-teal-dark); }

/* The summary collapses on small screens. */
.aqt-summary__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	width: 100%;
	padding: 0 0 16px;
	border: 0;
	border-bottom: 1px solid var(--aqt-border);
	background: none;
	color: var(--aqt-text);
	font-size: 0.9rem;
	text-align: left;
}

.aqt-summary__toggle > span:first-child {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--aqt-teal-dark);
}

.aqt-summary__toggle-right {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--aqt-font-heading);
	color: var(--aqt-navy);
	font-variant-numeric: tabular-nums;
}

.aqt-summary__toggle .aqt-icon { transition: transform var(--aqt-t) var(--aqt-ease); }
.aqt-summary.is-open .aqt-summary__toggle .aqt-icon { transform: rotate(180deg); }

.aqt-summary__body { display: none; padding-top: 20px; }
.aqt-summary.is-open .aqt-summary__body { display: block; }

@media (min-width: 1024px) {
	.aqt-summary__toggle { display: none; }
	.aqt-summary__body { display: block; padding-top: 0; }
}

.aqt-summary__items {
	margin: 0 0 4px;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 16px;
}

.aqt-summary-item {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr) auto;
	gap: 12px;
	align-items: center;
	transition: opacity var(--aqt-t) var(--aqt-ease);
}

.aqt-summary-item.is-busy { opacity: 0.5; pointer-events: none; }
.aqt-summary-item.is-removing { opacity: 0; }

.aqt-summary-item__media { position: relative; }

.aqt-summary-item__media img {
	width: 56px;
	height: 56px;
	border-radius: 9px;
	object-fit: cover;
	background: var(--aqt-surface-alt);
}

.aqt-summary-item__qty {
	position: absolute;
	top: -6px;
	right: -6px;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 10px;
	background: var(--aqt-navy);
	color: #fff;
	font-family: var(--aqt-font-heading);
	font-size: 0.7rem;
	font-weight: 700;
	line-height: 20px;
	text-align: center;
}

.aqt-summary-item__info { min-width: 0; display: grid; gap: 6px; }

.aqt-summary-item__name {
	font-size: 0.88rem;
	font-weight: 500;
	line-height: 1.35;
}

.aqt-qty--sm button { width: 30px; }
.aqt-qty--sm input { width: 36px; padding-block: 5px; font-size: 0.85rem; }

.aqt-summary-item__right {
	display: grid;
	justify-items: end;
	gap: 4px;
}

.aqt-summary-item__total {
	font-family: var(--aqt-font-heading);
	font-size: 0.92rem;
	font-weight: 700;
	color: var(--aqt-navy);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.aqt-summary-item__remove {
	padding: 3px;
	border: 0;
	background: none;
	color: var(--aqt-text-muted);
	transition: color var(--aqt-t-fast) var(--aqt-ease);
}

.aqt-summary-item__remove:hover { color: var(--aqt-danger); }

/* -------------------------------------------------------------------------
   7. Thank you
   ---------------------------------------------------------------------- */
.aqt-thankyou { text-align: center; }

.aqt-tick {
	display: inline-block;
	width: 84px;
	height: 84px;
	margin-bottom: 26px;
	color: var(--aqt-teal);
}

.aqt-tick svg { width: 100%; height: 100%; }

/* The ring draws, then the check strikes through it. */
.aqt-tick__ring {
	stroke-dasharray: 227;
	stroke-dashoffset: 227;
	animation: aqt-draw 0.7s var(--aqt-ease) forwards;
}

.aqt-tick__mark {
	stroke-dasharray: 60;
	stroke-dashoffset: 60;
	animation: aqt-draw 0.4s var(--aqt-ease) 0.55s forwards;
}

@keyframes aqt-draw {
	to { stroke-dashoffset: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.aqt-tick__ring,
	.aqt-tick__mark { animation: none; stroke-dashoffset: 0; }
}

.aqt-thankyou__title {
	font-size: clamp(1.6rem, 5vw, 2.3rem);
	margin-bottom: 14px;
}

.aqt-thankyou__lead {
	max-width: 520px;
	margin: 0 auto 10px;
	color: var(--aqt-text-muted);
	font-size: 1rem;
	line-height: 1.7;
}

.aqt-thankyou__lead strong { color: var(--aqt-navy); }

.aqt-thankyou__contact {
	color: var(--aqt-text-muted);
	font-size: 0.9rem;
	margin-bottom: 30px;
}

.aqt-thankyou__actions {
	display: flex;
	gap: 12px;
	justify-content: center;
	flex-wrap: wrap;
	margin-bottom: 44px;
}

.aqt-thankyou__details {
	text-align: left;
	max-width: 520px;
	margin-inline: auto;
	border-top: 0;
}

.aqt-thankyou__details .aqt-accordion__item {
	border: 1px solid var(--aqt-border);
	border-radius: var(--aqt-radius);
	background: var(--aqt-surface);
}

.aqt-thankyou__details .aqt-accordion__btn { padding-inline: 20px; }
.aqt-thankyou__details .aqt-accordion__panel > * { padding-inline: 20px; }

.aqt-order-recap__items {
	margin: 0 0 4px;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 14px;
}

.aqt-order-recap__items li {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr) auto;
	gap: 12px;
	align-items: center;
}

.aqt-order-recap__media img {
	width: 48px;
	height: 48px;
	border-radius: 8px;
	object-fit: cover;
	background: var(--aqt-surface-alt);
}

.aqt-order-recap__info { display: grid; gap: 2px; min-width: 0; }
.aqt-order-recap__name { font-size: 0.88rem; font-weight: 500; }
.aqt-order-recap__qty { font-size: 0.78rem; color: var(--aqt-text-muted); }

.aqt-order-recap__price {
	font-family: var(--aqt-font-heading);
	font-weight: 700;
	font-size: 0.9rem;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.aqt-order-recap__address { margin-top: 18px; }

.aqt-order-recap__address h3 {
	margin: 0 0 6px;
	font-size: 0.72rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--aqt-text-muted);
}

.aqt-order-recap__address p {
	margin: 0;
	font-size: 0.9rem;
	color: var(--aqt-text-muted);
	line-height: 1.6;
}

/* -------------------------------------------------------------------------
   8. Contact page
   ---------------------------------------------------------------------- */
.aqt-contact {
	display: grid;
	gap: 32px;
	grid-template-columns: 1fr;
	align-items: start;
}

@media (min-width: 1024px) {
	.aqt-contact { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 52px; }
}

.aqt-contact__heading {
	margin-bottom: 18px;
	font-size: 1.25rem;
}

.aqt-panel {
	padding: 26px;
	background: var(--aqt-surface);
	border: 1px solid var(--aqt-border);
	border-radius: var(--aqt-radius);
}

.aqt-panel--light { box-shadow: var(--aqt-shadow-sm); }

.aqt-panel__title {
	margin: 0 0 6px;
	font-size: 1.02rem;
}

.aqt-panel__hint {
	margin: 0 0 16px;
	color: var(--aqt-text-muted);
	font-size: 0.82rem;
}

.aqt-contact__list {
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 18px;
}

.aqt-contact__list li {
	display: flex;
	align-items: flex-start;
	gap: 13px;
}

.aqt-contact__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	flex: none;
	border-radius: 10px;
	background: rgba(0, 206, 170, 0.1);
	color: var(--aqt-teal-dark);
}

.aqt-contact__label {
	display: block;
	font-size: 0.72rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--aqt-text-muted);
	margin-bottom: 2px;
}

.aqt-contact__list a:hover { color: var(--aqt-teal-dark); }

/* -------------------------------------------------------------------------
   9. WooCommerce notices (the plugin's own stylesheet is dequeued)
   ---------------------------------------------------------------------- */
.woocommerce-notices-wrapper { display: grid; gap: 10px; }

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin: 0 0 22px;
	padding: 15px 18px;
	border: 1px solid var(--aqt-border);
	border-left: 3px solid var(--aqt-teal);
	border-radius: var(--aqt-radius-sm);
	background: var(--aqt-surface);
	color: var(--aqt-text);
	font-size: 0.9rem;
	list-style: none;
}

.woocommerce-error { border-left-color: var(--aqt-danger); }
.woocommerce-error li { list-style: none; }

.woocommerce-message .button,
.woocommerce-info .button {
	margin-inline-start: auto;
	display: inline-flex;
	align-items: center;
	padding: 9px 18px;
	border-radius: var(--aqt-radius-sm);
	background: var(--aqt-navy);
	color: #fff;
	font-size: 0.84rem;
	font-weight: 600;
}

.woocommerce-message .button:hover,
.woocommerce-info .button:hover {
	background: var(--aqt-teal);
	color: var(--aqt-navy);
}

.screen-reader-text { /* Already defined in main.css; kept for WC markup. */ }

/* WooCommerce price markup wherever it lands. */
.woocommerce-Price-amount { font-variant-numeric: tabular-nums; }

/* =========================================================================
   Colour variations
   Swatches on the product page, dots on the shop cards, and the small
   "Colour: Black" line wherever a chosen variation is listed back.
   ========================================================================= */
.aqt-colour {
	margin: 20px 0 4px;
}

.aqt-colour__head {
	display: flex;
	align-items: baseline;
	gap: 7px;
	margin: 0;
	font-size: 0.9rem;
}

.aqt-colour__label { color: var(--aqt-text-muted); }

.aqt-colour__value {
	font-family: var(--aqt-font-heading);
	font-weight: 600;
	color: var(--aqt-text);
}

.aqt-colour-swatches {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	align-items: flex-start;
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
}

.aqt-colour-swatches__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
}

.aqt-colour-swatch__input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.aqt-colour-swatch {
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 2px solid var(--aqt-border);
	background: var(--aqt-swatch, var(--aqt-surface-alt));
	cursor: pointer;
	transition: transform var(--aqt-t-fast) var(--aqt-ease), border-color var(--aqt-t-fast) var(--aqt-ease), box-shadow var(--aqt-t-fast) var(--aqt-ease);
}

.aqt-colour-swatch:hover { transform: scale(1.1); }

.aqt-colour-swatch__input:checked + .aqt-colour-swatch {
	border-color: var(--aqt-teal);
	box-shadow: 0 0 0 2px rgba(0, 206, 170, 0.3);
	transform: scale(1.06);
}

.aqt-colour-swatch__input:focus-visible + .aqt-colour-swatch {
	outline: 2px solid var(--aqt-teal);
	outline-offset: 3px;
}

.aqt-colour-swatch--unknown {
	background: var(--aqt-surface-alt);
	border-style: dashed;
}

.aqt-colour-swatch__initial {
	font-size: 0.7rem;
	font-weight: 600;
	color: var(--aqt-text-muted);
	text-transform: uppercase;
}

/* Sold out reads as struck through, but stays selectable so the shopper can
   see which colours exist. */
.aqt-colour-swatch--oos { opacity: 0.45; }

.aqt-colour-swatch--oos::after {
	content: '';
	display: block;
	width: 100%;
	height: 2px;
	background: var(--aqt-text-muted);
	transform: rotate(-45deg);
}

.aqt-colour-swatches__name {
	max-width: 64px;
	color: var(--aqt-text-muted);
	font-size: 0.68rem;
	line-height: 1.2;
	text-align: center;
	word-break: break-word;
}

.aqt-colour__stock {
	margin: 12px 0 0;
	color: var(--aqt-danger);
	font-size: 0.84rem;
}

/* Touch targets get a little more room on phones. */
@media (max-width: 640px) {
	.aqt-colour-swatches { gap: 12px; }
	.aqt-colour-swatch { width: 36px; height: 36px; }
}

/* Shop card dots — indicators only, never interactive. */
.aqt-colour-dots {
	display: flex;
	align-items: center;
	gap: 5px;
	margin: 8px 0 0;
	padding: 0;
	list-style: none;
}

.aqt-colour-dot {
	width: 14px;
	height: 14px;
	border-radius: 50%;
	border: 1px solid var(--aqt-border);
	background: var(--aqt-swatch, var(--aqt-surface-alt));
	flex: none;
}

.aqt-colour-dot--unknown { border-style: dashed; }

.aqt-colour-dots__more {
	color: var(--aqt-text-muted);
	font-size: 0.7rem;
	letter-spacing: 0.02em;
}

/* "Colour: Black" under a product name in the cart and order summary. */
.aqt-cart-item__info .variation,
.aqt-summary-item__variation {
	display: block;
	margin: 3px 0 0;
	padding: 0;
	color: var(--aqt-text-muted);
	font-family: var(--aqt-font-body);
	font-size: 0.85rem;
	line-height: 1.4;
}

.aqt-cart-item__info .variation dt,
.aqt-cart-item__info .variation dd {
	display: inline;
	margin: 0;
	padding: 0;
	font-weight: 400;
}

.aqt-cart-item__info .variation dd p { display: inline; margin: 0; }
.aqt-cart-item__info .variation dd::after { content: ''; display: block; }

.aqt-summary-item__variation { font-size: 0.78rem; }

/* A colour with a single photo leaves no strip behind. */
.aqt-gallery__thumbs:empty { display: none; }