.selo-date-field.selo-date-field { position: relative; display: inline-flex; width: 100%; min-width: 0; vertical-align: middle; }
.selo-date-field > input.selo-date-native { position: absolute !important; inset: 0; width: 100% !important; height: 100% !important; opacity: 0; pointer-events: none; margin: 0 !important; }
.selo-date-field > input.selo-date-editor { width: 100%; min-width: 0; margin: 0; padding-right: 40px; font-variant-numeric: tabular-nums; letter-spacing: .035em; }
.selo-date-field > .selo-date-picker { position: absolute; right: 5px; top: 50%; transform: translateY(-50%); display: grid; place-items: center; width: 30px; height: 30px; min-height: 0; padding: 0; border: 0; border-radius: 7px; background: transparent; color: var(--muted); cursor: pointer; box-shadow: none; }
.selo-date-field > .selo-date-picker:hover { background: var(--soft-blue); color: var(--primary); }
.selo-date-field > .selo-date-picker:not(:disabled):active { transform: translateY(-50%); }
.selo-date-field > .selo-date-picker:disabled { opacity: .4; cursor: default; }
.selo-date-editor[aria-invalid="true"] { border-color: var(--danger); }
.calendar-navigation > .selo-date-field.selo-date-field { width: 156px; flex: 0 0 156px; }
@media (max-width: 600px) {
  .calendar-navigation > .selo-date-field.selo-date-field { width: 155px; max-width: 155px; flex: 1 1 120px; }
}