
/* green-bullets-center.css — bullets with black center + larger green ring (#B6ED93)
   Variant A updated: larger ring, small center kept
   Falls du noch feintunen willst:
    Ringgröße: --ring-size (z. B. .76em oder .68em)
    Kerngröße: --center-size (z. B. .30em)
    Randstärke: --ring-border (z. B. 2.5px)
*/
:root { 
  --bullet-green:#B6ED93; 
  --bullet-center:#000; 
  /* Variant A sizing */
  --ring-size:.96em;       /* was .6em */
  --ring-border:4px;
  --center-size:.32em;     /* small black core */
}

/* Bootstrap-friendly base (UL, .list-unstyled, .list-group) */
ul.bullets-center-ring,
ul.bullets-center-ring-thin,
ul.bullets-center-ring-glow,
.list-unstyled.bullets-center-ring,
.list-unstyled.bullets-center-ring-thin,
.list-unstyled.bullets-center-ring-glow,
.list-group.bullets-center-ring,
.list-group.bullets-center-ring-thin,
.list-group.bullets-center-ring-glow { list-style:none; padding-left:0; margin:0; }

.bullets-center-ring > li,
.bullets-center-ring-thin > li,
.bullets-center-ring-glow > li,
.list-unstyled.bullets-center-ring > li,
.list-unstyled.bullets-center-ring-thin > li,
.list-unstyled.bullets-center-ring-glow > li,
.list-group.bullets-center-ring > .list-group-item,
.list-group.bullets-center-ring-thin > .list-group-item,
.list-group.bullets-center-ring-glow > .list-group-item {
  position:relative; padding-left:1.55rem; margin:.35rem 0;
  line-height:1.5;
}

/* Variant A: larger ring + small black center */
.bullets-center-ring > li::before,
.list-group.bullets-center-ring > .list-group-item::before,
.list-unstyled.bullets-center-ring > li::before {
  content:""; position:absolute; left:0; top:.55em;
  width:var(--ring-size); height:var(--ring-size);
  background: transparent;                 
  border:var(--ring-border) solid var(--bullet-green);
  border-radius:50%; transform:translateY(-50%);
}
.bullets-center-ring > li::after,
.list-group.bullets-center-ring > .list-group-item::after,
.list-unstyled.bullets-center-ring > li::after {
  content:""; position:absolute; 
  left: calc(var(--ring-size) / 2); 
  top:.55em;
  width:var(--center-size); height:var(--center-size);
  background: var(--bullet-center);
  border-radius:50%; transform:translate(-50%,-50%);
}

/* Variant B: Thin ring (1.5px), minimal footprint (unchanged) */
.bullets-center-ring-thin > li::before,
.list-group.bullets-center-ring-thin > .list-group-item::before,
.list-unstyled.bullets-center-ring-thin > li::before {
  content:""; position:absolute; left:0; top:.55em;
  width:.52em; height:.52em;
  background: var(--bullet-center);
  border:1.5px solid var(--bullet-green);
  border-radius:50%; transform:translateY(-50%);
}

/* Variant C: Standard ring + subtle outer glow (unchanged) */
.bullets-center-ring-glow > li::before,
.list-group.bullets-center-ring-glow > .list-group-item::before,
.list-unstyled.bullets-center-ring-glow > li::before {
  content:""; position:absolute; left:0; top:.55em;
  width:.6em; height:.6em;
  background: var(--bullet-center);
  border:2px solid var(--bullet-green);
  border-radius:50%; transform:translateY(-50%);
  box-shadow: 0 0 0 4px rgba(182,237,147,.18);
}

/* Remove default vertical margins inside .list-group for tighter look */
.list-group.bullets-center-ring > .list-group-item,
.list-group.bullets-center-ring-thin > .list-group-item,
.list-group.bullets-center-ring-glow > .list-group-item { margin:0; }
