/* =====================================================================
   VIV Storefront — "Aplomb" design preset
   Loaded after viv-storefront.css when Settings > Display > Preset = Aplomb.
   Everything is scoped to body.vivsf-preset-aplomb.

   Colors and sizes are CSS variables, so the Display settings still win:
   any color/typography you fill in there is output inline on the wrapper
   and overrides the preset value below.
   ===================================================================== */

body.vivsf-preset-aplomb .vivsf-storefront,
body.vivsf-preset-aplomb .vivsf-filters-group,
body.vivsf-preset-aplomb .vivsf-filter,
body.vivsf-preset-aplomb .vivsf-active-filters {
	--vivsf-accent: #0241a1;
	--vivsf-ap-light: #9ab3d9;
	--vivsf-ap-text: #443e51;
	--vivsf-ap-font: "Satoshi", "Satoshi-Variable", sans-serif;
	--vivsf-card-bg: #fff;
	--vivsf-card-border: var(--vivsf-accent);
	--vivsf-card-shadow: none;
	--vivsf-card-radius: 0;
	--vivsf-title-color: var(--vivsf-accent);
	--vivsf-price-color: var(--vivsf-accent);
	--vivsf-filter-title-color: var(--vivsf-accent);
	--vivsf-filter-item-color: var(--vivsf-accent);
	--vivsf-filter-item-hover-bg: rgba(2, 65, 161, .06);
	--vivsf-checked-bg: rgba(2, 65, 161, .08);
	--vivsf-checked-text: var(--vivsf-accent);
	--vivsf-checkbox-fill: var(--vivsf-accent);
	--vivsf-chip-bg: var(--vivsf-accent);
	--vivsf-chip-text: #fff;
	font-family: var(--vivsf-ap-font);
	color: var(--vivsf-accent);
	-webkit-font-smoothing: antialiased;
}

/* ============ GRID ============ */

body.vivsf-preset-aplomb .vivsf-grid {
	gap: 2rem;
}
@media (max-width: 768px) {
	body.vivsf-preset-aplomb .vivsf-grid { gap: 1.25rem; }
}

body.vivsf-preset-aplomb .vivsf-result-count {
	margin: 0 0 1.5rem;
	font-size: .875rem;
	font-weight: 500;
	letter-spacing: .08em;
	text-transform: uppercase;
	opacity: 1;
	color: var(--vivsf-accent);
}

/* ============ PRODUCT CARD (framed, like the original shop) ============ */

body.vivsf-preset-aplomb .vivsf-product {
	padding: 2.5rem 2.5rem 2.75rem;
	background: var(--vivsf-card-bg);
	border: 3px solid var(--vivsf-card-border);
	border-radius: var(--vivsf-card-radius);
	box-shadow: var(--vivsf-card-shadow);
}
@media (max-width: 1024px) {
	body.vivsf-preset-aplomb .vivsf-product { padding: 1.75rem 1.5rem 2rem; }
}
body.vivsf-preset-aplomb .vivsf-clickable-card:hover,
body.vivsf-preset-aplomb .vivsf-product-link:hover {
	transform: none;
}

body.vivsf-preset-aplomb .vivsf-product-image-wrap {
	margin-bottom: 2rem;
	border-radius: 0;
	background: transparent;
}
body.vivsf-preset-aplomb .vivsf-ratio-natural .vivsf-product-image-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1 / 1;
	overflow: hidden;
}
body.vivsf-preset-aplomb .vivsf-ratio-natural .vivsf-product-image-wrap img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}
body.vivsf-preset-aplomb .vivsf-ratio-square .vivsf-product-image-wrap img,
body.vivsf-preset-aplomb .vivsf-ratio-portrait .vivsf-product-image-wrap img,
body.vivsf-preset-aplomb .vivsf-ratio-landscape .vivsf-product-image-wrap img {
	padding: 0;
}

/* Card text is centered in this design regardless of the alignment setting */
body.vivsf-preset-aplomb .vivsf-product-info,
body.vivsf-preset-aplomb .vivsf-product-actions {
	text-align: center;
}

body.vivsf-preset-aplomb .vivsf-product-title {
	margin: 0 0 .75rem;
	font-family: var(--vivsf-ap-font);
	font-size: var(--vivsf-title-size, 1.25rem);
	font-weight: var(--vivsf-title-weight, 500);
	letter-spacing: .01em;
	line-height: 1.3;
	color: var(--vivsf-title-color);
}
body.vivsf-preset-aplomb .vivsf-product-title a:hover {
	color: var(--vivsf-title-color);
	text-decoration: underline;
	text-underline-offset: 3px;
}

body.vivsf-preset-aplomb .vivsf-product-sku {
	font-size: .875rem;
	letter-spacing: .04em;
	opacity: .75;
}

body.vivsf-preset-aplomb .vivsf-product-price {
	font-size: var(--vivsf-price-size, 1.25rem);
	font-weight: var(--vivsf-price-weight, 400);
	letter-spacing: .01em;
	color: var(--vivsf-price-color);
}
/* Sale price: struck-through original + underlined sale price */
body.vivsf-preset-aplomb .vivsf-product-price del {
	margin-right: .35em;
	opacity: .75;
	color: inherit;
}
body.vivsf-preset-aplomb .vivsf-product-price ins {
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 3px;
	background: none;
	color: inherit;
}
body.vivsf-preset-aplomb .vivsf-product-price .woocommerce-Price-amount {
	color: inherit;
}

body.vivsf-preset-aplomb .vivsf-product-actions {
	padding-top: 2rem;
}

/* Badges: square, brand blue */
body.vivsf-preset-aplomb .vivsf-badge {
	top: 0;
	left: 0;
	padding: .35em .8em;
	border-radius: 0;
	font-size: .75rem;
	font-weight: 900;
	letter-spacing: .08em;
	background: var(--vivsf-accent);
}
body.vivsf-preset-aplomb .vivsf-badge-oos {
	right: 0;
	left: auto;
	background: var(--vivsf-ap-text);
}

/* ============ BUTTONS (square, uppercase, diagonal wipe) ============ */

body.vivsf-preset-aplomb .vivsf-button,
body.vivsf-preset-aplomb .vivsf-product-actions .button,
body.vivsf-preset-aplomb .vivsf-product-actions .added_to_cart {
	position: relative;
	z-index: 1;
	overflow: hidden;
	display: inline-block;
	min-width: 75%;
	max-width: 100%;
	padding: 14px 2rem;
	border: 3px solid var(--vivsf-accent);
	border-radius: 0;
	font-family: var(--vivsf-ap-font);
	font-size: 1rem;
	font-weight: 900;
	line-height: 1.5;
	letter-spacing: .02em;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	transition: color 1.5s cubic-bezier(.83, .91, .27, 1), background-color .3s ease;
}
/* Narrow cards (4+ columns beside a sidebar): full-width button, text may wrap, tighter padding */
body.vivsf-preset-aplomb .vivsf-cols-4 .vivsf-button,
body.vivsf-preset-aplomb .vivsf-cols-5 .vivsf-button,
body.vivsf-preset-aplomb .vivsf-cols-6 .vivsf-button,
body.vivsf-preset-aplomb .vivsf-cols-4 .vivsf-product-actions .button,
body.vivsf-preset-aplomb .vivsf-cols-5 .vivsf-product-actions .button,
body.vivsf-preset-aplomb .vivsf-cols-6 .vivsf-product-actions .button {
	width: 100%;
	min-width: 0;
	padding: 12px 1rem;
	white-space: normal;
}
body.vivsf-preset-aplomb .vivsf-cols-4 .vivsf-product,
body.vivsf-preset-aplomb .vivsf-cols-5 .vivsf-product,
body.vivsf-preset-aplomb .vivsf-cols-6 .vivsf-product {
	padding: 1.75rem 1.5rem 2rem;
}
@media (max-width: 1024px) {
	body.vivsf-preset-aplomb .vivsf-button,
	body.vivsf-preset-aplomb .vivsf-product-actions .button { min-width: 0; width: 100%; padding: 12px 1rem; white-space: normal; }
}

/* The sweep: two triangles grow from opposite corners */
body.vivsf-preset-aplomb .vivsf-button::before,
body.vivsf-preset-aplomb .vivsf-button::after,
body.vivsf-preset-aplomb .vivsf-product-actions .button::before,
body.vivsf-preset-aplomb .vivsf-product-actions .button::after {
	content: "";
	position: absolute;
	z-index: -1;
	width: 0;
	height: 0;
	border: 0 solid;
	transform: rotate(1turn);
	transition: .5s ease-in-out;
}
body.vivsf-preset-aplomb .vivsf-button::before,
body.vivsf-preset-aplomb .vivsf-product-actions .button::before { bottom: 0; left: 0; }
body.vivsf-preset-aplomb .vivsf-button::after,
body.vivsf-preset-aplomb .vivsf-product-actions .button::after { top: 0; right: 0; }
body.vivsf-preset-aplomb .vivsf-button:hover::before,
body.vivsf-preset-aplomb .vivsf-button:hover::after,
body.vivsf-preset-aplomb .vivsf-button:focus-visible::before,
body.vivsf-preset-aplomb .vivsf-button:focus-visible::after,
body.vivsf-preset-aplomb .vivsf-product-actions .button:hover::before,
body.vivsf-preset-aplomb .vivsf-product-actions .button:hover::after {
	border-width: 100px 562.5px;
}

/* Solid: blue -> white sweep with blue text */
body.vivsf-preset-aplomb .vivsf-btn-solid .vivsf-button,
body.vivsf-preset-aplomb .vivsf-btn-solid .vivsf-product-actions .button,
body.vivsf-preset-aplomb .vivsf-btn-solid .vivsf-product-actions .added_to_cart {
	background: var(--vivsf-accent);
	color: #fff;
	opacity: 1;
}
body.vivsf-preset-aplomb .vivsf-btn-solid .vivsf-button::before,
body.vivsf-preset-aplomb .vivsf-btn-solid .vivsf-product-actions .button::before { border-color: transparent transparent transparent #fff; }
body.vivsf-preset-aplomb .vivsf-btn-solid .vivsf-button::after,
body.vivsf-preset-aplomb .vivsf-btn-solid .vivsf-product-actions .button::after { border-color: transparent #fff transparent transparent; }
body.vivsf-preset-aplomb .vivsf-btn-solid .vivsf-button:hover,
body.vivsf-preset-aplomb .vivsf-btn-solid .vivsf-button:focus-visible,
body.vivsf-preset-aplomb .vivsf-btn-solid .vivsf-product-actions .button:hover {
	color: var(--vivsf-accent);
	opacity: 1;
}

/* Outline: white -> blue sweep with white text */
body.vivsf-preset-aplomb .vivsf-btn-outline .vivsf-button,
body.vivsf-preset-aplomb .vivsf-btn-outline .vivsf-product-actions .button,
body.vivsf-preset-aplomb .vivsf-btn-outline .vivsf-product-actions .added_to_cart {
	background: #fff;
	color: var(--vivsf-accent);
}
body.vivsf-preset-aplomb .vivsf-btn-outline .vivsf-button::before,
body.vivsf-preset-aplomb .vivsf-btn-outline .vivsf-product-actions .button::before { border-color: transparent transparent transparent var(--vivsf-accent); }
body.vivsf-preset-aplomb .vivsf-btn-outline .vivsf-button::after,
body.vivsf-preset-aplomb .vivsf-btn-outline .vivsf-product-actions .button::after { border-color: transparent var(--vivsf-accent) transparent transparent; }
body.vivsf-preset-aplomb .vivsf-btn-outline .vivsf-button:hover,
body.vivsf-preset-aplomb .vivsf-btn-outline .vivsf-product-actions .button:hover {
	background: #fff;
	color: #fff;
}

/* Minimal keeps the plugin's text-link style, just in brand type */
body.vivsf-preset-aplomb .vivsf-btn-minimal .vivsf-button,
body.vivsf-preset-aplomb .vivsf-btn-minimal .vivsf-product-actions .button {
	min-width: 0;
	border-color: transparent;
	background: transparent;
	color: var(--vivsf-accent);
}
body.vivsf-preset-aplomb .vivsf-btn-minimal .vivsf-button::before,
body.vivsf-preset-aplomb .vivsf-btn-minimal .vivsf-button::after { display: none; }

/* Woo "View cart" link that appears after an AJAX add-to-cart */
body.vivsf-preset-aplomb .vivsf-product-actions .added_to_cart {
	display: block;
	margin-top: .75rem;
	padding: 0;
	border: 0;
	background: none !important;
	font-size: .875rem;
	color: var(--vivsf-accent) !important;
	text-decoration: underline;
}
body.vivsf-preset-aplomb .vivsf-product-actions .button.loading { opacity: .6; }

@media (prefers-reduced-motion: reduce) {
	body.vivsf-preset-aplomb .vivsf-button,
	body.vivsf-preset-aplomb .vivsf-button::before,
	body.vivsf-preset-aplomb .vivsf-button::after,
	body.vivsf-preset-aplomb .vivsf-product-actions .button,
	body.vivsf-preset-aplomb .vivsf-product-actions .button::before,
	body.vivsf-preset-aplomb .vivsf-product-actions .button::after { transition: none; }
}

body.vivsf-preset-aplomb .vivsf-no-results {
	padding: 3rem 2rem;
	border: 3px solid var(--vivsf-accent);
	border-radius: 0;
	background: #fff;
	font-size: 1.125rem;
	color: var(--vivsf-accent);
}

/* Loading spinner in brand blue */
body.vivsf-preset-aplomb .vivsf-storefront.vivsf-loading::after {
	border-color: rgba(2, 65, 161, .15);
	border-top-color: var(--vivsf-accent);
}

/* ============ TOOLBAR + SORTING (matches the original "Default sorting" box) ============ */

body.vivsf-preset-aplomb .vivsf-toolbar {
	margin: 0 0 2rem;
}
body.vivsf-preset-aplomb .vivsf-toolbar .vivsf-result-count {
	margin: 0;
}
body.vivsf-preset-aplomb .vivsf-sort-select {
	-webkit-appearance: none;
	appearance: none;
	min-width: 15rem;
	padding: .85rem 3rem .85rem 1.25rem;
	border: 2px solid var(--vivsf-accent, #0241a1);
	border-radius: 0;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%230241a1' d='M27.68 9.319c-.426-.426-1.117-.426-1.543 0L16 19.457 5.862 9.319c-.426-.426-1.117-.426-1.543 0s-.426 1.117 0 1.543l10.909 10.909c.205.205.482.32.771.32s.567-.115.771-.32l10.909-10.909c.426-.426.426-1.117 0-1.543z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1rem center;
	background-size: 1rem;
	font-family: "Satoshi", "Satoshi-Variable", sans-serif;
	font-size: 1.125rem;
	font-weight: 500;
	line-height: 1.4;
	color: var(--vivsf-accent, #0241a1);
}
body.vivsf-preset-aplomb .vivsf-sort-select:hover:not(:focus) {
	filter: drop-shadow(0 0 5px rgba(68, 62, 81, .32));
}
body.vivsf-preset-aplomb .vivsf-sort-select:focus {
	outline: none;
	box-shadow: 0 0 0 4px #9ab3d9;
}

/* ============ PAGINATION (square, blue) ============ */

body.vivsf-preset-aplomb .vivsf-pagination {
	margin: 2.5rem 0;
}
body.vivsf-preset-aplomb .vivsf-page-numbers {
	gap: .5rem;
}
body.vivsf-preset-aplomb .vivsf-page-link {
	min-width: 2.75rem;
	padding: .55rem .8rem;
	border: 2px solid var(--vivsf-accent);
	border-radius: 0;
	font-weight: 700;
	color: var(--vivsf-accent);
	opacity: 1;
	transition: background-color .2s ease, color .2s ease;
}
body.vivsf-preset-aplomb .vivsf-page-link:hover,
body.vivsf-preset-aplomb .vivsf-page-numbers .vivsf-current,
body.vivsf-preset-aplomb .vivsf-page-link.vivsf-current {
	background: var(--vivsf-accent);
	color: #fff;
}
body.vivsf-preset-aplomb .vivsf-page-link.vivsf-current::after { content: none; }
body.vivsf-preset-aplomb .vivsf-dots { color: var(--vivsf-accent); opacity: 1; }

/* ============ FILTERS (boxed, like the original "Filter" dropdown) ============ */

body.vivsf-preset-aplomb .vivsf-filter {
	margin: 0 0 1.25rem;
	border: 2px solid var(--vivsf-accent);
	background: #fff;
	font-size: 1rem;
}

body.vivsf-preset-aplomb .vivsf-filter-title,
body.vivsf-preset-aplomb button.vivsf-filter-title,
body.vivsf-preset-aplomb .vivsf-filter button.vivsf-filter-title {
	padding: 1.15rem 1.5rem !important;
	border: 0 !important;
	border-bottom: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	font-family: var(--vivsf-ap-font) !important;
	font-size: var(--vivsf-filter-title-size, 1.125rem) !important;
	font-weight: 700 !important;
	letter-spacing: .01em;
	line-height: 1.3;
	text-transform: none !important;
}
body.vivsf-preset-aplomb .vivsf-filter:not(.vivsf-collapsed) .vivsf-filter-title {
	border-bottom: 2px solid var(--vivsf-accent) !important;
}
body.vivsf-preset-aplomb button.vivsf-filter-title:focus-visible {
	outline: 3px solid var(--vivsf-ap-light);
	outline-offset: 2px;
}

/* Chevron instead of the triangle caret */
body.vivsf-preset-aplomb .vivsf-filter-caret {
	width: .6rem;
	height: .6rem;
	margin: -.3rem .2rem 0 1rem;
	border: 0;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform .2s ease, margin .2s ease;
}
body.vivsf-preset-aplomb .vivsf-collapsed .vivsf-filter-caret {
	margin-top: .3rem;
	transform: rotate(-135deg);
}

body.vivsf-preset-aplomb .vivsf-filter-body {
	padding: 1rem 1.5rem 1.25rem;
}

body.vivsf-preset-aplomb .vivsf-filter-search,
body.vivsf-preset-aplomb .vivsf-filter-dropdown {
	margin-bottom: .75rem;
	padding: .75rem 1rem;
	border: 2px solid var(--vivsf-accent);
	border-radius: 0;
	font-family: var(--vivsf-ap-font);
	font-size: .9375rem;
	font-weight: 500;
	color: var(--vivsf-accent);
	background-color: #fff;
}
body.vivsf-preset-aplomb .vivsf-filter-search::placeholder { color: var(--vivsf-ap-light); }
body.vivsf-preset-aplomb .vivsf-filter-search:focus,
body.vivsf-preset-aplomb .vivsf-filter-dropdown:focus {
	outline: none;
	box-shadow: 0 0 0 4px var(--vivsf-ap-light);
}
body.vivsf-preset-aplomb .vivsf-filter-dropdown {
	-webkit-appearance: none;
	appearance: none;
	padding-right: 2.75rem;
	cursor: pointer;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%230241a1' d='M27.68 9.319c-.426-.426-1.117-.426-1.543 0L16 19.457 5.862 9.319c-.426-.426-1.117-.426-1.543 0s-.426 1.117 0 1.543l10.909 10.909c.205.205.482.32.771.32s.567-.115.771-.32l10.909-10.909c.426-.426.426-1.117 0-1.543z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1rem center;
	background-size: 1rem;
}

body.vivsf-preset-aplomb .vivsf-filter-items {
	border: 0;
	border-radius: 0;
	background: transparent;
	scrollbar-color: var(--vivsf-accent) transparent;
	scrollbar-width: thin;
}
body.vivsf-preset-aplomb .vivsf-filter-item {
	border-bottom: 1px solid rgba(2, 65, 161, .15);
}
body.vivsf-preset-aplomb .vivsf-filter-link {
	gap: .75rem;
	padding: .6rem .25rem;
	font-size: var(--vivsf-filter-item-size, 1rem);
	font-weight: 500;
}

/* Square checkbox in brand blue */
body.vivsf-preset-aplomb .vivsf-checkbox {
	flex: 0 0 18px;
	width: 18px;
	height: 18px;
	border: 2px solid var(--vivsf-accent);
	border-radius: 0;
	opacity: 1;
	color: var(--vivsf-accent);
}
body.vivsf-preset-aplomb .vivsf-checked .vivsf-filter-link {
	font-weight: 700;
}
body.vivsf-preset-aplomb .vivsf-filter-count {
	opacity: .7;
}
body.vivsf-preset-aplomb .vivsf-filter-item.vivsf-unavailable .vivsf-filter-link {
	opacity: .4;
}

body.vivsf-preset-aplomb .vivsf-clear-filter {
	font-size: .875rem;
	font-weight: 700;
	opacity: 1;
	color: var(--vivsf-accent);
	text-underline-offset: 3px;
}

/* ============ ACTIVE FILTER CHIPS ============ */

body.vivsf-preset-aplomb .vivsf-active-filters {
	gap: .5rem;
	margin: 0 0 1.5rem;
	padding: 0;
	background: transparent;
	border-radius: 0;
}
body.vivsf-preset-aplomb .vivsf-active-title {
	font-size: .875rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	opacity: 1;
	color: var(--vivsf-accent);
}
body.vivsf-preset-aplomb .vivsf-chip {
	gap: .5rem;
	padding: .45rem .85rem;
	border: 2px solid var(--vivsf-chip-bg);
	border-radius: 0;
	font-size: .875rem;
	font-weight: 700;
	background: var(--vivsf-chip-bg);
	color: var(--vivsf-chip-text);
	transition: background-color .2s ease, color .2s ease;
}
body.vivsf-preset-aplomb .vivsf-chip:hover {
	opacity: 1;
	background: #fff;
	color: var(--vivsf-chip-bg);
}
body.vivsf-preset-aplomb .vivsf-chip-x { opacity: 1; }
body.vivsf-preset-aplomb .vivsf-clear-all {
	font-size: .875rem;
	font-weight: 700;
	opacity: 1;
	color: var(--vivsf-accent);
	text-underline-offset: 3px;
}
