/* ═══════════ CHAT (guilda + DM + moderação) ═══════════ */

.ch-panel{
  display:flex;
  flex-direction:column;
  max-height:80vh;
  padding:0;
}
.ch-hd{
  padding:14px 18px;
  border-bottom:1px solid var(--border2);
  background:var(--bg2);
  border-radius:12px 12px 0 0;
}
.ch-hd-title{
  font-size:0.96rem;
  font-weight:800;
  color:var(--text);
}
.ch-hd-sub{
  font-size:0.74rem;
  font-weight:400;
  color:var(--muted2);
  margin-left:6px;
}

.ch-list{
  flex:1;
  overflow-y:auto;
  padding:14px 16px;
  display:flex;
  flex-direction:column;
  gap:10px;
  min-height:320px;
  max-height:54vh;
  background:var(--bg);
}

.ch-msg{
  display:flex;
  flex-direction:column;
  max-width:80%;
  padding:0;
  position:relative;
}
.ch-msg.ch-mine{
  align-self:flex-end;
  align-items:flex-end;
}
.ch-msg.ch-other{
  align-self:flex-start;
  align-items:flex-start;
}
.ch-msg-meta{
  display:flex;
  gap:8px;
  align-items:baseline;
  font-size:0.66rem;
  margin-bottom:3px;
  padding:0 8px;
}
.ch-sender{
  font-weight:700;
  color:var(--muted2);
}
.ch-sender-teacher{
  color:var(--teal);
}
.ch-time{
  font-size:0.6rem;
  color:var(--muted);
}
.ch-bubble{
  padding:8px 12px;
  border-radius:14px;
  background:var(--bg3);
  border:1px solid var(--border2);
  font-size:0.86rem;
  line-height:1.4;
  word-wrap:break-word;
  white-space:pre-wrap;
}
.ch-mine .ch-bubble{
  background:linear-gradient(135deg, rgba(34,211,238,0.16), rgba(108,63,197,0.14));
  border-color:rgba(34,211,238,0.3);
}
.ch-other .ch-bubble{
  background:var(--bg3);
}
.ch-msg.ch-deleted .ch-bubble{
  background:rgba(255,255,255,0.04);
  color:var(--muted);
  font-style:italic;
  border-style:dashed;
}
.ch-msg-actions{
  display:none;
  gap:4px;
  margin-top:4px;
  padding:0 8px;
}
.ch-msg:hover .ch-msg-actions{ display:flex; }
.ch-msg-act{
  background:none;
  border:1px solid var(--border2);
  border-radius:6px;
  padding:2px 6px;
  font-size:0.68rem;
  cursor:pointer;
  color:var(--muted2);
}
.ch-msg-act:hover{
  background:var(--bg3);
  color:var(--text);
}
.ch-msg-reactions{
  margin-top:4px;
  padding:0 8px;
}

.ch-composer{
  display:flex;
  gap:8px;
  padding:10px 16px;
  border-top:1px solid var(--border2);
  background:var(--bg2);
  align-items:flex-end;
}
.ch-input{
  flex:1;
  background:var(--bg3);
  border:1px solid var(--border2);
  border-radius:10px;
  padding:8px 12px;
  color:var(--text);
  font-size:0.86rem;
  font-family:inherit;
  resize:vertical;
  min-height:38px;
  max-height:120px;
}
.ch-input:focus{
  outline:none;
  border-color:var(--teal);
}
.ch-input:disabled{
  opacity:0.5;
  cursor:not-allowed;
}

.ch-foot{
  padding:8px 16px;
  border-top:1px solid var(--border2);
  font-size:0.72rem;
  color:var(--muted);
  background:var(--bg);
  border-radius:0 0 12px 12px;
}
.ch-tip{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.ch-tip::before{ content:'💡'; }
.ch-mute-banner{
  color:var(--red);
  font-weight:600;
  font-size:0.8rem;
}

.ch-empty{
  text-align:center;
  color:var(--muted2);
  padding:40px 20px;
  font-size:0.86rem;
}

/* Lista de canais (DM — aluno e professor) */
.ch-list-page{
  padding:8px 4px 16px;
}
.ch-list-hd{
  margin-bottom:14px;
  padding:0 4px;
}
.ch-channels{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.ch-channel{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 14px;
  background:var(--bg3);
  border:1px solid var(--border2);
  border-radius:10px;
  cursor:pointer;
  text-align:left;
  width:100%;
  transition:all 0.15s;
}
.ch-channel:hover{
  background:var(--bg2);
  border-color:var(--teal);
}
.ch-ch-icon{
  font-size:1.6rem;
  flex-shrink:0;
}
.ch-ch-body{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.ch-ch-title{
  font-size:0.88rem;
  font-weight:700;
  color:var(--text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ch-ch-sub{
  font-size:0.74rem;
  font-weight:400;
  color:var(--muted2);
}
.ch-ch-preview{
  font-size:0.74rem;
  color:var(--muted2);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:100%;
}
.ch-empty-preview{ font-style:italic; opacity:0.7; }
.ch-unread-badge{
  background:var(--teal);
  color:#000;
  font-size:0.66rem;
  font-weight:800;
  border-radius:10px;
  padding:2px 8px;
  flex-shrink:0;
}

/* ─── Moderação ─── */
.mod-tabs{
  display:flex;
  gap:6px;
  border-bottom:1px solid var(--border2);
  margin-top:14px;
}
.mod-tab{
  padding:8px 14px;
  background:none;
  border:none;
  color:var(--muted2);
  font-size:0.82rem;
  font-weight:600;
  cursor:pointer;
  border-bottom:2px solid transparent;
}
.mod-tab.active{
  color:var(--teal);
  border-bottom-color:var(--teal);
}
.mod-filters{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}
.mod-filters .form-ctrl{
  max-width:200px;
}

.mod-msg-row,
.mod-viol-row,
.mod-mute-row{
  padding:10px 12px;
  background:var(--bg3);
  border:1px solid var(--border2);
  border-radius:8px;
  margin-bottom:8px;
}
.mod-viol-row{ border-left:3px solid var(--red); }
.mod-mute-row{ border-left:3px solid var(--gold); }
.mod-msg-meta{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:0.74rem;
  color:var(--muted2);
  margin-bottom:6px;
  flex-wrap:wrap;
}
.mod-sender{ font-weight:700; color:var(--text); }
.mod-sender-t{ color:var(--teal); }
.mod-class{
  font-size:0.66rem;
  background:var(--bg2);
  padding:1px 6px;
  border-radius:4px;
  color:var(--muted);
}
.mod-time{ font-size:0.7rem; color:var(--muted); }
.mod-flag{
  background:rgba(239,68,68,0.18);
  color:var(--red);
  font-size:0.66rem;
  font-weight:700;
  padding:1px 6px;
  border-radius:4px;
}
.mod-msg-text{
  font-size:0.86rem;
  color:var(--text);
  margin-bottom:6px;
  white-space:pre-wrap;
}
.mod-msg-actions{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}
.mod-tags{
  display:flex;
  gap:4px;
  flex-wrap:wrap;
  margin-bottom:6px;
}
.mod-tag{
  background:rgba(239,68,68,0.12);
  color:var(--red);
  font-size:0.66rem;
  padding:2px 6px;
  border-radius:4px;
  font-family:monospace;
}

/* Responsivo */
@media (max-width:600px){
  .ch-msg{ max-width:92%; }
  .ch-list{ padding:10px; }
  .mod-filters .form-ctrl{ max-width:none; flex:1; min-width:140px; }
}
