/* wc.ui.table.color.scss */
@import 'mixins-common';


table {
	@if ($wc-ui-color-table-bg != -1) {
		background-color: $wc-ui-color-table-bg;
	}

	@if ($wc-ui-color-table-fg != -1) {
		color: $wc-ui-color-table-fg;
	}
}

@if ($wc-ui-color-table-head-bg != -1) {
	thead {
		background-color: $wc-ui-color-table-head-bg;

		&,
		.wc-nobutton,
		.wc-linkbutton,
		a,
		a:visited {
			color: $wc-ui-color-table-head-fg;
		}

		.wc-nobutton[disabled],
		.wc-nobutton[disabled],
		a[aria-disabled='true'] {
			color: $wc-ui-color-table-head-disabled;
		}

		.wc-submenu .wc-menuitem {
			color: $wc-ui-color-menu-fg;
		}
	}

	@if ($wc-ui-color-table-head-sorted-bg != 1) {
		th[sorted] { // the TH needs to be opague to over-ride the thead background color rather than over-lay it.
			background-color: $wc-ui-color-table-head-sorted-bg;

			&,
			.wc-nobutton,
			.wc-linkbutton,
			a,
			a:visited {
				color: $wc-ui-color-table-head-sorted-fg;
			}

			.wc-nobutton[disabled],
			.wc-nobutton[disabled],
			a[aria-disabled='true'] {
				color: $wc-ui-color-table-head-sorted-disabled-fg;
			}
		}
	}


	// Disabled th -
	// TODO: remove when WDataTable disabled is dropped.
	th[aria-disabled='true'] {
		color: $wc-ui-color-table-head-disabled;

		@if ($wc-ui-color-table-head-sorted-bg != -1) {
			&[sorted] {
				color: $wc-ui-color-table-head-sorted-disabled-fg;
			}
		}
	}
}

// The control below the table
@if ($wc-ui-color-table-foot-bg != -1) {
	.wc_table_bottom_controls {
		background-color: $wc-ui-color-table-foot-bg;
		color: $wc-ui-color-table-foot-fg;
	}
}

// Sorted column
@if ($wc-ui-color-table-col-sorted-bg != 1) {
	.wc_table_sort_sorted {
		background-color: $wc-ui-color-table-col-sorted-bg;
	}
}

// differentiate the th from the td with these functional classes
//scss-lint:disable QualifyingElement
// Column Striping.
// Row striping: You'd think tr:nth-child(even) would be enough. You'd be wrong - that does not account for sub rows.
@if ($wc-ui-color-table-zebra-bg != -1) {
	.wc_table_stripe {
		background-color: $wc-ui-color-table-zebra-bg;
	}
}

@if ($wc-ui-color-table-invite-bg != -1) {
	tr.wc-invite {
		&:hover,
		&:focus {
			background-color: $wc-ui-color-table-invite-bg;
		}
	}
}

@include respond-phonelike {
	.wc-table.wc-respond {
		tr[aria-selected='true'] {
			&,
			&.wc-invite:hover,
			&.wc-invite:focus {
				background-color: $wc-ui-color-selected-bg;
			}

			> th,
			> td {
				// WARNING: you _may_ want to add overrides for coloured elements eg, headings.
				&,
				a,
				a:visited,
				.wc-linkbutton {
					color: $wc-ui-color-selected-fg;
				}
			}
		}
	}
}
