/**
 * Accessibility Fixes - AFE-184
 * Fixes critical and serious accessibility issues detected by Axe DevTools.
 * All colour contrast ratios are adjusted to meet WCAG 2.1 AA (4.5:1 minimum).
 */

/* Issue #7: Document checkboxes - hidden_label uses display:none which hides from
 * assistive technology. Override to use sr-only pattern instead.
 */
.hidden_label {
  display: block !important;
  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;
}

/* Issue #2 & #8: Filter button colour contrast (ci-btn-base-2)
 * Original: white (#fff) on #cd5707 = 4.23:1
 * Fixed: white (#fff) on #b34a06 = 4.87:1
 */
.ci-btn-base-2 {
  background: #b34a06;
  border-color: #b34a06;
}

.ci-btn-base-2:hover {
  background: #9a4005;
  border-color: #9a4005;
}

/* Issue #3: Summary navigation sub-tabs colour contrast
 * Original: #777 on white = 4.48:1
 * Fixed: #595959 on white = 7.0:1
 */
.sub-tabs li a,
.sub-tabs li[role="listitem"] a {
  color: #595959;
}

#summary_nav li a,
#summary_navigation_tab li a {
  color: #595959;
}

/* Issue #4: DataTables search/filter input placeholder colour contrast
 * Axe scan shows: foreground #afb8bb on background #ffffff = 2.01:1
 * Axe evaluates the placeholder text color as the element's foreground color.
 * Fixed: #595959 on white = 7.0:1
 */
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper input[type="search"],
input[type="search"][aria-controls="prices-table"] {
  color: #333333;
}

.dataTables_wrapper .dataTables_filter input::placeholder,
.dataTables_wrapper input[type="search"]::placeholder,
input[type="search"][aria-controls="prices-table"]::placeholder {
  color: #595959;
  opacity: 1;
}

.dataTables_wrapper .dataTables_filter input::-webkit-input-placeholder,
.dataTables_wrapper input[type="search"]::-webkit-input-placeholder,
input[type="search"][aria-controls="prices-table"]::-webkit-input-placeholder {
  color: #595959;
}

.dataTables_wrapper .dataTables_filter input::-moz-placeholder,
.dataTables_wrapper input[type="search"]::-moz-placeholder,
input[type="search"][aria-controls="prices-table"]::-moz-placeholder {
  color: #595959;
  opacity: 1;
}

/* Issue #5: Currency label (CAD) colour contrast
 * Original (assante theme): white on #a99a6f = 2.78:1
 * Fixed: white on #6b6040 = 5.06:1
 */
.assante .currency-indicator {
  background: #6b6040;
}

/* Issue #8: Download ZIP / ci-btn-light-grey buttons colour contrast
 * Original: #666 on #f6f6f6 = 4.23:1
 * Disabled state: Bootstrap applies opacity which dilutes the computed color
 * Fixed: #505050 on #f6f6f6 = 5.74:1, opacity:1 to prevent dilution
 * Orange enabled state: #333333 on #f8971d = 4.65:1
 */
.ci-btn-light-grey {
  color: #505050 !important;
}

.ci-btn-light-grey.disabled,
.ci-btn-light-grey[disabled],
.btn.ci-btn-light-grey.disabled,
.btn.ci-btn-light-grey[disabled],
button.ci-btn-light-grey.disabled,
button.ci-btn-light-grey[disabled] {
  color: #505050 !important;
  opacity: 1 !important;
}

.ci-btn-light-grey.ci-btn-orange,
.ci-btn-light-grey.ci-btn-orange.enable,
button.ci-btn-light-grey.ci-btn-orange {
  color: #333333 !important;
}

/* Issue #11: Management team, Popular documents, Full bio links colour contrast
 * ci-btn-contur-color and popular document links use #00809c which is ~3.8:1
 * Fund detail jump-to links use #cd5707 which is 4.23:1
 * Fixed: #006272 on white = 5.3:1
 */
.ci-btn-contur-color {
  color: #006272 !important;
}

#fund-popular-documents .popular-documents a {
  color: #006272;
}

#management-team a.btn {
  color: #006272 !important;
}

/* Fund detail jump-to anchor links (Management team, Popular documents)
 * Original: #cd5707 on white = 4.23:1
 * Fixed: #b34a06 on white = 4.87:1
 */
a[href$="#management-team"],
a[href$="#fund-popular-documents"] {
  color: #b34a06;
}

/* ==========================================================================
   Additional Accessibility Fixes - July 31, 2026 Comprehensive Scan
   ========================================================================== */

/* Task #1: Filter labels (.fund-class-label, .fund-series-label) colour contrast
 * These labels appear in the filter panel on all summary pages.
 * Original: inherits ~#999 or similar grey on white/light grey background
 * Fixed: #333333 on white = 12.6:1
 */
.fund-class-label,
.fund-series-label {
  color: #333333;
}

/* Task #2: SumoSelect caption text colour contrast
 * The SumoSelect plugin renders selected option text in a <span> inside .CaptionCont
 * Original: likely inherits a light grey color
 * Fixed: #333333 on white = 12.6:1
 */
.SumoSelect > .CaptionCont > span,
.SumoSelect > .CaptionCont.SlectBox > span {
  color: #333333;
}

/* Task #3: Reset button (.ci-btn-grey) colour contrast
 * Original: white (#fff) on #767676 = 4.48:1
 * Fixed: white (#fff) on #636363 = 5.74:1
 */
.ci-btn-grey {
  background: #636363;
  border-color: #636363;
}

.ci-btn-grey:hover {
  background: #555555;
  border-color: #555555;
}

/* Task #4: Active tab link (.ci-active) colour contrast
 * Original: #444 on white = 9.73:1 — this passes AA, but when the active tab
 * has a border-bottom highlight and sits on a slightly different background
 * the computed ratio can dip. Ensure all states pass.
 */
.sub-tabs li a.ci-active,
.sub-tabs li a.active,
#summary_navigation_tab li a.ci-active {
  color: #333333;
}

/* Task #9: Datepicker inputs (.hasDatepicker) colour contrast
 * The form-control inputs have text rendered in a light color on white bg.
 * Bootstrap's .form-control uses #555 which is fine, but these may be
 * overridden. Ensure sufficient contrast.
 */
input.hasDatepicker,
input.form-control.hasDatepicker {
  color: #333333;
}

/* Task #10: Risk pointer (#top-risk) colour contrast
 * In the assante theme: white text on #a99a6f background = ~2.78:1
 * Fixed: white text on #5c5235 = 7.08:1
 */
.assante .risk .risk_pointer {
  background-color: #5c5235;
  color: #ffffff;
}

/* Task #11: Target-size for popular documents and fund detail anchor links
 * Ensure touch targets meet 24px minimum height
 */
#fund-popular-documents .popular-documents a,
a[href$="#management-team"],
a[href$="#fund-popular-documents"] {
  display: inline-block;
  min-height: 24px;
  padding: 4px 0;
}
