//@import "../../../abstracts/abstracts";

.ui-iggrid {
	@include scrollbar($sidebar-scrollbar-color, $sidebar-scrollbar-border-radius, $sidebar-scrollbar-thumb-color, $color-primary);
	border-collapse: collapse;
	height: 100%;
	min-width: 100%;
	width: fit-content !important;
	padding: 0 !important;
	overflow-x: visible;
	
	.ui-iggrid-scrolldiv {
		overflow-x: visible !important;
		overflow-y: visible !important;
		margin-top: 10px;
		border-bottom: 0 !important;
		-webkit-box-shadow: none !important;
		-moz-box-shadow: none !important;
		box-shadow: none !important;
		background-color: transparent !important;
		table {
			border-collapse: collapse;
			width: 100% !important;
			border: 0 !important;
		}
	}
	.ui-igtreegrid-expansion-column-container {
		min-width: 0 !important;
	}
	.ui-iggrid-filtercell  {
		.ui-iggrid-filterbutton {
			margin-top: 0 !important;
			margin-left: 0 !important;
		}
	}
	.ui-iggrid-tablebody {
		td {
			border-width: 0;
		}
		>tr {
			>td {
				&:last-child {
					border-right: 0 !important;
				}
			}
		}
		tr {
			border: 0;
			border-bottom: 1px solid #f4f4f4;
			th {
				border: 0;
				border-bottom: 1px solid #f4f4f4;
			}
		}
	}
	.ui-icon {
		&:before {
			width: 26px;
			height: 26px;
			display: block;
			position: absolute;
			top: 5px;
			left: 0;
			margin-left: 0;
			margin-top: 0;
			line-height: 14px;
			font-size: $font-size-base;
			color: color(text-color-default);
			text-indent: 0;
		}
	}
	.ui-iggrid-footer {
		background: $background-color;
		border: 0;
		border-top: 0 !important;
		border-bottom: 0 !important;
	}
	.ui-iggrid-scrolldiv {
		border-bottom: 0 !important;
	}
	.ui-iggrid-table {
		>tbody {
			>tr {
				>td {
					&:last-child {
						border-right: 0 !important;
					}
				}
			}
		}
	}
	thead {
		.ui-iggrid-editingcell {
			&:last-child {
				border-right: 0 !important;
			}
			border-bottom: 1px solid #f4f4f4;
		}
	}
	tbody {
		td {
			border-bottom: 1px solid #f4f4f4;
		}
		th.ui-iggrid-rowselector-class {
			border-bottom: 1px solid #f4f4f4;
		}
	}
	tfoot {
		td {
			border-bottom: 1px solid #f4f4f4;
		}
	}
	tr.ui-ig-altrecord {
		background: 0;
	}
	.ui-iggrid-toolbar {
		background-color: #ffffff;
		border-bottom: 1px solid #f4f4f4;
	}
	.ui-iggrid-table {
		>tbody {
			>tr {
				&:first-child {
					border-top: $classlist-row-border;
				}
				>td {
					padding: 5px 10px;
					font-size: $font-size-small;
					line-height: 20px;
					font-weight: 500;
					white-space: nowrap;
					&:first-child {
						border: 0;
						border-left: 0 !important;
					}
					&:last-child {
						border-right: 0 !important;
					}
				}
				>td.button-table-cell {
					padding: 0;
				}
				>td.ui-state-active {
					padding: 5px 10px;
					font-size: $font-size-small;
					line-height: 20px;
					font-weight: 500;
				}
				>td.button-table-cell.ui-state-active {
					padding: 0;
				}
				>td.ui-state-hover {
					padding: 5px 10px;
					font-size: $font-size-small;
					line-height: 20px;
					font-weight: 500;
				}
				>td.button-table-cell.ui-state-hover {
					padding: 0;
				}
			}
		}
		thead {
			tr {
				&:hover {
					background: none !important;
					background-color: transparent !important;
					th {
						background: none !important;
						background-color: transparent !important;
					}
				}
			}
		}
	}

	.ui-iggrid-tablebody {
		>tr {
			>td {
				&:first-child {
					border: 0;
					border-left: 0 !important;
				}
				&:last-child {
					border-right: 0 !important;
				}
				span.row-button {
					&:hover {
						svg {
							fill: #001335 !important;
						}
					}	
				}
			}
			&:first-child {
				border-top: $classlist-row-border;
			}
		}
		td {
			svg {
				fill: color(text-color-default);
				width: $svg-icon-size;//20px;
				height: $svg-icon-size;//20px;
				padding: 2px;
			}
			.row-button {
				svg {
					fill: color(text-color-default);
				}
			}
			&.ui-state-hover {
				svg {
					fill: #ffffff !important;
				}
				.row-button {
					svg {
						fill: #ffffff !important;
						&:hover {
							fill: #001323 !important;
						}
					}
				}
			}
			&.button-table-cell.ui-state-hover {
				svg {
					fill: #ffffff !important;
					&:hover {
						fill: #001323 !important;
					}
				}
			}
		}
		tr,
		th {
			border-bottom: $classlist-row-border;
		}
	}
	.ui-iggrid-paging {
		li {
			margin: 0 0 0 5px;
			padding: 3px 8px;
			line-height: 20px;
			font-size: $font-size-base;
			border-radius: $border-radius-default;
			color: #000000;
			background-color: $modal-input-background;
			border: 2px solid $modal-border-color;
		}
		.ui-igedit-input {
			line-height: 20px;
			font-size: $font-size-small;
			padding: 0 0 0 10px;
			font-weight: 600;
			background: 0;
		}
		.ui-iggrid-firstpage {
			padding: 0 !important;
		}
		.ui-iggrid-lastpage {
			padding-top: 0 !important;
			padding-bottom: 0 !important;
			padding-right: 0;
		}
		.ui-iggrid-nextpage {
			padding-top: 0 !important;
			padding-bottom: 0 !important;
			padding-right: 0;
		}
		.ui-iggrid-prevpage {
			padding: 0 !important;
		}
		.ui-iggrid-paging-item.ui-iggrid-prevpage {
			span {
				padding: 7px 10px 7px 0 !important;
			}
		}
		.ui-iggrid-paging-item.ui-iggrid-nextpage {
			span {
				padding: 7px 0 7px 10px !important;
			}
		}
		.ui-iggrid-paging-item.ui-iggrid-lastpage {
			.ui-icon {
				&:before {
					padding: 7px;
					height: 26px;
					width: 26px;
				}
			}
			span {
				padding: 0 !important;
			}
		}
		.ui-iggrid-paging-item.ui-iggrid-firstpage {
			.ui-icon {
				&:before {
					padding: 7px;
					height: 26px;
					width: 26px;
				}
			}
		}
		ul.ui-iggrid-pagelist {
            li.ui-iggrid-page.ui-state-default {
                &:hover {
                    background: $color-primary !important;
                    border: 2px solid $border-color !important;
                    a {
                        color: $color-white !important;
                    }
                }
            }
        }
		.ui-icon,
		.ui-iggrid-paging-item {
			span.ui-icon {
				width: 30px !important;
				height: 30px !important;
				position: relative !important;
				top: 0 !important;
				left: 0 !important;
				margin: 0 !important;
				padding: 0 !important;
				font-size: 12px !important;
				line-height: 12px !important;
			}
		}
		.ui-iggrid-pagedropdowncontainer {
			width: auto !important;
			height: 30px !important;
			margin: 0;
			padding: 0;
			font-size: $font-size-base;
			font-weight: 500;
			line-height: 20px;
			border-radius: $border-radius-default;
			.ui-igedit-container {
				width: auto !important;
				height: 30px !important;
				margin: 0;
				padding: 0;
				font-size: $font-size-base;
				font-weight: 500;
				line-height: 20px;
				border-radius: $border-radius-default;
				.ui-igedit-buttonimage {
					margin-top: -12px !important;
					margin-left: -16px !important;
					width: 26px !important;
					height: 26px !important;
				}
				.ui-igeditor-input-container {
					padding-right: 10px;
				}
			}
			.ui-igeditor-input-container {
				span.ui-iggrid-pagedropdowncontainer {
					margin: 0 !important;
				}
			}
			.ui-iggrid-pagedropdowncontainer,
			.ui-igedit-input {
				height: 26px !important;
				font-size: $font-size-input-default;
			}
		}
	}
	.ui-state-disabled {
		cursor: not-allowed !important;
	}
	.ui-iggrid-results {
		.ui-igedit-container,
		.ui-icon,
		.ui-iggrid-pagesizedropdown {
			position: relative;
			top: 0;
			left: 0;
			margin: 0;
			padding: 0;
			font-size: $font-size-small;
			line-height: 12px;
			font-weight: 600;
			height: 30px !important;
		}
		.ui-icon {
			width: 18px !important;
			margin-top: 0 !important;
			margin-left: 0 !important;
		}
		.ui-igedit-input {
			line-height: 20px !important;
			font-size: 12px !important;
			padding: 0 0 0 10px !important;
			font-weight: 600;
			background: 0;
		}
		.ui-igedit-dropdown-button {
			background: 0;
			border: 0;
			border-radius: 0 $border-radius-button-default $border-radius-button-default 0;
		}
	}
	.ui-iggrid-pager {
		* {
			box-sizing: border-box;
		}
		.ui-igedit-input {
			padding: 0 !important;
			max-width: 50px;
			font-size: $font-size-base;
			font-weight: 600;
			line-height: 26px;
		}
	}
	.ui-iggrid-addrow {
		+ {
			.ui-iggrid-activerow {
				td {
					&:first-child {
						border: 0;
					}
				}
			}
		}
		td {
			a {
				float: left;
				font-size: $font-size-base;
				line-height: 14px;
				font-weight: 600;
			}
		}
	}
	.ui-iggrid-toolbar {
		border-bottom: 0 !important;
		padding: 10px;
		background-color: transparent !important;
		border-radius: $border-radius-default $border-radius-default 0 0;
		.ui-state-default {
			a {
				float: left;
				font-size: $font-size-base;
				line-height: 14px;
				font-weight: 600;
			}
		}
		.ui-iggrid-results {
			float: left;
			margin-right: 15px;
			margin-top: 3px;
			background: 0;
			border: 0;
			border-color: none;
		}
		#searchbox {
			@include search-field;
		}
		.form-control {
			background: #fff;
			background-color: #fff;
			border-color: #e5e7ec;
			color: color(text-color-default);
			&:focus {
				color: color(text-color-default);
				background-color: #fff;
				border-color: $border-color;
				outline: 0;
				-webkit-box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
				-moz-box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
				box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
			}
		}
		.ui-iggrid-results {
			border-radius: $border-radius-default;
			background: 0;
			margin-top: 0;
			height: 30px;
			margin-right: 5px;
			background: 0;
			border: 0;
			border-color: none;
			span {
				@include no-user-select;
				display: inline-block;
				line-height: 26px;
				font-size: $font-size-base;
				height: 30px;
				padding: 0;
			}
			span.ui-iggrid-pagesizelabel {
				@include no-user-select;
				display: none;
			}
			.ui-igedit {
				background-color: $modal-input-background;
				border: 2px solid $modal-border-color;
				color: $color-primary;

				.ui-igedit-input {
					@include no-user-select;
					float: left;
					height: 26px !important;
					line-height: 26px;
					font-size: $font-size-base;
					color: $modal-input-color;
				}
				input {
					@include no-user-select;
				}
				.ui-icon {
					&:before {
						color: $color-primary;
					}
				}
			}
			.ui-igedit-button-common {
				@include no-user-select;
				padding: 0;
				width: 26px;
				height: 26px;
				.ui-icon {
					@include no-user-select;
					width: 26px;
					height: 26px;
					&:before {
						@include no-user-select;
						top: 0;
						left: 0;
						padding: 7px;
						font-size: $font-size-small;
						line-height: 12px;
						color: color(text-color-default);
					}
				}
			}
			&:hover {
				.ui-igedit {
					background-color: $color-primary !important;
					border: 2px solid $border-color !important;
					color: #ffffff !important;
					.ui-igedit-input {
						color: #ffffff !important;
					}
					.ui-icon {
						&:before {
							color: #ffffff !important;
						}
					}
				}
			}
		}
		.ui-state-default {
			border: 0;
			border-radius: $border-radius-default;
			background: 0;
			&:hover {
				background: 0;
			}
		}
		.form-inline {
			.form-group {
				padding: 0;
			}
		}
	}
	.ui-iggrid-headertable {
		border-collapse: collapse;
		border: 0;
	}
	.ui-widget-content {
		border-collapse: collapse;
		border: 0;
		background: none;
		color: #626d86; 
		width: max-content;
		min-width: 100%;
		.ui-state-active {
			border-left: 1px solid $classlist-background-active !important;
			border-right: 1px solid $classlist-background-active !important;
			border-width: 0 !important;
			background-color: $classlist-background-active !important;
			color: $classlist-color-active !important;
			fill: $classlist-color-active !important;
			svg {
				fill: $classlist-color-active !important;
			}
			.row-button,
			.dropdown {
				svg {
					fill: $classlist-color-active !important;
				}
			}
		}
		.ui-state-hover {
			background-color: none !important;
			border-color: none !important;
			cursor: pointer;
		}
		tr {
			
			td.ui-state-hover,
			&:hover {
				background: $color-primary !important;
				background-color: $color-primary !important;
				border-color: $color-primary !important;
				color: #ffffff !important;
				td {
					.dbqdcl-dropdown-toggle {
						position: relative;
					}
					.ui-icon {
						&:before {
							color: #ffffff !important;
						}
					}
				}
			}
		}
		a {
			text-decoration: none;
			font-weight: 600;
			color: #000000;
			&:link {
				text-decoration: none;
				font-weight: 600;
				color: #000000;
			}
			&:visited {
				text-decoration: none;
				font-weight: 600;
				color: #000000;
			}
		}
	}
	.ui-iggrid-header {
		padding: 10px;
		border-bottom: $classlist-row-border;
	}
	// TABLE
	table {
		th {
			padding: 10px;
			border-left: 0;
			border-top: 0;
			font-size: $font-size-small;
			line-height: 12px;
			font-family: $font-family-default;
			border-right: 0;
			background: #ffffff;
			color: #616161;
			border-bottom: $classlist-row-border;
			&:first-child {
				border-left: 0;
				border-right: 0;
				border-top: 0;
			}
		}
		tr {
			background: 0;
			.ui-icon {
				width: 20px !important;
				height: 20px !important;
			}
		}
		td {
			overflow: visible;
			border: 1px solid transparent;
			a.glyphicon {
				text-decoration: none;
			}
		}
		thead {
			.ui-iggrid-editingcell {
				&:first-child {
					border: 0;
				}
				border-top: 1px solid transparent;
				border-left: 0 !important;
				border-right: 0 !important;
				border-bottom: $classlist-row-border;
			}
		}
		tbody {
			td {
				border-top: 1px solid transparent;
				border-left: 0 !important;
				border-right: 0 !important;
				border-bottom: $classlist-row-border;
			}
			th.ui-iggrid-rowselector-class {
				border-top: 1px solid transparent;
				border-left: 0 !important;
				border-right: 0 !important;
				border-bottom: $classlist-row-border;
			}
		}
		tfoot {
			td {
				border-top: 1px solid transparent;
				border-left: 0 !important;
				border-right: 0 !important;
				border-bottom: $classlist-row-border;
			}
		}
		th.ui-iggrid-rowselector-class {
			&:first-child {
				border: 0;
			}
		}
		th.ui-state-default {
			font-family: $font-family-default;
			border-right: 0;
			border-color: #f4f4f4;
			background: #ffffff;
			color: #616161;
		}
		tr.ui-ig-altrecord {
			background: 0;
		}
		tr#classlist {
			.document-class-list-tree {
				tr {
					&:hover {
						background: $color-primary;
						color: #ffffff;
						.row-button {
							background: $color-primary;
							color: #ffffff !important;
						}
					}
				}
			}
		}
		td.ui-state-default,
		td.ui-state-highlight,
		td.ui-state-hover {
			font-weight: 500;
			border: 1px solid transparent;
		}
		td.ui-state-hover {
			border-top: 0;
			border-bottom: 0;
		}
		.ui-ig-altrecord {
			td.ui-state-default.ui-state-hover {
				border-top: 0;
				border-bottom: 0;
			}
			td.ui-state-hover {
				border-top: 0;
				border-bottom: 0;
			}
			th.ui-iggrid-rowselector-class.ui-state-default.ui-state-hover {
				border-top: 0;
				border-bottom: 0;
			}
			th.ui-iggrid-rowselector-class.ui-state-hover {
				border-top: 0;
				border-bottom: 0;
			}
		}
		th.ui-iggrid-rowselector-class.ui-state-hover {
			border-top: 0;
			border-bottom: 0;
		}
		tr.ui-ig-altrecord.ui-state-focus {
			td {
				border-top: 1px solid transparent !important;
				border-bottom: 1px solid $modal-border-color !important;
			}
			th {
				border-top: 1px solid transparent !important;
				border-bottom: 1px solid $modal-border-color !important;
			}
		}
		tr.ui-state-focus {
			td {
				border-top: 0 !important;
				border-bottom: 0 !important;
			}
			th {
				border-top: 1px solid transparent !important;
				border-bottom: 1px solid $modal-border-color !important;
			}
		}
	}
	.ui-iggrid-pagedropdowncontainer.ui-state-default {
		height: 30px;
		background: 0;
		border: 0;
	}
	.ui-iggrid-pagesizedropdown.ui-state-default {
		height: 30px;
		background: 0;
		border: 0;
	}
	// Footer
	.ui-iggrid-footer {
		background-color: transparent !important;
		padding: 10px;
		background: none !important;
		border-radius: 0 0 $border-radius-default $border-radius-default;
		border-bottom: 0 !important;
	
		.ui-state-active {
			border: 0 !important;
			background-color: #e5e7ec !important;
			color: #ffffff !important;
		}

		.ui-state-default {
			a {
				float: left;
				font-size: $font-size-base;
				line-height: 14px;
				font-weight: 600;
				color: $modal-input-color !important;
			}
		}

		.ui-iggrid-paging-item {
			.ui-iggrid-page.ui-state-default {
				margin: 0 0 0 5px;
				line-height: 12px;
				font-size: $font-size-small;
				font-weight: 600;
				background: 0;
				cursor: pointer;
				padding: 3px 7px;
				opacity: 1;
				color: color(text-color-default);
				background-color: $modal-input-background;
				border: 2px solid $modal-border-color;
				border-radius: $border-radius-default;
			}
			.ui-iggrid-pagecurrent.ui-state-active {
				color: color(text-color-default);
				border-radius: $border-radius-default;
				border: 2px solid color(text-color-default) !important;
				background-color: $modal-input-background !important;
				&:before {
					color: $modal-input-color !important;
				}
			}
		}
		.ui-state-default.ui-igedit-button-common {
			&::after {
				content: "";
				clear: both;
				display: table;
			}
			border: 0 !important;
			padding: 0 !important;
			border-radius: 0 7px 7px 0;
		}
		.ui-iggrid-paging {
			ul.ui-iggrid-pagelist {
				li.ui-iggrid-page.ui-state-default {
					padding: 6px 7px !important;
				}
			}
		}

		// Pagination first page
		.ui-iggrid-firstpage.ui-state-default {
			.ui-iggrid-firstpageimg,
			.ui-iggrid-firstpageimgdisabled {
				font-size: $font-size-small;
				line-height: 12px;
				font-weight: 600;
				border-radius: $border-radius-default;
				opacity: 1;
			}
			.ui-iggrid-firstpageimg {
				background-color: $modal-input-background !important;
				border: 2px solid $modal-border-color;
				color: $modal-input-color;
				&:before {
					color: $modal-input-color !important;
				}
			}
			.ui-iggrid-firstpageimgdisabled {
				background-color: $modal-disabled-color !important;
				border: 2px solid $modal-disabled-color;
				color: $modal-input-color;
				&:before {
					color: $modal-input-color !important;
				}
			}
			&:hover {
				.ui-icon {
					&:before {
						color: $color-white !important;
					}
				}
				.ui-iggrid-firstpageimg {
					background: $color-primary !important;
					border: 2px solid $border-color !important;
					color: $color-white !important;
					&:before {
						color: $color-white !important;
					}
				}
				.ui-iggrid-firstpageimgdisabled {
					background: $modal-disabled-color !important;
					border: 2px solid $modal-disabled-color !important;
					color: $modal-input-color !important;
					&:before {
						color: $modal-input-color !important;
					}
				}
				.ui-iggrid-firstpageimgdisabled.ui-icon {
					&:before {
						color: $modal-input-color !important;
					}
				}
			}
		}

		// Pagination last page
		.ui-iggrid-lastpage.ui-state-default {
			.ui-iggrid-lastpageimg,
			.ui-iggrid-lastpageimgdisabled {
				font-size: $font-size-small;
				line-height: 12px;
				font-weight: 600;
				border-radius: $border-radius-default;
				opacity: 1;
			}

			.ui-iggrid-lastpageimg {
				background-color: $modal-input-background !important;
				color: $modal-input-color;
				border: 2px solid $modal-border-color;
				&:before {
					color: $modal-input-color !important;
				}
			}
			.ui-iggrid-lastpageimgdisabled {
				border: 2px solid $modal-disabled-color;
				background-color: $modal-disabled-color !important;
				color: $modal-input-color;
				&:before {
					color: $modal-input-color !important;
				}
			}
			.ui-iggrid-prevpagelabel,
			.ui-iggrid-nextpagelabel {
				color: $modal-input-color;
			}
			&:hover {
				.ui-icon {
					&:before {
						color: $color-white;
					}
				}
				.ui-iggrid-lastpageimg {
					background-color: $color-primary !important;
					border: 2px solid $border-color !important;
					color: $color-white !important;
					&:before {
						color: $color-white !important;
					}
				}
				.ui-iggrid-lastpageimgdisabled {
					background-color: $modal-disabled-color !important;
					border: 2px solid $modal-disabled-color !important;
					color: $modal-input-color !important;
					&:before {
						color: $modal-input-color !important;
					}
				}
				.ui-iggrid-lastpageimgdisabled.ui-icon {
					&:before {
						color: $modal-input-color !important;
					}
				}
			}
		}

		// Pagination previous page
		.ui-iggrid-prevpage.ui-state-default {
			.ui-iggrid-prevpageimg,
			.ui-iggrid-prevpagelabel,
			.ui-iggrid-prevpagelabeldisabled,
			.ui-iggrid-prevpageimgdisabled {
				font-size: $font-size-small;
				line-height: 12px;
				font-weight: 600;
				opacity: 1;
			}
			.ui-iggrid-prevpageimg {
				border-radius: $border-radius-button-default 0 0 $border-radius-button-default;
				background-color: $modal-input-background !important;
				color: $modal-input-color;
				border: 2px solid $modal-border-color;
				border-right: 0;
				&:before {
					color: $modal-input-color !important;
				}
			}
			.ui-iggrid-prevpagelabel {
				border-radius: 0 $border-radius-button-default $border-radius-button-default 0;
				background-color: $modal-input-background !important;
				color: $modal-input-color;
				border: 2px solid $modal-border-color;
				border-left: 0;
				&:before {
					color: $modal-input-color !important;
				}
			}
			.ui-iggrid-prevpagelabeldisabled {
				border-radius: 0 $border-radius-button-default $border-radius-button-default 0;
				border-left: 0;
				background-color: $modal-disabled-color !important;
				border: 2px solid $modal-disabled-color;
				color: $modal-input-color;
				&:before {
					color: $modal-input-color !important;
				}
			}
			.ui-iggrid-prevpageimgdisabled {
				border-radius: $border-radius-button-default 0 0 $border-radius-button-default;
				border-right: 0;
				background-color: $modal-disabled-color !important;
				border: 2px solid $modal-disabled-color;
				color: $modal-input-color;
				&:before {
					color: $modal-input-color !important;
				}
			}
			&:hover {
				.ui-iggrid-prevpagelabel {
					border-radius: 0 $border-radius-button-default $border-radius-button-default 0;
				}
				.ui-iggrid-prevpageimg {
					border-radius: $border-radius-button-default 0 0 $border-radius-button-default;
				}
				.ui-icon {
					&:before {
						color: $color-white;
					}
				}
				.ui-iggrid-prevpagelabel,
				.ui-iggrid-prevpageimg {
					background: $color-primary !important;
					border: 2px solid $border-color !important;
					color: $color-white !important;
					&:before {
						color: $color-white !important;
					}
				}

				.ui-iggrid-prevpagelabel {
					border-left: 0 !important;
				}
				.ui-iggrid-prevpageimg {
					border-right: 0 !important;
				}
				.ui-iggrid-prevpageimgdisabled.ui-icon {
					&:before {
						color: $modal-input-color !important;
					}
				}
				.ui-iggrid-prevpagelabeldisabled.ui-iggrid-prevpagelabel {
					color: $modal-input-color !important;
				}
			}
		}

		// Pagination next page
		.ui-iggrid-nextpage.ui-state-default {
			.ui-iggrid-nextpageimg,
			.ui-iggrid-nextpagelabel,
			.ui-iggrid-nextpagelabeldisabled,
			.ui-iggrid-nextpageimgdisabled {
				font-size: $font-size-small;
				line-height: 12px;
				font-weight: 600;
				opacity: 1;
			}
			.ui-iggrid-nextpageimg {
				border-left: 0 !important;
				background-color: $modal-input-background !important;
				border-radius: 0 $border-radius-button-default $border-radius-button-default 0;
				border: 2px solid $modal-border-color;
				color: $modal-input-color;
				&:before {
					color: $modal-input-color !important;
				}
			}
			.ui-iggrid-nextpagelabel {
				border-right: 0 !important;
				background-color: $modal-input-background !important;
				border-radius: $border-radius-button-default 0 0 $border-radius-button-default;
				border: 2px solid $modal-border-color;
				color: $modal-input-color;
				&:before {
					color: $modal-input-color !important;
				}
			}
			.ui-iggrid-nextpagelabeldisabled {
				border-right: 0 !important;
				border-radius: $border-radius-button-default 0 0 $border-radius-button-default;
				background-color: $modal-disabled-color !important;
				border: 2px solid $modal-disabled-color;
				color: $modal-input-color;
				&:before {
					color: $modal-input-color !important;
				}
			}
			.ui-iggrid-nextpageimgdisabled {
				border-left: 0 !important;
				border-radius: 0 $border-radius-button-default $border-radius-button-default 0;
				background-color: $modal-disabled-color !important;
				border: 2px solid $modal-disabled-color;
				color: $modal-input-color;
				&:before {
					color: $modal-input-color !important;
				}
			}

			&:hover {
				.ui-iggrid-nextpageimg {
					border-radius: 0 $border-radius-button-default $border-radius-button-default 0;
					background: $color-primary !important;
					border: 2px solid $border-color !important;
					color: $color-white !important;
					border-left: 0 !important;
				}
				.ui-iggrid-nextpagelabel {
					border-radius: $border-radius-button-default 0 0 $border-radius-button-default;
					background: $color-primary !important;
					border: 2px solid $border-color !important;
					color: $color-white !important;
					border-right: 0 !important;
				}
				.ui-icon {
					&:before {
						color: $color-white !important;
					}
				}
				.ui-iggrid-nextpageimgdisabled.ui-icon {
					&:before {
						color: $modal-input-color !important;
					}
				}
				.ui-iggrid-nextpagelabeldisabled.ui-iggrid-nextpagelabel {
					color: $modal-input-color !important;
				}
			}
		}
		.ui-iggrid-paging-item.ui-iggrid-firstpage {
			width: 30px !important;
			height: 30px !important;
			position: relative !important;
			top: 0 !important;
			left: 0 !important;
			margin: 0 !important;
			padding: 0 !important;
			font-size: $font-size-small !important;
			line-height: 12px !important;
		}

		.ui-iggrid-results {
			font-weight: 600;
			line-height: 20px;
			font-size: $font-size-small;
			padding: 5px 0;
			margin: 0;
			color: color(text-color-default) !important;
		}
		.ui-iggrid-paging-item.ui-state-default {
			color: #000000;
			border-radius: $border-radius-default;
			border: 0 !important;
			background: 0 !important;
			background-color: none !important;
			cursor: pointer;
		}
	}
	.ui-iggrid-page {
		padding: 6px 5px !important;
	}
	a.ui-iggrid-pagelink {
		font-size: $font-size-small;
		line-height: 12px;
	}
	a.ui-iggrid-pagelinkcurrent {
		font-size: $font-size-small;
		line-height: 12px;
	}
	.ui-igedit-input {
		padding: 0 !important;
	}
	.ui-iggrid-pagedropdownlabels {
		display: none;
	}
	span[data-localeid="nextPageLabelText"] {
		padding: 0 0 0 10px;
	}
	span[data-localeid="prevPageLabelText"] {
		padding: 0 10px 0 0;
	}
	.ui-igeditor-input-container {
		border-radius: 10px 0 0 10px !important;
	}
	.ui-igcombo-listitemholder {
		li.ui-state-default {
			padding: 3px 5px;
		}
	}
	.ui-igedit-list {
		.ui-igedit-listitem.ui-state-default {
			padding: 3px 5px;
		}
	}
	.ui-iggrid-columnmoving-dropdown-list {
		li.ui-state-default {
			padding: 3px 5px;
		}
	}
	.ui-iggrid-featurechooser-list {
		li.ui-state-default {
			padding: 3px 5px;
		}
	}
	.ui-iggrid-filterddlist {
		li.ui-state-default {
			padding: 3px 5px;
		}
	}
	.ui-iggrid-hiding-dropdown-list {
		li.ui-state-default {
			padding: 3px 5px;
		}
	}
	.ui-iggrid-firstpage {
		.ui-icon {
			left: 0 !important;
		}
	}
	.ui-iggrid-prevpage {
		.ui-icon {
			left: 0 !important;
		}
	}
	
	.ui-igtreegrid-expandcell {
		min-width: 0;
		margin: 0;
		height: 20px;
		float: left;
	}
	
	.ui-iggrid-pagelist {
		padding: 0 !important;
		li {
			margin: 0 0 0 5px;
		}
	}
	.ui-iggrid-lastpage {
		.ui-icon {
			right: 0 !important;
		}
	}
	.ui-iggrid-nextpage {
		.ui-icon {
			right: 0 !important;
		}
	}
	body[dir="rtl"] {
		.ui-iggrid-featurechoosericoncontainer {
			right: 0 !important;
		}
		.ui-iggrid-filtericoncontainer {
			right: 0 !important;
		}
	}
	
	.ui-iggrid-pagedropdowncontainer {
		border: 0 !important;
		background: 0 !important;
		background-color: none !important;
		cursor: pointer;
		.ui-state-default {
			background: 0;
			cursor: pointer;
			border: 2px solid $modal-border-color;
			background-color: $modal-input-background;
			opacity: 1 !important;
			.ui-icon {
				&:before {
					color: $color-primary !important;
				}
			}
		}
		&:hover {
			.ui-state-default {
				background: $color-primary !important;
				border: 2px solid $border-color !important;
				color: $color-white !important;
				.ui-igedit-input {
					color: $color-white !important;
				}
				.ui-icon {
					&:before {
						color: $color-white !important;
					}
				}
			}
			.ui-igedit-button-common {
				background: 0 !important;
				border: 0 !important;
			}
			.ui-state-hover.ui-state-default {
				.ui-icon {
					color: $color-white;
				}
			}
		}
	}
	.ui-state-active {
		a {
			color: $color-primary !important;
			&:link {
				color: $color-primary !important;
			}
			&:visited {
				color: $color-primary !important;
			}
		}
	}
	.ui-igcombo-listitemholder {
		li.ui-state-default {
			color: $color-primary;
			background-color: $modal-input-background;
			border: 1px solid $modal-border-color;
		}
		li.ui-state-active {
			border: 2px solid $modal-border-color;
			background-color: $color-primary;
			color: $color-white;
			a {
				border: 2px solid $modal-border-color;
				background-color: $color-primary;
				color: $color-white;
			}
		}
		li.ui-state-highlight {
			border: 2px solid $modal-border-color;
			background-color: $color-primary;
			color: $color-white;
			a {
				border: 2px solid $modal-border-color;
				background-color: $color-primary;
				color: $color-white;
			}
		}
	}

	.ui-igedit-list {
		.ui-igedit-listitem.ui-state-default {
			color: $color-primary;
			background-color: $modal-input-background;
			border: 1px solid $modal-border-color;
		}
		.ui-igedit-listitem.ui-state-highlight {
			border: 2px solid $modal-border-color;
			background-color: $color-primary;
			color: $color-white;
		}
	}
	.ui-iggrid-columnmoving-dropdown-list {
		li.ui-state-default {
			color: $color-primary;
			background-color: $modal-input-background;
			border: 1px solid $modal-border-color;
		}
		li.ui-state-active {
			border: 2px solid $modal-border-color;
			background-color: $color-primary;
			color: $color-white;
		}
	}
	.ui-iggrid-featurechooser-list {
		li.ui-state-default {
			color: $color-primary;
			background-color: $modal-input-background;
			border: 1px solid $modal-border-color;
		}
		li.ui-state-active {
			border: 2px solid $modal-border-color;
			background-color: $color-primary;
			color: $color-white;
		}
	}
	.ui-iggrid-filterddlist {
		li.ui-state-default {
			color: $color-primary;
			background-color: $modal-input-background;
			border: 1px solid $modal-border-color;
		}
		li.ui-state-active {
			border: 2px solid $modal-border-color;
			background-color: $color-primary;
			color: $color-white;
		}
	}
	.ui-iggrid-hiding-dropdown-list {
		li.ui-state-default {
			color: $color-primary;
			background-color: $modal-input-background;
			border: 1px solid $modal-border-color;
		}
		li.ui-state-active {
			border: 2px solid $modal-border-color;
			background-color: $color-primary;
			color: $color-white;
		}
	}
	.ui-iggrid-featurechooser-dropdown-dialog {
		background: #e5e7ec;
		border: 1px solid $modal-border-color;
	}
	.ui-iggrid-filterdd {
		background: #e5e7ec;
		border: 1px solid $modal-border-color;
	}
	.ui-widget.ui-widget-content.ui-igpivot-filterdropdown {
		background: #e5e7ec;
		border: 1px solid $modal-border-color;
	}
	.ui-widget.ui-widget-content.ui-igpivot-metadatadropdown {
		background: #e5e7ec;
		border: 1px solid $modal-border-color;
	}
	.ui-iggrid-columnmoving-dropdown-list.ui-state-active {
		a {
			border: 2px solid $modal-border-color;
			background-color: $color-primary;
			color: $color-white;
		}
	}
	.ui-iggrid-featurechooser-list.ui-state-active {
		a {
			border: 2px solid $modal-border-color;
			background-color: $color-primary;
			color: $color-white;
		}
	}
	.ui-iggrid-filterddlistitem.ui-state-active {
		a {
			border: 2px solid $modal-border-color;
			background-color: $color-primary;
			color: $color-white;
		}
	}
	.ui-iggrid-hiding-dropdown-list.ui-state-active {
		a {
			border: 2px solid $modal-border-color;
			background-color: $color-primary;
			color: $color-white;
		}
	}
	
	
	#classlist {
		button.classlist-toolbar-item {
			border-radius: $border-radius-default;
			border: 2px solid $modal-border-color;
			background: 0;
		}
	}
	.ui-igedit-container {
		height: 26px;
		background: 0;
	}
	.ui-iggrid-firstpage {
		box-sizing: border-box;
		height: 30px !important;
		margin: 0 0 0 5px !important;
		padding: 0 !important;
		&::after {
			content: "";
			clear: both;
			display: table;
		}
		.ui-icon {
			left: 0 !important;
		}
	}
	.ui-iggrid-lastpage {
		box-sizing: border-box;
		height: 30px !important;
		margin: 0 0 0 5px !important;
		padding: 0 !important;
		&::after {
			content: "";
			clear: both;
			display: table;
		}
	}
	.ui-iggrid-prevpage {
		box-sizing: border-box;
		height: 30px !important;
		margin: 0 0 0 5px !important;
		padding: 0 !important;
		&::after {
			content: "";
			clear: both;
			display: table;
		}
		.ui-icon {
			left: 0 !important;
		}
	}
	.ui-iggrid-nextpage {
		box-sizing: border-box;
		height: 30px !important;
		margin: 0 0 0 5px !important;
		padding: 0 !important;
		&::after {
			content: "";
			clear: both;
			display: table;
		}
	}
	.ui-iggrid-pagedropdowncontainer {
		box-sizing: border-box;
		height: 30px !important;
		margin: 0 0 0 5px !important;
		padding: 0 !important;
		border-radius: $border-radius-default;
		.ui-state-default {
			font-size: $font-size-small;
			line-height: 12px;
			font-weight: 600;
			border: 2px solid $modal-border-color !important;
			background-color: $modal-input-background !important;
			opacity: 1 !important;
			border-radius: $border-radius-default;
			.ui-icon {
				&:before {
					color: $modal-input-color !important;
				}
			}
		}
	}
	.ui-iggrid-pagedropdownlabels {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}
	.ui-iggrid-collapsibleindicatorcontainer {
		a {
			.ui-iggrid-multiheader-collapsed {
				&:before {
					width: 26px;
					height: 26px;
					display: block;
					position: absolute;
					top: 5px;
					left: 0;
					margin-left: 0;
					margin-top: 0;
					line-height: 14px;
					font-size: $font-size-base;
					text-indent: 0;
				}
			}
			.ui-iggrid-multiheader-expanded {
				&:before {
					width: 26px;
					height: 26px;
					display: block;
					position: absolute;
					top: 5px;
					left: 0;
					margin-left: 0;
					margin-top: 0;
					line-height: 14px;
					font-size: $font-size-base;
					text-indent: 0;
				}
			}
		}
	}
	.ui-iggrid-filtericon {
		&:before {
			width: 26px;
			height: 26px;
			display: block;
			position: absolute;
			top: 5px;
			left: 0;
			margin-left: 0;
			margin-top: 0;
			line-height: 14px;
			font-size: $font-size-base;
			text-indent: 0;
		}
	}
	.ui-iggrid-moving-indicator {
		&:before {
			width: 26px;
			height: 26px;
			display: block;
			position: absolute;
			top: 5px;
			left: 0;
			margin-left: 0;
			margin-top: 0;
			line-height: 14px;
			font-size: $font-size-base;
			text-indent: 0;
		}
	}
	.ui-iggrid-paging {
		.ui-igedit-input {
			color: $modal-input-color !important;
		}
		.ui-icon {
			&:before {
				top: 0;
				line-height: 12px;
				font-size: $font-size-small;
				padding: 7px;
			}
		}
	}
	ul.ui-iggrid-pagelist {
		height: 30px !important;
	}
	.ui-igedit-input {
		max-width: 50px;
		font-size: $font-size-base;
		font-weight: 600;
		line-height: 26px;
		background: 0;
	}
	.ui-chart-legend-item-text,
	.ui-chart-piechart-container,
	.ui-sparkline {
		font-family: $font-family-default;
	}
	.ui-igedit,
	.ui-widget .ui-igedit {
		background: $modal-input-background !important;
	}

	.ui-widget {
		font-family: $font-family-default;
		button {
			font-family: $font-family-default;
		}
		input {
			font-family: $font-family-default;
		}
		select {
			font-family: $font-family-default;
		}
		textarea {
			font-family: $font-family-default;
		}
	}
	.ui-helper-clearfix {
		&:after {
			@include no-user-select;
		}
		&:before {
			@include no-user-select;
		}
	}
	.ui-iggrid-responsive-vertical {
		tr.ui-ig-altrecord {
			>td.ui-state-hover {
				&:first-child {
					border-top: 0;
					border-bottom: 0;
				}
			}
		}
		tr {
			>td.ui-state-hover {
				&:first-child {
					border-top: 0;
					border-bottom: 0;
				}
			}
		}
	}
	.ui-widget-header {
		font-family: $font-family-default;
		border-right: 0;
		background: none;
		color: #616161;
		.ui-state-active {
			border: $classlist-row-border !important;
			background-color: $classlist-background-active !important;
			color: $classlist-color-active !important;
			fill: $classlist-color-active !important;
		}
		.ui-state-hover {
			background-color: none !important;
			border-color: none !important;
			cursor: pointer;
		}
		tr {
			td.ui-state-hover {
				background: $color-primary !important;
				background-color: $color-primary !important;
				border-color: $border-color !important;
				color: #ffffff !important;
			}
		}
	}
	
	.ui-state-focus:not(.ui-igedit) {
		background-color: transparent !important;
		color: #ffffff !important;
	}
	
	.ui-state-hover {
		background-color: none !important;
		border-color: none !important;
		cursor: pointer;
		span.row-button {
			&:hover {
				svg {
					fill: #001335 !important;
				}
			}
		}
	}
	
	div.ui-iggrid-results {
		&:hover {
			background-color: none !important;
			border-color: none !important;
			cursor: pointer;
		}
	}
	
	.ui-iggrid-paging-item {
		.ui-state-hover {
			border: 0 !important;
			background: 0 !important;
		}
		.ui-state-active {
			a {
				font-weight: 700;
				&:link {
					font-weight: 700;
				}
				&:visited {
					font-weight: 700;
				}
			}
		}
	}
	
	.ui-iggrid-paging {
		.ui-state-active {
			a {
				&:link {
					color: color(text-color-default) !important;
					text-decoration: none;
				}
			}
		}
	}
}

.ui-igedit-dropdown {
	background: $modal-input-background;
	border: 2px solid $modal-border-color;
	border-radius: 5px;
	@include scrollbar($modal-input-background, 0, $sidebar-scrollbar-thumb-color, $color-primary);
	.ui-igedit-listitem.ui-state-default {
		color: color(text-color-default);
		font-size: $font-size-base !important;
		border-top: 0;
		border-left: 0;
		border-bottom: 1px solid $modal-border-color;
		border-right: 1px solid $modal-border-color;
		background-color: $modal-input-background;
		padding: 3px 5px;
	}
	.ui-igedit-listitem.ui-state-highlight {
		background-color: $color-primary;
		color: $color-white;
	}
	.ui-igedit-listitem.ui-state-default.ui-state-hover {
		background-color: $color-primary;
		color: $color-white;
		border-top-color: $color-primary;
	}
}
.ui-iggrid  {
	.ui-ig-altrecord td.ui-state-active,
	.ui-ig-altrecord th.ui-iggrid-rowselector-class.ui-state-active,
	tbody .ui-ig-altrecord .ui-iggrid-mergedcell.ui-state-active,
	tbody .ui-ig-altrecord .ui-iggrid-mergedcellstop.ui-state-active,
	tbody .ui-iggrid-mergedcell.ui-state-active,
	tbody .ui-iggrid-mergedcellstop.ui-state-active,
	td.ui-state-active,
	th.ui-iggrid-rowselector-class.ui-state-active {
		color: #43464c;
		border-color: #f5f5f5;
		background: #0f131b;
	}
}


div[data-is-multiselect="true"] {
	.ui-iggrid {
		.ui-iggrid-table {
			>tbody {
				>tr {
					>td {
						border-top: 1px solid $classlist-background !important;
						border-right: 0 !important;
						border-bottom: $classlist-row-border !important;
						border-left: 0 !important;
						background: $classlist-background !important;
					}
					>td.ui-state-active {
						border-top: 1px solid #e2e7f3 !important;
						border-right: 0 !important;
						border-bottom: 1px solid #e2e7f3 !important;
						border-left: 0 !important;
						background: #e2e7f3 !important;
					}
					>td.ui-state-hover {
						border-top: 1px solid $color-primary !important;
						border-right: 0 !important;
						border-bottom: 1px solid $color-primary !important;
						border-left: 0 !important;
						background: $color-primary !important;
					}
				}
			}
		}
	}
}


span.row-button {
	cursor: pointer;
	display: inline-block;
	background-color: rgba(0, 0, 0, 0);
	color: #888;
	border: 1px solid transparent;
	padding: 5px 10px;
	margin-bottom: 0px;
	vertical-align: middle;
	float: left;
	border-radius: 3px;
  }