/*
 * Targeted WCAG 2.2 remediation for the supplied Matalia audit.
 * This file does not provide a generic colour overlay. It only supplies the
 * focus, form, ticker, footer and known audited-colour treatments used by the
 * server-side and client-side remediators.
 */
:root {
  --sa-focus-light: #ffffff;
  --sa-focus-dark: #003f72;
  --sa-border: #595959;
  --sa-blue-pass: #1a56db;
}

/* Screen-reader-only labels added for the audited unlabeled form fields. */
.sa-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* 2.4.1 - keyboard bypass link. */
.sa-skip-link {
  position: fixed !important;
  top: 8px !important;
  left: 8px !important;
  z-index: 2147483647 !important;
  transform: translateY(-180%) !important;
  padding: 10px 14px !important;
  color: #ffffff !important;
  background: #003f72 !important;
  border: 2px solid #ffffff !important;
  border-radius: 4px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
.sa-skip-link:focus,
.sa-skip-link:focus-visible {
  transform: translateY(0) !important;
}

/*
 * 1.4.11 / 2.4.7 - dual-colour 3px+ focus treatment.
 * The white inner outline remains visible over dark surfaces and the navy
 * outer ring remains visible on light surfaces.
 */
:where(a[href], button, input, select, textarea, summary, [role="button"], [tabindex]:not([tabindex="-1"])):focus {
  outline: 3px solid var(--sa-focus-light) !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 6px var(--sa-focus-dark) !important;
  text-decoration-thickness: max(2px, .12em) !important;
}
@supports selector(:focus-visible) {
  :where(a[href], button, input, select, textarea, summary, [role="button"], [tabindex]:not([tabindex="-1"])):focus:not(:focus-visible) {
    outline: none !important;
    box-shadow: none !important;
  }
}

/* 1.4.11 - form field outlines and borders. #595959 on white passes 3:1. */
:where(form) :where(input:not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]), select, textarea) {
  border-color: var(--sa-border) !important;
  border-width: 2px !important;
}
:where(form) :where(input, select, textarea):focus {
  border-color: var(--sa-focus-dark) !important;
}

/*
 * 1.4.3 - replacement for the audited #2175FF surface. White text on the
 * old #2175FF background is below AA; #1A56DB gives adequate contrast.
 * remediation.js adds this class to CSS-authored (not just inline) instances.
 */
.sa-contrast-audit-blue,
[style*="background:#2175FF"],
[style*="background: #2175FF"],
[style*="background-color:#2175FF"],
[style*="background-color: #2175FF"],
[style*="background:#2175ff"],
[style*="background: #2175ff"],
[style*="background-color:#2175ff"],
[style*="background-color: #2175ff"],
[style*="background:rgb(33,117,255)"],
[style*="background: rgb(33, 117, 255)"],
[style*="background-color:rgb(33,117,255)"],
[style*="background-color: rgb(33, 117, 255)"] {
  background-color: var(--sa-blue-pass) !important;
}
a[href*="saralmobile.matalia.co.in"] {
  color: #ffffff !important;
  background-color: var(--sa-blue-pass) !important;
}

/*
 * Footer contrast repair. These selectors intentionally do not add layout
 * containers or a search panel, so they cannot recreate the old broken footer.
 */
:where([class*="footer-section-3"], [class*="footer-section-4"], [class*="footer-section-5"])
  :where(p, span, small, strong, b, em, h1, h2, h3, h4, h5, h6, li, a) {
  color: #ffffff !important;
}
:where([class*="footer-section-3"], [class*="footer-section-4"], [class*="footer-section-5"]) a {
  text-decoration-color: currentColor !important;
}

/* Preserve the newsletter visual treatment while making field boundaries clear. */
.footer-section-1-3 input,
.footer-section-1-3 textarea,
.footer-section-1-3 select {
  color: #ffffff !important;
  background-color: #1a1c27 !important;
  border: 2px solid #a8b6c0 !important;
  opacity: 1 !important;
}
.footer-section-1-3 input::placeholder,
.footer-section-1-3 textarea::placeholder {
  color: #d5dee5 !important;
  opacity: 1 !important;
}

/* 2.2.2 - Pause / Play button created only for a detected ticker or marquee. */
.sa-ticker-control {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 40px !important;
  margin: 8px !important;
  padding: 7px 12px !important;
  color: #ffffff !important;
  background: #003f72 !important;
  border: 2px solid #ffffff !important;
  border-radius: 4px !important;
  font: inherit !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}
.sa-ticker-control[aria-pressed="true"] {
  background: #0f5c2e !important;
}
[data-sa-ticker].sa-ticker-paused,
[data-sa-ticker].sa-ticker-paused *,
.sa-ticker-motion.sa-ticker-paused {
  animation-play-state: paused !important;
  transition: none !important;
}
.sa-ticker-motion.sa-ticker-paused {
  animation: none !important;
  transform: var(--sa-frozen-transform) !important;
}

/* Optional user preferences. They never alter document language or content. */
html.sa-text-115 { font-size: 115% !important; }
html.sa-text-130 { font-size: 130% !important; }
html.sa-text-150 { font-size: 150% !important; }
body.sa-line-spacing :where(p, li, dd, dt, td, th, label, input, textarea, select) {
  line-height: 1.8 !important;
}
body.sa-underline-links a[href] {
  text-decoration: underline !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: .15em !important;
}
body.sa-reduce-motion *,
body.sa-reduce-motion *::before,
body.sa-reduce-motion *::after {
  animation-duration: .01ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: .01ms !important;
  scroll-behavior: auto !important;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Generated HTML site map (SC 2.4.5). */
.sa-html-sitemap ul {
  margin: 0;
  padding-left: 1.4rem;
}
.sa-html-sitemap li {
  margin: .45rem 0;
}
.sa-sitemap-search {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  align-items: end;
  margin: 1rem 0 1.5rem;
}
.sa-sitemap-search label {
  width: 100%;
  font-weight: 700;
}
.sa-sitemap-search input {
  min-height: 42px;
  border: 2px solid var(--sa-border);
}
.sa-sitemap-search button {
  min-height: 42px;
  padding: .4rem .8rem;
  color: #ffffff;
  background: #003f72;
  border: 2px solid #003f72;
}

/* 1.4.12 - optional text-spacing preference. The widget itself has no fixed
 * content heights, so this preference remains usable at browser zoom. */
body.sa-text-spacing :where(p, li, dd, dt, blockquote, td, th, label, input, textarea, select) {
  line-height: 1.5 !important;
  letter-spacing: .12em !important;
  word-spacing: .16em !important;
}
body.sa-text-spacing :where(p, li, dd, dt, blockquote) {
  margin-bottom: 2em !important;
}

/* Reflow guard for plugin-generated controls at 320 CSS pixels / 400% zoom. */
.sa-widget,
.sa-widget *,
.sa-ticker-control,
.sa-skip-link,
.sa-html-sitemap,
.sa-html-sitemap * {
  max-inline-size: 100%;
}
.sa-ticker-control,
.sa-skip-link {
  overflow-wrap: anywhere;
  white-space: normal;
}


/* Keep only legal/copyright text in the final footer bar at the intended theme
 * scale. This does not touch footer headings, menus or user-selected text size. */
.sa-footer-legal {
  font-size: 1rem !important;
  line-height: 1.45 !important;
  font-weight: 400 !important;
  letter-spacing: normal !important;
  word-spacing: normal !important;
}
.sa-footer-legal a {
  font-size: inherit !important;
  line-height: inherit !important;
}

/* v2.3.0: deterministic audited-text contrast treatments. The script only
   applies these classes after checking the rendered foreground/background. */
.sa-contrast-audit-blue {
  background-color: #0a2472 !important;
  color: #ffffff !important;
}
.sa-contrast-audit-blue :where(a, button, p, span, li, h1, h2, h3, h4, h5, h6, label) {
  color: #ffffff !important;
}
.sa-contrast-on-audit-blue { color: #ffffff !important; }
.sa-contrast-dark-text { color: #1a1a1a !important; }
.sa-contrast-light-text { color: #ffffff !important; }

/* Footer legal text is content, not a heading. The class is assigned only to
   copyright/developer-credit elements, never to the footer container. */
.sa-footer-legal,
.sa-footer-legal :where(a, span, strong, b) {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #ffffff !important;
  font-size: .9375rem !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  letter-spacing: normal !important;
  word-spacing: normal !important;
  text-transform: none !important;
}
.sa-footer-legal a {
  display: inline !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

/* Targeted high-contrast input boundaries, including Contact Form 7 wrappers. */
.wpcf7 :where(input:not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]), select, textarea),
.elementor-form :where(input:not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]), select, textarea) {
  border: 2px solid #595959 !important;
  opacity: 1 !important;
}

/* Layout guard for a locally inserted ticker control. */
[data-sa-ticker] + .sa-ticker-control,
.sa-ticker-control {
  vertical-align: middle !important;
  max-inline-size: calc(100vw - 24px) !important;
}

/* Legacy visual regression repair retained in v2.5.0.
 * These are intentional, component-scoped rules. They do not infer colours
 * from transparent theme layers, so they cannot blank accordion labels or
 * turn footer links dark. */

/* The audited Online Trading action: white text on a darker accessible blue. */
a.home-header-right-1-btn-1[href*="saralmobile.matalia.co.in"],
a.sa-audited-blue-action {
  color: #ffffff !important;
  background-color: #1a56db !important;
  border-color: #1a56db !important;
}

/* FAQ accordion: visible label, visible border, and consistent expanded state. */
.home-section-6 #Faq1 .accordion-item,
#Faq1 .accordion-item {
  background-color: #ffffff !important;
}
.home-section-6 #Faq1 .accordion-button,
#Faq1 .accordion-button {
  color: #1a1a1a !important;
  background-color: #ffffff !important;
  border: 2px solid #6b7a89 !important;
  box-shadow: none !important;
  opacity: 1 !important;
  text-align: left !important;
}
.home-section-6 #Faq1 .accordion-button.sa-accordion-expanded,
#Faq1 .accordion-button.sa-accordion-expanded {
  color: #ffffff !important;
  background-color: #0a2472 !important;
  border-color: #0a2472 !important;
}
.home-section-6 #Faq1 .accordion-button::after,
#Faq1 .accordion-button::after {
  filter: none !important;
}
.home-section-6 #Faq1 .accordion-button.sa-accordion-expanded::after,
#Faq1 .accordion-button.sa-accordion-expanded::after {
  filter: brightness(0) invert(1) !important;
}

/* Footer sections in the supplied theme use blue surfaces. Give every link,
 * list marker and normal text a deliberately light foreground. */
footer :where(.footer-section-1, .footer-section-2, .footer-section-3)
  :where(a, a:visited, p, span, li, small, strong, b, em, h1, h2, h3, h4, h5, h6, i, .bi) {
  color: #ffffff !important;
}
footer :where(.footer-section-1, .footer-section-2, .footer-section-3) a {
  text-decoration-color: currentColor !important;
}
footer .footer-section-1 a :where(span, i, .bi),
footer .footer-section-2 a :where(span, i, .bi),
footer .footer-section-3 a :where(span, i, .bi) {
  color: inherit !important;
}

/* Exactly one compact control for the investor-notice ticker group. */
.sa-ticker-control-wrap {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: .5rem 0 !important;
  margin: 0 !important;
}
footer .sa-ticker-control {
  min-height: 36px !important;
  margin: 0 !important;
  padding: .35rem .65rem !important;
  color: #ffffff !important;
  background: #003f72 !important;
  border: 2px solid #ffffff !important;
  border-radius: 4px !important;
  font-size: .9375rem !important;
  line-height: 1.2 !important;
}
footer .sa-ticker-control[aria-pressed="true"] {
  background: #0f5c2e !important;
}
[data-sa-ticker-group].sa-ticker-paused :where(marquee, .marquee-wrapper, .marquee, [class*="ticker"], [class*="scrolling"]) {
  animation-play-state: paused !important;
  transition: none !important;
}

/* v2.5.0: Matalia colour corrections for the supplied Matalia accessibility findings.
   These rules deliberately change only reported components. */

/* Header actions: white text on #ED3338 is 4.09:1. This darker red passes AA. */
:where(.desktop-top-bar-1, .home-header-section-2-top) .home-header-right-1-btn-1,
.home-header-right-1-btn-1 {
  color: #ffffff !important;
  background-color: #b91c1c !important;
  border-color: #b91c1c !important;
  text-decoration-color: currentColor !important;
}
:where(.desktop-top-bar-1, .home-header-section-2-top) .home-header-right-1-btn-1:visited,
.home-header-right-1-btn-1:visited {
  color: #ffffff !important;
}

/* Header Login: replace the reported low-contrast red label with white. */
#LoginMenu,
#LoginMenu.btn,
.home-header-right-1-btn-2 {
  color: #ffffff !important;
  background-color: #003f72 !important;
  border-color: #ffffff !important;
}

/* Dark blue investor and statistics panels. */
.home-section-4 .home-section-5-heading-1.row > h2,
.service-section-2 .home-section-5-heading-1.row > h2,
.service-section-2 .home-section-5-heading-1.row > h3,
.service-section-2 .service-section-2-box > h3,
.service-section-2 .service-section-2-box > p,
.home-section-4 .home-section-5-heading-1.row > h3 {
  color: #ffffff !important;
  text-decoration-color: currentColor !important;
}

/* Normal copy reported as #A1B1BC / #818D98 / #999 on light surfaces. */
.about-us-section-1-left > p,
.home-section-7-1-box > p,
#Trust > .home-section-2-sub-2.row > .col-md-5 > p,
.service-section-3 :where(.col-md-12, .container) :where(p, li, strong),
.service-section-4 :where(.col-md-12, .container) :where(p, li, strong),
.service-section-5 :where(.col-md-12, .container) :where(p, li, strong),
.service-section-6 :where(.col-md-12, .container) :where(p, li, strong),
.service-section-7 :where(.col-md-12, .container) :where(p, li, strong),
.service-section-8 :where(.col-md-12, .container) :where(p, li, strong),
.service-section-9 :where(.col-md-12, .container) :where(p, li, strong),
.service-section-10 :where(.col-md-12, .container) :where(p, li, strong) {
  color: #243746 !important;
}

/* Reported medium-grey copy over a photo/grey surface. */
.home-video-section-1-1 > p {
  color: #171717 !important;
  text-shadow: 0 1px 0 #ffffff !important;
}

/* Red active investor tab on blue had insufficient contrast. */
#ATTENTIONINVESTORS-tab,
#ATTENTIONINVESTORS-tab.nav-link,
#ATTENTIONINVESTORS-tab.nav-link.active,
#ATTENTIONINVESTORS-tab[aria-selected="true"] {
  color: #ffffff !important;
  background-color: #003f72 !important;
  border-color: #ffffff !important;
}

/* Telegram is an icon-only control. Its accessible name is written by the
   remediator; retain a visible, high-contrast target and focus boundary. */
.qltgm-toggle {
  outline-color: #003f72 !important;
}

/* Widget is deliberately fixed at the top-left on every screen. */
#sa-widget.sa-widget,
#sa-widget.sa-widget.sa-widget--top-left,
#sa-widget.sa-widget.sa-widget--top-right,
#sa-widget.sa-widget.sa-widget--bottom-left,
#sa-widget.sa-widget.sa-widget--bottom-right {
  top: max(12px, env(safe-area-inset-top)) !important;
  left: max(12px, env(safe-area-inset-left)) !important;
  right: auto !important;
  bottom: auto !important;
}

/* When the skip link receives focus it must win the top stacking layer without
   permanently hiding the requested top-left accessibility control. */
.sa-skip-link:focus,
.sa-skip-link:focus-visible {
  z-index: 2147483647 !important;
}


/* v2.5.0 — exact remediation for the Matalia blue-on-navy pairing.
 * The published #0D6EFD foreground on #1F3E82 surface is below the required
 * contrast threshold. The script only adds this class when that exact pair is
 * present; these component rules also protect the Knowledge Centre tab row
 * before dynamic content settles. */
.sa-contrast-on-matalia-navy,
.sa-contrast-on-matalia-navy:visited,
.sa-contrast-on-matalia-navy:hover,
.sa-contrast-on-matalia-navy:focus {
  color: #ffffff !important;
  text-decoration-color: currentColor !important;
}

#v-pills-tab :where(.nav-link, [role="tab"]),
.home-section-5 :where(.nav-pills .nav-link, [role="tab"][data-bs-toggle]),
.home-section-5 :where(.nav-pills .nav-link, [role="tab"][data-toggle]) {
  color: #ffffff !important;
  background-color: #003f72 !important;
  border: 2px solid #ffffff !important;
  text-decoration-color: currentColor !important;
}
#v-pills-tab :where(.nav-link, [role="tab"]):hover,
#v-pills-tab :where(.nav-link, [role="tab"]):focus,
#v-pills-tab :where(.nav-link, [role="tab"]).active,
.home-section-5 :where(.nav-pills .nav-link, [role="tab"]).active {
  color: #ffffff !important;
  background-color: #0a2472 !important;
  border-color: #ffffff !important;
}

/* An unresolved fragment control is semantically a keyboard-operable control,
 * not a malformed in-page link. It retains its existing theme appearance. */
[data-sa-fragment-control="true"] {
  cursor: pointer !important;
}