.mosaic-tile {
  animation: fadein 0.15s;
}

.mosaic-window-toolbar  {
  & > div {
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding: 0 5px 0 5px;

    .mosaic-controls {
      transform: scale(0.75);
      transform-origin: right;
    }

    h5 {
      margin: 4px 0 0 0;
    }

    button {
      margin-left: 8px;
    }
  }
}

// update if list of Editor ID changes
@editor-ids: main, renderer, html, preload;

// takes each editor ID and increase its z-index if the parent Mosiac root
// has focused__id class for that specific id.
each(@editor-ids, {
  .focused__@{value}.mosaic .mosaic-window.@{value} {
    z-index: 2;
  }
});

.mosaic-window {
  z-index: 1;
}

@keyframes fadein {
  from { opacity: 0; }
  to { opacity: 1; }
}