body{
    @apply font-base;
  }
  .form-group .control-label{
    @apply block pb-2 text-base font-medium text-textLabel
  }
  .form-group .input-group{
    @apply flex w-full relative
  }
  .input-group .form-control{
    @apply w-full h-default px-4 text-base text-dark outline-none border-2 border-solid border-borderColors hover:border-primary focus:border-primary
  }
  .form-group p.helper-text{
    @apply block w-full m-0 py-1 text-sm text-disabled
  }
  .form-group.error .control-label{
    @apply text-danger
  }
  .error .input-group .form-control{
    @apply  border-danger
  }
  .error .error-text{
    @apply block w-full m-0 py-1 text-sm text-danger
  }
  .input-group input:disabled{
    @apply cursor-not-allowed hover:border-borderColors
  }
  .form-default .input-group .form-control{
    @apply h-default text-base
  }
  .form-small .input-group .form-control{
    @apply h-small text-sm
  }
  .form-medium .input-group .form-control{
    @apply h-medium text-lg
  }
  .form-large .input-group .form-control{
    @apply h-large text-xl
  }
  .form-default .control-label{
    @apply text-base
  }
  .form-small .control-label{
    @apply text-sm
  }
  .form-medium .control-label{
    @apply text-lg
  }
  .form-large .control-label{
    @apply text-xl
  }
  .input-group .left{
    @apply absolute px-2 top-3
  }
  .input-group .right{
    @apply absolute px-2 right-0 top-3
  }

/* Rounded default */
.rounded-default .form-control{
  @apply rounded-none
}

/* Rounded small */
.rounded-small .form-control{
  @apply rounded-sm
}

/* Rounded medium */
.rounded-medium .form-control{
  @apply rounded-md
}

/* Rounded full */
.rounded-large .form-control{
  @apply rounded-full
}


.input-group.group-default .left{
  @apply  top-[14px]
}
.input-group.group-default .right{
  @apply  top-[14px]
}
.icon-default svg{
  @apply w-5 h-5;
}
.input-group.group-small .left{
  @apply top-[12px]
}
.input-group.group-small .right{
  @apply top-[12px]
}
.icon-small svg{
  @apply w-4 h-4;
}

.input-group.group-medium .left{
  @apply top-[12px]
}
.input-group.group-medium .right{
  @apply top-[12px]
}
.icon-medium svg{
  @apply w-[26px] h-[26px];
}
.input-group.group-large .left{
  @apply top-[13px]
}
.input-group.group-large .right{
  @apply top-[13px]
}
.icon-large svg{
  @apply w-8 h-8;
}