DateRangePicker does not listen to general styling

[werwolfberlin]

in my project all components are shown bordered using the following css (simplified)

::part(input-field) { background-color: var(--lumo-tint); border: 1px solid var(--lumo-contrast-30pct); border-radius: var(--lumo-border-radius-l); font-size: var(--lumo-font-size-xs); box-sizing: border-box; }

The ideal behavior would be, that the DateRangeField would use that and display as the other components.

But since it is a multi part component there are multiple input-field parts, so i tried to reach them with CSS selectors. Sadly there are nested shadow doms which are not easily penetratable. In current Vaadin components most of the tags inside the shadow dom were pulled out for better accessibility and theming.
It would be acceptable when there would be a way to layout this component internally so that it has only one shadow dom.