@import "compass";
@import "theme_variables";

#product_comments_block_extra {
	

	line-height: 18px;

	.comments_note {
		
		 >span{float:left;}
	}
	.comments_note span,
	.star_content {
		float: left;
		color: $base-text-color;
		margin-right:4px;
	}
	.star_content {
		margin-top: 1px;
	}
	
	.comments_advices {
		clear:both;
		.comments_note{vertical-align: -3px;} 
	}
}

.comments_advices {
	padding-top: 2px;
	li{
		display:inline-block;
		
		@media (min-width: $screen-sm) and (max-width: $screen-sm-max) {	//min 768px max 991px
			display: block;
			line-height: 20px;
		}
	}
	a {
		text-decoration: none;
		color: $base-body-color;
		position:relative;
		margin-right: 2px;
		line-height: 14px;
		font-size:11px;
	    margin-right:10px;
		text-transform:uppercase;
		display:inline-block;
		
		&:before{
			
			display: inline-block;
			font-family: $font-icon;
			font-size: 15px;
			margin-right: 6px;
			text-align: center;
		}
		&.reviews:before{
			content: "\f0e5";
		}
		&.open-comment-form:before{
			content: "\f040";
	}
		&:hover {
			color:$base-text-color
		}
		&.reviews{
	

			@media (min-width: $screen-sm) and (max-width: $screen-sm-max) { // min 768px max 991px
				margin-right: 0;
				padding: 0;
				border: none;
			}
		}
	}
}


/* pop-in add grade/advice ********************************************************************* */
#fancybox-wrap {
	width: 585px;
}
#fancybox-content {
	width: 585px;
	border-width: 0;
}
#new_comment_form {
	overflow: hidden;
	color: $base-text-color;
	text-align: left;
	h2{
		margin-bottom: 10px;
	}
	.title {
		padding: 10px;
		font-size: 13px;
		color: $light-text-color;
		text-transform: uppercase;
		background: $dark-background;
	}
	ul.grade_content {
		list-style-type: none;
		margin: 0 0 20px 0;
		li{
			width: 50%;
		}
		span{
			display:inline-block;
			padding: 0 10px;
			width: 150px;
			font-weight: bold;
		}
		.cancel {
			margin-right: 5px;
		}
	}
	.product {
		padding: 15px;
		img{
			border: $main_border;
		}
		.product_desc {
			line-height: 18px;
			color: $description-color;
			.product_name {
				padding: 10px 0 5px;
				font-size: 13px;
				color: #000;
			}
		}
	}
	.new_comment_form_content {
		padding: 15px 25px 15px 15px;
		background: #f8f8f8;
		@media (max-width: $screen-xs-max) { //max 767px
			padding-left:25px;
		}
		.intro_form {
			padding-bottom: 10px;
			font-weight: bold;
			font-size: 12px;
		}
	}
	label {
		display: block;
		margin: 12px 0 4px 0;
		font-weight: bold;
		font-size: 12px;
	}
	input,
	textarea  {
		padding: 0 5px;
		height: 28px;
		width: 100%;
		border: 1px solid #ccc;
		background: $light-background;
	}
	textarea {
		height: 80px;
	}
	.submit {
		margin-top: 20px;
		padding: 0;
		font-size: 13px;
		text-align: right;
	}

	#criterions_list {
		border-bottom: 1px solid #CCC;
		padding-bottom: 15px;
		list-style-type: none;
		li{
			margin-bottom: 10px;
		}
		label {
			display: inline;
			float: left;
			margin: 0 10px 0 0;
		}
		.star_content {
			float: left;
		}
	}
	#new_comment_form_footer {
		margin-top: 20px;
		font-size: 12px;
	}
}
/* TAB COMMENTS ******************************************************************************** */
#product_comments_block_tab {
	margin: 0 0 20px 0;
	div.comment {
		margin: 0 0 14px;
		padding-top: 14px;
		
		&:first-child{
			padding: 0;
			border: none;
		}
		.comment_author {
			padding: 0 20px;
			line-height: 18px;
			span{
				font-weight: bold;
				float: left;
			}
			.star_content {
				display: inline-block;
				vertical-align: middle;
				margin: 0 0 0 5px;
			}
		}
		.comment_details {
			overflow: hidden;
			
			@media (max-width: $screen-sm-max) { //max 767px
				border-left: none;
				ul {
					list-style-type: none;
					margin: 0;
					li {
						padding: 2px 0 2px;
						&:before{
							font-family: $font-icon;
							content: "\f0da";
							color: $base-text-color;
							margin-right: 8px;
						}
					}
				}
			}
		}
	}

	.comment_author_infos {
		clear: both;
		padding-top: 9px;
		font-size:10px;
		text-transform:uppercase;
		font-weight:600;
		strong{
			display: block;
			color: $link-hover-color;
			margin-bottom:9px;
			
			&.author-cmt
			{
				&:before 
				{
					content: "\f007";
					font-family:$font-icon;
					margin-right:7px;
					
				}
			}
		}
		em {
			color:$link-hover-color;
			&.date-cmt
			{
				&:before 
				{
					content: "\f017";
					font-family:$font-icon;
					margin-right:7px;
				}
			}
		}
	}
	a {
		text-decoration: none;
		font-weight: bold;
	}

	span.report_btn {
		cursor: pointer;
	}
	span.report_btn:hover {
		text-decoration: underline;
	}
}
.fl {
	float: left;
}
.fr {
	float: right;
}
#product_comments_block_tab .title_block strong 
{
	color:$base-body-color;
    display:inline-block;
    font-family:$font-special;
    font-size: 18px;
    font-style: italic;
	font-weight:400;
}