@import 'public-booking/main_dependencies';

bb-variant-switcher {
  display: block;
  height: 40px;

  position: absolute;
  top: $bb-variant-switcher-top-offset;

  @include print-hidden;

  .variant-switcher__inline-block {
    display: inline-block;
  }

  .variant-switcher__inline-block--collapsed {
    visibility: hidden;
  }

  .variant-switcher__function {
    display: inline-block;
    &:focus, &:focus:active {
      background: $brand-primary;
    }

    &:hover {
      background: darken($brand-primary, 10%) !important;
    }
  }

  .variant-switcher__input {
    display: none;

    &:checked ~ span {
      background: darken($brand-primary, 10%);
    }
  }

  button, span {
    @include button-variant(white, $brand-primary, $brand-primary);
    float: left;

    cursor: pointer;
    font-weight: normal;

    border-radius: 0;
    border: 0;

    padding: 5px 10px 5px 10px;

    &:focus, &:focus:active {
      outline: none;
    }
  }

  // Keep the same style for name span but make it inactive.
  button[disabled] {
    opacity: 1.0;
  }

  .tooltip {
    font-size: 14px;
    .tooltip-inner {
      max-width: none;
      white-space: nowrap;
      padding: 15px;
    }
  }

}