/**
 * catalog-merch-detail-specs.css
 * Styling for the WYSIWYG characteristics table on the catalog product
 * DETAIL page only. Loaded page-scoped via assets.php ("products"),
 * so these rules are not part of the global bundle.
 *
 * Markup is tagged at runtime by catalog-merch-detail-specs.js:
 * .specs-table__row / __term / __value / __head / __title / __sep / __spacer
 *
 * The source table has inconsistent colspans + empty spacer cells, so we
 * drop native table layout entirely (display:block) and lay rows out with
 * flexbox — column widths become independent of the messy markup.
 */

.section-merch-detail-info .description__text .specs-table,
.section-merch-detail-info .description__text .specs-table tbody,
.section-merch-detail-info .description__text .specs-table tr,
.section-merch-detail-info .description__text .specs-table td {
	display: block;
}

.section-merch-detail-info .description__text .specs-table {
	width: 100%;
	margin: 40px 0;
	background-color: var(--colorWhite);
	border-radius: 20px;
	overflow: hidden;
	font-family: inherit;
	font-size: 18px;
	line-height: 1.5;
	color: var(--colorBlackMain);
}

.section-merch-detail-info .description__text .specs-table td p {
	margin: 0;
}

/* empty spacer cells and fully-empty separator rows collapse away */
.section-merch-detail-info .description__text .specs-table .specs-table__spacer,
.section-merch-detail-info .description__text .specs-table .specs-table__sep {
	display: none;
}

/* data row: label left, value right */
.section-merch-detail-info .description__text .specs-table .specs-table__row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 24px;
	padding: 14px 25px;
	border-top: 1px solid rgba(22, 22, 22, 0.08);
}

.section-merch-detail-info .description__text .specs-table .specs-table__row .specs-table__term {
	flex: 1 1 auto;
	color: var(--colorBlackThird);
}

.section-merch-detail-info .description__text .specs-table .specs-table__row .specs-table__value {
	flex: 0 1 55%;
	font-weight: 600;
	text-align: right;
	color: var(--colorBlackSecondary);
	overflow-wrap: break-word;
}

/* section headers + table title */
.section-merch-detail-info .description__text .specs-table .specs-table__head .specs-table__head-cell {
	padding: 26px 25px 12px;
	font-weight: 700;
	font-size: 20px;
	color: var(--colorBlackMain);
}

.section-merch-detail-info .description__text .specs-table .specs-table__title .specs-table__head-cell {
	padding-top: 22px;
	font-size: 24px;
}

/* --- SPECS TABLE · MOBILE (label / value blocks) --- */
@media (max-width: 767px) {

	.section-merch-detail-info .description__text .specs-table {
		margin: 25px 0;
	}

	.section-merch-detail-info .description__text .specs-table .specs-table__row {
		display: block;
		padding: 14px 18px;
	}

	.section-merch-detail-info .description__text .specs-table .specs-table__row .specs-table__term {
		font-size: 14px;
		color: var(--colorGrayDark);
	}

	.section-merch-detail-info .description__text .specs-table .specs-table__row .specs-table__value {
		margin-top: 3px;
		font-size: 16px;
		text-align: left;
	}

	.section-merch-detail-info .description__text .specs-table .specs-table__head .specs-table__head-cell {
		padding: 22px 18px 10px;
		font-size: 18px;
	}

	.section-merch-detail-info .description__text .specs-table .specs-table__title .specs-table__head-cell {
		font-size: 20px;
	}
}
