/* ============================================================================
   PUBLICAR UN PROYECTO Y VER LAS OFERTAS
   ----------------------------------------------------------------------------
   Quien llega acá no es del oficio. El formulario tiene que verse fácil antes
   de leerse: pocos campos a la vista, en dos pasos, y el número estimado
   apareciendo apenas escribe lo que paga — que es el momento en que entiende
   que esto le sirve.
   ========================================================================== */
.wrap-licita{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);
  gap:26px;align-items:start}
@media (max-width:900px){.wrap-licita{grid-template-columns:1fr}}

.col-form .card{padding:26px 28px}
.col-form h2{font-size:1.35rem;margin-bottom:4px}
.grupo{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--primary);margin:22px 0 12px;font-weight:600}
.col-form form label{display:block;font-size:.86rem;font-weight:600;
  color:var(--text-dim);margin:16px 0 5px}
.col-form input,.col-form select,.col-form textarea{width:100%;font:inherit;
  font-size:.95rem;padding:11px 13px;border:1px solid var(--line);border-radius:10px;
  background:#FBFCFA;color:var(--text)}
.col-form textarea{resize:vertical;line-height:1.55}
.col-form input:focus,.col-form select:focus,.col-form textarea:focus{
  outline:none;border-color:var(--primary);box-shadow:var(--glow-blue)}
.pista{display:block;font-size:.78rem;color:var(--text-dim);margin-top:5px;line-height:1.45}
.dos-col{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:560px){.dos-col{grid-template-columns:1fr}}
.ancho{width:100%;margin-top:20px}
.botonera{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}
.botonera .btn{flex:1 1 160px}

.estimado{margin-top:18px;padding:14px 16px;border-radius:12px;
  background:rgba(29,78,216,.06);border:1px solid rgba(29,78,216,.22)}
.estimado b{display:block;font-size:.98rem;color:var(--primary);margin-bottom:4px}
.estimado span{font-size:.83rem;color:var(--text-dim);line-height:1.5}

.nota-datos{padding:13px 15px;border-radius:10px;background:#F0FDF4;
  border:1px solid #BBF7D0;font-size:.87rem;line-height:1.55;color:var(--text)}

.msg{margin-top:16px;padding:11px 14px;border-radius:10px;font-size:.9rem}
.msg.error{background:#FEF2F2;color:#B91C1C;border:1px solid #FECACA}
.msg.ok{background:#F0FDF4;color:#15803D;border:1px solid #BBF7D0}

.ok-marca{width:46px;height:46px;border-radius:50%;background:#F0FDF4;
  border:2px solid #86EFAC;color:#15803D;display:grid;place-items:center;
  font-size:1.4rem;font-weight:700;margin-bottom:14px}
.codigo{font-family:var(--font-mono);font-size:1.6rem;font-weight:600;
  color:var(--primary);letter-spacing:.06em;padding:14px 18px;margin:14px 0;
  background:rgba(29,78,216,.06);border:1px dashed rgba(29,78,216,.4);
  border-radius:12px;text-align:center}
.resumen{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:8px}
.resumen li{font-size:.9rem;color:var(--text-dim);line-height:1.5}

.col-lado{display:flex;flex-direction:column;gap:14px;position:sticky;top:88px}
@media (max-width:900px){.col-lado{position:static}}
.card.lado{padding:20px 22px}
.card.lado h3{font-size:1.02rem;margin-bottom:9px}
.card.lado p{font-size:.88rem;line-height:1.6;margin:0 0 9px}
.card.lado.destaca{border-color:var(--primary);
  box-shadow:inset 3px 0 0 var(--primary)}
.pasos-l{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:11px}
.pasos-l li{font-size:.88rem;line-height:1.5}
.pasos-l li b{display:block}
.pasos-l li span{color:var(--text-dim);font-size:.83rem}

/* ---- las ofertas que le llegaron ---------------------------------------- */
.ofertas{display:flex;flex-direction:column;gap:14px;margin-top:18px}
.oferta{background:var(--bg-panel);border:1px solid var(--line);border-radius:14px;
  padding:20px 22px}
.oferta.ganadora{border-color:#15803D;box-shadow:inset 4px 0 0 #15803D}
.of-cab{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  align-items:flex-start;margin-bottom:12px}
.of-quien b{font-size:1.05rem;display:block}
.of-credenciales{display:flex;gap:7px;flex-wrap:wrap;margin-top:6px}
.cred{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.06em;
  padding:3px 9px;border-radius:20px;background:rgba(29,78,216,.08);
  color:var(--primary);font-weight:600}
.cred.estrellas{background:#FFFBEB;color:#92400E}
.of-monto{font-family:var(--font-mono);font-size:1.5rem;font-weight:600;
  color:var(--primary);white-space:nowrap;font-variant-numeric:tabular-nums}
.of-monto small{display:block;font-size:.72rem;color:var(--text-dim);font-weight:400}
.of-detalle{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:14px 0}
@media (max-width:640px){.of-detalle{grid-template-columns:1fr}}
.of-detalle h4{font-size:.75rem;font-family:var(--font-mono);letter-spacing:.09em;
  text-transform:uppercase;color:var(--text-dim);margin-bottom:5px;font-weight:500}
.of-detalle p{font-size:.88rem;line-height:1.55;margin:0;white-space:pre-wrap}
.of-pie{display:flex;justify-content:space-between;align-items:center;gap:12px;
  flex-wrap:wrap;padding-top:14px;border-top:1px solid var(--line-soft)}
.contacto-abierto{background:#F0FDF4;border:1px solid #BBF7D0;border-radius:10px;
  padding:11px 14px;font-size:.88rem;margin-top:12px}
.contacto-abierto b{color:#15803D}

/* ---- ubicación en el mapa -------------------------------------------------
   Dos botones y un campo. El estado se dice en palabras y no solo con color:
   quien no distingue verde de gris tiene que poder saber si quedó marcado. */
.ubic { display: flex; gap: 10px; flex-wrap: wrap; margin: 4px 0 10px; }
.ubic .btn { flex: 1 1 auto; }
.opcional { font-weight: 400; color: var(--dim, #64748b); font-size: .86em; }
.ayuda {
  font-size: .88rem; line-height: 1.5; color: var(--dim, #64748b);
  margin: 6px 0 16px;
}
.ayuda.ok { color: #15803d; font-weight: 500; }
.ayuda.ok::before { content: "✓ "; }