/* Custom List Icons 
   Usage: Take related list between <div class="icon-list-arrow" markdown="1"> ... </div>
*/

.icon-list-check ul,
.icon-list-star ul,
.icon-list-arrow ul,
.icon-list-square ul,
.icon-list-circle ul {
    list-style: none;
    padding-left: 0;
}

.icon-list-check ul>li,
.icon-list-star ul>li,
.icon-list-arrow ul>li,
.icon-list-square ul>li,
.icon-list-circle ul>li {
    position: relative;
    padding-left: 1.5em;
    margin-bottom: 0.5em;
    margin-left: -0.25em !important;
    list-style: none;
}

.icon-list-check ul>li::before,
.icon-list-star ul>li::before,
.icon-list-arrow ul>li::before,
.icon-list-square ul>li::before,
.icon-list-circle ul>li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.2em;
    width: 1em;
    height: 1em;
    background-color: currentColor;

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.icon-list-check ul>li::before {
    -webkit-mask-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>');
    mask-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>');
}

.icon-list-star ul>li::before {
    -webkit-mask-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 17.27 18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"/></svg>');
    mask-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 17.27 18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"/></svg>');
    background-color: #e6b800;
}

.icon-list-arrow ul>li::before {
    -webkit-mask-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="m12 4-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z"/></svg>');
    mask-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="m12 4-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z"/></svg>');
}

.icon-list-square ul>li::before {
    -webkit-mask-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-8 8H7v6h4v-6zm8-6h-4v6h4V5z"/></svg>');
    mask-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-8 8H7v6h4v-6zm8-6h-4v6h4V5z"/></svg>');
}

.icon-list-circle ul>li::before {
    -webkit-mask-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/></svg>');
    mask-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/></svg>');
}

/* Common Styling for all list types */

.hide-marker {
    margin-top: -1.5rem;
    color: transparent;
}

.mt-fix .hide-marker {
    margin-top: -1rem;
}

.hide-marker * {
    color: initial;
}

.hide-marker::marker {
    content: "";
}

.color-transparent {
    color: transparent;
    margin-top: -1.5rem !important;
}

.indent-starter {
    margin-left: 1.5em !important;
}

.indent-starter::before {
    content: "";
    display: inline-block;
    width: 1.5em;
}