/*
 * Select.js Library v0.2.1
 *
 * Copyright 2023 Bunoon
 * Released under the MIT License
 */
/*
    -------------------------------------------------------------------------
    Select.js - Variables
    -------------------------------------------------------------------------
*/
:root {
  --color-black: #3b3a3a;
  --color-white: #F5F5F5;
  --color-gray: #AAAAAA;
  --color-light-gray: #CCCCCC;
  --container-background-color: #e8e6e6;
  --container-border-color: #3b3a3a;
  --container-background-color-drop-down: #e8e6e6;
  --container-border-color-drop-down: #3b3a3a;
  --border-radius: 0.5rem;
  --border-style-scrollbar: inset 0 0 6px --color-dark-gray;
  --border-size: 0.5px;
  --transition: all .3s;
  --spacing-shadow-size: 4px;
  --spacing: 8px;
}

/*
    -------------------------------------------------------------------------
    Select.js - Control
    -------------------------------------------------------------------------
*/
div.select-js {
  font-family: "Montserrat", sans-serif;
  font-size: 0.8rem;
  margin-bottom: var(--spacing);
  position: relative;
}
div.select-js * {
  box-sizing: content-box;
  line-height: normal;
}
div.select-js *::before, div.select-js *::after {
  box-sizing: content-box;
  line-height: normal;
}
div.select-js select {
  display: none !important;
}
div.select-js div.control {
  background-color: var(--container-background-color);
  border: var(--border-size) solid var(--container-border-color);
  border-radius: var(--border-radius);
  padding: calc(var(--spacing) - 2px);
  padding-right: 32px;
  overflow: hidden;
}

/*
    -------------------------------------------------------------------------
    Select.js - Drop-Down
    -------------------------------------------------------------------------
*/
div.select-js div.drop-down {
  background-color: var(--container-background-color-drop-down);
  border: var(--border-size) solid var(--container-border-color-drop-down);
  border-radius: var(--border-radius);
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: absolute;
  width: 100%;
  z-index: 10;
  max-height: 400px;
  margin-top: 2px;
  box-shadow: var(--spacing-shadow-size) var(--spacing-shadow-size) var(--spacing-shadow-size) var(--color-gray);
  overflow-y: auto;
  overflow-x: hidden;
}
div.select-js div.drop-down div.item {
  padding: var(--spacing);
  border-bottom: var(--border-size) var(--color-black) dotted;
}
div.select-js div.drop-down div.item:last-child {
  border-bottom: none;
}
div.select-js div.drop-down div.item:hover {
  cursor: pointer;
  background-color: var(--color-light-gray);
  transition: var(--transition);
}
div.select-js div.drop-down div.selected {
  color: var(--color-gray);
  font-style: italic;
}

/*
    -------------------------------------------------------------------------
    Select.js - Selected Items
    -------------------------------------------------------------------------
*/
div.select-js div.control {
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: relative;
}
div.select-js div.control div.button {
  position: absolute;
  border-right: 5px solid var(--color-black);
  border-bottom: 5px solid var(--color-black);
  height: 8px;
  width: 8px;
  right: 14px;
  top: 14px;
  transform: rotate(45deg);
}
div.select-js div.control div.button:hover {
  cursor: pointer;
  opacity: 0.7;
  transition: var(--transition);
}
div.select-js div.control div.button-open {
  transform: rotate(-135deg);
  top: 18px;
}
div.select-js div.control div.selected-item {
  padding: var(--spacing);
  background-color: var(--color-gray);
  border-radius: var(--border-radius);
  display: inline-block;
  margin: 2px;
  margin-right: var(--spacing);
}
div.select-js div.control div.selected-item:last-child {
  margin-right: 0;
}
div.select-js div.control div.selected-item span.text {
  color: var(--color-black);
}
div.select-js div.control div.selected-item div.remove {
  margin-left: var(--spacing);
  display: inline-block;
  font-weight: bold;
}
div.select-js div.control div.selected-item div.remove:hover {
  cursor: pointer;
  opacity: 0.7;
  transition: var(--transition);
}
div.select-js div.control div.no-items-selected {
  background-color: var(--color-light-gray);
  border-radius: var(--border-radius);
  font-style: italic;
  color: var(--color-black);
  padding: var(--spacing);
  display: inline-block;
}/*# sourceMappingURL=select.js.css.map */