/* Calculadoras MX — estilo sobrio que hereda la tipografía del tema */
.cmx-calc {
	--cmx-border: #d9dce1;
	--cmx-muted: #5f6670;
	--cmx-accent: #1f4e79;
	--cmx-bg: #fff;
	--cmx-soft: #f5f6f8;
	max-width: 720px;
	margin: 0 0 2rem;
	font-size: 1rem;
	line-height: 1.5;
}
.cmx-title { margin: 0 0 .25rem; }
.cmx-year { margin: 0 0 1.25rem; color: var(--cmx-muted); font-size: .875rem; }

.cmx-form {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1rem;
	padding: 1.25rem;
	border: 1px solid var(--cmx-border);
	border-radius: 6px;
	background: var(--cmx-bg);
}
.cmx-field { display: flex; flex-direction: column; gap: .35rem; margin: 0; }
.cmx-field span { font-size: .875rem; font-weight: 600; }
.cmx-field input,
.cmx-field select {
	width: 100%;
	box-sizing: border-box;
	padding: .55rem .65rem;
	border: 1px solid var(--cmx-border);
	border-radius: 4px;
	font: inherit;
	background: #fff;
	color: inherit;
}
.cmx-field input:focus,
.cmx-field select:focus { outline: 2px solid var(--cmx-accent); outline-offset: 1px; border-color: var(--cmx-accent); }
.cmx-check { grid-column: 1 / -1; display: flex; align-items: center; gap: .5rem; font-size: .9rem; }
.cmx-btn {
	grid-column: 1 / -1;
	justify-self: start;
	padding: .65rem 1.75rem;
	border: 0;
	border-radius: 4px;
	background: var(--cmx-accent);
	color: #fff;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}
.cmx-btn:hover { filter: brightness(1.1); }

.cmx-result { margin-top: 1.25rem; padding: 1.25rem; border-radius: 6px; background: var(--cmx-soft); }
.cmx-big { margin: 0 0 1rem; font-size: 1.75rem; font-weight: 700; }
.cmx-big small { display: block; font-size: .875rem; font-weight: 400; color: var(--cmx-muted); }
.cmx-error { color: #a12622; margin: 0; }

.cmx-table { width: 100%; border-collapse: collapse; margin: 0 0 1rem; font-size: .95rem; }
.cmx-table th,
.cmx-table td { padding: .5rem .25rem; border-bottom: 1px solid var(--cmx-border); text-align: left; font-weight: 400; }
.cmx-table td { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.cmx-table thead th { font-weight: 600; }
.cmx-info .cmx-table td { text-align: left; }
.cmx-total th,
.cmx-total td { font-weight: 700; border-bottom: 0; }

.cmx-note { margin: .75rem 0 0; font-size: .8rem; color: var(--cmx-muted); }
.cmx-info { margin-top: 2rem; }
.cmx-faq { border-bottom: 1px solid var(--cmx-border); padding: .6rem 0; }
.cmx-faq summary { cursor: pointer; font-weight: 600; }
.cmx-faq p { margin: .5rem 0 0; }

.cmx-tablist { display: flex; flex-wrap: wrap; gap: .25rem; border-bottom: 1px solid #d9dce1; margin-bottom: 1.5rem; }
.cmx-tab {
	padding: .6rem 1rem;
	border: 0;
	border-bottom: 2px solid transparent;
	background: none;
	font: inherit;
	color: inherit;
	cursor: pointer;
	margin-bottom: -1px;
}
.cmx-tab[aria-selected="true"] { border-bottom-color: #1f4e79; font-weight: 600; }