/* =================================================================
   OpenedMic™ — Base Typography + Reset + A11y
   -----------------------------------------------------------------
   Loaded on every public page AFTER tokens.css.
   Provides minimal reset, typographic defaults, focus visibility,
   and reduced-motion handling. Does not style brand components —
   those live in components.css.
   ----------------------------------------------------------------- */

/* ── Minimal reset ───────────────────────────────────────── */
*, *::before, *::after {
  box-sizing: border-box;
}

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

body {
  margin: 0;
  background: var(--om-surface-1);
  color: var(--om-text-primary);
  font-family: var(--om-font-sans);
  font-size: var(--om-type-body);
  font-weight: var(--om-weight-regular);
  line-height: var(--om-leading-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

img, svg, video, audio, iframe, embed, object {
  display: block;
  max-width: 100%;
}

button, input, select, textarea {
  font: inherit;
  color: inherit;
}

/* ── Focus visibility — frozen by Direction Freeze §2 P7 ──── */
:focus:not(:focus-visible) {
  outline: none;
}

:focus-visible {
  outline: 2px solid var(--om-brand-red);
  outline-offset: 2px;
  border-radius: var(--om-radius-sm);
}

/* ── Link treatment — semantic default ──────────────────────
   Global anchor stays color-only (navigation / icon links).
   Content-block anchors get the underline rule that closed
   axe's link-in-text-block violation in the Full-Beta-Completion
   sprint. This mirrors the inline rule that already ships on
   public pages; declaring it here makes it a system default. */
a {
  color: var(--om-brand-red);
  text-decoration: none;
  transition: color var(--om-duration-short) var(--om-ease-standard);
}

a:hover {
  text-decoration: underline;
}

main p a,
main li a,
.faq-a a,
.scope-banner a,
.om-article p a,
.om-article li a,
.om-trust-notice a,
footer .om-trust-notice a {
  text-decoration: underline;
}

/* ── Reduced-motion — system default ────────────────────────
   Every component inherits this posture. Individual components
   use `var(--om-duration-*)` tokens whose effective value is 0
   when the user requests reduced motion. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ── Skip link — keyboard a11y baseline ─────────────────────
   Inline skip-link CSS already ships on most pages. This
   system declaration ensures any page that lacks it (closes
   QA major M4) picks up a compliant default. */
.om-skip-link,
.skip-link {
  position: absolute;
  inset-inline-start: 0;
  top: -40px;
  background: var(--om-brand-red-cta);
  color: #ffffff;
  padding: var(--om-space-2) var(--om-space-4);
  z-index: var(--om-z-overlay);
  font-size: var(--om-type-sub);
  font-weight: var(--om-weight-bold);
  text-decoration: none;
  border-radius: 0 0 var(--om-radius-md) 0;
  transition: top var(--om-duration-short) var(--om-ease-standard);
}

.om-skip-link:focus,
.om-skip-link:focus-visible,
.skip-link:focus,
.skip-link:focus-visible {
  top: 0;
  outline: 2px solid #ffffff;
  outline-offset: -4px;
}

/* ── RTL-native defaults ───────────────────────────────────
   Use logical properties where possible. Directional icons
   are flipped at the component layer (components.css),
   not here. */
html[dir='rtl'] {
  text-align: start;
}

/* ── Heading hierarchy — unstyled by default ───────────────
   Components.css defines display/h1/h2/h3 classes. The raw
   semantic elements (<h1>, <h2>…) stay unopinionated so that
   existing inline styling on each page continues to take
   precedence without collision. This is additive. */

/* ── Mono-text helper for room codes, timestamps ───────── */
.om-mono {
  font-family: var(--om-font-mono);
  font-feature-settings: 'tnum' 1, 'calt' 0;
}

/* ── Screen-reader-only helper (classic) ───────────────── */
.om-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;
}