@use '../../../../styles/_globals.scss' as *;

:host {
  overflow: auto;
  display: block;
  height: 100%;

  @include mq(xs, max) {
    overflow-x: hidden;
  }

  &.isScrolled {
    border-top: 1px solid var(--extra-border-color);
  }
}

.days {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  box-sizing: border-box;
  padding: var(--s3);
  padding-top: 0;
  gap: var(--s2);

  @include mq(xs) {
    gap: var(--s3);
  }

  @include mq(xs, max) {
    display: block;
    width: 100%;
    max-width: 100%;
    padding: var(--s2);
  }
}

.loading-more {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 260px;
  padding: 2rem;

  @include mq(xs, max) {
    min-width: 100%;
    width: 100%;
  }
}
