/* Estilos propios de la Calculadora aislada (lo que Tailwind no cubre) */
body { font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif; }

/* Sliders con agarre grande — idéntico a panel-rdo.html (T-42).
   Los colores salen de los tokens de app.css (var(--rc-*)). */
.calc-slider { -webkit-appearance: none; appearance: none; width: 100%;
  height: 8px; border-radius: 999px; background: var(--rc-line); outline: none; }
.calc-slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none;
  width: 22px; height: 22px; border-radius: 50%; background: var(--rc-brand);
  border: 3px solid #fff; box-shadow: 0 1px 3px rgba(28,25,23,.35); cursor: pointer; }
.calc-slider::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%;
  background: var(--rc-brand); border: 3px solid #fff; box-shadow: 0 1px 3px rgba(28,25,23,.35); cursor: pointer; }
.calc-slider::-moz-range-track { height: 8px; border-radius: 999px; background: var(--rc-line); }
.calc-slider:focus-visible { box-shadow: 0 0 0 3px rgba(4,120,87,.28); }

/* Chip de sesión (inline para no depender del purge de Tailwind) */
.chip { font-size: 0.75rem; padding: 4px 12px; border-radius: 999px; font-weight: 600;
  background: var(--rc-brand-tint); color: var(--rc-brand); border: 1px solid var(--rc-brand-line); }
.chip.off { background: var(--rc-warn-tint); color: var(--rc-warn); border-color: var(--rc-warn-line); }

/* Botón de redondeo activo */
.calcRedondeoBtn { transition: background .15s ease, color .15s ease; }
.calcRedondeoBtn:hover { background: var(--rc-canvas); }
.calcRedondeoBtn.active { background: var(--rc-brand); color: #fff; }
.calcRedondeoBtn.active:hover { background: var(--rc-brand-hover); }

/* Alerta: el precio de compra (recibido) supera al P. Lista Nuevo → publicarías bajo
   costo. El slider "Precio venta" se pinta rojo para que el usuario lo suba. */
.calc-slider.slider-alerta { background: #fecaca; }
.calc-slider.slider-alerta::-webkit-slider-thumb { background: #dc2626; }
.calc-slider.slider-alerta::-moz-range-thumb { background: #dc2626; }
.calc-slider.slider-alerta::-moz-range-track { background: #fecaca; }