fix(input-date-picker): update the focus and hover chevron icon color (#9146)

**Related Issue:**
[7712](#7712)

### Summary
This updates `input-date-picker` chevron colors to be
`--calcite-color-text-3` when idle and `--calcite-color-text-1` when
hovered or pressed.

Author: aPreciado88

packages/calcite-components/src/components/input-date-picker/input-date-picker.scss

@@ -37,6 +37,18 @@
 
 .input-wrapper {
   @apply relative;
+
+  .chevron-icon {
+    color: var(--calcite-color-text-3);
+  }
+
+  &:focus-within,
+  &:active,
+  &:hover {
+    .chevron-icon {
+      color: var(--calcite-color-text-1);
+    }
+  }
 }
 
 .toggle-icon {

packages/calcite-components/src/components/input-date-picker/input-date-picker.tsx

@@ -681,6 +681,7 @@ export class InputDatePicker
       // we set tab index to -1 to prevent delegatesFocus from stealing focus before we can set it
       <span class={CSS.toggleIcon} tabIndex={-1}>
         <calcite-icon
+          class={CSS.chevronIcon}
           icon={open ? "chevron-up" : "chevron-down"}
           scale={getIconScale(this.scale)}
         />

packages/calcite-components/src/components/input-date-picker/resources.ts

@@ -12,4 +12,5 @@ export const CSS = {
   menuActive: "menu-container--active",
   toggleIcon: "toggle-icon",
   verticalArrowContainer: "vertical-arrow-container",
+  chevronIcon: "chevron-icon",
 };