/* =========================================================================
   diseno-lamina.css — LA PIEL DE LAS LÁMINAS, EN TODO EL PROGRAMA (7/10/2026)
   -------------------------------------------------------------------------
   La v3 subió ese mismo día con el ORDEN de las láminas del informe del 6/10
   (vistas-previas\rediseno-6-10\propuestas\) pero con la cara de la v2. Mario:
   «lo siento muy a como era antes […] todo lo q te pasé no lo hiciste» y, ya
   viendo la prueba de Facturar: «es en todo el programa q debe tener el
   formato nuevo q había aprobado yo de las láminas».
   Esta hoja carga de ÚLTIMA y trae de las láminas lo que es de todas las
   pantallas: letra más chica, menos aire, esquinas chicas, pestañas pegadas
   con la activa en azul, botones secundarios en azul, títulos de tarjeta
   sobrios. Lo que él escogió CONSERVAR, viendo las dos caras (7/10/2026):
     1. «Gana lo q yo pedí, más contraste»: los contornos y el relleno de los
        campos NO se tocan (son los que miden las guardas).
     2. «Todo centrado»: rótulos y campos siguen centrados.
     3. Los totales de Facturar, como la lámina 02: en diseno-facturar.css.
     4. Los íconos de color del menú se quedan.
   ========================================================================= */
:root {
  --radio-chico: 4px;
  --radio-control: 6px;
  --radio-grande: 8px;
}
/* La letra más chica es de la compu: en el teléfono se queda la de siempre
   (las tarjetas y las barras se miden ahí a 14 px o más). El --radio de los
   renglones del menú tampoco se toca: son las tarjetitas que Mario escogió. */
@media (min-width: 701px) {
  body { font-size: 13.5px; }
  th { font-size: 12.5px; }
  td { font-size: 13px; }
}

/* ------------------------------------------------------ campos y botones -- */
input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]),
select, textarea { border-radius: 6px; }
.boton { border-radius: 6px; }
/* La letra chica del botón, solo en la compu, como el resto de la letra
   (revisión de Codex del 7/10/2026, V03: se había colado también al teléfono). */
@media (min-width: 701px) { .boton { font-size: 13px; } }
/* El secundario, en azul (láminas: «Cambiar cliente», «Agregar», «Ver»). El
   verde sigue siendo solo de la acción principal. */
.boton:not(.primario):not(.peligro):not(.azul):not(.texto):not(:disabled) { color: var(--azul); }

/* -------------------------------------------------------------- tarjetas -- */
.tarjeta { border-radius: 8px; }
.tarjeta > h2 { border-radius: 8px 8px 0 0; }
.modal { border-radius: 8px; }
.modal > header { border-radius: 8px 8px 0 0; font-size: 15px; }

/* -------------------------------------------------------------- pestañas -- */
/* Pegadas, en una sola caja, con la activa en azul (láminas 02, 03, 07). */
.dn-segmentos {
  background: var(--papel);
  border-color: var(--borde-tarjeta);
  border-radius: 6px;
  padding: 0;
  gap: 0;
  overflow: hidden;
}
.dn-segmentos button, .dn-segmento {
  border-radius: 0;
  border-right: 1px solid var(--borde);
  padding: 7px 18px;
  font-size: 13px;
  color: var(--texto);
}
.dn-segmentos > :last-child { border-right: 0; }
.dn-segmentos button[aria-pressed="true"], .dn-segmentos button.activo,
.dn-segmento[aria-pressed="true"], .dn-segmento.activo {
  background: var(--azul);
  color: #fff;
  box-shadow: none;
}
html[data-theme="oscuro"] .dn-segmentos button[aria-pressed="true"],
html[data-theme="oscuro"] .dn-segmentos button.activo,
html[data-theme="oscuro"] .dn-segmento[aria-pressed="true"],
html[data-theme="oscuro"] .dn-segmento.activo { color: #0b1a33; }

/* ---------------------------------------------------------------- tablas -- */
/* Los tamaños, arriba: solo en la compu. */
.facturar > .fac-barra-caja { font-size: 14px; }

/* ---------------------------------------------------- el título del menú -- */
/* «Ese Facturador CR de arriba debe ir centrado» (Mario, 7/10/2026). */
.lateral .marca { justify-content: center; padding-inline: var(--e-3); }

/* -------------------------------------------- Ele flotando; sin la franja -- */
/* «Quitemos la franja blanca de abajo donde dice EleMa y está Ele, y dejemos
   a Ele flotando en la pura esquinita donde no estorbe para bajar la página»
   (Mario, 7/10/2026). El pie deja de ocupar renglón: es solo la esquina de
   Ele, corrida de la barra de desplazamiento. La marca EleMa™ pasa al pie del
   menú (index.html). En el teléfono sigue sin haber pie (3/10/2026). */
.pie {
  position: fixed;
  right: 20px;
  bottom: 12px;
  z-index: 20;
  min-height: 0;
  padding: 0;
  background: none;
  border: 0;
  pointer-events: none;
}
.pie .esquina-ayuda { pointer-events: auto; margin: 0; }
.pie .boton-ele { height: 34px; box-shadow: var(--sombra-media); }
.pie .boton-ele.ele-callado { width: 34px; }
/* Lo último de la página se puede subir por encima de Ele: un renglón vacío
   al final. No es relleno de `main`: con relleno, lo que va pegado al pie
   (el «Guardar» de Mi cuenta, «Cerrar el conteo») se despegaba del borde. */
@media (min-width: 701px) { main::after { content: ""; display: block; flex: none; height: 48px; } }

.pie-lateral .marca-pie {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--e-2);
  padding: var(--e-1) var(--e-2);
  border-radius: var(--radio);
  color: var(--sobre-tinta-tenue);
  font-size: 12px;
  text-decoration: none;
  white-space: nowrap;
}
.pie-lateral .marca-pie b { color: var(--sobre-tinta); font: 650 12.5px var(--fuente-titulo); }
.pie-lateral .marca-pie:hover { background: var(--menu-renglon-hover); color: #fff; }
.pie-lateral .marca-pie-icono { border-radius: 4px; }
body.menu-encogido .pie-lateral .marca-pie :is(b, span) { display: none; }
/* En una laptop bajita, con el menú encogido, el logo no cabe sin que la
   página entera se vuelva desplazable: ahí cede. */
@media (max-height: 700px) { body.menu-encogido .pie-lateral .marca-pie { display: none; } }