/* ============================================================
   LocalBiz Design Tokens
   Single source of truth for colors, type, spacing & radius.
   Purely additive — existing styles keep working. Migrate
   screens to these variables incrementally.
   ============================================================ */
:root {
    /* ── Brand (JustDial-style orange) ─────────── */
    --c-primary:        #ea580c;
    --c-primary-hover:  #c2410c;
    --c-primary-dark:   #9a3412;
    --c-primary-light:  #fff7ed;

    /* ── Semantic ──────────────────────────────── */
    --c-success:        #16a34a;
    --c-success-light:  #dcfce7;
    --c-warning:        #f59e0b;
    --c-warning-light:  #fef3c7;
    --c-danger:         #dc2626;
    --c-danger-light:   #fee2e2;
    --c-info:           #0369a1;
    --c-info-light:     #e0f2fe;

    /* ── Neutrals (slate) ──────────────────────── */
    --c-text:           #0f172a;  /* headings / primary text */
    --c-text-muted:     #64748b;  /* secondary text         */
    /* #94a3b8 measured 2.56:1 on white -- below WCAG's 3:1 floor for any
       text at all, let alone the 4.5:1 body text needs. It was being used
       for listing descriptions, which is reading matter, not decoration.
       #78849b is 3.77:1: still clearly the quietest of the three, but
       legible on a phone in daylight. Content that must be read uses
       --c-text-muted (4.76:1); this stays for placeholders and hints. */
    --c-text-faint:     #78849b;  /* hints / placeholders   */
    --c-border:         #e2e8f0;
    --c-border-strong:  #cbd5e1;
    --c-surface:        #ffffff;  /* cards                  */
    --c-surface-alt:    #f8fafc;  /* subtle fills           */
    --c-bg:             #f1f5f9;  /* page background        */

    /* ── Typography scale ──────────────────────── */
    /* 11 — badges, chips, counts. Added because views were reaching for
       .6/.65/.68/.7rem some 240 times to get "smaller than xs", each a
       slightly different smaller. One step is enough. */
    --fs-2xs:  0.6875rem; /* 11 — badges, chips      */
    --fs-xs:   0.75rem;   /* 12 — captions, labels   */
    --fs-sm:   0.875rem;  /* 14 — secondary text     */
    --fs-base: 1rem;      /* 16 — body               */
    --fs-lg:   1.125rem;  /* 18 — subheads           */
    --fs-lg2:  1.25rem;   /* 20 — card titles        */
    --fs-xl:   1.5rem;    /* 24 — section titles     */
    --fs-2xl:  2rem;      /* 32 — page titles        */

    --fw-normal:   400;
    --fw-medium:   500;
    --fw-semibold: 600;
    --fw-bold:     700;

    /* ── Spacing (4px base) ────────────────────── */
    --space-1: 0.25rem;   /* 4  */
    --space-2: 0.5rem;    /* 8  */
    --space-3: 0.75rem;   /* 12 */
    --space-4: 1rem;      /* 16 */
    --space-5: 1.5rem;    /* 24 */
    --space-6: 2rem;      /* 32 */

    /* ── Radius ────────────────────────────────── */
    --radius-sm:   6px;
    --radius:      10px;
    --radius-lg:   14px;
    --radius-pill: 999px;

    /* ── Elevation ─────────────────────────────────
       Four levels, and nothing between them. A shadow's job is to say
       how far off the page something sits; 31 hand-written variations
       said nothing at all. Every shadow is the same slate hue as the
       text, so raised things read as lifted paper rather than smudged.
       --shadow-up is the same weight as --shadow, thrown upward, for
       bars docked to the bottom of the screen.                       */
    --shadow-sm:   0 1px 4px rgba(15, 23, 42, .06);   /* resting card  */
    --shadow:      0 4px 14px rgba(15, 23, 42, .10);  /* hover, raised */
    --shadow-lg:   0 12px 32px rgba(15, 23, 42, .14); /* modal, popover*/
    --shadow-up:   0 -4px 14px rgba(15, 23, 42, .10); /* bottom bars   */
    --shadow-glow: 0 4px 14px rgba(234, 88, 12, .35); /* primary CTA   */
}
