/* https://github.com/damiankorcz/Alternative-Checkboxes-Reference-Set */

input[type="checkbox"]:checked {
  border: none;
}

input[type="checkbox"]:checked::after,
.checklist-plugin-main .checked:after {
  top: 0;
  inset-inline-start: 0;
  -webkit-mask-position: 50% 50%;
  -webkit-mask-size: 100% 100%;
}

input[type="checkbox"][data-indeterminate="true"]:not(:checked) {
  --checkbox-color: var(--checkbox-border-color) !important;
  background-color: var(--checkbox-color);

  &:after {
    top: 0;
    inset-inline-start: 0;
    -webkit-mask-position: 50% 50%;
    -webkit-mask-size: 100% 100%;
    background-color: var(--checkbox-marker-color);
    width: var(--checkbox-size);
    height: var(--checkbox-size);
  }
}

li[data-task],
input[type="checkbox"][data-task]:checked {
  &[data-task=">"],
  &[data-task="<"],
  &[data-task="*"],
  &[data-task='"'],
  &[data-task="“"],
  &[data-task="l"],
  &[data-task="b"],
  &[data-task="S"],
  &[data-task="I"],
  &[data-task="p"],
  &[data-task="c"],
  &[data-task="f"],
  &[data-task="k"],
  &[data-task="w"],
  &[data-task="u"],
  &[data-task="d"],
  &[data-task="B"],
  &[data-task="a"],
  &[data-task="n"],
  &[data-task="R"],
  &[data-task="t"],
  &[data-task="P"],
  &[data-task="L"] {
    &,
    input[type="checkbox"]:checked {
      --checkbox-color: transparent;

      &:hover {
        background-color: transparent;

        &::after {
          background-color: var(--checkbox-color-hover);
        }
      }
    }
  }
}

// Incomplete
input[data-task="/"]:checked,
li[data-task="/"] > input:checked,
li[data-task="/"] > p > input:checked {
  border: 1px solid var(--interactive-accent);
  background: linear-gradient(to right, var(--interactive-accent) 50%, transparent 50%);
  &::after {
    display: none;
  }
}

// Done
.task-list-item:not([data-task]) input[type="checkbox"],
.checked:after,
div:checked::after,
input[type="checkbox"]:checked::after,
.tasks-modal-checkbox:checked::after {
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 20 20'%3e%3cpath fill='black' d='m12.998 6.084-4.17 6.7-1.982-2.56c-.244-.322-.46-.41-.742-.41a.788.788 0 0 0-.782.801c0 .225.088.44.235.635l2.45 3.008c.255.342.528.478.86.478.332 0 .615-.156.82-.478l4.59-7.227c.118-.205.245-.43.245-.644 0-.46-.4-.752-.83-.752-.255 0-.508.156-.694.449Z'/%3e%3c/svg%3e");
}

// Canceled
input[data-task="-"]:checked,
li[data-task="-"] > input:checked,
li[data-task="-"] > p > input:checked {
  --checkbox-color: var(--checkbox-border-color);

  &:after {
    -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 20 20'%3e%3cpath fill='black' d='M6.025 9.121c-.595 0-.966.313-.966.86 0 .537.39.84.966.84h7.891c.566 0 .947-.303.947-.84 0-.547-.361-.86-.947-.86h-7.89Z'/%3e%3c/svg%3e");
  }
}

// Forwarded
input[data-task=">"]:checked::after,
li[data-task=">"] > input:checked::after,
li[data-task=">"] > p > input:checked::after {
  background-color: var(--text-normal);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='22' height='18' fill='none' viewBox='0 0 22 18'%3e%3cpath fill='black' d='M11.533 0c.479 0 .801.205 1.319.693L20.557 7.9c.38.362.498.723.498 1.055 0 .322-.127.693-.498 1.045l-7.705 7.275c-.47.44-.86.635-1.338.635-.664 0-1.153-.488-1.153-1.142v-3.73h-.283c-3.78 0-6.172.956-7.871 4.15-.342.625-.791.722-1.201.722C.479 17.91 0 17.441 0 16.602c0-7.217 3.057-11.72 10.078-11.72h.283v-3.69C10.361.536 10.85 0 11.533 0Z'/%3e%3c/svg%3e");
}

// Scheduling
input[data-task="<"]:checked::after,
li[data-task="<"] > input:checked::after,
li[data-task="<"] > p > input:checked::after {
  background-color: var(--color-blue);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='18' fill='none' viewBox='0 0 20 18'%3e%3cpath fill='black' d='M3.066 17.979h13.34c2.041 0 3.057-1.016 3.057-3.028V3.027C19.463 1.016 18.447 0 16.406 0H3.066C1.026 0 0 1.006 0 3.027v11.924c0 2.022 1.025 3.027 3.066 3.027Zm-.146-1.573c-.87 0-1.348-.459-1.348-1.367V5.83c0-.898.479-1.367 1.348-1.367h13.613c.87 0 1.358.469 1.358 1.367v9.21c0 .907-.489 1.366-1.358 1.366H2.92ZM7.832 7.97h.576c.342 0 .45-.098.45-.44v-.576c0-.342-.108-.45-.45-.45h-.576c-.342 0-.459.108-.459.45v.576c0 .342.117.44.459.44Zm3.242 0h.576c.342 0 .46-.098.46-.44v-.576c0-.342-.118-.45-.46-.45h-.576c-.342 0-.459.108-.459.45v.576c0 .342.117.44.46.44Zm3.242 0h.577c.341 0 .459-.098.459-.44v-.576c0-.342-.118-.45-.46-.45h-.576c-.341 0-.449.108-.449.45v.576c0 .342.108.44.45.44ZM4.59 11.162h.566c.352 0 .46-.098.46-.44v-.575c0-.342-.108-.44-.46-.44H4.59c-.352 0-.46.098-.46.44v.576c0 .341.108.44.46.44Zm3.242 0h.576c.342 0 .45-.098.45-.44v-.575c0-.342-.108-.44-.45-.44h-.576c-.342 0-.459.098-.459.44v.576c0 .341.117.44.459.44Zm3.242 0h.576c.342 0 .46-.098.46-.44v-.575c0-.342-.118-.44-.46-.44h-.576c-.342 0-.459.098-.459.44v.576c0 .341.117.44.46.44Zm3.242 0h.577c.341 0 .459-.098.459-.44v-.575c0-.342-.118-.44-.46-.44h-.576c-.341 0-.449.098-.449.44v.576c0 .341.108.44.45.44ZM4.59 14.365h.566c.352 0 .46-.107.46-.449v-.576c0-.342-.108-.44-.46-.44H4.59c-.352 0-.46.098-.46.44v.576c0 .342.108.45.46.45Zm3.242 0h.576c.342 0 .45-.107.45-.449v-.576c0-.342-.108-.44-.45-.44h-.576c-.342 0-.459.098-.459.44v.576c0 .342.117.45.459.45Zm3.242 0h.576c.342 0 .46-.107.46-.449v-.576c0-.342-.118-.44-.46-.44h-.576c-.342 0-.459.098-.459.44v.576c0 .342.117.45.46.45Z'/%3e%3c/svg%3e");
}

// Question
input[data-task="?"]:checked,
li[data-task="?"] > input:checked,
li[data-task="?"] > p > input:checked,
input[type="checkbox"][data-indeterminate="true"]:not(:checked) {
  --checkbox-color: var(--color-pink);
  border: none;

  &:hover {
    background-color: var(--checkbox-color-hover);
  }

  &:after {
    -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 20 20'%3e%3cpath fill='black' d='M8.643 14.004c0 .576.507 1.045 1.093 1.045s1.094-.46 1.094-1.045c0-.586-.498-1.055-1.094-1.055-.595 0-1.093.479-1.093 1.055ZM6.924 6.553a1.665 1.665 0 0 0-.088.498c0 .449.361.693.693.693.342 0 .567-.166.752-.4l.176-.244c.361-.586.879-.918 1.553-.918.908 0 1.504.517 1.504 1.279 0 .684-.42 1.016-1.3 1.63-.722.509-1.269 1.036-1.269 2.032v.127c0 .527.293.8.81.8.509 0 .821-.322.821-.722v-.117c0-.566.322-.928 1.026-1.387.976-.644 1.68-1.23 1.68-2.441 0-1.68-1.495-2.569-3.214-2.569-1.738 0-2.87.811-3.144 1.739Z'/%3e%3c/svg%3e");
  }
}

// Important
input[data-task="!"]:checked,
li[data-task="!"] > input:checked,
li[data-task="!"] > p > input:checked {
  --checkbox-color: var(--color-orange);

  &:after {
    -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 20 20'%3e%3cpath fill='black' d='M8.867 14.004c0 .576.508 1.045 1.094 1.045.586 0 1.094-.46 1.094-1.045 0-.586-.498-1.055-1.094-1.055-.596 0-1.094.479-1.094 1.055Zm.166-8.35.127 5.323c.01.517.293.8.8.8.49 0 .772-.273.782-.8l.137-5.313c.01-.518-.39-.898-.928-.898-.547 0-.928.37-.918.888Z'/%3e%3c/svg%3e");
  }
}

// Star
input[data-task="*"]:checked::after,
li[data-task="*"] > input:checked::after,
li[data-task="*"] > p > input:checked::after {
  background-color: var(--color-yellow);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='22' height='21' fill='none' viewBox='0 0 22 21'%3e%3cpath fill='black' d='M4.161 20.547c.4.312.908.205 1.514-.235l5.166-3.798 5.176 3.799c.605.439 1.103.546 1.513.234.4-.303.488-.8.244-1.514l-2.04-6.074 5.214-3.75c.606-.43.85-.879.694-1.367-.157-.469-.616-.694-1.368-.694h-6.396l-1.944-6.064C11.7.361 11.35 0 10.841 0c-.498 0-.85.361-1.084 1.084L7.813 7.148H1.417c-.752 0-1.211.225-1.367.694-.166.488.088.937.693 1.367l5.215 3.75-2.041 6.074c-.244.713-.156 1.211.244 1.514Z'/%3e%3c/svg%3e");
}

// Quote
input[data-task='"']:checked::after,
li[data-task='"'] > input:checked::after,
li[data-task='"'] > p > input:checked::after,
input[data-task="“"]:checked::after,
li[data-task="“"] > input:checked::after,
li[data-task="“"] > p > input:checked::after {
  background-color: var(--color-purple);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='22' height='21' fill='none' viewBox='0 0 22 21'%3e%3cpath fill='black' d='M21.523 4.473v7.48c0 2.861-1.562 4.463-4.472 4.463h-6.602l-3.525 3.223c-.46.43-.742.625-1.123.625-.557 0-.87-.4-.87-1.006v-2.842h-.458C1.563 16.416 0 14.824 0 11.953v-7.48C0 1.602 1.563 0 4.473 0H17.05c2.91 0 4.472 1.611 4.472 4.473ZM5.898 7.148c0 1.143.713 2.032 1.856 2.032.42 0 .84-.069 1.103-.4h.079a2.863 2.863 0 0 1-1.797 1.542c-.381.098-.489.254-.489.498 0 .254.215.47.498.47 1.016 0 3.057-1.212 3.057-3.77 0-1.368-.879-2.413-2.187-2.413-1.211 0-2.12.84-2.12 2.041Zm5.44 0c0 1.143.713 2.032 1.846 2.032.43 0 .85-.069 1.113-.4h.078a2.855 2.855 0 0 1-1.807 1.542c-.361.098-.478.254-.478.498 0 .254.215.47.498.47 1.016 0 3.057-1.212 3.057-3.77 0-1.368-.89-2.413-2.198-2.413-1.21 0-2.11.84-2.11 2.041Z'/%3e%3c/svg%3e");
}

// Location
input[data-task="l"]:checked::after,
li[data-task="l"] > input:checked::after,
li[data-task="l"] > p > input:checked::after {
  background-color: var(--color-red);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='21' fill='none' viewBox='0 0 8 21'%3e%3cpath fill='black' d='M7.334 3.682A3.65 3.65 0 0 1 4.57 7.236V16.3c0 2.89-.508 4.453-.908 4.453-.39 0-.908-1.572-.908-4.453V7.236A3.65 3.65 0 0 1 0 3.682C0 1.66 1.63 0 3.662 0a3.676 3.676 0 0 1 3.672 3.682ZM1.357 2.617c0 .684.586 1.27 1.26 1.27.684 0 1.25-.586 1.25-1.27 0-.674-.566-1.25-1.25-1.25-.674 0-1.26.576-1.26 1.25Z'/%3e%3c/svg%3e");
}

// Bookmark
input[data-task="b"]:checked::after,
li[data-task="b"] > input:checked::after,
li[data-task="b"] > p > input:checked::after {
  background-color: var(--color-orange);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='14' height='21' fill='none' viewBox='0 0 14 21'%3e%3cpath fill='black' d='M1.035 20.947c.479 0 .762-.273 1.64-1.123l3.82-3.76c.048-.048.136-.048.175 0l3.818 3.76c.88.85 1.162 1.123 1.64 1.123.655 0 1.036-.43 1.036-1.191V2.803C13.164.947 12.236 0 10.4 0H2.764C.928 0 0 .947 0 2.803v16.953c0 .762.38 1.191 1.035 1.191Z'/%3e%3c/svg%3e");
}

// Information
input[data-task="i"]:checked,
li[data-task="i"] > input:checked,
li[data-task="i"] > p > input:checked {
  --checkbox-color: var(--color-blue);

  &:after {
    -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 20 20'%3e%3cpath fill='black' d='M8.37 8.154a.721.721 0 0 0-.733.713c0 .42.322.723.732.723h1.074v4.59h-1.24a.724.724 0 0 0-.742.713c0 .42.322.722.742.722h4.092c.42 0 .742-.303.742-.722a.724.724 0 0 0-.742-.713h-1.24V9.072c0-.547-.274-.918-.791-.918H8.369Zm.185-2.988c0 .742.586 1.328 1.318 1.328.732 0 1.309-.586 1.309-1.328 0-.742-.577-1.328-1.309-1.328s-1.318.586-1.318 1.328Z'/%3e%3c/svg%3e");
  }
}

// Savings
input[data-task="S"]:checked::after,
li[data-task="S"] > input:checked::after,
li[data-task="S"] > p > input:checked::after {
  background-color: var(--color-green);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='13' height='23' fill='none' viewBox='0 0 13 23'%3e%3cpath fill='black' d='M6.24 19.639c3.301 0 6.143-1.66 6.143-4.824 0-2.93-2.295-3.975-5.02-4.63l-1.875-.458c-1.777-.43-3.252-1.202-3.252-2.891 0-1.895 2.022-2.861 3.994-2.861 2.022 0 3.487.947 4.024 2.685.156.46.459.772.967.772s.879-.352.879-.87c0-.78-.518-1.835-1.192-2.51-1.191-1.19-2.9-1.747-4.678-1.747-3.056 0-5.869 1.62-5.869 4.677 0 2.705 2.305 3.926 4.815 4.502l1.885.44c1.875.44 3.457 1.123 3.457 3.037 0 2.148-1.973 3.018-4.258 3.018-2.158 0-3.906-.87-4.424-2.813-.147-.479-.43-.752-.928-.752-.547 0-.908.371-.908.86 0 .908.596 1.962 1.27 2.607 1.318 1.24 3.173 1.758 4.97 1.758Zm-.049 2.373a.642.642 0 0 0 .635-.645V.635A.64.64 0 0 0 6.191 0a.64.64 0 0 0-.634.635v20.732c0 .352.283.645.634.645Z'/%3e%3c/svg%3e");
}

// Idea
input[data-task="I"]:checked::after,
li[data-task="I"] > input:checked::after,
li[data-task="I"] > p > input:checked::after {
  background-color: var(--color-yellow);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='21' height='22' fill='none' viewBox='0 0 21 22'%3e%3cpath fill='black' d='M4.346 12.48c-.215 0-.362.137-.381.362-.371 3.017-.518 3.095-3.574 3.594-.254.029-.391.156-.391.38 0 .215.137.342.342.372 3.086.595 3.252.576 3.623 3.584.02.234.166.37.38.37.206 0 .362-.136.382-.36.39-3.057.507-3.145 3.613-3.595.195-.019.342-.156.342-.37 0-.215-.147-.352-.342-.381-3.106-.596-3.213-.596-3.613-3.614a.367.367 0 0 0-.381-.341ZM11.982 0c-.283 0-.507.205-.546.508-.85 6.181-1.7 7.002-7.793 7.812-.313.03-.538.254-.538.547 0 .303.225.537.538.567 6.113.664 6.992 1.62 7.792 7.793.04.302.264.517.547.517.293 0 .508-.215.557-.517.81-6.172 1.68-7.13 7.793-7.793a.552.552 0 0 0 .527-.567c0-.293-.205-.517-.527-.547-6.113-.683-6.982-1.63-7.793-7.812C12.49.205 12.275 0 11.982 0Z'/%3e%3c/svg%3e");
}

// Pros
input[data-task="p"]:checked::after,
li[data-task="p"] > input:checked::after,
li[data-task="p"] > p > input:checked::after {
  background-color: var(--color-green);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 20 20'%3e%3cpath fill='black' d='M0 13.74c0 2.89 1.807 5.313 4.229 5.313h1.718c-1.758-1.28-2.48-3.213-2.48-5.41.01-2.442.957-4.19 1.797-5.245H3.867C1.69 8.398 0 10.742 0 13.74Zm4.814-.078c0 3.565 2.784 6.318 7.325 6.318h1.328c1.26 0 2.197-.087 2.724-.234.762-.185 1.495-.654 1.495-1.572 0-.381-.098-.654-.215-.86-.078-.127-.059-.224.058-.273.606-.254 1.104-.82 1.104-1.592 0-.44-.127-.83-.342-1.094-.107-.146-.098-.283.088-.38.43-.254.742-.801.742-1.436 0-.459-.146-.937-.4-1.172-.157-.137-.127-.234.029-.38.303-.255.498-.694.498-1.25a1.69 1.69 0 0 0-1.7-1.71h-3.437c-.869 0-1.445-.449-1.445-1.172 0-1.298 1.63-3.7 1.63-5.42C14.297.528 13.712 0 12.95 0c-.703 0-1.045.479-1.416 1.21-1.455 2.823-3.388 5.108-4.863 7.061-1.25 1.66-1.856 3.096-1.856 5.391Z'/%3e%3c/svg%3e");
}

// Cons
input[data-task="c"]:checked::after,
li[data-task="c"] > input:checked::after,
li[data-task="c"] > p > input:checked::after {
  background-color: var(--color-red);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 20 20'%3e%3cpath fill='black' d='M19.238 6.24c0-2.89-1.816-5.312-4.228-5.312h-1.72c1.758 1.28 2.54 3.213 2.5 5.41-.03 2.442-.976 4.19-1.826 5.245h1.406c2.178 0 3.867-2.344 3.867-5.342Zm-4.756.07C14.541 2.744 11.65.05 7.11.01L5.791 0c-1.27-.01-2.207.09-2.734.236-.762.185-1.494.644-1.494 1.571 0 .371.097.655.214.86.078.117.069.224-.058.273-.596.244-1.104.82-1.104 1.582 0 .45.127.83.352 1.104.107.146.088.273-.088.38-.44.254-.752.801-.752 1.436 0 .46.146.938.4 1.172.166.137.137.234-.029.38C.195 9.25 0 9.689 0 10.245a1.69 1.69 0 0 0 1.7 1.71h3.437c.869 0 1.445.449 1.445 1.172 0 1.299-1.621 3.691-1.621 5.41 0 .918.576 1.445 1.348 1.445.693 0 1.035-.478 1.406-1.21 1.455-2.823 3.389-5.108 4.863-7.071 1.25-1.66 1.865-3.086 1.904-5.39Z'/%3e%3c/svg%3e");
}

// Fire
input[data-task="f"]:checked::after,
li[data-task="f"] > input:checked::after,
li[data-task="f"] > p > input:checked::after {
  background-color: var(--color-orange);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='17' height='22' fill='none' viewBox='0 0 17 22'%3e%3cpath fill='black' d='M7.676 21.123c5.156 0 8.594-3.486 8.594-8.74C16.27 3.643 8.828 0 3.662 0c-.918 0-1.504.322-1.504.947 0 .244.108.498.313.733 1.162 1.386 2.324 3.037 2.343 4.96 0 .44-.048.83-.36 1.378l.487-.098c-.439-1.436-1.62-2.451-2.656-2.451-.4 0-.674.293-.674.732 0 .254.069.85.069 1.28C1.68 9.667 0 10.946 0 14.472c0 3.994 3.057 6.65 7.676 6.65Zm.224-2.744c-1.826 0-3.037-1.104-3.037-2.744 0-1.719 1.221-2.334 1.377-3.438.02-.088.078-.117.147-.058.449.4.742.888.986 1.455.518-.703.762-2.188.596-3.79-.01-.087.049-.136.136-.107 2.14 1.006 3.252 3.135 3.252 5.04 0 1.933-1.132 3.642-3.457 3.642Z'/%3e%3c/svg%3e");
}

// Key
input[data-task="k"]:checked::after,
li[data-task="k"] > input:checked::after,
li[data-task="k"] > p > input:checked::after {
  background-color: var(--color-yellow);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='13' height='25' fill='none' viewBox='0 0 13 25'%3e%3cpath fill='black' d='M6.24 0C2.764 0 0 2.764 0 6.22c0 2.608 1.563 4.913 4.004 5.84v9.64a.83.83 0 0 0 .254.614l1.63 1.641c.167.166.499.215.704.01l3.096-3.096a.487.487 0 0 0 0-.703l-1.924-1.895 2.636-2.627c.186-.195.186-.478-.02-.693l-2.607-2.627c3.018-1.201 4.698-3.428 4.698-6.103A6.22 6.22 0 0 0 6.24 0Zm0 5.723c-.908 0-1.63-.733-1.63-1.631 0-.908.712-1.631 1.63-1.631.899 0 1.631.723 1.631 1.63 0 .9-.732 1.632-1.63 1.632Z'/%3e%3c/svg%3e");
}

// Win
input[data-task="w"]:checked::after,
li[data-task="w"] > input:checked::after,
li[data-task="w"] > p > input:checked::after {
  background-color: var(--color-orange);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='22' fill='none' viewBox='0 0 20 22'%3e%3cpath fill='black' d='M0 3.223c0 4.033 1.934 6.552 5.791 7.734a8.289 8.289 0 0 0 1.953 1.758v4.248H6.211c-1.377 0-2.09.79-2.09 2.09v1.611c0 .44.342.742.752.742h9.356c.41 0 .752-.302.752-.742v-1.611c0-1.3-.723-2.09-2.1-2.09h-1.524v-4.248a8.07 8.07 0 0 0 1.944-1.758c3.867-1.182 5.8-3.701 5.8-7.734 0-1.006-.624-1.621-1.67-1.621h-1.894C15.381.605 14.677 0 13.497 0H5.604C4.433 0 3.72.596 3.564 1.602H1.67C.625 1.602 0 2.217 0 3.222Zm1.396.136c0-.156.118-.283.284-.283h1.836V4.99c0 1.494.39 2.881.996 4.082C2.47 8.037 1.396 6.142 1.396 3.36ZM14.58 9.072a8.947 8.947 0 0 0 1.006-4.082V3.076h1.836c.166 0 .283.127.283.283 0 2.784-1.074 4.678-3.125 5.713Z'/%3e%3c/svg%3e");
}

// Up
input[data-task="u"]:checked::after,
li[data-task="u"] > input:checked::after,
li[data-task="u"] > p > input:checked::after {
  background-color: var(--color-orange);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='15' height='19' fill='none' viewBox='0 0 15 19'%3e%3cpath fill='black' d='M.84 8.271c.234 0 .469-.078.615-.234L3.682 5.85l3.71-4.082 3.731 4.082 2.227 2.187c.156.156.38.234.615.234.488 0 .84-.37.84-.85a.879.879 0 0 0-.264-.634L8.057.293A.885.885 0 0 0 7.402 0a.885.885 0 0 0-.654.293L.273 6.787c-.185.195-.273.4-.273.635 0 .478.352.85.84.85Zm6.562 10.176c.508 0 .87-.351.87-.86V4.728l-.098-2.91c0-.46-.313-.772-.772-.772s-.771.312-.771.771l-.098 2.91v12.862c0 .508.362.86.87.86Z'/%3e%3c/svg%3e");
}

// Down
input[data-task="d"]:checked::after,
li[data-task="d"] > input:checked::after,
li[data-task="d"] > p > input:checked::after {
  background-color: var(--color-blue);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='15' height='19' fill='none' viewBox='0 0 15 19'%3e%3cpath fill='black' d='M7.402 18.447a.885.885 0 0 0 .655-.293l6.484-6.494a.879.879 0 0 0 .264-.635c0-.478-.352-.85-.84-.85a.863.863 0 0 0-.615.235l-2.227 2.188-3.73 4.082-3.711-4.082-2.227-2.188c-.146-.156-.38-.234-.615-.234-.488 0-.84.37-.84.85 0 .234.088.439.273.634l6.475 6.494c.186.196.41.293.654.293Zm0-1.045c.46 0 .772-.312.772-.771l.097-2.91V.859c0-.507-.36-.859-.869-.859-.507 0-.869.352-.869.86v12.86l.098 2.91c0 .46.312.772.771.772Z'/%3e%3c/svg%3e");
}

// Add
input[data-task="+"]:checked,
li[data-task="+"] > input:checked,
li[data-task="+"] > p > input:checked {
  --checkbox-color: var(--color-orange);

  &:after {
    -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' viewBox='0 0 18 18'%3e%3cpath fill='black' d='M8.154 5.172v2.963H5.192c-.509 0-.86.352-.86.86 0 .499.351.831.86.831h2.962V12.8c0 .498.342.86.841.86.509 0 .86-.352.86-.86V9.826h2.973c.498 0 .86-.332.86-.83 0-.51-.362-.861-.86-.861H9.856V5.172c0-.508-.352-.87-.86-.87-.5 0-.842.362-.842.87Z'/%3e%3c/svg%3e");
  }
}

// Brainstorm
input[data-task="B"]:checked::after,
li[data-task="B"] > input:checked::after,
li[data-task="B"] > p > input:checked::after {
  background-color: var(--color-pink);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='22' height='20' fill='none' viewBox='0 0 22 20'%3e%3cg clip-path='url(%23a)'%3e%3cpath fill='black' d='M14.023 19.365a3.261 3.261 0 0 0 3.262-3.261 3.263 3.263 0 0 0-3.262-3.272 3.263 3.263 0 0 0-3.261 3.271 3.261 3.261 0 0 0 3.261 3.262Zm-7.177 0a3.261 3.261 0 0 0 3.261-3.261 3.263 3.263 0 0 0-3.261-3.272 3.263 3.263 0 0 0-3.262 3.271 3.261 3.261 0 0 0 3.262 3.262Zm10.761-6.425a3.255 3.255 0 0 0 3.262-3.262 3.255 3.255 0 0 0-3.262-3.262 3.263 3.263 0 0 0-3.271 3.262 3.263 3.263 0 0 0 3.271 3.261Zm-14.345 0a3.263 3.263 0 0 0 3.271-3.262 3.263 3.263 0 0 0-3.271-3.262 3.261 3.261 0 1 0 0 6.524Zm10.761-6.417a3.255 3.255 0 0 0 3.262-3.261A3.255 3.255 0 0 0 14.023 0a3.255 3.255 0 0 0-3.261 3.262 3.255 3.255 0 0 0 3.261 3.261Zm-7.177 0a3.255 3.255 0 0 0 3.261-3.261A3.255 3.255 0 0 0 6.846 0a3.255 3.255 0 0 0-3.262 3.262 3.255 3.255 0 0 0 3.262 3.261Z'/%3e%3c/g%3e%3cdefs%3e%3cclipPath id='a'%3e%3cpath fill='white' d='M0 0h21.23v19.365H0z'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
}

// Alarm
input[data-task="a"]:checked::after,
li[data-task="a"] > input:checked::after,
li[data-task="a"] > p > input:checked::after {
  background-color: var(--color-pink);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='22' fill='none' viewBox='0 0 20 22'%3e%3cg clip-path='url(%23a)'%3e%3cpath fill='black' d='M9.336 20.254a9.336 9.336 0 0 0 9.336-9.336c0-5.156-4.18-9.346-9.336-9.346C4.18 1.572 0 5.762 0 10.918a9.336 9.336 0 0 0 9.336 9.336Zm-4.443-8.262a.663.663 0 0 1-.674-.674c0-.38.293-.683.674-.683h3.76V5.4a.68.68 0 1 1 1.357 0v5.918a.672.672 0 0 1-.684.674H4.893Zm-3.575-7.91c.147 0 .254-.02.391-.127l3.271-2.47c.157-.118.245-.274.245-.44 0-.205-.098-.371-.264-.527C4.59.186 3.926 0 3.34 0A2.734 2.734 0 0 0 .596 2.744c0 .361.058.723.166.947.107.245.312.391.556.391Zm16.035 0c.245 0 .45-.156.567-.39.098-.215.156-.587.156-.948A2.728 2.728 0 0 0 15.332 0c-.586 0-1.25.186-1.621.518-.166.156-.264.322-.264.527 0 .166.088.322.254.44l3.262 2.47a.568.568 0 0 0 .39.127ZM1.172 19.971a.74.74 0 0 0 1.074-.01l1.846-1.836-1.055-1.045-1.855 1.836a.743.743 0 0 0-.01 1.055Zm16.328 0a.734.734 0 0 0-.01-1.055l-1.855-1.836-1.045 1.045 1.836 1.836a.74.74 0 0 0 1.074.01Z'/%3e%3c/g%3e%3cdefs%3e%3cclipPath id='a'%3e%3cpath fill='white' d='M0 0h19.033v21.924H0z'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
}

// Note
input[data-task="n"]:checked::after,
li[data-task="n"] > input:checked::after,
li[data-task="n"] > p > input:checked::after {
  background-color: var(--color-blue);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3e%3cg clip-path='url(%23a)'%3e%3cpath fill='black'  d='M2.668 14.63 13.322 3.985l-1.709-1.719L.95 12.911l-.928 2.178c-.097.234.157.508.391.41l2.256-.87ZM14.182 3.145l.986-.966c.498-.499.527-1.036.078-1.485l-.332-.332c-.44-.44-.976-.4-1.475.088l-.986.977 1.729 1.718Z'/%3e%3c/g%3e%3cdefs%3e%3cclipPath id='a'%3e%3cpath fill='white' d='M0 0h15.932v15.52H0z'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
}

// Review
input[data-task="R"]:checked::after,
li[data-task="R"] > input:checked::after,
li[data-task="R"] > p > input:checked::after {
  background-color: var(--color-purple);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='22' height='18' fill='none' viewBox='0 0 22 18'%3e%3cg clip-path='url(%23a)'%3e%3cpath fill='black'  d='M8.652 16.777v-6.181c0-.4-.224-.616-.625-.616a.803.803 0 0 0-.507.176l-3.692 3.057c-.303.264-.322.664 0 .928l3.692 3.066a.812.812 0 0 0 .507.186c.4 0 .625-.225.625-.616ZM20.02 8.36a.81.81 0 0 0-.82.83v.928c0 1.67-1.163 2.764-2.93 2.764H7.216c-.45 0-.82.371-.82.81 0 .45.37.82.82.82h8.896c2.91 0 4.727-1.65 4.727-4.277V9.19a.81.81 0 0 0-.82-.83ZM12.188.635v6.181c0 .391.224.616.624.616a.812.812 0 0 0 .508-.186l3.692-3.057c.312-.253.332-.654 0-.927L13.32.195a.803.803 0 0 0-.508-.175c-.4 0-.624.214-.624.615ZM.82 9.053c.47 0 .83-.362.83-.83v-.928c0-1.67 1.153-2.774 2.92-2.774h9.063c.44 0 .81-.36.81-.81a.82.82 0 0 0-.81-.81H4.727C1.827 2.9 0 4.54 0 7.177v1.045c0 .468.361.83.82.83Z'/%3e%3c/g%3e%3cdefs%3e%3cclipPath id='a'%3e%3cpath fill='white' d='M0 0h21.201v17.393H0z'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
}

// Time
input[data-task="t"]:checked::after,
li[data-task="t"] > input:checked::after,
li[data-task="t"] > p > input:checked::after {
  background-color: var(--text-normal);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='21' height='20' fill='none' viewBox='0 0 21 20'%3e%3cg clip-path='url(%23a)'%3e%3cpath fill='white' d='M4.854 11.016a.667.667 0 0 1-.684-.684c0-.38.293-.674.684-.674h4.423V3.75c0-.38.293-.674.674-.674.381 0 .684.293.684.674v6.582c0 .39-.303.684-.684.684H4.854Zm5.107 8.906c5.498 0 9.96-4.473 9.96-9.961C19.922 4.463 15.46 0 9.962 0 4.473 0 0 4.463 0 9.96c0 5.49 4.473 9.962 9.96 9.962Z'/%3e%3c/g%3e%3cdefs%3e%3cclipPath id='a'%3e%3cpath fill='white' d='M0 0h20.283v19.932H0z'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
}

// Telephone
input[data-task="P"]:checked::after,
li[data-task="P"] > input:checked::after,
li[data-task="P"] > p > input:checked::after {
  background-color: var(--color-green);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='19' height='19' fill='none' viewBox='0 0 19 19'%3e%3cg clip-path='url(%23a)'%3e%3cpath fill='white' d='M5 13.154c2.871 2.881 6.309 5.069 9.072 5.069 1.3 0 2.432-.518 3.174-1.348.713-.8.957-1.396.957-1.924 0-.41-.254-.79-.898-1.24l-2.383-1.709c-.596-.42-.86-.498-1.211-.498-.303 0-.557.059-1.065.332l-1.562.86c-.186.107-.264.126-.4.126-.186 0-.313-.049-.498-.127-.743-.341-1.788-1.162-2.715-2.09-.928-.927-1.65-1.875-2.022-2.607a.971.971 0 0 1-.107-.41c0-.127.068-.234.146-.371l.918-1.572c.254-.43.323-.665.323-.997 0-.38-.127-.79-.489-1.308L4.6 1.055C4.13.4 3.78 0 3.252 0 2.598 0 1.807.498 1.24 1.045.43 1.826 0 2.92 0 4.15c0 2.784 2.139 6.153 5 9.004Z'/%3e%3c/g%3e%3cdefs%3e%3cclipPath id='a'%3e%3cpath fill='white' d='M0 0h18.564v18.232H0z'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
}

// Love
input[data-task="L"]:checked::after,
li[data-task="L"] > input:checked::after,
li[data-task="L"] > p > input:checked::after {
  background-color: var(--color-pink);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='19' fill='none' viewBox='0 0 20 19'%3e%3cg clip-path='url(%23a)'%3e%3cpath fill='white' d='M9.697 18.525c.205 0 .498-.136.713-.263 5.498-3.516 8.985-7.608 8.985-11.768 0-3.457-2.373-5.898-5.44-5.898-1.904 0-3.37 1.054-4.258 2.666C8.828 1.66 7.344.596 5.44.596 2.373.596 0 3.037 0 6.494c0 4.16 3.486 8.252 8.994 11.768.205.127.498.263.703.263Z'/%3e%3c/g%3e%3cdefs%3e%3cclipPath id='a'%3e%3cpath fill='white' d='M0 0h19.756v18.525H0z'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
}
