/* ============================================================
   Fintrekk Capital — Accessibility overrides (WCAG 2.1 AA)
   Loaded AFTER style.css so these rules win the cascade.
   Non-destructive: remove this one <link> to revert everything.
   ============================================================ */

/* --- Skip link (WCAG 2.4.1) --- */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 10000;
  padding: 10px 16px;
  background: #0d1e64;
  color: #ffffff;
  font-weight: 600;
  border-radius: 0 0 4px 0;
  text-decoration: none;
}
.skip-link:focus {
  left: 0;
}

/* --- Visible keyboard focus on all interactive elements (WCAG 2.4.7) --- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #0b6d92 !important;
  outline-offset: 2px;
}
/* Fallback for browsers without :focus-visible */
a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus {
  outline: 3px solid #0b6d92 !important;
  outline-offset: 2px;
}
/* Theme sets outline:none on .customField / some buttons — force a visible focus (WCAG 2.4.7) */
.customField:focus,
.customField:focus-visible,
input.customField:focus,
select.customField:focus,
textarea.customField:focus,
button:focus,
.btn:focus,
.button_w:focus,
.close:focus {
  outline: 3px solid #0b6d92 !important;
  outline-offset: 2px;
}

/* --- Screen-reader-only utility --- */
.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;
}

/* --- Reset the elements we converted from <b>/<span> to <button> so they
       keep their original look (WCAG 2.1.1 keyboard, no visual change) --- */
button.menu,
button.closeMenu,
button.products-toggle {
  background: transparent;
  border: 0;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  line-height: inherit;
}
/* Products trigger should match the other nav links visually */
button.products-toggle {
  display: inline-block;
  text-transform: inherit;
}

/* --- Products dropdown: open on hover, keyboard focus, or aria-expanded --- */
.has-sub:hover .subNav,
.has-sub:focus-within .subNav,
.has-sub.open .subNav {
  display: block;
}

/* ============================================================
   CONTRAST FIXES — darken to pass, hue preserved (WCAG 1.4.3)
   Applied ONLY where the accent sits on a light background.
   Amber on the dark footer (#3E4532) is left untouched (passes).
   ============================================================ */

/* Amber (#FEC744 ~1.5:1) on WHITE nav dropdown → darkened amber (~4.6:1) */
.navWrap a,
.navWrap a:hover {
  color: #7a5b00;
}

/* Amber links/text sitting on light/white surfaces */
.btn-link,
.coupon-data span,
.subscribeBoxWrap .subscribeBox .subscribeContent b,
.mediaBox a {
  color: #7a5b00;
}

/* Muted grey text (#999999 ~2.85:1) on white → #767676 (~4.54:1) */
.form p,
.form i,
.cancelBtn,
.selectWrap label {
  color: #767676;
}

/* Input borders (#999999 ~2.85:1) → #767676 meets 3:1 non-text (WCAG 1.4.11) */
.customField,
.form-control {
  border-color: #767676;
}

/* Error red (#e3000f ~4.0:1) on white → #c1000d (~5:1) */
.changeQueryMsg,
.alertmsg,
.error {
  color: #c1000d;
}

/* Primary amber button: ensure dark text on amber (contrast ~8:1) */
.button_w {
  color: #1a1a1a;
}

/* ============================================================
   EXTENDED CONTRAST FIXES — verified against staging with axe-core.
   Theme sets these via specific selectors, so !important is used to win.
   All keep hue, darkened to meet WCAG 1.4.3 (4.5:1 on their background).
   ============================================================ */

/* Form field labels: #999999 (2.84:1) -> #595959 (~7:1) */
.customFieldLabel { color: #595959 !important; }

/* Footer legal links: #666666 on #E1E0C7 cream (4.28:1) -> #454545 (~7:1) */
footer .footerBottom ul li a { color: #454545 !important; }
footer .footerBottom ul li a:hover { color: #1f1f1f !important; }

/* Teal headings: #499195 (~3.4:1) -> #2f6063 (~6:1) */
.headWrap h2,
.commanHead h2,
.aboutTabs .aboutTabsLeft .aboutTabsContent h2,
.subscribeBoxWrap .subscribeBox .subscribeHead h2,
footer .footerForm .contactForm h2,
.herobanner .herobannerReding ul li .redingBox span { color: #2f6063 !important; }

/* Green price / plan text: #32B04A (2.82:1) -> #1f7a34 (~4.6:1) */
.customRadio label,
.subscribeBoxWrap .subscribeBox .subscribeContent h3 { color: #1f7a34 !important; }
/* Matching non-text (radio indicator) 1.4.11 */
.customRadio label input:checked + b,
.customRadio label input:checked + b::before { background: #1f7a34 !important; border-color: #1f7a34 !important; }

/* "Prices exclusive of GST" small: #adadad (2.24:1) -> #6a6a6a (~4.7:1) */
.subscribeBoxWrap .subscribeBox .subscribeContent small { color: #6a6a6a !important; }

/* Login / register / reminder amber links on white: #FEC744 (1.55:1) -> #7a5b00 (~4.6:1) */
.rminderWRap a, .rminderWRap a:hover,
.loginFooter a, .loginFooter a:hover { color: #7a5b00 !important; }

/* Base link colour: theme sets a { color:#54bde2 } (2.15:1) for plain content links
   (e.g. SEBI links on Investor Charter). Darken to #176a8f (~5:1). More specific
   rules above (nav, footer, entry) keep their own colours. */
a { color: #176a8f; }

/* NOTE: .mediaBox and .loginFooter backgrounds should be confirmed on
   staging — if either sits on a DARK panel, remove that selector from the
   amber-darkening block above so the original amber is kept there. */

/* ============================================================
   MOTION — respect prefers-reduced-motion (WCAG 2.3.3 / 2.2.2)
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

/* --- Hero-carousel Pause/Play control (WCAG 2.2.2 Pause, Stop, Hide) --- */
.slider-pause-btn {
  position: absolute;
  z-index: 20;
  right: 16px;
  bottom: 16px;
  min-width: 44px;
  min-height: 44px;
  padding: 8px 12px;
  border: 2px solid #ffffff;
  border-radius: 4px;
  background: rgba(13, 30, 100, 0.85);
  color: #ffffff;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  line-height: 1;
}
.slider-pause-btn:hover {
  background: #0d1e64;
}
.herobanner,
.herobannerImage {
  position: relative;
}

/* ============================================================
   ROUND-2 (manual / screen-reader remarks) — WCAG 2.1.1 / 1.3.1 / 4.1.2
   ============================================================ */

/* Sort toggles on /user: converted <span> icons -> real <button> so they are
   keyboard-operable and announce a purpose. Keep the original icon look. */
button.sort-icon {
  background: none;
  border: 0;
  padding: 0;
  margin-left: 5px;
  font: inherit;
  line-height: 1;
  color: #555;
  cursor: pointer;
  vertical-align: middle;
}
button.sort-icon:focus {
  outline: 3px solid #0b6d92 !important;
  outline-offset: 2px;
}

/* Accessible accordion (product FAQ + FAQs page): question <h3> now wraps a
   <button aria-expanded>; answer panel is toggled with the hidden attribute so
   collapsed answers are removed from the screen-reader (not just visually hidden). */
.collapseWrap h3 .collapseToggle {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
}
.collapseWrap h3 .collapseToggle:focus {
  outline: 3px solid #0b6d92 !important;
  outline-offset: 2px;
}
.collapseContent[hidden] { display: none !important; }

/* Home "Subscribe Now": was a styled dead <a href="javascript:;">, now a real
   <button>. Mirror the old label look; add pointer + focus since it now acts. */
.subscribeBoxWrap .subscribeBox .subscribeFooter .subscribeNowBtn {
  display: block;
  width: 100%;
  text-align: center;
  background: none;
  border: 0;
  padding: 0;
  color: #000000;
  font: inherit;
  line-height: 32px;
  height: 32px;
  cursor: pointer;
}
.subscribeBoxWrap .subscribeBox .subscribeFooter .subscribeNowBtn[disabled] {
  cursor: default;
  opacity: 0.75;
}
.subscribeBoxWrap .subscribeBox .subscribeFooter .subscribeNowBtn:focus {
  outline: 3px solid #0b6d92 !important;
  outline-offset: 2px;
}

/* Required-field marker on forms (WCAG 3.3.2) */
.req-mark { color: #c1000d; font-weight: 700; }
.req-note { color: #595959; font-size: 0.9em; margin: 0 0 8px; }

/* Enumerated policy blocks presented as semantic lists (WCAG 1.3.1).
   Keep the heading text; the list supplies the A/B/C… / 1.2.3… enumeration. */
ol.charterList { list-style: upper-alpha; padding-left: 1.5em; }
ol.conductList { list-style: decimal; padding-left: 1.5em; }
ol.charterList > li,
ol.conductList > li { margin-bottom: 1em; }
ol.charterList > li::marker,
ol.conductList > li::marker { font-weight: 700; }