/* Customer-first theme tokens. This guest bundle intentionally does not depend
 * on the staff AppShell or Theme Engine. Business/status colours stay fixed. */
.ipos-customer {
	--ipos-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--ipos-canvas: #f3f7f4;
	--ipos-surface: #ffffff;
	--ipos-surface-muted: #edf4ef;
	--ipos-ink: #17251d;
	--ipos-muted: #5d7165;
	--ipos-line: #d4e1d8;
	--ipos-line-strong: #adc5b6;
	--ipos-brand: #197a35;
	--ipos-action: #197a35;
	--ipos-action-hover: #12652a;
	--ipos-action-soft: #e6f3e9;
	--ipos-on-action: #ffffff;
	--ipos-focus: rgb(25 122 53 / 30%);
	--ipos-brand-text: #12652a;
	--ipos-brand-border: color-mix(in srgb, var(--ipos-brand) 24%, #d7d9d7);
	--ipos-brand-surface: color-mix(in srgb, var(--ipos-brand) 6%, #ffffff);
	--ipos-brand-shadow: color-mix(in srgb, var(--ipos-brand) 18%, transparent);
	--ipos-neutral-canvas: #f5f5f2;
	--ipos-neutral-surface: #ffffff;
	--ipos-neutral-surface-muted: #f0f1ef;
	--ipos-neutral-line: #d9dcda;
	--ipos-neutral-ink: #18201c;
	--ipos-neutral-muted: #68716c;
	--ipos-overlay: rgb(24 28 26 / 58%);
	--ipos-success: #197a35;
	--ipos-warning: #9a5b05;
	--ipos-danger: #b42318;
	--ipos-info: #285bb5;
	--ipos-success-soft: #e6f4e9;
	--ipos-warning-soft: #fff3d6;
	--ipos-danger-soft: #fff0ee;
	--ipos-info-soft: #eaf0ff;
	--ipos-canvas: var(--ipos-neutral-canvas);
	--ipos-surface: var(--ipos-neutral-surface);
	--ipos-surface-muted: var(--ipos-neutral-surface-muted);
	--ipos-ink: var(--ipos-neutral-ink);
	--ipos-muted: var(--ipos-neutral-muted);
	--ipos-line: var(--ipos-neutral-line);
	--ipos-line-strong: color-mix(in srgb, var(--ipos-neutral-ink) 28%, var(--ipos-neutral-line));
	width: 100%;
	color: var(--ipos-ink);
	font-family: var(--ipos-font);
}

.ipos-customer[data-ipos-palette="ocean"] {
	--ipos-brand: #147ba6;
	--ipos-action: #147ba6;
	--ipos-action-hover: #0d6288;
	--ipos-action-soft: #e3f2f8;
	--ipos-on-action: #ffffff;
	--ipos-focus: rgb(20 123 166 / 30%);
	--ipos-brand-text: #0d6288;
}

.ipos-customer[data-ipos-palette="indigo"] {
	--ipos-brand: #5f55bd;
	--ipos-action: #5f55bd;
	--ipos-action-hover: #4d439e;
	--ipos-action-soft: #eeecfa;
	--ipos-on-action: #ffffff;
	--ipos-focus: rgb(95 85 189 / 30%);
	--ipos-brand-text: #4d439e;
}

body.ipos-customer-document {
	background: var(--ipos-neutral-canvas, #f5f5f2);
}

.ipos-customer .ipos-ordering__toolbar {
	background: color-mix(in srgb, var(--ipos-canvas) 94%, transparent);
}

.ipos-customer .ipos-ordering__category-next {
	background: linear-gradient(90deg, transparent, var(--ipos-canvas) 42%);
}

.ipos-customer .ipos-ordering__category-shell.is-scrolled::before {
	background: linear-gradient(90deg, var(--ipos-canvas), transparent);
}

.ipos-customer .ipos-ordering__table,
.ipos-customer .ipos-ordering__cart-bar-icon {
	border-color: color-mix(in srgb, var(--ipos-action) 30%, var(--ipos-line));
	background: var(--ipos-action-soft);
}

.ipos-customer :where(
	.ipos-ordering__categories button.is-active,
	.ipos-product__media span,
	.ipos-product__body button:hover,
	.ipos-product__body button:active,
	.ipos-ordering__submit,
	.ipos-ordering__cart-bar em,
	.ipos-table-payment__actions button.is-primary
) {
	color: var(--ipos-on-action);
}

.ipos-customer :where(button, input, textarea):focus-visible {
	outline: 3px solid var(--ipos-focus);
	outline-offset: 2px;
}

@media (forced-colors: active) {
	.ipos-customer :where(button, input, textarea):focus-visible {
		outline-color: Highlight;
	}
}