/**
 * WC Tools — Obsidian Gallery front-end integration.
 *
 * Re-skins the module output (Smart Quick View modal, Frequently Bought
 * Together box, Buy Now button) to match the Obsidian Gallery theme by
 * inheriting its :root design tokens (--og-*). Every value falls back to the
 * theme's own defaults, so the look still holds if the variables are ever
 * unavailable (e.g. a child theme, or the plugin used elsewhere).
 *
 * Loaded once, after each module's own stylesheet, so it wins the cascade
 * without touching the originals. No JavaScript, no web fonts — light by design.
 *
 * Token fallbacks mirror Obsidian Gallery defaults:
 *   card  #0a0a0c/85%   text #ffffff   muted #b9bcc2   border #3a3d42
 *   accent #0066cc      radius 10px    shadow 0 8px 28px rgba(0,0,0,.45)
 */

:root {
	--wct-card: var(--og-card, rgba(10, 10, 12, 0.96));
	--wct-bg: var(--og-bg-color, #0b0b0d);
	--wct-text: var(--og-text, #ffffff);
	--wct-muted: var(--og-text-muted, #b9bcc2);
	--wct-heading: var(--og-heading, #ffffff);
	--wct-border: var(--og-border, #3a3d42);
	--wct-accent: var(--og-accent, #0066cc);
	--wct-btn-text: var(--og-button-text, #ffffff);
	--wct-radius: var(--og-radius, 10px);
	--wct-radius-sm: var(--og-radius-sm, 6px);
	--wct-shadow: var(--og-shadow, 0 8px 28px rgba(0, 0, 0, 0.45));
	--wct-font: var(--og-font-body, inherit);
	--wct-font-heading: var(--og-font-heading, inherit);
	--wct-link: var(--og-link, #7db4ec);
}

/* =====================================================================
 * Smart Quick View — modal (Magnific Popup) + content
 * ===================================================================== */

/* Dim layer behind the modal — match the theme's overlay feel */
.mfp-woosq.mfp-bg,
.woosq-popup.mfp-bg {
	background: #000;
	opacity: 0.74;
}

/* The popup shell */
.mfp-woosq .mfp-content,
.woosq-popup .mfp-content {
	background: transparent;
}

.woosq-popup,
.mfp-woosq .woosq-product {
	background: var(--wct-card);
	color: var(--wct-text);
	font-family: var(--wct-font);
	border: 1px solid var(--wct-border);
	border-radius: var(--wct-radius);
	box-shadow: var(--wct-shadow);
	overflow: hidden;
}

/* Backdrop-blur for the glassy theme card, where supported */
@supports ((-webkit-backdrop-filter: blur(6px)) or (backdrop-filter: blur(6px))) {
	.woosq-popup {
		-webkit-backdrop-filter: blur(8px);
		backdrop-filter: blur(8px);
	}
}

.woosq-popup,
.woosq-popup p,
.woosq-popup li,
.woosq-popup td,
.woosq-popup .woocommerce-product-details__short-description {
	color: var(--wct-text);
}

.woosq-popup h1,
.woosq-popup h2,
.woosq-popup h3,
.woosq-popup .product_title,
.woosq-popup .entry-title {
	color: var(--wct-heading);
	font-family: var(--wct-font-heading);
}

/* Prices */
.woosq-popup .price,
.woosq-popup .price .woocommerce-Price-amount,
.woosq-popup .price ins .woocommerce-Price-amount {
	color: var(--wct-accent);
	font-weight: 700;
}

.woosq-popup .price del,
.woosq-popup .price del .woocommerce-Price-amount {
	color: var(--wct-muted);
	opacity: 0.8;
}

/* Links inside the modal */
.woosq-popup a {
	color: var(--wct-link);
}

.woosq-popup a:hover {
	color: var(--og-link-hover, #ffffff);
}

/* Sidebar / scroll areas */
.woosq-popup .woosq-sidebar,
.woosq-popup .woosq-related,
.woosq-popup .woosq-related-heading,
.woosq-popup .woosq-sidebar-heading {
	border-color: var(--wct-border);
}

/* Tabs / borders WooCommerce draws inside the summary */
.woosq-popup .woocommerce-tabs ul.tabs,
.woosq-popup table.variations,
.woosq-popup .woocommerce-tabs,
.woosq-popup form.cart,
.woosq-popup .quantity input {
	border-color: var(--wct-border);
}

.woosq-popup .quantity input.qty {
	background: var(--wct-bg);
	color: var(--wct-text);
	border: 1px solid var(--wct-border);
	border-radius: var(--wct-radius-sm);
}

/* Close button + prev/next arrows — accent themed */
.mfp-woosq button.mfp-close,
.mfp-woosq .mfp-close {
	color: var(--wct-text);
	opacity: 0.85;
}

.mfp-woosq button.mfp-close:hover {
	color: var(--wct-accent);
	opacity: 1;
}

.mfp-woosq .mfp-arrow:before {
	border-color: transparent;
}

.mfp-woosq .mfp-arrow:after {
	color: var(--wct-text);
}

.mfp-woosq .mfp-arrow:hover:after {
	color: var(--wct-accent);
}

/* Loading spinner tint */
.woosq-popup .woosq-loading:after,
.mfp-woosq .mfp-preloader {
	color: var(--wct-accent);
}

/* The Quick View trigger on shop loops.
 * The module outputs <button class="woosq-btn"> for the "button" type and
 * <a class="woosq-btn"> for the "link" type (same class, different element).
 * Style each to honour the user's chosen type instead of forcing a button. */

/* Button type — filled, matches theme buttons */
button.woosq-btn {
	display: inline-block;
	background: var(--wct-accent);
	color: var(--wct-btn-text);
	border: 0;
	border-radius: var(--wct-radius-sm);
	font-weight: 700;
	line-height: 1.4;
	cursor: pointer;
	text-decoration: none;
	transition: filter 0.2s ease, transform 0.2s ease;
}

button.woosq-btn:hover {
	background: var(--wct-accent);
	color: var(--wct-btn-text);
	filter: brightness(1.18);
}

/* Link type — themed text link, no button chrome */
a.woosq-btn {
	color: var(--wct-link);
	text-decoration: none;
	transition: color 0.2s ease;
}

a.woosq-btn:hover {
	color: var(--wct-accent);
}

/* Icon-only triggers: compact, transparent, regardless of element */
.woosq-btn.woosq-btn-icon-only {
	background: transparent;
	color: var(--wct-text);
	padding: 0;
	filter: none;
}

.woosq-btn.woosq-btn-icon-only:hover {
	color: var(--wct-accent);
}

/* =====================================================================
 * Frequently Bought Together
 * ===================================================================== */

.woobt-wrap {
	background: var(--wct-card);
	color: var(--wct-text);
	font-family: var(--wct-font);
	border: 1px solid var(--wct-border);
	border-radius: var(--wct-radius);
	box-shadow: var(--wct-shadow);
	padding: 18px;
}

.woobt-wrap .woobt-title,
.woobt-wrap .woobt-products .woobt-product .woobt-title,
.woobt-wrap .woobt-products .woobt-product .woobt-title a {
	color: var(--wct-heading);
	font-family: var(--wct-font-heading);
}

.woobt-wrap .woobt-products .woobt-product .woobt-title a:hover {
	color: var(--wct-accent);
}

/* Each product row */
.woobt-wrap .woobt-products .woobt-product {
	border-bottom: 1px solid var(--wct-border);
}

.woobt-wrap .woobt-thumb {
	border-radius: var(--wct-radius-sm);
	overflow: hidden;
}

/* Prices */
.woobt-wrap .woobt-price,
.woobt-wrap .woobt-price-new,
.woobt-wrap .woobt-products .woobt-product .woobt-price ins {
	color: var(--wct-accent);
	font-weight: 700;
}

.woobt-wrap .woobt-price del {
	color: var(--wct-muted);
	opacity: 0.8;
}

/* Total line */
.woobt-total,
.woobt-wrap .woobt-total,
.woobt-wrap .woobt-total-price {
	color: var(--wct-heading);
}

.woobt-wrap .woobt-total-price .amount {
	color: var(--wct-accent);
}

/* Checkboxes accent */
.woobt-wrap input[type="checkbox"] {
	accent-color: var(--wct-accent);
}

/* The add-selected-to-cart button */
.woobt-wrap .woobt-button button,
.woobt-wrap button.woobt-submit,
.woobt-wrap .woobt-checkbox-all + label,
.woobt-wrap a.button,
.woobt-wrap button.button {
	background: var(--wct-accent);
	color: var(--wct-btn-text);
	border: 0;
	border-radius: var(--wct-radius-sm);
	font-weight: 700;
	transition: filter 0.2s ease;
}

.woobt-wrap .woobt-button button:hover,
.woobt-wrap button.woobt-submit:hover,
.woobt-wrap a.button:hover,
.woobt-wrap button.button:hover {
	filter: brightness(1.18);
}

/* The "this product" highlighted row */
.woobt-wrap .woobt-product-this .woobt-title {
	color: var(--wct-text);
}

/* Loading state */
.woobt-wrap .woobt-loading {
	color: var(--wct-muted);
}

/* =====================================================================
 * Buy Now button
 * ===================================================================== */

.wpcbn-btn,
a.wpcbn-btn,
button.wpcbn-btn {
	display: inline-block;
	background: var(--wct-accent);
	color: var(--wct-btn-text);
	border: 0;
	border-radius: var(--wct-radius-sm);
	padding: 11px 22px;
	font-weight: 700;
	line-height: 1.4;
	cursor: pointer;
	text-decoration: none;
	transition: filter 0.2s ease, transform 0.2s ease;
}

.wpcbn-btn:hover,
a.wpcbn-btn:hover,
button.wpcbn-btn:hover {
	background: var(--wct-accent);
	color: var(--wct-btn-text);
	filter: brightness(1.18);
}

/* A secondary / outline variant when placed next to the main add-to-cart */
.wpcbn-btn.wpcbn-btn-outline {
	background: transparent;
	color: var(--wct-accent);
	box-shadow: inset 0 0 0 2px var(--wct-accent);
}

.wpcbn-btn.wpcbn-btn-outline:hover {
	background: var(--wct-accent);
	color: var(--wct-btn-text);
	filter: none;
}

/* =====================================================================
 * Smart Notifications — feed popups bottom corner
 * ===================================================================== */

.wpcsn-notification .wpcsn-item,
.wpcsn-item {
	background: var(--wct-card);
	color: var(--wct-text);
	font-family: var(--wct-font);
	border: 1px solid var(--wct-border);
	border-radius: var(--wct-radius);
	box-shadow: var(--wct-shadow);
}

.wpcsn-item a,
.wpcsn-item .wpcsn-title {
	color: var(--wct-text);
}

.wpcsn-item a:hover {
	color: var(--wct-accent);
}

.wpcsn-item .wpcsn-price,
.wpcsn-item .amount {
	color: var(--wct-accent);
	font-weight: 700;
}

.wpcsn-item .wpcsn-close {
	color: var(--wct-muted);
}

.wpcsn-item .wpcsn-close:hover {
	color: var(--wct-text);
}
