.quick_reply {
	@textAreaBorder: 1px solid #d7d7d7;
	
	.box-sizing;
	
	background: @theme-quick-reply-bg;
	bottom: 0px;
	max-height: 190px;
	padding: 0px 23px 0px 17px;
	
	html.rtl & {
		padding: 0px 17px 0px 23px;
	}
	
	.no-csstransitions & {
		margin-bottom: -2px;
		max-height: 86px;
	}
	
	.csstransitions & {
		.transition(max-height 500ms ease 50ms);
		
		&.saving {
			max-height: 0 !important;
		}
		
		&.sending {
			max-height: 30px !important;
			
			.status {
				max-height: 30px;
				opacity: 1;
			}
		}
	}
	
	.status {
		background: #dac073;
		margin-left: -17px;
		margin-bottom: -6px;
		max-height: 0px;
		overflow: hidden;
		opacity: 0;
		padding: 5px 17px;
		width: 101%;
		
		.csstransitions & {
			.transition(~"max-height 300ms ease 50ms, opacity 300ms ease 50ms");
		}
		
		.text {
			color: #ffffff;
			font-weight: bold;
			text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
		}
	}
	
	.row {
		margin-top: 20px;
		white-space: nowrap;
		
		.placeholder {
			font-size: 11pt;
			padding-top: 6px;
			text-indent: 9px;
		}
		
		textarea {
			.box-sizing;

			border: @theme-quick-reply-textarea-border;
			box-shadow: none;
			color: #000000;
			font-size: 11pt;
			height: 50px;
			outline: none;
			padding: 6px 8px;
			resize: none;
			width: 100%;
			
			.csstransitions & {
				.transition(height 300ms ease);
			}
			
			.active& {
				font-family: Tahoma, sans-serif;
				font-size: 16px;
				height: 101px;
			}
		}
	}
	
	.buttons {
		margin-bottom: 0px;
		margin-top: 15px;
		padding-bottom: 20px;
		text-align: left;
		
		html.rtl & {
			text-align: right;
		}
		
		.button {
			margin-right: 6px;
			
			html.rtl & {
				margin-left: 6px;
				margin-right: 0px;
			}
		}

		.full_form {
			float: right;
			height: 0px;
			margin-top: 6px;

			html.rtl & {
				float: left;
			}
		}
	}
}

.csstransitions {
	.quick_reply {
		.buttons {
			max-height: 0px;
			opacity: 0;
			overflow: hidden;
			padding-bottom: 0px;
			
			/* important: 50ms delay fix click on buttons*/
			.transition(all 300ms ease 50ms);
		}
		
		&.active .buttons {
			margin-bottom: 20px;
			max-height: 25px;
			opacity: 1;
			overflow: visible;
		}
		
		&.sending .buttons {
			margin-top: 0px;
			margin-bottom: 0px;
			max-height: 0px;
			opacity: 0;
		}
		
		&.sending .row {
			margin-top: 0px;
			margin-bottom: 0px;
			max-height: 0px;
			opacity: 0;
		}
	}
}
