/* ==========================================================================
   Openwood — Fluid Glass Components
   ========================================================================== */

/* Glass surfaces ----------------------------------------------------------- */
.glass-card {
	position: relative;
	background: var(--ow-glass-bg);
	-webkit-backdrop-filter: blur(var(--ow-glass-blur)) saturate(160%);
	backdrop-filter: blur(var(--ow-glass-blur)) saturate(160%);
	border: 1px solid var(--ow-glass-border);
	border-radius: var(--ow-radius);
	box-shadow: var(--ow-glass-shadow), var(--ow-glass-highlight);
}

/* Graceful fallback when backdrop-filter is unsupported */
@supports not ((-webkit-backdrop-filter: blur(2px)) or (backdrop-filter: blur(2px))) {
	.glass-card,
	.glass-chip { background: var(--ow-glass-bg-strong); }
}

.glass-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	background: var(--ow-glass-bg);
	-webkit-backdrop-filter: blur(calc(var(--ow-glass-blur) * 0.7)) saturate(150%);
	backdrop-filter: blur(calc(var(--ow-glass-blur) * 0.7)) saturate(150%);
	border: 1px solid var(--ow-glass-border);
	border-radius: var(--ow-radius-pill);
	box-shadow: var(--ow-glass-highlight);
	font-size: 0.85rem;
	font-weight: 500;
}

/* Ambient floating orbs --------------------------------------------------- */
.ow-bg-orbs {
	position: fixed;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	overflow: hidden;
}
.ow-bg-orbs .orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(60px);
	opacity: 0.5;
	animation: ow-float 18s var(--ow-ease) infinite alternate;
}
.orb-1 { width: 420px; height: 420px; top: -120px; left: -80px; background: radial-gradient(circle, var(--ow-accent), transparent 70%); }
.orb-2 { width: 360px; height: 360px; top: 30%; right: -120px; background: radial-gradient(circle, var(--ow-accent-soft), transparent 70%); animation-delay: -6s; }
.orb-3 { width: 300px; height: 300px; bottom: -100px; left: 40%; background: radial-gradient(circle, var(--ow-accent-2), transparent 70%); animation-delay: -12s; opacity: 0.35; }

@keyframes ow-float {
	0% { transform: translate3d(0,0,0) scale(1); }
	100% { transform: translate3d(40px, -30px, 0) scale(1.12); }
}

/* Buttons ----------------------------------------------------------------- */
.ow-btn,
.ow-products .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 13px 24px;
	font-family: var(--ow-font-body);
	font-weight: 600;
	font-size: 0.95rem;
	line-height: 1;
	border: 1px solid transparent;
	border-radius: var(--ow-radius-pill);
	cursor: pointer;
	transition: transform var(--ow-dur) var(--ow-ease), box-shadow var(--ow-dur) var(--ow-ease), background var(--ow-dur) var(--ow-ease), color var(--ow-dur) var(--ow-ease);
	text-align: center;
}

.ow-btn-primary,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce .single_add_to_cart_button,
.woocommerce .checkout-button {
	background: linear-gradient(135deg, var(--ow-accent), var(--ow-accent-2));
	color: #fff;
	box-shadow: 0 12px 26px -12px rgba(138, 90, 54, 0.7);
}
.ow-btn-primary:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce .single_add_to_cart_button:hover,
.woocommerce .checkout-button:hover {
	color: #fff;
	transform: translateY(-2px);
	box-shadow: 0 18px 36px -14px rgba(138, 90, 54, 0.85);
}

.ow-btn-ghost {
	background: var(--ow-glass-bg);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border-color: var(--ow-glass-border);
	color: var(--ow-ink);
}
.ow-btn-ghost:hover { transform: translateY(-2px); color: var(--ow-ink); background: var(--ow-glass-bg-strong); }

.ow-btn-block { width: 100%; }

/* Default WooCommerce buttons (non-alt) get glass treatment */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
	background: var(--ow-glass-bg-strong);
	color: var(--ow-ink);
	border-color: var(--ow-glass-border);
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover { transform: translateY(-2px); color: var(--ow-ink); }

/* Icon buttons ------------------------------------------------------------ */
.ow-icon-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid transparent;
	border-radius: 50%;
	background: transparent;
	color: var(--ow-ink);
	cursor: pointer;
	transition: background var(--ow-dur) var(--ow-ease), transform var(--ow-dur) var(--ow-ease);
}
.ow-icon-btn:hover { background: var(--ow-glass-bg); transform: translateY(-1px); }
.ow-icon { display: block; }

/* Cart count bubble */
.ow-cart-count {
	position: absolute;
	top: 4px;
	right: 2px;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--ow-accent);
	color: #fff;
	font-size: 0.68rem;
	font-weight: 700;
	border-radius: var(--ow-radius-pill);
	line-height: 1;
}
.ow-cart-count.is-empty { display: none; }

/* Badges ------------------------------------------------------------------ */
.ow-badge {
	display: inline-flex;
	align-items: center;
	padding: 5px 11px;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	border-radius: var(--ow-radius-pill);
	color: #fff;
}
.ow-badge-sale { background: var(--ow-danger); }
.ow-badge-new { background: var(--ow-success); }

/* Eyebrow ----------------------------------------------------------------- */
.ow-eyebrow {
	display: inline-block;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ow-accent-2);
	margin-bottom: var(--ow-space-2);
}

/* Reveal animation -------------------------------------------------------- */
[data-ow-reveal] {
	opacity: 0;
	transform: translateY(26px);
	transition: opacity 0.7s var(--ow-ease), transform 0.7s var(--ow-ease);
	will-change: opacity, transform;
}
[data-ow-reveal].is-visible { opacity: 1; transform: none; }

/* Trust badges ------------------------------------------------------------ */
.ow-trust-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: var(--ow-space-3);
}
.ow-trust-badge { color: var(--ow-ink); }
.ow-trust-badge .ow-icon { color: var(--ow-accent-2); }

/* Caret ------------------------------------------------------------------- */
.ow-caret {
	display: inline-block;
	width: 7px; height: 7px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg) translateY(-2px);
	transition: transform var(--ow-dur) var(--ow-ease);
	margin-left: 4px;
}

/* Modal ------------------------------------------------------------------- */
.ow-modal {
	position: fixed;
	inset: 0;
	z-index: var(--ow-z-modal);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: var(--ow-space-3);
}
.ow-modal[hidden] { display: none; }
.ow-modal-overlay {
	position: absolute;
	inset: 0;
	background: rgba(28, 26, 23, 0.45);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}
.ow-modal-panel {
	position: relative;
	width: min(640px, 100%);
	max-height: 86vh;
	overflow: auto;
	padding: var(--ow-space-5);
	background: var(--ow-glass-bg-strong);
	-webkit-backdrop-filter: blur(var(--ow-glass-blur)) saturate(160%);
	backdrop-filter: blur(var(--ow-glass-blur)) saturate(160%);
	border: 1px solid var(--ow-glass-border);
	border-radius: var(--ow-radius);
	box-shadow: var(--ow-glass-shadow-lg);
	animation: ow-pop var(--ow-dur) var(--ow-ease);
}
@keyframes ow-pop {
	from { opacity: 0; transform: translateY(14px) scale(0.98); }
	to { opacity: 1; transform: none; }
}
.ow-modal-close {
	position: absolute;
	top: 14px; right: 14px;
}

/* Toast ------------------------------------------------------------------- */
.ow-toast {
	position: fixed;
	bottom: 24px;
	left: 50%;
	transform: translateX(-50%) translateY(20px);
	z-index: var(--ow-z-toast);
	padding: 12px 20px;
	background: var(--ow-ink);
	color: #fff;
	border-radius: var(--ow-radius-pill);
	box-shadow: var(--ow-glass-shadow-lg);
	opacity: 0;
	transition: opacity var(--ow-dur) var(--ow-ease), transform var(--ow-dur) var(--ow-ease);
	pointer-events: none;
}
.ow-toast.is-visible { opacity: 1; transform: translateX(-50%) translateY(0); }