@import '../../theme/formStyles.less';
@import (reference) '../../theme/index.less';

.wrapper {
  display: inline-flex;
  flex-direction: column;
  position: relative;
  min-width: 275px;
  .iconButton {
    height: 15px; // match icon height
    padding: 0;
    border: none;
    background: transparent;
    svg {
      margin-top: 4px;
    }
  }

  &.focusedBorder {
    :global {
      .DateRangePickerInput__withBorder {
        .sbmFocusStyle;
      }
    }
  }

  .calendarIcon {
    fill: @gray-05;
    cursor: pointer;
    margin-top: 4px;
  }

  :global {
    .DateInput_fang {
      z-index: 1001;
    }
    .DateInput {
      margin: 1px 1px 1px 4px;
    }
    .DateInput_input {
      border: 0 !important;
      font-size: @font-size-base;
    }
    .DateRangePickerInput__withBorder {
      border-radius: @border-radius-base;
      border-color: @gray-02;
      width: 100%;
    }
    .DateRangePickerInput_calendarIcon {
      margin: 0;
    }
    input::placeholder {
      color: @gray-03;
    }
    .DayPickerKeyboardShortcuts_show__bottomRight::before {
      border-right: 33px solid @accessible-blue;
    }
    .CalendarDay__selected,
    .CalendarDay__selected_span,
    .CalendarDay__selected:active,
    .CalendarDay__selected:hover,
    .CalendarDay__selected_span:hover {
      background: @accessible-blue;
      color: @white;
      border: 1px double @accessible-blue;
    }
    .CalendarDay__selected_span,
    .CalendarDay__hovered_span,
    .CalendarDay__hovered_span:hover {
      background: fade(@accessible-blue, 10%);
      color: @accessible-blue;
      border: 1px double @accessible-blue;
    }
  }
}