/* Two restrained UI accents. Official marks and raster illustrations are unchanged. */
:root {
  --action-blue: #2457e6;
  --action-blue-hover: #1743be;
  --state-teal: #087477;
  --state-teal-hover: #065c5f;
  --on-dark-blue: #b8d0ff;
  --yellow: var(--action-blue); /* Legacy component token; no image recolouring. */
}
.button-yellow {
  background: var(--action-blue);
  color: #fff;
}
.button-yellow:hover {
  background: var(--action-blue-hover);
  color: #fff;
}
.skip-link {
  background: var(--action-blue);
  color: #fff;
}
.scenario-tabs button,
.transaction-mode span {
  transition: none;
}
.scenario-tabs button[aria-selected="true"] {
  background: var(--state-teal);
  color: #fff;
}
.scenario-tabs button[aria-selected="true"]:hover {
  background: var(--state-teal-hover);
  color: #fff;
}
.transaction-mode:has(input:checked) span {
  background: var(--state-teal);
  color: #fff;
}
.transaction-mode:has(input:checked):hover span {
  background: var(--state-teal-hover);
  color: #fff;
}
.transaction-step {
  transition: transform .22s ease;
}
.transaction-step.is-current {
  background: var(--state-teal);
  color: #fff;
}
.transaction-enquiry,
.transaction-enquiry:hover {
  color: var(--state-teal);
}
.portal-acknowledgement input {
  accent-color: var(--state-teal);
}
.portal-acknowledgement:hover {
  color: var(--state-teal);
}
.scene-enquiry-status {
  color: var(--state-teal);
}
.hero-task-link:hover strong,
.text-link:hover {
  color: var(--state-teal);
}
#language-toggle:hover {
  color: var(--state-teal);
}
.footer-links a:hover,
.footer-brand a:hover,
.site-footer a:hover {
  color: var(--on-dark-blue);
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.scenario-tabs button:focus-visible,
.scenario-capabilities button:focus-visible,
.consultation-fields select:focus-visible,
.portal-acknowledgement input:focus-visible,
.transaction-enquiry:focus-visible,
.transaction-mode:has(input:focus-visible) span {
  outline-color: var(--action-blue);
}
@media (prefers-reduced-motion: reduce) {
  .transaction-step { transition: none; }
}
