Make the checkbox to readonly to preserve the Group plan value on form submission (#24004)

GitOrigin-RevId: 555c69952d64e050f0f30669ee8d69a511f6a08d

services/web/frontend/stylesheets/bootstrap-5/abstracts/mixins.scss

@@ -204,3 +204,8 @@
     color: $color;
   }
 }
+
+@mixin input-disabled-styles {
+  background-color: $input-disabled-bg;
+  border-color: $input-disabled-border-color;
+}

services/web/frontend/stylesheets/bootstrap-5/components/form.scss

@@ -24,11 +24,6 @@
   }
 
   &:disabled {
-    @mixin input-disabled-styles {
-      background-color: $input-disabled-bg;
-      border-color: $input-disabled-border-color;
-    }
-
     @include input-disabled-styles;
 
     &[type='checkbox']:indeterminate {
@@ -73,6 +68,15 @@
   }
 }
 
+// Fake disabled checkbox style
+.readonly-disabled-checkbox input.form-check-input {
+  @include input-disabled-styles;
+
+  &:hover:not(:disabled):checked {
+    @include input-disabled-styles;
+  }
+}
+
 .form-switch {
   .form-check-input {
     --bs-form-check-bg: var(--bg-dark-tertiary);