/**
 * Lomito Inversionista - Calculadora del primer millon.
 * Solo variables del tema. El verde y el rojo fuertes se redefinen por modo
 * para no bajar de 4.5:1 en texto chico.
 */
.lmt-mmpage {
	--lmt-mm-strong: var(--lmt-emerald-700);
	--lmt-mm-down: #b91c1c;
	--lmt-mm-pes: #b45309;
}

html[data-lomito-theme="dark"] .lmt-mmpage {
	--lmt-mm-strong: var(--lmt-accent);
	--lmt-mm-down: var(--lmt-down);
	--lmt-mm-pes: #fbbf24;
}

.lmt-mm-cuerpo {
	padding-top: clamp(28px, 5vw, 48px);
	padding-bottom: clamp(40px, 7vw, 72px);
}

/* Paneles */
.lmt-mm-panel {
	margin-bottom: 16px;
	padding: clamp(18px, 3.5vw, 28px);
	border: 1px solid var(--lmt-border);
	border-radius: var(--lmt-radius-lg);
	background: var(--lmt-surface);
	box-shadow: var(--lmt-shadow);
}

.lmt-mm-h2 {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 14px;
	font-family: var(--lmt-font-display);
	font-size: clamp(1.05rem, 2.2vw, 1.25rem);
	font-weight: 800;
	line-height: 1.25;
	color: var(--lmt-text);
}

.lmt-mm-h3 {
	margin: 0 0 10px;
	font-size: 1rem;
	font-weight: 800;
	color: var(--lmt-text);
}

.lmt-mm-paso {
	flex: none;
	display: inline-grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--lmt-mm-strong);
	font-size: 0.85rem;
	font-weight: 800;
	color: var(--lmt-surface);
}

.lmt-mm-campos {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px clamp(14px, 3vw, 24px);
}

@media (max-width: 600px) {
	.lmt-mm-campos { grid-template-columns: 1fr; }
}

.lmt-mm-campo { min-width: 0; }

.lmt-mm-label {
	display: block;
	margin-bottom: 8px;
	font-size: 0.78rem;
	font-weight: 800;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--lmt-text-muted);
}

.lmt-mm-caja {
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 0 12px;
	border: 1px solid var(--lmt-border);
	border-radius: var(--lmt-radius);
	background: var(--lmt-surface-2);
}

.lmt-mm-caja:focus-within { border-color: var(--lmt-accent); }

.lmt-mm-caja--chica { width: 96px; flex: none; }

.lmt-mm-unidad { flex: none; font-weight: 700; color: var(--lmt-text-muted); }

.lmt-mm-num {
	width: 100%;
	min-width: 0;
	padding: 11px 0;
	border: 0;
	background: transparent;
	font-family: inherit;
	font-size: 1.05rem;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
	color: var(--lmt-text);
	-moz-appearance: textfield;
}

.lmt-mm-num::-webkit-outer-spin-button,
.lmt-mm-num::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.lmt-mm-num:focus { outline: none; }

.lmt-mm-ayuda {
	display: block;
	margin-top: 6px;
	font-size: 0.78rem;
	color: var(--lmt-text-muted);
}

.lmt-mm-nota {
	margin: 10px 0 0;
	font-size: 0.85rem;
	line-height: 1.55;
	color: var(--lmt-text-muted);
}

.lmt-mm-nota a, .lmt-mm-bloque a { color: var(--lmt-mm-strong); }

/* Perfiles y modos */
.lmt-mm-perfiles, .lmt-mm-modos {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
}

.lmt-mm-modos { grid-template-columns: repeat(2, 1fr); }

.lmt-mm-perfil, .lmt-mm-modo {
	padding: 11px 10px;
	border: 1px solid var(--lmt-border);
	border-radius: var(--lmt-radius);
	background: var(--lmt-surface);
	font-family: inherit;
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--lmt-text-muted);
	cursor: pointer;
}

.lmt-mm-perfil.is-activo, .lmt-mm-modo.is-activo {
	border-color: var(--lmt-accent);
	background: var(--lmt-accent-soft);
	color: var(--lmt-mm-strong);
}

/* Activos */
.lmt-mm-activos { display: grid; gap: 12px; margin-top: 16px; }

.lmt-mm-activo__cab {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 8px;
}

.lmt-mm-activo__nombre { display: block; font-weight: 700; color: var(--lmt-text); }

.lmt-mm-activo__clave {
	display: inline-block;
	margin-top: 2px;
	font-size: 0.78rem;
	font-weight: 800;
	letter-spacing: .04em;
	color: var(--lmt-text-muted);
}

.lmt-mm-range {
	width: 100%;
	height: 4px;
	margin: 0;
	border-radius: 999px;
	background: var(--lmt-border);
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
}

.lmt-mm-range::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 18px;
	height: 18px;
	border: 3px solid var(--lmt-surface);
	border-radius: 50%;
	background: var(--lmt-accent);
}

.lmt-mm-range::-moz-range-thumb {
	width: 18px;
	height: 18px;
	border: 3px solid var(--lmt-surface);
	border-radius: 50%;
	background: var(--lmt-accent);
}

.lmt-mm-suma {
	margin: 14px 0 0;
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--lmt-mm-strong);
}

.lmt-mm-suma.is-error { color: var(--lmt-mm-down); }

/* Resultado */
.lmt-mm-resultado {
	margin: 24px 0 16px;
	padding: clamp(22px, 4vw, 36px);
	border: 1px solid var(--lmt-border);
	border-radius: var(--lmt-radius-lg);
	background: var(--lmt-surface);
	box-shadow: var(--lmt-shadow-lg);
}

.lmt-mm-resultado__k {
	margin: 0;
	text-align: center;
	font-size: 0.85rem;
	font-weight: 800;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--lmt-text-muted);
}

.lmt-mm-resultado__v {
	margin: 4px 0 0;
	text-align: center;
	font-family: var(--lmt-font-display);
	font-size: clamp(2.2rem, 7vw, 3.6rem);
	font-weight: 800;
	line-height: 1.05;
	color: var(--lmt-text);
}

.lmt-mm-resultado__sub {
	margin: 12px auto 0;
	max-width: 58ch;
	text-align: center;
	line-height: 1.55;
	color: var(--lmt-text-muted);
}

.lmt-mm-esc {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	margin-top: 22px;
}

@media (max-width: 560px) {
	.lmt-mm-esc { grid-template-columns: 1fr; }
}

.lmt-mm-esc__i {
	padding: 12px;
	border-radius: var(--lmt-radius);
	background: var(--lmt-surface-2);
	border-top: 3px solid var(--lmt-border);
	text-align: center;
}

.lmt-mm-esc__i--optimista { border-top-color: var(--lmt-accent); }
.lmt-mm-esc__i--base { border-top-color: var(--lmt-text); }
.lmt-mm-esc__i--pesimista { border-top-color: var(--lmt-mm-pes); }

.lmt-mm-esc__k {
	display: block;
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--lmt-text-muted);
}

.lmt-mm-esc__i strong {
	display: block;
	margin-top: 4px;
	font-size: 1.25rem;
	font-weight: 800;
	color: var(--lmt-text);
}

.lmt-mm-esc__s { display: block; margin-top: 2px; font-size: 0.8rem; color: var(--lmt-text-muted); }

/* Grafica */
.lmt-mm-grafica { margin-top: 22px; }

.lmt-mm-svg { display: block; width: 100%; height: 260px; overflow: visible; }

.lmt-mm-svg path { fill: none; stroke-width: 2.5; vector-effect: non-scaling-stroke; }
.lmt-mm-svg__opt { stroke: var(--lmt-accent); }
.lmt-mm-svg__base { stroke: var(--lmt-text); stroke-width: 3 !important; }
.lmt-mm-svg__pes { stroke: var(--lmt-mm-pes); }
.lmt-mm-svg__ap { stroke: var(--lmt-text-muted); stroke-dasharray: 5 5; }
.lmt-mm-svg__meta { stroke: var(--lmt-border); stroke-width: 1.5; stroke-dasharray: 2 4; vector-effect: non-scaling-stroke; }
.lmt-mm-svg__ejes text { font-size: 11px; fill: var(--lmt-text-muted); }

.lmt-mm-leyenda {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
	justify-content: center;
	margin: 10px 0 0;
	font-size: 0.8rem;
	color: var(--lmt-text-muted);
}

.lmt-mm-leyenda__i::before {
	content: "";
	display: inline-block;
	width: 14px;
	height: 3px;
	margin-right: 6px;
	vertical-align: middle;
	background: var(--lmt-text-muted);
}

.lmt-mm-leyenda__i--opt::before { background: var(--lmt-accent); }
.lmt-mm-leyenda__i--base::before { background: var(--lmt-text); }
.lmt-mm-leyenda__i--pes::before { background: var(--lmt-mm-pes); }

/* Caida, compra, venta */
.lmt-mm-caida, .lmt-mm-compra, .lmt-mm-venta {
	margin-top: 22px;
	padding-top: 18px;
	border-top: 1px solid var(--lmt-border);
}

.lmt-mm-check { display: flex; gap: 10px; align-items: center; font-weight: 700; color: var(--lmt-text); cursor: pointer; }
.lmt-mm-check input { width: 18px; height: 18px; accent-color: var(--lmt-accent); }

.lmt-mm-caida__r { margin: 8px 0 0; line-height: 1.55; color: var(--lmt-text-muted); }

.lmt-mm-tabla-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

.lmt-mm-tabla { width: 100%; min-width: 420px; border-collapse: collapse; font-size: 0.9rem; }
.lmt-mm-tabla th, .lmt-mm-tabla td { padding: 9px 8px; border-bottom: 1px solid var(--lmt-border); text-align: left; color: var(--lmt-text); }
.lmt-mm-tabla th { font-size: 0.75rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--lmt-text-muted); }
.lmt-mm-tabla td:nth-child(n+3), .lmt-mm-tabla th:nth-child(n+3) { text-align: right; font-variant-numeric: tabular-nums; }

.lmt-mm-aviso {
	margin: 12px 0 0;
	padding: 10px 12px;
	border-radius: var(--lmt-radius);
	background: rgba(220, 38, 38, 0.08);
	font-size: 0.88rem;
	line-height: 1.5;
	color: var(--lmt-mm-down);
}

.lmt-mm-aviso[hidden] { display: none; }

.lmt-mm-campo--inline { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.lmt-mm-campo--inline .lmt-mm-label { margin: 0; }

.lmt-mm-select {
	padding: 8px 12px;
	border: 1px solid var(--lmt-border);
	border-radius: var(--lmt-radius);
	background: var(--lmt-surface-2);
	font-family: inherit;
	font-weight: 700;
	color: var(--lmt-text);
}

.lmt-mm-legal {
	margin: 22px auto 0;
	max-width: 64ch;
	text-align: center;
	font-size: 0.82rem;
	line-height: 1.55;
	color: var(--lmt-text-muted);
}

/* Excel */
.lmt-mm-excel {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin: 24px 0 16px;
	padding: clamp(20px, 4vw, 30px);
	border: 1px solid var(--lmt-accent);
	border-radius: var(--lmt-radius-lg);
	background: var(--lmt-accent-soft);
}

.lmt-mm-excel > div { flex: 1 1 320px; }

.lmt-mm-excel__k { margin: 0 0 6px; font-size: 0.75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--lmt-mm-strong); }
.lmt-mm-excel__t { margin: 0 0 8px; font-family: var(--lmt-font-display); font-size: clamp(1.2rem, 3vw, 1.5rem); font-weight: 800; color: var(--lmt-text); }
.lmt-mm-excel__p { margin: 0; line-height: 1.6; color: var(--lmt-text-muted); }

/* Explicacion */
.lmt-mm-info { margin-top: 28px; }

.lmt-mm-bloque { margin-bottom: 26px; line-height: 1.65; color: var(--lmt-text-muted); }
.lmt-mm-bloque p { margin: 12px 0; }
.lmt-mm-bloque strong { color: var(--lmt-text); }

.lmt-mm-lista { margin: 0 0 12px; padding-left: 1.2em; }
.lmt-mm-lista li { margin-bottom: 8px; }

.lmt-mm-legal2 {
	padding: 18px 20px;
	border-radius: var(--lmt-radius);
	background: var(--lmt-surface-2);
	font-size: 0.9rem;
}
