/* ---------------------------------------------------------------------------
   tokens.css — Digicel design tokens + the ArenaGames gaming accent.

   Colour ramps, radii and shadows are taken from digicelgroup.com's own
   stylesheet so this app matches the brand exactly. The purple->magenta
   gradient is ArenaGames' own and is reserved for game furniture: coins,
   score boosters and the token card. Everything else is Digicel red on the
   indigo-navy neutral ramp.
   --------------------------------------------------------------------------- */

:root {
  /* Digicel brand red */
  --brand-50:  #fef5f6;
  --brand-100: #fde2e4;
  --brand-300: #f9aab1;
  --brand-400: #f14b5a;
  --brand-500: #e4022b;   /* primary */
  --brand-600: #d90229;   /* hover */
  --brand-700: #cf0227;   /* active */

  /* Digicel neutrals — an indigo-navy ramp, not a grey one */
  --gray-50:  #f8f8fc;
  --gray-100: #efeff6;
  --gray-200: #c9c6d9;
  --gray-300: #b2aec8;
  --gray-400: #9c97b8;
  --gray-500: #8580a7;
  --gray-600: #6f6a97;
  --gray-700: #595587;
  --gray-800: #434077;
  --gray-900: #2c2d67;    /* body text */
  --gray-950: #0f1b58;    /* headings */

  /* Status */
  --success-50:  #ecfdf3;
  --success-600: #079455;
  --warning-50:  #fffaeb;
  --warning-500: #f79009;
  --warning-700: #b54708;
  --error-50:    #fef3f2;
  --error-600:   #d92d20;
  --info-50:     #eff8ff;
  --info-600:    #1570ef;

  /* Surfaces */
  --bg:         #ffffff;
  --bg-sunken:  var(--gray-100);
  --border:     var(--gray-200);

  --radius-sm:   .25rem;
  --radius-md:   .375rem;
  --radius-lg:   .5rem;
  --radius-xl:   .75rem;
  --radius-2xl:  1rem;
  --radius-full: 9999px;

  --shadow-xs: 0 1px 2px #0a0d120d;
  --shadow-sm: 0 1px 3px #0a0d121a, 0 1px 2px #0a0d120f;
  --shadow-md: 0 4px 8px -2px #0a0d121a, 0 2px 4px -2px #0a0d120f;

  /* ArenaGames gaming accent — coins, boosters, token card. Nothing else. */
  --accent-grad: linear-gradient(90deg, #743ad5, #d53a9d);
  --accent-500:  #9333c9;
  --coin:        #f7b709;

  /* Layout */
  --topbar-h:    56px;
  --bottomnav-h: 60px;
  --maxw:        560px;

  --font-display:  "hurmeBold", "hurmeBold Fallback", Arial, sans-serif;
  --font-semibold: "hurmeSemibold", "hurmeSemibold Fallback", Arial, sans-serif;
  --font-body:     "hurmeRegular", "hurmeRegular Fallback", -apple-system,
                   BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --font-black:    "hurmeBlack", "hurmeBlack Fallback", Arial, sans-serif;
}

/* ---------------------------------------------------------------------------
   Hurme Geometric Sans 2 — Digicel's licensed brand face.

   The .woff2 files are NOT in this repo. Drop them into assets/fonts/ with the
   filenames below and headings switch over automatically. Until then the
   "* Fallback" faces render Arial with Digicel's own ascent/descent/size-adjust
   metrics, so the layout is already correct and swapping the real font in
   causes no reflow.

   Paths are relative to this stylesheet on purpose — they resolve correctly no
   matter which directory the app is installed in.
   --------------------------------------------------------------------------- */

@font-face {
  font-family: hurmeRegular;
  src: url(../fonts/HurmeGeometricSans2_Regular.woff2) format("woff2");
  font-weight: 400; font-display: swap;
}
@font-face {
  font-family: "hurmeRegular Fallback";
  src: local(Arial);
  ascent-override: 90.88%; descent-override: 23.92%;
  line-gap-override: 0%;   size-adjust: 104.54%;
}

@font-face {
  font-family: hurmeSemibold;
  src: url(../fonts/HurmeGeometricSans2_SemiBold.woff2) format("woff2");
  font-weight: 600; font-display: swap;
}
@font-face {
  font-family: "hurmeSemibold Fallback";
  src: local(Arial);
  ascent-override: 88.12%; descent-override: 23.19%;
  line-gap-override: 0%;   size-adjust: 107.81%;
}

@font-face {
  font-family: hurmeBold;
  src: url(../fonts/HurmeGeometricSans2_Bold.woff2) format("woff2");
  font-weight: 700; font-display: swap;
}
@font-face {
  font-family: "hurmeBold Fallback";
  src: local(Arial);
  ascent-override: 88.17%; descent-override: 23.2%;
  line-gap-override: 0%;   size-adjust: 107.75%;
}

@font-face {
  font-family: hurmeBlack;
  src: url(../fonts/HurmeGeometricSans2_Black.woff2) format("woff2");
  font-weight: 900; font-display: swap;
}
@font-face {
  font-family: "hurmeBlack Fallback";
  src: local(Arial);
  ascent-override: 85.85%; descent-override: 22.59%;
  line-gap-override: 0%;   size-adjust: 110.66%;
}