// calendar component

$modules: () !default;

@mixin exports($name) {
  @if (not index($modules, $name)) {
    $modules: append($modules, $name) !global;
    @content;
  }
}





$mbsc-mobiscroll-accent: #4eccc4 !default;
$mbsc-mobiscroll-background: #f7f7f7 !default;
$mbsc-mobiscroll-text: #454545 !default;

$mbsc-mobiscroll-dark-accent: #4fccc4 !default;
$mbsc-mobiscroll-dark-background: #263238 !default;
$mbsc-mobiscroll-dark-text: #f7f7f7 !default;

/* Base colors */
$mbsc-mobiscroll-primary: #3f97f6 !default;
$mbsc-mobiscroll-secondary: #90979E !default;
$mbsc-mobiscroll-success: #43BE5F !default;
$mbsc-mobiscroll-danger: #f5504e !default;
$mbsc-mobiscroll-warning: #f8b042 !default;
$mbsc-mobiscroll-info: #5BB7C5 !default;
$mbsc-mobiscroll-light: darken(#fff, 10%) !default;
$mbsc-mobiscroll-dark: #47494A !default;

@function mbsc-mobiscroll-colors($params) {
  $background: map-get($params, background);
  $text: map-get($params, text);
  $accent: map-get($params, accent);

  $input-icon: lighten($text, 20%);
  $color-input: darken($text, 15%);
  $event-border: lighten($text, 25%);
  $lv-item: darken($background, 4%);
  $checked: desaturate(lighten($accent, 25%), 6%);
  $border: '';
  $empty-color: '';
  $input-disabled: '';
  $handle: '';
  $btn-disabled: '';
  $switch: '';
  $btn-light: '';
  $input-box: '';
  $tooltip: '';
  $checkbox: '';
  $empty-color: '';

  // Light background 
  @if (lightness($background) > 50%) {
    $border: darken($background, 17%);
    $empty-color: lighten($text, 20%);
    $input-disabled: darken($background, 13%);
    $handle: darken($background, 8%);
    $btn-disabled: darken($background, 10%);
    $switch: darken($background, 19%);
    $btn-light: darken($background, 3%);
    $input-box: darken($background, 10%);
    $tooltip: darken($background, 4%);
    $checkbox: lighten($background, 3%);
  }

  // Dark background 
  @else {
    $border: lighten($background, 17%);
    $empty-color: $text;
    $input-disabled: lighten($background, 17%);
    $handle: lighten($background, 7%);
    $btn-disabled: lighten($background, 8%);
    $switch: lighten($background, 14%);
    $btn-light: $background;
    $input-box: lighten($background, 10%);
    $tooltip: $background;
    $checkbox: $background;
  }

  @return (border: $border,
  empty-color: $empty-color,
  input-disabled: $input-disabled,
  btn-light: $btn-light,
  btn-disabled: $btn-disabled,
  switch: $switch,
  checked: $checked,
  handle: $handle,
  input-icon: $input-icon,
  input-box: $input-box,
  tooltip: $tooltip,
  color-input: $color-input,
  event-border: $event-border,
  lv-item: $lv-item,
  checkbox: $checkbox,
  /* static colors */
  textarea: #1f1f1f,
  notification: #787878,
  white-text: #ffffff,
  error: #de3226,
  dark-text: #000);
}

@mixin mbsc-mobiscroll-common($theme, $params) {
  @include exports("common.#{$theme}.colors") {
    $colors: mbsc-mobiscroll-colors($params);
    $empty-color: map-get($colors, empty-color);

    .mbsc-#{$theme} {
      .mbsc-empty {
        color: $empty-color;
      }
    }
  }
}


@mixin mbsc-mobiscroll-frame($theme, $params) {
  @include exports("frame.#{$theme}.colors") {

    $background: map-get($params, background);
    $text: map-get($params, text);
    $accent: map-get($params, accent);

    .mbsc-#{$theme} {
      .mbsc-fr-w {
        background: $background;
        color: $text;
      }

      .mbsc-fr-hdr,
      .mbsc-fr-btn {
        color: $accent;
      }

      .mbsc-fr-btn.mbsc-active,
      &.mbsc-no-touch .mbsc-fr-btn-e:not(.mbsc-disabled):hover {
        background: rgba($accent, .3);
      }

      .mbsc-fr-arr {
        background: $background;
      }
    }
  }
}




@include exports("common") {
  .mbsc-cloak {
    visibility: hidden !important;
  }

  /* Empty view */

  .mbsc-empty {
    text-align: center;
    margin: 3em;
    color: inherit;
  }

  .mbsc-empty h3 {
    margin: .666666em 0;
    padding: 0;
    color: inherit;
    font-size: 1.5em;
    font-weight: normal;
    font-family: inherit;
  }

  .mbsc-empty p {
    margin: 1em 0;
    padding: 0;
    font-size: 1em;
    line-height: 1.5;
  }
}



@include exports("animation") {

  .mbsc-anim-trans .mbsc-fr-scroll {
    overflow: hidden;
  }

  .mbsc-anim-trans-flip .mbsc-fr-persp,
  .mbsc-anim-trans-swing .mbsc-fr-persp {
    -webkit-perspective: 1000px;
    perspective: 1000px;
  }

  .mbsc-anim-trans .mbsc-fr-popup,
  .mbsc-anim-trans .mbsc-fr-overlay {
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
  }

  .mbsc-anim-in .mbsc-fr-popup,
  .mbsc-anim-in .mbsc-fr-overlay {
    -webkit-animation-timing-function: ease-out;
    -webkit-animation-duration: 225ms;
    animation-timing-function: ease-out;
    animation-duration: 225ms;
  }

  .mbsc-anim-out .mbsc-fr-popup,
  .mbsc-anim-out .mbsc-fr-overlay {
    -webkit-animation-timing-function: ease-in;
    -webkit-animation-duration: 195ms;
    animation-timing-function: ease-in;
    animation-duration: 195ms;
  }

  .mbsc-anim-in .mbsc-fr-overlay {
    -webkit-animation-name: mbsc-anim-f-in;
    animation-name: mbsc-anim-f-in;
  }

  .mbsc-anim-out .mbsc-fr-overlay {
    -webkit-animation-name: mbsc-anim-f-out;
    animation-name: mbsc-anim-f-out;
  }

  .mbsc-anim-flip,
  .mbsc-anim-swing,
  .mbsc-anim-slidehorizontal,
  .mbsc-anim-slidevertical,
  .mbsc-anim-slidedown,
  .mbsc-anim-slideup,
  .mbsc-anim-fade {
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateX(0);
    backface-visibility: hidden;
    transform: translateX(0);
  }

  .mbsc-anim-swing,
  .mbsc-anim-slidehorizontal,
  .mbsc-anim-slidevertical,
  .mbsc-anim-slidedown,
  .mbsc-anim-slideup,
  .mbsc-anim-fade {
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
  }

  .mbsc-anim-flip,
  .mbsc-anim-pop {
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
  }

  .mbsc-anim-in .mbsc-anim-pop {
    opacity: 1;
    -webkit-animation-name: mbsc-anim-p-in;
    -webkit-animation-duration: 100ms;
    -webkit-transform: scale(1);
    animation-name: mbsc-anim-p-in;
    animation-duration: 100ms;
    transform: scale(1);
  }

  .mbsc-anim-out .mbsc-anim-pop {
    opacity: 0;
    -webkit-animation-name: mbsc-anim-p-out;
    -webkit-animation-duration: 150ms;
    animation-name: mbsc-anim-p-out;
    animation-duration: 150ms;
  }

  .mbsc-anim-trans-pop .mbsc-fr-overlay {
    -webkit-animation-duration: 150ms;
    animation-duration: 150ms;
  }

  .mbsc-anim-in .mbsc-anim-flip {
    opacity: 1;
    -webkit-animation-name: mbsc-anim-fl-in;
    -webkit-transform: scale(1);
    animation-name: mbsc-anim-fl-in;
    transform: scale(1);
  }

  .mbsc-anim-out .mbsc-anim-flip {
    opacity: 0;
    -webkit-animation-name: mbsc-anim-fl-out;
    animation-name: mbsc-anim-fl-out;
  }

  .mbsc-anim-in .mbsc-anim-swing {
    opacity: 1;
    -webkit-animation-name: mbsc-anim-sw-in;
    -webkit-transform: scale(1);
    transform: scale(1);
    animation-name: mbsc-anim-sw-in;
  }

  .mbsc-anim-out .mbsc-anim-swing {
    opacity: 0;
    -webkit-animation-name: mbsc-anim-sw-out;
    animation-name: mbsc-anim-sw-out;
  }

  .mbsc-anim-in .mbsc-anim-slidehorizontal {
    opacity: 1;
    -webkit-animation-name: mbsc-anim-sh-in;
    -webkit-transform: scale(1);
    transform: scale(1);
    animation-name: mbsc-anim-sh-in;
  }

  .mbsc-anim-out .mbsc-anim-slidehorizontal {
    opacity: 0;
    -webkit-animation-name: mbsc-anim-sh-out;
    animation-name: mbsc-anim-sh-out;
  }

  .mbsc-anim-in .mbsc-anim-slidevertical {
    opacity: 1;
    -webkit-animation-name: mbsc-anim-sv-in;
    -webkit-transform: scale(1);
    animation-name: mbsc-anim-sv-in;
    transform: scale(1);
  }

  .mbsc-anim-out .mbsc-anim-slidevertical {
    opacity: 0;
    -webkit-animation-name: mbsc-anim-sv-out;
    animation-name: mbsc-anim-sv-out;
  }

  .mbsc-anim-in .mbsc-anim-slidedown {
    -webkit-animation-name: mbsc-anim-sd-in;
    -webkit-transform: scale(1);
    animation-name: mbsc-anim-sd-in;
    transform: scale(1);
  }

  .mbsc-anim-out .mbsc-anim-slidedown {
    -webkit-animation-name: mbsc-anim-sd-out;
    -webkit-transform: translateY(-100%);
    animation-name: mbsc-anim-sd-out;
  }

  .mbsc-anim-in .mbsc-anim-slideup {
    -webkit-animation-name: mbsc-anim-su-in;
    -webkit-transform: scale(1);
    transform: scale(1);
    animation-name: mbsc-anim-su-in;
  }

  .mbsc-anim-out .mbsc-anim-slideup {
    -webkit-animation-name: mbsc-anim-su-out;
    -webkit-transform: translateY(100%);
    animation-name: mbsc-anim-su-out;
  }

  .mbsc-anim-in .mbsc-anim-fade {
    opacity: 1;
    -webkit-animation-name: mbsc-anim-f-in;
    animation-name: mbsc-anim-f-in;
  }

  .mbsc-anim-out .mbsc-anim-fade {
    opacity: 0;
    -webkit-animation-name: mbsc-anim-f-out;
    animation-name: mbsc-anim-f-out;
  }

  .mbsc-fr-pointer {
    &.mbsc-anim-in .mbsc-anim-slidedown {
      -webkit-animation-name: mbsc-anim-sd-in, mbsc-anim-f-in;
      animation-name: mbsc-anim-sd-in, mbsc-anim-f-in;
    }

    &.mbsc-anim-out .mbsc-anim-slidedown {
      -webkit-animation-name: mbsc-anim-sd-out, mbsc-anim-f-out;
      animation-name: mbsc-anim-sd-out, mbsc-anim-f-out;
    }

    &.mbsc-anim-in .mbsc-anim-slideup {
      -webkit-animation-name: mbsc-anim-su-in, mbsc-anim-f-in;
      animation-name: mbsc-anim-su-in, mbsc-anim-f-in;
    }

    &.mbsc-anim-out .mbsc-anim-slideup {
      -webkit-animation-name: mbsc-anim-su-out, mbsc-anim-f-out;
      animation-name: mbsc-anim-su-out, mbsc-anim-f-out;
    }
  }

  /* Fade in */

  @keyframes mbsc-anim-f-in {
    from {
      opacity: 0;
    }

    to {
      opacity: 1;
    }
  }

  @-webkit-keyframes mbsc-anim-f-in {
    from {
      opacity: 0;
    }

    to {
      opacity: 1;
    }
  }


  /* Fade out */

  @keyframes mbsc-anim-f-out {
    from {
      visibility: visible;
      opacity: 1;
    }

    to {
      opacity: 0;
    }
  }

  @-webkit-keyframes mbsc-anim-f-out {
    from {
      visibility: visible;
      opacity: 1;
    }

    to {
      opacity: 0;
    }
  }


  /* Pop in */

  @keyframes mbsc-anim-p-in {
    from {
      opacity: 0;
      transform: scale(0.8);
    }

    to {
      opacity: 1;
      transform: scale(1);
    }
  }

  @-webkit-keyframes mbsc-anim-p-in {
    from {
      opacity: 0;
      -webkit-transform: scale(0.8);
    }

    to {
      opacity: 1;
      -webkit-transform: scale(1);
    }
  }


  /* Pop out */

  @keyframes mbsc-anim-p-out {
    from {
      opacity: 1;
      transform: scale(1);
    }

    to {
      opacity: 0;
      transform: scale(0.8);
    }
  }

  @-webkit-keyframes mbsc-anim-p-out {
    from {
      opacity: 1;
      -webkit-transform: scale(1);
    }

    to {
      opacity: 0;
      -webkit-transform: scale(0.8);
    }
  }


  /* Flip in */

  @keyframes mbsc-anim-fl-in {
    from {
      opacity: 0;
      transform: rotateY(90deg);
    }

    to {
      opacity: 1;
      transform: rotateY(0);
    }
  }

  @-webkit-keyframes mbsc-anim-fl-in {
    from {
      opacity: 0;
      -webkit-transform: rotateY(90deg);
    }

    to {
      opacity: 1;
      -webkit-transform: rotateY(0);
    }
  }


  /* Flip out */

  @keyframes mbsc-anim-fl-out {
    from {
      opacity: 1;
      transform: rotateY(0deg);
    }

    to {
      opacity: 0;
      transform: rotateY(-90deg);
    }
  }

  @-webkit-keyframes mbsc-anim-fl-out {
    from {
      opacity: 1;
      -webkit-transform: rotateY(0deg);
    }

    to {
      opacity: 0;
      -webkit-transform: rotateY(-90deg);
    }
  }


  /* Swing in */

  @keyframes mbsc-anim-sw-in {
    from {
      opacity: 0;
      transform: rotateY(-90deg);
    }

    to {
      opacity: 1;
      transform: rotateY(0deg);
    }
  }

  @-webkit-keyframes mbsc-anim-sw-in {
    from {
      opacity: 0;
      -webkit-transform: rotateY(-90deg);
    }

    to {
      opacity: 1;
      -webkit-transform: rotateY(0deg);
    }
  }


  /* Swing out */

  @keyframes mbsc-anim-sw-out {
    from {
      opacity: 1;
      transform: rotateY(0deg);
    }

    to {
      opacity: 0;
      transform: rotateY(-90deg);
    }
  }

  @-webkit-keyframes mbsc-anim-sw-out {
    from {
      opacity: 1;
      -webkit-transform: rotateY(0deg);
    }

    to {
      opacity: 0;
      -webkit-transform: rotateY(-90deg);
    }
  }


  /* Slide horizontal in */

  @keyframes mbsc-anim-sh-in {
    from {
      opacity: 0;
      transform: translateX(-100%);
    }

    to {
      opacity: 1;
      transform: translateX(0);
    }
  }

  @-webkit-keyframes mbsc-anim-sh-in {
    from {
      opacity: 0;
      -webkit-transform: translateX(-100%);
    }

    to {
      opacity: 1;
      -webkit-transform: translateX(0);
    }
  }


  /* Slide horizontal out */

  @keyframes mbsc-anim-sh-out {
    from {
      opacity: 1;
      transform: translateX(0);
    }

    to {
      opacity: 0;
      transform: translateX(100%);
    }
  }

  @-webkit-keyframes mbsc-anim-sh-out {
    from {
      opacity: 1;
      -webkit-transform: translateX(0);
    }

    to {
      opacity: 0;
      -webkit-transform: translateX(100%);
    }
  }


  /* Slide vertical in */

  @keyframes mbsc-anim-sv-in {
    from {
      opacity: 0;
      transform: translateY(-100%);
    }

    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  @-webkit-keyframes mbsc-anim-sv-in {
    from {
      opacity: 0;
      -webkit-transform: translateY(-100%);
    }

    to {
      opacity: 1;
      -webkit-transform: translateY(0);
    }
  }


  /* Slide vertical out */

  @keyframes mbsc-anim-sv-out {
    from {
      opacity: 1;
      transform: translateY(0);
    }

    to {
      opacity: 0;
      transform: translateY(100%);
    }
  }

  @-webkit-keyframes mbsc-anim-sv-out {
    from {
      opacity: 1;
      -webkit-transform: translateY(0);
    }

    to {
      opacity: 0;
      -webkit-transform: translateY(100%);
    }
  }


  /* Slide Down In */

  @keyframes mbsc-anim-sd-in {
    from {
      transform: translateY(-100%);
    }

    to {
      transform: translateY(0);
    }
  }

  @-webkit-keyframes mbsc-anim-sd-in {
    from {
      opacity: 1;
      -webkit-transform: translateY(-100%);
    }

    to {
      opacity: 1;
      -webkit-transform: translateY(0);
    }
  }


  /* Slide down out */

  @keyframes mbsc-anim-sd-out {
    from {
      transform: translateY(0);
    }

    to {
      transform: translateY(-100%);
    }
  }

  @-webkit-keyframes mbsc-anim-sd-out {
    from {
      opacity: 1;
      -webkit-transform: translateY(0);
    }

    to {
      opacity: 1;
      -webkit-transform: translateY(-100%);
    }
  }


  /* Slide Up In */

  @keyframes mbsc-anim-su-in {
    from {
      transform: translateY(100%);
    }

    to {
      transform: translateY(0);
    }
  }

  @-webkit-keyframes mbsc-anim-su-in {
    from {
      opacity: 1;
      -webkit-transform: translateY(100%);
    }

    to {
      opacity: 1;
      -webkit-transform: translateY(0);
    }
  }


  /* Slide up out */

  @keyframes mbsc-anim-su-out {
    from {
      transform: translateY(0);
    }

    to {
      transform: translateY(100%);
    }
  }

  @-webkit-keyframes mbsc-anim-su-out {
    from {
      opacity: 1;
      -webkit-transform: translateY(0);
    }

    to {
      opacity: 1;
      -webkit-transform: translateY(100%);
    }
  }
}



$mbsc-font-path: '' !default;

@include exports("icons") {

    @font-face {
        font-family: 'icons_mobiscroll';
        src: 
        url($mbsc-font-path + 'icons_mobiscroll.woff?cgonkw') format('woff'),
        url($mbsc-font-path + 'icons_mobiscroll.woff') format('woff'),
        url($mbsc-font-path + 'icons_mobiscroll.ttf?cgonkw') format('truetype');
        font-weight: normal;
        font-style: normal;
    }

    .mbsc-ic:before {
        font-family: 'icons_mobiscroll';
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

/* Icons */
 
.mbsc-ic-aid::before {
    content: "\ea01";
} 
.mbsc-ic-airplane::before {
    content: "\ea02";
} 
.mbsc-ic-alarm2::before {
    content: "\ea03";
} 
.mbsc-ic-arrow-down5::before {
    content: "\ea04";
} 
.mbsc-ic-arrow-left5::before {
    content: "\ea05";
} 
.mbsc-ic-arrow-left6::before {
    content: "\ea06";
} 
.mbsc-ic-arrow-right5::before {
    content: "\ea07";
} 
.mbsc-ic-arrow-right6::before {
    content: "\ea08";
} 
.mbsc-ic-arrow-up5::before {
    content: "\ea09";
} 
.mbsc-ic-attachment::before {
    content: "\ea0a";
} 
.mbsc-ic-bars::before {
    content: "\ea0b";
} 
.mbsc-ic-book::before {
    content: "\ea0c";
} 
.mbsc-ic-bubble::before {
    content: "\ea0e";
} 
.mbsc-ic-bubbles::before {
    content: "\ea0d";
} 
.mbsc-ic-bullhorn::before {
    content: "\ea0f";
} 
.mbsc-ic-calendar::before {
    content: "\ea10";
} 
.mbsc-ic-camera::before {
    content: "\ea11";
} 
.mbsc-ic-cart::before {
    content: "\ea12";
} 
.mbsc-ic-checkmark::before {
    content: "\ea13";
} 
.mbsc-ic-clock::before {
    content: "\ea14";
} 
.mbsc-ic-close::before {
    content: "\ea15";
} 
.mbsc-ic-cloud-download::before {
    content: "\ea16";
} 
.mbsc-ic-cloud-upload::before {
    content: "\ea17";
} 
.mbsc-ic-cogs::before {
    content: "\ea18";
} 
.mbsc-ic-connection::before {
    content: "\ea19";
} 
.mbsc-ic-copy2::before {
    content: "\ea1a";
} 
.mbsc-ic-copy3::before {
    content: "\ea1b";
} 
.mbsc-ic-credit::before {
    content: "\ea1c";
} 
.mbsc-ic-disk::before {
    content: "\ea1d";
} 
.mbsc-ic-download::before {
    content: "\ea1e";
} 
.mbsc-ic-drawer::before {
    content: "\ea1f";
} 
.mbsc-ic-droplet::before {
    content: "\ea20";
} 
.mbsc-ic-earth::before {
    content: "\ea21";
} 
.mbsc-ic-eye-blocked::before {
    content: "\ea22";
} 
.mbsc-ic-eye::before {
    content: "\ea23";
} 
.mbsc-ic-fa-globe::before {
    content: "\ea24";
} 
.mbsc-ic-fa-leaf::before {
    content: "\ea25";
} 
.mbsc-ic-fa-mail-reply::before {
    content: "\ea26";
} 
.mbsc-ic-fa-retweet::before {
    content: "\ea27";
} 
.mbsc-ic-fa-rotate-left::before {
    content: "\ea28";
} 
.mbsc-ic-file4::before {
    content: "\ea29";
} 
.mbsc-ic-film::before {
    content: "\ea2a";
} 
.mbsc-ic-flag::before {
    content: "\ea2b";
} 
.mbsc-ic-folder::before {
    content: "\ea2c";
} 
.mbsc-ic-forward::before {
    content: "\ea2e";
} 
.mbsc-ic-foundation-mail::before {
    content: "\ea2d";
} 
.mbsc-ic-foundation-minus-circle::before {
    content: "\ea2f";
} 
.mbsc-ic-globe::before {
    content: "\ea30";
} 
.mbsc-ic-heart::before {
    content: "\ea31";
} 
.mbsc-ic-history::before {
    content: "\ea32";
} 
.mbsc-ic-home::before {
    content: "\ea33";
} 
.mbsc-ic-image2::before {
    content: "\ea34";
} 
.mbsc-ic-ion-android-system-windows::before {
    content: "\ea35";
} 
.mbsc-ic-ion-bluetooth::before {
    content: "\ea36";
} 
.mbsc-ic-ion-navigate::before {
    content: "\ea37";
} 
.mbsc-ic-key2::before {
    content: "\ea38";
} 
.mbsc-ic-library::before {
    content: "\ea39";
} 
.mbsc-ic-line-settings::before {
    content: "\ea3a";
} 
.mbsc-ic-link::before {
    content: "\ea3b";
} 
.mbsc-ic-location::before {
    content: "\ea3c";
} 
.mbsc-ic-lock2::before {
    content: "\ea3d";
} 
.mbsc-ic-loop2::before {
    content: "\ea3e";
} 
.mbsc-ic-map::before {
    content: "\ea3f";
} 
.mbsc-ic-material-arrow-back::before {
    content: "\ea40";
} 
.mbsc-ic-material-brightness-medium::before {
    content: "\ea41";
} 
.mbsc-ic-material-check::before {
    content: "\ea42";
} 
.mbsc-ic-material-crop::before {
    content: "\ea43";
} 
.mbsc-ic-material-equalizer::before {
    content: "\ea44";
} 
.mbsc-ic-material-filter::before {
    content: "\ea45";
} 
.mbsc-ic-material-iso::before {
    content: "\ea46";
} 
.mbsc-ic-material-palette::before {
    content: "\ea47";
} 
.mbsc-ic-material-pause::before {
    content: "\ea48";
} 
.mbsc-ic-material-people::before {
    content: "\ea49";
} 
.mbsc-ic-material-photo-size-select-large::before {
    content: "\ea4a";
} 
.mbsc-ic-material-play-arrow::before {
    content: "\ea4b";
} 
.mbsc-ic-material-repeat::before {
    content: "\ea4c";
} 
.mbsc-ic-material-rotate-right::before {
    content: "\ea4d";
} 
.mbsc-ic-material-shuffle::before {
    content: "\ea4e";
} 
.mbsc-ic-material-skip-next::before {
    content: "\ea4f";
} 
.mbsc-ic-material-skip-previous::before {
    content: "\ea50";
} 
.mbsc-ic-material-stop::before {
    content: "\ea51";
} 
.mbsc-ic-material-texture::before {
    content: "\ea52";
} 
.mbsc-ic-material-wb-auto::before {
    content: "\ea53";
} 
.mbsc-ic-meteo-cloud2::before {
    content: "\ea54";
} 
.mbsc-ic-meteo-cloud3::before {
    content: "\ea55";
} 
.mbsc-ic-meteo-cloudy::before {
    content: "\ea56";
} 
.mbsc-ic-meteo-sun::before {
    content: "\ea57";
} 
.mbsc-ic-minus::before {
    content: "\ea58";
} 
.mbsc-ic-mobile::before {
    content: "\ea59";
} 
.mbsc-ic-music::before {
    content: "\ea5a";
} 
.mbsc-ic-neutral::before {
    content: "\ea5b";
} 
.mbsc-ic-newspaper::before {
    content: "\ea5c";
} 
.mbsc-ic-office::before {
    content: "\ea5e";
} 
.mbsc-ic-pencil::before {
    content: "\ea5d";
} 
.mbsc-ic-phone::before {
    content: "\ea60";
} 
.mbsc-ic-play::before {
    content: "\ea5f";
} 
.mbsc-ic-plus::before {
    content: "\ea61";
} 
.mbsc-ic-redo2::before {
    content: "\ea62";
} 
.mbsc-ic-remove::before {
    content: "\ea63";
} 
.mbsc-ic-reply::before {
    content: "\ea64";
} 
.mbsc-ic-sad::before {
    content: "\ea65";
} 
.mbsc-ic-sad2::before {
    content: "\ea66";
} 
.mbsc-ic-share::before {
    content: "\ea67";
} 
.mbsc-ic-smiley::before {
    content: "\ea68";
} 
.mbsc-ic-smiley2::before {
    content: "\ea69";
} 
.mbsc-ic-stack::before {
    content: "\ea6a";
} 
.mbsc-ic-star3::before {
    content: "\ea6b";
} 
.mbsc-ic-stopwatch::before {
    content: "\ea6c";
} 
.mbsc-ic-support::before {
    content: "\ea6d";
} 
.mbsc-ic-tag::before {
    content: "\ea6f";
} 
.mbsc-ic-thumbs-up::before {
    content: "\ea6e";
} 
.mbsc-ic-thumbs-up2::before {
    content: "\ea70";
} 
.mbsc-ic-undo2::before {
    content: "\ea71";
} 
.mbsc-ic-unlocked::before {
    content: "\ea72";
} 
.mbsc-ic-upload::before {
    content: "\ea74";
} 
.mbsc-ic-user4::before {
    content: "\ea73";
} 
.mbsc-ic-volume-high::before {
    content: "\ea75";
} 
.mbsc-ic-volume-medium::before {
    content: "\ea76";
} 
.mbsc-ic-volume-mute2::before {
    content: "\ea77";
}

}

@include exports("frame") {

  .mbsc-fr-w,
  .mbsc-fr-overlay {
    -webkit-transform: translateZ(0);
  }

  .mbsc-fr {
    pointer-events: none;
    z-index: 99998;
    font-weight: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-text-size-adjust: 100%;
  }

  .mbsc-fr-lock-ctx {
    position: relative;
  }

  .mbsc-fr-lock.mbsc-fr-lock-ios {
    overflow: hidden;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: auto;
  }

  .mbsc-fr-pos {
    visibility: hidden;
  }

  .mbsc-fr-scroll {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
  }

  .mbsc-fr-popup {
    max-width: 98%;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    font-size: 12px;
    text-shadow: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
  }

  .mbsc-rtl {
    direction: rtl;
  }


  /* Box sizing */

  .mbsc-fr-popup,
  .mbsc-fr-btn-cont,
  .mbsc-fr-arr {
    box-sizing: border-box;
  }

  .mbsc-fr .mbsc-fr-w {
    box-sizing: content-box;
  }

  .mbsc-fr-w {
    min-width: 256px;
    max-width: 100%;
    overflow: hidden;
    text-align: center;
    font-family: arial, verdana, sans-serif;
  }


  /* Modal overlay */

  .mbsc-fr,
  .mbsc-fr-persp,
  .mbsc-fr-overlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
  }

  .mbsc-fr-lock .mbsc-fr-persp {
    -ms-touch-action: none;
    touch-action: none;
  }

  .mbsc-fr-lock-ctx > .mbsc-fr,
  .mbsc-fr-lock-ctx .mbsc-fr-persp,
  .mbsc-fr-lock-ctx .mbsc-fr-overlay {
    position: absolute;
  }

  .mbsc-fr-persp {
    pointer-events: auto;
    overflow: hidden;
  }

  .mbsc-fr-overlay {
    z-index: 1;
    background: rgba(0, 0, 0, .7);
  }


  /* Liquid mode */

  .mbsc-fr-liq .mbsc-fr-popup {
    max-width: 100%;
  }


  /* Top/Bottom mode */

  .mbsc-fr-top .mbsc-fr-popup,
  .mbsc-fr-bottom .mbsc-fr-popup {
    width: 100%;
    max-width: 100%;
  }

  .mbsc-fr-top .mbsc-fr-w,
  .mbsc-fr-bottom .mbsc-fr-w {
    padding-left: constant(safe-area-inset-left);
    padding-left: env(safe-area-inset-left);
    padding-right: constant(safe-area-inset-right);
    padding-right: env(safe-area-inset-right);
  }

  .mbsc-fr-bottom .mbsc-fr-w {
    padding-bottom: constant(safe-area-inset-bottom);
    padding-bottom: env(safe-area-inset-bottom);
  }

  .mbsc-fr-top .mbsc-fr-popup {
    padding-top: constant(safe-area-inset-top);
    padding-top: env(safe-area-inset-top);
  }


  /* Inline mode */

  .mbsc-fr-inline {
    position: relative;
    pointer-events: auto;
    z-index: 0;
  }

  .mbsc-fr-inline .mbsc-fr-popup {
    position: static;
    max-width: 100%;
  }


  /* Bubble mode */

  .mbsc-fr-bubble,
  .mbsc-fr-bubble .mbsc-fr-persp {
    position: absolute;
  }

  .mbsc-fr-bubble .mbsc-fr-arr-w {
    position: absolute;
    z-index: 1;
    left: 0;
    width: 100%;
    overflow: hidden;
  }

  .mbsc-fr-bubble-top .mbsc-fr-arr-w {
    top: 100%;
  }

  .mbsc-fr-bubble-bottom .mbsc-fr-arr-w {
    bottom: 100%;
  }

  .mbsc-fr-bubble .mbsc-fr-arr-i {
    margin: 0 1.75em;
    position: relative;
    direction: ltr;
  }

  .mbsc-fr-bubble .mbsc-fr-arr {
    display: block;
  }

  .mbsc-fr-arr {
    display: none;
    position: relative;
    left: 0;
    width: 2em;
    height: 2em;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    margin-left: -1em;
  }

  .mbsc-fr-bubble-bottom .mbsc-fr-arr {
    top: 1.333334em;
  }

  .mbsc-fr-bubble-top .mbsc-fr-arr {
    top: -1.333334em;
  }

  .mbsc-fr-hdn {
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    overflow: hidden;
  }


  /* Header */

  .mbsc-fr-hdr {
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
  }


  /* Buttons */

  .mbsc-fr-btn {
    overflow: hidden;
    display: block;
    text-decoration: none;
    white-space: nowrap;
    text-overflow: ellipsis;
    vertical-align: top;
  }

  .mbsc-fr-btn-e {
    cursor: pointer;
  }

  .mbsc-fr-btn.mbsc-disabled {
    cursor: not-allowed;
  }


  /* Button container */

  .mbsc-fr-btn-cont {
    display: table;
    width: 100%;
    text-align: center;
    white-space: normal;
  }

  .mbsc-fr-btn-cont .mbsc-disabled {
    opacity: .3;
  }


  /* Button wrapper */

  .mbsc-fr-btn-w {
    vertical-align: top;
    display: table-cell;
    position: relative;
    z-index: 5;
  }

  .mbsc-fr-btn-w .mbsc-fr-btn:before {
    padding: .375em;
  }

  /* Desktop view */

  .mbsc-fr-pointer {

    /* Embedded components */
    &.mbsc-fr .mbsc-fr-w .mbsc-fr-inline .mbsc-fr-w {
      box-shadow: none;
      border-radius: 0;
    }

    .mbsc-ltr .mbsc-fr-w,
    .mbsc-ltr .mbsc-sc-whl .mbsc-sel-gr {
      text-align: left;
    }

    .mbsc-rtl .mbsc-fr-w,
    .mbsc-rtl .mbsc-sc-whl .mbsc-sel-gr {
      text-align: right;
    }

    &.mbsc-fr-top .mbsc-fr-w,
    &.mbsc-fr-bottom .mbsc-fr-w {
      pointer-events: auto;
      display: inline-block;
      margin-top: 3em;
      margin-bottom: 3em;
      max-width: 98%;
    }

    &.mbsc-fr-top .mbsc-fr-popup,
    &.mbsc-fr-bottom .mbsc-fr-popup {
      text-align: center;
      pointer-events: none;
    }

    &.mbsc-fr-bubble .mbsc-fr-arr-w {
      display: none;
    }

    .mbsc-sel-empty {
      text-align: center;
    }
  }
}


@include exports("frame.mobiscroll") {
  .mbsc-mobiscroll {
    .mbsc-fr-w {
      min-width: 16em;
      font-size: 16px;
    }

    .mbsc-fr-hdr {
      padding: 0 .6666em;
      padding-top: .6666em;
      font-size: .75em;
      text-transform: uppercase;
      min-height: 2em;
      line-height: 2em;
    }

    .mbsc-fr-btn-cont {
      display: block;
      overflow: hidden;
      text-align: right;
      padding: 0 .5em .5em .5em;
    }

    .mbsc-ltr .mbsc-fr-btn-cont {
      text-align: right;
    }

    .mbsc-rtl .mbsc-fr-btn-cont {
      text-align: left;
    }

    .mbsc-fr-btn-w {
      display: inline-block;
    }

    .mbsc-fr-btn {
      height: 2.5em;
      line-height: 2.5em;
      padding: 0 1em;
      text-transform: uppercase;
    }

    /* Display modes */
    &.mbsc-fr-center .mbsc-fr-w,
    &.mbsc-fr-bubble .mbsc-fr-w {
      border-radius: .25em;
    }

    &.mbsc-fr-no-overlay {
      .mbsc-fr-arr {
        box-shadow: 0 0 1em rgba(0, 0, 0, .2);
      }

      .mbsc-fr-w {
        box-shadow: 0 .125em 1em rgba(0, 0, 0, .3);
      }

      &.mbsc-fr-bubble .mbsc-fr-w {
        border-radius: .25em;
      }
    }
  }

  @include mbsc-mobiscroll-frame(mobiscroll, (background: $mbsc-mobiscroll-background, text: $mbsc-mobiscroll-text, accent: $mbsc-mobiscroll-accent));
}





@mixin mbsc-mobiscroll-scroller($theme, $params) {
  @include exports("scroller.#{$theme}.colors") {

    @include mbsc-mobiscroll-frame($theme, $params);

    $background: map-get($params, background);
    $accent: map-get($params, accent);
    $text: map-get($params, text);

    .mbsc-#{$theme} {
      .mbsc-sc-lbl {
        color: $accent;
      }

      .mbsc-sc-whl-l {
        border-top: 1px solid $accent;
        border-bottom: 1px solid $accent;
      }

      .mbsc-sc-btn {
        color: $accent;
        background: $background;
      }

      &.mbsc-no-touch .mbsc-sc-itm.mbsc-btn-e:hover,
      .mbsc-sc-itm:focus {
        background: rgba($text, .1);
      }

      &.mbsc-no-touch .mbsc-sc-btn:hover:before,
      &.mbsc-sc .mbsc-sc-whl .mbsc-sc-itm.mbsc-active,
      .mbsc-sc-btn.mbsc-active:before {
        background: rgba($accent, .3);
      }

      /* Multiple select */
      .mbsc-sc-whl-multi {
        .mbsc-sc-itm-sel:before {
          color: $accent;
        }
      }
    }
  }
}




@include exports("scroller") {

  .mbsc-sc-whl-o,
  .mbsc-sc-btn {
    /* Prevent flickering on animation */
    -webkit-transform: translateZ(0);
  }

  /* Force content box */

  .mbsc-sc .mbsc-sc-whl-c,
  .mbsc-sc .mbsc-sc-whl-l,
  .mbsc-sc .mbsc-sc-whl {
    box-sizing: content-box;
  }

  /* Force border box */

  .mbsc-sc-whl-gr-c,
  .mbsc-sc-itm {
    box-sizing: border-box;
  }

  .mbsc-sc-whl-gr-c {
    position: relative;
    max-width: 100%;
    vertical-align: middle;
    display: inline-block;
    overflow: hidden;
  }

  .mbsc-fr-bottom .mbsc-sc-whl-gr-c:first-child:last-child,
  .mbsc-fr-top .mbsc-sc-whl-gr-c:first-child:last-child,
  .mbsc-fr-inline .mbsc-sc-whl-gr-c:first-child:last-child,
  .mbsc-fr-liq .mbsc-sc-whl-gr-c {
    display: block;
  }

  .mbsc-sc-whl-gr {
    margin: 0 auto;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
  }

  .mbsc-sc-whl-w {
    max-width: 100%;
    position: relative;
    -ms-touch-action: none;
    touch-action: none;
  }

  .mbsc-fr-pointer .mbsc-sc-whl-w,
  .mbsc-fr-liq .mbsc-sc-whl-w {
    -webkit-box-flex: 1;
    -webkit-flex: 1 auto;
    -ms-flex: 1 auto;
    flex: 1 auto;
  }

  .mbsc-sc-whl-o {
    position: absolute;
    z-index: 2;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none;
    display: none;
  }

  .mbsc-sc-whl-l {
    display: none;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    pointer-events: none;
  }

  .mbsc-sc-whl-w .mbsc-sc-whl-l {
    display: block;
  }

  .mbsc-sc-whl {
    overflow: hidden;
    /* Forces IE to respect overflow hidden while animating */
    /* Looks like this is not needed, also, it brakes rendering on Samsung S5 Mini */
    /* border-radius: 1px; */
    /* Fixes Firefox rendering issues */
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    margin: -1px 0;
  }

  .mbsc-sc-whl-c {
    position: relative;
    z-index: 1;
    top: 50%;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
  }

  .mbsc-sc-whl-sc {
    position: relative;
  }

  .mbsc-sc-itm {
    position: relative;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .mbsc-sc-itm-inv,
  .mbsc-sc-itm-inv-h {
    opacity: .3;
  }

  .mbsc-sc-lbl {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100%;
    display: none;
  }

  .mbsc-sc-lbl-v .mbsc-sc-lbl {
    display: block;
  }

  .mbsc-sc-btn {
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    cursor: pointer;
    opacity: 1;
    text-align: center;
    transition: opacity .2s linear;
  }

  .mbsc-sc-btn:before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
  }

  .mbsc-sc-whl-a .mbsc-sc-btn {
    opacity: 0;
  }

  .mbsc-sc-btn-plus {
    bottom: 0;
  }

  .mbsc-sc-btn-minus {
    top: 0;
  }

  /* 3D */

  .mbsc-sc-whl-gr-3d {
    -webkit-perspective: 1200px;
    perspective: 1200px;
  }

  .mbsc-sc-whl-gr-3d .mbsc-sc-whl {
    /* For iOS to respect z-index */
    overflow: visible;
  }

  .mbsc-sc-whl-gr-3d .mbsc-sc-whl-c {
    overflow: hidden;
  }

  .mbsc-sc-whl-gr-3d .mbsc-sc-whl-w,
  .mbsc-sc-whl-gr-3d .mbsc-sc-whl {
    /* For Edge and Firefox */
    transform-style: preserve-3d;
  }

  .mbsc-sc-whl-3d {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
  }

  .mbsc-sc-itm-3d {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    cursor: pointer;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }

  .mbsc-sc-itm-del {
    display: none;
  }

  /* Multiline */

  .mbsc-sc-itm-ml {
    width: 100%;
    height: auto;
    display: inline-block;
    vertical-align: middle;
    white-space: normal;
  }

  /* Multiple */

  .mbsc-sc-whl-multi .mbsc-sc-itm-sel:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 1em;
    text-align: center;
  }

  /* Desktop view */

  .mbsc-fr-pointer {

    .mbsc-fr-w .mbsc-sc-whl-gr-c,
    .mbsc-fr-w .mbsc-sc-whl-gr {
      padding: 0;
    }

    .mbsc-sc-whl-gr-c:first-child:last-child {
      display: block;
    }
  }

  .mbsc-sc-bar-c {
    position: absolute;
    z-index: 4;
    top: 0;
    bottom: 0;
    right: 0;
    width: 10px;
    opacity: 0;
    background: rgba(0, 0, 0, .05);
    transform: translateZ(0);
    transition: opacity .2s;
  }

  .mbsc-sc-bar {
    position: absolute;
    right: 0;
    top: 0;
    width: 10px;
    height: 100%;
  }

  .mbsc-sc-bar:after {
    content: '';
    position: absolute;
    top: 2px;
    right: 2px;
    bottom: 2px;
    left: 2px;
    background: rgba(0, 0, 0, .5);
    border-radius: 3px;
  }

  .mbsc-sc-whl-w:hover .mbsc-sc-bar-c,
  .mbsc-sc-whl-anim .mbsc-sc-bar-c {
    opacity: 1;
  }
}


@include exports("scroller.mobiscroll") {
  .mbsc-mobiscroll {
    .mbsc-sc-whl-gr {
      padding: .5em .25em;
    }

    .mbsc-sc-whl-w {
      margin: 0 .25em;
    }

    .mbsc-sc-lbl-v .mbsc-sc-whl-w {
      margin-top: 1.875em;
    }

    .mbsc-sc-lbl {
      font-size: .75em;
      line-height: 2.5em;
      text-transform: uppercase;
    }

    .mbsc-sc-cp .mbsc-sc-whl-w {
      padding: 2em 0;
    }

    .mbsc-sc-btn {
      height: 2em;
      line-height: 2em;
    }

    .mbsc-sc-btn:before {
      font-size: 1.5em;
    }

    .mbsc-sc-itm {
      padding: 0 .25em;
      font-size: 1.375em;
    }

    &.mbsc-no-touch .mbsc-sc-itm.mbsc-btn-e:hover,
    .mbsc-sc-itm:focus {
      outline: 0;
    }

    /* Multiple select */
    .mbsc-sc-whl-multi {
      .mbsc-sc-itm {
        padding: 0 1.818181em;
      }

      .mbsc-sc-itm-sel:before {
        font-size: 1.818181em;
      }
    }

    /* Desktop view */
    &.mbsc-fr-pointer {
      .mbsc-sc-lbl {
        padding-left: 1.666667em;
        padding-right: 1.666667em;
      }

      .mbsc-sc-whl-w {
        margin-left: 0;
        margin-right: 0;
      }

      .mbsc-sc-itm {
        font-size: 1em;
        padding: 0 1.25em;
      }

      .mbsc-sc-whl-multi {
        .mbsc-sc-itm {
          padding: 0 2.5em;
        }

        .mbsc-sc-itm-sel:before {
          font-size: 2em;
        }
      }

      .mbsc-ltr .mbsc-sc-whl-multi .mbsc-sc-itm-sel:before {
        left: .125em;
      }

      .mbsc-rtl .mbsc-sc-whl-multi .mbsc-sc-itm-sel:before {
        right: .125em;
      }
    }
  }

  @include mbsc-mobiscroll-scroller(mobiscroll, (background: $mbsc-mobiscroll-background, text: $mbsc-mobiscroll-text, accent: $mbsc-mobiscroll-accent));
}





@mixin mbsc-mobiscroll-calbase($theme, $params) {
  @include exports("calbase.#{$theme}.colors") {

    @include mbsc-mobiscroll-scroller($theme, $params);

    $background: map-get($params, background);
    $text: map-get($params, text);
    $accent: map-get($params, accent);

    .mbsc-#{$theme} {
      .mbsc-cal-picker {
        background: $background;
      }

      .mbsc-cal-days > div {
        border-bottom: 1px solid $accent;
        color: $accent;
      }

      .mbsc-cal-today {
        color: $accent;
      }

      /* Hover, focus */
      &.mbsc-no-touch:not(.mbsc-ev-cal) .mbsc-cal-cell:not(.mbsc-disabled):hover .mbsc-cal-cell-txt,
      &.mbsc-no-touch .mbsc-cal-day:not(.mbsc-disabled) .mbsc-cal-day-date:hover,
      .mbsc-cal-cell:focus .mbsc-cal-cell-txt {
        background: rgba($accent, .3);
      }

      /* Selected */
      .mbsc-cal-c .mbsc-cal .mbsc-cal-body .mbsc-cal-row .mbsc-selected .mbsc-cal-cell-txt {
        background: $accent;
        color: $background;
      }

      .mbsc-cal-day-colored.mbsc-selected .mbsc-cal-day-date {
        border-color: $accent;
      }

      /* Week numbers */
      .mbsc-cal-week-nr {
        color: $accent;
      }

      .mbsc-cal-tab {
        border: 1px solid $accent;
        color: $text;
      }

      .mbsc-fr-w .mbsc-cal-tabs-c .mbsc-cal-tabs .mbsc-cal-tab.mbsc-selected {
        background: $accent;
        color: $background;
      }

      /* Marks */
      .mbsc-cal-mark {
        background: $text;
      }

      .mbsc-cal-txt {
        color: $background;
        background: $text;
      }

      .mbsc-cal-icons {
        color: $text;
      }

    }
  }
}




@include exports("calbase") {
  /* Box sizing */

  .mbsc-cal-slide,
  .mbsc-cal-day,
  .mbsc-cal-day-i {
    box-sizing: border-box;
  }

  .mbsc-cal .mbsc-cal-day-date {
    text-align: center;
    box-sizing: content-box;
  }

  /* Flex layout */

  .mbsc-cal-hdr,
  .mbsc-cal-btn-w,
  .mbsc-cal-days-c,
  .mbsc-cal-days,
  .mbsc-cal-tabbed .mbsc-fr-c .mbsc-sc-whl-gr-c {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }

  .mbsc-cal-btn-w,
  .mbsc-cal-month,
  .mbsc-cal-year,
  .mbsc-cal-days,
  .mbsc-cal-days > div {
    -webkit-box-flex: 1;
    -webkit-flex: 1 auto;
    -ms-flex: 1 auto;
    flex: 1 auto;
  }

  .mbsc-cal-c {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
  }

  /* Header */

  .mbsc-cal-btn-w {
    width: 50%;
  }

  .mbsc-cal-month,
  .mbsc-cal-year {
    width: 1%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
  }

  .mbsc-cal-btn.mbsc-disabled {
    opacity: .3;
    cursor: not-allowed;
  }

  /* Week days */

  .mbsc-cal-days {
    line-height: 1.875em;
    text-align: center;
  }

  .mbsc-cal-days > div {
    width: 14.285715%;
  }

  .mbsc-cal-body {
    position: relative;
  }

  .mbsc-cal-scroll-c {
    overflow: hidden;
    height: 100%;
  }

  .mbsc-cal-scroll {
    width: 100%;
    height: 100%;
  }

  .mbsc-cal-slide {
    position: absolute;
    z-index: 0; // Needed by Edge
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .mbsc-cal-slide:first-child {
    position: relative;
  }

  .mbsc-cal-table {
    display: table;
    width: 100%;
    height: 100%;
    table-layout: fixed;
    // Needed for iOS Safari to prevent animation flicker
    -webkit-transform: translateZ(0);
  }

  .mbsc-cal-row {
    display: table-row;
  }

  .mbsc-cal-cell {
    display: table-cell;
    vertical-align: middle;

    &:focus {
      outline: 0;
    }
  }

  .mbsc-cal-picker {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: .9375em 0;
    transition: all .2s ease-in-out;

    .mbsc-cal-cell {
      width: 33.333333%;
      height: 25%;
      cursor: pointer;
    }
  }

  .mbsc-cal-h {
    visibility: hidden;
    opacity: 0;
  }

  .mbsc-cal-day {
    max-width: 14.285715%; // if only width is used, layout is broken with week numbers displayed
    height: 16.666667%; // IE needs it in fullscreen
    position: relative;
    text-align: center;
    cursor: pointer;
  }

  .mbsc-cal-day-i {
    position: relative;
    height: 100%;
  }

  .mbsc-cal-day-diff .mbsc-cal-day-date {
    opacity: .5;
  }

  .mbsc-cal-week-view .mbsc-cal-day-date,
  .mbsc-cal-day-diff.mbsc-selected .mbsc-cal-day-date {
    opacity: 1;
  }

  .mbsc-cal-cell.mbsc-disabled {
    cursor: not-allowed;

    .mbsc-cal-cell-txt {
      opacity: .2;
    }
  }

  /* Hide outer days */

  .mbsc-cal-hide-diff {
    .mbsc-cal-day-diff {
      cursor: default;

      .mbsc-cal-day-i {
        visibility: hidden;
      }
    }
  }

  /* Week numbers */

  .mbsc-ltr .mbsc-cal-weeks .mbsc-cal-days {
    margin-left: 1.625em;
  }

  .mbsc-rtl .mbsc-cal-weeks .mbsc-cal-days {
    margin-right: 1.625em;
  }

  .mbsc-cal-week-nr {
    width: 1.625em;
    text-align: center;
  }

  /* Multiple month */

  .mbsc-cal-multi {
    .mbsc-cal-hdr {
      display: block;
    }

    .mbsc-cal-btn-w {
      width: auto;
    }

    .mbsc-cal-days,
    .mbsc-cal-slide {
      padding: 0 .5em;
    }
  }

  /* Liquid mode */

  .mbsc-fr-liq {
    .mbsc-cal-c {
      display: block;
    }
  }

  /* Full screen mode */

  .mbsc-calendar.mbsc-fr-liq.mbsc-fr-center {
    .mbsc-fr-overlay {
      display: none;
    }

    .mbsc-fr-w {
      border-radius: 0;
      padding-left: constant(safe-area-inset-left);
      padding-left: env(safe-area-inset-left);
      padding-right: constant(safe-area-inset-right);
      padding-right: env(safe-area-inset-right);
      padding-bottom: constant(safe-area-inset-bottom);
      padding-bottom: env(safe-area-inset-bottom);
    }
  }

  /* Tabs */

  .mbsc-cal-tabs-c {
    display: none;
  }

  .mbsc-cal-tabs {
    display: table;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .mbsc-cal-tab {
    position: relative;
    width: 33.33%;
    display: table-cell;
    overflow: hidden;
    cursor: pointer;
    text-align: center;
  }

  .mbsc-cal-tabbed {
    .mbsc-fr-c {
      position: relative;
    }

    .mbsc-w-p {
      transition: opacity .2s ease-in-out;
    }

    .mbsc-sc-whl-gr-c {
      position: absolute;
      z-index: 1;
      top: 0;
      left: 0;
      right: 0;
      max-width: none;
      height: 100%;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -ms-box-align: center;
      align-items: center;
    }

    .mbsc-cal-c,
    .mbsc-cal-tabs-c {
      display: block;
    }

    /* During positioning */
    .mbsc-fr-pos {
      .mbsc-sc-whl-gr-c {
        width: auto;
      }
    }
  }

  /* Marks */

  .mbsc-cal-has-marks .mbsc-cal-day {
    padding-bottom: .25em;
  }

  .mbsc-cal-marks {
    position: absolute;
    left: 0;
    right: 0;
    height: .375em;
    margin-top: -.125em;
    overflow: hidden;
    white-space: nowrap;
  }

  .mbsc-cal-mark {
    display: inline-block;
    vertical-align: top;
    width: .25em;
    height: .25em;
    margin: .0625em;
    border-radius: .25em;
  }

  /* Text & icons */

  // .mbsc-cal-has-txt .mbsc-cal-day {
  //     padding-bottom: 1em;

  //     .mbsc-cal-icons {
  //         background: none;
  //     }
  // }

  .mbsc-cal-txt-w {
    position: absolute;
    z-index: 2;
    pointer-events: none;
  }

  .mbsc-ltr .mbsc-cal-txt {
    text-align: left;
  }

  .mbsc-rtl .mbsc-cal-txt {
    text-align: right;
  }

  .mbsc-cal-txt,
  .mbsc-cal-txt-ph,
  .mbsc-cal-txt-more {
    position: relative;
    height: 1.6em;
    line-height: 1.6em;
    overflow: hidden;
    padding: 0 .3em;
    font-size: .625em;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin: 0 .1em .2em .1em;
  }

  .mbsc-no-touch .mbsc-cal-txt:before {
    content: '';
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transition: background-color .2s;
  }

  .mbsc-no-touch .mbsc-cal-txt.mbsc-hover:before {
    background-color: rgba(0, 0, 0, .2);
  }

  .mbsc-no-touch .mbsc-cal-txt-more:hover {
    background-color: rgba(0, 0, 0, .1);
  }

  .mbsc-cal-txt-more {
    text-align: left;
    transition: background-color .2s;
  }

  // .mbsc-cal-txt {
  //     position: absolute;
  //     left: .1em;
  //     right: .1em;
  //     height: 1.6em;
  //     line-height: 1.6em;
  //     overflow: hidden;
  //     padding: 0 .2em;
  //     font-size: .625em;
  //     white-space: nowrap;
  // }

  .mbsc-cal .mbsc-cal-btn {
    position: relative;
    z-index: 1;
  }
}



@include exports("calbase.mobiscroll") {
  .mbsc-mobiscroll {
    .mbsc-cal-c {
      padding: .5em;
    }

    .mbsc-cal-btn-w {
      font-size: 1.125em;
      line-height: 2.222223em;
    }

    .mbsc-cal .mbsc-cal-btn {
      width: 2.666667em;
      height: 2.666667em;
      line-height: 2.666667em;
      padding: 0;
      border-radius: 2em;
      margin: -.222222em;
    }

    .mbsc-cal-picker {
      border-top: 1px solid transparent;

      .mbsc-cal-cell-i {
        display: inline-block;
        height: 2em;
        padding: 0 1em;
        line-height: 2em;
        border-radius: 2em;
        white-space: nowrap;
      }
    }

    .mbsc-cal-days > div {
      font-size: .6875em;
    }

    .mbsc-cal-day-date {
      display: inline-block;
      width: 2.153847em;
      height: 2.153847em;
      margin: .307692em 0;
      line-height: 2.153847em;
      font-size: .8125em;
      border: 2px solid transparent;
      border-radius: 2em;
    }

    /* Week numbers */
    .mbsc-cal-week-nr {
      width: 2.363637em;
      font-size: .6875em;
    }

    /* Tabs */
    .mbsc-cal-tabs-c {
      line-height: 1.875em;
      padding: .5em .5em 0 .5em;
      text-transform: uppercase;
    }

    .mbsc-cal-tab {
      font-size: .7em;
      padding: 0 1.2em;
    }
  }

  @include mbsc-mobiscroll-calbase(mobiscroll, (background: $mbsc-mobiscroll-background, text: $mbsc-mobiscroll-text, accent: $mbsc-mobiscroll-accent));
}





@mixin mbsc-mobiscroll-calendar($theme, $params) {
  @include exports("calendar.#{$theme}.colors") {
    @include mbsc-mobiscroll-calbase($theme, $params);
  }
}





@include exports("calendar.mobiscroll") {
  @include mbsc-mobiscroll-calendar(mobiscroll, (background: $mbsc-mobiscroll-background, text: $mbsc-mobiscroll-text, accent: $mbsc-mobiscroll-accent));
}



// Theme builder function for mobiscroll theme

@mixin mbsc-mobiscroll-theme($theme, $colors) {
    @include mbsc-mobiscroll-calendar($theme, $colors);
}

@mixin mbsc-custom-theme($theme, $base-theme, $colors) {
    @if $base-theme==mobiscroll {
        @include mbsc-mobiscroll-theme($theme, $colors);
    }
}

$colors-mobiscroll-dark: (
    background: $mbsc-mobiscroll-dark-background,
    text: $mbsc-mobiscroll-dark-text,
    accent: $mbsc-mobiscroll-dark-accent
);
@include mbsc-mobiscroll-theme(mobiscroll-dark, $colors-mobiscroll-dark);

