@import "./variables";

th.cell-spin {
	text-align: right;
}
td.cell-spin {
	width: 2.5em;
	text-align: right;
}

th.cell-check,
th.cell-radio {
	text-align: center;
}

td.cell-button {
	max-width: 20px;
	text-align: center;

	& > button,
	& > a {
		@extend %clickable;
		display: block;
		height: 44px;
		width: 44px;
		margin: 0 auto;
		border-radius: 50%;
		padding: 10px;
		border: none;
		background-color: transparent;
		box-sizing: border-box;

		& > .htk-icon {
			display: block;
		}
		&:hover {
			background-color: rgba(1, 1, 1, 0.1);
		}
	}
	img {
		height: 1.5em;
		width: 1.5em;
		display: block;
		margin: auto;
		padding: 0;
	}
}

td.cell-image {
	text-align: center;
	
	.htk-image {
		max-width: 2.5em;
		max-height: 2.5em;
		display: block;
		margin: auto;
	}
}