@use "@automattic/jetpack-base-styles/style";

.container {
	// We have to allow x overflow since table components aren't inherently
	// responsive but we still want to have some support for smaller screens.
	overflow-x: auto;
}

.table {
	margin: var(--jp-modal-padding) 0 0;
	background: var(--jp-white);
	width: 100%;

	tr th:first-child {
		padding: 5px 0;
	}

	tr td:first-child {
		padding: 5px 0 5px;
	}
}

.header-row {
	padding: 5px 10px;
	color: var(--jp-gray-60);
	border-bottom: 1px solid #eee;
}
