/* =====================================================================
   COI CORE: tokens and base styles, shared by every COI site.
   Ported from reference/prototype/coi-core.css (tokens and base rules only;
   component styles are added by their own tickets under core/components/).
   Do not put brand values here; brand values come from config/brand.css.
   All sizes are rem. Everything here is scoped under .coi-v2 so it is a
   no-op while the design switch is off.
   ===================================================================== */

:root {
  /* Defaults only; a site's config/brand.css overrides these. */
  --coi-bg: #fff;
  --coi-text: #1a1a1a;
  --coi-muted: #566170;
  --coi-primary: #111;
  --coi-accent: #c0392b;
  --coi-accent-2: #1d7a85;
  --coi-on-accent: #fff;
  --coi-surface: #f3f4f6;
  --coi-border: #dcdfe4;
  --coi-overlay-rgb: 0, 0, 0;
  --coi-font: "Poppins", system-ui, -apple-system, "Segoe UI", roboto, sans-serif;
  --coi-social: var(--coi-accent); /* social icon fill; a brand file can override */

  /* Optional range tokens. Defaults reproduce the base look; a brand file can set any of them for more range. */
  --coi-secondary: var(--coi-primary);
  --coi-heading: var(--coi-primary);
  --coi-label: var(--coi-accent);
  --coi-tag-bg: var(--coi-accent);
  --coi-tag-text: var(--coi-on-accent);
  --coi-rule: var(--coi-accent);
  --coi-header-rule: var(--coi-border);
  --coi-header-rule-w: 1px;
  --coi-box-rule: var(--coi-border);
  --coi-box-rule-w: 1px;
  --coi-footer-rule: var(--coi-border);
  --coi-footer-rule-w: 1px;
  --coi-max: 77.5rem;
  --coi-gap: 1.5rem;
  --coi-radius: 0.6rem;
}

/* Root sizing: 106.25% (17px) on desktop, about 15.5px at 921px and below.
   The design switch also adds "coi-v2" to <html> (see core/loader.php) so this
   can be scoped: with the switch off this file does not even load, and even if
   it ever did, it still touches nothing without the html.coi-v2 class. */
html.coi-v2 {
  font-size: 106.25%;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  color-scheme: light;
}

/* stylelint-disable-next-line unit-disallowed-list -- breakpoint px to match Astra's own 921px breakpoint, not a design size */
@media (max-width: 921px) {
  html.coi-v2 { font-size: 96.9%; }
}

.coi-v2, .coi-v2 *, .coi-v2 *::before, .coi-v2 *::after { box-sizing: border-box; }

body.coi-v2 {
  margin: 0;
  font-family: var(--coi-font);
  font-size: 1.1rem;
  line-height: 1.4;
  color: var(--coi-text);
  background: var(--coi-bg);
}

.coi-v2 img {
  max-width: 100%;
  height: auto;
}
.coi-v2 a { color: inherit; }

.coi-v2 :focus-visible {
  outline: 0.18rem solid var(--coi-accent-2);
  outline-offset: 0.18rem;
}

.coi-v2 .coi-sr {
  position: absolute;
  /* stylelint-disable-next-line unit-disallowed-list -- 1px visually-hidden technique, not a design size */
  width: 1px;
  /* stylelint-disable-next-line unit-disallowed-list -- 1px visually-hidden technique, not a design size */
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.coi-v2 .coi-skip {
  position: absolute;
  /* stylelint-disable-next-line unit-disallowed-list -- moves the skip link off-screen until focused, not a design size */
  left: -999px;
  top: 0;
  background: var(--coi-primary);
  color: #fff;
  padding: 0.6rem 1rem;
  z-index: 200;
}
.coi-v2 .coi-skip:focus { left: 0; }