/* =========================================================
   APP TIENDA · V14 ADMIN · COMPRAS EN MÓVIL
   Corrección exclusivamente visual de Historial de compras.
   No modifica datos, endpoints, permisos ni lógica de compra.
   ========================================================= */

/* La tarjeta y el historial nunca deben colapsar horizontalmente. */
body.v10-admin.lab-visual-v5 #purchases,
body.v10-admin.lab-visual-v5 #purchases .v720-purchases-page,
body.v10-admin.lab-visual-v5 #purchases .v720-card,
body.v10-admin.lab-visual-v5 #purchases .v720-history,
body.v10-admin.lab-visual-v5 #purchases #v720History{
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}

body.v10-admin.lab-visual-v5 #purchases .v721-history-main,
body.v10-admin.lab-visual-v5 #purchases .v721-history-actions{
  min-width:0;
  box-sizing:border-box;
}

@media(max-width:780px){
  /* Cada compra se comporta como una tarjeta compacta y legible. */
  body.v10-admin.lab-visual-v5 #purchases .v720-history-row.v721-history-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    align-items:start!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
    padding:11px 12px!important;
    margin:0 0 8px!important;
    border:1px solid rgba(100,116,139,.20)!important;
    border-radius:13px!important;
    background:#fff!important;
    overflow:hidden!important;
  }

  body.v10-admin.lab-visual-v5 #purchases .v721-history-main{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:3px!important;
    width:100%!important;
    min-width:0!important;
  }

  /* El resumen de artículos deja de formar una columna de palabras. */
  body.v10-admin.lab-visual-v5 #purchases .v721-history-main>strong{
    display:-webkit-box!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    white-space:normal!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    hyphens:none!important;
    font-size:.76rem!important;
    line-height:1.28!important;
    font-weight:850!important;
  }

  body.v10-admin.lab-visual-v5 #purchases .v721-history-main>small{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    font-size:.60rem!important;
    line-height:1.35!important;
  }

  /* Importe + estado + acciones, todo en una segunda línea estable. */
  body.v10-admin.lab-visual-v5 #purchases .v721-history-actions{
    display:flex!important;
    flex-flow:row wrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:6px!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
  }

  body.v10-admin.lab-visual-v5 #purchases .v721-history-actions>strong{
    margin-right:auto!important;
    font-size:.90rem!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  body.v10-admin.lab-visual-v5 #purchases .v721-history-actions .v7299-status,
  body.v10-admin.lab-visual-v5 #purchases .v721-history-actions .v720-pill{
    order:3;
    flex:0 0 100%;
    width:max-content!important;
    max-width:100%;
    margin-top:1px;
  }

  body.v10-admin.lab-visual-v5 #purchases .v721-history-actions button{
    min-height:31px!important;
    min-width:54px!important;
    padding:6px 9px!important;
    border-radius:8px!important;
    font-size:.62rem!important;
    white-space:nowrap!important;
  }

  /* Historial y pendientes necesitan aire respecto a la barra inferior. */
  body.v10-admin.lab-visual-v5 #purchases .v720-history,
  body.v10-admin.lab-visual-v5 #purchases .v720-pending{
    gap:0!important;
    padding-bottom:4px;
  }
}

/* Dark mode coherente con V6/V9. */
body.v10-admin.lab-visual-v5.lab-theme-dark #purchases .v720-history-row.v721-history-row{
  background:#162235!important;
  border-color:#33445d!important;
  box-shadow:0 6px 18px rgba(0,0,0,.12)!important;
  color:#eef4ff!important;
}
body.v10-admin.lab-visual-v5.lab-theme-dark #purchases .v721-history-main>strong,
body.v10-admin.lab-visual-v5.lab-theme-dark #purchases .v721-history-actions>strong{
  color:#f8fafc!important;
}
body.v10-admin.lab-visual-v5.lab-theme-dark #purchases .v721-history-main>small{
  color:#9fb0c6!important;
}