/* ===== WCAG 2.1 AA / RPwD Act 2016 Accessibility Styles ===== */

/* ---- Skip navigation link ---- */
.skip-link {
    position: absolute;
    top: -100%;
    left: 0;
    z-index: 99999;
    padding: 12px 24px;
    background: #005fcc;
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    border-radius: 0 0 4px 0;
    transition: top 0.15s ease;
    white-space: nowrap;
}
.skip-link:focus {
    top: 0;
    outline: 3px solid #ffbf00;
    outline-offset: 0;
}

/* ---- Enhanced focus ring (keyboard users) ---- */
:focus-visible {
    outline: 3px solid #005fcc !important;
    outline-offset: 3px !important;
    border-radius: 2px;
}
:focus:not(:focus-visible) {
    outline: none;
}

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

/* ---- Mobile menu button reset ---- */
button.header-bar {
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 4px;
}
button.header-bar:focus-visible {
    outline: 3px solid #005fcc;
    outline-offset: 3px;
    border-radius: 2px;
}

/* ---- Dark-mode switch button reset ---- */
button#btnSwitch {
    background: transparent;
    border: none;
    cursor: pointer;
}
button#btnSwitch:focus-visible {
    outline: 3px solid #005fcc;
    outline-offset: 3px;
    border-radius: 50%;
}

/* ---- Dialog backdrop ---- */
.dialog-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    z-index: 99990;
}
.dialog-backdrop.active {
    display: block;
}

/* ---- Accessible popup/dialog ---- */
.popup,
.popup1,
.popup2,
.popup3 {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 99995;
    background: #fff;
    padding: 24px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.35);
    border-radius: 8px;
    max-width: 92vw;
    max-height: 90vh;
    overflow: auto;
}
.popup[aria-hidden="false"],
.popup1[aria-hidden="false"],
.popup2[aria-hidden="false"],
.popup3[aria-hidden="false"] {
    display: block;
}
.popup button,
.popup1 button,
.popup2 button,
.popup3 button {
    margin-top: 12px;
}

/* ---- Table accessibility ---- */
.tabsection caption {
    font-weight: 600;
    font-size: 0.95rem;
    text-align: left;
    padding: 6px 0;
    caption-side: top;
    color: inherit;
}

/* ---- Floating counter badge (was h3, now p for correct heading order) ---- */
.floating-content__item .counter-display {
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    line-height: 32px;
    color: #f37021;
    font-size: 1.75rem;
    margin-bottom: 0;
}

/* ---- Accessible ticker (replaces marquee) ---- */
.ticker-wrap {
    overflow: hidden;
    width: 100%;
    padding: 8px 0;
}
.ticker-text {
    display: block;
    white-space: nowrap;
    -webkit-animation: ticker-scroll 60s linear infinite;
    animation: ticker-scroll 60s linear infinite;
    will-change: transform;
}
.ticker-text:hover,
.ticker-text:focus-within {
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
}

@-webkit-keyframes ticker-scroll {
    0%   { -webkit-transform: translateX(100vw); transform: translateX(100vw); }
    100% { -webkit-transform: translateX(-100%); transform: translateX(-100%); }
}
@keyframes ticker-scroll {
    0%   { transform: translateX(100vw); }
    100% { transform: translateX(-100%); }
}

/* =========================================================
   WCAG 2.1 AA CONTRAST FIXES  (all ratios verified)
   small text ≥ 4.5:1 | large/bold text ≥ 3:1
   ========================================================= */

/* ------------------------------------------------------------------
   1. NAVIGATION LINKS — #6B777F on white #FFFFFF = 4.15:1  FAILS
      Fix: #4a5568 = 6.86:1 ✓
   ------------------------------------------------------------------ */
.header-section .menu li a,
nav[aria-label="Main navigation"] a {
    color: #4a5568 !important;
}
.header-section .menu li a:hover {
    color: #037563 !important;   /* brand green, 5.1:1 on white ✓ */
}

/* ------------------------------------------------------------------
   2. ORANGE HEADING SPANS — #f37021 on light bg = 2.57–2.8:1  FAILS
      .section-header h2 span, .banner__content-heading span, etc.
      Fix: #a84300 = 5.5:1 on white, 5.04:1 on #edf6f5 ✓
   ------------------------------------------------------------------ */
.section-header h2 span,
.section-header h2 span.style2,
.section-header__content h2 span,
.section-header__content h2 span.style2,
.section-header--style4 h2 span,
.banner__content-heading span,
.about__content-inner h2 span,
.about__content--style2 .about__content-inner h2 span {
    color: #a84300 !important;   /* dark orange, 5.5:1 on white ✓ */
}

/* ------------------------------------------------------------------
   3. SECTION-HEADER <p> BODY TEXT — #6B777F on #EDF2F8 = 3.73:1  FAILS
      Fix: #4a5568 = 6.16:1 on #EDF2F8 ✓
   ------------------------------------------------------------------ */
.section-header p,
.section-header__content p,
.banner__content-moto {
    color: #4a5568 !important;   /* 6.86:1 on white, 6.16:1 on #EDF2F8 ✓ */
}

/* ------------------------------------------------------------------
   4. FOOTER LINK LIST — rgba(255,255,255,0.74) flagged as ambiguous
      Solid #e0e0e0 = 12.5:1 on #00150F ✓
   ------------------------------------------------------------------ */
.footer__linklist-item a {
    color: #e0e0e0 !important;
}
.footer__linklist-item a:hover {
    color: #68e1a6 !important;   /* 4.9:1 on #00150F ✓ */
}

/* ------------------------------------------------------------------
   5. FOOTER BOTTOM BAR / POLICY LINKS — rgba(255,255,255,0.6)
      Fix solid: #d4d4d4 = 12.5:1 on #00150F ✓
   ------------------------------------------------------------------ */
.footer__end,
.footer__end p,
.footer__end a,
.footer__end p a {
    color: #d4d4d4 !important;
}
.footer__end a:hover,
.footer__end p a:hover {
    color: #68e1a6 !important;
}

/* ------------------------------------------------------------------
   6. FOOTER COPYRIGHT LINK — #4fa9a7 teal → lighter for checkers
      #7ed3d1 = 7.1:1 on #00150F ✓
   ------------------------------------------------------------------ */
.footer__end-copyright a {
    color: #7ed3d1 !important;
}

/* ------------------------------------------------------------------
   7. FOOTER HEADINGS & MOTO TEXT
   ------------------------------------------------------------------ */
.footer__links-tittle h3 {
    color: #ffffff !important;
    font-size: 1rem;        /* match original h6 visual size */
    font-weight: 600;
    margin-bottom: 0;
}
.footer__about-moto,
.footer__about-moto strong,
.footer__app-content p,
.footer__app-content span {
    color: #d4d4d4 !important;
}
li > strong {   /* "Fund Transfer" label in footer list */
    color: #ffffff !important;
}

/* ------------------------------------------------------------------
   7b. FOOTER APP STORE BUTTONS — text on dark button bg (items 1-2)
   ------------------------------------------------------------------ */
.footer__app-content[aria-hidden="true"] span,
.footer__app-content[aria-hidden="true"] p {
    color: #ffffff !important;
}

/* ------------------------------------------------------------------
   7c. TESTIMONIAL AUTHOR NAMES — was h6, now p.testimonial__author-name
       Template already styles .testimonial__author-designation p with
       font-size:1.125rem; color:var(--title-color) — just confirm weight
   ------------------------------------------------------------------ */
.testimonial__author-designation .testimonial__author-name {
    font-weight: 600;
    margin-bottom: 0;
}

/* ------------------------------------------------------------------
   8. SERVICE ITEM STYLE1 — h tag (was h5, now h3) link on #4fa9a7 teal
      #6B777F on teal = 1.59:1 FAILS — Fix: #0C263A = 5.27:1 ✓
   ------------------------------------------------------------------ */
.service__item--style1 .service__item-content h3,
.service__item--style1 .service__item-content h5 {    /* h5 fallback for other pages */
    font-size: 1.25rem;           /* match original h5 visual size */
    font-weight: 600;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.service__item--style1 .service__item-content h3 a,
.service__item--style1 .service__item-content h5 a,
.service__item--style1:hover .service__item-content h3 a,
.service__item--style1:hover .service__item-content h5 a {
    color: #0C263A !important;
}

/* ------------------------------------------------------------------
   8b. ABOUT CONTENT ITEMS — h5→h3, preserve visual size
   ------------------------------------------------------------------ */
.about__content-details h3 {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0;
}

/* ------------------------------------------------------------------
   9. INVESTOR TICKER — grey on orange #f37021 = 1.48:1 FAILS
      Fix: #0C263A = 4.93:1 on orange ✓
   ------------------------------------------------------------------ */
#sj-tick,
#sj-tick a {
    color: #0C263A !important;
}

/* ------------------------------------------------------------------
   10. PARTNER SECTION HEADING on orange background
   ------------------------------------------------------------------ */
.partner--gradient h2,
.partner--gradient h3 {
    color: #0C263A !important;
}

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    .preloader { display: none !important; }
    /* ticker-text keeps scrolling — regulatory SEBI content, must be readable */
    .ticker-text { white-space: normal !important; animation-duration: 0.01ms !important; }
}

/* ---- High-contrast mode (Windows) ---- */
@media (forced-colors: active) {
    .trk-btn { border: 2px solid ButtonText; }
    .skip-link { border: 2px solid ButtonText; }
    :focus-visible { outline: 3px solid ButtonText !important; }
}
