/* Mine Mirth Buy Now & Price Alerts — uses the theme's design tokens, so light/dark mode and colours follow the theme. */

/* "Buy it now" sits on its own row inside the purchase card, under quantity + Add to cart. */
.woocommerce div.product form.cart .mmbn-buy,
.mmbn-buy {
	flex: 1 1 100%;
	width: 100%;
	min-height: 52px;
	gap: .55em;
	font-size: 1rem;
}
.mmbn-buy .mm-icon { width: 1.15em; height: 1.15em; }
.mmbn-buy--contrast {
	color: var(--mm-bg, #fff);
	background: var(--mm-text, #0f172a);
	border-color: var(--mm-text, #0f172a);
	box-shadow: 0 1px 2px rgb(0 0 0 / .08), 0 10px 26px -14px rgb(0 0 0 / .45);
}
.mmbn-buy--contrast:hover,
.mmbn-buy--contrast:focus-visible {
	color: var(--mm-bg, #fff);
	background: color-mix(in srgb, var(--mm-text, #0f172a) 84%, var(--mm-primary, #35a8f6));
	border-color: color-mix(in srgb, var(--mm-text, #0f172a) 84%, var(--mm-primary, #35a8f6));
}
.mmbn-buy:hover .mm-icon { transform: scale(1.12) rotate(-8deg); }
.mmbn-buy.is-disabled { opacity: .55; }
.mmbn-buy.is-loading { pointer-events: none; opacity: .75; }

/* Price alert box — same shape as the theme's "Host this miner" box. */
.mmbn-alert {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	margin: -8px 0 14px;
	border-radius: calc(var(--mm-radius, 16px) * .8);
	border: 1px solid var(--mm-border, #d9e4ef);
	background: var(--mm-surface, #fff);
	transition: border-color .25s, box-shadow .35s, transform .35s cubic-bezier(.2, .8, .2, 1);
}
.mmbn-alert:hover,
.mmbn-alert.is-open { border-color: var(--mm-primary-line, #9fd3fb); }
.mmbn-alert__toggle {
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	padding: 14px 16px;
	border: 0;
	background: transparent;
	color: var(--mm-text, #0f172a);
	font: inherit;
	text-align: left;
	cursor: pointer;
	border-radius: inherit;
}
.mmbn-alert__toggle:focus-visible { outline: 2px solid var(--mm-primary, #35a8f6); outline-offset: -3px; }
.mmbn-alert__icon {
	position: relative;
	display: grid;
	place-items: center;
	flex: none;
	width: 36px;
	height: 36px;
	border-radius: 10px;
	background: var(--mm-primary-soft, #e6f4fe);
	color: var(--mm-primary, #35a8f6);
}
.mmbn-alert__icon svg { width: 20px; height: 20px; }
.mmbn-alert.is-watching .mmbn-alert__icon { background: var(--mm-primary, #35a8f6); color: var(--mm-on-primary, #04121f); }
.mmbn-alert__text { flex: 1; min-width: 0; }
.mmbn-alert__text strong { display: block; font-size: .92rem; }
.mmbn-alert__text small { display: block; font-size: .8rem; color: var(--mm-muted, #64748b); }
.mmbn-alert__chev { margin-left: auto; color: var(--mm-primary, #35a8f6); display: inline-flex; transition: transform .25s; }
.mmbn-alert__chev .mm-icon { width: 18px; height: 18px; }
.mmbn-alert.is-open .mmbn-alert__chev { transform: rotate(180deg); }
.mmbn-alert__form { padding: 0 16px 16px; }
.mmbn-alert [hidden] { display: none !important; }
.mmbn-alert__row { display: flex; gap: 10px; }
.mmbn-alert__row input[type="email"] {
	flex: 1;
	min-width: 0;
	height: 46px;
	padding: 0 14px;
	border-radius: var(--mm-btn-radius, 999px);
	border: 1px solid var(--mm-border, #d9e4ef);
	background: var(--mm-bg, #f4f8fc);
	color: var(--mm-text, #0f172a);
	font: inherit;
	font-size: .95rem;
}
.mmbn-alert__row input[type="email"]:focus { outline: none; border-color: var(--mm-primary, #35a8f6); box-shadow: 0 0 0 3px var(--mm-primary-soft, #e6f4fe); }
.mmbn-alert__row .mm-btn { --h: 46px; flex: none; }
.mmbn-alert__fine { margin: 8px 2px 0; font-size: .75rem; color: var(--mm-muted, #64748b); }
.mmbn-alert__msg { margin: 8px 2px 0; font-size: .85rem; font-weight: 600; }
.mmbn-alert__msg:empty { display: none; }
.mmbn-alert__msg.is-ok { color: var(--mm-success, #16a34a); }
.mmbn-alert__msg.is-error { color: var(--mm-danger, #dc2626); }
.mmbn-alert__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 480px) {
	.mmbn-alert__row { flex-direction: column; }
	.mmbn-alert__row .mm-btn { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
	.mmbn-buy:hover .mm-icon, .mmbn-alert__chev { transition: none; transform: none; }
}

/* ---------------------------------------------------------------------------
 * Attention animation for "Get price alerts"
 * 1. Glides in when it scrolls into view.  2. A light sweep crosses it, the bell rings and a soft
 * ring pulses from the icon.  3. While it stays on screen, a gentle nudge repeats every few seconds
 * until the visitor interacts.  Respects "reduce motion".
 * ------------------------------------------------------------------------- */
.mmbn-alert__icon svg { transform-origin: 50% 8%; }
.mmbn-alert__icon::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	box-shadow: 0 0 0 0 color-mix(in srgb, var(--mm-primary, #35a8f6) 55%, transparent);
	pointer-events: none;
}
.mmbn-alert::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(100deg, transparent 20%, color-mix(in srgb, var(--mm-primary, #35a8f6) 16%, transparent) 45%, color-mix(in srgb, var(--mm-primary, #35a8f6) 6%, transparent) 55%, transparent 80%);
	transform: translateX(-110%);
	pointer-events: none;
}
.mmbn-alert:hover { transform: translateY(-2px); box-shadow: 0 14px 34px -18px color-mix(in srgb, var(--mm-primary, #35a8f6) 70%, transparent); }

/* Hidden only while waiting to enter (scripts on). Falls back to visible after 4s no matter what. */
.mmbn-js .mmbn-alert:not(.is-in):not(.is-shown) { opacity: 0; transform: translateY(16px) scale(.985); animation: mmbn-show 0s 4s forwards; }
.mmbn-alert.is-in { animation: mmbn-enter .75s cubic-bezier(.2, .8, .2, 1) backwards; }
.mmbn-alert.is-in::before { animation: mmbn-sweep 1.3s .45s cubic-bezier(.4, 0, .2, 1) both; }
.mmbn-alert.is-in .mmbn-alert__icon { animation: mmbn-pop .6s .35s cubic-bezier(.3, 1.6, .5, 1) both; }
.mmbn-alert.is-in .mmbn-alert__icon svg { animation: mmbn-bell 1.1s .7s ease-in-out both; }
.mmbn-alert.is-in .mmbn-alert__icon::after { animation: mmbn-ripple 1.6s .75s ease-out 2; }
.mmbn-alert.is-in .mmbn-alert__chev { animation: mmbn-chev 1.2s 1.2s ease-in-out 2; }

/* Repeating gentle nudge (class re-added by script). */
.mmbn-alert.is-nudge { animation: mmbn-glow 1.8s ease-in-out; }
.mmbn-alert.is-nudge::before { animation: mmbn-sweep 1.3s cubic-bezier(.4, 0, .2, 1) both; }
.mmbn-alert.is-nudge .mmbn-alert__icon svg { animation: mmbn-bell 1.1s .15s ease-in-out both; }
.mmbn-alert.is-nudge .mmbn-alert__icon::after { animation: mmbn-ripple 1.6s .2s ease-out; }

/* Resting state after the entrance: hover rings the bell. */
.mmbn-alert.is-shown:hover .mmbn-alert__icon svg { animation: mmbn-bell .9s ease-in-out; }

/* Calm once they've opened it or signed up. */
.mmbn-alert.is-open .mmbn-alert__chev,
.mmbn-alert.is-watching .mmbn-alert__chev { animation: none; }

@keyframes mmbn-show { to { opacity: 1; transform: none; } }
@keyframes mmbn-enter {
	from { opacity: 0; transform: translateY(16px) scale(.985); box-shadow: 0 0 0 0 transparent; }
	60% { box-shadow: 0 0 0 4px color-mix(in srgb, var(--mm-primary, #35a8f6) 18%, transparent), 0 16px 36px -20px color-mix(in srgb, var(--mm-primary, #35a8f6) 80%, transparent); border-color: var(--mm-primary, #35a8f6); }
	to { opacity: 1; transform: none; }
}
@keyframes mmbn-sweep { from { transform: translateX(-110%); } to { transform: translateX(110%); } }
@keyframes mmbn-pop { from { transform: scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes mmbn-bell {
	0%, 100% { transform: rotate(0); }
	12% { transform: rotate(18deg); }
	26% { transform: rotate(-15deg); }
	40% { transform: rotate(11deg); }
	54% { transform: rotate(-7deg); }
	68% { transform: rotate(4deg); }
	82% { transform: rotate(-2deg); }
}
@keyframes mmbn-ripple {
	from { box-shadow: 0 0 0 0 color-mix(in srgb, var(--mm-primary, #35a8f6) 55%, transparent); }
	to { box-shadow: 0 0 0 14px color-mix(in srgb, var(--mm-primary, #35a8f6) 0%, transparent); }
}
@keyframes mmbn-chev { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(3px); } }
@keyframes mmbn-glow {
	0%, 100% { border-color: var(--mm-border, #d9e4ef); box-shadow: 0 0 0 0 transparent; }
	45% { border-color: var(--mm-primary, #35a8f6); box-shadow: 0 0 0 4px color-mix(in srgb, var(--mm-primary, #35a8f6) 14%, transparent); }
}

@media (prefers-reduced-motion: reduce) {
	.mmbn-js .mmbn-alert:not(.is-in):not(.is-shown) { opacity: 1; transform: none; animation: none; }
	.mmbn-alert, .mmbn-alert::before, .mmbn-alert *, .mmbn-alert *::after { animation: none !important; }
	.mmbn-alert:hover { transform: none; }
}