/* =========================================================================
   FFPombo — design tokens
   Extracted from Figma prototype "SV - UX-UI App / FFP — Diseño 11/25 [v2]"
   Frame size: 375 x 812 (iPhone X/11 Pro @1x). All px values are @1x.

   CONFIDENCE KEY
   [exact]  read from the prototype's accessibility layer (text, geometry)
   [close]  sampled from 1:1 screenshots — expect ±2 per channel
   [guess]  inferred; confirm with the designer before shipping
   ========================================================================= */

:root {
  /* ---- Neutrals -------------------------------------------------------- */
  --c-ink:            #1A1A1A;  /* [close] headings, body, active tab       */
  --c-ink-2:          #262626;  /* [close] dark buttons / bottom nav pill   */
  --c-muted:          #8A8A8A;  /* [close] secondary/meta copy              */
  --c-muted-2:        #6E6E6E;  /* [close] body copy on cream               */
  --c-hairline:       #E7E2DE;  /* [close] 1px dividers inside list cards   */
  --c-surface:        #FFFFFF;  /* [exact] cards                            */
  --c-bg:             #F6F2EF;  /* [close] app background (warm off-white)  */
  --c-bg-2:           #FAF7F4;  /* [close] reader background                */

  /* ---- Category: Legales / emergencia (orange) ------------------------- */
  --c-legal-hero:     #F5C29A;  /* [close] hero + header band               */
  --c-legal-row:      #F8DCC6;  /* [close] list-row fill inside hero card   */
  --c-legal-chip:     #F3C39C;  /* [close] "Legales" tag                    */

  /* ---- Category: Vitales (blue) ---------------------------------------- */
  --c-vital-hero:     #B9C9E4;  /* [close]                                  */
  --c-vital-row:      #DDE4F2;  /* [close]                                  */
  --c-vital-chip:     #C6CFF0;  /* [close] "Vida" tag                       */

  /* ---- Category: Económicas (teal) ------------------------------------- */
  --c-econ-hero:      #BFE3E5;  /* [close]                                  */
  --c-econ-row:       #D9EEF0;  /* [close]                                  */
  --c-econ-chip:      #CFE9EA;  /* [close]                                  */

  /* ---- Buttons --------------------------------------------------------- */
  --c-btn-primary-bg: #262626;  /* [close] */
  --c-btn-primary-fg: #FFFFFF;
  --c-btn-ghost-bg:   #EDE9E5;  /* [close] "Desactivar" / "Ahora no"        */
  --c-btn-ghost-fg:   #1A1A1A;

  /* ---- Dark mode (article reader only — frame 10) ---------------------- */
  --c-dark-bg:        #1A1A1A;  /* [close] */
  --c-dark-fg:        #F2EFEC;  /* [close] */
  --c-dark-muted:     #9A9A9A;  /* [close] */

  /* ---- Radii ----------------------------------------------------------- */
  --r-card:      16px;  /* [close] content cards, list cards               */
  --r-row:        0px;  /* rows inside a card are square; card clips them  */
  --r-pill:     999px;  /* [exact-ish] buttons, chips, bottom nav          */
  --r-sheet:     24px;  /* [close] bottom-sheet modals (top corners only)  */

  /* ---- Spacing scale (4pt) --------------------------------------------- */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px;
  --s-5: 20px; --s-6: 24px; --s-7: 32px; --s-8: 40px; --s-9: 56px;

  --gutter: 24px;       /* [exact] page side padding — text starts at x=24 */
  --card-pad: 16px;     /* [close] inner padding of list cards             */

  /* ---- Elevation ------------------------------------------------------- */
  --shadow-card:  0 1px 2px rgba(26,26,26,.04);            /* [guess]      */
  --shadow-nav:   0 4px 16px rgba(26,26,26,.12);           /* [close]      */
  --shadow-sheet: 0 -8px 32px rgba(26,26,26,.18);          /* [guess]      */

  /* ---- Typography ------------------------------------------------------ */
  /* The Figma file's typeface could not be read from a share-link prototype.
     Letterforms match the General Sans / Satoshi family. Plus Jakarta Sans is
     the closest free Google-hosted substitute and is what these files load.
     CONFIRM THE REAL FAMILY WITH THE DESIGNER BEFORE BUILD. [guess]        */
  --font: "General Sans", "Plus Jakarta Sans", -apple-system,
          BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* Sizes derived from measured text-block heights + 1:1 screenshots [close] */
  --t-display:    32px; --lh-display:   40px; --fw-display:   500;
  --t-h1:         28px; --lh-h1:        34px; --fw-h1:        500;
  --t-h2:         22px; --lh-h2:        28px; --fw-h2:        500;
  --t-h3:         17px; --lh-h3:        24px; --fw-h3:        500;
  --t-body:       15px; --lh-body:      24px; --fw-body:      400;
  --t-body-lg:    16px; --lh-body-lg:   26px;
  --t-label:      13px; --lh-label:     18px;
  --t-caption:    12px; --lh-caption:   16px;
  --t-tab:        11px; --lh-tab:       14px;
}
