@import 'utils/fonts';
@import 'utils/variables';
@import 'utils/mixins';
@import "vendor/normalize";
@import "flow";
@import "theme";
@import "pod-styles";
@import "parts/import-csv";
@import "parts/layers-panel";
@import "parts/project-thumbnail";
@import "parts/projection-panel";
@import "parts/configuration-panel";
@import "parts/help";
@import "parts/graph";
@import "parts/browser-check";
@import "parts/sidebars";
@import "parts/navigation";
@import "parts/header";
@import "parts/brand";
@import "parts/color-picker";
@import "parts/arrows-navigation";
@import "parts/loader";
@import "parts/export";
@import "parts/blindness";
@import "parts/updater";

html, body {
  height: 100%;
  margin: 0;
}

body {
  font-family: 'Roboto', sans-serif;
}

a {
  cursor: pointer;
}

.no-drag {
  background-color: rgba(255, 255, 255, 0.00000000001);
}

.iconfont:before {
  vertical-align: middle;
}

/* flow */
body > .ember-view:not(.popable) {
  height: 100%;
  overflow:hidden;
  @include flow(vertical);
}


.application-header {
  @include depth(header);
  @include flow(solid, space-between);
  align-items: stretch;
  flex-basis: $header-height;
  padding: 0 0 0 1em;
}

.application-workspace {
  overflow-y: auto;
}

footer {
  flex-basis: $footer-height;
  line-height: $footer-height;
}

.arrows-cursor {
  cursor: move;
}

.stars {
  li { float: left; }
}

/**
  Fix occasional width bug on Chrome
*/
.state-icon,
.graph.vertical.flow > .horizontal.flow {
  width: 100%;
}

.column-editor {
  position: relative;
}

.column-editor-row  {

  margin-top: 0.5rem !important;
  margin-bottom: 0.5rem !important;

  .bind-value-arrow.bind-value-arrow,
  .cell-value.cell-value,
  .cell-new-value.cell-new-value {
    margin-left: 0;
    margin-right: 0;
  }

  .bind-value-arrow.bind-value-arrow {
    margin-right:0.7rem;
  }

  .cell-value, .cell-new-value input, .selected-value {
    font-size:1.2rem;
  }

  .cell-new-value input {
    min-width: initial;
  }

  .selected-value {
    line-height: 23px;
  }

  .selected-value .icon {
    line-height: 19px;
  }
}


//loader

@keyframes loadermove {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 28px 0;
  }
}

.loading-bar {
  width: 100%;
  height: 20px;
  border: 1px solid color(primary);
  border-radius: 3px;
  background-image: 
    repeating-linear-gradient(
      -45deg,
      color(primary),
      color(primary) 11px,
      #eee 10px,
      #eee 20px /* determines size */
    );
  background-size: 28px 28px;
  animation: loadermove .5s linear infinite;
}
