// Form control sizing
//
// Relative text size, padding, and border-radii changes for form controls. For
// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
// element gets special love because it's special, and that's a fact!
// [converter] $parent hack
@mixin inpt-sizing($parent, $input-height, $padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
	$input-height: $input-height + 1;
	&#{$parent} > * { height: $input-height; }
	&#{$parent} > .icn {
		height: $input-height;
		max-height: $input-height;
		font-size: $font-size * 1.2;
		padding: $padding-vertical 2px;
		line-height: floor(($font-size * $line-height));
		@include inpt_icn_width( ($font-size * $line-height), $padding-base-vertical );
	}
	&#{$parent} > .inpt > input {
		height: $input-height;
	    padding: $padding-vertical $padding-horizontal $padding-vertical 5px;
	    font-size: $font-size;
	    line-height: $line-height;
	    border-radius: $border-radius;
	}
}
@mixin inpt_icn_width( $lineHeight: 20px, $verticalPadding: 10px ) {
	$wdth: 2 + $lineHeight + $verticalPadding * 2;
	min-width: $wdth;
	max-width: $wdth;
}


.inpt-splited, .inpt-divided {
	
	display: table;
    width: auto;
	width: 100%;
	// margin: 0 0 10px; 
	padding: 0 !important;
	// font-size: $font-size-base;
	// line-height: $line-height-base;
	// color: $input-color;
	background-color: $input-bg;
	background-image: none; // Reset unusual Firefox-on-Android default style
	
	border: 1px solid $input-border;
	border-radius: $input-border-radius;
	@include box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
	@include transition(border-color ease-in-out .15s, box-shadow ease-in-out .15s);
	
	& > * {
		display: table-cell; position: relative;
		padding: 0; margin: 0;
		
		height: $input-height-base + 1;
		font-size: inherit;
		line-height: inherit;
		color: inherit;
		background-color: inherit;
		background-image: none; // Reset unusual Firefox-on-Android default style
		text-shadow: inherit;
		width: auto;
		width: 98%;
		@include border-radius(0);
		vertical-align: middle;
		border: none;
		@include box-shadow( none );
		
		
		&:first-child, &:first-child input { @include border-left-radius($border-radius-base); }
		&:last-child, &:last-child input { @include border-right-radius($border-radius-base); }
		
		&.inpt {
			input, label, textarea {
				display: block; position: relative;
				padding: $padding-base-vertical $padding-base-horizontal $padding-base-vertical 5px;
				margin: 0;
				height: $input-height-base + 1;
				@include box-sizing(border-box);
				border: none;
				@include box-shadow( none );
				outline: none;
				width: 100%;
			}
		}
		
		&.icn { 
			width: 2%;
			font-size: $font-size-base * 1.2;
			line-height: $line-height-computed;
			padding: $padding-base-vertical 2px;
			text-align: center;
			color: lighten($input-color, 20%);
			@include inpt_icn_width( $line-height-computed, $padding-base-vertical );
		}
	}
	
	// Make inputs at least the height of their button counterpart (base line-height + padding + border)
	@include inpt-sizing('.input-xs', $input-height-xs, $padding-xs-vertical, $padding-xs-horizontal, $font-size-small, $line-height-small, $border-radius-small);

	@include inpt-sizing('.input-sm', $input-height-small, $padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius-small);

	@include inpt-sizing('.input-lg', $input-height-large, $padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $border-radius-large);
  
  

  // Customize the `:focus` state to imitate native WebKit styles.
  @include form-control-focus();

  // Placeholder
  @include placeholder();

  // Disabled and read-only inputs
  //
  // HTML5 says that controls under a fieldset > legend:first-child won't be
  // disabled if the fieldset is disabled. Due to implementation difficulty, we
  // don't honor that edge case; we style them as disabled anyway.
  &[disabled],
  &[readonly],
  fieldset[disabled] & {
    cursor: not-allowed;
    background-color: $input-bg-disabled;
    opacity: 1; // iOS fix for unreadable disabled content
  }

  // [converter] extracted textarea& to textarea.form-control
}



// Reset height for `textarea`s
textarea.form-control {
  height: auto;
  height: $line-height-computed * 2 + $padding-base-vertical * 2;
  width: 100% !important;
  max-width: 100%;
}

.inpt-splited + .inpt-splited, .inpt-splited + .inpt-divided, .inpt-divided + .inpt-splited, .inpt-divided + .inpt-divided {
	margin-top: 10px;
}



// Form control sizing
//
// Build on `.form-control` with modifier classes to decrease or increase the
// height and font-size of form controls.

@include input-size('.input-xs', $input-height-xs, $padding-xs-vertical, $padding-xs-horizontal, $font-size-small, $line-height-small, $border-radius-small);