/* ==========================================================================
   Anchos de campos según el dato que contienen.
   Una fecha (10 caracteres), un teléfono, un CUIT o un precio no necesitan
   ocupar todo el ancho de la tarjeta. Los límites son `max-width`: en pantallas
   angostas el campo sigue ocupando el ancho disponible. Para dejar un campo a
   ancho completo agregar la clase `fld-full`.
   ========================================================================== */

/* Fechas y horas: dd/mm/aaaa + ícono del selector */
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"] { max-width: 11rem; }
input[type="datetime-local"] { max-width: 14rem; }

/* Teléfonos: hasta 20 caracteres (+54 9 11 5555-5555) */
input[type="tel"],
input[name*="telefono" i],
input[name*="celular" i],
input[name*="whatsapp" i],
input[name*="phone" i] { max-width: 15rem; }

/* Documentos: CUIT/CUIL con guiones tiene 13 caracteres; DNI, 8 */
input[name*="cuit" i],
input[name*="cuil" i],
input[name*="dni" i],
input[name*="documento" i] { max-width: 14rem; }

/* Importes */
input[name*="precio" i],
input[name*="monto" i],
input[name*="importe" i],
input[name*="costo" i],
input[name*="descuento" i],
input[name*="saldo" i],
input[name*="senia" i],
input[name*="limite" i],
input[name*="recargo" i],
input[name="iva"],
input[name$="_iva_monto"],
input[inputmode="decimal"] { max-width: 12rem; }

/* Cantidades y números en general */
input[type="number"] { max-width: 10rem; }
input[name*="cantidad" i],
input[name*="stock" i],
input[name*="minimo" i],
input[name*="cuotas" i] { max-width: 8rem; }

/* Códigos: SKU y códigos de barras (EAN-13) */
input[name$="codigo"],
input[name*="codigo_barras" i],
input[name*="sku" i] { max-width: 16rem; }

/* Código postal */
input[name*="codigo_postal" i],
input[name$="_cp"],
input[name="cp"] { max-width: 8rem; }

/* Excepción explícita */
input.fld-full,
.fld-full input { max-width: none; }


/* Email: una dirección rara vez supera ~30 caracteres. Donde el navegador lo soporta
   (`field-sizing`), el campo crece con lo que se escribe, por si se cargan varias. */
input[type="email"],
input[name*="email" i] { width: min(100%, 24rem); }
@supports (field-sizing: content) {
  input[type="email"],
  input[name*="email" i] { width: auto; min-width: min(100%, 16rem); max-width: 100%; field-sizing: content; }
}

/* Botones de acción en tablas: uno al lado del otro, sin apilarse */
td:has(> .uix-actions-inline),
td:has(> .btn-sm ~ .btn-sm),
td:has(> form ~ .btn-sm) { width: 1%; white-space: nowrap; }
@media (min-width: 821px) { .uix-actions-inline { flex-wrap: nowrap; } }

/* ==========================================================================
   Filas de formulario sin espacios muertos.
   Las filas armadas como grilla `auto-fit` estiraban cada columna aunque el campo
   fuera corto. Cuando la fila contiene un campo de ancho acotado (fecha, teléfono,
   CUIT, importe, cantidad, email), pasa a fila flexible: el campo corto conserva su
   ancho, los demás se reparten el resto de la línea y el botón de envío queda al
   final de la misma fila. Se adapta al ancho de la pantalla: en monitores grandes
   entra todo en una línea y en pantallas angostas cada campo ocupa su renglón.
   ========================================================================== */
:is(div,section,form)[style*="auto-fit"]:has(input[type="date"],input[type="time"],input[type="month"],input[type="week"],input[type="datetime-local"],input[type="tel"],input[name*="telefono" i],input[name*="celular" i],input[name*="whatsapp" i],input[name*="phone" i],input[name*="cuit" i],input[name*="cuil" i],input[name*="dni" i],input[name*="documento" i],input[name*="precio" i],input[name*="monto" i],input[name*="importe" i],input[name*="costo" i],input[name*="descuento" i],input[name*="saldo" i],input[name*="senia" i],input[name*="limite" i],input[name*="recargo" i],input[type="number"],input[inputmode="decimal"],input[name*="cantidad" i],input[name*="stock" i],input[name*="minimo" i],input[name*="cuotas" i],input[type="email"],input[name*="email" i]) { display: flex !important; flex-wrap: wrap; align-items: flex-end; }
:is(div,section,form)[style*="auto-fit"]:has(input[type="date"],input[type="time"],input[type="month"],input[type="week"],input[type="datetime-local"],input[type="tel"],input[name*="telefono" i],input[name*="celular" i],input[name*="whatsapp" i],input[name*="phone" i],input[name*="cuit" i],input[name*="cuil" i],input[name*="dni" i],input[name*="documento" i],input[name*="precio" i],input[name*="monto" i],input[name*="importe" i],input[name*="costo" i],input[name*="descuento" i],input[name*="saldo" i],input[name*="senia" i],input[name*="limite" i],input[name*="recargo" i],input[type="number"],input[inputmode="decimal"],input[name*="cantidad" i],input[name*="stock" i],input[name*="minimo" i],input[name*="cuotas" i],input[type="email"],input[name*="email" i]) > * { flex: 1 1 10rem; min-width: 0; }
:is(div,section,form)[style*="auto-fit"]:has(input[type="date"],input[type="time"],input[type="month"],input[type="week"],input[type="datetime-local"],input[type="tel"],input[name*="telefono" i],input[name*="celular" i],input[name*="whatsapp" i],input[name*="phone" i],input[name*="cuit" i],input[name*="cuil" i],input[name*="dni" i],input[name*="documento" i],input[name*="precio" i],input[name*="monto" i],input[name*="importe" i],input[name*="costo" i],input[name*="descuento" i],input[name*="saldo" i],input[name*="senia" i],input[name*="limite" i],input[name*="recargo" i],input[type="number"],input[inputmode="decimal"],input[name*="cantidad" i],input[name*="stock" i],input[name*="minimo" i],input[name*="cuotas" i],input[type="email"],input[name*="email" i]) > :has(input[type="date"],input[type="time"],input[type="month"],input[type="week"]) { flex: 0 0 10rem; }
:is(div,section,form)[style*="auto-fit"]:has(input[type="date"],input[type="time"],input[type="month"],input[type="week"],input[type="datetime-local"],input[type="tel"],input[name*="telefono" i],input[name*="celular" i],input[name*="whatsapp" i],input[name*="phone" i],input[name*="cuit" i],input[name*="cuil" i],input[name*="dni" i],input[name*="documento" i],input[name*="precio" i],input[name*="monto" i],input[name*="importe" i],input[name*="costo" i],input[name*="descuento" i],input[name*="saldo" i],input[name*="senia" i],input[name*="limite" i],input[name*="recargo" i],input[type="number"],input[inputmode="decimal"],input[name*="cantidad" i],input[name*="stock" i],input[name*="minimo" i],input[name*="cuotas" i],input[type="email"],input[name*="email" i]) > :has(input[type="datetime-local"]) { flex: 0 0 13.5rem; }
:is(div,section,form)[style*="auto-fit"]:has(input[type="date"],input[type="time"],input[type="month"],input[type="week"],input[type="datetime-local"],input[type="tel"],input[name*="telefono" i],input[name*="celular" i],input[name*="whatsapp" i],input[name*="phone" i],input[name*="cuit" i],input[name*="cuil" i],input[name*="dni" i],input[name*="documento" i],input[name*="precio" i],input[name*="monto" i],input[name*="importe" i],input[name*="costo" i],input[name*="descuento" i],input[name*="saldo" i],input[name*="senia" i],input[name*="limite" i],input[name*="recargo" i],input[type="number"],input[inputmode="decimal"],input[name*="cantidad" i],input[name*="stock" i],input[name*="minimo" i],input[name*="cuotas" i],input[type="email"],input[name*="email" i]) > :has(input[type="tel"],input[name*="telefono" i],input[name*="celular" i],input[name*="whatsapp" i],input[name*="phone" i],input[name*="cuit" i],input[name*="cuil" i],input[name*="dni" i],input[name*="documento" i]) { flex: 0 0 14rem; }
:is(div,section,form)[style*="auto-fit"]:has(input[type="date"],input[type="time"],input[type="month"],input[type="week"],input[type="datetime-local"],input[type="tel"],input[name*="telefono" i],input[name*="celular" i],input[name*="whatsapp" i],input[name*="phone" i],input[name*="cuit" i],input[name*="cuil" i],input[name*="dni" i],input[name*="documento" i],input[name*="precio" i],input[name*="monto" i],input[name*="importe" i],input[name*="costo" i],input[name*="descuento" i],input[name*="saldo" i],input[name*="senia" i],input[name*="limite" i],input[name*="recargo" i],input[type="number"],input[inputmode="decimal"],input[name*="cantidad" i],input[name*="stock" i],input[name*="minimo" i],input[name*="cuotas" i],input[type="email"],input[name*="email" i]) > :has(input[name*="precio" i],input[name*="monto" i],input[name*="importe" i],input[name*="costo" i],input[name*="descuento" i],input[name*="saldo" i],input[name*="senia" i],input[name*="limite" i],input[name*="recargo" i],input[type="number"],input[inputmode="decimal"]) { flex: 0 0 9rem; }
:is(div,section,form)[style*="auto-fit"]:has(input[type="date"],input[type="time"],input[type="month"],input[type="week"],input[type="datetime-local"],input[type="tel"],input[name*="telefono" i],input[name*="celular" i],input[name*="whatsapp" i],input[name*="phone" i],input[name*="cuit" i],input[name*="cuil" i],input[name*="dni" i],input[name*="documento" i],input[name*="precio" i],input[name*="monto" i],input[name*="importe" i],input[name*="costo" i],input[name*="descuento" i],input[name*="saldo" i],input[name*="senia" i],input[name*="limite" i],input[name*="recargo" i],input[type="number"],input[inputmode="decimal"],input[name*="cantidad" i],input[name*="stock" i],input[name*="minimo" i],input[name*="cuotas" i],input[type="email"],input[name*="email" i]) > :has(input[name*="cantidad" i],input[name*="stock" i],input[name*="minimo" i],input[name*="cuotas" i]) { flex: 0 0 8rem; }
:is(div,section,form)[style*="auto-fit"]:has(input[type="date"],input[type="time"],input[type="month"],input[type="week"],input[type="datetime-local"],input[type="tel"],input[name*="telefono" i],input[name*="celular" i],input[name*="whatsapp" i],input[name*="phone" i],input[name*="cuit" i],input[name*="cuil" i],input[name*="dni" i],input[name*="documento" i],input[name*="precio" i],input[name*="monto" i],input[name*="importe" i],input[name*="costo" i],input[name*="descuento" i],input[name*="saldo" i],input[name*="senia" i],input[name*="limite" i],input[name*="recargo" i],input[type="number"],input[inputmode="decimal"],input[name*="cantidad" i],input[name*="stock" i],input[name*="minimo" i],input[name*="cuotas" i],input[type="email"],input[name*="email" i]) > :has(input[type="email"],input[name*="email" i]) { flex: 1 1 18rem; max-width: 26rem; }
:is(div,section,form)[style*="auto-fit"]:has(input[type="date"],input[type="time"],input[type="month"],input[type="week"],input[type="datetime-local"],input[type="tel"],input[name*="telefono" i],input[name*="celular" i],input[name*="whatsapp" i],input[name*="phone" i],input[name*="cuit" i],input[name*="cuil" i],input[name*="dni" i],input[name*="documento" i],input[name*="precio" i],input[name*="monto" i],input[name*="importe" i],input[name*="costo" i],input[name*="descuento" i],input[name*="saldo" i],input[name*="senia" i],input[name*="limite" i],input[name*="recargo" i],input[type="number"],input[inputmode="decimal"],input[name*="cantidad" i],input[name*="stock" i],input[name*="minimo" i],input[name*="cuotas" i],input[type="email"],input[name*="email" i]) > :has(> button[type="submit"], > .btn-primary) { flex: 0 0 auto; margin-left: auto; }
@media (max-width: 640px) {
:is(div,section,form)[style*="auto-fit"]:has(input[type="date"],input[type="time"],input[type="month"],input[type="week"],input[type="datetime-local"],input[type="tel"],input[name*="telefono" i],input[name*="celular" i],input[name*="whatsapp" i],input[name*="phone" i],input[name*="cuit" i],input[name*="cuil" i],input[name*="dni" i],input[name*="documento" i],input[name*="precio" i],input[name*="monto" i],input[name*="importe" i],input[name*="costo" i],input[name*="descuento" i],input[name*="saldo" i],input[name*="senia" i],input[name*="limite" i],input[name*="recargo" i],input[type="number"],input[inputmode="decimal"],input[name*="cantidad" i],input[name*="stock" i],input[name*="minimo" i],input[name*="cuotas" i],input[type="email"],input[name*="email" i]) > *, :is(div,section,form)[style*="auto-fit"]:has(input[type="date"],input[type="time"],input[type="month"],input[type="week"],input[type="datetime-local"],input[type="tel"],input[name*="telefono" i],input[name*="celular" i],input[name*="whatsapp" i],input[name*="phone" i],input[name*="cuit" i],input[name*="cuil" i],input[name*="dni" i],input[name*="documento" i],input[name*="precio" i],input[name*="monto" i],input[name*="importe" i],input[name*="costo" i],input[name*="descuento" i],input[name*="saldo" i],input[name*="senia" i],input[name*="limite" i],input[name*="recargo" i],input[type="number"],input[inputmode="decimal"],input[name*="cantidad" i],input[name*="stock" i],input[name*="minimo" i],input[name*="cuotas" i],input[type="email"],input[name*="email" i]) > :has(> button[type="submit"], > .btn-primary) { flex: 1 1 100%; max-width: none; margin-left: 0; }
}

/* En celular los campos ocupan el ancho completo (más fáciles de tocar) */
@media (max-width: 640px) {
  input:is([type], [name]) { max-width: none; }
}