frontend/admin/css/components.css

@@ -2380,6 +2380,16 @@ input[type="number"] {
     transition: background 0.2s ease;
 }
 
+.form-group .checkbox-group-vertical .checkbox-item {
+    display: flex;
+    align-items: center;
+    margin-bottom: 0;
+    color: var(--text-primary);
+    font-size: 0.9rem;
+    text-transform: none;
+    letter-spacing: 0;
+}
+
 .checkbox-item:hover {
     background: var(--bg-hover);
 }

frontend/admin/js/views/classrooms.js

@@ -21,8 +21,9 @@ function renderEquipmentCheckboxes(equipments, containerId, selectTextId, select
     }
     
     container.innerHTML = equipments.map(eq => `
-        <label class="checkbox-container">
+        <label class="checkbox-item">
             <input type="checkbox" value="${eq.id}" ${selectedIds.includes(eq.id) ? 'checked' : ''}>
+            <span class="checkmark"></span>
             <span>${escapeHtml(eq.name)}</span>
         </label>
     `).join('');