fix pbg task add toggle and rab krk dlh

resources/scss/pages/pbg-task/show.scss

@@ -1,6 +1,102 @@
 // PBG Task Show Page Styles
 // Custom styles for data lists display (List Layout)
 
+// Enhanced checkbox styling for is_valid field
+.form-check.form-switch {
+    padding-left: 0;
+
+    .form-check-input {
+        width: 3.25rem;
+        height: 1.75rem;
+        border-radius: 1rem;
+        background-color: #dc3545;
+        border: none;
+        transition: all 0.3s ease;
+        position: relative;
+        cursor: pointer;
+        margin-left: 0;
+
+        // Remove default browser styling
+        -webkit-appearance: none;
+        -moz-appearance: none;
+        appearance: none;
+
+        &:checked {
+            background-color: #28a745;
+            box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25);
+        }
+
+        &:focus {
+            box-shadow: 0 0 0 0.2rem rgba(93, 135, 255, 0.25);
+            outline: none;
+        }
+
+        &:not(:checked) {
+            background-color: #dc3545;
+        }
+
+        // The toggle circle
+        &::before {
+            content: "";
+            position: absolute;
+            top: 0.125rem;
+            left: 0.125rem;
+            width: 1.5rem;
+            height: 1.5rem;
+            background-color: #fff;
+            border-radius: 50%;
+            transition: all 0.3s ease;
+            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
+            z-index: 1;
+        }
+
+        // Animation for checked state
+        &:checked::before {
+            transform: translateX(1.5rem);
+        }
+    }
+
+    .form-check-label {
+        margin-left: 1rem;
+        cursor: pointer;
+        padding-left: 0;
+
+        .status-text {
+            font-weight: 600;
+            font-size: 1rem;
+            color: #2c3e50;
+            transition: color 0.3s ease;
+        }
+
+        small {
+            font-size: 0.85rem;
+            margin-top: 0.25rem;
+            line-height: 1.3;
+        }
+    }
+}
+
+// Status indicator styling
+.status-validation-container {
+    background: #f8f9fa;
+    border: 1px solid #e9ecef;
+    border-radius: 8px;
+    padding: 1rem;
+    transition: all 0.3s ease;
+
+    &.valid {
+        background: #d4edda;
+        border-color: #c3e6cb;
+        color: #155724;
+    }
+
+    &.invalid {
+        background: #f8d7da;
+        border-color: #f5c6cb;
+        color: #721c24;
+    }
+}
+
 .data-list-section {
     .section-header {
         border-bottom: 2px solid #f8f9fa;