/* o5n SPA fixes (CSS) — served as /o5n-fixes.css, injected by react/index.blade.php.
 *
 * ── The problem ──────────────────────────────────────────────────────────────
 * Invoice Ninja stores exactly ONE logo per company (settings.company_logo).
 * There is no square / small / avatar variant in the settings model, so the
 * company switcher reuses the full invoice logo in a ~32px round avatar:
 *
 *     className: "rounded-full border overflow-hidden aspect-square object-cover"
 *     src:       company.settings.company_logo
 *     style:     { width: "2rem" }        // also 1.66rem and 1.65rem
 *
 * `aspect-square` + `object-cover` CROPS a wide wordmark to its centre slice, so
 * both of our logos rendered as unreadable fragments:
 *   Southern Ohio Computer Services  1650x340  (4.85:1)  ->  "HE...UTER"
 *   Orbital Impact                    790x420  (1.88:1)  ->  "rbll app"
 *
 * ── The fix ──────────────────────────────────────────────────────────────────
 * Each logo already contains a distinctive square mark (the Ohio state shape;
 * the ringed-planet glyph). We ship those as separate assets and swap them in
 * for the small round avatars ONLY. Invoices, the client portal and every other
 * surface keep using the full logo, untouched.
 *
 * Two layers, so it degrades safely:
 *   1. object-fit: contain  — any company WITHOUT a mark shows its whole logo
 *      letterboxed instead of cropped. Applies everywhere, always.
 *   2. content: url(...)    — companies WITH a mark get the square glyph.
 *      Keyed on the logo's storage filename, which is stable unless the logo is
 *      re-uploaded; patch-spa-shim.py warns if a company's current logo no
 *      longer matches an entry here, so a stale map cannot go unnoticed.
 *
 * `content: url()` on <img> is supported in Chromium and WebKit. If a browser
 * ignores it, layer 1 still applies — the logo is letterboxed, never cropped.
 *
 * Scoped with .rounded-full so it hits ONLY the switcher avatars, not the large
 * `alt="Company logo"` image on the 404 page.
 */

/* Layer 1 — never crop a company logo into a circle. */
img.rounded-full[alt="Company logo"] {
  object-fit: contain;
}

/* Layer 2 — square marks for the small round avatars. */

/* company_id 1 — Orbital Impact (ringed-planet glyph) */
img.rounded-full[alt="Company logo"][src*="Q1DthtvcrnCQ1uUswEsoxuIlfCFnl6u9TiwsjL1L"] {
  content: url("/o5n-logo-mark-1.png");
}

/* company_id 2 — Southern Ohio Computer Services (Ohio state shape) */
img.rounded-full[alt="Company logo"][src*="s8j6UyFgTj5v8QuuCTMcGG7T42E9KRp0diqUhJNk"] {
  content: url("/o5n-logo-mark-2.png");
}