data-tooltip not working on input-checkbox with role="switch" #704
Description
When an checkbox is used without role, the tooltip is displayed correctly.
When the checkbox has a role="switch" added it doesn't show the tooltip. Instead there is a small circle, witth the black connection triangle
example html showing what is wrong:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="color-scheme" content="light dark">
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css"
>
<title>Hello world!</title>
</head>
<body>
<main class="container">
<fieldset>
<label>
<input name="terms" type="checkbox" role="switch"/>
I agree to the Terms
</label>
<label>
<input name="terms" type="checkbox" role="switch" data-tooltip="I agree to the Terms"/>
</label>
<label>
<input name="terms" type="checkbox"/>
I agree to the Terms
</label>
<label>
<input name="terms" type="checkbox" data-tooltip="I agree to the Terms"/>
</label>
</fieldset>
</main>
</body>
</html>