/* ==========================================================================
   Health tools and calculators
   ========================================================================== */

.hp-calc {
	border: var(--hp-rule);
	border-radius: var(--hp-radius-md);
	background-color: var(--hp-color-surface);
	overflow: hidden;
	margin-block: var(--hp-space-md);
}
.hp-calc__head { padding: var(--hp-space-sm) var(--hp-space-md); background-color: var(--hp-color-canvas); border-bottom: var(--hp-rule); }
.hp-calc__title { font-size: var(--hp-text-md); margin: 0; }
.hp-calc__body { padding: var(--hp-space-md); }
.hp-calc__units { display: flex; gap: var(--hp-space-2xs); margin-bottom: var(--hp-space-md); }
.hp-calc__unit {
	flex: 1 1 0;
	min-height: 44px;
	border: 1px solid var(--hp-color-border-strong);
	border-radius: var(--hp-radius-md);
	font-size: var(--hp-text-sm);
	font-weight: 650;
	color: var(--hp-color-text-muted);
	background-color: var(--hp-color-surface);
}
.hp-calc__unit[aria-pressed="true"] { background-color: var(--hp-color-primary); border-color: var(--hp-color-primary); color: #fff; }
.hp-calc__fields { display: grid; gap: var(--hp-space-sm); }
@media (min-width: 640px) { .hp-calc__fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.hp-calc__actions { display: flex; flex-wrap: wrap; gap: var(--hp-space-2xs); margin-top: var(--hp-space-md); }
.hp-calc__result {
	margin-top: var(--hp-space-md);
	padding: var(--hp-space-md);
	background-color: var(--hp-color-primary-soft);
	border-radius: var(--hp-radius-md);
}
.hp-calc__result[hidden] { display: none; }
.hp-calc__value { font-family: var(--hp-font-display); font-size: var(--hp-text-3xl); line-height: 1; color: var(--hp-color-primary-dark); }
.hp-calc__value small { font-family: var(--hp-font-body); font-size: var(--hp-text-sm); font-weight: 650; }
.hp-calc__readout { display: grid; gap: var(--hp-space-2xs); margin-top: var(--hp-space-sm); }
.hp-calc__row { display: flex; justify-content: space-between; gap: var(--hp-space-sm); padding-block: var(--hp-space-3xs); border-bottom: var(--hp-rule); font-size: var(--hp-text-sm); }
.hp-calc__row span:last-child { font-weight: 700; font-variant-numeric: tabular-nums; }
.hp-calc__scale { display: flex; margin-top: var(--hp-space-sm); border-radius: var(--hp-radius-sm); overflow: hidden; height: 10px; }
.hp-calc__scale span { flex: 1 1 0; }
.hp-calc__legend { display: flex; justify-content: space-between; font-size: var(--hp-text-3xs); color: var(--hp-color-text-muted); margin-top: 4px; }
.hp-calc__foot { padding: var(--hp-space-sm) var(--hp-space-md); border-top: var(--hp-rule); font-size: var(--hp-text-xs); color: var(--hp-color-text-muted); }

.hp-tool-meta { display: grid; gap: var(--hp-space-lg); }
@media (min-width: 1024px) { .hp-tool-meta { grid-template-columns: minmax(0, 1fr) 320px; gap: var(--hp-space-2xl); } }