/*
    Table
*/
table {
	--table-text-color: inherit;
	--table-bg-color: transparent;
	--table-border-color: var(--border-color);

	--table-striped-text-color: inherit;
	--table-striped-bg-color: rgba(var(--color-white-rgb), 0.05);

	--table-padding-x: 1rem;
	--table-padding-y: 0.6rem;

	caption-side: bottom;
	border-collapse: collapse;
	width: 100%;
	margin-bottom: 1rem;
	vertical-align: top;
	border-color: var(--table-border-color);
}

th {
	text-align: inherit;
	text-align: -webkit-match-parent;
}

thead,
tbody,
tfoot,
tr,
td,
th {
	border-color: inherit;
	border-style: solid;
	border-width: 0;
}

table > :not(caption) > * > * {
	padding: var(--table-padding-y) var(--table-padding-x);
	color: var(--table-text-color);
	background-color: var(--table-bg-color);
	border-bottom-width: var(--border-width);
}

table > tbody {
	vertical-align: inherit;
}

table > thead {
	vertical-align: bottom;
}

.table-divider {
	border-top: calc(var(--border-width) * 2) solid currentcolor;
}

.caption-top {
	caption-side: top;
}

.table-bordered > :not(caption) > * {
	border-width: var(--border-width) 0;
}

.table-bordered > :not(caption) > * > * {
	border-width: 0 var(--border-width);
}

/*
    Striped Tables
*/
.table-striped > tbody > tr:nth-of-type(odd) > * {
	color: var(--table-striped-text-color);
	background-color: var(--striped-table-bg-color);
}

.table-striped-columns > :not(caption) > tr > :nth-child(even) {
	color: var(--table-striped-text-color);
	background-color: var(--table-striped-bg-color);
}

/*
    Responsive Tables
*/
.table-responsive {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

@media (max-width: 576px) {
	.sm\:table-responsive {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

@media (max-width: 768px) {
	.md\:table-responsive {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

@media (max-width: 1024px) {
	.lg\:table-responsive {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

@media (max-width: 1280px) {
	.xl\:table-responsive {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

@media (max-width: 1540px) {
	.xxl\:table-responsive {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

/* 
    Table Colours 
*/
.table-black {
	--table-text-color: var(--color-black-contrast);
	--table-bg-color: var(--color-black);
	--table-border-color: var(--color-black-alt);
	--table-striped-text-color: var(--color-black-contrast);
	--table-striped-bg-color: rgba(var(--color-black-rgb), 0.9);
}

.table-white {
	--table-text-color: var(--color-white-contrast);
	--table-bg-color: var(--color-white);
	--table-border-color: var(--color-white-alt);
	--table-striped-text-color: var(--color-white-contrast);
	--table-striped-bg-color: rgba(var(--color-white-rgb), 0.9);
}

.table-primary {
	--table-text-color: var(--color-primary-contrast);
	--table-bg-color: var(--color-primary);
	--table-border-color: var(--color-primary-alt);
	--table-striped-text-color: var(--color-primary-contrast);
	--table-striped-bg-color: rgba(var(--color-primary-rgb), 0.9);
}

.table-secondary {
	--table-text-color: var(--color-secondary-contrast);
	--table-bg-color: var(--color-secondary);
	--table-border-color: var(--color-secondary-alt);
	--table-striped-text-color: var(--color-secondary-contrast);
	--table-striped-bg-color: rgba(var(--color-secondary-rgb), 0.9);
}

.table-tertiary {
	--table-text-color: var(--color-tertiary-contrast);
	--table-bg-color: var(--color-tertiary);
	--table-border-color: var(--color-tertiary-alt);
	--table-striped-text-color: var(--color-tertiary-contrast);
	--table-striped-bg-color: rgba(var(--color-tertiary-rgb), 0.9);
}

.nutritional-table {
	--table-text-color: var(--color-white-contrast);
	--table-bg-color: var(--color-white);
	--table-border-color: transparent;
	--table-striped-text-color: var(--color-white-contrast);
	--table-striped-bg-color: rgba(var(--color-white-rgb), 0.9);
	margin-bottom: 0 !important;
}
