Adjust for svg icons

app/assets/stylesheets/events.css

@@ -144,7 +144,7 @@
     place-content: center;
     margin-inline-end: -0.75em;
 
-    img {
+    .icon {
       block-size: 1.1em;
       inline-size: 1.1em;
       grid-area: 1 / 1;

app/assets/stylesheets/popup.css

@@ -78,20 +78,15 @@
     }
 
     &:has(input:checked)  {
-      --btn-background: var(--color-selected);
+      --btn-background: var(--color-ink-lightest);
       --btn-color: var(--color-ink);
 
-      img {
-        filter: invert(0);
-
+      .icon {
         &.checked {
+          block-size: 1em;
           display: block;
-        }
-      }
-
-      @media (prefers-color-scheme: dark) {
-        img {
-          filter: invert(1);
+          inline-size: 1em;
+          margin-inline-end: var(--inline-space);
         }
       }
 
@@ -101,11 +96,6 @@
         }
       }
     }
-
-    img.checked {
-      block-size: 1em;
-      inline-size: 1em;
-    }
   }
 
   .popup__list {