/* App-global overrides. Imported in main.js after 'vuetify/styles', but
   Vite's production bundler reorders CSS chunks so source order is not a
   reliable winner against node_modules CSS at equal specificity. Rules
   here either out-specify Vuetify's default or use !important on the
   exact properties that need to win. */

/* Tooltip readability fix (operator-flagged 2026-05-28).
   Vuetify's default v-tooltip pairs `on-surface-variant` TEXT with an
   `surface-variant` BACKGROUND. FC's theme deliberately maps
   `on-surface-variant` to vellum (#C2BFB4 — a light cream, correct for
   muted captions/hints on the dark page) but never defines
   `surface-variant`, so Vuetify auto-generates a light-ish background:
   light text on light bg → near-white-on-near-white, unreadable.

   Tooltips want the inverse of muted body text — a dark, slightly
   elevated panel with the HIGH-contrast parchment text. Fixing it here
   (not by changing on-surface-variant) keeps captions/empty-states
   correct while making every tooltip in the app legible.

   `!important` on the contrast properties: this rule ties Vuetify's
   default at specificity (.v-tooltip > .v-overlay__content), and in a
   Vite production build the node_modules CSS can land after app.css in
   the final stylesheet regardless of import order, so source-order wins
   aren't reliable. !important removes that fragility for the two
   properties whose drift made tooltips unreadable; the cosmetic border
   and shadow don't need it (Vuetify doesn't set them). Operator
   re-flagged 2026-05-29 on the deployed :latest after PR #33. */
.v-tooltip > .v-overlay__content {
  background: rgb(var(--v-theme-surface-bright)) !important;  /* slate #2C313A */
  color: rgb(var(--v-theme-on-surface)) !important;           /* parchment #E8E4D8 */
  border: 1px solid rgb(var(--v-theme-on-surface-variant) / 0.25);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}

/* Canonical muted/secondary text token (DRY pattern sweep 2026-06-09).
   Was redefined identically in 12 component <style scoped> blocks; now one
   global utility. Muted text uses the explicit on-surface-variant (vellum)
   token, NOT opacity — Vuetify's text-medium-emphasis is opacity-based and is
   deliberately not used here. `.fc-muted` is a custom class Vuetify never
   emits, so no specificity/reorder fight — no !important needed. */
.fc-muted { color: rgb(var(--v-theme-on-surface-variant)); }
