/* Styles of list/templates/list/buy_query.html, moved out of its inline <style>. */

/* Soften the backdrop (Bootstrap 5 uses this CSS var) */
.modal-backdrop.show { --bs-backdrop-opacity: .25; } /* was ~.5 */

/* Modal shell */
#buyQueryModal .modal-content{
  background: rgba(255,255,255,0.92);
  color: #0b0d10;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 16px;
  box-shadow: 0 18px 50px rgba(0,0,0,0.25);
}

/* Header: subtle brand accent line + tidy spacing */
#buyQueryModal .modal-header{
  border-bottom: 1px solid rgba(0,0,0,0.06);
  padding: 0.9rem 1rem;
  position: relative;
}
#buyQueryModal .modal-header::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0;
  height:3px;
  background: linear-gradient(135deg,#fea64d 0%,#ffb977 40%,#ffddb5 100%);
  opacity:.75; border-bottom-left-radius:16px; border-bottom-right-radius:16px;
}

#buyQueryModal .modal-title{
  font-weight: 800; letter-spacing: .2px; color:#0b0d10;
}

/* Body: comfortable line-height */
#buyQueryModal .modal-body{
  padding: 1rem 1rem 1.15rem;
  color: #1c1f26;
}

/* Buttons: keep your brand primary, soften secondary */
#buyQueryModal .btn.orange-button{
  background-color:#fea64d; 
  color:#16181d; 
  font-weight:700; 
  border:none; 
  border-radius:10px;
  box-shadow:0 6px 16px rgba(254,166,77,.35);
}
#buyQueryModal .btn.orange-button:hover{
  background-color:#f18f31; 
  color:#0b0d10;
  box-shadow:0 8px 22px rgba(254,166,77,.45);
}

#buyQueryModal .btn.btn-secondary{
  background: #f4f6f8;
  color:#0b0d10;
  border:1px solid #e7e9ee;
  border-radius:10px;
}
#buyQueryModal .btn.btn-secondary:hover{
  background:#eef1f5; border-color:#e2e5ea;
}

/* Close icon visible on light header */
#buyQueryModal .btn-close{
  filter: invert(0); /* keep dark icon */
  opacity:.7;
}
#buyQueryModal .btn-close:hover{ opacity:1; }