/* public/css/pos.css — POS / Balcão (busca no topo) */
.pos-wrap{ display:flex; flex-direction:column; gap:1rem; min-height:calc(100vh - 110px); }

/* ─── Caixa de pesquisa no topo, full-width ─── */
.pos-search-box{
  background:#fff; border:1px solid var(--gray-200); border-radius:var(--radius);
  padding:1rem 1.25rem; box-shadow:var(--shadow-sm);
  position:sticky; top:1rem; z-index:50;
}
.pos-search-input-wrap{ position:relative; }
.pos-search-input-wrap .bi-search{
  position:absolute; left:1rem; top:50%; transform:translateY(-50%);
  color:var(--gray-500); font-size:1.1rem; pointer-events:none;
}
.pos-search-input-wrap input{
  width:100%; font-size:1.05rem; padding:.75rem 1rem .75rem 2.6rem;
  border:1.5px solid var(--gray-200); border-radius:10px;
  transition:all .15s;
}
.pos-search-input-wrap input:focus{
  outline:none; border-color:var(--blue-500);
  box-shadow:0 0 0 3px rgba(38,145,209,.18);
}

/* Dropdown de resultados absoluto */
.pos-results-dropdown{
  position:absolute; left:0; right:0; top:calc(100% + .5rem);
  background:#fff; border:1px solid var(--gray-200); border-radius:10px;
  box-shadow:0 16px 40px -12px rgba(0,0,0,.25);
  max-height:420px; overflow-y:auto; z-index:100;
  display:none;
}
.pos-results-dropdown.on{ display:block; }
.pos-result{
  padding:.7rem 1rem; cursor:pointer; transition:background .12s;
  border-bottom:1px solid var(--gray-100);
}
.pos-result:last-child{ border-bottom:0; }
.pos-result:hover, .pos-result.kbd-hover{ background:var(--blue-50); }
.pos-result .nome{ font-weight:700; color:var(--gray-900); font-size:.95rem; }
.pos-result .meta{ font-size:.8rem; color:var(--gray-500); }

.pos-search-hint{
  margin-top:.5rem; font-size:.78rem; color:var(--gray-500);
}

/* ─── Conteúdo principal ─── */
.pos-main{ display:flex; flex-direction:column; gap:1rem; }

.pos-hero{
  background:linear-gradient(135deg,#125f96 0%, #0a3a5e 100%); color:#fff;
  border-radius:var(--radius); padding:1.25rem 1.5rem;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem;
}
.pos-hero .nome{ font-size:1.4rem; font-weight:800; }
.pos-hero .meta{ opacity:.85; font-size:.85rem; }
.pos-hero .saldo{ text-align:right; }
.pos-hero .saldo .lbl{ text-transform:uppercase; font-size:.7rem; letter-spacing:.05em; opacity:.85; }
.pos-hero .saldo .val{ font-size:1.8rem; font-weight:900; line-height:1; }
.pos-hero .saldo .val.divida{ color:#fecaca; }
.pos-hero .saldo .val.ok{ color:#86efac; }
.pos-hero .acts{ display:flex; gap:.5rem; flex-wrap:wrap; }
.pos-hero .acts .btn{ background:rgba(255,255,255,.15); color:#fff; border:1px solid rgba(255,255,255,.3); }
.pos-hero .acts .btn:hover{ background:rgba(255,255,255,.25); }

.pos-kpi-row{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:.75rem; }
.pos-kpi{
  background:#fff; border:1px solid var(--gray-200); border-radius:10px; padding:.7rem .9rem;
}
.pos-kpi .lbl{ font-size:.7rem; text-transform:uppercase; color:var(--gray-500); font-weight:700; }
.pos-kpi .val{ font-size:1.05rem; font-weight:800; color:var(--gray-900); }

.pos-tabs{ display:flex; gap:.4rem; flex-wrap:wrap; }
.pos-tabs button{
  border:1px solid var(--gray-200); background:#fff; color:var(--gray-700);
  padding:.5rem 1rem; border-radius:.5rem; font-weight:600; font-size:.85rem; cursor:pointer;
}
.pos-tabs button.on{ background:var(--blue-700); color:#fff; border-color:var(--blue-700); }

.pos-section{ display:none; }
.pos-section.on{ display:block; }

.pos-empty{
  background:#fff; border:2px dashed var(--gray-300); border-radius:var(--radius);
  padding:3rem 2rem; text-align:center; color:var(--gray-500);
}
.pos-empty i{ font-size:3rem; opacity:.4; }

.estado-badge{ padding:.18rem .5rem; border-radius:.35rem; font-size:.7rem; font-weight:700; text-transform:uppercase; }
.estado-pendente{ background:#fef3c7; color:#92400e; }
.estado-paga{ background:#dcfce7; color:#166534; }
.estado-vencida{ background:#fee2e2; color:#b91c1c; }
.estado-parcial{ background:#dbeafe; color:#1e40af; }
.estado-anulada{ background:#f1f5f9; color:#475569; }

/* ─── Modal de Pagamento — detalhes completos ─── */
.pag-header-card{
  display:flex; justify-content:space-between; align-items:center;
  background:linear-gradient(135deg,#0c4a6e 0%,#155e75 100%);
  color:#fff; border-radius:12px; padding:1rem 1.25rem; margin-top:.25rem;
  box-shadow:0 8px 20px -8px rgba(12,74,110,.45);
}
.pag-header-card .muted{ color:#bae6fd !important; opacity:.85; }
.pag-numero{ font-size:1.4rem; font-weight:800; letter-spacing:.5px; }
.pag-saldo{ font-size:1.6rem; font-weight:800; color:#fff; }
.pag-saldo.zero{ color:#bbf7d0; }

.pag-section{
  background:#f8fafc; border:1px solid var(--gray-200);
  border-radius:10px; padding:.9rem 1rem; height:100%;
}
.pag-section-title{
  font-weight:700; font-size:.82rem; text-transform:uppercase;
  letter-spacing:.5px; color:var(--gray-700); margin-bottom:.6rem;
  display:flex; align-items:center; gap:.4rem;
}
.pag-section-title i{ color:var(--blue-500); }

/* Definition list para metadata */
.pag-dl{ display:grid; grid-template-columns:max-content 1fr; gap:.35rem 1rem; margin:0; font-size:.88rem; }
.pag-dl dt{ color:var(--gray-500); font-weight:500; }
.pag-dl dd{ margin:0; color:var(--gray-900); font-weight:600; word-break:break-word; }

/* Leitura grid */
.pag-leitura-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; text-align:center; }
.pag-leitura-grid > div{ background:#fff; border:1px solid var(--gray-200); border-radius:8px; padding:.6rem; }
.pag-leitura-val{ font-size:1.15rem; font-weight:700; color:var(--gray-900); }

/* Decomposição do valor */
.pag-decomp{ font-size:.88rem; }
.pag-decomp .row-l{
  display:flex; justify-content:space-between; padding:.25rem 0;
  border-bottom:1px dashed var(--gray-200);
}
.pag-decomp .row-l:last-child{ border-bottom:0; }
.pag-decomp .row-l .lbl{ color:var(--gray-600); }
.pag-decomp .row-l .val{ font-weight:600; color:var(--gray-900); }
.pag-decomp .row-l.total{ margin-top:.4rem; padding-top:.5rem; border-top:2px solid var(--gray-300); border-bottom:0; }
.pag-decomp .row-l.total .lbl{ color:#065f46; font-weight:700; }
.pag-decomp .row-l.total .val{ color:#065f46; font-weight:800; font-size:1.05rem; }
.pag-decomp .row-l.desconto .val{ color:#b45309; }

/* Histórico de pagamentos */
.pag-hist{ max-height:170px; overflow-y:auto; font-size:.85rem; }
.pag-hist .pag-hist-item{
  display:grid; grid-template-columns:1fr auto; gap:.2rem 1rem;
  padding:.45rem .6rem; background:#fff; border:1px solid var(--gray-200);
  border-radius:8px; margin-bottom:.4rem;
}
.pag-hist .pag-hist-item:last-child{ margin-bottom:0; }
.pag-hist .hist-data{ font-weight:700; color:var(--gray-900); }
.pag-hist .hist-met{ color:var(--gray-600); font-size:.78rem; text-transform:capitalize; }
.pag-hist .hist-val{ font-weight:700; color:#15803d; }
.pag-hist .hist-obs{ grid-column:1 / -1; font-size:.78rem; color:var(--gray-500); }
.pag-hist-empty{ color:var(--gray-500); font-size:.85rem; text-align:center; padding:.6rem; }
.pag-hist-totais{
  margin-top:.6rem; display:flex; justify-content:space-between;
  font-size:.85rem; font-weight:700; color:var(--gray-700);
  padding-top:.5rem; border-top:1px solid var(--gray-200);
}

.pag-form-section{
  margin-top:1rem; background:#fffbeb; border:1px solid #fde68a;
  border-radius:10px; padding:1rem 1.1rem;
}
.pag-form-section .pag-section-title{
  color:#92400e; display:flex; align-items:center; gap:.5rem; flex-wrap:wrap;
}
.pag-form-section .pag-section-title i{ color:#d97706; }
.pag-multi-hint{
  font-size:.78rem; color:#92400e; opacity:.85; font-weight:500;
  margin-left:.5rem;
}

/* ── Uniformiza altura de todos os inputs/selects no formulário ── */
.pag-form-section .form-control,
.pag-form-section .form-select{
  height: 44px;            /* mesma altura para inputs e selects */
  font-size:.95rem;
  padding:.45rem .75rem;
  border-radius:8px;
}
.pag-form-section .form-control:focus,
.pag-form-section .form-select:focus{
  border-color:var(--blue-500);
  box-shadow:0 0 0 3px rgba(38,145,209,.18);
}
.pag-form-section .form-label{
  font-size:.78rem; font-weight:600; color:#92400e;
  text-transform:uppercase; letter-spacing:.4px;
  margin-bottom:.3rem;
}

/* ── Linhas de pagamento (multi-método) ── */
.pag-linhas{ display:flex; flex-direction:column; gap:.55rem; margin-bottom:.6rem; }
.pag-linha{
  display:grid;
  grid-template-columns: 1fr 1.2fr 1.5fr auto;
  gap:.5rem; align-items:end;
  background:#fff; border:1px solid #fde68a; border-radius:10px;
  padding:.6rem .75rem;
  transition: border-color .15s, box-shadow .15s;
}
.pag-linha.invalid{ border-color:#fca5a5; background:#fef2f2; }
.pag-linha .ln-field{ display:flex; flex-direction:column; }
.pag-linha .ln-field > label{
  font-size:.7rem; font-weight:600; color:#92400e;
  text-transform:uppercase; letter-spacing:.4px;
  margin-bottom:.25rem;
}
.pag-linha .ln-field .form-control,
.pag-linha .ln-field .form-select{
  height: 40px; font-size:.9rem;
}
.pag-linha .ln-remove{
  height: 40px; width: 40px; border-radius:8px;
  border:1px solid #fecaca; background:#fff; color:#dc2626;
  display:grid; place-items:center; transition:background .12s;
}
.pag-linha .ln-remove:hover{ background:#fee2e2; }
.pag-linha .ln-remove:disabled{ opacity:.4; cursor:not-allowed; }

@media (max-width: 720px){
  .pag-linha{ grid-template-columns: 1fr 1fr; }
  .pag-linha .ln-remove{ grid-column:2; justify-self:end; }
}

.pag-linhas-actions{
  display:flex; justify-content:space-between; align-items:center; gap:.75rem;
  margin: .25rem 0 .75rem;
}
.pag-linhas-actions .pag-parcial{ margin:0; }
.pag-linhas-actions .pag-parcial label{ font-size:.8rem; color:#78350f; }

.pag-sumario{
  background:#fff; border:1px dashed #fde68a; border-radius:10px;
  padding:.65rem .9rem; margin-bottom:.5rem;
  display:flex; flex-wrap:wrap; gap:1.2rem;
  font-size:.85rem; color:#78350f;
}
.pag-sumario .lbl{ color:#a16207; }
.pag-sumario strong{ color:#92400e; font-size:.95rem; }
.pag-sumario.over strong#pagSomaLinhas{ color:#dc2626; }
.pag-sumario.exact strong#pagSomaLinhas{ color:#15803d; }

/* ── Histórico: realçar pagamentos do mesmo recibo (misto) ── */
.pag-hist .hist-recibo{
  font-size:.72rem; color:var(--blue-600); font-weight:600;
  display:inline-block; padding:1px 6px; border-radius:6px;
  background:rgba(38,145,209,.1); margin-left:.3rem;
}
.pag-hist .pag-hist-item.misto{
  border-left:3px solid #f59e0b; padding-left:.7rem;
}

html[data-theme="dark"] .pag-form-section{ background:rgba(245, 158, 11, .08); border-color:rgba(245, 158, 11, .25); }
html[data-theme="dark"] .pag-linha{ background:rgba(255,255,255,.04); border-color:rgba(245, 158, 11, .25); }
html[data-theme="dark"] .pag-sumario{ background:rgba(255,255,255,.04); }

/* ── Scroll fluido no modal de Receber Pagamento ── */
#modalPagamento .modal-dialog{
  max-height: calc(100vh - 2rem);
  margin-top: 1rem;
  margin-bottom: 1rem;
}
#modalPagamento .modal-content{
  max-height: calc(100vh - 2rem);
  display: flex;
  flex-direction: column;
}
#modalPagamento .modal-body{
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  max-height: calc(100vh - 12rem);
  scrollbar-width: thin;
}
#modalPagamento .modal-body::-webkit-scrollbar{ width: 8px; }
#modalPagamento .modal-body::-webkit-scrollbar-thumb{
  background: rgba(38,145,209,.35); border-radius: 4px;
}
#modalPagamento .modal-body::-webkit-scrollbar-track{ background: transparent; }

/* Mesmo no modal de recibo */
#modalRecibo .modal-dialog{
  max-height: calc(100vh - 2rem);
  margin-top: 1rem; margin-bottom: 1rem;
}
#modalRecibo .modal-content{ max-height: calc(100vh - 2rem); display:flex; flex-direction:column; }
#modalRecibo .modal-body{
  overflow-y:auto; -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

/* ── Preview do recibo (modal pós-pagamento) ── */
.recibo-preview{
  font-family: 'Inter', system-ui, sans-serif;
  background:#fff; color:#111827;
  padding:1.5rem 1.75rem;
}
.recibo-preview .rc-header{
  display:flex; justify-content:space-between; align-items:flex-start;
  padding-bottom:.85rem; margin-bottom:.85rem;
  border-bottom:2px solid #0a3a5e;
}
.recibo-preview .rc-brand .name{
  font-size:1.4rem; font-weight:800; color:#0a3a5e; letter-spacing:.5px;
}
.recibo-preview .rc-brand .sub{
  font-size:.78rem; color:#64748b;
}
.recibo-preview .rc-title{
  font-size:1.1rem; font-weight:700; color:#0a3a5e;
  text-transform:uppercase; letter-spacing:.5px;
}
.recibo-preview .rc-number{
  font-size:.85rem; color:#64748b; font-weight:600;
}

.recibo-preview .rc-grid{
  display:grid; grid-template-columns: 1fr 1fr; gap:.85rem 1.5rem;
  margin-bottom:1.1rem;
}
.recibo-preview .rc-field .lbl{
  font-size:.68rem; color:#64748b; text-transform:uppercase;
  font-weight:700; letter-spacing:.5px; margin-bottom:.15rem;
}
.recibo-preview .rc-field .val{
  font-size:.95rem; color:#111827; font-weight:600;
}

.recibo-preview .rc-table{
  width:100%; border-collapse:collapse; margin:1rem 0 .8rem;
}
.recibo-preview .rc-table thead th{
  background:#e2f1fb; color:#0a3a5e; font-size:.78rem;
  font-weight:700; padding:.5rem .65rem; text-align:left;
  text-transform:uppercase; letter-spacing:.4px;
}
.recibo-preview .rc-table thead th.right,
.recibo-preview .rc-table tbody td.right{ text-align:right; }
.recibo-preview .rc-table tbody td{
  padding:.55rem .65rem; font-size:.9rem; color:#111827;
  border-bottom:1px solid #e2e8f0;
}
.recibo-preview .rc-table tbody tr:last-child td{ border-bottom:0; }
.recibo-preview .rc-table .met-badge{
  display:inline-block; padding:2px 8px; border-radius:6px;
  font-size:.72rem; font-weight:600; text-transform:capitalize;
  background:#dbeafe; color:#1e40af;
}
.recibo-preview .rc-table .met-badge.numerario{ background:#dcfce7; color:#166534; }
.recibo-preview .rc-table .met-badge.mpesa{ background:#fee2e2; color:#991b1b; }
.recibo-preview .rc-table .met-badge.emola{ background:#fef3c7; color:#92400e; }
.recibo-preview .rc-table .met-badge.transferencia{ background:#e0e7ff; color:#3730a3; }
.recibo-preview .rc-table .met-badge.cartao{ background:#cffafe; color:#155e75; }
.recibo-preview .rc-table .met-badge.cheque{ background:#fce7f3; color:#9d174d; }

.recibo-preview .rc-total-row{
  display:flex; justify-content:space-between; align-items:center;
  background:linear-gradient(135deg,#0a3a5e,#125f96); color:#fff;
  padding:.65rem 1rem; border-radius:8px; margin-top:.5rem;
}
.recibo-preview .rc-total-row .lbl{ font-size:.85rem; font-weight:700; letter-spacing:.5px; }
.recibo-preview .rc-total-row .val{ font-size:1.25rem; font-weight:800; }

.recibo-preview .rc-misto-note{
  margin-top:.65rem; padding:.45rem .7rem;
  background:#fef3c7; border:1px solid #fcd34d; border-radius:6px;
  font-size:.78rem; color:#78350f; font-style:italic;
}

/* Barcode */
.recibo-preview .rc-barcode{
  margin-top:1.25rem; padding:.85rem; background:#fff;
  border:1px dashed #cbd5e1; border-radius:8px;
  text-align:center;
}
.recibo-preview .rc-barcode svg{ display:block; margin:0 auto; max-width:100%; height:auto; }
.recibo-preview .rc-barcode .bc-text{
  margin-top:.35rem; font-family:'Courier New', monospace;
  font-size:.85rem; color:#374151; letter-spacing:2px;
}

.recibo-preview .rc-footer{
  margin-top:1.1rem; padding-top:.75rem;
  border-top:1px solid #e2e8f0; text-align:center;
  font-size:.72rem; color:#64748b;
}

/* ═══════════════════════ Contentor de impressão (clone) ═══════════════════════ */
/* O #printRoot está escondido no ecrã e só aparece no print. */
#printRoot{ display:none; }

@media print {
  /* Esconder TUDO por defeito; só o printRoot fica visível */
  body.printing-a4 > *, body.printing-thermal > * { display:none !important; }
  body.printing-a4 > #printRoot,
  body.printing-thermal > #printRoot { display:block !important; }

  body.printing-a4, body.printing-thermal{
    margin:0 !important; padding:0 !important; background:#fff;
  }
  html { background:#fff; }
}

/* ═══════════════════════ Impressão A4 ═══════════════════════ */
@media print {
  body.printing-a4 #printRoot{
    width: 100%;
    padding: 0;
  }
  body.printing-a4 .print-clone{
    width: 180mm; margin: 0 auto;
  }
  @page { size: A4; margin: 12mm; }
}

/* ═══════════════════════ Impressão Térmica 80 mm ═══════════════════════ */
@media print {
  @page { size: 80mm auto; margin: 0; }

  body.printing-thermal #printRoot{
    width: 80mm; margin: 0; padding: 0;
  }
  body.printing-thermal .print-clone.thermal{
    width: 76mm; padding: 3mm 2mm; font-size: 10pt; line-height: 1.3;
    color: #000; box-shadow: none; border: none;
    font-family: 'Inter', Arial, sans-serif;
  }
  /* Cabeçalho centrado em coluna */
  body.printing-thermal .print-clone.thermal .rc-header{
    display:block !important; text-align: center;
    border-bottom: 1px dashed #000; padding-bottom: 2mm; margin-bottom: 2mm;
  }
  body.printing-thermal .print-clone.thermal .rc-brand .name{ font-size: 14pt; font-weight: 800; }
  body.printing-thermal .print-clone.thermal .rc-brand .sub{ font-size: 8pt; }
  body.printing-thermal .print-clone.thermal .rc-title{ font-size: 11pt; font-weight: 700; margin-top: 1.5mm; }
  body.printing-thermal .print-clone.thermal .rc-number{ font-size: 10pt; font-weight: 700; }
  body.printing-thermal .print-clone.thermal .text-end{ text-align: center !important; }

  /* Cliente / Fatura / Data em pares chave:valor em linhas */
  body.printing-thermal .print-clone.thermal .rc-grid{
    display:block !important; margin-bottom: 2mm;
  }
  body.printing-thermal .print-clone.thermal .rc-field{
    display:flex !important; justify-content:space-between; gap:2mm;
    border-bottom: 1px dotted #888; padding: 1mm 0;
  }
  body.printing-thermal .print-clone.thermal .rc-field .lbl{
    font-size: 8pt; color:#000; letter-spacing: 0; text-transform: uppercase;
    font-weight: 700; margin: 0;
  }
  body.printing-thermal .print-clone.thermal .rc-field .val{
    font-size: 9pt; font-weight: 600; text-align: right;
  }

  /* Tabela de métodos */
  body.printing-thermal .print-clone.thermal .rc-table{
    width: 100% !important; margin: 2mm 0;
    border-top: 1px dashed #000; border-bottom: 1px dashed #000;
    border-collapse: collapse;
  }
  body.printing-thermal .print-clone.thermal .rc-table thead th{
    background: transparent !important; color: #000 !important; font-size: 8pt;
    padding: 1mm; border-bottom: 1px solid #000;
  }
  body.printing-thermal .print-clone.thermal .rc-table tbody td{
    padding: 1mm; font-size: 9pt; border-bottom: 1px dotted #ccc;
  }
  body.printing-thermal .print-clone.thermal .rc-table .met-badge{
    background: transparent !important; color: #000 !important;
    padding: 0 !important; font-size: 9pt; font-weight: 700;
    border: none;
  }

  /* Total destacado */
  body.printing-thermal .print-clone.thermal .rc-total-row{
    background: #000 !important; color: #fff !important;
    padding: 2mm 2.5mm; margin: 2mm 0; border-radius: 0;
    display:flex !important; justify-content:space-between !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    color-adjust: exact !important;
  }
  body.printing-thermal .print-clone.thermal .rc-total-row .lbl{ font-size: 10pt; color:#fff !important; }
  body.printing-thermal .print-clone.thermal .rc-total-row .val{ font-size: 13pt; font-weight: 800; color:#fff !important; }

  body.printing-thermal .print-clone.thermal .rc-misto-note{
    background: transparent !important; border: 1px dashed #000 !important;
    color: #000 !important; padding: 1.5mm; margin: 2mm 0;
    font-size: 8pt; text-align: center;
  }

  /* Barcode largura total */
  body.printing-thermal .print-clone.thermal .rc-barcode{
    border: none; padding: 2mm 0 1mm; margin: 2mm 0 1mm;
    border-top: 1px dashed #000;
    text-align: center;
  }
  body.printing-thermal .print-clone.thermal .rc-barcode svg{
    width: 72mm !important; height: 14mm !important; max-width: 72mm;
  }
  body.printing-thermal .print-clone.thermal .rc-barcode .bc-text{
    font-size: 8pt; letter-spacing: 1.5px; color: #000; margin-top: 1mm;
  }

  body.printing-thermal .print-clone.thermal .rc-footer{
    font-size: 7pt; color: #000; margin-top: 3mm;
    padding-top: 1mm; border-top: 1px dashed #000;
    text-align: center;
  }
}
