//  =================
//      Imports
//  =================

@import '../base/color_variables';      // Color Variables
@import '../base/fonticons';            // Fonticons Variables
@import '../base/urls';                 // URLS Variables
@import '../base/utilities_variables';  // Utilities Variables


/*      Circle Progressbar    */
#multi-property {
	width: 120px;
	height: 120px;
	position: $pos-rel;
}
#n-progress-send {
	width: 120px;
	height: 120px;
	position: $pos-rel;
}
#n-progress-success-read {
	width: 120px;
	height: 120px;
	position: $pos-rel;
}
#n-progress-received {
	width: 120px;
	height: 120px;
	position: $pos-rel;
}
.newsletter-top-section {
	h4.card-title {
		color: $black;
		font-weight: 600;
	}
	.n-cards {
		background-color: $white;
		padding: $p-20;
		border-radius: $br-10;
		box-shadow: $shadow-3;
		i {
			font-size: 26px;
			cursor: pointer;
		}
		i.ico-open {
			color: $color_56;
		}
		&:hover {
			i.ico-open {
				color: $color_76;
			}
			i.ico-send {
				color: $color_76;
			}
			i.ico-success-read {
				color: $color_76;
			}
			i.ico-received {
				color: $color_76;
			}
			h6.txt-open {
				color: $color_76;
			}
			h6.txt-send {
				color: $color_76;
			}
			h6.txt-success-read {
				color: $color_76;
			}
			h6.txt-received {
				color: $color_76;
			}
		}
		i.ico-send {
			color: $color_88;
		}
		i.ico-success-read {
			color: $color_57;
		}
		i.ico-received {
			color: $color_148;
		}
		h4 {
			color: $color_48;
			font-weight: 700;
		}
		h6.txt-open {
			color: $additional-color-7;
			font-weight: 600;
		}
		h6.txt-send {
			color: $additional-color-3;
			font-weight: 600;
		}
		h6.txt-success-read {
			color: $additional-color-5;
			font-weight: 600;
		}
		h6.txt-received {
			color: $color_47;
			font-weight: 600;
		}
	}
}
.dataTables_filter {
	input {
		position: $pos-rel;
		margin-left: $m-5;
		border-radius: $br-30;
		padding-bottom: $m-5;
		padding-top: $m-5;
		border: $solid $b-width-1 $additional-color-6;
	}
}
div.dataTables_length {
	label {
		color: $additional-color-2;
	}
}
.table {
	>thead {
		>tr {
			>th {
				color: $color_56;
				&:hover {
					color: $additional-color-2;
					border-bottom: $solid $b-width-1 $additional-color-2;
				}
			}
		}
	}
	thead {
		th {
			vertical-align: $v-align-bottom;
			border-bottom: $b-width-1 $solid $color_370;
		}
	}
	tr {
		&:hover {
			td {
				color: $black;
			}
		}
	}
	.badge-success {
		border-radius: $br-30;
		padding: 6px;
		width: 80px;
		will-change: opacity, transform;
		transition: all 0.3s ease-out;
		-webkit-transition: all 0.3s ease-out;
	}
	.badge-danger {
		border-radius: $br-30;
		padding: 6px;
		width: 80px;
		will-change: opacity, transform;
		transition: all 0.3s ease-out;
		-webkit-transition: all 0.3s ease-out;
	}
	.badge-primary {
		border-radius: $br-30;
		padding: 6px;
		width: 80px;
		will-change: opacity, transform;
		transition: all 0.3s ease-out;
		-webkit-transition: all 0.3s ease-out;
	}
	.badge-warning {
		border-radius: $br-30;
		padding: 6px;
		width: 80px;
		will-change: opacity, transform;
		transition: all 0.3s ease-out;
		-webkit-transition: all 0.3s ease-out;
	}
	>tbody {
		>tr {
			>td {
				font-size: 14px;
			}
		}
	}
}
.table-bordered {
	td {
		border: $b-width-1 $solid $color_369;
	}
}
.table-checkable {
	tbody {
		tr.checked {
			td {
				background-color: $color_383;
			}
		}
	}
	.checkbox-column {
		div.checker {
			margin-right: $m-5;
		}
	}
}
td {
	color: $color_2;
}
.table-hover {
	tbody {
		tr {
			&:hover {
				>td {
					color: $black;
				}
				>th {
					color: $black;
				}
				background-color: $white;
			}
		}
	}
}
.align-center {
	.btn-sm {
		padding: 0.25rem 0.625rem;
		font-size: 0.75rem;
		border-radius: $br-30;
		text-transform: $transform-capital;
		background-color: $white;
		&:hover {
			background-color: $white;
			border: $solid $b-width-1 $white;
			box-shadow: $shadow-5;
			will-change: opacity, transform;
			transition: all 0.3s ease-out;
			-webkit-transition: all 0.3s ease-out;
		}
	}
}
#newsletter-report_paginate {
	.page-item.active {
		.page-link {
			background-color: $additional-color-11;
			border-color: $additional-color-11;
			color: $white;
			border-radius: 4px;
			will-change: opacity, transform;
			transition: all 0.3s ease-out;
			-webkit-transition: all 0.3s ease-out;
		}
	}
	ul.pagination {
		li {
			a {
				&:hover {
					&:not(.active) {
						background-color: $color_57;
						color: $white;
						border-radius: 4px;
						will-change: opacity, transform;
						transition: all 0.3s ease-out;
						-webkit-transition: all 0.3s ease-out;
					}
				}
			}
		}
	}
}
div#newsletter-report_paginate {
	.page-link {
		&:focus {
			box-shadow: none;
		}
	}
	ul.pagination {
		li.previous {
			i {
				vertical-align: $v-align-middle;
			}
		}
		li.next {
			i {
				vertical-align: $v-align-middle;
			}
		}
	}
}
table.dataTable.display {
	tbody {
		tr.odd {
			>.sorting_1 {
				background-color: $white;
			}
		}
		tr {
			&:hover {
				>.sorting_1 {
					background-color: $white;
				}
			}
		}
	}
}
