/* Calculators on the range page (S:810-1016): the section shell and the form controls. The cards' layout is the block's
   own stylesheet (blocks/roi-calculator/style.css). Text is at least 12px (§4); the prototype's 10.5-11px labels are raised. */
.wp-block-salvagente-roi-calculator { padding: 96px var(--pg) 0; }
.wp-block-salvagente-roi-calculator.is-household { padding-bottom: 90px; }   /* S:1017 */
.wp-block-salvagente-roi-calculator p, .wp-block-salvagente-roi-calculator h2, .wp-block-salvagente-roi-calculator h3 { margin: 0; }

/* Number fields (S:827): mono 16px. The border is grey-aa so the field edge meets 3:1 on the glass (WCAG 1.4.11). */
.sv-calc-field label { display: block; font-size: 13px; line-height: 1.45; color: var(--wp--preset--color--ink-700); }
.sv-calc-input {
	box-sizing: border-box;
	width: 100%;
	min-height: 48px;
	margin-top: 7px;
	padding: 13px 15px;
	border: 1px solid var(--wp--preset--color--grey-aa);
	border-radius: 12px;
	background: rgba(255, 255, 255, .62);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 16px;
	color: var(--wp--preset--color--ink-900);
}

/* Range on light (S:66-76): a 3px track and a white thumb ringed in cyan; 44px tall so the target meets §4. */
.sv-calc-range { width: 100%; height: 44px; margin: 0; background: transparent; -webkit-appearance: none; appearance: none; cursor: pointer; }
.sv-calc-range::-webkit-slider-runnable-track { height: 3px; border-radius: 2px; background: rgba(12, 26, 42, .32); }
.sv-calc-range::-moz-range-track { height: 3px; background: rgba(12, 26, 42, .32); }
.sv-calc-range::-webkit-slider-thumb { -webkit-appearance: none; width: 18px; height: 18px; margin-top: -7.5px; border: 3px solid #4DC5D5; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px rgba(12, 26, 42, .45); }
.sv-calc-range::-moz-range-thumb { width: 14px; height: 14px; border: 2px solid #4DC5D5; border-radius: 50%; background: #fff; }

/* The no-JS submit; view.js hides it. */
.sv-calc-submit { margin-top: 24px; text-align: center; }
.sv-calc-go {
	min-height: 48px;
	padding: 14px 34px;
	border: 0;
	border-radius: 999px;
	background: var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--body);
	font-size: 12px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #0c0d0e;
	cursor: pointer;
}