@import 'variables';

@-viewport {
  width: device-width;
}

.mf-wrap {
  .mf-clear-fix {
    *zoom: 1;

    &::before,
    &::after { content: ' '; display: table; }

    &::after { clear: both; }
  }

  * {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    outline: none;
  }

  .mf-anim-on,
  .mf-anim-on * {
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
  }

  .mf-anim-off,
  .mf-anim-off * {
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
    -webkit-transition: none !important;
    transition: none !important;
  }

  input,
  textarea,
  button {
    appearance: none;
  }

  button {
    cursor: pointer;

    &[disabled] {
      cursor: not-allowed;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      pointer-events: none;
      background: $MF_BackgroundColor_Disabled !important;
    }

    &:focus {
      outline: 0;
      box-shadow: none;
    }
  }

  a {
    color: inherit;
    outline: none;
    text-decoration: none;

    &:hover,
    &:active,
    &:focus,
    &:link,
    &:visited {
      color: inherit;
      outline: 0;
      text-decoration: none;
      box-shadow: none;
    }
  }

  .mf-text-center {
    text-align: center;
  }

  .mf-hide {
    height: 1px;
    margin-top: 20px;
    opacity: 0;
    visibility: hidden;
  }

  h2.mf-hide {
    margin-top: 0;
  }

  .mf-notification-margin {
    width: 100%;
    height: 1px;
    margin-bottom: 60px;

    @media all and (max-width: $screen-md-max) {
      margin-bottom: 45px;
    }

    @media all and (max-width: $screen-wp) {
      margin-bottom: 30px;
    }
  }

  .mf-wait {
    cursor: wait;

    * {
      pointer-events: none;
    }
  }

  .mf-hidden {
    display: none;
  }
}

.mf-text-line {
  display: block;

  @media all and (max-width: $screen-xs-max) {
    display: inline;
  }
}

body.mpwd-desktop {
  .mf-btn.magic-button {
    display: none;
  }

  .mf-modal {
    .mf-mobile-tip {
      display: none !important;
    }

    .mf-desktop-tip {
      display: block !important;
    }

    img.mf-desktop-tip {
      @media all and (max-width: $screen-md-max) {
        display: inline-block !important;
      }
    }
  }

  p.mf-step-desc-additional {
    display: none;
  }
}

body.mpwd-mobile {
  .mf-btn.magic-button {
    display: inline-block;
  }

  .mf-modal {
    .mf-mobile-tip {
      display: block !important;
    }

    .mf-desktop-tip {
      display: none !important;
    }

    img.mf-mobile-tip {
      @media all and (max-width: $screen-sm-max) {
        display: inline-block !important;
      }
    }
  }

  p.mf-step-desc-additional {
    display: block;
  }
}