/* ECZ Countdown – front end. Colours come from CSS variables set in Settings. */

.ecz-countdown {
	color: var(--ecz-text, #111);
	font-size: var(--ecz-size, 16px);
	line-height: 1.45;
	margin: 14px 0;
}
.ecz-countdown[hidden],
.ecz-bar[hidden] { display: none !important; }

.ecz-msg { margin: 0; }
.ecz-icon { margin-right: .35em; }
.ecz-msg strong { font-weight: 700; }

.ecz-timer {
	display: inline-flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .45em;
	vertical-align: middle;
	font-variant-numeric: tabular-nums;
}
.ecz-unit { white-space: nowrap; }
.ecz-num, .ecz-lbl { font-weight: 700; }

/* Style: boxes (matches the Shopify look) */
.ecz-style-boxes .ecz-timer-row { margin-top: 10px; }
.ecz-style-boxes .ecz-unit {
	display: inline-block;
	min-width: 2.8em;
	padding: .4em .6em;
	background: var(--ecz-box, #f6f6f6);
	color: var(--ecz-accent, #f7941d);
	border-radius: var(--ecz-radius, 4px);
	text-align: center;
}
.ecz-style-boxes .ecz-sep { font-weight: 700; }

/* Style: inline text – "Order within 01h 20m 51s" */
.ecz-style-inline .ecz-timer { gap: .3em; }
.ecz-style-inline .ecz-unit { color: var(--ecz-accent, #f7941d); }
.ecz-style-inline .ecz-sep { display: none; }

/* Style: banner – tinted box with an accent edge */
.ecz-style-banner {
	padding: .75em 1em;
	background: var(--ecz-box, #f6f6f6);
	border-left: 4px solid var(--ecz-accent, #f7941d);
	border-radius: var(--ecz-radius, 4px);
}
.ecz-style-banner .ecz-timer { gap: .3em; }
.ecz-style-banner .ecz-unit { color: var(--ecz-accent, #f7941d); }
.ecz-style-banner .ecz-sep { display: none; }

/* Contexts */
.ecz-ctx-loop { font-size: .82em; margin: 4px 0 8px; }
.ecz-ctx-minicart { font-size: .9em; margin: 8px 0; text-align: center; }
.ecz-ctx-cart, .ecz-ctx-checkout { margin: 0 0 16px; }

/* Site-wide notice bar */
.ecz-bar {
	position: relative;
	z-index: 9999;
	background: var(--ecz-bar-bg, #111);
	color: var(--ecz-bar-text, #fff);
	text-align: center;
	padding: 8px 44px;
	font-size: 14px;
}
.ecz-bar.is-sticky { position: sticky; top: 0; }
.ecz-bar .ecz-countdown { margin: 0; color: inherit; font-size: inherit; }
.ecz-bar-close {
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	background: none;
	border: 0;
	padding: 4px 8px;
	color: inherit;
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	opacity: .75;
}
.ecz-bar-close:hover, .ecz-bar-close:focus { opacity: 1; }

/* Thank-you page note */
.ecz-dispatch-note {
	margin: 0 0 20px;
	padding: .85em 1em;
	background: var(--ecz-box, #f6f6f6);
	border-left: 4px solid var(--ecz-accent, #f7941d);
	border-radius: var(--ecz-radius, 4px);
	color: var(--ecz-text, #111);
}

/* Admin-only debug box */
.ecz-debug {
	margin: 10px 0 16px;
	padding: 10px 12px;
	border: 2px dashed #c00;
	background: #fff8f8;
	color: #222;
	font-size: 13px;
	line-height: 1.6;
}
.ecz-debug code { font-size: 12px; background: #f1f1f1; padding: 1px 4px; }
