@import "../helpers/boxed";

// Text sizes are in em of the wrapper (1rem by default, same as before) so the
// block's font size setting scales them together.
.wp-block-affreviews-info-spec-list {
	@include affr-boxed-style;
	font-size: 1rem;

	.affr-title-sm {
		display: block;
		font-size: 0.8em;
		font-weight: 700;
		text-transform: uppercase;
		margin-bottom: 0.8rem;
	}

	.affr-infolist {
		ul {
			list-style: none;
			margin: 0;
			padding: 0;
		}

		li {
			display: flex;
			justify-content: space-between;
			padding: 5px 15px;
			align-content: center;
			align-items: flex-start;

			&:nth-child(odd) {
				background: rgba(0, 0, 0, 0.02);
			}
		}

		.affr-infolist__title {
			text-transform: uppercase;
			font-size: 0.8em;
			padding-right: 15px;
			width: 40%;
			padding-top: 2px;
			color: var(--affr-text-color, #000);
		}

		.affr-infolist__value {
			flex: 1 0 0;
			font-size: 1em;
			color: var(--affr-text-color, #000);
		}
	}
}