.slot {
  display: inline-flex;
  background: #fff;
  box-sizing: content-box;
  max-width: 100%;
  width: 100%;
}

.slot__affix {
  background: #f0efeb;
  display: inline-block;
  padding: 0 1em;
  line-height: 2.77rem;
  vertical-align: top
}

.slot__disabled > .slot__affix {
  background: #f0efeb
}

.slot__input {
  line-height: 46px;
  padding: 0 1em;
  font-size: 16px;
}

.slot__textarea {
  padding: 1em;
}

.slot__input,
.slot__textarea {
  vertical-align: top;
  appearance: textfield;
  background: 0 0;
  outline: 0;
  color: inherit;
  width: 100%;
  border: 2px solid #000;
  box-sizing: border-box;
}

.slot__input.error {
  border-color: var(--primary);
}

.slot__input::-webkit-inner-spin-button {
  -webkit-appearance: none
}

.slot__input::placeholder {
  font: var(--demi);
  opacity: 1;
  color: #000;
}

.slot--disabled>.slot__input {
  color: #fff
}

.slot--textarea {
  display: block;
}