/* =================================================================
   BYO POS — Design System (tokens only)
   Be Your Own Coffee & Bar  ·  Deep Green / Gold / Cream  ·  Kanit
   ► โทนสว่างเป็น default (เข้าชุดจอ Bar) · body.dark = โหมดมืด (theme.js สลับ)
   ================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@400;500;600;700&family=Oswald:wght@500;600;700&family=Playfair+Display:wght@500;600;700&family=Space+Mono:wght@400;700&display=swap');

:root{
  /* --- surfaces (ค่าคงที่อ้างอิง) --- */
  --green-deep:#073D2E; --green-dark:#052B22; --green-darker:#04201A;
  --green-line:rgba(255,247,232,.10);
  --cream:#FFF7E8; --cream-soft:#F7E8C8;

  /* --- gold + action (เหลือง = ปุ่มสั่ง) --- */
  --gold:#D9A441; --gold-light:#F3C76A; --gold-deep:#B5832B;
  --action:#ECB73E; --action-deep:#CE9A2A; --action-ink:#06281D;

  /* --- earth / text / status --- */
  --coffee:#7A4A24; --text-dark:#1F1A14; --text-muted:#5E5340; --muted-green:#D2C4A4;
  --ready:#2ECC71; --partial:#E98B2A; --cancel:#D9534F; --blue:#5B8DEF;

  /* --- type --- */
  --f-brand:'Playfair Display',serif;
  --f-name:'Oswald','Kanit',sans-serif;   /* ชื่อบนบัตรสมาชิก — ละติน Oswald · ไทย fallback Kanit */
  --f-ui:'Kanit',sans-serif;
  --f-mono:'Space Mono','Kanit',monospace;

  /* --- radius / shadow --- */
  --r-sm:12px; --r-md:16px; --r-lg:22px;
  --shadow-card:0 8px 24px rgba(40,30,15,.12); --shadow-pop:0 18px 48px rgba(20,15,5,.25);

  /* ===== FLIP SURFACES — default = LIGHT (เข้าชุดจอ Bar) ===== */
  --app-bg:#F4F1EA; --app-ink:#1A1712; --app-ink-soft:#544B3C;
  --app-line:rgba(7,61,46,.45); --app-surface:#FFFFFF; --app-surface-2:#F0ECE2;
  --app-glass:rgba(7,61,46,.05); --app-glass-line:rgba(7,61,46,.30);
}

/* ===== DARK MODE (เขียวเข้มทั้งจอ — theme.js เติม class .dark ที่ body) ===== */
body.dark{
  --app-bg:#04201A; --app-ink:#FFF7E8; --app-ink-soft:#D2C4A4;
  --app-line:rgba(243,199,106,.30); --app-surface:rgba(255,247,232,.05); --app-surface-2:rgba(4,32,26,.5);
  --app-glass:rgba(255,247,232,.07); --app-glass-line:rgba(255,247,232,.12);
  --shadow-card:0 8px 24px rgba(0,0,0,.28); --shadow-pop:0 18px 48px rgba(0,0,0,.40);
}