/** General START **/
.FieldInput label.input-label {
  text-transform: none;
  margin-bottom: 1em; }

.FieldInput input, .FieldInput select {
  height: 35px; }

/** General END **/
/** SwitchFieldInput START **/
.cl-switch {
  /*
  Switcher Style
   */
  /*
  When Checked
   */
  /*
  Switch large style
   */ }
  .cl-switch input[type='checkbox'] {
    display: none;
    visibility: hidden; }
  .cl-switch .switcher {
    display: inline-block;
    border-radius: 100px;
    width: 35px;
    height: 15px;
    background-color: #ccc;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: middle;
    cursor: pointer; }
    .cl-switch .switcher:before {
      content: '';
      display: block;
      width: 20px;
      height: 20px;
      background-color: var(--white-color);
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
      border-radius: 50%;
      margin-top: -2.5px;
      position: absolute;
      top: 0;
      left: 0;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
      margin-right: 0;
      -webkit-transition: all 0.2s;
      -moz-transition: all 0.2s;
      -ms-transition: all 0.2s;
      -o-transition: all 0.2s;
      transition: all 0.2s; }
    .cl-switch .switcher:active:before {
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6), 0 0 0 10px rgba(79, 161, 116, 0.3);
      transition: all, 0.1s; }
  .cl-switch.cl-switch-tristate {
    display: flex;
    align-items: center;
    user-select: none; }
    .cl-switch.cl-switch-tristate.cl-switch-large .switcher {
      width: 75px; }
    .cl-switch.cl-switch-tristate .switcher {
      display: flex;
      justify-content: center;
      align-items: center;
      box-shadow: 0 0 0 20px var(--error-color) inset;
      border-color: var(--error-color); }
      .cl-switch.cl-switch-tristate .switcher.dark-grey {
        box-shadow: 0 0 0 20px var(--grey-lighter) inset;
        border-color: var(--grey-lighter); }
      .cl-switch.cl-switch-tristate .switcher .switcher-slider {
        width: 22px;
        height: 22px; }
      .cl-switch.cl-switch-tristate .switcher .switcher-text {
        color: var(--white-color);
        font-size: 0.8em; }
    .cl-switch.cl-switch-tristate input[type='checkbox']:checked + .switcher {
      box-shadow: 0 0 0 20px var(--green-color) inset;
      border-color: var(--green-color); }
      .cl-switch.cl-switch-tristate input[type='checkbox']:checked + .switcher .switcher-slider {
        order: 1; }
      .cl-switch.cl-switch-tristate input[type='checkbox']:checked + .switcher .switcher-text {
        left: 5px;
        text-align: start; }
    .cl-switch.cl-switch-tristate .switcher-default {
      box-shadow: 0 0 0 20px var(--grey-medium) inset;
      border-color: var(--grey-medium); }
      .cl-switch.cl-switch-tristate .switcher-default:before {
        left: 30%; }
  .cl-switch .label {
    font-family: 'inter', sans-serif;
    font-weight: 600;
    cursor: pointer;
    vertical-align: middle;
    margin: 0 5px; }
    .cl-switch .label.label-before-toggle {
      margin-left: 0; }
  .cl-switch input[type='checkbox']:checked + .switcher {
    background-color: var(--green-color-light); }
    .cl-switch input[type='checkbox']:checked + .switcher:before {
      left: 100%;
      margin-left: -20px;
      background-color: var(--green-color); }
  .cl-switch [disabled]:not([disabled='false']) + .switcher {
    background: #ccc !important;
    cursor: not-allowed; }
    .cl-switch [disabled]:not([disabled='false']) + .switcher:active:before {
      box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) !important; }
    .cl-switch [disabled]:not([disabled='false']) + .switcher:before {
      background-color: #e2e2e2 !important;
      box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) !important; }
  .cl-switch.cl-switch-large .switcher {
    width: 52px;
    height: 22px; }
    .cl-switch.cl-switch-large .switcher:before {
      width: 30px;
      height: 30px;
      margin-top: -4px; }
  .cl-switch.cl-switch-large .label {
    font-size: 18px; }
  .cl-switch.cl-switch-large input[type='checkbox']:checked + .switcher:before {
    margin-left: -30px; }

.SwitchFieldInput {
  display: flex;
  justify-content: space-between;
  align-items: center; }
  .SwitchFieldInput .text-div {
    width: 70%; }
    .future .SwitchFieldInput .text-div {
      font-size: 14px;
      line-height: 1.2em; }
    .SwitchFieldInput .text-div label {
      margin-bottom: 0; }
  .SwitchFieldInput .toggle-div {
    display: flex;
    align-items: center;
    align-self: flex-start;
    margin-top: 1em; }
    .SwitchFieldInput .toggle-div .success {
      color: var(--green-color); }
    .SwitchFieldInput .toggle-div label {
      margin-bottom: 0;
      padding: 0 1em; }
      .SwitchFieldInput .toggle-div label.switch {
        padding-left: 0; }
    .SwitchFieldInput .toggle-div .danger {
      color: var(--error-color); }
  .SwitchFieldInput.label-uppercase label {
    text-transform: uppercase; }
  .SwitchFieldInput.toggle-div-mt-0 .toggle-div {
    margin-top: 0; }

/** SwitchFieldInput END **/