@use '../../../@theme/styles/themes' as *;
@use '@nebular/theme/styles/global/breakpoints' as *;
@import 'bootstrap/scss/mixins/breakpoints';

@include nb-install-component() {
  .calendars {
    display: flex;
    flex-wrap: wrap;
    margin: -1rem -0.5rem;
    justify-content: center;
  }

  .calendar-container {
    margin: 1rem 0.5rem;
  }

  .subtitle {
    display: block;
    margin-bottom: 0.5rem;
  }

  @include media-breakpoint-up(md) {
    .calendars {
      justify-content: flex-start;
    }
  }

  @include media-breakpoint-up(lg) {
    .calendars {
      margin: -1.1rem;
    }
    .calendar-container {
      margin: 1rem;
    }
  }

  @include media-breakpoint-up(xxxl) {
    .calendars {
      margin: -1rem;
    }
  }
}