/* =========================================================
   V561 - PROFESSIONAL MOBILE QUOTE VIEW
   Mobile only. Desktop/A4/print unchanged.
   ========================================================= */

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

  /* Page shell */
  .v379-public-quote-page,
  .v372-preview-page{
    background:#eef3f0!important;
    color:#173126!important;
  }

  .v379-public-quote-page .v372-paper,
  .v372-preview-page .v372-paper{
    padding:12px 10px 20px!important;
    background:#fdfefd!important;
  }

  /* Toolbar */
  .v373-public-toolbar,
  .v372-preview-actions{
    min-height:52px!important;
    padding:8px 10px!important;
    border-bottom:1px solid #d9e3dd!important;
    background:rgba(255,255,255,.98)!important;
  }

  .v373-public-toolbar > div:first-child strong,
  .v372-preview-actions > div:first-child strong{
    font-size:12.5px!important;
    font-weight:900!important;
    color:#075f3a!important;
  }

  .v373-public-toolbar button,
  .v372-preview-actions button{
    min-height:36px!important;
    border-radius:9px!important;
  }

  /* Header card */
  .v372-header{
    gap:10px!important;
    padding:12px!important;
    border:1px solid #dbe5df!important;
    border-bottom:1px solid #dbe5df!important;
    border-radius:12px!important;
    background:linear-gradient(145deg,#fbfdfc,#f4f8f6)!important;
  }

  .v372-company{
    align-items:center!important;
  }

  .v372-company > img,
  .v372-logo-fallback{
    width:54px!important;
    max-width:54px!important;
  }

  .v372-company h2{
    font-size:15px!important;
    font-weight:900!important;
  }

  .v372-company p{
    font-size:11.5px!important;
    line-height:1.35!important;
  }

  .v372-title h1,
  .v520-title h1{
    margin-top:4px!important;
    font-size:24px!important;
    letter-spacing:.04em!important;
  }

  .v520-quote-meta{
    padding:8px 10px!important;
    background:#fff!important;
    border-radius:9px!important;
  }

  .v520-meta-row{
    font-size:11.8px!important;
  }

  /* Customer card */
  .v372-info{
    margin:10px 0!important;
  }

  .v372-info > div{
    padding:12px!important;
    border-radius:12px!important;
    box-shadow:0 3px 12px rgba(15,23,42,.035)!important;
  }

  .v372-info h3{
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
    margin-bottom:9px!important;
    font-size:12px!important;
    font-weight:900!important;
  }

  .v372-info h3::before{
    content:"●";
    color:#0b7547;
    font-size:8px;
  }

  .v519-customer-stack{
    gap:7px!important;
  }

  .v519-customer-stack p{
    padding-bottom:6px!important;
    border-bottom:1px dashed #e7ece9!important;
  }

  .v519-customer-stack p:last-child{
    padding-bottom:0!important;
    border-bottom:0!important;
  }

  .v519-customer-stack p b{
    font-size:11px!important;
    color:#6b776f!important;
  }

  .v519-customer-stack p span{
    font-size:12.5px!important;
    font-weight:800!important;
    color:#173d2a!important;
  }

  /* Product cards */
  .v372-table tbody{
    gap:9px!important;
  }

  .v372-table tbody tr{
    position:relative!important;
    padding:12px!important;
    border-radius:12px!important;
    background:#fff!important;
    box-shadow:0 5px 16px rgba(15,23,42,.05)!important;
  }

  .v372-table tbody tr::before{
    content:"SẢN PHẨM";
    position:absolute;
    top:9px;
    right:10px;
    padding:3px 7px;
    border-radius:999px;
    background:#eef8f2;
    color:#0a6b41;
    font-size:8.5px;
    font-weight:900;
    letter-spacing:.05em;
  }

  .v372-table tbody td{
    font-size:12px!important;
  }

  .v372-table tbody td:nth-child(3){
    padding-right:70px!important;
    font-size:14px!important;
    line-height:1.4!important;
  }

  .v372-table tbody td:nth-child(6),
  .v372-table tbody td:nth-child(8){
    font-variant-numeric:tabular-nums!important;
  }

  .v372-table tbody td:nth-child(8){
    margin-top:2px!important;
    padding:9px 0 0!important;
    font-size:14px!important;
    color:#075f3a!important;
  }

  /* Summary */
  .v372-summary{
    gap:9px!important;
    margin:10px 0!important;
  }

  .v372-thankyou,
  .v520-thankyou{
    padding:10px 11px!important;
    border-radius:10px!important;
  }

  .v520-thankyou-copy strong{
    font-size:12px!important;
  }

  .v520-thankyou-copy p{
    font-size:11.5px!important;
  }

  .v372-total{
    padding:12px!important;
    border-radius:12px!important;
    background:linear-gradient(145deg,#f4faf6,#fff)!important;
    box-shadow:0 4px 14px rgba(15,23,42,.04)!important;
  }

  .v372-total > div{
    min-height:28px!important;
  }

  .v372-total > div span{
    font-size:11.5px!important;
  }

  .v372-total > div b{
    font-size:13px!important;
  }

  .v372-total .grand{
    margin-top:6px!important;
    padding-top:10px!important;
    border-top:2px solid #d9e5de!important;
  }

  .v372-total .grand span{
    font-size:12.5px!important;
  }

  .v372-total .grand b{
    font-size:17px!important;
  }

  /* Footer cards */
  .v372-footer,
  .v519-footer{
    gap:9px!important;
  }

  .v519-card{
    padding:12px!important;
    border-radius:12px!important;
    box-shadow:0 4px 14px rgba(15,23,42,.035)!important;
  }

  .v519-card h4{
    font-size:12.5px!important;
    font-weight:900!important;
    color:#0a6640!important;
  }

  .v519-bank-grid{
    font-size:11.7px!important;
  }

  /* Signature block */
  .v519-sign-grid{
    gap:10px!important;
  }

  .v519-sign-col{
    padding:8px 6px!important;
    border:1px solid #edf1ef!important;
    border-radius:10px!important;
    background:#fbfcfb!important;
  }

  .v519-sign-col > strong{
    font-size:10.5px!important;
  }

  .v519-sign-space,
  .v524-sign-space,
  .v533-stamped-signature{
    min-height:84px!important;
    height:84px!important;
  }

  .v519-signer-name{
    margin-top:2px!important;
    font-size:11.5px!important;
    font-weight:900!important;
  }

  /* Contact footer */
  .v374-contact-strip{
    margin-top:10px!important;
    padding:10px!important;
    border-radius:10px!important;
    background:#0b623c!important;
    color:#fff!important;
    font-size:11px!important;
  }

  /* Bottom mobile actions */
  .v377-mobile-actions{
    gap:8px!important;
    padding:9px 10px calc(9px + env(safe-area-inset-bottom))!important;
  }

  .v377-mobile-actions button{
    min-height:46px!important;
    border-radius:10px!important;
    font-size:12px!important;
  }

  .v377-mobile-actions .print{
    background:#fff!important;
    color:#0a6840!important;
    border:1px solid #0a6840!important;
  }

  .v377-mobile-actions .share{
    background:linear-gradient(90deg,#076c40,#0b8d53)!important;
    color:#fff!important;
    border:0!important;
  }
}

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

  .v372-company{
    align-items:flex-start!important;
  }

  .v372-company > img,
  .v372-logo-fallback{
    width:46px!important;
    max-width:46px!important;
  }

  .v372-title h1,
  .v520-title h1{
    font-size:22px!important;
  }

  .v519-customer-stack p{
    grid-template-columns:1fr!important;
  }

  .v372-table tbody tr{
    padding:11px!important;
  }

  .v519-sign-grid{
    grid-template-columns:1fr!important;
  }

  .v519-sign-space,
  .v524-sign-space,
  .v533-stamped-signature{
    min-height:92px!important;
    height:92px!important;
  }
}

/* Desktop / print unchanged */
@media print{
  .v377-mobile-actions{
    display:none!important;
  }
}