scss: rewrite left aligned checkbox code for better reliability (#30340)

Support for hint on field, appropriate error placement and improved IE support.

static/includes/_forms.scss

@@ -373,31 +373,21 @@ div.select2-search {
 
 @if $widget-unique-checkbox-position == left {
 	div.CheckboxWidget {
-		display: -ms-flexbox;
-		display: flex;
+		position: relative;
 		div.title {
-			-ms-order: 1;
-			order: 1;
+			margin-left: 1.5rem;
 		}
-		div.content label {
-			margin-right: 0;
-		}
-		&.widget-with-error {
-			// adjust layout when an error is displayed (the only
-			// possible error is "required field" so we know it
-			// will fit on a single line); the error has to be
-			// displayed on top because labels may on the other
-			// hand use several lines.
-			div.title {
-				padding-top: 2em;
+		div.content {
+			@if $widget-custom-radio-checkbox == true {
+				position: static;
 			}
-			div.content {
-				padding-top: 2em;
-				div.error {
-					position: absolute;
-					top: 0;
-					white-space: pre;
-				}
+			label {
+				margin-right: 0;
+				position: absolute;
+				top: 0;
+			}
+			.hint, .error {
+				margin-left: 1.5rem;
 			}
 		}
 	}