$primaryColor: #242C36;
$primaryDarkColor: #202930;
$primaryLightColor: #2A343C;
$accentColor: #242C36;
$accentDarkColor: #202930;
$accentLightColor: #2A343C;
$accentTextColor: #ffffff;
$darkMenuBgColor: #2b3135;
$darkMenuHoverColor: #777d81;

@import 'base/theme/_theme';

body {

	.card.card-w-title {
		padding-bottom: 1em;
		padding-top: 1em;
	}

	h3 {
		padding-top: 0.5em;
		margin-top: 0em;
		padding-bottom: 0.5em;
		margin-bottom: 0em;
	}

	.ui-selectbutton {

		.ui-state-default {
			background-color: #ffffff;
			color: #000000;
		}

		.ui-state-active {
			background-color: $primaryColor;
			color: #FFFFFF;
		}

	}

	.ui-togglebutton {

		&.ui-state-default {
			background-color: #ffffff;
			color: #000000;
		}

		&.ui-state-active {
			background-color: $primaryColor;
			color: #FFFFFF;
		}
	}

	.ui-treetable {

		tbody {
			.ui-treetable-row {
				background-color: #ffffff;

				td {
					border: 0 none;
					padding: .065em .175em;
				}
			}
		}
	}

	.ui-datatable {

		thead {
			tr {
				th {
					border: none;
					font-weight: normal;
					border-left: 1px solid $dividerLightColor;
					border-right: 1px solid $dividerLightColor;

					&:first-child {
						border-left: none;
					}

					&:last-child {
						border-right: none;
					}

					.ui-sortable-column-icon {
						vertical-align: middle;
						margin: -.25em 0 0 0;
					}

					&.ui-state-active {
						background-color: transparent;
						color: $textColor;
						border-top-color: transparent;

						.fa {
							color: $accentDarkColor;
						}

						.ui-inputtext {
							color: $textColor;

							&.ui-state-focus {
								border-color: transparent;
							}
						}
					}
				}
			}
		}

		tbody {
			tr.ui-datatable-even {
				background-color: #ffffff;
			}

			tr {
				td {
					border-left: 1px solid $dividerLightColor;
					border-right: 1px solid $dividerLightColor;
					border-top: none;
					border-bottom: none;

					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;

					padding: .1625em .475em;

					&:first-child {
						border-left: none;
					}

					&:last-child {
						border-right: none;
					}
				}
			}
		}
	}

	// TODO make that a bit lighter...
	.ui-paginator {
		background-color: $primaryDarkColor;
		padding: $headerPadding;

		> a {
			box-sizing: border-box;
			color: #ffffff;

			&.ui-state-hover {
				background-color: $primaryLightColor;
				@include border-radius(50%);
				@include transition(background-color .3s);
			}
		}

		.ui-paginator-pages {
			vertical-align: middle;
			margin: 0 .375em 0 .375em;

			a {
				padding: 0;
				color: #ffffff;
				@include border-radius(50%);
				@include transition(background-color .3s);

				&.ui-state-hover {
					background-color: $primaryLightColor;
				}

				&.ui-state-active {
					background-color: $accentColor;
					color: $accentTextColor;
				}
			}
		}
	}

}

.tree-table-no-header thead {
	display: none;
	border: none;
}

.tree-table-no-header table {
	border: none;
}



