@font-face{font-family:Montserrat;src:url("assets/montserrat-regular.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Montserrat;src:url("assets/montserrat-bold.ttf") format("truetype");font-style:normal;font-weight:700;font-display:swap}

.hpg-reference-po{--hpg-ink:#33261b;--hpg-brown:#5b4030;--hpg-copy:#6b5c4d;--hpg-taupe:#a9927a;--hpg-gold:#b8892b;--hpg-line:#d8c9b8;width:794px;max-width:100%!important;margin:0 auto!important;padding:36px 40px 24px!important;background:#fff;color:var(--hpg-ink)!important;font-family:Montserrat,Arial,sans-serif!important;font-size:10px!important;font-weight:400;line-height:1.45;letter-spacing:0}
.hpg-reference-po *{font-family:inherit!important;box-sizing:border-box}
.hpg-ref-header{display:flex;align-items:flex-start;justify-content:space-between;margin:0 0 30px;padding:0;border:0}
.hpg-ref-header img{display:block;width:148px!important;height:auto!important;object-fit:contain}
.hpg-ref-header>div{text-align:right;padding-top:2px}
.hpg-ref-header span,.hpg-ref-header>div>strong{display:block;color:var(--hpg-taupe);font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase}
.hpg-ref-header h1{margin:5px 0 3px;color:var(--hpg-brown);font-size:24px;font-weight:700;line-height:1;letter-spacing:.04em}
.hpg-ref-header>div>strong{color:var(--hpg-gold);font-size:9px;letter-spacing:.28em}
.hpg-ref-summary{display:grid;grid-template-columns:1.08fr 1.08fr 1.08fr;gap:10px;margin-bottom:26px}
.hpg-ref-summary>div{min-height:69px;padding:15px 18px;background:#f5f2ec}
.hpg-ref-summary .hpg-ref-number{background:var(--hpg-brown);color:#fff}
.hpg-ref-summary span,.hpg-reference-po .hpg-ref-label,.hpg-ref-commercial span,.hpg-ref-marks span,.hpg-ref-payment span,.hpg-ref-approvals span{display:block;margin-bottom:5px;color:var(--hpg-taupe);font-size:8px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.hpg-ref-summary .hpg-ref-number span{color:#ddd1c6}
.hpg-ref-summary strong{display:block;font-size:13px;font-weight:700;line-height:1.2}
.hpg-ref-summary .hpg-ref-number strong{font-size:20px;color:#fff}
.hpg-ref-summary p{margin:4px 0 0;color:var(--hpg-copy);font-size:9px}
.hpg-ref-section-label{margin:0 0 8px!important;padding:0!important;border:0!important;background:transparent!important;color:var(--hpg-gold)!important;font-size:9px!important;font-weight:700!important;line-height:1.2!important;letter-spacing:.22em!important;text-transform:uppercase}
.hpg-ref-parties{display:grid;grid-template-columns:1fr 1fr;margin-bottom:25px;border:1px solid var(--hpg-line)}
.hpg-ref-party{min-height:114px;padding:16px 18px;border-right:1px solid var(--hpg-line);border-bottom:1px solid var(--hpg-line)}
.hpg-ref-party:nth-child(2n){border-right:0}.hpg-ref-party:nth-last-child(-n+2){border-bottom:0}
.hpg-ref-party strong{display:block;margin-bottom:5px;font-size:12px;font-weight:700}.hpg-ref-party p{min-height:1em;margin:2px 0;color:var(--hpg-copy);font-size:9.5px}.hpg-ref-party .hpg-ref-warning{margin-top:8px;color:var(--hpg-gold);font-size:8px;font-weight:700}
.hpg-ref-commercial{display:grid;grid-template-columns:repeat(3,1fr);margin-bottom:15px;border:1px solid var(--hpg-line)}
.hpg-ref-commercial>div{min-height:56px;padding:14px 18px;border-right:1px solid var(--hpg-line);border-bottom:1px solid var(--hpg-line)}
.hpg-ref-commercial>div:nth-child(3n){border-right:0}.hpg-ref-commercial>div:nth-last-child(-n+3){border-bottom:0}.hpg-ref-commercial strong{display:block;font-size:11px;font-weight:700;line-height:1.25}
.hpg-ref-marks{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:20px}
.hpg-ref-marks>div{min-height:56px;padding:14px 18px;background:#f5f2ec}.hpg-ref-marks strong{display:block;font-size:10px}.hpg-reference-po .hpg-ref-total{background:var(--hpg-brown);color:#fff}.hpg-reference-po .hpg-ref-total span{color:#ddd1c6}.hpg-reference-po .hpg-ref-total strong{color:#fff;font-size:17px}
.hpg-ref-items{width:100%;margin:0 0 18px!important;border-collapse:collapse;table-layout:fixed;color:var(--hpg-ink)}
.hpg-ref-items th{padding:8px 12px!important;background:var(--hpg-brown)!important;color:#fff!important;font-size:8px!important;font-weight:700!important;letter-spacing:.15em!important;text-align:left!important;text-transform:uppercase}
.hpg-ref-items th:nth-child(1){width:15%}.hpg-ref-items th:nth-child(2){width:14%}.hpg-ref-items th:nth-child(3){width:38%}.hpg-ref-items th:nth-child(4){width:8%;text-align:right!important}.hpg-ref-items th:nth-child(5){width:12%;text-align:right!important}.hpg-ref-items th:nth-child(6){width:13%;text-align:right!important}
.hpg-ref-items td{padding:9px 12px!important;border:0!important;border-bottom:1px solid #e2d8cb!important;color:var(--hpg-copy);font-size:8.5px!important;line-height:1.4!important;vertical-align:top!important}
.hpg-ref-items td>span{display:block}.hpg-ref-item-code{display:block;margin-bottom:6px;color:var(--hpg-gold);font-size:9px}.hpg-ref-item-side-label{margin-bottom:2px;color:var(--hpg-taupe);font-size:6px;font-weight:700;letter-spacing:.15em}.hpg-ref-item-title{display:block;margin-bottom:2px;color:var(--hpg-ink);font-size:10px;line-height:1.2}.hpg-ref-image-cell{text-align:center}.hpg-ref-image-cell img{display:block;width:100%;max-height:86px;object-fit:cover}.hpg-ref-right{text-align:right!important;color:var(--hpg-ink)!important}
.hpg-ref-totals{margin-top:22px}.hpg-ref-totals>.hpg-ref-section-label{padding-bottom:12px!important;border-bottom:1px solid var(--hpg-line)!important}.hpg-ref-totals-lines{width:40%;margin-left:auto}.hpg-ref-totals-lines p{display:flex;justify-content:space-between;gap:20px;margin:0;padding:9px 18px;border-bottom:1px solid var(--hpg-line);color:var(--hpg-copy);font-size:10px}.hpg-ref-totals-lines p strong{color:var(--hpg-ink)}.hpg-ref-totals-lines .hpg-ref-tax span{font-weight:700;letter-spacing:.08em}.hpg-ref-totals-lines .hpg-ref-total{margin-top:28px;padding:14px 18px;border:0;font-size:12px;letter-spacing:.15em}.hpg-ref-totals-lines .hpg-ref-total strong{font-size:14px;letter-spacing:0}
.hpg-ref-payment{margin-top:25px;padding:15px 17px;border:1px solid var(--hpg-line)}.hpg-ref-payment p{margin:0 0 8px;color:var(--hpg-ink);font-size:9px}.hpg-ref-payment p:last-child{margin-bottom:0}.hpg-ref-payment span{margin-bottom:2px}
.hpg-ref-note{margin:16px 2px;color:var(--hpg-taupe);font-size:7px}
.hpg-ref-approvals-section{margin-top:25px}.hpg-ref-approvals{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--hpg-line)}.hpg-ref-approvals>div{min-height:128px;padding:18px;border-right:1px solid var(--hpg-line);border-bottom:1px solid var(--hpg-line)}.hpg-ref-approvals>div:nth-child(2n){border-right:0}.hpg-ref-approvals>div:nth-last-child(-n+2){border-bottom:0}.hpg-ref-approvals p{min-height:40px;margin:10px 0;color:var(--hpg-ink);font-size:10px}.hpg-ref-approvals i{display:block;margin-top:20px;border-top:1px solid var(--hpg-taupe)}.hpg-ref-approvals small{display:flex;justify-content:space-between;margin-top:5px;color:var(--hpg-taupe);font-size:7px;font-style:normal}.hpg-ref-approvals small b{font-weight:400}.hpg-ref-approved-for{background:#f5f2ec}.hpg-ref-approved-for>strong{display:block;margin:8px 0 40px;color:var(--hpg-brown);font-size:17px}.hpg-ref-approved-for small{display:block;color:var(--hpg-copy);font-size:9px}
.hpg-ref-conditions{margin-top:24px}.hpg-ref-conditions h2{margin:0;color:var(--hpg-brown);font-size:19px;line-height:1.1}.hpg-ref-conditions h3{margin:4px 0 10px;color:var(--hpg-gold);font-size:9px;letter-spacing:.22em}.hpg-ref-conditions>div{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.hpg-ref-conditions p{display:grid;grid-template-columns:24px 1fr;gap:8px;margin:0;padding:7px 0;border-bottom:1px solid #e2d8cb;color:var(--hpg-ink);font-size:8px;line-height:1.45}.hpg-ref-conditions p>strong{color:var(--hpg-gold);font-size:8px}
.hpg-ref-footer{display:flex;justify-content:space-between;margin-top:30px;padding-top:8px;border-top:1px solid var(--hpg-line);color:var(--hpg-taupe);font-size:7px;letter-spacing:.05em}

.po-conditions-editor>p{margin:.1rem 0 .9rem;color:var(--muted);font-size:.78rem}.po-conditions-list{display:grid;gap:.55rem;margin-bottom:.8rem}.po-condition-row{display:grid;grid-template-columns:42px minmax(0,1fr) 42px;align-items:start;gap:.55rem}.po-condition-row>strong{display:grid;place-items:center;min-height:58px;border-radius:8px;background:#f5ead4;color:#a66f12;font-size:.76rem;letter-spacing:.08em}.po-condition-row textarea{width:100%;min-height:58px;resize:vertical}.po-condition-row button{display:grid;place-items:center;width:42px;height:42px;padding:0!important}.po-condition-row .ui-icon{width:17px;height:17px}



@media print{@page{size:A4;margin:0}.hpg-reference-po,.hpg-reference-po *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;color-adjust:exact!important}.hpg-reference-po{page:vaak-po;width:auto!important;max-width:none!important;min-height:0;padding:0!important}.hpg-ref-section-label{break-after:avoid}.hpg-ref-footer{display:none!important}.hpg-ref-items thead{display:table-header-group}.hpg-ref-items tr,.hpg-ref-summary,.hpg-ref-parties,.hpg-ref-commercial,.hpg-ref-marks,.hpg-ref-payment,.hpg-ref-approvals{break-inside:avoid}.hpg-ref-approvals-section{break-inside:avoid}.hpg-ref-footer{break-inside:avoid}}

/* TERMS: texto largo con saltos de linea; la celda crece hacia abajo. */
.hpg-ref-commercial .hpg-ref-terms-cell strong{white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;font-weight:600}

/* 18-sep-2026: margen blanco arriba y abajo en TODAS las hojas (antes solo la primera, porque el
   margen era el relleno de la hoja) y pie de página en todas. Página con nombre propio para no
   tocar los otros formatos (solicitud de pago y ficha técnica siguen con su @page). El número de
   OC del pie lo agrega el formato en un <style> propio. */
@media print{@page vaak-po{size:A4;margin:12mm 11mm 15mm;@bottom-left{content:"HPG International Latinoamericana SAC · RUC 20600893123 · hpgilatam.com";font-family:Montserrat,Arial,sans-serif;font-size:7px;letter-spacing:.05em;color:#a9927a;vertical-align:top;padding-top:3mm}@bottom-right{content:"Page " counter(page) " of " counter(pages);font-family:Montserrat,Arial,sans-serif;font-size:7px;letter-spacing:.05em;color:#a9927a;vertical-align:top;padding-top:3mm}}}
/* Firmas compactas: las activa oc-impresion.js solo cuando así caben en la hoja anterior. */
.hpg-reference-po.po-approvals-compact .hpg-ref-approvals-section{margin-top:14px}.hpg-reference-po.po-approvals-compact .hpg-ref-approvals>div{min-height:var(--po-approval-min,0px);padding-top:10px;padding-bottom:10px}.hpg-reference-po.po-approvals-compact .hpg-ref-approvals p{min-height:14px;margin:5px 0}.hpg-reference-po.po-approvals-compact .hpg-ref-approvals i{margin-top:12px}.hpg-reference-po.po-approvals-compact .hpg-ref-approved-for>strong{margin:4px 0 10px}
/* Texto que escriben los usuarios en ITEM y DESCRIPTION: justificado, como un párrafo de Word. */
.hpg-ref-items td.hpg-ref-item-cell,.hpg-ref-items td.hpg-ref-desc-cell{text-align:justify;text-align-last:left;overflow-wrap:anywhere;word-break:break-word}.hpg-ref-items td.hpg-ref-item-cell>*,.hpg-ref-items td.hpg-ref-desc-cell>*{text-align:justify;text-align-last:left}
/* Sin columna IMAGE los anchos se corrían una columna: DESCRIPTION quedaba angosta y QTY enorme. */
.hpg-ref-items.hpg-ref-no-image th:nth-child(1){width:17%}.hpg-ref-items.hpg-ref-no-image th:nth-child(2){width:45%}.hpg-ref-items.hpg-ref-no-image th:nth-child(3){width:10%;text-align:right!important}.hpg-ref-items.hpg-ref-no-image th:nth-child(4){width:13%;text-align:right!important}.hpg-ref-items.hpg-ref-no-image th:nth-child(5){width:15%;text-align:right!important}
@media print{html,body.print-order,body.print-order #modal-root,body.print-order .modal,body.print-order .modal-body{background:#fff!important}}