fix(input): styling of "placeholder" content for date related types (#5251)

* fix(input): styling of "placeholder" content for date and datetime-local types

* auto update snapshots (#5252)

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Apply suggestion from @mfranzke

* refactor: prettier

* Update packages/components/src/styles/internal/_form-components.scss

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* Update packages/components/src/styles/internal/_form-components.scss

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

---------

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

Author: 3 people

__snapshots__/input/showcase/chromium-highContrast/DBInput-should-match-screenshot-1/DBInput-should-match-screenshot.png

@@ -71,6 +71,19 @@ $db-min-inline-size: var(
 	[id$="-placeholder"] {
 		@content;
 	}
+
+	// Workaround until the :blank pseudo-class is widely supported; then prefer targeting that pseudo-class.
+	#{$selector} {
+		&:is(
+			[type="date"],
+			[type="datetime-local"],
+			[type="month"],
+			[type="week"],
+			[type="time"]
+		):not(:user-valid)::-webkit-datetime-edit {
+			@content;
+		}
+	}
 }
 
 @mixin set-floating-label-overwrites($selector) {