/* ============================================================
   Hoàng Sao — design tokens

   THE THEME OWNS THIS FILE. build.sh copies it into
   hoangsao-widgets/assets/css/fallback/tokens.css so the plugin can style
   itself when the theme is not active (Elementor editor previews, a half-done
   deploy). One source, never two hand-maintained copies — the workspace has
   already paid for that mistake once with a duplicated helper that drifted.

   Both sides register under the handle `hoangsao-tokens` behind a
   wp_style_is( …, 'registered' ) guard, so whichever loads first wins and the
   other is a no-op.
   ============================================================ */
:root{
  /* ---- Surfaces. The canvas is always one of these four inks. ---------- */
  --hs-bg:#0e0f11;        /* page canvas */
  --hs-surface:#16181b;   /* alternating section, form field background */
  --hs-card:#1b1e22;      /* cards, panels, dropdowns */
  --hs-elev:#22262b;      /* raised: chips, thumbs, icon tiles */
  --hs-deep:#0a0b0c;      /* below the canvas: utility bar, footer */

  /* ---- Type ------------------------------------------------------------ */
  --hs-text:#f4f2ee;      /* body copy on dark */
  --hs-muted:#9aa0a6;     /* captions, meta, secondary */
  --hs-dim:#d5d3ce;       /* long-form prose — lighter than muted, darker than text */
  --hs-line:#2a2e33;      /* borders, dividers */

  /* ---- The accent. One colour, and it is orange. -----------------------
     Round 3 of client review shipped a gold/orange split (gold chrome, orange
     text) and the client's answer was that the buttons and tags should be
     orange too. So there is exactly ONE accent family. The old --gold token
     was deleted rather than re-pointed: a token called --gold holding #ee6c19
     is a lie the next person has to debug.

     --hs-accent-ink is the type that sits ON an accent fill, and it stays a
     near-black brown rather than white. Measured against #ee6c19: white is
     3.09:1 and FAILS WCAG AA for a 14px bold button label, #1a1508 is 5.94:1
     and passes. On --hs-accent-2 it rises to 7.53:1.

     The accent itself passes AA for normal text on every surface above:
     4.92:1 on --hs-elev up to 6.37:1 on --hs-deep. */
  --hs-accent:#ee6c19;
  --hs-accent-2:#ff8438;   /* hover / lighter */
  --hs-accent-ink:#1a1508; /* type on an accent fill */

  /* ---- Semantic, not decorative ---------------------------------------
     --hs-felt is the billiards-cloth green, used for the "New" badge and the
     hotline dock. --hs-red is reserved for the "Hot" badge and error states:
     it is NOT a second accent. A red button beside an orange one reads as a
     printing error rather than a hierarchy, which is why .hs-btn has no red
     variant. */
  --hs-felt:#1f8a5b;
  --hs-red:#c8322f;

  /* ---- Type scale ------------------------------------------------------ */
  --hs-font:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",sans-serif;

  /* ---- Layout ---------------------------------------------------------- */
  --hs-maxw:1280px;       /* paired with $GLOBALS['content_width'] in setup.php */
  --hs-gutter:24px;

  /* ---- Chrome heights -------------------------------------------------
     Named because the home hero cancels them with a negative margin to become
     a true full-viewport slider, and a hardcoded 114px in two files would
     drift the first time the nav padding changed. All three are constants set
     by core.css below, not guesses. */
  --hs-ubar-h:39px;
  --hs-nav-h:75px;
  --hs-chrome-h:114px;

  /* ---- Motion ---------------------------------------------------------- */
  --hs-t:.2s;
  --hs-t-slow:.4s;

  /* ---- Elevation ------------------------------------------------------- */
  --hs-shadow-card:0 4px 16px rgba(0,0,0,.35);
  --hs-shadow-pop:0 24px 60px rgba(0,0,0,.5);
  --hs-shadow-modal:0 30px 90px rgba(0,0,0,.6);
}