/* TFT Store design tokens — shared by every page on both servers (served at /ui/theme.css).
   Direction: modern luxury. Ivory paper, ink text, deep emerald as the brand colour,
   champagne gold used only for hairline accents. Serif for display, sans for UI. */
:root {
  --emerald: #1E4636;      /* brand: primary buttons, active states */
  --emerald-deep: #13301F; /* hero / back-office surfaces */
  --emerald-soft: #EDF1EC; /* quiet fills, image placeholders */
  --gold: #B08D57;         /* hairlines, eyebrows, badge */
  --gold-soft: #D9C7A4;
  --ink: #131513;
  --bg: #F8F6F1;           /* ivory */
  --card: #FFFFFF;
  --muted: #8A8C85;
  --line: #E7E3DA;
  --red: #A8323A;

  /* aliases used by older page CSS */
  --green: var(--emerald);
  --green-dark: var(--emerald);
  --forest: var(--emerald-deep);
  --leaf-soft: var(--emerald-soft);
  --text: var(--ink);
  --dark: var(--ink);
  --header: var(--emerald);
  --header-bo: var(--emerald-deep);

  --sans: "IBM Plex Sans Thai", "Noto Sans Thai", system-ui, sans-serif;
  --serif: "Noto Serif Thai", Georgia, serif;
  --radius: 16px;
  --shadow: 0 1px 2px rgba(19,21,19,.04), 0 8px 24px rgba(19,21,19,.06);
}

html { -webkit-font-smoothing: antialiased; }
body { background: var(--bg); color: var(--ink); font-family: var(--sans); }
.brand, .serif { font-family: var(--serif); }
.eyebrow { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--gold); font-weight: 600; }