/* WCAG remediation layer for upjet native theme (2026-10-07 axe audit).

Findings fixed here (all additive, no template/business changes):
1. [serious] color-contrast: .link-secondary on login (forgot-password link)
   -> darken to >= 4.5:1 against the login card surface.
2. [critical] label: vendor SecSave captcha input has no associated label.
   -> aria-label via CSS-only is impossible; use ::before hint is decorative
      only. Real fix needs ihtml vendor output; we scope what CSS can do and
      document the rest. However the input carries name="code"; we add a
      visually-hidden label through the .upjet-a11y class for template-side
      adoption later. CSS below ensures the input is at least perceivable
      (focus ring + size).
3. [serious] link-in-text-block: footer/inline links rely on color alone.
   -> underline on hover+focus AND persistent underline inside prose blocks.

Loaded after upjet-native-layout-v1.css via the same <link> in main.html.
*/

/* --- Fix 1: contrast for secondary links on auth/card surfaces ----------- */
/* bootstrap custom build declares .link-secondary with !important (RGBA(var));
   our override must match with !important + later cascade position. */
a.link-secondary,
.link-secondary {
  color: #526477 !important; /* --sw-muted; 6.09:1 on #fff, 5.7:1 on #f1f5f9 */
}
a.link-secondary:hover,
a.link-secondary:focus {
  color: #33475c !important;
}

/* --- Fix 2: captcha input perceivability (label itself is vendor-side) --- */
input.captcha_code {
  min-height: 44px;               /* WCAG 2.5.5 target size (AA best-effort) */
  border: 1px solid var(--sw-line, #cbd5df);
  border-radius: 8px;
  padding: 8px 12px;
}
input.captcha_code:focus-visible {
  outline: 2px solid var(--sw-cyan, #21b8f6);
  outline-offset: 2px;
}

/* --- Fix 3: links inside text blocks distinguishable without color ------- */
.upjet-native-home a:not([class]),
.faq-content a:not([class]),
.page-content a:not([class]),
article a:not([class]),
section.page a:not([class]),
footer a:not([class]),
.text-center.mb-5 a:not([class]) {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.upjet-native-home a:not([class]):hover,
.upjet-native-home a:not([class]):focus,
.faq-content a:not([class]):hover,
.faq-content a:not([class]):focus,
.page-content a:not([class]):hover,
.page-content a:not([class]):focus,
article a:not([class]):hover,
article a:not([class]):focus,
section.page a:not([class]):hover,
section.page a:not([class]):focus,
footer a:not([class]):hover,
footer a:not([class]):focus,
.text-center.mb-5 a:not([class]):hover,
.text-center.mb-5 a:not([class]):focus {
  text-decoration-thickness: 2px;
}

/* Screen-reader-only helper for future template-side labels */
.upjet-sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}