/* Back button always white */
.back-btn i,
.back-btn .fas {
  color: white !important;
}

/* ── Temporary tick / cross / back icons using system font ──────────────────
   Overrides Font Awesome glyph with plain Unicode so icons always render
   on iOS Safari regardless of font loading status. Remove this block once
   the Font Awesome font issue is fully resolved in production.
   ─────────────────────────────────────────────────────────────────────── */

.fa-check,
.fa-times {
  font-family: -apple-system, BlinkMacSystemFont, Arial, sans-serif !important;
  font-style: normal !important;
}

.fa-check::before {
  content: "✓" !important;
  font-family: -apple-system, BlinkMacSystemFont, Arial, sans-serif !important;
  font-weight: bold !important;
}

.fa-times::before {
  content: "✗" !important;
  font-family: -apple-system, BlinkMacSystemFont, Arial, sans-serif !important;
  font-weight: bold !important;
}

/* Arrow-left: SVG mask so it renders as a clean white icon on all browsers */
.fa-arrow-left::before {
  content: none !important;
}
.fa-arrow-left {
  display: inline-block !important;
  width: 1em !important;
  height: 1em !important;
  background-color: currentColor !important;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M257.5 445.1l-22.2 22.2c-9.4 9.4-24.6 9.4-33.9 0L7 273c-9.4-9.4-9.4-24.6 0-33.9L201.4 44.7c9.4-9.4 24.6-9.4 33.9 0l22.2 22.2c9.5 9.5 9.3 25-.4 34.3L136.6 216H424c13.3 0 24 10.7 24 24v32c0 13.3-10.7 24-24 24H136.6l120.5 114.8c9.8 9.3 10 24.8.4 34.3z'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M257.5 445.1l-22.2 22.2c-9.4 9.4-24.6 9.4-33.9 0L7 273c-9.4-9.4-9.4-24.6 0-33.9L201.4 44.7c9.4-9.4 24.6-9.4 33.9 0l22.2 22.2c9.5 9.5 9.3 25-.4 34.3L136.6 216H424c13.3 0 24 10.7 24 24v32c0 13.3-10.7 24-24 24H136.6l120.5 114.8c9.8 9.3 10 24.8.4 34.3z'/%3E%3C/svg%3E") !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  vertical-align: -0.125em !important;
}
