*{box-sizing:border-box}:root{--bg:#f4f7fb;--panel:#fff;--text:#172033;--muted:#74809a;--border:#e6eaf1;--primary:#1769e0}body{margin:0;font-family:Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}a{color:var(--primary);text-decoration:none}.login-body{min-height:100vh;display:grid;place-items:center;padding:20px}.login-card{width:min(430px,100%);background:#fff;padding:30px;border-radius:16px;box-shadow:0 12px 40px #0001}.brand{font-size:28px;font-weight:800}.subtitle{color:var(--muted);margin:7px 0 20px}label{display:block;font-size:13px;font-weight:700;margin:12px 0 6px}input,select{width:100%;padding:11px;border:1px solid var(--border);border-radius:9px;background:#fff}button{width:100%;margin-top:16px;padding:12px;border:0;border-radius:9px;background:var(--primary);color:#fff;font-weight:800}.alert,.success{padding:12px;border-radius:9px;margin:12px 0}.alert{background:#fff0ef;color:#b42318}.success{background:#ecfdf3;color:#067647}.app{display:flex;min-height:100vh}.sidebar{width:245px;background:#12233f;color:#fff;padding:22px 16px}.side-brand{font-size:22px;font-weight:800;margin-bottom:20px}.side-user{padding:12px;background:#ffffff12;border-radius:10px;margin-bottom:16px}.side-user b,.side-user span{display:block}.side-user span{font-size:11px;color:#b8c4d8;margin-top:4px}nav a{display:block;color:#dce5f2;padding:10px 12px;border-radius:8px;margin:3px 0}nav a.active,nav a:hover{background:#1f3c67}.disabled{opacity:.45}.content{flex:1;padding:28px;min-width:0}.standalone{max-width:1200px;margin:auto}.topbar,.page-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px}.store-switcher{width:290px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.card,.panel{background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px;box-shadow:0 5px 20px #00000008}.card span{display:block;color:var(--muted);font-size:13px;margin-bottom:8px}.card strong{font-size:21px}.panel{margin-top:18px}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.full{grid-column:1/-1}.table-wrap{overflow:auto;margin-top:14px}table{width:100%;border-collapse:collapse}th,td{padding:10px;border-bottom:1px solid var(--border);text-align:left;white-space:nowrap}th{background:#f9fbfe;color:var(--muted);font-size:13px}.btn-link{padding:9px 13px;background:#fff;border:1px solid var(--border);border-radius:8px}.secondary{width:auto;background:#eef4ff;color:#1558b0}.small-btn{width:36px;margin:0;background:#fff0ef;color:#b42318}.totals{max-width:420px;margin:18px 0 0 auto}.totals>div,.invoice-total>div{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:7px 0}.grand{border-top:1px solid var(--border);font-size:19px}.invoice{max-width:850px;margin:28px auto;background:#fff;padding:28px;border-radius:14px}.invoice-head{display:flex;justify-content:space-between;gap:20px}.invoice-total{max-width:360px;margin:18px 0 0 auto}.print-actions{max-width:850px;margin:18px auto;display:flex;gap:10px}.print-actions button{width:auto;margin:0}@media(max-width:850px){.cards{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.app{display:block}.sidebar{width:100%}.content{padding:16px}.cards,.form-grid{grid-template-columns:1fr}.topbar,.page-head,.invoice-head{display:block}.store-switcher{width:100%;margin-top:15px}.full{grid-column:auto}}@media print{.print-actions{display:none}.invoice{margin:0;max-width:none;border-radius:0}}
.dacx-invoice{font-size:14px}.nota-header{text-align:center;border-bottom:2px solid #222;padding-bottom:10px}.nota-header h1{margin:0 0 5px}.nota-title{text-align:center;text-transform:uppercase;margin:14px 0}.nota-info{display:grid;grid-template-columns:1fr 1fr;gap:30px;line-height:1.7}.nota-table{margin-top:14px}.nota-table th{background:#f2f2f2;color:#222}.nota-section{margin-top:16px;border-top:1px solid #aaa;padding-top:9px}.payment-box{max-width:470px;margin-left:auto}.pay-row{display:flex;justify-content:space-between;gap:20px;padding:4px 0}.status-line{border-top:1px solid #aaa;margin-top:5px;padding-top:8px}.signature{display:grid;grid-template-columns:1fr 1fr;text-align:center;margin:28px 0}.notes{font-size:12px}.payment-form{margin-top:18px}.no-print{}@media print{.no-print,.print-actions{display:none!important}.dacx-invoice{font-size:12px}.nota-header h1{font-size:20px}}@media(max-width:650px){.nota-info{grid-template-columns:1fr}.signature{grid-template-columns:1fr 1fr}}

/* ===== CETAK NOTA RESMI DACXTOP: A5 LANDSCAPE ===== */
@page{
  size:A5 landscape;
  margin:5mm;
}
@media print{
  html,body{
    width:210mm;
    height:148mm;
    margin:0!important;
    padding:0!important;
    background:#fff!important;
  }
  .print-actions,.no-print{display:none!important}
  .dacx-invoice{
    width:200mm!important;
    max-width:200mm!important;
    min-height:0!important;
    margin:0!important;
    padding:3mm 4mm!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    font-size:8.5pt!important;
    line-height:1.18!important;
    color:#000!important;
    page-break-inside:avoid;
  }
  .nota-header{padding-bottom:1.5mm!important}
  .nota-header h1{font-size:13pt!important;margin:0 0 1mm!important}
  .nota-header div{font-size:8pt!important;line-height:1.15!important}
  .nota-title{font-size:11pt!important;margin:2mm 0!important}
  .nota-info{
    grid-template-columns:1fr 1fr!important;
    gap:6mm!important;
    line-height:1.3!important;
    font-size:8pt!important;
  }
  .nota-table{margin-top:2mm!important}
  .nota-table th,.nota-table td{
    padding:1.1mm 1.5mm!important;
    font-size:8pt!important;
    line-height:1.12!important;
  }
  .nota-section{margin-top:2mm!important;padding-top:1.2mm!important}
  .payment-box{
    max-width:78mm!important;
    margin-left:auto!important;
    font-size:8pt!important;
  }
  .pay-row{padding:.5mm 0!important}
  .signature{margin:3mm 0 2mm!important;font-size:8pt!important}
  .notes{
    font-size:6.7pt!important;
    line-height:1.12!important;
    margin-top:1.5mm!important;
    padding-top:1mm!important;
  }
  .notes ol{margin:1mm 0 0 5mm!important;padding-left:3mm!important}
  .notes li{margin:0 0 .5mm!important}
}

/* ===== FIX2: NOTA A5 LEBIH RAPI / MENDEKATI FORMAT DACXTOP LAMA ===== */
.dacx-invoice{
  border:1px solid #222;
}
.nota-header{
  border-bottom:2px solid #111;
}
.nota-title{
  letter-spacing:.4px;
}
.nota-info{
  border-bottom:1px solid #222;
  padding-bottom:8px;
}
.nota-table{
  border:1px solid #222;
}
.nota-table th,.nota-table td{
  border:1px solid #555;
}
.nota-table th{
  font-weight:700;
  text-align:center;
}
.nota-table td:nth-child(1),
.nota-table td:nth-child(3){
  text-align:center;
}
.nota-table td:nth-child(4),
.nota-table td:nth-child(5){
  text-align:right;
}
.payment-box{
  border:1px solid #555;
  padding:8px 10px;
}
.payment-box>b{
  display:block;
  border-bottom:1px solid #777;
  padding-bottom:5px;
  margin-bottom:4px;
}
.status-line strong{
  font-size:1.08em;
}
.signature{
  border-top:1px solid #aaa;
  padding-top:8px;
}
.notes{
  border-top:1px solid #555;
}
@media print{
  .dacx-invoice{
    border:1px solid #111!important;
  }
  .nota-info{
    padding-bottom:1.5mm!important;
  }
  .nota-table{
    border-collapse:collapse!important;
  }
  .nota-table th,.nota-table td{
    border:.25mm solid #444!important;
  }
  .payment-box{
    border:.25mm solid #444!important;
    padding:1.2mm 2mm!important;
  }
  .signature{
    padding-top:1.5mm!important;
  }
}

.report-cards{grid-template-columns:repeat(2,1fr);margin-top:14px}
.card small{display:block;color:var(--muted);margin-top:6px}
@media(max-width:650px){.report-cards{grid-template-columns:1fr}}

.delivery-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px;border-top:1px solid #777;padding-top:8px}
.delivery-print .nota-table td:nth-child(4){text-align:center}
@media print{.delivery-meta{gap:3mm;margin-top:2mm;padding-top:1.5mm;font-size:8pt}.delivery-print .signature{margin-top:4mm!important}}

.check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:8px}
.check-item{display:flex;align-items:center;gap:8px;border:1px solid var(--border);padding:9px;border-radius:8px;margin:0;font-weight:500}
.check-item input{width:auto}
.mini-form{display:grid;gap:7px;margin-top:8px;min-width:260px}
details{margin-bottom:5px}
summary{cursor:pointer;color:var(--primary);font-weight:700}
@media(max-width:650px){.check-grid{grid-template-columns:1fr}}

textarea{width:100%;padding:11px;border:1px solid var(--border);border-radius:9px;background:#fff;font-family:inherit}
.nota-logo{max-height:13mm;max-width:35mm;object-fit:contain;margin-bottom:1mm}
.backup-button{display:inline-block;background:var(--primary);color:#fff;padding:12px 18px;border-radius:9px;font-weight:800}
.dashboard-grid{display:grid;grid-template-columns:2fr 1fr;gap:16px}
.section-title{display:flex;justify-content:space-between;align-items:center;margin-top:24px;margin-bottom:2px}
.section-title h2{margin:0}.section-title span{color:var(--muted)}
@media(max-width:850px){.dashboard-grid{grid-template-columns:1fr}}
@media print{.nota-logo{max-height:10mm!important;max-width:30mm!important}}

/* ===== STANDAR CETAK BARU: A4 PORTRAIT, NOTA DI SETENGAH BAGIAN ATAS ===== */
@page{
  size:A4 portrait;
  margin:0;
}
@media print{
  html,body{
    width:210mm!important;
    height:297mm!important;
    margin:0!important;
    padding:0!important;
    background:#fff!important;
  }
  .print-actions,.no-print{display:none!important}
  .dacx-invoice{
    box-sizing:border-box!important;
    width:200mm!important;
    max-width:200mm!important;
    min-height:0!important;
    max-height:143mm!important;
    margin:5mm 5mm 0 5mm!important;
    padding:4mm 5mm!important;
    border:.3mm solid #111!important;
    border-radius:0!important;
    box-shadow:none!important;
    font-size:10pt!important;
    line-height:1.22!important;
    overflow:hidden!important;
    page-break-inside:avoid!important;
  }
  .nota-logo{max-height:12mm!important;max-width:34mm!important;margin-bottom:1mm!important}
  .nota-header{padding-bottom:2mm!important}
  .nota-header h1{font-size:16pt!important;margin:0 0 1mm!important}
  .nota-header div{font-size:9pt!important;line-height:1.2!important}
  .nota-title{font-size:13pt!important;margin:2mm 0!important}
  .nota-info{
    grid-template-columns:1fr 1fr!important;
    gap:8mm!important;
    font-size:9.5pt!important;
    line-height:1.35!important;
    padding-bottom:2mm!important;
  }
  .nota-table{margin-top:2mm!important;border-collapse:collapse!important}
  .nota-table th,.nota-table td{
    padding:1.5mm 2mm!important;
    font-size:9.5pt!important;
    line-height:1.18!important;
    border:.25mm solid #444!important;
  }
  .nota-section{margin-top:2.5mm!important;padding-top:1.5mm!important}
  .payment-box{
    max-width:88mm!important;
    font-size:9.5pt!important;
    padding:1.5mm 2.5mm!important;
  }
  .pay-row{padding:.7mm 0!important}
  .signature{
    margin:4mm 0 2mm!important;
    font-size:9pt!important;
    padding-top:1.5mm!important;
  }
  .notes{
    font-size:7.8pt!important;
    line-height:1.18!important;
    margin-top:2mm!important;
    padding-top:1.2mm!important;
  }
  .delivery-meta{
    gap:4mm!important;
    margin-top:2.5mm!important;
    padding-top:1.5mm!important;
    font-size:9pt!important;
  }
}

/* ===== FIX4 LAYOUT NOTA + DASHBOARD ===== */
.side-brand-with-logo{
  display:flex;
  align-items:center;
  gap:10px;
}
.sidebar-logo{
  width:34px;
  height:34px;
  object-fit:contain;
  border-radius:7px;
  flex:0 0 34px;
}

/* lebar kolom nota */
.nota-table .col-no{width:5%}
.nota-table .col-item{width:49%}
.nota-table .col-qty{width:10%}
.nota-table .col-price{width:18%}
.nota-table .col-subtotal{width:18%}

.nota-table th:nth-child(1),
.nota-table td:nth-child(1){
  text-align:center;
  padding-left:4px;
  padding-right:4px;
}
.nota-table th:nth-child(2),
.nota-table td:nth-child(2){
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:normal;
}
.nota-table th:nth-child(3),
.nota-table td:nth-child(3){
  text-align:center;
}
.nota-table th:nth-child(4),
.nota-table td:nth-child(4),
.nota-table th:nth-child(5),
.nota-table td:nth-child(5){
  text-align:right;
}

/* tanda tangan kiri, pembayaran kanan */
.payment-signature-row{
  display:grid;
  grid-template-columns:1fr 0.82fr;
  gap:18px;
  align-items:start;
  margin-top:8px;
}
.payment-signature-row .payment-box{
  margin:0;
  max-width:none;
}
.signature-left{
  margin:0;
  padding-top:8px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  text-align:center;
  align-self:end;
}
.signature-left > div{
  min-width:0;
}
.signature-space{
  height:48px;
}
@media(max-width:650px){
  .payment-signature-row{grid-template-columns:1fr}
  .signature-left{order:2}
  .payment-signature-row .payment-box{order:1}
}

.purchase-total{text-align:right;font-size:18px;margin:14px 0;font-weight:700}

.return-total-info{
  text-align:right;
  font-size:16px;
  margin:12px 0 4px;
  font-weight:600;
}

.report-summary{
  grid-template-columns:repeat(5,minmax(0,1fr));
  margin-top:16px;
}
.report-two-col{
  display:grid;
  grid-template-columns:1.4fr .8fr;
  gap:16px;
}
.report-key-table{
  width:100%;
}
.report-key-table td{
  padding:9px 4px;
  border-bottom:1px solid var(--border);
}
.report-key-table td:last-child{
  text-align:right;
}
.report-print-header{
  display:none;
}
.page-break-before{
  break-before:auto;
}
@media(max-width:1100px){
  .report-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .report-two-col{grid-template-columns:1fr}
}
@media print{
  @page{size:A4 portrait;margin:8mm}
  body{background:#fff!important}
  .no-print,.sidebar{display:none!important}
  .content,.standalone,.report-page{
    max-width:none!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
  }
  .report-print-header{
    display:block!important;
    text-align:center;
    margin-bottom:5mm;
  }
  .report-print-header h1{
    margin:0 0 2mm;
    font-size:16pt;
  }
  .cards.report-summary{
    display:grid!important;
    grid-template-columns:repeat(2,1fr)!important;
    gap:2mm!important;
  }
  .card,.panel{
    box-shadow:none!important;
    border:1px solid #aaa!important;
    border-radius:0!important;
    padding:3mm!important;
    margin-top:3mm!important;
  }
  .card strong{font-size:11pt!important}
  .card span,.card small{font-size:8pt!important}
  h2{font-size:11pt!important;margin:0 0 2mm!important}
  table{font-size:7.5pt!important}
  th,td{
    padding:1.2mm!important;
    white-space:normal!important;
  }
  .report-two-col{
    display:grid!important;
    grid-template-columns:1.35fr .65fr!important;
    gap:3mm!important;
  }
  .page-break-before{
    break-before:page!important;
  }
  .table-wrap{overflow:visible!important}
}

.wrap-cell{white-space:normal!important;min-width:260px;max-width:500px}

.btn-danger-link{display:inline-block;padding:9px 12px;background:#b42318;color:#fff!important;text-decoration:none;border-radius:7px;font-weight:700}

.po-status-waiting{background:#fff7e6}
.po-status-arrived{background:#eef6ff}
.po-status-ready{background:#ecfdf3}

.po-payment-summary{max-width:560px;margin:10px 0 18px}
.po-payment-summary>div,.po-after{display:flex;justify-content:space-between;gap:20px;padding:9px 0;border-bottom:1px solid #ddd}
.po-payment-summary .po-remain{font-size:1.12em;font-weight:700}
.po-after{max-width:560px;margin:12px 0 18px;font-size:1.08em}

.customer-pick{display:flex;gap:7px;align-items:stretch}.customer-pick select{flex:1;min-width:0}.qc-add{white-space:nowrap;padding:7px 10px}
.qc-modal{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:9999;display:flex;align-items:center;justify-content:center;padding:16px}
.qc-modal[hidden]{display:none}.qc-box{background:#fff;width:min(460px,100%);border-radius:12px;padding:18px;box-shadow:0 18px 60px rgba(0,0,0,.25)}
.qc-head{display:flex;justify-content:space-between;align-items:center;font-size:18px;margin-bottom:12px}.qc-head button{width:34px;height:34px;padding:0}
.qc-box label{display:block;margin-top:9px}.qc-box input{width:100%;box-sizing:border-box}.qc-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:15px}.qc-msg{min-height:20px;margin-top:10px;font-size:13px}
@media(max-width:620px){.customer-pick{flex-direction:column}.qc-add{width:100%}}