/* Aloha Joe Chat widget — self-contained, embeds in an iframe */
:root{
  --aj-plum:#5a0a33; --aj-plum-dark:#3d0722; --aj-gold:#ffc24b; --aj-sunset:#ff7a3c;
  --aj-sand:#fbf6ef; --aj-ink:#2b2230; --aj-mut:#7a7280; --aj-line:#ece4df;
}
*{ box-sizing:border-box; }
html,body{ height:100%; margin:0; }
body{ font-family:"Inter","Segoe UI",system-ui,Arial,sans-serif; color:var(--aj-ink); background:var(--aj-sand); }

.aj-chat{ display:flex; flex-direction:column; height:100%; background:var(--aj-sand); }

/* header */
.aj-chat-head{ background:linear-gradient(100deg,var(--aj-plum-dark),var(--aj-plum)); color:#fff;
  padding:.5rem .75rem; display:flex; align-items:center; justify-content:space-between; gap:.5rem; flex:0 0 auto; }
.aj-chat-title{ font-weight:700; font-size:.95rem; white-space:nowrap; }
.aj-chat-title .dot{ display:inline-block; width:.5rem; height:.5rem; border-radius:50%; background:#37e07a;
  margin-right:.35rem; box-shadow:0 0 0 0 rgba(55,224,122,.6); animation:ajp 1.8s infinite; vertical-align:middle; }
@keyframes ajp{ 70%{box-shadow:0 0 0 .4rem rgba(55,224,122,0)} 100%{box-shadow:0 0 0 0 rgba(55,224,122,0)} }
.aj-chat-you{ display:flex; align-items:center; gap:.3rem; font-size:.8rem; }
.aj-chat-you label{ opacity:.85; }
.aj-chat-you input{ width:8.5rem; max-width:34vw; border:0; border-radius:.4rem; padding:.2rem .45rem;
  font-size:.8rem; font-weight:600; color:var(--aj-plum); }
.aj-chat-you button{ border:0; background:rgba(255,255,255,.18); color:#fff; border-radius:.4rem;
  cursor:pointer; padding:.15rem .35rem; font-size:.85rem; line-height:1; }
.aj-chat-you button:hover{ background:rgba(255,255,255,.32); }

/* messages */
.aj-chat-messages{ flex:1 1 auto; overflow-y:auto; padding:.6rem .7rem; }
.aj-chat-loading{ color:var(--aj-mut); text-align:center; padding:1rem; font-size:.85rem; }
.aj-msg{ padding:.3rem 0; line-height:1.35; word-wrap:break-word; }
.aj-msg .who{ font-weight:700; color:var(--aj-plum); }
.aj-msg.me .who{ color:var(--aj-sunset); }
.aj-msg .time{ color:var(--aj-mut); font-size:.7rem; margin-left:.35rem; }
.aj-msg .text{ margin-top:.05rem; white-space:pre-wrap; }
.aj-msg .text a{ color:var(--aj-plum); }
.aj-msg img.shot{ display:block; margin-top:.3rem; max-width:min(260px,80%); max-height:240px;
  border-radius:.6rem; border:1px solid var(--aj-line); cursor:pointer; }

/* admin moderation controls (only when opened with the secret key) */
.aj-chat-clear{ border:0; background:rgba(255,255,255,.18); color:#fff; border-radius:.4rem;
  cursor:pointer; font-size:.72rem; font-weight:700; padding:.25rem .6rem; margin-left:.4rem; white-space:nowrap; }
.aj-chat-clear:hover{ background:rgba(255,75,75,.7); }
.aj-msg .ip{ color:#b3a; font-size:.66rem; margin-left:.4rem;
  font-family:ui-monospace,Menlo,Consolas,monospace; }
/* per-message Delete / Ban — big and clear so they're easy to tap */
.aj-mod{ display:flex; gap:.4rem; margin-top:.35rem; }
.aj-modbtn{ border:0; border-radius:.5rem; cursor:pointer; font-weight:800; font-size:.78rem;
  padding:.4rem .7rem; line-height:1; }
.aj-del{ background:#fde2e2; color:#b62d2d; }
.aj-del:hover{ background:#d83a3a; color:#fff; }
.aj-ban{ background:#ede0f0; color:#6a1146; }
.aj-ban:hover{ background:var(--aj-plum); color:#fff; }

/* notice (errors / rate limit) */
.aj-chat-notice{ background:#fff3cd; color:#7a5b00; font-size:.78rem; text-align:center; padding:.35rem .6rem; }

/* composer */
.aj-chat-form{ flex:0 0 auto; display:flex; align-items:flex-end; gap:.4rem; padding:.5rem .6rem;
  border-top:1px solid var(--aj-line); background:#fff; }
.aj-chat-img{ border:0; background:var(--aj-sand); border-radius:.5rem; cursor:pointer; font-size:1.1rem;
  width:2.5rem; height:2.5rem; flex:0 0 auto; }
.aj-chat-img:hover{ background:var(--aj-line); }
/* multi-line message box — grows with what you type, up to a cap, then scrolls */
#ajBody{ flex:1 1 auto; border:1px solid var(--aj-line); border-radius:1.1rem;
  padding:.55rem .9rem; font-size:.95rem; line-height:1.4; font-family:inherit; outline:none;
  resize:vertical; min-height:5.5rem; max-height:12rem; overflow-y:auto; }
#ajBody:focus{ border-color:var(--aj-gold); box-shadow:0 0 0 2px rgba(255,194,75,.3); }
.aj-chat-send{ border:0; background:var(--aj-gold); color:var(--aj-plum-dark); font-weight:700; cursor:pointer;
  border-radius:1.1rem; padding:0 1.1rem; height:2.5rem; font-size:.95rem; flex:0 0 auto; }
.aj-chat-send:hover{ background:var(--aj-sunset); }
.aj-chat-send:disabled{ opacity:.55; cursor:default; }

/* image preview before sending */
.aj-chat-preview{ display:flex; align-items:center; gap:.5rem; padding:.4rem .6rem; background:#fff;
  border-top:1px solid var(--aj-line); font-size:.8rem; }
.aj-chat-preview img{ height:42px; border-radius:.4rem; }
.aj-chat-preview button{ border:0; background:#eee; border-radius:.4rem; cursor:pointer; padding:.2rem .5rem; }