@designsystem-se/af 35.2.1-beta.0 → 35.2.1-beta.2

package/dist/collection/components/_calendar/calendar-datepicker/calendar-datepicker.css

@@ -736,30 +736,31 @@ body {
   --digi--datepicker--calendar--show-week--max-width: 23.375rem;
   --digi--datepicker--calendar-shadow: 0 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.7);
   --digi--datepicker--calendar--background-color: var(--digi--color--background--interactive--default--secondary);
-  --digi--datepicker--input-icon--width: 1.125rem;
-  --digi--datepicker--input-icon--horizontal-padding: 1.25rem;
+  --digi--datepicker--input-icon--width: 0.875rem;
+  --digi--datepicker--input-icon--horizontal-padding: 0.75rem;
   --digi--datepicker--input-icon--vertical-padding: var(--digi--global--spacing--smallest-2);
   --digi--datepicker--input--inline-start: var(--digi--gutter--medium);
   --digi--datepicker--input--inline-end: calc(var(--digi--datepicker--input-icon--width) + var(--digi--datepicker--input-icon--horizontal-padding) * 2);
   box-sizing: content-box;
 }
+:host .digi-calendar-datepicker {
+  position: relative;
+  pointer-events: none;
+}
 :host .digi-calendar-datepicker__input-field {
   position: relative;
   max-width: var(--digi--datepicker--max-width);
+  pointer-events: auto;
 }
 :host .digi-calendar-datepicker__input-field .digi-calendar-datepicker__inactive {
-  --digi--form-input--background--empty: var(
-    --digi--datepicker--input--inactive-background
-  );
+  --digi--form-input--background--empty: var(--digi--datepicker--input--inactive-background);
 }
 :host .digi-calendar-datepicker__input-field .digi-calendar-datepicker__input-button {
-  position: absolute;
-  top: 0px;
-  bottom: 0px;
-  right: 0px;
-  background: none;
+  background: var(--digi--color--background--primary);
+  height: var(--digi--form-input--height--medium);
   color: inherit;
-  border: none;
+  border: 1px solid var(--digi--color--border--interactive--default--on-input);
+  border-left: none;
   padding: 0;
   font: inherit;
   outline: inherit;
@@ -770,11 +771,17 @@ body {
   width: var(--digi--datepicker--input-icon--width);
   padding: var(--digi--datepicker--input-icon--vertical-padding) var(--digi--datepicker--input-icon--horizontal-padding);
 }
+:host .digi-calendar-datepicker__input-field .digi-calendar-datepicker__input-button svg {
+  color: var(--digi--color--icon--brand-primary);
+}
 :host .digi-calendar-datepicker__input-field .digi-calendar-datepicker__input-button:focus-visible {
   outline: 2px solid black;
   outline-offset: 2px;
   box-shadow: 0px 0px 0px 5px white;
 }
+:host .digi-calendar-datepicker__input-field .digi-calendar-datepicker__input-button:hover, :host .digi-calendar-datepicker__input-field .digi-calendar-datepicker__input-button:focus {
+  background: var(--digi--color--background--interactive--hover--secondary);
+}
 :host .digi-calendar-datepicker__calendar {
   max-width: var(--digi--datepicker--calendar--max-width);
   height: 0px;
@@ -785,18 +792,17 @@ body {
 :host .digi-calendar-datepicker__show-week-numbers .digi-calendar-datepicker__calendar {
   max-width: var(--digi--datepicker--calendar--show-week--max-width);
 }
-:host .digi-calendar-datepicker__show-error .digi-calendar-datepicker__calendar {
-  margin-top: var(--digi--gutter--medium);
-}
 :host .digi-calendar-datepicker__show-calendar .digi-calendar-datepicker__calendar {
   height: auto;
   background-color: var(--digi--datepicker--calendar--background-color);
   box-shadow: var(--digi--datepicker--calendar-shadow);
   position: absolute;
+  top: var(--digi--datepicker--calendar--popup-top);
+  left: 0;
+  pointer-events: auto;
 }
 :host .digi-calendar-datepicker__input-component {
-  --digi--form-input--padding: 0 var(--digi--datepicker--input--inline-end)
-    0 var(--digi--datepicker--input--inline-start);
+  --digi--form-input--padding: 0 var(--digi--datepicker--input--inline-end) 0 var(--digi--datepicker--input--inline-start);
 }
 :host .digi-calendar-datepicker__selected-date-alert {
   border: 0;