/* Aurora Products */
:root { --apr-accent: #0fa3b1; --apr-sale: #e53935; --apr-radius: 12px; }

.apr-block, .apr-modal, .apr-li, .apr-wishlist { --apr-text: #1d2433; --apr-muted: #8a91a0; --apr-line: #e9ecf1; }
.apr-block *, .apr-modal *, .apr-li *, .apr-wishlist * { box-sizing: border-box; }
.apr-card, .apr-card * { box-sizing: border-box; }

/* ---------------------------------------------------------------- block */
.apr-block { --cols: var(--apr-cols-d, 5); margin: 0 0 32px; color: var(--apr-text); }
@media (max-width: 1024px) { .apr-block { --cols: var(--apr-cols-t, 3); } }
@media (max-width: 767px) { .apr-block { --cols: var(--apr-cols-m, 2); } }
.apr-block.has-side { display: grid; grid-template-columns: var(--apr-side, 22%) minmax(0, 1fr); gap: var(--apr-gap, 16px); align-items: stretch; }
.apr-block.side-right { grid-template-columns: minmax(0, 1fr) var(--apr-side, 22%); }
.apr-block.side-right .apr-side { order: 2; }
.apr-side { min-width: 0; border-radius: var(--apr-radius); overflow: hidden; }
.apr-side a { display: block; height: 100%; }
.apr-side-img, .apr-side img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: var(--apr-radius); }
.apr-side .ap-zone.ap-fixed { aspect-ratio: auto; height: 100%; }
@media (max-width: 767px) {
	.apr-block.has-side { display: block; }
	.apr-side { display: none; }
}
.apr-main { min-width: 0; }

.apr-head { display: flex; align-items: center; justify-content: space-between; gap: 12px 20px; flex-wrap: wrap; margin-bottom: 14px; }
.apr-heading { margin: 0; font-size: clamp(20px, 2.2vw, 28px); font-weight: 700; line-height: 1.2; color: inherit; }
.apr-head-right { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-left: auto; }
.apr-tabs { display: flex; gap: 4px; flex-wrap: wrap; }
.apr-tab, .apr-all {
	padding: 6px 14px;
	border: 1px solid transparent;
	border-radius: 30px;
	background: none;
	color: var(--apr-muted);
	font: inherit;
	font-size: 13px;
	line-height: 1.3;
	text-decoration: none;
	cursor: pointer;
	transition: color .2s, border-color .2s, background .2s;
}
.apr-tab:hover, .apr-all:hover { color: var(--apr-sale); }
.apr-tab.is-on, .apr-head .apr-all { color: var(--apr-sale); border-color: var(--apr-sale); }
.apr-arrows { display: flex; gap: 6px; }
.apr-prev, .apr-next {
	width: 30px;
	height: 30px;
	padding: 0;
	border: 1px solid var(--apr-line);
	border-radius: 50%;
	background: #fff;
	color: var(--apr-text);
	font-size: 20px;
	line-height: 26px;
	cursor: pointer;
	transition: border-color .2s, color .2s, opacity .2s;
}
.apr-prev:hover:not(:disabled), .apr-next:hover:not(:disabled) { border-color: var(--apr-accent); color: var(--apr-accent); }
.apr-prev:disabled, .apr-next:disabled { opacity: .35; cursor: default; }
.apr-foot { margin-top: 12px; text-align: right; }
.apr-foot .apr-all { color: var(--apr-accent); }

/* Panels */
.apr-panel { position: relative; min-height: 120px; }
.apr-panel[hidden] { display: none; }
.apr-panel.is-loading::after, .apr-wishlist-grid.is-loading::after, .apr-archive-more.is-loading::after, .apr-spinner {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 28px;
	height: 28px;
	margin: -14px 0 0 -14px;
	border: 3px solid var(--apr-line);
	border-top-color: var(--apr-accent);
	border-radius: 50%;
	animation: apr-spin .8s linear infinite;
}
.apr-spinner { position: relative; display: block; margin: 40px auto; top: auto; left: auto; }
@keyframes apr-spin { to { transform: rotate(360deg); } }
.apr-empty { padding: 30px; color: var(--apr-muted); text-align: center; }

/* Carousel: native scrolling with snap (touch friendly, no library) */
.apr-layout-carousel .apr-track {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - (var(--cols) - 1) * var(--apr-gap, 16px)) / var(--cols));
	gap: var(--apr-gap, 16px);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	padding: 4px 1px 8px;
}
.apr-layout-carousel .apr-track::-webkit-scrollbar { display: none; }
.apr-layout-carousel .apr-cell { scroll-snap-align: start; min-width: 0; }

/* Grid */
.apr-layout-grid .apr-track, .apr-grid-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(calc((100% - (var(--cols, 4) - 1) * var(--apr-gap, 16px)) / var(--cols, 4) - 1px), 1fr));
	gap: var(--apr-gap, 16px);
}
.apr-wishlist { --cols: 4; }
@media (max-width: 1024px) { .apr-wishlist { --cols: 3; } }
@media (max-width: 767px) { .apr-wishlist { --cols: 2; } }
.apr-wishlist-grid { position: relative; min-height: 80px; }
.apr-wishlist-empty { padding: 40px; text-align: center; color: var(--apr-muted); }
.apr-more-wrap, .apr-archive-more { position: relative; display: flex; justify-content: center; padding: 18px 0; clear: both; }
.apr-more {
	padding: 10px 26px;
	border: 1px solid var(--apr-accent);
	border-radius: 30px;
	background: #fff;
	color: var(--apr-accent);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	transition: background .2s, color .2s;
}
.apr-more:hover { background: var(--apr-accent); color: #fff; }
.apr-archive-more.is-auto .apr-more { visibility: hidden; }
.apr-archive-more.is-loading .apr-more, .apr-panel.is-loading .apr-more { visibility: hidden; }

/* ---------------------------------------------------------------- card */
.apr-cell { min-width: 0; display: flex; }
.apr-card {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	padding: 10px;
	border: 1px solid var(--apr-line);
	border-radius: var(--apr-radius);
	background: #fff;
	color: var(--apr-text);
	text-align: left;
	transition: box-shadow .25s, border-color .25s, transform .25s;
}
.apr-card:hover { border-color: transparent; box-shadow: 0 10px 28px rgba(20, 30, 60, .12); }
.apr-card.is-out .apr-media { opacity: .55; filter: grayscale(.6); }
.apr-card.is-busy .apr-buy { opacity: .6; pointer-events: none; }

.apr-media { position: relative; margin-bottom: 10px; border-radius: calc(var(--apr-radius) - 4px); overflow: hidden; background: #f7f8fa; }
.apr-img-link { position: relative; display: block; aspect-ratio: 1 / 1; }
.apr-img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; object-fit: contain; transition: opacity .35s, transform .5s; margin: 0 !important; }
.apr-img-2 { opacity: 0; }
.apr-img-link.has-2:hover .apr-img:not(.apr-img-2) { opacity: 0; }
.apr-img-link.has-2:hover .apr-img-2 { opacity: 1; }
.apr-img-link:not(.has-2):hover .apr-img { transform: scale(1.05); }

.apr-badges { position: absolute; top: 8px; left: 8px; display: flex; flex-direction: column; gap: 4px; z-index: 2; pointer-events: none; }
.apr-badge { display: inline-block; padding: 3px 8px; border-radius: 6px; font-size: 11.5px; font-weight: 700; line-height: 1.3; color: #fff; }
.apr-badge-sale { background: var(--apr-sale); }
.apr-badge-new { background: var(--apr-accent); }

.apr-tools { position: absolute; top: 8px; right: 8px; display: flex; flex-direction: column; gap: 6px; z-index: 2; }
.apr-tool {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .95);
	color: var(--apr-text);
	box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
	cursor: pointer;
	opacity: 0;
	transform: translateX(6px);
	transition: opacity .2s, transform .2s, color .2s;
}
.apr-tool svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; }
.apr-card:hover .apr-tool, .apr-tool:focus-visible, .apr-wish.is-on { opacity: 1; transform: none; }
@media (hover: none) { .apr-tool.apr-wish { opacity: 1; transform: none; } .apr-qv-btn { display: none; } }
.apr-tool:hover { color: var(--apr-accent); }
.apr-wish.is-on { color: var(--apr-sale); }
.apr-wish.is-on svg { fill: currentColor; }

.apr-body { display: flex; flex-direction: column; flex: 1; gap: 4px; }
.apr-cat { color: var(--apr-muted); font-size: 10.5px; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.apr-title {
	display: -webkit-box;
	min-height: 2.6em;
	overflow: hidden;
	color: var(--apr-text);
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.3;
	text-decoration: none;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}
.apr-title:hover { color: var(--apr-accent); }
.apr-rating { font-size: 12px; }
.apr-stars { color: #ffb400; letter-spacing: 1px; }
.apr-stars i { color: #d9dde3; font-style: normal; }
.apr-price { margin-top: auto; padding-top: 4px; font-size: 15px; font-weight: 700; color: var(--apr-text); }
.apr-price del { margin-right: 4px; color: var(--apr-muted); font-size: 12px; font-weight: 400; opacity: 1; }
.apr-price ins { background: none; color: var(--apr-sale); text-decoration: none; }
.apr-card:not(.is-sale) .apr-price ins { color: inherit; }
.apr-cd { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 4px; padding: 4px 8px; border-radius: 6px; background: #fff3f2; color: var(--apr-sale); font-size: 11px; font-variant-numeric: tabular-nums; }
.apr-cd b { font-size: 12px; }
.apr-cd:empty { display: none; }

/* Buy */
.apr-buy { margin-top: 8px; }
.apr-buy-wrap { position: relative; }
.apr-add {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	min-height: 38px;
	padding: 8px 10px;
	border: 1px solid var(--apr-accent);
	border-radius: 30px;
	background: var(--apr-accent);
	color: #fff !important;
	font: inherit;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	text-decoration: none !important;
	cursor: pointer;
	transition: filter .2s, transform .1s;
}
.apr-add svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.apr-add:hover { filter: brightness(1.08); }
.apr-add:active { transform: scale(.98); }
.apr-add.apr-choose { background: #fff; color: var(--apr-accent) !important; }
.apr-add.is-disabled { border-color: var(--apr-line); background: #f3f4f6; color: var(--apr-muted) !important; cursor: default; }
.apr-add.is-in { background: #fff; color: var(--apr-accent) !important; }
.apr-add[hidden], .apr-qty[hidden] { display: none; }
.apr-qty { display: flex; align-items: center; min-height: 38px; border: 1px solid var(--apr-accent); border-radius: 30px; overflow: hidden; }
.apr-qty button {
	flex: none;
	width: 38px;
	height: 36px;
	padding: 0;
	border: 0;
	background: var(--apr-accent);
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
}
.apr-qty button:disabled { opacity: .45; cursor: default; }
.apr-qty input {
	flex: 1;
	min-width: 0;
	height: 36px;
	padding: 0;
	border: 0;
	background: #fff;
	color: var(--apr-text);
	font: inherit;
	font-weight: 700;
	text-align: center;
	box-shadow: none;
	-moz-appearance: textfield;
}
.apr-qty input::-webkit-outer-spin-button, .apr-qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Theme product lists with Aurora cards */
ul.products li.apr-li { display: flex; text-align: left; }
ul.products li.apr-li .apr-card { margin: 0; }

/* ---------------------------------------------------------------- quick view */
.apr-lock, .apr-lock body { overflow: hidden; }
.apr-modal { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(15, 20, 35, .55); opacity: 0; visibility: hidden; transition: opacity .25s, visibility .25s; }
.apr-modal.is-on { opacity: 1; visibility: visible; }
.apr-modal-box { position: relative; width: min(940px, 100%); max-height: calc(100vh - 32px); overflow: auto; padding: 24px; border-radius: 16px; background: #fff; color: var(--apr-text); box-shadow: 0 30px 80px rgba(0, 0, 0, .3); transform: translateY(14px); transition: transform .25s; }
.apr-modal.is-on .apr-modal-box { transform: none; }
.apr-modal-x { position: absolute; top: 8px; right: 10px; z-index: 3; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: #f3f4f6; color: var(--apr-text); font-size: 22px; line-height: 1; cursor: pointer; }
.apr-modal-x:hover { background: #e9ecf1; }
.apr-qv-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; }
.apr-qv-main { position: relative; aspect-ratio: 1 / 1; border-radius: 12px; overflow: hidden; background: #f7f8fa; }
.apr-qv-main img { width: 100%; height: 100%; object-fit: contain; }
.apr-qv-main .apr-badge { position: absolute; top: 10px; left: 10px; }
.apr-qv-thumbs { display: flex; gap: 8px; margin-top: 10px; overflow-x: auto; }
.apr-qv-thumb { flex: none; width: 64px; height: 64px; padding: 0; border: 2px solid transparent; border-radius: 8px; overflow: hidden; background: #f7f8fa; cursor: pointer; }
.apr-qv-thumb.is-on { border-color: var(--apr-accent); }
.apr-qv-thumb img { width: 100%; height: 100%; object-fit: cover; }
.apr-qv-info.apr-card { padding: 0; border: 0; box-shadow: none; gap: 8px; }
.apr-qv-info.apr-card:hover { box-shadow: none; }
.apr-qv-title { margin: 0; font-size: 22px; line-height: 1.25; }
.apr-qv-price { margin-top: 0; font-size: 22px; }
.apr-qv-desc { color: #4b5363; font-size: 14px; line-height: 1.55; }
.apr-qv-desc p { margin: 0 0 8px; }
.apr-qv-info .stock { margin: 0; font-size: 13px; }
.apr-qv-info .apr-buy { max-width: 280px; }
.apr-qv-variations table.variations { margin-bottom: 8px; }
.apr-qv-variations .single_add_to_cart_button { border-radius: 30px; background: var(--apr-accent); }
.apr-qv-foot { display: flex; align-items: center; gap: 14px; margin-top: 8px; }
.apr-qv-foot .apr-tool { opacity: 1; transform: none; box-shadow: none; border: 1px solid var(--apr-line); }
.apr-qv-more { color: var(--apr-accent); font-weight: 600; text-decoration: none; }
@media (max-width: 700px) {
	.apr-qv-grid { grid-template-columns: 1fr; gap: 16px; }
	.apr-modal-box { padding: 16px; }
}

/* Toast */
.apr-toast { position: fixed; left: 50%; bottom: 24px; z-index: 100001; max-width: calc(100% - 32px); padding: 11px 18px; border-radius: 30px; background: #1d2433; color: #fff; font-size: 14px; box-shadow: 0 10px 30px rgba(0, 0, 0, .25); transform: translate(-50%, 20px); opacity: 0; pointer-events: none; transition: opacity .25s, transform .25s; }
.apr-toast.is-on { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
.apr-toast.is-bad { background: var(--apr-sale); }
.apr-toast a { color: #fff; font-weight: 700; margin-left: 6px; }

@media (prefers-reduced-motion: reduce) {
	.apr-card, .apr-img, .apr-tool, .apr-modal, .apr-modal-box, .apr-toast { transition: none !important; }
}

/* ================================================================ card designs */

/* Minimal: no frame, large photo, outline button */
.apr-d-minimal { padding: 0; border: 0; background: transparent; }
.apr-d-minimal:hover { box-shadow: none; }
.apr-d-minimal .apr-media { margin-bottom: 8px; border-radius: var(--apr-radius); background: #f3f4f6; }
.apr-d-minimal:hover .apr-media { box-shadow: 0 8px 22px rgba(20, 30, 60, .12); }
.apr-d-minimal .apr-body { padding: 0 2px; }
.apr-d-minimal .apr-title { font-weight: 600; }
.apr-d-minimal .apr-add-cart, .apr-d-minimal .apr-choose { background: transparent; color: var(--apr-accent) !important; }
.apr-d-minimal .apr-add-cart:hover, .apr-d-minimal .apr-choose:hover { background: var(--apr-accent); color: #fff !important; filter: none; }

/* Grocery: round cart button next to the price */
.apr-d-round .apr-body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	grid-template-areas: "cat cat" "title title" "rating rating" "cd cd" "price buy";
	align-items: end;
	column-gap: 8px;
}
.apr-d-round .apr-cat { grid-area: cat; }
.apr-d-round .apr-title { grid-area: title; }
.apr-d-round .apr-rating { grid-area: rating; }
.apr-d-round .apr-cd { grid-area: cd; justify-self: start; margin-top: 2px; }
.apr-d-round .apr-price { grid-area: price; align-self: center; font-size: 16px; line-height: 1.2; }
.apr-d-round .apr-price del { display: block; margin: 0; }
.apr-d-round .apr-buy { grid-area: buy; margin: 0; }
.apr-d-round .apr-add-cart { width: 42px; min-height: 42px; height: 42px; padding: 0; border-radius: 50%; box-shadow: 0 6px 14px rgba(15, 163, 177, .35); }
.apr-d-round .apr-add-cart span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.apr-d-round .apr-add-cart svg { width: 20px; height: 20px; }
.apr-d-round .apr-choose, .apr-d-round .apr-add.is-disabled { width: auto; min-height: 36px; padding: 6px 12px; font-size: 12px; }
.apr-d-round .apr-qty { width: 104px; min-height: 36px; }
.apr-d-round .apr-qty button { width: 32px; height: 34px; font-size: 16px; }
.apr-d-round .apr-qty input { height: 34px; font-size: 13px; }
.apr-d-round .apr-buy-wrap:has(.apr-qty:not([hidden])) { grid-column: 1 / -1; }

/* Tile: tinted card, centered, round badge */
.apr-d-boxed { border: 0; background: #f2fafb; background: color-mix(in srgb, var(--apr-accent) 7%, #fff); text-align: center; }
.apr-d-boxed:hover { box-shadow: 0 12px 28px rgba(20, 30, 60, .12); transform: translateY(-3px); }
.apr-d-boxed .apr-media { background: #fff; }
.apr-d-boxed .apr-badge-sale { display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; padding: 0; border-radius: 50%; font-size: 12.5px; box-shadow: 0 4px 12px rgba(229, 57, 53, .35); }
.apr-d-boxed .apr-body { align-items: center; }
.apr-d-boxed .apr-title { text-align: center; }
.apr-d-boxed .apr-price { text-align: center; }
.apr-d-boxed .apr-buy { width: 100%; }
.apr-d-boxed .apr-add, .apr-d-boxed .apr-qty { border-radius: 10px; }

/* List: photo left, info right */
.apr-d-list { flex-direction: row; align-items: stretch; gap: 12px; }
.apr-d-list .apr-media { flex: 0 0 38%; margin: 0; }
.apr-d-list .apr-img-link { height: 100%; min-height: 110px; aspect-ratio: auto; }
.apr-d-list .apr-body { min-width: 0; }
.apr-d-list .apr-badges { top: 6px; left: 6px; }
.apr-d-list .apr-badge { font-size: 10.5px; padding: 2px 6px; }
.apr-d-list .apr-tools { top: 6px; right: 6px; }
.apr-d-list .apr-tool { width: 28px; height: 28px; }
.apr-layout-grid.apr-design-list .apr-track { grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }

/* ================================================================ header styles */

/* Underline */
.apr-head-underline .apr-head { align-items: flex-end; padding-bottom: 0; border-bottom: 2px solid var(--apr-line); }
.apr-head-underline .apr-heading { position: relative; padding-bottom: 10px; }
.apr-head-underline .apr-heading::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 56px; height: 3px; border-radius: 3px; background: var(--apr-accent); }
.apr-head-underline .apr-head-right { padding-bottom: 6px; }
.apr-head-underline .apr-tab { padding: 6px 8px 8px; border: 0; border-bottom: 3px solid transparent; border-radius: 0; margin-bottom: -8px; }
.apr-head-underline .apr-tab.is-on { border-bottom-color: var(--apr-accent); color: var(--apr-text); font-weight: 600; }
.apr-head-underline .apr-head .apr-all { border: 0; color: var(--apr-accent); font-weight: 600; }

/* Center */
.apr-head-center .apr-head { flex-direction: column; align-items: center; text-align: center; }
.apr-head-center .apr-head-right { margin: 0; justify-content: center; }
.apr-head-center .apr-tabs { justify-content: center; }
.apr-head-center .apr-tab { background: #f3f4f6; color: var(--apr-text); }
.apr-head-center .apr-tab.is-on { background: var(--apr-accent); border-color: var(--apr-accent); color: #fff; }
.apr-head-center .apr-head .apr-all { border-color: var(--apr-line); color: var(--apr-text); }
