:root {
  --m-multiselect--text: #000000;
  --m-multiselect--border: #dfdfdf;
  --m-multiselect--button: #f5f5f5;
  --m-multiselect--selected: #929292;
  --m-multiselect--focus: #505050;
}

.m-multiselect-wrapper {
  margin-top: -4px;
}

.m-multiselect-wrapper button.toggle {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background-color: transparent;
  color: var(--m-multiselect--text);
  border-color: var(--m-multiselect--border);
  border-right: none;
  border-left: none;
  border-radius: 0;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

p.m-multiselect-button {
  position: relative;
  margin-bottom: 3px;
}

.m-multiselect-wrapper[dir="rtl"] p.m-multiselect-button span {
  text-align: right;
  padding-left: 1rem;
  padding-right: 1rem;
  overflow: hidden;
  white-space: nowrap;
}

.m-multiselect-wrapper[dir="ltr"] p.m-multiselect-button span {
  text-align: left;
  padding-right: 1rem;
}

p.m-multiselect-button span:last-child {
  padding: 0;
}

p.m-multiselect-button .material-icons {
  font-size: 2rem;
}

.m-multiselect-wrapper[dir="rtl"] p.m-multiselect-button .material-icons {
  margin-right: auto;
}

.m-multiselect-wrapper[dir="ltr"] p.m-multiselect-button .material-icons {
  margin-left: auto;
}

p.m-multiselect-button
  button[aria-expanded="true"]
  .material-icons.m-icon {
  transform: rotate(180deg);
}

.m-multiselect-wrapper .floating {
  position: absolute;
  z-index: 101;
  background-color: white;
  box-shadow: rgb(238 238 238) 0px 0px 8px 1px;
  margin-left: 15px;
  margin-right: -1px;
}

.m-multiselect-wrapper .card.card-body {
  border: none;
}

ul.m-multiselect-options {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 0;
}

ul.m-multiselect-options li {
  list-style: none;
  background-color: var(--m-multiselect--button);
  border: 2px solid var(--m-multiselect--button);
  color: var(--m-multiselect--text);
  cursor: pointer;
}

ul.m-multiselect-options li:focus-visible {
  outline: none !important;
}

ul.m-multiselect-options li:hover {
  border: 2px solid var(--m-multiselect--focus);
}

ul.m-multiselect-options li:focus {
  border: 2px dashed var(--m-multiselect--focus);
}

ul.m-multiselect-options li[aria-selected="true"] {
  background-color: var(--m-multiselect--selected);
}

ul.m-multiselect-options li,
.m-multiselect-wrapper .card-footer.action button {
  margin: 0.5rem 0.25rem;
  padding: 0.25rem 1.25rem;
  border-radius: 50px;
  min-width: 8rem;
  text-align: center;
}

.m-multiselect-wrapper .card-footer.action {
  border: none;
  background-color: transparent;
  display: flex;
  justify-content: flex-start;
}

.m-multiselect-wrapper .card-footer.action button {
  border: 1px solid var(--m-multiselect--border);
  background-color: transparent;
  display: flex;
  align-items: center;
}

.m-multiselect-wrapper .card-footer.action button .material-icons {
  font-size: 1.25rem;
}

.m-multiselect-wrapper .card-body legend {
  font-size: 0.75rem;
  opacity: 0.9;
}