/* Overlay */
#rm-aiap-modal{position:fixed;inset:0;display:none;background:rgba(0,0,0,.35);z-index:99999;}
#rm-aiap-modal.rm-open{display:block;}
.rm-aiap-open{overflow:hidden;}

/* Dialog (desktop default) */
#rm-aiap-modal .rm-aiap-dialog{
  position:absolute; right:20px; bottom:20px;
  width:400px; max-width:calc(100% - 40px);
  max-height:85vh;
  background:#fff; border-radius:14px;
  box-shadow:0 12px 32px rgba(0,0,0,.2);
  display:flex; flex-direction:column; overflow:hidden;
}

/* Sticky header so the close button is always visible */
.rm-aiap-header{
  position:sticky; top:0; z-index:5;
  display:flex; justify-content:space-between; align-items:center;
  padding:12px 14px; border-bottom:1px solid #eee; font-weight:600; background:#fff;
}
.rm-aiap-title{flex:1; padding-right:8px;}
.rm-aiap-close{
  background:#fff; border:1px solid #ddd; border-radius:10px; width:34px; height:34px;
  font-size:18px; line-height:32px; text-align:center; cursor:pointer;
}

/* Chat area */
#rm-aiap-chat{flex:1; overflow:auto; padding:12px; display:flex; flex-direction:column; gap:8px; background:#fafafa;}
.rm-aiap-msg{padding:8px 10px; border-radius:10px; max-width:92%;}
.rm-aiap-msg.user{background:#dff1ff; align-self:flex-end;}
.rm-aiap-msg.assistant{background:#f1f1f1; align-self:flex-start;}

/* Input bar */
#rm-aiap-inputbar{display:flex; gap:8px; padding:12px; border-top:1px solid #eee; background:#fff;}
#rm-aiap-input{flex:1; padding:10px 12px; border:1px solid #ddd; border-radius:10px;}
#rm-aiap-submit{padding:10px 14px; border:none; border-radius:10px; background:#111; color:#fff; cursor:pointer;}

/* Product card */
.rm-aiap-btn{display:inline-block; padding:10px 14px; border-radius:10px; background:#111; color:#fff; text-decoration:none; margin-top:6px;}
.rm-aiap-btn-ghost{display:inline-block; padding:10px 14px; border-radius:10px; border:1px solid #999; background:#fff; color:#111; text-decoration:none; margin-top:6px; cursor:pointer;}
.rm-aiap-btn-ghost:hover{background:#f7f7f7;}
.rm-aiap-reco{display:flex; gap:10px; align-items:flex-start;}
.rm-aiap-reco img{width:64px; height:64px; object-fit:cover; border-radius:8px; border:1px solid #eee;}
.rm-aiap-reco-title{font-weight:700; margin-bottom:4px;}
.rm-aiap-reco-price{color:#0a7a28; margin-bottom:6px;}
.rm-aiap-follow{display:flex; flex-direction:column; gap:10px;}
.rm-aiap-two{display:flex; gap:8px;}
.rm-aiap-cta{flex:1; padding:10px 12px; border-radius:999px; border:1px solid #222; background:#fff; cursor:pointer;
  font-size:14px; line-height:1.2; color:#111; display:inline-flex; align-items:center; justify-content:center; white-space:normal; text-align:center;}
.rm-aiap-cta:hover{background:#f7f7f7;}

/* Pre-lead capture (column layout; input on its own line) */
.rm-aiap-prelead-box{margin:8px 12px 0 12px; padding:10px; border:1px dashed #ddd; border-radius:10px; background:#fff}
.rm-aiap-prelead-title{font-weight:600; margin-bottom:6px;}
.rm-aiap-prelead-col{display:flex; flex-direction:column; gap:8px;}
.rm-aiap-prelead-actions{display:flex; gap:8px; flex-wrap:wrap;}
#rm-aiap-prelead-email{width:100%; padding:10px 12px; border:1px solid #ddd; border-radius:10px}
.rm-aiap-prelead-note{font-size:12px; color:#777; margin-top:6px}

/* Mobile optimisation: small chat-style box, not full-screen */
@media (max-width: 768px){
  #rm-aiap-modal .rm-aiap-dialog{
    right:4vw; left:auto; bottom:2vh;
    width:92vw; max-width:92vw;
    height:auto; max-height:70vh; /* smaller, chat-like */
    border-radius:14px;
  }
  .rm-aiap-close{width:38px; height:38px; font-size:20px;}
}
@media (max-width: 420px){
  #rm-aiap-input{font-size:14px;}
  #rm-aiap-submit{font-size:14px;}
  .rm-aiap-cta{font-size:13px;}
}