fix: Use SecuBox cyber-checkbox class for collection checkboxes (v0.6.0-r8)

Fix invisible checkboxes using SecuBox theme structure:
- Wrap checkbox inputs with .cyber-checkbox label class
- Update wizard.css to style .cyber-checkbox properly
- Use theme's native checkbox styling from forms.css
- Add !important to override theme defaults where needed

Issue: Checkboxes still not visible after inline styles
Root Cause: SecuBox theme requires .cyber-checkbox wrapper class
Solution: Restructure HTML to match theme's checkbox pattern

Structure Change:
OLD: <label><input><div class="collection-info">
NEW: <label class="cyber-checkbox"><input><div class="collection-info">

CSS Updates:
- .collection-item .cyber-checkbox (flex layout with gap)
- .collection-item .cyber-checkbox input[type="checkbox"] (18x18px, flex-shrink: 0)
- Added !important to override theme padding

Theme Pattern:
.cyber-checkbox { display: inline-flex; align-items: center; gap: 0.5rem; }
.cyber-checkbox input[type="checkbox"] { width: 18px; height: 18px; }

Version: 0.6.0-8

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

package/secubox/luci-app-crowdsec-dashboard/Makefile

@@ -9,7 +9,7 @@ include $(TOPDIR)/rules.mk
 
 PKG_NAME:=luci-app-crowdsec-dashboard
 PKG_VERSION:=0.6.0
-PKG_RELEASE:=7
+PKG_RELEASE:=8
 PKG_ARCH:=all
 
 PKG_LICENSE:=Apache-2.0

package/secubox/luci-app-crowdsec-dashboard/htdocs/luci-static/resources/crowdsec-dashboard/wizard.css

@@ -198,18 +198,20 @@
 	background: rgba(15, 23, 42, 0.7);
 }
 
-.collection-item label {
-	display: flex;
+.collection-item .cyber-checkbox {
+	display: flex !important;
 	align-items: center;
 	gap: 12px;
 	cursor: pointer;
 	user-select: none;
+	padding: 0 !important;
 }
 
-.collection-item input[type="checkbox"] {
+.collection-item .cyber-checkbox input[type="checkbox"] {
 	cursor: pointer;
 	width: 18px;
 	height: 18px;
+	flex-shrink: 0;
 }
 
 .collection-info {

package/secubox/luci-app-crowdsec-dashboard/htdocs/luci-static/resources/view/crowdsec-dashboard/wizard.js

@@ -250,17 +250,15 @@ return view.extend({
 			E('div', { 'class': 'collections-list' },
 				recommendedCollections.map(L.bind(function(collection) {
 					var checkboxId = 'collection-' + collection.name.replace('/', '-');
-					var checkbox = E('input', {
-						'type': 'checkbox',
-						'id': checkboxId,
-						'checked': collection.preselected ? 'checked' : null,
-						'data-collection': collection.name,
-						'style': 'width: 18px; height: 18px; cursor: pointer; margin: 0;'
-					});
 
 					return E('div', { 'class': 'collection-item' }, [
-						E('label', { 'for': checkboxId, 'style': 'display: flex; align-items: center; gap: 12px; cursor: pointer; margin: 0;' }, [
-							checkbox,
+						E('label', { 'class': 'cyber-checkbox', 'for': checkboxId }, [
+							E('input', {
+								'type': 'checkbox',
+								'id': checkboxId,
+								'checked': collection.preselected ? 'checked' : null,
+								'data-collection': collection.name
+							}),
 							E('div', { 'class': 'collection-info' }, [
 								E('strong', {}, collection.name),
 								E('div', { 'class': 'collection-desc' }, collection.description)