Don't use Bootstrap switches in layers menu

js/controllers/menu_controller.js

@@ -97,6 +97,12 @@ export default class extends Controller {
      * @param {HTMLElement} tab Tab content element
      */
     #buildLayersMenu(tree, tab) {
+        const heading = document.createElement('h1');
+        heading.classList.add('fs-5', 'fw-bold', 'ms-0');
+        heading.textContent = 'Teatro'; // Hard-coded!!
+
+        tab.appendChild(heading);
+
         for (const node of tree) {
             tab.appendChild(
                 node.children.length > 0
@@ -110,17 +116,17 @@ export default class extends Controller {
      * @returns {HTMLDivElement}
      */
     #createLayerToggle(node) {
-        const checkbox = html`
-            <div class="form-check form-switch ms-${node.depth} ps-${node.depth} mt-2">
-                <input class="form-check-input" type="checkbox" ${node.active ? 'checked' : ''} role="switch"
-                    title="Mostra / nascondi layer"
+        const toggle = html`
+            <label class="toggle-control ms-${node.depth} ps-${node.depth} mt-1 mb-1">
+                <input id="${node.id}" type="checkbox" ${node.active ? 'checked' : ''} role="switch"
                     data-menu-node-param="${node.id}"
                     data-action="change->menu#toggleNode">
-                <label class="form-check-label">${node.id}</label>
-            </div>
+                <span class="control"></span>
+                <span class="ms-4 ps-1 fs-6" title="Mostra / nascondi layer">${node.id}</span>
+            </label>
         `;
 
-        return domParser.parseFromString(checkbox, 'text/html').querySelector('div');
+        return domParser.parseFromString(toggle, 'text/html').querySelector('label');
     }
     /**
      * @param {import("../state.js").NormalizedSceneNode} node