@import '../../form-control/style/variables';

@import './properties';

$petals--input-padding-y: $petals--input-btn-padding-y !default;
$petals--input-padding-x: $petals--input-btn-padding-x !default;
$petals--input-font-family: $petals--input-btn-font-family !default;
$petals--input-font-size: var($__petals--form-control-font-size, $petals--form-control-font-size) !default;
$petals--input-font-weight: $petals--font-weight !default;
$petals--input-line-height: $petals--input-btn-line-height !default;

$petals--input-padding-y-sm: $petals--input-btn-padding-y-sm !default;
$petals--input-padding-x-sm: $petals--input-btn-padding-x-sm !default;
$petals--input-font-size-sm: var($__petals--form-control-font-size-sm, $petals--form-control-font-size-sm) !default;

$petals--input-padding-y-lg: $petals--input-btn-padding-y-lg !default;
$petals--input-padding-x-lg: $petals--input-btn-padding-x-lg !default;
$petals--input-font-size-lg: var($__petals--form-control-font-size-lg, $petals--form-control-font-size-lg) !default;

$petals--input-bg: var($__petals--form-control-bg, $petals--form-control-bg) !default;
$petals--input-disabled-bg: var($__petals--form-control-disabled-bg, $petals--form-control-disabled-bg) !default;
$petals--input-disabled-border-color: var(
  $__petals--form-control-disabled-border-color,
  $petals--form-control-disabled-border-color
) !default;

$petals--input-color: var($__petals--form-control-color, $petals--form-control-color) !default;
$petals--input-border-width: var($__petals--form-control-border-width, $petals--form-control-border-width) !default;
$petals--input-border-color: var($__petals--form-control-border-color, $petals--form-control-border-color) !default;
$petals--input-box-shadow: var($__petals--form-control-box-shadow, $petals--form-control-box-shadow) !default;

$petals--input-border-radius: var($__petals--form-control-border-radius, $petals--form-control-border-radius) !default;
$petals--input-border-radius-lg: var(
  $__petals--form-control-border-radius-lg,
  $petals--form-control-border-radius-lg
) !default;
$petals--input-border-radius-sm: var(
  $__petals--form-control-border-radius-sm,
  $petals--form-control-border-radius-sm
) !default;

$petals--input-hover-border-color: var(
  $__petals--form-control-hover-border-color,
  $petals--form-control-hover-border-color
) !default;

$petals--input-focus-border-color: var(
  $__petals--form-control-focus-border-color,
  $petals--form-control-focus-border-color
) !default;
$petals--input-focus-bg: var($__petals--form-control-focus-bg, $petals--form-control-focus-bg) !default;
$petals--input-focus-color: $petals--input-color !default;
$petals--input-focus-width: $petals--input-btn-focus-width !default;
$petals--input-focus-box-shadow: var(
  $__petals--form-control-focus-box-shadow,
  $petals--form-control-focus-box-shadow
) !default;

$petals--input-placeholder-color: var(
  $__petals--form-control-placeholder-color,
  $petals--form-control-placeholder-color
) !default;
$petals--input-plaintext-color: $petals--body-color !default;

$petals--input-height-border: calc(#{$petals--input-border-width} * 2) !default;

$petals--input-height-inner: add($petals--input-line-height * 1em, $petals--input-padding-y * 2) !default;
$petals--input-height-inner-half: add($petals--input-line-height * 0.5em, $petals--input-padding-y) !default;
$petals--input-height-inner-quarter: add($petals--input-line-height * 0.25em, $petals--input-padding-y / 2) !default;

$petals--input-height: var($__petals--form-control-height, $petals--form-control-height) !default;
$petals--input-height-lg: var($__petals--form-control-height-lg, $petals--form-control-height-lg) !default;
$petals--input-height-sm: var($__petals--form-control-height-sm, $petals--form-control-height-sm) !default;

$petals--input-transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !default;