ul.list-normal{
	padding:1rem;
    list-style-image: none;
    list-style-type: none;
	list-style-position: inside;
}
ul.list-normal li {
    position: relative;
    padding-left: 1.75rem;
}


ul.list-normal li:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0.667rem;
    width: 1.25rem;
    height: 0.125rem;

    /* --- FALLBACK (Für Browser ohne Masken-Support) --- */
    /* Zeigt das SVG in seiner Originalfarbe an */
    background-image: url(../Icons/list.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    
    /* Wichtig: Hier KEINE background-color setzen, sonst überdeckt sie das Bild */
}

/* --- MODERNE VARIANTE (Wird nur ausgeführt, wenn der Browser Masken kann) --- */
@supports (-webkit-mask-image: url('')) or (mask-image: url('')) {
    ul.list-normal li:after {
        /* 1. Fallback-Bild entfernen */
        background-image: none;

        /* 2. Farbe aktivieren */
        background-color: var(--Red); 

        /* 3. Maske anwenden */
        -webkit-mask-image: url(../Icons/list.svg);
        mask-image: url(../Icons/list.svg);

        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;

        -webkit-mask-size: contain;
        mask-size: contain;
        
        -webkit-mask-position: center;
        mask-position: center;
    }
}


.bgcolor_3 ul.list-normal{
	background:var(--White, #fff);
}

