/*
 * Ventureheap Builder - WooCommerce widgets.
 */

.vhb-products-heading { margin-bottom: 1.4rem; }

/* Product card ------------------------------------------------------------ */
.vhb-product-card {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	background: var(--vhb-bg);
	border: 1px solid var(--vhb-border);
	border-radius: var(--vhb-radius);
	overflow: hidden;
	transition: transform var(--vhb-transition), box-shadow var(--vhb-transition), border-color var(--vhb-transition);
}

.vhb-product-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px -22px rgba(15, 23, 42, .35); border-color: transparent; }

.vhb-product-card__media { position: relative; overflow: hidden; background: var(--vhb-alt); }
.vhb-product-card__media > a { display: block; }
.vhb-product-card__media img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; transition: transform .5s ease; }
.vhb-product-card:hover .vhb-product-card__media img { transform: scale(1.06); }

.vhb-product-card__actions {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 3;
	display: flex;
	flex-direction: column;
	gap: 8px;
	opacity: 0;
	transform: translateX(10px);
	transition: opacity var(--vhb-transition), transform var(--vhb-transition);
}

.vhb-product-card:hover .vhb-product-card__actions,
.vhb-product-card:focus-within .vhb-product-card__actions { opacity: 1; transform: none; }

/* A touch screen has no hover, so the buttons must simply be there. */
@media (hover: none) {
	.vhb-product-card__actions { opacity: 1; transform: none; }
}

.vhb-product-action {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	padding: 0;
	font-size: 18px;
	line-height: 1;
	background: rgba(255, 255, 255, .94);
	color: var(--vhb-secondary);
	border: 0;
	border-radius: 50%;
	box-shadow: 0 4px 14px -6px rgba(15, 23, 42, .35);
	cursor: pointer;
	transition: background var(--vhb-transition), color var(--vhb-transition), transform var(--vhb-transition);
}

.vhb-product-action:hover,
.vhb-product-action:focus-visible { background: var(--vhb-primary); color: #fff; }
.vhb-product-action:active { transform: scale(.92); }
.vhb-product-action svg { display: block; }
.vhb-wishlist.is-active { color: #e11d48; }
.vhb-wishlist.is-active .vhb-icon-heart path { fill: currentColor; }
.vhb-wishlist.is-active:hover { color: #fff; }

.vhb-product-card__body { display: flex; flex-direction: column; gap: .4rem; padding: 16px 18px 18px; flex: 1; }
.vhb-product-card__cat { font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--vhb-muted); text-decoration: none; }
.vhb-product-card__cat:hover { color: var(--vhb-primary); }

.vhb-product-card__title { margin: 0; font-size: 1rem; line-height: 1.4; font-weight: 600; }

/* Two lines at most, so a long name does not push one card taller. */
.vhb-product-card__title a {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	color: var(--vhb-secondary);
	text-decoration: none;
}

.vhb-product-card__title a:hover { color: var(--vhb-primary); }

.vhb-product-card__price { font-size: 1.05rem; font-weight: 700; color: var(--vhb-secondary); }
.vhb-product-card__price del { color: var(--vhb-muted); font-size: .85em; font-weight: 400; margin-right: .35rem; }
.vhb-product-card__price ins { text-decoration: none; color: var(--vhb-primary); }

.vhb-product-card__cart { margin-top: auto; padding-top: .7rem; }

/* Outlined until hovered: a grid of solid buttons shouts over the photos. */
.vhb-product-card__cart .button,
.vhb-product-card__cart .added_to_cart {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .4rem;
	width: 100%;
	padding: .62rem 1rem;
	font-size: .9rem;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	background: transparent;
	color: var(--vhb-primary);
	border: 1.5px solid var(--vhb-primary);
	border-radius: var(--vhb-radius-btn);
	cursor: pointer;
	transition: background var(--vhb-transition), color var(--vhb-transition);
}

.vhb-product-card__cart .button:hover,
.vhb-product-card__cart .button:focus-visible { background: var(--vhb-primary); color: #fff; }

/* WooCommerce adds these while the AJAX request runs and after it. */
.vhb-product-card__cart .button.loading { opacity: .6; pointer-events: none; }
.vhb-product-card__cart .button.added { background: var(--vhb-primary); color: #fff; }
.vhb-product-card__cart .added_to_cart { margin-top: 6px; background: var(--vhb-secondary); color: #fff; border-color: var(--vhb-secondary); }

.vhb-product-card.outofstock .vhb-product-card__media img { opacity: .7; }

/* Shop toolbar and pagination --------------------------------------------- */
.vhb-shop-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 20px;
	margin: 0 0 24px;
	padding: 0 0 16px;
	border-bottom: 1px solid var(--vhb-border);
}

.vhb-shop-toolbar .woocommerce-result-count { margin: 0; color: var(--vhb-muted); font-size: .92rem; }
.vhb-shop-toolbar .woocommerce-ordering { margin: 0; }

.vhb-shop-toolbar .woocommerce-ordering select {
	min-width: 220px;
	padding: .6rem 2.4rem .6rem .9rem;
	font: inherit;
	font-size: .92rem;
	color: var(--vhb-secondary);
	background-color: var(--vhb-bg);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2364748b' stroke-width='1.6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right .9rem center;
	border: 1px solid var(--vhb-border);
	border-radius: var(--vhb-radius-btn);
	appearance: none;
	cursor: pointer;
}

.vhb-products .woocommerce-pagination { margin-top: 36px; }

.vhb-products .woocommerce-pagination ul.page-numbers {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
	border: 0;
}

.vhb-products .woocommerce-pagination ul.page-numbers li { margin: 0; border: 0; float: none; }

.vhb-products .woocommerce-pagination .page-numbers a,
.vhb-products .woocommerce-pagination .page-numbers span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 42px;
	padding: 0 12px;
	font-weight: 600;
	color: var(--vhb-secondary);
	text-decoration: none;
	background: var(--vhb-bg);
	border: 1px solid var(--vhb-border);
	border-radius: var(--vhb-radius-btn);
	transition: background var(--vhb-transition), color var(--vhb-transition), border-color var(--vhb-transition);
}

.vhb-products .woocommerce-pagination .page-numbers a:hover { border-color: var(--vhb-primary); color: var(--vhb-primary); }
.vhb-products .woocommerce-pagination .page-numbers span.current { background: var(--vhb-primary); border-color: var(--vhb-primary); color: #fff; }
.vhb-products .woocommerce-pagination .page-numbers .dots { border: 0; background: none; }

.vhb-products .woocommerce-info {
	padding: 28px;
	text-align: center;
	color: var(--vhb-muted);
	background: var(--vhb-alt);
	border-radius: var(--vhb-radius);
}

@media (max-width: 600px) {
	.vhb-shop-toolbar { flex-direction: column; align-items: stretch; }
	.vhb-shop-toolbar .woocommerce-ordering select { width: 100%; }
	.vhb-product-card__body { padding: 12px 12px 14px; }
	.vhb-product-card__title { font-size: .92rem; }
	.vhb-product-card__cart .button { padding: .55rem .6rem; font-size: .84rem; }
}

/* Category tiles ---------------------------------------------------------- */
.vhb-cat-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: var(--vhb-bg);
	border: 1px solid var(--vhb-border);
	border-radius: var(--vhb-radius);
	overflow: hidden;
	transition: transform var(--vhb-transition), box-shadow var(--vhb-transition);
}

.vhb-cat-card:hover { transform: translateY(-3px); box-shadow: var(--vhb-shadow); }
.vhb-cat-card__media { display: block; background: var(--vhb-alt); }
.vhb-cat-card__media img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.vhb-cat-card__body { padding: 14px 16px; text-align: center; }
.vhb-cat-card__name { display: block; font-weight: 700; color: var(--vhb-secondary); }
.vhb-cat-card__count { display: block; font-size: .84rem; color: var(--vhb-muted); }

/* Single product parts ---------------------------------------------------- */
.vhb-product-detail__top { display: grid; gap: 32px; grid-template-columns: 1fr; margin-bottom: 40px; }
.vhb-product-detail__top.is-single-column { grid-template-columns: 1fr; }
.vhb-product-detail .summary > *:last-child { margin-bottom: 0; }

.vhb-price .price { font-size: 1.6rem; font-weight: 700; color: var(--vhb-secondary); }
.vhb-price del { font-size: .75em; font-weight: 400; color: var(--vhb-muted); margin-right: .4rem; }
.vhb-price ins { text-decoration: none; }

.vhb-add-to-cart form.cart { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-start; margin: 0; }
.vhb-add-to-cart--stacked form.cart { flex-direction: column; align-items: stretch; }
.vhb-add-to-cart form.cart.variations_form { display: block; }
.vhb-add-to-cart .quantity input { width: 84px; text-align: center; padding: .7rem .4rem; border: 1px solid var(--vhb-border); border-radius: var(--vhb-radius-btn); }

.vhb-add-to-cart .single_add_to_cart_button {
	padding: .85rem 1.8rem;
	font-weight: 600;
	background: var(--vhb-primary);
	color: #fff;
	border: 0;
	border-radius: var(--vhb-radius-btn);
	cursor: pointer;
}

.vhb-product-rating { display: flex; align-items: center; gap: 10px; }
.vhb-product-rating__count { font-size: .88rem; color: var(--vhb-muted); }

.vhb-product-tabs .woocommerce-tabs ul.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
	border-bottom: 1px solid var(--vhb-border);
}

.vhb-product-tabs .woocommerce-tabs ul.tabs::before,
.vhb-product-tabs .woocommerce-tabs ul.tabs li::before,
.vhb-product-tabs .woocommerce-tabs ul.tabs li::after { display: none; }

.vhb-product-tabs .woocommerce-tabs ul.tabs li { margin: 0; padding: 0; background: none; border: 0; border-radius: 0; }
.vhb-product-tabs .woocommerce-tabs ul.tabs li a { display: block; padding: .7rem 1.1rem; font-weight: 600; color: var(--vhb-muted); text-decoration: none; border-bottom: 2px solid transparent; }
.vhb-product-tabs .woocommerce-tabs ul.tabs li.active a { color: var(--vhb-primary); border-bottom-color: var(--vhb-primary); }

/* Mini cart --------------------------------------------------------------- */
.vhb-mini-cart { position: relative; display: inline-block; }

.vhb-mini-cart__button {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: .5rem;
	font-size: 22px;
	line-height: 1;
	background: none;
	border: 0;
	color: var(--vhb-secondary);
	text-decoration: none;
	cursor: pointer;
}

.vhb-mini-cart__button svg { width: 1em; height: 1em; fill: currentColor; }

.vhb-mini-cart__count {
	position: absolute;
	top: 0;
	right: 0;
	min-width: 18px;
	height: 18px;
	padding: 0 4px;
	font-size: .68rem;
	font-weight: 700;
	line-height: 18px;
	text-align: center;
	color: #fff;
	background: var(--vhb-primary);
	border-radius: 9px;
}

.vhb-mini-cart__total { font-size: .9rem; font-weight: 600; }

.vhb-mini-cart__panel {
	position: absolute;
	top: calc(100% + 10px);
	right: 0;
	z-index: 90;
	width: min(92vw, 340px);
	padding: 18px;
	background: var(--vhb-bg);
	border: 1px solid var(--vhb-border);
	border-radius: var(--vhb-radius);
	box-shadow: var(--vhb-shadow);
	text-align: left;
}

.vhb-mini-cart__panel[hidden] { display: none; }
.vhb-mini-cart__panel ul.cart_list { list-style: none; margin: 0 0 1rem; padding: 0; }
.vhb-mini-cart__panel ul.cart_list li { display: flex; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--vhb-border); }
.vhb-mini-cart__panel ul.cart_list img { width: 52px; height: auto; border-radius: 6px; order: -1; }
.vhb-mini-cart__panel .buttons { display: flex; gap: 8px; }
.vhb-mini-cart__panel .buttons a {
	flex: 1;
	padding: .55rem .8rem;
	font-size: .88rem;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	border-radius: var(--vhb-radius-btn);
	background: var(--vhb-alt);
	color: var(--vhb-secondary);
}
.vhb-mini-cart__panel .buttons .checkout { background: var(--vhb-primary); color: #fff; }

/* Cart and checkout ------------------------------------------------------- */
.vhb-cart table.shop_table, .vhb-checkout table.shop_table { width: 100%; border-collapse: collapse; }
.vhb-cart .shop_table th, .vhb-cart .shop_table td,
.vhb-checkout .shop_table th, .vhb-checkout .shop_table td { padding: .8rem; border: 1px solid var(--vhb-border); }
.vhb-checkout #payment { background: var(--vhb-alt); border-radius: var(--vhb-radius); padding: 20px; }

@media (min-width: 782px) {
	.vhb-product-detail__top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 44px; }
	.vhb-product-detail__top.is-single-column { grid-template-columns: 1fr; }
}

/* Single product parts: title, short description, meta ---------------------- */
.vhb-product-title {
	margin: 0 0 .35rem;
	font-size: clamp(1.5rem, 1.2rem + 1.4vw, 2.1rem);
	line-height: 1.2;
	color: var(--vhb-secondary);
}

.vhb-product-title a { color: inherit; text-decoration: none; }
.vhb-product-title a:hover { color: var(--vhb-primary); }

.vhb-product-excerpt { color: var(--vhb-muted); }
.vhb-product-excerpt p:last-child { margin-bottom: 0; }

.vhb-product-meta {
	font-size: .88rem;
	color: var(--vhb-muted);
}

.vhb-product-meta--inline {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 20px;
}

.vhb-product-meta--stacked { display: grid; gap: 5px; }

.vhb-product-meta__item { display: inline-flex; gap: 6px; }
.vhb-product-meta__label { font-weight: 600; color: var(--vhb-secondary); }
.vhb-product-meta__value a { color: inherit; text-decoration: none; }
.vhb-product-meta__value a:hover { color: var(--vhb-primary); text-decoration: underline; }

/* A tidier column split on the product page. The gallery does not need to be
   half the viewport on a wide screen, and the summary reads better narrower. */
@media (min-width: 1200px) {
	.vhb-product-detail__top { gap: 56px; }
}

.vhb-product-detail__gallery img,
.vhb-product-images img { border-radius: var(--vhb-radius); }

/* ==========================================================================
   Product gallery
   WooCommerce ships its own gallery styles, but a theme that replaces the
   product page cannot rely on them being present or winning the cascade. The
   thumbnail strip in particular is a bare <ol>, so without this it renders as
   a numbered list under the main image.
   ========================================================================== */

.woocommerce div.product div.images,
.vhb-product-images .woocommerce-product-gallery,
.vhb-product-detail .woocommerce-product-gallery {
	position: relative;
	margin: 0;
	opacity: 1 !important;
}

.woocommerce-product-gallery__wrapper {
	margin: 0;
	padding: 0;
	list-style: none;
	border-radius: var(--vhb-radius);
	overflow: hidden;
	background: var(--vhb-alt);
}

.woocommerce-product-gallery__image,
.woocommerce-product-gallery__image--placeholder {
	margin: 0;
	list-style: none;
}

.woocommerce-product-gallery__image a,
.woocommerce-product-gallery__image img {
	display: block;
	width: 100%;
	height: auto;
}

.woocommerce-product-gallery__image img {
	border-radius: var(--vhb-radius);
	object-fit: cover;
}

/* Without the slider script every image would stack full height, which is
   what makes the gallery look enormous. Cap it and let the slider take over
   once it initialises. */
.woocommerce-product-gallery:not(.flexslider) .woocommerce-product-gallery__wrapper > *:not(:first-child) {
	display: none;
}

/* Zoom trigger ------------------------------------------------------------- */
.woocommerce-product-gallery__trigger {
	position: absolute;
	top: 12px;
	right: 12px;
	left: auto;
	z-index: 5;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	font-size: 16px;
	line-height: 1;
	text-decoration: none;
	color: var(--vhb-secondary);
	background: var(--vhb-bg);
	border-radius: 50%;
	box-shadow: var(--vhb-shadow);
	transition: background var(--vhb-transition), color var(--vhb-transition);
}

.woocommerce-product-gallery__trigger:hover {
	background: var(--vhb-primary);
	color: #fff;
}

/* Thumbnail strip ---------------------------------------------------------- */
.woocommerce div.product div.images .flex-control-thumbs,
.flex-control-nav.flex-control-thumbs {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 10px;
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}

.flex-control-thumbs li {
	margin: 0;
	padding: 0;
	list-style: none;
	width: auto;
	float: none;
}

.flex-control-thumbs img {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border: 1px solid var(--vhb-border);
	border-radius: var(--vhb-radius-btn);
	opacity: .6;
	cursor: pointer;
	transition: opacity var(--vhb-transition), border-color var(--vhb-transition);
}

.flex-control-thumbs img:hover { opacity: 1; }

.flex-control-thumbs img.flex-active,
.flex-control-thumbs .flex-active img {
	opacity: 1;
	border-color: var(--vhb-primary);
}

/* Flexslider plumbing the gallery needs when WooCommerce's own layout CSS is
   not in charge of the page. */
.woocommerce-product-gallery .flex-viewport { border-radius: var(--vhb-radius); overflow: hidden; }
.woocommerce-product-gallery .flex-direction-nav { display: none; }

@media (max-width: 600px) {
	.flex-control-nav.flex-control-thumbs { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
	.woocommerce-product-gallery__trigger { width: 36px; height: 36px; top: 8px; right: 8px; }
}

/* Editor-only diagnostic. Never shown to shop visitors. */
.vhb-editor-hint {
	margin: 12px 0 0;
	padding: 10px 12px;
	border-left: 3px solid var(--vhb-accent, #f59e0b);
	background: rgba(245, 158, 11, .08);
	border-radius: 4px;
	font-size: .88rem;
	line-height: 1.5;
	color: var(--vhb-text, #1f2937);
}

/* Buy now sits beside Add to cart, deliberately quieter than it. */
.vhb-buy-now,
.woocommerce div.product form.cart .vhb-buy-now {
	background: var(--vhb-secondary, #0f172a);
	color: #fff;
	border: 0;
	cursor: pointer;
}

.vhb-buy-now:hover { filter: brightness(1.12); }

.vhb-add-to-cart form.cart.variations_form .vhb-buy-now,
.woocommerce div.product form.cart.variations_form .vhb-buy-now { margin-left: 8px; }