Add angular material inputs

src/global.scss

@@ -869,4 +869,54 @@ background: rgb(92, 92, 92);
 
 .modal {
     display: flex !important;
-    }
+}
+
+// calendar
+.mat-calendar-body-selected {
+    background-color: #42b9fe !important;
+}
+
+// select background
+// .mat-primary .mat-option.mat-selected:not(.mat-option-disabled), .mat-option-ripple {
+//     background-color: #fafafa !important;
+// }
+
+.mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical), .cdk-keyboard-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical), .cdk-program-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {
+    background-color: #42b9fe36 !important;
+}
+
+.mat-form-field-underline.ng-tns-c193-6.ng-star-inserted, .mat-form-field-underline {
+    display: none;
+}
+
+.date-hour-picker {
+    margin-top: -6px;
+
+    label#mat-form-field-label-7{
+      // display: none;
+    }
+
+    .span.ng-tns-c193-4, .ng-star-inserted {
+      // display: none;
+    }
+  
+    .ng-star-inserted{
+      // display: none;
+      position: absolute;
+      width: 447px;
+      height: 43px;
+      opacity: 0;
+      button {
+        width: 100%;
+        height: 100%;
+      }
+    }
+}
+
+.mat-active span {
+    color: #0d89d1 !important;
+}
+
+// .ng-star-inserted {
+//     opacity: 0;
+// }