html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

/* Required field indicator */
.form-label.required::after {
  content: " *";
  color: #dc3545;
}

/* ============================================================
   Unit 5: Skip link (WCAG 2.4.1)
   ============================================================ */
.skip-link {
  position: absolute;
  top: -100%;
  left: 0.5rem;
  background: #007bff;
  color: #fff;
  padding: 0.5rem 1rem;
  border-radius: 0 0 0.4rem 0.4rem;
  font-weight: 600;
  z-index: 99999;
  text-decoration: none;
  transition: top 0.1s;
}

.skip-link:focus {
  top: 0;
  outline: 3px solid #ffdd00;
  outline-offset: 2px;
}

/* ============================================================
   Unit 5: Focus-visible rings for all interactive elements
   Satisfies WCAG 2.4.7 (Focus Visible) and 2.4.11 (Focus Appearance)
   ============================================================ */
:focus-visible {
  outline: 3px solid #007bff;
  outline-offset: 2px;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #007bff;
  outline-offset: 2px;
  border-radius: 0.2rem;
}

/* Remove default focus outline when focus-visible is supported
   (keeps it for keyboard-only navigation) */
:focus:not(:focus-visible) {
  outline: none;
}

/* ============================================================
   Unit 5: Minimum touch target sizes (WCAG 2.5.5)
   ============================================================ */
button,
[role="button"],
input[type="submit"],
input[type="reset"],
input[type="button"] {
  min-height: 44px;
}

/* ============================================================
   Unit 5: Text spacing compliance (WCAG 1.4.12)
   Override letter-spacing / line-height / word-spacing without
   breaking content when user agents override these properties.
   ============================================================ */
* {
  /* Allow user overrides via CSS custom properties */
  letter-spacing: var(--user-letter-spacing, inherit);
  line-height: var(--user-line-height, inherit);
}
