/**
 * GoToM8 — Xablu lib overrides
 *
 * Cross-cutting overrides for Xablu primitives that GoToM8 ships across
 * MANY consumer pages. Extracted from app.css on 2026-05-06 when app.css
 * crossed the 800-line limit enforced by
 * DbArchitectureGuardrailTests.AppCss_ShouldBeUnder800Lines. The rule's
 * intent is "single-use styles belong in scoped .razor.css"; cross-component
 * overrides like these belong global, just not in app.css.
 *
 * Loaded as its own stylesheet from App.razor so it cascades AFTER the
 * Xablu lib's own scoped CSS (specificity (0,2,0) ties the lib's
 * `.x-XXX[b-hash]` rules; later cascade order wins).
 *
 * @layer not used here -- the lib's scoped rules are unlayered and
 * applying a layer here would put us BELOW the lib in the cascade.
 */


/* ============================================================
   XBadge BadgeType.Text — fix lib's missing display:inline-flex
   ============================================================
   v3.59.0 LIB BUG (2026-05-06 venture-partner test round): the lib's
   `.x-badge` parent rule sets `align-items: center; justify-content: center;
   vertical-align: middle;` but does not set a `display` value. The Dot
   variant (`.x-badge-dot`) and Label variant (`.x-badge-label`) both
   explicitly set `display: inline-flex`, which makes the parent's
   `align-items: center` work. The Text variant (`.x-badge-text`) is
   MISSING this `display` value -- so for every `<XBadge BadgeType="Text"`
   on every page, the height/min-width set on `.x-badge-text` apply but
   the text inside doesn't center, and the box looks chunky/off-centred
   (e.g. the "3d" days-in-stage badge on PipelineItemCard).

   Filed upstream as xablu-libs#42 (see RC ledger). Consumer-side fix
   restores the missing display until the lib ships the one-line patch.
   ============================================================ */
/* Phase 142 (2026-05-13): RETIRED. xablu-libs#42 closed upstream — Xablu.Blazor
   v3.61.0+ ships `display: inline-flex` on `.x-badge-text` directly (verified in
   Xablu.Blazor.jkqqnui6nm.bundle.scp.css inside the 3.80.0 NuGet package). The
   local 1-line shim is now redundant. */

/* ============================================================
   XBadge BadgeType.Label — outlined-chip styling (Group kappa.9, 2026-05-06)
   ============================================================
   FigmaMake CRMDataModel.ts ships a 3-token-per-role badge spec:
     'customer':    { bg: success-50, text: success-700, border: success-200 }
     'icp-example': { bg: primary-50, text: primary-700, border: primary-200 }
     'committed':   { bg: success-50, text: success-700, border: success-200 }
   The Xablu lib's default `.x-badge-success` / `.x-badge-primary` /
   etc. fill the badge with the SATURATED base colour (`bg: success`,
   `color: success-foreground`) -- chunky / "filled-with-the-border-
   colour" look the user flagged in the second visual review.

   Override only the LABEL variant so dot + text variants stay untouched.
   Map: bg = `-muted` (light tint, ~50), text = base colour (~700),
   border = base colour (close to ~200 effect at 1px).
   ============================================================ */
.x-badge.x-badge-label.x-badge-primary {
    background-color: var(--x-color-primary-muted);
    color: var(--x-color-primary);
    border: 1px solid var(--x-color-primary);
}

.x-badge.x-badge-label.x-badge-success {
    background-color: var(--x-color-success-muted);
    color: var(--x-color-success);
    border: 1px solid var(--x-color-success);
}

.x-badge.x-badge-label.x-badge-warning {
    background-color: var(--x-color-warning-muted);
    color: var(--x-color-warning);
    border: 1px solid var(--x-color-warning);
}

.x-badge.x-badge-label.x-badge-danger {
    background-color: var(--x-color-destructive-muted);
    color: var(--x-color-destructive);
    border: 1px solid var(--x-color-destructive);
}

.x-badge.x-badge-label.x-badge-info {
    background-color: var(--x-color-info-muted);
    color: var(--x-color-info);
    border: 1px solid var(--x-color-info);
}


/* ============================================================
   XStatusPill — outlined-chip styling (Group kappa.10, 2026-05-06)
   ============================================================
   The Xablu lib's `.x-status-pill-{primary|success|warning|danger|info}`
   ship the 2-token (bg = colour-muted, text = colour-base) pattern,
   but the FigmaMake CRMDataModel.ts spec calls for a third token:
   a 1px stroke at the base colour (~colour-200 effect). These
   overrides ADD the border without touching the lib's bg/text.

   2026-05-06 update: xablu-libs v3.58.1 (issue #40 hotfix) fixed the
   `.x-status-pill-info` family-token mismatch upstream — it now ships
   info-muted/info correctly, so the only consumer-side delta here is
   the border. The bg/color lines previously in this block have been
   retired since they now duplicate the lib.

   Specificity (0,2,0) ties the lib's scoped `.x-status-pill-X[b-...]`,
   so this stylesheet's later cascade order wins.
   ============================================================ */
.x-status-pill.x-status-pill-primary {
    border: 1px solid var(--x-color-primary);
}

.x-status-pill.x-status-pill-success {
    border: 1px solid var(--x-color-success);
}

.x-status-pill.x-status-pill-warning {
    border: 1px solid var(--x-color-warning);
}

.x-status-pill.x-status-pill-danger {
    border: 1px solid var(--x-color-destructive);
}

.x-status-pill.x-status-pill-info {
    border: 1px solid var(--x-color-info);
}


/* ============================================================
   XTab pill-variant badge styling (Group kappa.3, 2026-05-06)
   ============================================================
   The Xablu lib base `.x-tab-header-badge` rule has ONLY
   `flex-shrink: 0` -- no background, color, sizing, or text
   centering. Inactive-tab counter dots in GoToM8 rendered with
   browser-default text styling (visible in the 2026-05-06 visual
   review screenshot 1: dark blob, off-centre numbers). FigmaMake
   reference uses small primary-muted circles.

   Active-tab badge already has lib-supplied background/color
   (rgba(255,255,255,0.25) on primary) but lacks the size + centering.
   Overrides for both states below restore the FigmaMake look without
   forking the component.
   ============================================================ */
.x-tab--pill .x-tab-header-item .x-tab-header-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 999px;
    font-size: var(--x-text-xs);
    font-weight: var(--x-font-weight-semibold);
    line-height: 1;
}

/* Inactive-tab badge: per FigmaMake CRM.tsx:119-120 the inactive variant
   is grey-100 / muted-foreground, NOT primary-tinted. The earlier kappa.3
   override mistakenly used primary-muted -- corrected here per the
   methodology rule (read FigmaMake source first). */
.x-tab--pill .x-tab-header-item:not(.selected) .x-tab-header-badge {
    background-color: var(--x-color-muted);
    color: var(--x-color-muted-foreground);
}


/* ============================================================
   XActivityItem always-on focus outline — RETIRED 2026-05-21
   ============================================================
   xablu-libs #148 closed upstream — Xablu.Blazor v3.98.0 scopes the
   clickable-row outline to `:focus-visible` only (the bare-class
   selector no longer carries the outline). The consumer-side
   `.x-activityitem-clickable:not(:focus-visible) { outline: none }`
   shim is now redundant and has been removed.
   ============================================================ */


/* ============================================================
   XLabel heading types — render block (2026-05-21)
   ============================================================
   v3.95.0: XLabel renders an inline element, so a heading-scale
   XLabel collapses onto the next label ("AptibleAptible is a
   platform-as-a-service…"). The proper fix is upstream — filed as
   xablu-libs #150 (XLabel headings should be display:block).

   A consumer-side global override was attempted here but proved
   unreliable: `xablu-overrides.css` loads BEFORE the scoped bundle
   `GoToM8.Web.styles.css` (App.razor line 39 vs 41 — the file's
   own "loads after the lib" header comment is inaccurate for the
   scoped bundle), so a (0,2,0) override loses the cascade tie.

   Reliable consumer fix until #150 ships: a flex-column parent on
   the label group — see CompetitorDetailPage.razor.css
   `.comp-detail-headings` and DashboardHeroSection. A flex-column
   container stacks inline children regardless of their `display`,
   needs no specificity fight, and is not subject to CSS-isolation
   (it styles the page's OWN div). Applied per-page where the bug
   is visible rather than as a fragile global rule.
   ============================================================ */
