:root {
  --stret-blue: #0052cc;
  --stret-navy: #0b1c30;
  --stret-bg: #f8f9ff;
  --stret-line: #c3c6d6;
  --stret-muted: #434654;
  --stret-green: #6bff8f;
  /* Aliases used by the legacy landing and catering styles. */
  --navy: var(--stret-navy);
  --blue: var(--stret-blue);
  --blue-d: #003d9b;
  --green: #006e2f;
  --ink: var(--stret-navy);
  --mut: var(--stret-muted);
  --muted: var(--stret-muted);
  --bg: var(--stret-bg);
  --line: var(--stret-line);
}

/* One UI type system for POS, catering and the public site. */
html, body, button, input, select, textarea {
  font-family: Inter, "Noto Sans SC", "Microsoft YaHei", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif !important;
}

body { color: var(--stret-navy); }
button, input, select, textarea { letter-spacing: 0; }

/* Keep the same focus treatment and rounded language controls everywhere. */
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--stret-blue) 28%, transparent);
  outline-offset: 2px;
}

.site-language-toggle { display: inline-flex; align-items: center; gap: 3px; border: 1px solid var(--stret-line); border-radius: 999px; padding: 3px; background: #fff; }
.site-language-toggle button { border: 0; border-radius: 999px; background: transparent; color: var(--stret-navy); padding: 5px 10px; cursor: pointer; }
.site-language-toggle button.active { background: var(--stret-blue); color: #fff; }
