@use "../base/mixins/font_size-mx" as mx;
@use "../base/font" as ft;
@use "../base/color" as cl;
@use "../base/border" as bo;

$input-padding-xs: 5.5px !default;
$input-padding-md: 8px !default;
$input-padding-xl: 16px !default;

.qo-input {
  display: inline-block;
  border-radius: bo.$border-radius-sm;
}
.qo-input-full {
  display: block;
  border-radius: bo.$border-radius-sm;
  width: 100%;
  padding: $input-padding-xl;
  @include mx.font-size(ft.$font-size-md, ft.$line-height-md);
}
.qo-input-xs {
  padding: $input-padding-xs;
  @include mx.font-size(ft.$font-size-xs, ft.$line-height-xs);
}
.qo-input-md {
  padding: $input-padding-md;
  @include mx.font-size(ft.$font-size-md, ft.$line-height-md);
}
.qo-input-default {
  background-color: cl.$background-default;
  border: bo.$border-width-sm solid cl.$border-default;
}