/* =============================================================================
   Ledgergard typography utilities (US 4954, Feature 1.2 Design System)
   ---------------------------------------------------------------------------
   The canonical text hierarchy as reusable utility classes. Every value resolves
   through the design tokens in tokens.css (US 4953) — no literal font sizes here.
   The <Text> component (Ledgergard.Web.Components.DesignSystem) renders these same
   classes via the TextVariant enum; raw markup can use the classes directly.

   Base font family applies app-wide so headings/labels/inputs share the stack;
   per-variant classes set only size / weight / leading (and muted color where the
   hierarchy calls for it). Prefixed `lg-` originally to avoid Bootstrap's unprefixed
   `.text-*` utilities; Bootstrap is gone (US 6958) but the prefix stays — it is the
   convention across every sheet, and it keeps "is this ours?" answerable at a glance.
   ========================================================================== */

/* App-wide font family + text color so all chrome shares the stack. Base font
   *size* / density is a layout concern and is set by US 4956, not here. */
body {
    font-family: var(--font-family-base);
    color: var(--color-text);
}

/* Base for every typography utility / <Text> render. */
.lg-text {
    font-family: var(--font-family-base);
    color: var(--color-text);
    margin: 0;
}

/* ── Hierarchy ───────────────────────────────────────────────────────────── */
.lg-text--page-title {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-tight);
}

.lg-text--section-title {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-tight);
}

.lg-text--card-title {
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-tight);
}

.lg-text--body {
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-normal);
}

/* Secondary / helper text — muted color + smallest step (AC #4). */
.lg-text--secondary {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-normal);
    color: var(--color-text-muted);
}

.lg-text--table {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-normal);
}

/* Muted inline text — an aside within a line (an entity label, a previous value). Used across the
   admin, audit and report pages; it was defined only in the Audit Trail page's SCOPED sheet, so every
   other page rendered it as plain text (US 7935). */
.lg-muted {
    color: var(--color-text-muted);
}