/* SegoviaSoft Recibos — consulta pública */
.sgsp{
  --p-ink:#0b1120; --p-ink2:#1e293b; --p-muted:#64748b;
  --p-blue:#2563eb; --p-blue-d:#1d4ed8; --p-line:#e2e8f0;
  --p-bg:#f8fafc; --p-r:16px;
  max-width:680px; margin:0 auto; color:var(--p-ink2);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
.sgsp *{box-sizing:border-box;}

.sgsp-card{background:#fff;border:1px solid var(--p-line);border-radius:var(--p-r);
  padding:26px;box-shadow:0 4px 24px rgba(11,17,32,.05);margin-bottom:18px;}
.sgsp-search-card{background:linear-gradient(160deg,#0b1120 0%,#132f68 100%);border:none;color:#fff;}
.sgsp-h{margin:0 0 6px;font-size:22px;font-weight:800;color:#fff;}
.sgsp-search-card .sgsp-lead{color:#cbd5e1;}
.sgsp-lead{margin:0 0 18px;font-size:15px;line-height:1.55;color:var(--p-muted);}
.sgsp-search-card strong{color:#fff;}

.sgsp-form{display:flex;gap:10px;flex-wrap:wrap;}
.sgsp-input{flex:1;min-width:200px;padding:13px 16px;border:1px solid transparent;border-radius:11px;
  font-size:15px;background:#fff;color:var(--p-ink);}
.sgsp-input:focus{outline:none;box-shadow:0 0 0 3px rgba(37,99,235,.4);}

.sgsp-btn{padding:13px 22px;border-radius:11px;border:1px solid var(--p-line);background:#fff;
  font-size:15px;font-weight:700;color:var(--p-ink);cursor:pointer;text-decoration:none;
  display:inline-block;text-align:center;transition:.15s;}
.sgsp-btn:hover{transform:translateY(-1px);}
.sgsp-btn.primary{background:var(--p-blue);border-color:var(--p-blue);color:#fff;}
.sgsp-btn.primary:hover{background:var(--p-blue-d);}
.sgsp-search-card .sgsp-btn{background:var(--p-blue);border-color:var(--p-blue);color:#fff;}
.sgsp-wa{margin-top:6px;width:100%;background:#16a34a !important;border-color:#16a34a !important;}

.sgsp-msg{margin-top:14px;padding:12px 16px;border-radius:10px;font-size:14px;font-weight:600;}
.sgsp-msg.err{background:rgba(220,38,38,.15);color:#fecaca;}
.sgsp-card .sgsp-msg.err{background:#fee2e2;color:#b91c1c;}

.sgsp-greet{font-size:18px;margin:6px 0 16px;color:var(--p-ink);}
.sgsp-code{display:inline-block;background:var(--p-bg);border:1px solid var(--p-line);
  border-radius:999px;padding:2px 12px;font-size:13px;font-weight:700;color:var(--p-blue);margin-left:6px;}

/* Receipt card */
.sgsp-r-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;
  border-bottom:1px solid var(--p-line);padding-bottom:14px;margin-bottom:16px;}
.sgsp-r-num{font-size:13px;color:var(--p-muted);font-weight:600;}
.sgsp-r-serv{font-size:19px;font-weight:800;color:var(--p-ink);}
.sgsp-badge{display:inline-block;padding:5px 13px;border-radius:999px;font-size:12.5px;font-weight:700;white-space:nowrap;}
.sgsp-badge.ok{background:#dcfce7;color:#166534;}
.sgsp-badge.pend{background:#fef3c7;color:#92400e;}

.sgsp-r-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:8px;}
.sgsp-r-grid div{display:flex;flex-direction:column;gap:3px;}
.sgsp-r-grid span{font-size:12px;color:var(--p-muted);}
.sgsp-r-grid strong{font-size:15px;color:var(--p-ink);}

.sgsp-r-note{margin:6px 0 0;font-size:13px;font-weight:600;}
.sgsp-warn{color:#b45309;}
.sgsp-ok{color:#166534;}

.sgsp-r-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;}

.sgsp-pay-panel{margin-top:18px;padding-top:18px;border-top:1px dashed var(--p-line);}
.sgsp-pay-title{font-weight:800;color:var(--p-ink);margin:0 0 10px;}
.sgsp-pay-list{list-style:none;margin:0 0 12px;padding:0;}
.sgsp-pay-list li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #f1f5f9;font-size:14px;}
.sgsp-pay-list li span{color:var(--p-muted);}
.sgsp-pay-list li strong{color:var(--p-ink);text-align:right;}
.sgsp-muted{color:var(--p-muted);font-size:13px;}

.sgsp-loading{display:flex;align-items:center;gap:10px;color:var(--p-muted);padding:30px;justify-content:center;}
.sgsp-loading span{width:16px;height:16px;border:2px solid var(--p-line);border-top-color:var(--p-blue);
  border-radius:50%;animation:sgsp-spin .7s linear infinite;}
@keyframes sgsp-spin{to{transform:rotate(360deg);}}

@media(max-width:560px){
  .sgsp-r-grid{grid-template-columns:1fr 1fr;}
}
