/* V437W - Orders UI repair, desktop + mobile only */

/* ---------- Desktop ---------- */
.v437w-orders-desktop{
  width:100%;
  max-width:100%;
  overflow:hidden;
}
.v437w-order-table-scroll{
  width:100%;
  max-width:100%;
  overflow-x:auto!important;
  overflow-y:visible;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
}
.v437w-order-table-scroll table{
  width:100%;
  min-width:1180px;
  table-layout:auto;
}
.v437w-order-table-scroll th,
.v437w-order-table-scroll td{
  vertical-align:middle;
}
.v437w-order-table-scroll th{
  white-space:nowrap;
  font-size:10px;
}
.v437w-order-table-scroll td{
  font-size:11.5px;
}
.v437w-order-table-scroll td:nth-child(1),
.v437w-order-table-scroll td:nth-child(2),
.v437w-order-table-scroll td:nth-child(6),
.v437w-order-table-scroll td:nth-child(7){
  white-space:nowrap;
}
.v437w-order-table-scroll td:nth-last-child(2),
.v437w-order-table-scroll td:last-child{
  white-space:nowrap;
}
.v437w-orders-desktop .v192-order-list-actions{
  flex-wrap:nowrap!important;
  min-width:max-content;
  gap:3px!important;
}
.v437w-orders-desktop .v192-order-list-actions button{
  flex:none;
}
.v437w-orders-desktop .v437s-history-btn,
.v437w-orders-desktop .v192-order-print{
  height:30px!important;
  padding-left:7px!important;
  padding-right:7px!important;
  font-size:9px!important;
}
.v437w-orders-desktop .v437s-customer-cell{
  min-width:128px;
  max-width:190px;
}
.v437w-orders-desktop .v437s-customer-cell>span{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  max-width:100%;
}
.v437w-orders-desktop .v437s-quote-link{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* Keep the new order alert row visually aligned. */
.v437s-order-alerts{
  width:100%;
}
.v437s-order-alerts article{
  min-width:0;
}
.v437s-order-alerts span{
  line-height:1.3;
}

/* ---------- Tablet / small desktop ---------- */
@media (min-width:768px) and (max-width:1199px){
  .v437w-orders-desktop{
    padding:12px!important;
  }
  .v437w-order-table-scroll table{
    min-width:1080px;
  }
  .v437w-order-table-scroll th{
    font-size:9px;
    padding-left:8px!important;
    padding-right:8px!important;
  }
  .v437w-order-table-scroll td{
    font-size:10.5px;
    padding-left:8px!important;
    padding-right:8px!important;
  }
}

/* ---------- Mobile ---------- */
@media(max-width:767px){
  /* No accidental horizontal page scroll */
  .v437w-orders-mobile,
  .v437w-order-card{
    width:100%;
    max-width:100%;
    min-width:0;
  }
  .v437w-orders-mobile{
    overflow-x:hidden;
    margin-bottom:22px!important;
  }
  .v437w-order-card{
    border-radius:10px;
  }

  /* Header: customer text can wrap instead of colliding with status */
  .v437w-order-card [data-loc="client/src/pages/Orders.tsx:712"]{
    align-items:flex-start!important;
    gap:8px!important;
    padding:10px!important;
  }
  .v437w-order-card [data-loc="client/src/pages/Orders.tsx:713"]{
    min-width:0!important;
    flex:1 1 auto;
  }
  .v437w-order-card [data-loc="client/src/pages/Orders.tsx:714"]{
    width:100%;
    min-width:0;
  }
  .v437w-order-card [data-loc="client/src/pages/Orders.tsx:717"]{
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    line-height:1.3;
    font-size:13px!important;
  }
  .v437w-order-card [data-loc="client/src/pages/Orders.tsx:719"]{
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    line-height:1.35;
    font-size:10px!important;
  }
  .v437w-order-card [data-loc="client/src/pages/Orders.tsx:721"]{
    flex:none;
    max-width:46%;
  }

  /* Financial cells */
  .v437w-order-card [data-loc="client/src/pages/Orders.tsx:724"]{
    grid-template-columns:1fr 1fr!important;
  }
  .v437w-order-card [data-loc="client/src/pages/Orders.tsx:725"],
  .v437w-order-card [data-loc="client/src/pages/Orders.tsx:729"]{
    padding:9px 10px!important;
  }
  .v437w-order-card [data-loc="client/src/pages/Orders.tsx:727"],
  .v437w-order-card [data-loc="client/src/pages/Orders.tsx:731"]{
    font-size:12.5px!important;
    overflow-wrap:anywhere;
  }

  /* Main fix: dynamic quick buttons always form a clean 2-column grid.
     Previous grid-cols-2/grid-cols-3 was calculated before extra "Đã giao/Thu tiền"
     buttons were added, which made cards look broken. */
  .v437w-mobile-order-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
    padding:8px!important;
  }
  .v437w-mobile-order-actions>button,
  .v437w-mobile-order-actions>a{
    width:100%!important;
    min-width:0!important;
    height:36px!important;
    margin:0!important;
    padding:0 7px!important;
    justify-content:center!important;
    font-size:8.5px!important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .v437s-mobile-quote-link{
    margin-top:4px;
    max-width:100%;
    width:max-content;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  /* Alert tiles: predictable 2 columns; labels may wrap */
  .v437s-order-alerts{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
    margin-bottom:9px!important;
  }
  .v437s-order-alerts article{
    min-height:48px!important;
    padding:8px!important;
    gap:7px!important;
  }
  .v437s-order-alerts b{
    flex:none;
    font-size:14px!important;
  }
  .v437s-order-alerts span{
    white-space:normal!important;
    overflow-wrap:anywhere;
    font-size:7.5px!important;
  }
}

/* very narrow phones */
@media(max-width:390px){
  .v437w-mobile-order-actions{
    grid-template-columns:1fr!important;
  }
  .v437s-order-alerts{
    grid-template-columns:1fr 1fr!important;
  }
}

/* protect page from any new table/button width leaking into viewport */
@media(max-width:767px){
  body{
    overflow-x:hidden;
  }
}