@blueprintjs/datetime/src/_daterangepicker.scss

// Copyright 2016 Palantir Technologies, Inc. All rights reserved.
// Licensed under the Apache License, Version 2.0.

@import "./common";

// react-day-picker does not conform to our naming scheme

/* stylelint-disable selector-class-pattern */
.#{$ns}-daterangepicker {
  display: flex;
  white-space: nowrap;

  .DayPicker-NavButton--interactionDisabled {
    display: none;
  }

  .#{$ns}-daterangepicker-timepickers {
    display: flex;
    justify-content: space-around;
  }

  // ensure min-widths are set correctly for variants of contiguous months, single month, and shortcuts
  &.#{$ns}-daterangepicker-contiguous .DayPicker {
    min-width: $datepicker-min-width + $pt-grid-size;
  }

  &.#{$ns}-daterangepicker-single-month .DayPicker {
    min-width: $datepicker-min-width;
  }

  .DayPicker-Day {
    // we only want outside days to be shown when displaying one month at a time
    // https://github.com/palantir/blueprint/pull/586/files#r98813760
    &--outside {
      visibility: hidden;
    }

    &--hovered-range {
      border-radius: 0;
      color: $blue2;

      // need to disable hover styles for all variants of selected dates

      /* stylelint-disable max-line-length */
      &:not(.DayPicker-Day--selected):not(.DayPicker-Day--selected-range):not(.DayPicker-Day--selected-range-start):not(.DayPicker-Day--selected-range-end) {
        background-color: $daterangepicker-range-background-color;
      }
      /* stylelint-enable max-line-length */
    }

    &--selected-range {
      background-color: $daterangepicker-range-background-color-selected;
      border-radius: 0;
      color: $blue2;

      &:hover {
        background-color: $daterangepicker-range-background-color-selected-hover;
        color: $blue2;
      }
    }

    // need to set rounded corners

    /* stylelint-disable max-line-length */
    &--selected-range-start:not(.DayPicker-Day--selected-range-end):not(.DayPicker-Day--hovered-range-end) {
      border-bottom-right-radius: 0;
      border-top-right-radius: 0;
    }

    &--selected-range-end:not(.DayPicker-Day--selected-range-start):not(.DayPicker-Day--hovered-range-start) {
      border-bottom-left-radius: 0;
      border-top-left-radius: 0;
    }
    /* stylelint-enable max-line-length */

    &--hovered-range-start:not(.DayPicker-Day--hovered-range-end) {
      border-bottom-right-radius: 0;
      border-top-right-radius: 0;
    }

    &--hovered-range-end:not(.DayPicker-Day--hovered-range-start) {
      border-bottom-left-radius: 0;
      border-top-left-radius: 0;
    }
  }

  .#{$ns}-dark & {
    .DayPicker-Day {
      &--hovered-range {
        color: $light-gray5;

        /* stylelint-disable max-line-length */
        &:not(.DayPicker-Day--selected):not(.DayPicker-Day--selected-range):not(.DayPicker-Day--selected-range-start):not(.DayPicker-Day--selected-range-end) {
          background-color: $dark-daterangepicker-range-background-color;
        }
        /* stylelint-enable max-line-length */
      }

      &--selected-range {
        background-color: $dark-daterangepicker-range-background-color-selected;
        color: $light-gray5;

        &:hover {
          background-color: $dark-daterangepicker-range-background-color-selected-hover;
        }
      }
    }
  }
}

.#{$ns}-menu.#{$ns}-daterangepicker-shortcuts {
  min-width: $pt-grid-size * 12;
  padding: 0;
}