.title-bar {
	display: flex;
	align-items: center;
	// margin-bottom: 10px;
  flex-wrap: wrap;

	&.title-bar--large .title-bar__title {
		// font-size: 1.4em;
		// font-weight: 600;
	}

	@include m-tablet-down {
    width: 100%;
    flex: none;
	}

	.filter-bar {
		// margin-bottom: 10px;
	}
}

.title-bar__title {
	// margin-right: auto;
	// font-size: 1.1em;
	color: color(text-primary);
	// margin-bottom: $s-s;
	padding-right: $s-s;
	// margin-bottom: 10px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-align: left;
  flex: 4;

  @include m-tablet-down {
    padding-right: 0px;
    text-align: center;
    display: block;
    width: 100%;
    flex: none;
  }

  i {
    color: color(text-secondary);
    font-size: 0.7em;
    font-weight: 400;
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .label-app-badge {
    font-size: 0.9rem;
    margin-left: 0;

    i {
      font-size: inherit;

      &.fa-circle-check {
        display: none;
      }
    }

    &.success {
      i.fa-copy {
        display: none;
      }

      i.fa-circle-check {
        display: block;
      }
    }
  }
}

.title-bar__extra-tools {
	display: flex;
  justify-content: flex-end;

  @include m-tablet-down {
    display: block;
    margin-top: 15px;
    margin-bottom: 10px;
    width: 100%;
    flex: none;

    .button {
      display: block;
      width: 100%;
      margin-bottom: 10px;

      &:last-child {
        margin-bottom: 0px;
      }
    }

    & > *:last-child {
      margin-left: 0px !important;
    }
  }

  .button,
  .button-group {
    margin-left: 10px;

    &:first-child {
      margin-left: 0px;
    }
  }

  .button-group {
    margin-left: 5px;
  }

  &.title-bar__extra-tools-publish {
    position: -webkit-sticky;
    position: sticky;
    top: 8px;
    margin-top: -60px;
    margin-bottom: 0px;
    z-index: 6;
    float: right;

    @include m-tablet-down {
      position: inherit;
      top: inherit;
      margin-top: 0;
      margin-bottom: 0;
      z-index: inherit;
      float: none;
      text-align: right;
    }

    .form-btns { display: inline-flex;}
  }
}

.title-bar__filter-toggle-button {
	// margin-bottom: 10px;
}
