.icon-arrow-diagonal.icon-before:before {
  content: "";
  -webkit-mask-image: url(../../images/arrow-diagonal-white.svg);
          mask-image: url(../../images/arrow-diagonal-white.svg);
  background-color: var(--bs-btn-color);
  display: inline-block;
  vertical-align: middle;
  width: 1em;
  height: 1em;
  
  margin-right: 1em;
}

[dir="rtl"] .icon-arrow-diagonal.icon-before:before {
  margin-right: 0;
  
  margin-left: 1em;
}

.icon-arrow-diagonal.icon-after:after {
  display: inline-block;
  vertical-align: middle;
  width: 1em;
  height: 1em;
  
  margin-left: 1em;
  content: "";
  -webkit-mask-image: url(../../images/arrow-diagonal-white.svg);
          mask-image: url(../../images/arrow-diagonal-white.svg);
  background-color: var(--bs-btn-color);
}

[dir="rtl"] .icon-arrow-diagonal.icon-after:after {
  margin-left: 0;
  
  margin-right: 1em;
}