@use '../../../base/mixins/typography' as font;
@use '../../../components/molecules/tables' as *;

.table {
	&-basic {
		&-wrapper {
			border: none;
			border-radius: 0;
		}

		tr:nth-child(even) {
			background-color: var(--neutral-2);
		}

		&-col-header {
			background-color: var(--default);
		}

		&-row-header {
			background-color: var(--default);
		}
	}

	&-multi-dimensional {
		tr:nth-child(even) {
			background-color: var(--neutral-2);
		}

		&-col-header {
			background-color: var(--default);
		}

		&-row-header {
			background-color: var(--default);
		}
	}
}

.brandui-table {
	.table-wrapper {
		table {
			@include font.get-typography(body-small);

			caption {
				@include font.get-typography(subhead);
			}

			thead,
			tfoot {
				@include font.get-typography(body-small-medium);
			}
		}
	}
}