/* Fix the tiny entity reference browser result table to look better in
  * off-canvas area */
#drupal-off-canvas #entity-browser-block-form table td,
#drupal-off-canvas #entity-browser-block-form table th {
  display: inline-block;
  margin: 0 auto;
}
#drupal-off-canvas #entity-browser-block-form table th {
  display: none;
}
/* Embiggen the item name. */
#drupal-off-canvas #entity-browser-block-form td:nth-child(1) {
  width: 100%;
  font-size: larger;
}
/* Hide the weight element. */
#drupal-off-canvas #entity-browser-block-form td:nth-child(4) {
  display: none;
}
/* Give the selected items in the table some emphasis so they don't just
bleed into the background */
#drupal-off-canvas #entity-browser-block-form table,
#drupal-off-canvas #entity-browser-block-form table td {
  background-color: #277abd !important;
  color: #fff !important;
}
/* Style edit button to look like Remove button */
#drupal-off-canvas #entity-browser-block-form .button {
  padding: 4px 20px;
  border-radius: 20em;
  background: #777;
  font-weight: 600;
  font-size: 14px;
  color: #f5f5f5;
  text-align: center;
  cursor: pointer;
  transition: background 0.5s ease;
}

.layout--region__inner {
  padding: 10px;
}

/* Clear settings tray styles that mess up with select2 */
.select2,
.select2 span,
.select2 div,
.select2 a {
  background-color: #fff!important;
  color: #000300!important;
}

.select2-container--default li {
  padding: 6px!important;
}

.select2-search--dropdown .select2-search__field {
  padding: 0.4rem!important;
  background-color: whitesmoke!important;
  color: #333!important;
  margin: 0.1rem!important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 26px!important;
  position: absolute!important;
  top: 1px!important;
  right: 1px!important;
  width: 20px!important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: #888 transparent transparent transparent!important;
  border-style: solid!important;
  border-width: 5px 4px 0 4px!important;
  height: 0!important;
  left: 50%!important;
  margin-left: -4px!important;
  margin-top: -2px!important;
  position: absolute!important;
  top: 50%!important;
  width: 0!important;
}

.select2 .select2-selection__clear {
  cursor: pointer!important;
  float: right!important;
  font-weight: bold!important;
  position: relative!important;
}

.select2-container .select2-selection--single .select2-selection__rendered {
  display: block!important;
  padding-left: 8px!important;
  padding-right: 20px!important;
  overflow: hidden!important;
  text-overflow: ellipsis!important;
  white-space: nowrap!important;
}
.select2-container--default .select2-results > .select2-results__options {
  max-height: 30rem!important;
  overflow-y: auto!important;
}
