label.tagButton:hover {
    
    cursor: pointer;
  }
  
  label.tagButton > input[type="checkbox"] {
    
    display: none;
  }
  
  label.tagButton > span {
    
    display: block;
    
    line-height: 1;
    
    padding: 0.5rem 1rem;
    border-radius: 0.25rem;
    
    background: var(--colour-button-gray)
  }
  
  label.tagButton > input[type="checkbox"]:checked + span {
    
    color: var(--colour-text-light);
    background-color: var(--colour-brand-main);
  }