/* Ajustes finales de ergonomía móvil. */
@media(max-width:760px){
  html,body{max-width:100%;overflow-x:hidden}
  main,.page,.panel,.modal,.modal form,.inventory-pane,.pos-catalog,.pos-cart-panel{min-width:0;box-sizing:border-box}

  /* Modales: scroll interno confiable, cabecera y acción final siempre accesibles. */
  .modal-bg{
    padding:0!important;
    align-items:end!important;
    overflow:hidden!important;
  }
  .modal{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - max(8px,env(safe-area-inset-top)))!important;
    border-radius:24px 24px 0 0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-padding-top:86px;
    scroll-padding-bottom:120px;
    padding-bottom:calc(28px + env(safe-area-inset-bottom))!important;
  }
  .modal-head{
    position:sticky!important;
    top:0!important;
    z-index:12!important;
    margin:0 -4px 14px!important;
    padding:10px 4px 12px!important;
    background:#fff!important;
  }
  .modal-head h2{min-width:0;overflow-wrap:anywhere}
  .modal input,.modal select,.modal textarea,
  main input,main select,main textarea{
    min-width:0!important;
    width:100%;
    max-width:100%!important;
    box-sizing:border-box!important;
    scroll-margin-top:96px;
    scroll-margin-bottom:150px;
  }
  .modal form>.btn.full:last-child,
  .modal form>.quick-save:last-child{
    position:sticky;
    bottom:0;
    z-index:11;
    margin-top:16px!important;
    min-height:50px;
    box-shadow:0 -10px 24px #ffffffee;
  }

  /* Cabeceras y acciones: nunca empujar botones fuera de pantalla. */
  .page-title,.page-title.inventory-title{
    width:100%;
    min-width:0;
  }
  .page-title>.actions,.inventory-title>.actions{
    width:100%!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
  }
  .page-title>.actions .btn,.inventory-title>.actions .btn{
    width:100%!important;
    min-width:0!important;
    white-space:normal!important;
    line-height:1.2!important;
  }
  .page-title>.actions .btn:only-child{grid-column:1/-1}

  /* Tablas reales: no comprimir columnas; permitir desplazamiento horizontal. */
  .table-panel:has(table),.inventory-scroll:has(table),.modal:has(table){
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch;
  }
  .table-panel table,.inventory-scroll table,.modal table{
    min-width:640px;
    width:max-content;
    max-width:none;
  }

  /* Listados construidos con grid: convertir a tarjetas cuando falte ancho. */
  .management-row,.dispatch-request{
    min-width:0!important;
    overflow:hidden;
  }
  .management-row>*,
  .dispatch-request>*,
  .product-variant-item>*,
  .inventory-model-summary>*{min-width:0!important}
  .product-variant-item{overflow:hidden}
  .product-variant-item code,.product-variant-item b,.product-variant-item small{
    overflow-wrap:anywhere;
    word-break:break-word;
  }

  /* POS: mantener el cobro visible sin tapar contenido. */
  #page-pos .pos-cart-panel{padding-bottom:16px!important}
  #page-pos #posCheckout{
    position:sticky;
    bottom:calc(8px + env(safe-area-inset-bottom));
    z-index:9;
    min-height:50px;
    box-shadow:0 -10px 24px #ffffffee;
  }

  /* Evitar saltos visuales al aparecer el teclado. */
  :focus{scroll-margin-top:96px;scroll-margin-bottom:150px}
}

@media(max-width:420px){
  .page-title>.actions,.inventory-title>.actions{grid-template-columns:1fr!important}
  .page-title>.actions .btn,.inventory-title>.actions .btn{grid-column:1!important}
  .product-model-actions{grid-template-columns:1fr!important}
  .variant-actions{grid-template-columns:1fr!important}
  .cash-numbers,.location-meta,.admin-summary,.cash-summary{grid-template-columns:1fr!important}
}
