/*
 * Machine Specifications — visual styling to match the design.
 *
 * Markup comes from [machine_specs] (includes/shortcodes.php); the logic and
 * data structure are untouched. Colours/fonts reuse the child-theme variables
 * (--color-custom-1 = dark navy, --color-custom-3 = light blue) and the Blanc /
 * Open Sans families already loaded by the theme, so this tracks the rest of
 * the site. Tunables are exposed as custom properties for the builder.
 */

.bsc-specs {
	--bsc-specs-row-odd:  #f8f8f8;
	--bsc-specs-row-even: #ecf8fe;
	--bsc-specs-radius:   10px;
	--bsc-specs-gap:      0.5rem;    /* vertical gap between rows */
	--bsc-specs-pad-x:    2rem;
	--bsc-specs-pad-y:    1.15rem;
	--bsc-specs-label-w:  38%;
}

/* ---- Header: model line ("ST STANDARD TIPPER") ---- */
.bsc-specs__head {
	text-align: center;
	margin-bottom: 2.5rem;
}
.bsc-specs__model {
	display: block;
	line-height: 1.2;
	text-transform: uppercase;
	font-size: var(--h2-font-size, 1.75rem);
}
/* Two-tone model line: code = bold navy, name = medium light-blue (matches the
   site's [machine_card_title] treatment). */
.bsc-specs__model-code {
	font-family: 'Blanc-Bold', sans-serif;
	color: var(--color-custom-1);
}
.bsc-specs__model-name {
	font-family: 'Blanc-Medium', sans-serif;
	color: var(--color-custom-3);
}

/* ---- Table: full-width rows, soft rounded "pills", alternating colours ---- */
.bsc-specs__table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0 var(--bsc-specs-gap);
	table-layout: fixed;
}
.bsc-specs__row > * {
	padding: var(--bsc-specs-pad-y) var(--bsc-specs-pad-x);
	vertical-align: middle;
	text-align: left;
	border: 0;
}
.bsc-specs__row:nth-child(odd) > *  { background: var(--bsc-specs-row-odd); }
.bsc-specs__row:nth-child(even) > * { background: var(--bsc-specs-row-even); }

/* Round the outer corners so each row reads as one rounded bar. */
.bsc-specs__label {
	width: var(--bsc-specs-label-w);
	border-top-left-radius: var(--bsc-specs-radius);
	border-bottom-left-radius: var(--bsc-specs-radius);
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;                /* Semibold */
	font-size: 22px;
	color: var(--color-custom-1);
}
.bsc-specs__label::after {
	content: ":";                    /* design shows a trailing colon */
}
.bsc-specs__value {
	border-top-right-radius: var(--bsc-specs-radius);
	border-bottom-right-radius: var(--bsc-specs-radius);
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;                /* Regular */
	font-size: 23px;
	color: var(--color-custom-1);
}

/* ---- Mobile: tighter padding, label takes a little more width ---- */
@media (max-width: 600px) {
	.bsc-specs {
		--bsc-specs-pad-x: 1.1rem;
		--bsc-specs-label-w: 44%;
	}
	.bsc-specs__label { font-size: 1rem; }
	.bsc-specs__value { font-size: 1rem; }
}