/* myanas: WhatsApp floating button + "Order on WhatsApp" buttons. */
:root { --wa: #0b7a4b; --wa-hover: #096640; --wa-fab: #1ea952; --wa-fab-hover: #178a42; }

/* ---------- Floating button ---------- */
.myanas-wa-fab {
	position: fixed; z-index: 75; bottom: calc(var(--nav-h, 0px) + 84px);
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; border-radius: 50%; padding: 0;
	background: var(--wa-fab); color: #fff; text-decoration: none;
	box-shadow: 0 4px 14px rgba(0, 0, 0, .26), 0 0 0 2px rgba(255, 255, 255, .9);
	opacity: 0; transition: opacity .25s ease, transform .15s ease;
	touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; cursor: grab;
	-webkit-tap-highlight-color: transparent;
}
.myanas-wa-fab--right { right: 14px; }
.myanas-wa-fab--left { left: 14px; }
.myanas-wa-fab.is-ready { opacity: 1; }
.myanas-wa-fab:hover { background: var(--wa-fab-hover); color: #fff; }
.myanas-wa-fab:focus-visible { outline: 3px solid #fff; outline-offset: 2px; box-shadow: 0 0 0 6px var(--wa-fab); }
.myanas-wa-fab.is-dragging { cursor: grabbing; transform: scale(1.08); transition: none; }
.myanas-wa-fab .myanas-wa-icon { pointer-events: none; width: 24px; height: 24px; }
/* Once moved, the script positions it with left/top. */
.myanas-wa-fab.is-placed { right: auto; bottom: auto; }

@media (min-width: 921px) {
	/* No bottom nav here; sit above the floating cart bar (bottom-right). */
	.myanas-wa-fab { bottom: 96px; }
}
@media print { .myanas-wa-fab { display: none !important; } }
@media (prefers-reduced-motion: reduce) { .myanas-wa-fab { transition: none; } }

/* ---------- Order on WhatsApp (cart / checkout / thank you) ---------- */
.myanas-wa-order { margin: 12px 0 0; width: 100%; }
.myanas-wa-order__btn {
	display: flex; align-items: center; justify-content: center; gap: 10px; box-sizing: border-box; width: 100%;
	padding: 14px 18px; border-radius: 14px; border: 0; background: var(--wa); color: #fff;
	font-weight: 700; font-size: 1rem; line-height: 1.2; text-decoration: none; text-align: center; cursor: pointer;
	box-shadow: 0 8px 20px rgba(11, 122, 75, .28); transition: background-color .15s ease, transform .15s ease;
}
.myanas-wa-order__btn:hover, .myanas-wa-order__btn:focus-visible { background: var(--wa-hover); color: #fff; }
.myanas-wa-order__btn:active { transform: translateY(1px); }
.myanas-wa-order__btn:focus-visible { outline: 3px solid var(--wa); outline-offset: 2px; }
.myanas-wa-order__hint { margin: 8px 0 0; font-size: .8rem; line-height: 1.4; opacity: .75; text-align: center; }
.myanas-wa-order__err { margin: 8px 0 0; padding: 8px 10px; border-radius: 10px; font-size: .85rem; line-height: 1.4; color: #8a1c1c; background: #fdecec; border: 1px solid #f3b9b9; }
.myanas-wa-order__err[hidden] { display: none; }
.myanas-wa-order--thanks { max-width: 420px; margin: 18px 0; }
/* Button text must stay solid white: theme/WooCommerce link rules (a, a:visited, .woocommerce a) were able to override it. */
.myanas-wa-order a.myanas-wa-order__btn,
.myanas-wa-order a.myanas-wa-order__btn:link,
.myanas-wa-order a.myanas-wa-order__btn:visited,
.myanas-wa-order a.myanas-wa-order__btn:hover,
.myanas-wa-order a.myanas-wa-order__btn:focus,
.myanas-wa-order a.myanas-wa-order__btn:active { color: #fff !important; text-decoration: none; opacity: 1; }
.myanas-wa-order a.myanas-wa-order__btn span { color: #fff !important; font-weight: 800; font-size: 1.05rem; letter-spacing: .01em; text-shadow: 0 1px 1px rgba(0, 0, 0, .18); }
.myanas-wa-order a.myanas-wa-order__btn svg { color: #fff; fill: currentColor; flex: none; }
.myanas-wa-order--thanks .myanas-wa-order__hint { opacity: 1; color: var(--text-secondary, #4b5563); font-weight: 500; }
.myanas-wa-order--block { margin-top: 12px; }
.myanas-wa-order--product { margin-top: 12px; }

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .myanas-wa-order__err { color: #ffd3d3; background: #3a1616; border-color: #6b2a2a; }
}
:root[data-theme="dark"] .myanas-wa-order__err { color: #ffd3d3; background: #3a1616; border-color: #6b2a2a; }

/* ---------- Call + Confirm on WhatsApp row (order received) ---------- */
:root { --call: #1769e0; --call-soft: #e8f1fe; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --call: #6aa8ff; --call-soft: #14233d; } }
:root[data-theme="dark"] { --call: #6aa8ff; --call-soft: #14233d; }
.myanas-wa-order__row { display: flex; align-items: stretch; gap: 8px; width: 100%; }
.myanas-wa-order__row .myanas-wa-order__btn { width: auto; flex: 1 1 0; min-width: 0; }
.myanas-wa-order__row .myanas-wa-order__btn--call { flex: 0 0 auto; padding-left: 18px; padding-right: 18px; }
.myanas-wa-order .myanas-wa-order__btn--call,
.myanas-wa-order a.myanas-wa-order__btn--call:link,
.myanas-wa-order a.myanas-wa-order__btn--call:visited { background: var(--call-soft); border: 2px solid var(--call); box-shadow: none; color: var(--call) !important; }
.myanas-wa-order a.myanas-wa-order__btn--call span { color: var(--call) !important; text-shadow: none; }
.myanas-wa-order a.myanas-wa-order__btn--call svg { color: var(--call); fill: none; }
.myanas-wa-order a.myanas-wa-order__btn--call:hover,
.myanas-wa-order a.myanas-wa-order__btn--call:focus-visible { background: var(--call); color: #fff !important; }
.myanas-wa-order a.myanas-wa-order__btn--call:hover span,
.myanas-wa-order a.myanas-wa-order__btn--call:focus-visible span { color: #fff !important; }
.myanas-wa-order a.myanas-wa-order__btn--call:hover svg,
.myanas-wa-order a.myanas-wa-order__btn--call:focus-visible svg { color: #fff; }
@media (max-width: 400px) {
	.myanas-wa-order__row { gap: 6px; }
	.myanas-wa-order__row .myanas-wa-order__btn { padding: 12px 10px; gap: 6px; }
	.myanas-wa-order__row .myanas-wa-order__btn--call { padding-left: 12px; padding-right: 12px; }
	.myanas-wa-order__row a.myanas-wa-order__btn span { font-size: .9rem; }
}