//Keep the native bootstrap experience for smaller screens
@media(min-width: $screen-sm) {

  // Specificity required
  .context-selection.dropdown-menu {
    padding: 0;

    & > li {
      display: table-cell;
      vertical-align: top;
      padding: $padding-xs-horizontal 0;

      &:not(:last-child) {
        border-right: 1px solid $gray-light;
      }
    }

    .dropdown-menu > li > a {
      padding-left: $dropdown-item-padding-horizontal;
      display: flex;
    }

    .dropdown-title {
     order: 1;
    }

    .dropdown-selected-icon {
      position: relative;
      order: 2;
    }
  }

  .open .dropdown-selection {
    display: table;

    // display: table pushes down our little arrow a single pixel
    &:before {
      top: -($font-size-small/2);
    }

    &:after {
      top: -($font-size-small/2) + 1;
    }
  }
}

.context-delimiter {
  font-size: $context-delimiter-size;
}