@import '~@kaizen/design-tokens/sass/color';

@layer kz-components {
  .nav {
    position: absolute;
    display: flex;
    justify-content: space-between;
    width: 100%;
    color: $color-purple-800;
    top: -0.25rem;
  }

  .dayRangeStart,
  .dayRangeEnd {
    background-color: $color-blue-500;
    color: $color-white;
  }

  .dayRangeMiddle {
    background-color: $color-blue-100;
    color: $color-blue-500;

    & [class*='_button_'] {
      color: $color-blue-500;
    }
  }

  .chevronIcon {
    pointer-events: none;
  }
}