0
#eef4ff
1<label class="group relative grid size-20 cursor-pointer place-items-center select-none">2 <input type="checkbox" class="sr-only" />3 <span class="absolute inset-0 rounded-full bg-white shadow-[0_12px_26px_-10px_rgba(37,99,235,.55)] ring-1 ring-blue-100 transition-all duration-300 group-active:scale-90 group-has-[:checked]:bg-blue-600 group-has-[:checked]:ring-blue-600"></span>4 <span class="onda absolute inset-0 rounded-full border-2 border-blue-500 opacity-0"></span>5 <span class="mais absolute -top-3 text-sm font-extrabold text-blue-600 opacity-0">+1</span>6 <svg viewBox="0 0 24 24" class="dedo relative size-9 fill-transparent stroke-blue-600 transition-colors duration-300 group-has-[:checked]:fill-white group-has-[:checked]:stroke-white" stroke-width="1.8" stroke-linejoin="round" stroke-linecap="round"><path d="M7 10v11H3.5V10z"/><path d="M7 10l4.2-7.2c1.6.2 2.6 1.6 2.2 3.2L12.6 9.5H19a2 2 0 0 1 2 2.3l-1.4 7.4A2.2 2.2 0 0 1 17.4 21H7"/></svg>7</label>