/* ==========================================================================
   findcompany — shared tokens + cross-world primitives
   --------------------------------------------------------------------------
   Linked FIRST on every page, before the world stylesheet (app.css for the
   blue public site, dashboard.css for the purple authed dashboard). Holds only
   what is genuinely shared: the reset, the scales (radius / spacing / shadow),
   the status palette, and the handful of components that are identical in both
   worlds. Each world sets its own --accent / --ring / surfaces / fonts in its
   own :root, so the shared component tokens resolve to the right colour there.

   No build step: this is plain CSS, linked (not @imported), cache-busted by
   fc_asset()'s ?v=<mtime>. Mobile-first, CSS Grid/Flexbox, WCAG AA.
   ========================================================================== */

:root {
    /* ---- Radius scale (identical in both old worlds) ---- */
    --radius:    14px;
    --radius-sm: 10px;
    --radius-lg: 20px;

    /* ---- Spacing ---- */
    --gap:      24px;
    --pad-card: 24px;

    /* ---- Elevation (very light) ---- */
    --shadow:    0 1px 2px rgba(23, 20, 29, .04);
    --shadow-md: 0 2px 8px rgba(23, 20, 29, .05);

    /* ---- Status palette (single source of truth across both worlds). The text colours are
       darkened so badge/banner text meets WCAG AA (4.5:1) on their own tints: green 4.8:1,
       amber 4.8:1, red 5.2:1 (the previous values were 3.1 / 3.4 / 4.5). ---- */
    --ok:     #0f7a4e;
    --ok-bg:  #e7f6ef;
    --warn:   #965e00;
    --warn-bg:#fbf1e1;
    --bad:    #b62f44;
    --bad-bg: #fbe9ec;

    /* ---- Shared mono stack (system; slashed-zero applied on .mono). Never
       JetBrains Mono. ---- */
    --font-mono: ui-monospace, "Cascadia Code", "Cascadia Mono", "Segoe UI Mono", Consolas, Menlo, monospace;

    /* ---- Fallbacks for tokens each world is expected to set. Keep the shared
       primitives readable even if a world sheet fails to load. ---- */
    --ring:   #2563eb;          /* focus ring; overridden per world           */
    --muted:  #5b6b7f;          /* secondary text; overridden per world       */
}

/* ---- Reset ---- */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    min-height: 100vh;
}

button {
    font-family: inherit;
    cursor: pointer;
}

input,
select,
textarea {
    font-family: inherit;
}

a {
    color: inherit;
}

/* SVG icons (fc_icon) sit inline alongside text — never let one stretch a flex row. */
svg {
    flex-shrink: 0;
}

/* ---- Cross-world utilities ---- */

/* Visually hidden but available to screen readers. */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.muted {
    color: var(--muted);
}

/* Skip-to-content link (WCAG 2.4.1): off-screen until focused, then visible top-left so a
   keyboard user can bypass the repeated header/sidebar. Coloured by each world's --ring. */
.skip-link {
    position: absolute; left: 8px; top: -48px; z-index: 1000;
    padding: 8px 14px; border-radius: var(--radius-sm); font-weight: 600;
    background: var(--ring); color: #fff; text-decoration: none;
    transition: top .12s ease;
}
.skip-link:focus { top: 8px; outline: 3px solid #fff; outline-offset: 1px; }

/* Tabular monospace with a slashed, non-dotted zero — a hard low-vision
   requirement; keep on every mono numeral. */
.mono {
    font-family: var(--font-mono);
    font-feature-settings: "zero" 1, "tnum" 1;
    font-variant-numeric: slashed-zero tabular-nums;
    letter-spacing: -0.01em;
}

/* The JS toggles the `hidden` attribute on absolutely-positioned combobox lists
   and conditional blocks; pin display:none so the UA default can't be overridden
   by a later display rule. */
[hidden] {
    display: none !important;
}

/* Disabled controls (the icon buttons toggle the `disabled` attribute). */
:disabled,
[disabled] {
    opacity: .45;
    cursor: not-allowed;
}

/* Shared focus-visible treatment, coloured by each world's --ring. */
:focus-visible {
    outline: 3px solid var(--ring);
    outline-offset: 2px;
}

/* Respect reduced-motion: the dashboard uses a few width/height transitions. */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}
