@import "variables.less";

// grid report
.grid-report .plot {
	margin: 15px;
	display: none;
	height: 300px !important;
	width: 97% !important;
}

.grid-report .ui-widget {
	border: none !important;
	outline: none !important;
	border-top: 1px solid @border-color !important;
	background-color: @light-bg !important;
}

.grid-report .show-zero {
	margin: 10px;
	display: none
}

// column picker
.column-picker-dialog {
	.column-list {
		margin: 15px 0;
		border: 1px solid @border-color;

		.column-list-item {
			padding: 10px;
			border-bottom: 1px solid @border-color;
		}

		.column-list-item:last-child {
			border-bottom: none;
		}

		.sortable-handle {
			cursor: move;
		}

		.sortable-chosen {
			background-color: @light-yellow;
		}

		.fa-sort {
			margin: 0px 7px;
			margin-top: 9px;
			margin-right: -15px;
		}

		.form-control {
			display: inline-block;
			width: 89%;

			@media (max-width: @screen-xs) {
				width: 77%;
			}
		}

		.close {
			margin: 2px 7px 0px;
		}
	}

	.add-btn {
		margin-bottom: 2px;
	}
}

.groupby-box {
	border-bottom: 1px solid #d1d8dd;
	padding: 10px 15px 3px;

	.remove-groupby {
		margin-top: 6px;
		margin-left: 15px;
	}

	.groupby-field {
		padding-right: 15px;
		width: calc(100% - 36px);

		.frappe-control {
			position: relative;
		}
	}
}

// for sm and above
@media (min-width: @screen-xs) {
	.groupby-box .row > div[class*="col-sm-"] {
		padding-right: 0px;
	}

	.groupby-field {
		width: 65% !important;

		.frappe-control {
			position: relative;
		}
	}
}

.tag-groupby-area {
	padding: 10px 150px 10px 10px;
	position: absolute;
    top: 0px;
    right: 0px;
    display: flex;
}