/**
 * High-priority global utilities (@layer utilities).
 * Load after pcos-home.css / pcos-platform.css so these beat @layer components.
 * See pcos-layers.css for full layer ordering (utilities < overrides).
 */

@layer utilities {
  /* Screen-reader only (visually hidden, still in a11y tree) */
  .pcos-site .pcos-sr-only,
  .pcos-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  /* Numeric columns / metrics (demo + marketing) */
  .pcos-u-tabular,
  .pf-u-tabular {
    font-variant-numeric: tabular-nums;
  }

  /* Single-line ellipsis */
  .pcos-u-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  /* Kill pointer hit-testing (decorative overlays) */
  .pcos-u-pointer-none,
  .pf-u-pointer-none {
    pointer-events: none;
  }

  /* Focus ring aligned with PCOS accent (for custom focusable nodes) */
  .pcos-u-focus-ring:focus-visible {
    outline: 2px solid var(--pcos-accent, #c8943a);
    outline-offset: 3px;
  }
}