.takesme-chat-shell { display:grid; gap:1.25rem; }
.takesme-chat-intro,
.takesme-chat-sidebar-card,
.takesme-chat-main { background:#fff; border:1px solid var(--takesme-line); border-radius:28px; box-shadow:var(--takesme-shadow-soft); }
.takesme-chat-intro { padding:1.4rem; background:linear-gradient(180deg, rgba(5, 152, 186, .08), #fff 65%); }
.takesme-chat-layout { display:grid; grid-template-columns:320px minmax(0,1fr); gap:1rem; align-items:start; }
.takesme-chat-sidebar { display:grid; gap:1rem; }
.takesme-chat-sidebar-card { padding:1rem; }
.takesme-chat-room-list { display:grid; gap:.7rem; }
.takesme-chat-room-link { display:flex; flex-direction:column; gap:.2rem; border-radius:18px; border:1px solid var(--takesme-line); padding:.85rem .95rem; text-decoration:none; background:#f7fdfd; color:var(--takesme-ink); }
.takesme-chat-room-link span { color:var(--takesme-muted); font-size:.9rem; }
.takesme-chat-room-link.is-active { background:var(--takesme-primary-soft); border-color:rgba(4,126,153,.18); }
.takesme-chat-main { padding:1rem; display:grid; gap:1rem; min-height:720px; }
.takesme-chat-room-header { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; padding-bottom:.85rem; border-bottom:1px solid var(--takesme-line); }
.takesme-chat-presence { display:inline-flex; align-items:center; gap:.35rem; padding:.4rem .7rem; border-radius:999px; background:rgba(165,58,130,.08); color:var(--takesme-success); font-weight:700; white-space:nowrap; }
.takesme-chat-presence::before { content:''; width:8px; height:8px; border-radius:50%; background:var(--takesme-success); }
.takesme-chat-messages { display:grid; gap:.85rem; max-height:560px; overflow:auto; padding-right:.3rem; }
.takesme-chat-message { border:1px solid var(--takesme-line); border-radius:24px; background:#f7fdfd; padding:1rem; }
.takesme-chat-message__head { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; margin-bottom:.65rem; }
.takesme-chat-author { display:flex; gap:.75rem; align-items:center; }
.takesme-chat-author img, .takesme-chat-reply img { border-radius:50%; }
.takesme-chat-meta { color:var(--takesme-muted); font-size:.88rem; }
.takesme-chat-bubble p { margin:.25rem 0 0; }
.takesme-chat-reply-btn { border:none; background:transparent; color:var(--takesme-primary-deep); font-weight:700; cursor:pointer; padding:0; }
.takesme-chat-replies { display:grid; gap:.7rem; padding-left:1rem; margin-top:.8rem; border-left:2px solid rgba(5,152,186,.14); }
.takesme-chat-reply { display:flex; gap:.65rem; align-items:flex-start; padding:.75rem; border-radius:18px; background:#fff; border:1px solid rgba(4,126,153,.08); }
.takesme-chat-form textarea { min-height:118px; }
.takesme-chat-form-actions { display:flex; justify-content:space-between; gap:.85rem; align-items:center; }
.takesme-chat-replying { background:var(--takesme-primary-soft); color:var(--takesme-primary-deep); border-radius:16px; padding:.65rem .8rem; font-weight:700; }
@media (max-width: 980px) { .takesme-chat-layout { grid-template-columns:1fr; } .takesme-chat-room-header, .takesme-chat-form-actions { flex-direction:column; align-items:flex-start; } }


/* v12 softer blue chat */
.takesme-chat-presence {
  background: rgba(5, 152, 186, .10);
  color: var(--takesme-primary-deep);
}
.takesme-chat-presence::before {
  background: var(--takesme-primary);
}


/* v36.2.4 chat polish */
.takesme-chat-shell .takesme-community-subnav { margin-bottom: 0; }
.takesme-chat-main { box-shadow: 0 18px 40px rgba(8,85,95,.05); }


/* v36.5.31 live chat refresh */
.takesme-chat-shell { gap: 1rem; }
.takesme-chat-layout { grid-template-columns: 300px minmax(0,1fr); gap: 1rem; align-items: stretch; }
.takesme-chat-sidebar { position: sticky; top: 5.2rem; align-self: start; }
.takesme-chat-sidebar-card,
.takesme-chat-online-card,
.takesme-chat-main {
  background: #fff;
  border: 1px solid rgba(4,126,153,.12);
  border-radius: 24px;
  box-shadow: 0 16px 38px rgba(17,17,17,.05);
}
.takesme-chat-sidebar-card,
.takesme-chat-online-card { padding: 1rem; }
.takesme-chat-room-link { background: linear-gradient(180deg,#fff,#f6fcfc); }
.takesme-chat-room-link.is-active { background: linear-gradient(180deg, rgba(5,152,186,.12), rgba(255,255,255,.96)); }
.takesme-chat-main { min-height: 760px; padding: 1rem; grid-template-rows: auto 1fr auto; }
.takesme-chat-room-header { position: sticky; top: 0; z-index: 3; background: #fff; padding-bottom: .9rem; }
.takesme-chat-messages {
  background:
    radial-gradient(circle at top left, rgba(5,152,186,.04), transparent 36%),
    linear-gradient(180deg, rgba(247,254,254,.9), rgba(255,255,255,.98));
  border: 1px solid rgba(4,126,153,.08);
  border-radius: 22px;
  padding: 1rem;
  max-height: 560px;
}
.takesme-chat-message {
  max-width: 82%;
  margin-right: auto;
  padding: .9rem 1rem;
  border-radius: 22px 22px 22px 8px;
  background: #fff;
}
.takesme-chat-message.is-own {
  margin-left: auto;
  margin-right: 0;
  background: rgba(5,152,186,.11);
  border-radius: 22px 22px 8px 22px;
}
.takesme-chat-message__head { margin-bottom: .45rem; }
.takesme-chat-bubble p:last-child { margin-bottom: 0; }
.takesme-chat-replies {
  margin-top: .7rem;
  padding-left: .75rem;
  border-left: 2px solid rgba(5,152,186,.14);
}
.takesme-chat-reply {
  background: rgba(255,255,255,.95);
}
.takesme-chat-reply.is-own {
  background: rgba(5,152,186,.08);
}
.takesme-chat-form {
  border-top: 1px solid rgba(4,126,153,.08);
  padding-top: .9rem;
}
.takesme-chat-form textarea {
  min-height: 96px;
  border-radius: 18px;
  border: 1px solid rgba(4,126,153,.16);
  padding: .95rem 1rem;
  background: #fff;
}
.takesme-chat-online-head {
  display: flex;
  flex-direction: column;
  gap: .2rem;
  margin-bottom: .7rem;
}
.takesme-chat-online-head span {
  color: var(--takesme-muted);
  font-size: .88rem;
}
.takesme-chat-online-list {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}
.takesme-chat-online-pill {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .42rem .72rem;
  border-radius: 999px;
  background: rgba(5,152,186,.08);
  border: 1px solid rgba(4,126,153,.10);
  font-size: .88rem;
  color: var(--takesme-primary-deep);
}
.takesme-chat-online-pill::before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--takesme-success);
}
@media (max-width: 980px) {
  .takesme-chat-sidebar { position: static; }
  .takesme-chat-layout { grid-template-columns: 1fr; }
  .takesme-chat-message { max-width: 100%; }
}