/* =========================================================
   V381 — Match approved quotation layout
   Company left | Quote centered | QR right
   ========================================================= */

.v379-a4-paper .v372-header{
  display:grid!important;
  grid-template-columns:minmax(0,1.2fr) minmax(280px,.9fr) minmax(180px,.48fr)!important;
  align-items:start!important;
  gap:20px!important;
  padding:20px 22px 18px!important;
}

/* LEFT: logo + company data */
.v379-a4-paper .v372-company{
  display:grid!important;
  grid-template-columns:118px minmax(0,1fr)!important;
  gap:15px!important;
  align-items:start!important;
}
.v379-a4-paper .v372-company img,
.v379-a4-paper .v372-logo-fallback{
  width:112px!important;
  height:84px!important;
  object-fit:contain!important;
}
.v379-a4-paper .v372-company>div:last-child{
  min-width:0!important;
}
.v379-a4-paper .v372-company h2{
  margin:0 0 7px!important;
  font-size:18px!important;
  line-height:1.18!important;
  font-weight:950!important;
  color:#075c35!important;
}
.v379-a4-paper .v372-company p{
  margin:4px 0 0!important;
  font-size:9.4px!important;
  line-height:1.45!important;
  font-weight:650!important;
}

/* CENTER: quotation title truly centered */
.v379-a4-paper .v372-title{
  display:grid!important;
  justify-items:center!important;
  align-content:start!important;
  text-align:center!important;
  min-width:0!important;
  padding-top:8px!important;
}
.v379-a4-paper .v372-title h1{
  margin:0!important;
  font-size:42px!important;
  line-height:.98!important;
  font-weight:950!important;
  letter-spacing:.035em!important;
  color:#075c35!important;
  white-space:nowrap!important;
}
.v379-a4-paper .v372-title:after{
  content:"◆"!important;
  display:block!important;
  width:185px!important;
  margin:9px 0 10px!important;
  border-top:1.5px solid #8fac9a!important;
  color:#075c35!important;
  font-size:10px!important;
  line-height:0!important;
  text-align:center!important;
  background:#fff!important;
}
.v379-a4-paper .v372-title>p{
  margin:0 0 8px!important;
  font-size:12px!important;
  font-weight:800!important;
}
.v379-a4-paper .v372-title>p strong{
  color:#c62828!important;
  font-size:15px!important;
  font-weight:950!important;
}
.v379-a4-paper .v372-date{
  margin:5px auto 7px!important;
  width:max-content!important;
  padding:5px 12px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#26362e!important;
  font-size:9.8px!important;
  font-weight:850!important;
}
.v379-a4-paper .v372-title small{
  font-size:9.6px!important;
  font-weight:750!important;
  color:#2f3c35!important;
}

/* RIGHT: QR top-right aligned with company area */
.v379-a4-paper .v372-qr{
  display:grid!important;
  justify-items:center!important;
  align-content:start!important;
  gap:6px!important;
  text-align:center!important;
  padding-top:0!important;
}
.v379-a4-paper .v372-qr:before{
  content:"QUÉT MÃ XEM BÁO GIÁ"!important;
  display:block!important;
  margin-bottom:2px!important;
  font-size:9px!important;
  font-weight:950!important;
  letter-spacing:.02em!important;
  color:#183028!important;
}
.v379-a4-paper .v372-qr strong{
  display:none!important;
}
.v379-a4-paper .v378-real-qr{
  width:102px!important;
  height:102px!important;
  padding:4px!important;
  border:1.4px solid #6c9a7e!important;
  border-radius:7px!important;
  background:#fff!important;
}
.v379-a4-paper .v372-qr small{
  display:block!important;
  max-width:170px!important;
  padding:5px 8px!important;
  border-radius:999px!important;
  background:#075c35!important;
  color:#fff!important;
  font-size:7.4px!important;
  font-weight:800!important;
  word-break:break-all!important;
}
.v379-a4-paper .v372-qr:after{
  content:"Quét mã hoặc truy cập link để xem báo giá mới nhất"!important;
  display:block!important;
  max-width:175px!important;
  font-size:7.8px!important;
  line-height:1.45!important;
  color:#526159!important;
}

/* Customer + notes: equal cards like approved mockup */
.v379-a4-paper .v372-info{
  gap:18px!important;
  padding:12px 18px 14px!important;
  border-bottom:1.5px solid #9bb7a6!important;
  background:#fff!important;
}
.v379-a4-paper .v372-info>div{
  padding:0!important;
  border:1px solid #d2ddd6!important;
  border-radius:8px!important;
  overflow:visible!important;
  background:#fff!important;
}
.v379-a4-paper .v372-info>div+div{
  border-left:1px solid #d2ddd6!important;
}
.v379-a4-paper .v372-info h3{
  margin:-1px 0 10px -1px!important;
  border-radius:7px 7px 5px 5px!important;
}
.v379-a4-paper .v372-info p{
  margin-left:13px!important;
  margin-right:13px!important;
}
.v379-a4-paper .v372-info p:last-child{
  margin-bottom:12px!important;
}

/* Product table should sit tightly under cards */
.v379-a4-paper .v372-table-wrap{
  padding:0 18px!important;
}
.v379-a4-paper .v372-table{
  border:1px solid #c2d2c8!important;
  border-radius:7px!important;
  overflow:hidden!important;
}
.v379-a4-paper .v372-table th{
  background:#075c35!important;
}
.v379-a4-paper .v372-table th:first-child{
  border-top-left-radius:6px!important;
}
.v379-a4-paper .v372-table th:last-child{
  border-top-right-radius:6px!important;
}

/* Totals aligned right as in mockup */
.v379-a4-paper .v372-summary{
  grid-template-columns:minmax(0,1fr) minmax(420px,46%)!important;
  gap:18px!important;
  padding:12px 18px 14px!important;
}
.v379-a4-paper .v372-total{
  align-self:start!important;
}

/* Footer 3 cards */
.v379-a4-paper .v372-footer{
  gap:10px!important;
  padding:0 18px 14px!important;
  border-top:0!important;
}
.v379-a4-paper .v372-footer>div{
  min-height:138px!important;
  border:1px solid #d2ddd6!important;
  border-radius:8px!important;
  padding:13px 14px!important;
}
.v379-a4-paper .v372-footer>div+div{
  border-left:1px solid #d2ddd6!important;
}

/* Contact strip rounded like approved mockup */
.v379-a4-paper .v374-contact-strip{
  margin:0 18px 10px!important;
  border:1px solid #92ad9d!important;
  border-radius:999px!important;
  padding:9px 16px!important;
}
.v379-a4-paper .v374-brand-footer{
  margin:0!important;
  padding:7px 14px!important;
  background:#075c35!important;
}

/* Mobile keeps the same visual system but stacks */
@media(max-width:900px){
  .v379-a4-paper .v372-header{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }

  .v379-a4-paper .v372-company{
    grid-template-columns:88px minmax(0,1fr)!important;
  }

  .v379-a4-paper .v372-title{
    justify-items:start!important;
    text-align:left!important;
    padding-top:8px!important;
    border-top:1px solid #d7e2db!important;
  }
  .v379-a4-paper .v372-title h1{
    font-size:32px!important;
  }
  .v379-a4-paper .v372-title:after{
    width:150px!important;
    text-align:center!important;
    margin-left:0!important;
  }
  .v379-a4-paper .v372-date{
    margin-left:0!important;
  }

  .v379-a4-paper .v372-qr{
    display:grid!important;
    grid-template-columns:82px minmax(0,1fr)!important;
    justify-items:start!important;
    text-align:left!important;
  }
  .v379-a4-paper .v372-qr:before{
    grid-column:1/-1!important;
  }
  .v379-a4-paper .v378-real-qr{
    width:80px!important;
    height:80px!important;
    grid-row:2/5!important;
  }
  .v379-a4-paper .v372-qr small,
  .v379-a4-paper .v372-qr:after{
    max-width:100%!important;
  }

  .v379-a4-paper .v372-info{
    grid-template-columns:1fr!important;
    gap:10px!important;
    padding:10px!important;
  }
  .v379-a4-paper .v372-info>div+div{
    border-left:1px solid #d2ddd6!important;
  }

  .v379-a4-paper .v372-table-wrap{
    padding:0 10px!important;
  }

  .v379-a4-paper .v372-summary{
    grid-template-columns:1fr!important;
    padding:10px!important;
  }

  .v379-a4-paper .v372-footer{
    grid-template-columns:1fr!important;
    padding:0 10px 10px!important;
  }

  .v379-a4-paper .v374-contact-strip{
    margin:0 10px 8px!important;
    border-radius:12px!important;
  }
}

/* True A4 print */
@media print{
  .v379-a4-paper .v372-header{
    grid-template-columns:76mm 64mm 48mm!important;
    gap:4mm!important;
    padding:8mm 4mm 4mm!important;
  }
  .v379-a4-paper .v372-company{
    grid-template-columns:25mm 1fr!important;
    gap:3mm!important;
  }
  .v379-a4-paper .v372-title h1{
    font-size:25pt!important;
  }
  .v379-a4-paper .v372-title:after{
    width:42mm!important;
    margin:2mm 0 2.5mm!important;
  }
  .v379-a4-paper .v378-real-qr{
    width:21mm!important;
    height:21mm!important;
  }
  .v379-a4-paper .v372-qr:before{
    font-size:6pt!important;
  }
  .v379-a4-paper .v372-qr:after{
    font-size:5.3pt!important;
  }

  .v379-a4-paper .v372-info{
    gap:4mm!important;
    padding:3mm 4mm!important;
  }
  .v379-a4-paper .v372-table-wrap{
    padding:0 4mm!important;
  }
  .v379-a4-paper .v372-summary{
    grid-template-columns:1fr 88mm!important;
    gap:4mm!important;
    padding:3mm 4mm!important;
  }
  .v379-a4-paper .v372-footer{
    gap:2.5mm!important;
    padding:0 4mm 3mm!important;
  }
  .v379-a4-paper .v374-contact-strip{
    margin:0 4mm 2.5mm!important;
    padding:2mm 4mm!important;
  }
}