/**@license

 *  _____

 * |_   _|___ ___ ___ ___ ___

 *   | | | .'| . | . | -_|  _|

 *   |_| |__,|_  |_  |___|_|

 *           |___|___|   version 0.6.2

 *

 * Tagger - Zero dependency, Vanilla JavaScript Tag Editor

 *

 * Copyright (c) 2018-2024 Jakub T. Jankiewicz <https://jcubic.pl/me>

 * Released under the MIT license

 */

.tagger {
  border: 1px solid #909497;
}

.tagger input[type="hidden"] {
  /* fix for bootstrap */

  display: none;
}

.tagger > ul {
  display: flex;

  width: 100%;

  align-items: center;

  padding: 4px 5px 0;

  justify-content: space-between;

  box-sizing: border-box;

  height: auto;

  flex: 0 0 auto;

  overflow-y: auto;

  margin: 0;

  list-style: none;
}

.tagger > ul > li {
  padding-bottom: 0.4rem;

  margin: 0.4rem 5px 4px;
}

.tagger > ul > li:not(.tagger-new) a,
.tagger > ul > li:not(.tagger-new) a:visited {
  text-decoration: none;

  color: black;
}

.tagger > ul > li:not(.tagger-new) > :first-child {
  padding: 4px 4px 4px 8px;

  /* background: #b1c3d7;

  border: 1px solid #4181ed; */

  border-radius: 3px;
}

.tagger > ul > li:not(.tagger-new) > span,
.tagger > ul > li:not(.tagger-new) > a > span {
  white-space: nowrap;
}

.tagger li a.close {
  padding: 4px;

  margin-left: 4px;

  /* for bootstrap */

  float: none;

  filter: alpha(opacity=100);

  opacity: 1;

  font-size: 16px;

  line-height: 16px;
}

.tagger li a.close:hover {
  color: white;
}

.tagger .tagger-new input {
  border: none;

  outline: none;

  box-shadow: none;

  width: 100%;

  padding-left: 0;

  box-sizing: border-box;

  background: transparent;
}

.tagger .tagger-new {
  flex-grow: 1;

  position: relative;

  min-width: 40px;

  width: 1px;
}

.tagger.wrap > ul {
  flex-wrap: wrap;

  justify-content: start;
}