@import (reference) "~ui/styles/variables";
@import (reference) "~bootstrap/less/list-group";
@import (reference) "~ui/styles/list-group-menu";

.vis-wizard {
  h1 {
    margin-top: 45px;
  }
}

.wizard-vis-type {
  .list-group-item();
  .list-group-menu .list-group-menu-item();

  // overrided for tablet and desktop
  @media (min-width: @screen-md-min) {
    display: flex;
    align-items: flex-start;
  }

  &-heading {
    flex: 0 0 200px;
    display: flex;
    align-items: center;
    font-size: 1.2em;

    .fa {
      flex: 0 0 auto;
      margin-right: @padding-base-horizontal;
      font-size: 1.5em;
      text-align: center;
    }

    h4 {
      flex: 1 0 auto;
    }
  }

  &-description {
    flex: 1 1 auto;
    color: @wizard-vis-type-description-color;
  }
}

.visualize-info {
  align-self: flex-end;

  &-tab {
    background-color: @visualize-info-bg;
    padding: 5px 10px;
    margin-left: @padding-base-horizontal;
    border-bottom-left-radius: @border-radius-base;
    text-align: right;
    font-weight: bold;
  }

}

@import "../editor/styles/_editor.less";
