@import '../default.less';
@import '../mixins.less';
//DON'T ADD IMPORTS, ABOVE ARE TO MAKE INTELLISENSE WORK

div.review, div#submissions
{
	div.submissions
	{
		margin-top: 20px;
	}

	a.submission-street-view
	{
		.hires('/img/v4/icon_location');
		background-repeat: no-repeat;
		margin-right: 10px;
		width: 100px;
		height: 20px;
		margin-left: 20px;
		vertical-align: bottom;
		display: inline;
		color: @accent-color;
		padding-left: 23px;
		text-decoration: none;
		font: 10pt @title-font;
	}

	.collection
	{
		span
		{
			font: inherit;
			color: #222222;
		}
	}

	#map-canvas
	{
		width: 100%;
		height: 300px;
	}

	div#currency, div#collectiontime
	{
		font: 10.5pt @title-font;
		float: left;

		label
		{
			font-size: 10.5pt;
			display: inline;
		}

		display: inline;
	}

	div#collectiontime
	{
		margin-left: 20px;

		span
		{
			font-size: 10pt;
		}
	}

	div.form
	{
		div.filter
		{
			display: inline-table;
			margin-right: 10px;
		}

		label
		{
			display: block;
			margin-bottom: 3px;
			font-family: @title-font;
		}

		select
		{
			display: block;
			border: 1px solid #aaa;
			font: 10.5pt @text-font;

			&#Regions, &#UserKey
			{
				width: 250px;
			}
		}
	}

	table.knoema-table.submissions
	{
		tr.submission-row
		{
			&.suspicious
			{
				background-color: pink;
			}
		}

		td
		{
			font-family: @text-font;
		}

		.leaflet-popup-content p
		{
			margin: 5px 0 !important;
			font-family: @text-font;
		}

		tr.submission-view
		{
			background-color: #FFFFFF;

			& > td
			{
				padding-left: 0;
			}

			div.submission-content
			{
				border: 1px solid #F0F0F0;
				display: none;

				div.project-comments
				{
					&.submission-comment
					{
						width: 885px;
						margin-left: 10px;
						margin-right: 10px;
					}

					&.item-comment
					{
						width: 100%;
					}
				}

				div.showErrorMessage
				{
					padding-left: 12px;
				}

				div.submission-info
				{
					padding: 10px 0 10px 12px;

					&:after
					{
						clear: both;
						display: block;
						content: '';
					}
				}

				table.knoema-table
				{
					th
					{
						background-color: #FFFFFF;
						font-family: @title-font;
					}

					tbody
					{
						tr:nth-child(odd)
						{
							background-color: #d5dbdd;
						}

						tr.item-row
						{
							td.name
							{
								width: 165px;
							}

							td.unit
							{
								width: 66px;
							}

							td.info
							{
								width: 107px;
							}

							td.value
							{
								width: 132px;
							}

							td.status-buttons
							{
								width: 107px;

								.two-operations
								{
									display: block;

									&.ignore-item
									{
										margin-top: 8px;
									}
								}
							}

							td.price-tag
							{
								width: 20px;

								a.price-tag-link
								{
									.hires('/img/v4/icon_photo');
									height: 19px;
									width: 22px;
									margin-top: 3px;
									display: inline-block;
								}
							}

							td.comment-link
							{
								width: 41px;
							}

							td.time
							{
								width: 165px;
							}

							td.market
							{
								position: relative;
								width: 100px;
								text-align: right;

								html[dir='rtl'] &
								{
									text-align: left;
								}

								div.market
								{
									display: inline-block;
									vertical-align: top;

									span.marker
									{
										display: inline-block;
										border-radius: 50%;
										width: 20px;
										height: 20px;
										opacity: 0.9;
										border: 2px solid #fff;
										cursor: pointer;
										text-align: center;
										font-weight: bold;
										color: #fff;
										line-height: 20px;
									}

									&:hover div.details
									{
										opacity: 1;
										display: block;
										z-index: 2;
									}

									div.details
									{
										display: none;
										position: absolute;
										margin-left: 20px;
										padding: 7px 10px;
										background-color: #fff;
										box-shadow: 0 0 10px 1px #ccc;
										border-radius: 3px;
										width: 150px;
										opacity: 0;
										font: 9.5pt @title-font;
										text-align: left;

										html[dir='rtl'] &
										{
											text-align: right;
										}

										div
										{
											margin: 2px 0;
										}
									}
								}
							}

							&.suspicious
							{
								background-color: pink;
							}

							&.ignored
							{
								color: gray;
							}
						}

						tr.indicator-comment
						{
							&.suspicious
							{
								background-color: pink;
							}

							&.ignored
							{
								color: gray;
							}

							td
							{
								padding-right: 12px;
							}
						}
					}
				}

				div.submission-buttons
				{
					padding-left: 12px;
					padding-bottom: 12px;
				}
			}
		}
	}

	div#pager
	{
		text-align: center;
	}
}


div#pay-dialog
{
	display: none;
	margin: 10px 0;
	font: 10pt @text-font;

	a
	{
		color: @accent-color;
	}

	span
	{
		font-weight: bold;
	}

	div.amount div.edit
	{
		margin: 10px 0;

		label
		{
			font: bold 9.5pt @title-font;
		}

		input
		{
			font: bold 10pt @text-font;
			width: 50px;
		}
	}
}

div#submissions
{
	a.submission-street-view
	{
		display: none;
	}

	#map-canvas
	{
		display: none;
	}
}

.price-tag-popup
{
	height: 100%;

	.name
	{
		font: bold 12pt @title-font;
	}

	.markets
	{
		font: 10pt @text-font;
		color: gray;
		margin-top: 5px;
	}

	.image
	{
		width: 640px;
		height: 430px;
		white-space: nowrap;
		text-align: center;
		margin-top: 10px;

		.helper
		{
			display: inline-block;
			height: 100%;
			vertical-align: middle;
		}

		img
		{
			max-width: 640px;
			max-height: 430px;
			vertical-align: middle;
		}
	}
}