@import "./frame";

/* Frame */
.mbsc-bootstrap {
  .mbsc-fr-popup {
    display: block;
    padding: 0;
    margin: 0;
  }

  .mbsc-fr-hdr {
    padding: 0 14px;
    min-height: 37px;
    line-height: 37px;
  }

  .mbsc-fr-w {
    font-family: inherit;
    padding: 0;
  }

  .mbsc-fr-overlay {
    background: rgba(0, 0, 0, .5);
  }

  .mbsc-fr-btn-cont {
    padding: 0 2px 4px 2px;
  }

  .mbsc-fr-btn {
    display: block;
    margin: 0 2px;
  }


  /* Inline mode */

  &.mbsc-inline .mbsc-fr-popup {
    display: inline-block;
  }


  /* Top/bottom mode */

  &.mbsc-fr-inline .mbsc-fr-popup,
  &.mbsc-fr-top .mbsc-fr-popup,
  &.mbsc-fr-bottom .mbsc-fr-popup {
    border-radius: 0;
  }


  /* Bubble mode */

  .mbsc-fr-arr-i {
    max-width: none;
    height: 20px;
    margin: 0 10px;
    padding: 0;
    border: 0;
    display: block;
    border-color: transparent;
    background: none;
    box-shadow: none;
  }

  .mbsc-fr-arr-w {
    margin: 0;
    overflow: visible;
  }

  .mbsc-fr-bubble-top .mbsc-fr-arr {
    top: 0;
    bottom: auto;
  }

  .mbsc-fr-bubble-bottom .mbsc-fr-arr {
    top: auto;
    bottom: 0;
  }

  /* 4.x */

  &.mbsc-fr .mbsc-fr-arr {
    margin: 0;
    -webklit-transform: translate(-50%);
    transform: translate(-50%);
  }
}
