/* ABCash V1.8.10 — interactive feedback on the current shared-layout pages.
   This is intentionally separate from layout/nav sizing rules in abc-site.css.
   Do not change link targets, image geometry, form logic or mobile scroll behavior. */

:root {
  --abc-hit-gold: #ffda82;
  --abc-hit-cream: #fff0c6;
  --abc-hit-navy: #082847;
  --abc-hit-red: #a51020;
}

/* Consistent interaction timing, without altering the physical hotspot. */
a[href], button:not(:disabled), input[type="submit"]:not(:disabled) {
  cursor: pointer;
  transition-property: background-color, color, border-color, box-shadow, filter, transform, text-decoration-color;
  transition-duration: .16s;
  transition-timing-function: ease-out;
}

/* Ordinary hyperlinks should LOOK like links, even before hover.
   Exempt controls whose visible button, tile or image is already the affordance. */
body a[href]:where(:not(.button):not(.btn):not(.cta-button):not(.cta):not(.site-cta-button):not(.index-cta-button):not(.abc-jump-link):not(.foreclosure-topic-link):not(.bbb-hotspot):not(.bbb-abc-overlay):not(.mobile-bbb-nav):not(.award-slideshow):not(.award-badge-slideshow)) {
  text-decoration-line: underline !important;
  text-decoration-thickness: 2px;
  text-underline-offset: .19em;
  text-decoration-skip-ink: auto;
}

/* Image links, navigation cells and card tiles don't need text underlines. */
.header-new-nav-live a[href], .mobile-sticky a[href],
.link-grid a[href], .resource-links a[href], .foreclosure-topic-link[href],
.badge-row a[href], .bbb-hotspot[href], .bbb-abc-overlay[href],
.mobile-bbb-nav[href], a.abc-jump-link[href] {
  text-decoration: none !important;
}

/* On light sections: inline links get unmistakable text + highlight on hover. */
body p a[href], body li a[href], body td a[href], body .boldtext a[href],
body .eyebrow a[href], body .site-page-intro a[href] {
  text-underline-offset: .21em;
  text-decoration-thickness: 2px;
}
@media (hover: hover) {
  body p a[href]:hover, body li a[href]:hover,
  body td a[href]:hover, body .boldtext a[href]:hover,
  body .eyebrow a[href]:hover, body .site-page-intro a[href]:hover {
    color: var(--abc-hit-navy) !important;
    background-color: var(--abc-hit-cream) !important;
    box-shadow: 0 0 0 3px var(--abc-hit-cream);
    border-radius: 2px;
    text-decoration-color: var(--abc-hit-red) !important;
  }
}

/* Hyperlinks appearing among ordinary white type in blue and red areas.
   Gold-colored underlines (and slightly warmer type) mark them at rest. */
footer a[href], .footer-links a[href],
.site-cta-band p a[href], .index-cta-band p a[href],
.hero .eyebrow a[href], .hero p a[href]:not(.button),
.top-bar a[href], .cta p a[href] {
  color: var(--abc-hit-cream) !important;
  text-decoration: underline !important;
  text-decoration-color: var(--abc-hit-gold) !important;
  text-decoration-thickness: 2px;
  text-underline-offset: .2em;
}

/* The introductory jump text has an inline text-decoration:none in some pages. */
.hero .eyebrow a[href] {
  text-decoration: underline dashed var(--abc-hit-gold) 2px !important;
  text-underline-offset: .23em;
}

/* Primary nine-across desktop nav / five-across mobile nav.
   Use a bright block highlight and gold inset marker; no size changes. */
.header-new-nav-live .header-new-nav-live-inner > a[href] {
  color: #fff !important;
}
@media (hover: hover) {
  .header-new-nav-live .header-new-nav-live-inner > a[href]:hover {
    background-color: var(--abc-hit-red) !important;
    color: #fff !important;
    box-shadow: inset 0 -4px 0 var(--abc-hit-gold), inset 0 0 0 1px rgba(255,218,130,.38) !important;
    text-decoration: none !important;
  }
}

/* Pale card-links and topic tiles become navy with bright gold edges.
   Active cards are slightly lighter so they still respond when hovered. */
.link-grid a[href], .resource-links a[href], .foreclosure-topic-link[href] {
  box-shadow: inset 0 -3px 0 rgba(181,18,27,.35), 0 3px 10px rgba(3,27,56,.08);
}
@media (hover: hover) {
  .link-grid a[href]:hover, .resource-links a[href]:hover,
  .foreclosure-topic-link[href]:hover {
    background: var(--abc-hit-navy) !important;
    color: #fff !important;
    border-color: var(--abc-hit-gold) !important;
    box-shadow: inset 0 -4px 0 var(--abc-hit-gold), 0 7px 18px rgba(3,27,56,.25) !important;
    transform: translateY(-2px);
    text-decoration: none !important;
  }
  .link-grid a[href]:hover span, .link-grid a[href]:hover strong,
  .resource-links a[href]:hover span, .resource-links a[href]:hover strong,
  .foreclosure-topic-link[href]:hover span, .foreclosure-topic-link[href]:hover strong {
    color: #fff !important;
  }
  .resource-links a.active[href]:hover,
  .foreclosure-topic-link.active[href]:hover {
    background: #325b7d !important;
    color: #fff !important;
  }
}

/* Filled action buttons work against white, navy AND red backgrounds:
   reverse from the existing red to warm gold with dark, legible text. */
@media (hover: hover) {
  a.button[href]:hover, a.btn[href]:hover, a.cta-button[href]:hover,
  a.site-cta-button[href]:hover, a.index-cta-button[href]:hover,
  .hero-buttons a[href]:hover, .contact-options a.button[href]:hover,
  button:not(:disabled):hover, input[type="submit"]:not(:disabled):hover {
    background: var(--abc-hit-gold) !important;
    background-color: var(--abc-hit-gold) !important;
    color: var(--abc-hit-navy) !important;
    border-color: var(--abc-hit-red) !important;
    box-shadow: 0 0 0 2px rgba(181,18,27,.35), 0 7px 18px rgba(3,27,56,.28) !important;
    filter: none !important;
    transform: translateY(-2px);
    text-decoration: none !important;
  }
}

/* Existing jump bubbles already change color. Add an unmistakable gold edge. */
@media (hover: hover) {
  .abc-jump-wrap .abc-jump-link[href]:hover {
    background: var(--abc-hit-red) !important;
    border-color: var(--abc-hit-gold) !important;
    color: #fff !important;
    box-shadow: 0 0 0 2px var(--abc-hit-gold), 0 7px 19px rgba(3,27,56,.29) !important;
    transform: translateY(-2px);
  }
}

/* The BBB image hotspot has no normal text; highlight its clickable region. */
@media (hover: hover) {
  .header-new-top-image .bbb-hotspot[href]:hover {
    background: rgba(255,218,130,.20);
    box-shadow: inset 0 0 0 3px var(--abc-hit-gold), 0 0 0 2px rgba(3,27,56,.3);
    border-radius: 5px;
  }
  .bbb-abc-overlay[href]:hover img,
  .badge-row a[href]:hover img {
    filter: brightness(1.08) drop-shadow(0 0 9px rgba(255,218,130,.95));
  }
}

/* Footer/sticky controls live on navy and need their own light affordance. */
@media (hover: hover) {
  footer a[href]:hover, .footer-links a[href]:hover,
  .site-cta-band p a[href]:hover, .index-cta-band p a[href]:hover,
  .top-bar a[href]:hover, .cta p a[href]:hover {
    color: var(--abc-hit-navy) !important;
    background: var(--abc-hit-gold) !important;
    box-shadow: 0 0 0 4px var(--abc-hit-gold);
    text-decoration-color: var(--abc-hit-navy) !important;
    border-radius: 2px;
  }
  .mobile-sticky a[href]:hover {
    background: var(--abc-hit-red) !important;
    color: #fff !important;
    box-shadow: inset 0 4px 0 var(--abc-hit-gold) !important;
    text-decoration: none !important;
  }
}

/* Keyboard usability: high-contrast visible focus, even without a mouse. */
a[href]:focus-visible, button:focus-visible, input[type="submit"]:focus-visible {
  outline: 3px solid var(--abc-hit-gold) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 5px rgba(3,27,56,.55) !important;
}
/* Keep the focus marker visible inside the clipped horizontal navigation. */
.header-new-nav-live a[href]:focus-visible,
.mobile-sticky a[href]:focus-visible {
  outline: 0 !important;
  box-shadow: inset 0 0 0 3px var(--abc-hit-gold), inset 0 -6px 0 var(--abc-hit-red) !important;
}
/* Compatibility fallback for browsers without :focus-visible. */
@supports not selector(:focus-visible) {
  a[href]:focus, button:focus, input[type="submit"]:focus {
    outline: 3px solid #ffda82;
    outline-offset: 2px;
  }
}

@media (prefers-reduced-motion: reduce) {
  a[href], button, input[type="submit"] {transition: none !important;}
  .link-grid a[href]:hover, .resource-links a[href]:hover,
  .foreclosure-topic-link[href]:hover, .abc-jump-link[href]:hover,
  .hero-buttons a[href]:hover, a.button[href]:hover,
  button:hover, input[type="submit"]:hover {transform:none !important;}
}