@import "variables";

.badge {
	float:            right;
	font-size:        12px;
	border-radius:    2px;
	width:            20px;
	height:           20px;
	line-height:      20px;
	text-align:       center;
	display:          inline-block;
	color:            darken(@mainBorderColor, 25%);
	background-color: lighten(@mainBorderColor, 5%);
}

.header {
	margin-top:     0;
	font-size:      13px;
	font-weight:    normal;
	text-transform: uppercase;
	color:          darken(@mainBorderColor, 30%);
}

.code {
	//white-space: nowrap;
	display:     inline-block;
	font-family: Hack, Menlo, monospace;
	font-size:   11px;

	&:not(:last-child) {
		margin-right: 3px;
		&:after {
			content: ','
		}
	}
}

.codePart {
	composes:         code;
	float:            left;
	margin-right:     3px;
	margin-bottom:    3px;
	padding:          2px 5px;
	border-radius:    3px;
	border:           1px solid @mainBorderColor;
	background-color: lighten(@mainBorderColor, 5%);
}

.table {
	table {
		width: 100%;

		& > thead > tr > th,
		& > tbody > tr > td {
			padding: @mainPadding;
		}

		& > thead > tr > th {
			text-align:    left;
			font-weight:   700;
			font-size:     14px;
			border-bottom: 2px solid @mainBorderColor;
		}

		& > thead + tbody > tr.is-required > td {
			background-color: lighten(@mainBorderColor, 5%);
		}
		& > thead + tbody > tr > td {
			font-size: 13px;
		}

		&.iso-table--bordered > thead + tbody > tr > td {
			border-bottom: 1px solid @mainBorderColor;
		}
	}
}