/* Geo language-suggestion bar. Fixed to the top; shown only after JS reveals it.
   WoodMart green palette to match the store. Coexists with the free-shipping bar
   by stacking above it; final z-index / offset vs the sticky header is confirmed
   during manual verification (Task 10). */
.lw-geo-bar {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 16px;
	background: #7ab38b;
	color: #ffffff;
	font-size: 15px;
	line-height: 1.3;
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.18);
	transform: translateY(-100%);
}
.lw-geo-bar[hidden] { display: none; }
.lw-geo-bar.lw-geo-in { transform: translateY(0); }

.lw-geo-bar__flag { font-size: 18px; line-height: 0; flex: 0 0 auto; display: flex; align-items: center; }
.lw-geo-bar__flagimg {
	display: block;
	height: 16px;
	width: auto;
	border-radius: 2px;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);  /* subtle outline so light-edged flags read on the green bar */
}

.lw-geo-bar__msg {
	margin: 0;
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.lw-geo-bar__go {
	flex: 0 0 auto;
	display: inline-block;
	padding: 7px 14px;
	min-height: 40px;
	box-sizing: border-box;
	background: #ffffff;
	color: #2f5d3f;
	font-weight: 600;
	text-decoration: none;
	border-radius: 4px;
	line-height: 26px;
}
.lw-geo-bar__go:hover { background: #eef6f0; }

/* WoodMart themes every <button> (grey #f3f3f3 box, dark 13px text) with rules that
   out-rank a plain class selector, so the reset below uses !important to force the
   dismiss control back to the bar's intended look: a big WHITE × on the green bar,
   no box. Tap target stays 40×40 — only the glyph grows. */
.lw-geo-bar__dismiss,
.lw-geo-bar__dismiss:hover,
.lw-geo-bar__dismiss:focus {
	flex: 0 0 auto;
	display: flex;               /* flex-center so the enlarged glyph sits dead-centre, never clips */
	align-items: center;
	justify-content: center;
	width: 40px;                 /* button/tap target unchanged */
	height: 40px;
	min-height: 0;
	padding: 0;
	margin: 0;
	background: transparent !important;   /* kill WoodMart's grey button box */
	border: 0 !important;
	box-shadow: none !important;
	color: #ffffff !important;            /* white × to match the bar text */
	font-size: 44px !important;           /* bigger × GLYPH only; &times; fills ~half its em box */
	font-weight: 300 !important;
	line-height: 1 !important;
	cursor: pointer;
	opacity: 0.9;
}
.lw-geo-bar__dismiss:hover { opacity: 1; }

/* Page offset while the bar is open is set inline by JS from the bar's measured
   height (document.documentElement.style.paddingTop). The lw-geo-open class on
   <html> is now just a JS state marker — no declarations needed here. */

@media (max-width: 480px) {
	.lw-geo-bar { font-size: 14px; gap: 8px; padding: 8px 12px; }
}

@media (prefers-reduced-motion: no-preference) {
	.lw-geo-bar { transition: transform 0.22s ease-out; }
}
