/* Base styles for all custom lists */
ul.wp-block-list {
   list-style: none; /* Remove default browser bullets */
   padding-left: 0; /* Reset padding, we'll add it to the li */
   margin-bottom: 1.5rem;
}

ul.wp-block-list li {
   position: relative; /* Needed for absolute positioning of the pseudo-element */
   padding-left: 1.75rem; /* Create space for the custom bullet */
   margin-bottom: 0.5rem; /* Space between list items */
}

/* Default list style: Small green squares */
/* We now create the bullet using a ::before pseudo-element for reliability */
ul.wp-block-list li::before {
   content: ''; /* Required for pseudo-elements */
   position: absolute;
   left: 0.1rem; /* Position the icon */
   top: 0.5em;  /* Fine-tune vertical alignment */
   width: 0.55em; /* Bullet width */
   height: 0.55em; /* Bullet height */
   background-color: #00a23a;
}

/* Circle variant: Small green circles */
/* We override the default ::before to make it a circle */
ul.is-style-circle li::before {
   border-radius: 50%; /* This makes the square a circle */
}

/* Angle icon variant */
/* This version now uses the ::marker pseudo-element as requested */
ul.is-style-angle {
   /* We need to restore some of the default ul padding for ::marker to have space */
   padding-left: 1rem;
}

ul.is-style-angle li {
   /* Reset padding-left as ::marker handles the spacing */
   padding-left: 0.5rem;
}

ul.is-style-angle li::before {
   /* Hide the default square/circle bullet for this style */
   content: none;
}

ul.is-style-angle li::marker {
   /* We embed the SVG directly into the content property. */
   /* Note that the fill color is set inside the SVG data URI. */
   content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='0.9em' style='margin-top:0.1em' fill='%2300a23a' viewBox='0 0 256 256'%3E%3Cpath d='M181.66,133.66l-80,80a8,8,0,0,1-11.32-11.32L164.69,128,90.34,53.66a8,8,0,0,1,11.32-11.32l80,80A8,8,0,0,1,181.66,133.66Z'%3E%3C/path%3E%3C/svg%3E");
}

/* Underline links in paragraph block (except .is-style-plainlink) */
.entry-content p:not(.is-style-plainlink)>a,
.additional-content p:not(.is-style-plainlink)>a,
.editor-styles-wrapper p:not(.is-style-plainlink)>a{
    position: relative;
}
.entry-content p:not(.is-style-plainlink)>a::after,
.additional-content p:not(.is-style-plainlink)>a::after,
.editor-styles-wrapper p:not(.is-style-plainlink)>a::after{
    content: "";
    display: block;
    height: 1px;
    width:100%;
    position: absolute;
    bottom: 1px;
    left: 0;
    background: currentColor;
    opacity: 0.4;
}
.entry-content p:not(.is-style-plainlink)>a:hover::after,
.additional-content p:not(.is-style-plainlink)>a:hover::after{
    height: 2px;
    opacity: 1;
}