$mask: url("data:image/svg+xml;utf8,<svg fill='currentColor' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='m16.7 7.1-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z'/></svg>");

ol.is-style-checklist,
ul.is-style-checklist {
  list-style: none;

  ul {
    list-style: none;
  }

  li {
    width: 100%;
    position: relative;

    &::before {
      content: "";
      mask: $mask;
      -webkit-mask: $mask;
      width: 1.5em;
      height: 1.5em;
      display: inline-block !important;
      background: var(--wp--preset--color--primary-color);
      margin-left: -1.5em;
      position: absolute;
    }
  }

  &.has-text-color li::before,
  .has-text-color li::before,
  .has-text-color::before {
    background: currentColor;
  }
}
