.fcr-input {
  background-color: var(--fcr_ui_scene_input);
  border-radius: var(--fcr_cornerradius_l);
  border-color: var(--fcr_ui_scene_line1);
  border-width: 1px;
  border-style: solid;
  position: relative;
  transition: all 0.2s ease-in-out;
  border-width: 1px;
  border-style: solid;
  cursor: text;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  padding-right: 12px;
  padding-left: 12px;
}

.fcr-input.fcr-input-l {
  border-radius: var(--fcr_cornerradius_l);
  height: 48px;
}

.fcr-input.fcr-input-m {
  height: 36px;
}

.fcr-input.fcr-input-s {
  border-radius: var(--fcr_cornerradius_xs);
  height: 32px;
}

.fcr-input.fcr-input-xs {
  border-radius: var(--fcr_cornerradius_xs);
  height: 24px;
}

.fcr-input.fcr-input-circle {
  border-radius: var(--fcr_cornerradius_round);
}

.fcr-input-label {
  font-weight: var(--fcr_font_weight_x);
  color: var(--fcr_ui_scene_icontext1);

  display: inline-block;
  margin-bottom: 8px;
  margin-left: 5px;
}

.fcr-input input {
  color: var(--fcr_ui_scene_icontext1);
  outline: none;
  width: 100%;
  height: 100%;
  border: none;
  font-size: 12px;
  background: transparent;
}

.fcr-input input::placeholder {
  color: var(--fcr_ui_scene_icontext3);
}

.fcr-input:hover:not(.fcr-input--disabled) {
  border-color: var(--fcr_ui_scene_ramp_brand6);
}

.fcr-input.fcr-input--focused:not(.fcr-input--disabled) {
  border-color: var(--fcr_ui_scene_ramp_brand6);

  box-shadow: 0 0 0 3px var(--fcr_ui_scene_ramp_brand3);
}

.fcr-input-icon-wrap {
  border-radius: var(--fcr_cornerradius_round);
  /* position: absolute; */
  cursor: pointer;
  width: 22px;
  height: 22px;
  right: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s;
  -webkit-app-region: no-drag;
}

.fcr-input-icon-wrap:hover {
  background: var(--fcr_mobile_ui_scene_fill3);
}

.fcr-input-icon-wrap--invisible {
  visibility: hidden;
}

.fcr-input.fcr-input--disabled {
  cursor: not-allowed;
  opacity: 50%;
}

.fcr-input.fcr-input--disabled input {
  color: var(--fcr_ui_scene_icontext2);
  cursor: not-allowed;
}

.fcr-input.fcr-input--disabled input::placeholder {
  color: var(--fcr_ui_scene_icontext2);
}

.input-password-hidden {
  height: 28px;
  width: 32px;
}

.input-password-hidden:hover {
  border-radius: var(--fcr_cornerradius_xxs);
  background-color: var(--fcr_web_ui_scene_hover);
}

.fcr-input-normal {
  color: var(--fcr_ui_scene_icontext2);
}

.fcr-input-count-error {
  color: var(--fcr_ui_scene_ramp_red6);
}

.fcr-input-count {
  display: flex;
  width: 35px;
  font-size: 12px;
  text-align: center;
  align-items: center;
  justify-content: center;
  color: var(--fcr_ui_scene_icontext1);
}

.fcr-input-suffix {
  height: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
}