/* compat.css — reglas del preflight que Chrome 87 (la Mac del club, macOS 10.10) descarta.
   Tailwind las escribe con :where(), que llegó recién en Chrome 88. En CSS un selector
   inválido invalida TODA la regla, así que en esa Mac los <button> se quedaban con el
   fondo y el borde grisáceos del navegador. Acá van re-declaradas con selectores que
   Chrome 87 entiende. En navegadores modernos son idénticas a las originales: no cambian nada.
   Se carga después del CSS principal. */

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  background-color: transparent;
  background-image: none;
}

abbr[title] {
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
}

[hidden] {
  display: none;
}

/* --- ld-movil v1 (23/9/2026): el club opera desde iPhone --- */
@media (max-width: 640px) {
  /* iOS hace zoom al tocar un input con letra menor a 16px */
  input, select, textarea { font-size: 16px !important; }
  /* pastillas y botones de acción: más altos para el dedo */
  button.text-xs.rounded-xl, button.text-xs.rounded-lg, a.text-xs.rounded-xl { padding-top: .55rem; padding-bottom: .55rem; min-height: 36px; }
  /* tablas anchas (Stock): scroll adentro en vez de ensanchar la página */
  main table { display: block; overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch; }
  /* botón flotante más chico y pegado al borde */
  .ld-fab { transform: scale(.82); transform-origin: bottom right; bottom: 12px !important; right: 12px !important; }
}

/* --- ld-movil v2 (24/9/2026): carteles (modales) en el celular ---
   Los modales del panel centran el cartel (items-center) y le ponen max-height/overflow-hidden:
   si el cartel es más alto que la pantalla, arriba queda cortado (la cruz no se alcanza) y no
   hay forma de moverlo. En el celular la capa oscura hace scroll y el cartel crece entero. */
@media (max-width: 640px) {
  .fixed.inset-0.z-50.flex.items-center.justify-center { align-items: flex-start !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch; padding: 8px 8px 80px !important; }
  .fixed.inset-0.z-50.flex.items-center.justify-center > .absolute.inset-0 { position: fixed; }
  .fixed.inset-0.z-50.flex.items-center.justify-center > .relative.z-10 { overflow: visible !important; }
  .fixed.inset-0.z-50.flex.items-center.justify-center > div { max-height: none !important; }
  .fixed.inset-0.z-50.flex.items-center.justify-center [class*="max-h-["] { max-height: none !important; overflow: visible !important; }
  /* la fila del título con la cruz queda pegada arriba mientras se baja */
  .fixed.inset-0.z-50.flex.items-center.justify-center .relative.z-10 > div > .flex.items-center.justify-between.mb-5 { position: sticky; top: -24px; z-index: 3; background: var(--adm-s1, #fff); margin: -24px -24px 12px; padding: 12px 24px 8px; }
  /* módulo con fuente (POS, fiados, caja, fijos) */
  .ldpos-mask { align-items: flex-start !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch; padding: 8px 8px 80px !important; }
  .ldpos-modal { max-height: none !important; overflow: visible !important; }
}

/* --- ld-movil v3 (28/9): los 5 botones de la fila de Cobrar entran en el celular --- */
@media (max-width: 640px) { .ld-cobrar-acts { flex: 1 1 100% !important; flex-shrink: 1 !important; min-width: 0; } }

/* --- ld-movil v4 (28/9): Inicio/Dashboard no ensanchan la pagina en el celular --- */
@media (max-width: 640px) {
  .flex-1.flex.flex-col.min-h-screen, main.flex-1 { min-width: 0; max-width: 100vw; }
  main .flex.items-end.justify-between, main .flex.items-center.justify-between { flex-wrap: wrap; row-gap: 8px; }
}