/*!
 * gov-base.css  -  Base element styles (DBIM ch.4 Typography, GIGW 5.1.15, 5.2.x)
 * Requires gov-tokens.css. Safe to add to an existing site: styles are scoped to
 * the .gov-root wrapper (put class="gov-root" on <body>), except the skip link and focus ring.
 */
html { font-size: var(--gov-scale); -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }

.gov-root, .gov-root * , .gov-root *::before, .gov-root *::after { box-sizing: border-box; }
.gov-root {
  margin: 0; background: var(--gov-bg); color: var(--gov-fg);
  font-family: var(--gov-font); font-size: var(--gov-fs-p1); line-height: var(--gov-lh);
  font-weight: 400; text-align: left;              /* DBIM 4.1.1(i): body text left-aligned */
}
.gov-root h1, .gov-root h2, .gov-root h3, .gov-root h4 { line-height: var(--gov-lh-head); margin: 0 0 var(--gov-s3); font-weight: 600; color: var(--gov-key); }
.gov-root h1 { font-size: var(--gov-fs-h1); font-weight: 700; }
.gov-root h2 { font-size: var(--gov-fs-h2); }
.gov-root h3, .gov-root h4 { font-size: var(--gov-fs-h3); }
.gov-root .gov-h1, .gov-root .gov-h2, .gov-root .gov-h3 { display: block; line-height: var(--gov-lh-head); margin: 0 0 var(--gov-s3); font-weight: 600; color: var(--gov-key); }   /* heading look on a non-heading element */
.gov-root .gov-h1 { font-size: var(--gov-fs-h1); font-weight: 700; } .gov-root .gov-h2 { font-size: var(--gov-fs-h2); } .gov-root .gov-h3 { font-size: var(--gov-fs-h3); }
.gov-root p, .gov-root ul, .gov-root ol, .gov-root dl { margin: 0 0 var(--gov-s4); }
.gov-root small, .gov-root .gov-small { font-size: var(--gov-fs-p2); }
.gov-root img, .gov-root svg, .gov-root video { max-width: 100%; height: auto; }   /* never stretch (DBIM 3.7 iv, 5.5 ii) */
.gov-root .gov-prose { max-width: 70ch; }          /* DBIM 7.1.3.3: moderate line length */
.gov-root .gov-prose p, .gov-root .gov-prose li { max-width: 70ch; }

/* Links: underline + key colour (>= 4.5:1). Hover is a noticeable change (DBIM 4.5 iv). */
.gov-root a { color: var(--gov-link-text); text-decoration: underline; text-underline-offset: 2px; }
.gov-root a:hover { text-decoration-thickness: 3px; background: var(--gov-5); }
:root[data-contrast="high"] .gov-root a:hover { background: #333; }

/* Visible keyboard focus (GIGW 5.2.33 / WCAG 2.4.7). Never remove outline without replacement. */
.gov-root :focus-visible, .gov-skip:focus-visible {
  outline: 3px solid var(--gov-focus); outline-offset: 2px;
  box-shadow: 0 0 0 5px var(--gov-focus-ink);
}

/* Skip link (GIGW 5.2.27, DBIM 5.4 'skip to main content'). Must be the first focusable element. */
.gov-skip {
  position: absolute; left: var(--gov-s2); top: -100px; z-index: 1000;
  background: var(--gov-key); color: var(--gov-white); padding: var(--gov-s2) var(--gov-s4);
  border-radius: 0 0 var(--gov-radius) var(--gov-radius); font-family: var(--gov-font); font-weight: 600;
}
.gov-skip:focus { top: 0; }

.gov-container { width: 100%; max-width: var(--gov-container); margin-inline: auto; padding-inline: var(--gov-s4); }
.gov-sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.gov-section { padding-block: var(--gov-s6); }
.gov-section--tint { background: var(--gov-5); }
.gov-section--linen { background: var(--gov-linen); }
:root[data-contrast="high"] .gov-section--tint, :root[data-contrast="high"] .gov-section--linen { background: #000; }

/* Data tables (GIGW 5.1.19, DBIM 4.1.1 i): text left, numbers right, headers centred */
.gov-table-wrap { overflow-x: auto; position: relative; max-width: 100%; }          /* reflow without 2-D scrolling of the page (5.2.17) */
.gov-table { width: 100%; border-collapse: collapse; font-size: var(--gov-fs-p1); }
.gov-table caption { text-align: left; font-weight: 600; padding: var(--gov-s2) 0; color: var(--gov-key); }
.gov-table th, .gov-table td { border: 1px solid var(--gov-grey-1); padding: var(--gov-s2) var(--gov-s3); text-align: left; vertical-align: top; }
.gov-table thead th { background: var(--gov-key); color: var(--gov-white); text-align: center; border-color: var(--gov-key); }
.gov-table tbody th { background: var(--gov-5); color: var(--gov-text); }
.gov-table td.gov-num, .gov-table th.gov-num { text-align: right; font-variant-numeric: tabular-nums; }
.gov-table tbody tr:nth-child(even) td { background: #faf9f9; }
:root[data-contrast="high"] .gov-table th, :root[data-contrast="high"] .gov-table td { background: #000 !important; color: #fff !important; border-color: #fff; }

/* Reduce reliance on colour alone (5.2.12): required-field marker and status text carry text too */
.gov-lead { font-size: 1.125rem; color: var(--gov-fg-muted); }
.gov-badge { display: inline-block; padding: 0 .5rem; border-radius: 999px; font-size: var(--gov-fs-p2); background: var(--gov-5); color: var(--gov-key); border: 1px solid var(--gov-4); }

/* the HTML hidden attribute must always win over component display rules */
.gov-root [hidden] { display: none !important; }