
/* V320 — Responsive phần đầu Phiếu đặt hàng trên giao diện mobile/tablet.
   Chỉ áp dụng khi xem trên màn hình <=1100px; bản in/PDF desktop không đổi. */

@media screen and (max-width:1100px){

  .invoice-print-document,
  .invoice-print-document .inv-page{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  /* Header công ty tự co theo chiều rộng */
  .invoice-print-document .inv-header{
    display:grid!important;
    grid-template-columns:minmax(74px,18%) minmax(0,1fr)!important;
    width:100%!important;
    min-width:0!important;
  }

  .invoice-print-document .inv-header > *{
    min-width:0!important;
    max-width:100%!important;
  }

  .invoice-print-document .inv-logo{
    min-width:0!important;
    padding:10px!important;
  }

  .invoice-print-document .inv-logo-image{
    width:100%!important;
    max-width:110px!important;
    height:auto!important;
    max-height:54px!important;
    object-fit:contain!important;
  }

  .invoice-print-document .inv-company{
    min-width:0!important;
    padding:10px 12px!important;
    overflow:hidden!important;
  }

  .invoice-print-document .inv-company-kicker{
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  .invoice-print-document .inv-company-name{
    max-width:100%!important;
    font-size:clamp(10px,1.65vw,14px)!important;
    line-height:1.28!important;
    letter-spacing:.15px!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }

  .invoice-print-document .inv-company-sub,
  .invoice-print-document .inv-company-bank{
    max-width:100%!important;
    font-size:clamp(7px,1.15vw,10.5px)!important;
    line-height:1.4!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }

  /* Ký hiệu xuống hàng riêng để không bóp thông tin công ty */
  .invoice-print-document .inv-mst{
    grid-column:1/-1!important;
    min-width:0!important;
    width:100%!important;
    padding:7px 10px!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;
    border-top:1px solid #14532d33!important;
    text-align:left!important;
  }

  .invoice-print-document .inv-mst-box{
    flex:0 0 auto!important;
  }

  /* Tiêu đề PHIẾU ĐẶT HÀNG tự co, không tràn */
  .invoice-print-document .inv-title-block{
    width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
  }

  .invoice-print-document .inv-title{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    display:grid!important;
    grid-template-columns:minmax(10px,1fr) auto minmax(10px,1fr)!important;
    align-items:center!important;
    gap:clamp(5px,1.2vw,12px)!important;
    padding:clamp(8px,1.8vw,13px) 8px!important;
    font-size:clamp(15px,3vw,23px)!important;
    line-height:1.15!important;
    letter-spacing:clamp(.5px,.35vw,2.2px)!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:clip!important;
  }

  .invoice-print-document .inv-title-accent{
    width:100%!important;
    max-width:26px!important;
    min-width:8px!important;
    justify-self:center!important;
  }
}

/* Tablet/mobile hẹp hơn */
@media screen and (max-width:700px){
  .invoice-print-document .inv-header{
    grid-template-columns:68px minmax(0,1fr)!important;
  }

  .invoice-print-document .inv-logo{
    padding:8px 6px!important;
  }

  .invoice-print-document .inv-company{
    padding:8px!important;
  }

  .invoice-print-document .inv-company-name{
    font-size:10px!important;
  }

  .invoice-print-document .inv-company-sub,
  .invoice-print-document .inv-company-bank{
    font-size:7px!important;
    line-height:1.35!important;
  }

  .invoice-print-document .inv-title{
    gap:5px!important;
    padding:8px 5px!important;
    font-size:clamp(13px,4.2vw,16px)!important;
    letter-spacing:.8px!important;
  }

  .invoice-print-document .inv-title-accent{
    max-width:14px!important;
  }
}

/* Mobile rất nhỏ: ưu tiên chữ rõ, không ép logo/tiêu đề */
@media screen and (max-width:420px){
  .invoice-print-document .inv-header{
    grid-template-columns:58px minmax(0,1fr)!important;
  }

  .invoice-print-document .inv-logo-image{
    max-width:54px!important;
  }

  .invoice-print-document .inv-company-name{
    font-size:9px!important;
  }

  .invoice-print-document .inv-company-sub,
  .invoice-print-document .inv-company-bank{
    font-size:6.5px!important;
  }

  .invoice-print-document .inv-title{
    font-size:13px!important;
    letter-spacing:.35px!important;
  }

  .invoice-print-document .inv-title-accent{
    max-width:10px!important;
  }
}

/* Không thay đổi đầu ra khi in */
@media print{
  .invoice-print-document .inv-header,
  .invoice-print-document .inv-title{
    /* dùng CSS in hiện có */
  }
}
