﻿.fluent-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	background: var(--bs-body-bg);
	border: 1px solid var(--bs-border-color);
	border-radius: 0.5rem;
	font-size: 0.875rem;
}

	.fluent-table th {
		text-align: left;
		padding: 0.75rem;
		font-weight: 600;
		color: var(--bs-white);
		background: var(--bs-primary);
		border-bottom: 1px solid var(--bs-border-color);
	}

	.fluent-table td {
		padding: 0.75rem;
		color: var(--bs-body-color);
		border-bottom: 1px solid var(--bs-border-color);
	}

	.fluent-table tr:last-child td {
		border-bottom: none;
	}

	.fluent-table tbody tr:hover {
		background: var(--bs-secondary-bg);
	}

	.fluent-table thead tr th:first-child {
		border-top-left-radius: 0.5rem;
	}

	.fluent-table thead tr th:last-child {
		border-top-right-radius: 0.5rem;
	}

	.fluent-table th:first-child,
	.fluent-table td:first-child {
		position: sticky;
		left: 0;
		z-index: 1;
		background: var(--bs-body-bg);
		box-shadow: 2px 0 5px -2px rgba(0,0,0,.15);
	}

	.fluent-table thead th:first-child {
		z-index: 3;
		background: var(--bs-primary);
		color: var(--bs-white);
	}

	.fluent-table tbody tr:last-child {
		position: sticky;
		bottom: 0;
		z-index: 2;
		background: rgba(var(--bs-body-bg-rgb), .98);
		border-top: 1px solid var(--bs-border-color);
		box-shadow: 0 -6px 12px rgba(0,0,0,.10);
	}

		.fluent-table tbody tr:last-child td:first-child {
			z-index: 4;
			background: rgba(var(--bs-body-bg-rgb), .98);
			border-bottom-left-radius: .5rem;
		}

		.fluent-table tbody tr:last-child td:last-child {
			border-bottom-right-radius: .5rem;
		}
