/* Digitem 15/11/2026 · Opciones de una sola elección en toda la web (Bootstrap .form-check-input de tipo radio):
   el punto elegido queda como anillo verde grueso y, al elegirlo, sale del centro, llena el círculo y se abre (dibujo de Marc).
   La animación solo se dispara al elegir (clase .dc-pop que pone el script de head.tpl), no al cargar la página. */
@property --dc-fill{syntax:'<percentage>';inherits:false;initial-value:100%}
@property --dc-hole{syntax:'<percentage>';inherits:false;initial-value:42%}
input[type=radio].form-check-input:checked{background-color:#fff;border-color:#12654f;background-size:100% 100%;background-position:center;background-repeat:no-repeat;background-image:radial-gradient(circle closest-side,#fff 0 var(--dc-hole),#12654f calc(var(--dc-hole) + .5px) var(--dc-fill),transparent calc(var(--dc-fill) + .5px))}
@media (prefers-reduced-motion:no-preference){
  input[type=radio].form-check-input.dc-pop:checked{animation:dc-dot-ring .55s cubic-bezier(.3,.7,.3,1) 1 both}
}
@keyframes dc-dot-ring{0%{--dc-fill:0%;--dc-hole:0%}50%{--dc-fill:100%;--dc-hole:0%}100%{--dc-fill:100%;--dc-hole:42%}}
