.departure {
  @extend .flex;
  flex-wrap: wrap;

  .departure__line {
    @extend .flex;
    flex: 3 0;

    .line__symbol {
      min-width: 5rem;
    }
  }

  .departure__stop {
    @extend .flex;
    width: 100%;

    .stop {
      flex: 1 1 auto;
    }
  }

  .departure__time {
    width: 9rem;
    text-align: right;

    .departure__scheduled {
      text-decoration: line-through;
    }
  }
}

.departures__actions {
  @extend .flex;

  .departures__auto-refresh {
    @extend .flex;
  }

  .form-control {
    width: auto;
  }
}

@include media-breakpoint-up(lg) {
  .departure__time {
    order: 2;
  }

  .departure__stop {
    flex: 2 0;
    width: auto;
  }
}

@include media-breakpoint-up(sm) {
  .departure__time {
    margin-left: auto;
  }
}