/* ============================================================================
   SFC+ design tokens — lifted from the shipped app, not invented.

   Palette + type scale: talino-labs/sfc-plus-app → tamagui.config.ts
   Component hexes:      the same repo's home-screen components (see comments).
   Type:                 Work Sans, the faces the app bundles (assets/fonts).

   Geometry is in --geo-* below. Those numbers are the app's own constants, so
   the prototype lands where the device does instead of being eyeballed.
   ========================================================================= */

@font-face { font-family: 'Work Sans'; src: url('../fonts/WorkSans-Regular.ttf')  format('truetype'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Work Sans'; src: url('../fonts/WorkSans-Medium.ttf')   format('truetype'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Work Sans'; src: url('../fonts/WorkSans-SemiBold.ttf') format('truetype'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Work Sans'; src: url('../fonts/WorkSans-Bold.ttf')     format('truetype'); font-weight: 700; font-display: swap; }

:root {
  /* — brand (tamagui.config.ts customTokens.color) — */
  --c-prim: #FF3335;
  --c-prim-bg: #FFD3D3;
  --c-scnd: #FF6F0B;
  --c-scnd-bg: #FFE2CE;
  --c-succ: #10B981;
  --c-err: #EF4444;

  /* — the reds the home screen actually paints with — */
  --c-chrome: #FF0003;      /* Header.tsx + NavigationBar.tsx background */
  --c-section-title: #CC0002; /* ServicesButtons.tsx "EXPLORE THE APP" */
  --c-dot-active: #FF0E03;  /* ServicesButtons.tsx active page dot */

  /* — neutrals — */
  --c-n: #8F8F8F;
  --c-n10: #EBEBEB;
  --c-n50: #616161;
  --c-white: #FFFFFF;
  --c-arc: #F1F1F1;         /* HalfCircleBackground.tsx */
  --c-panel: #F6F6F6;       /* ServicesButtons.tsx filter pills + grid panel */
  --c-tab-idle: #F2F2F2;    /* RecentTransactionsAndRewards.tsx inactive tab */
  --c-sep: #E0E0E0;
  --c-dot-idle: #D1D5DB;

  /* — text — */
  --c-txt: #1D2433;         /* txtPrim */
  --c-txt-2: #4A505C;       /* txt2ry — also the "View all" link */
  --c-txt-heading: #333333; /* "Activity History" */
  --c-txt-tab-active: #5A5A5A;
  --c-txt-pill: #303030;
  --c-txt-meta: #8F8F8F;    /* transaction no. + timestamp */
  --c-points-up: #0F7706;   /* TransactionHistory.tsx, points > 0 */
  --c-points-down: #990002; /* TransactionHistory.tsx, points < 0 */

  /* — type — */
  --font: 'Work Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --fw-reg: 400; --fw-med: 500; --fw-semi: 600; --fw-bold: 700;

  /* — geometry, from the app's own constants — */
  --geo-screen-w: 430px;    /* iPhone 16 Pro Max logical viewport (the screenshots) */
  --geo-screen-h: 932px;
  --geo-card-top: 85px;     /* HalfCircleBackground.CARD_TOP / Header card offset */
  --geo-card-h: 170px;      /* HalfCircleBackground.CARD_HEIGHT */
  --geo-card-w: 85%;        /* TotalSukiPoints: window width * 0.85 */
  --geo-content-top: 200px; /* Home.tsx: ScrollView paddingTop */
  --geo-scroll-h: calc(var(--geo-screen-h) * 0.48); /* Home.tsx: inner ScrollView maxHeight={'48vh'} */
  --geo-nav-slant: 5px;     /* NavigationBar.SLANT */
  --geo-nav-bar: 62px;      /* NavigationBar.BAR_HEIGHT */
  --geo-nav-fab: 64px;      /* NavigationBar.CENTER_BUTTON_SIZE */
  --geo-nav-border: 6px;    /* NavigationBar.BUTTON_BORDER_WIDTH */
  --geo-gutter: 20px;       /* container = screen width − 40 */
  --geo-statusbar: 62px;    /* iOS top safe-area inset on this device */
  --geo-safe-bottom: 34px;  /* iOS home-indicator inset; the nav's red bleeds into it */
}
