.mvchat-wrap{display:flex;gap:20px;align-items:stretch;max-width:1200px;margin:0 auto;font-family:Arial,Helvetica,sans-serif}
.mvchat-left{width:340px;min-width:340px;display:flex;flex-direction:column;gap:16px}
.mvchat-right{flex:1;display:flex;flex-direction:column;border:1px solid #e5e7eb;border-radius:16px;overflow:hidden;background:#fff;min-height:640px}
.mvchat-block,.mvchat-card{border:1px solid #e5e7eb;border-radius:16px;background:#fff;overflow:hidden}
.mvchat-card__head,.mvchat-title,.mvchat-chat-head{background:#9c52c4;color:#fff;padding:14px 16px;margin:0;font-size:16px;font-weight:700}
.mvchat-card__body{padding:16px}
.mvchat-help{margin:0 0 14px 0;color:#555;line-height:1.45}
.mvchat-field{width:100%;box-sizing:border-box;padding:11px 12px;border:1px solid #d1d5db;border-radius:12px;font-size:14px;margin:10px 0}
.mvchat-btn{background:#9c52c4;color:#fff;border:none;border-radius:12px;padding:11px 14px;cursor:pointer;font-weight:700}
.mvchat-btn:hover{background:#8640ac}
.mvchat-label{display:block;margin-top:8px;font-weight:700;color:#333}
.mvchat-list{max-height:210px;overflow:auto;padding:8px}
.mvchat-item{border:1px solid #ececec;border-radius:12px;padding:10px 12px;margin-bottom:8px;background:#fafafa;cursor:pointer}
.mvchat-item:hover{background:#f3e8fb}
.mvchat-item__name{font-weight:700;color:#222}
.mvchat-item__meta{font-size:12px;color:#666;margin-top:4px}
.mvchat-empty{color:#777;font-size:13px;padding:10px}
.mvchat-messages{flex:1;overflow:auto;background:#f5f5f5;padding:16px}
.mvchat-day{text-align:center;font-size:12px;color:#666;margin:10px 0}
.mvchat-msg{max-width:78%;padding:10px 12px;border-radius:14px;margin-bottom:10px;line-height:1.35;word-break:break-word;position:relative}
.mvchat-msg--me{margin-left:auto;background:#dcf8c6}
.mvchat-msg--other{background:#fff}
.mvchat-msg__meta{display:flex;align-items:center;justify-content:flex-end;gap:4px;font-size:11px;margin-top:2px}
.mvchat-msg__time{color:#888}
.mvchat-check{margin-left:2px;font-size:13px;font-weight:800}
.mvchat-check.sent{color:#2da6ff}
.mvchat-check.delivered{color:#2da6ff}
.mvchat-check.read{color:#2da6ff}
.mvchat-actions{margin-left:6px;display:inline-flex;gap:4px}
.mvchat-actions button{border:none;background:transparent;font-size:12px;cursor:pointer;opacity:0.6;padding:2px}
.mvchat-actions button:hover{opacity:1}
.mvchat-sendbar{display:flex;gap:10px;padding:12px;border-top:1px solid #e5e7eb;background:#fff}
.mvchat-sendbar .mvchat-field{margin:0;flex:1}
.mvchat-pagination{display:flex;gap:6px;flex-wrap:wrap;padding:0 8px 10px}
.mvchat-page{min-width:34px;height:34px;border:1px solid #ddd;background:#fff;border-radius:10px;cursor:pointer}
.mvchat-page.is-active{background:#9c52c4;color:#fff;border-color:#9c52c4}
.mvchat-delete-conv{margin-left:10px;border:none;background:#ff4d4f;color:#fff;padding:4px 8px;border-radius:6px;cursor:pointer;font-size:12px}
.mvchat-unread{background:#ff3b30;color:#fff;font-size:11px;padding:2px 6px;border-radius:10px;margin-left:6px;font-weight:bold}
@media(max-width:900px){.mvchat-wrap{flex-direction:column}.mvchat-left{width:100%;min-width:0}.mvchat-right{min-height:70vh}}
@media(max-width:768px){.mvchat-actions{display:none}}


.mv-online{
  display:inline-block;
  width:8px;
  height:8px;
  background:#2ecc71;
  border-radius:50%;
  margin-right:6px;
  vertical-align:middle;
}


/* =========================
   FLOTANTE
========================= */
#mvchat-floating-btn{
  position:fixed;
  right:25px;
  bottom:25px;
  width:56px;
  height:56px;
  border-radius:50%;
  background:#9c52c4;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
  cursor:pointer;
  box-shadow:0 4px 12px rgba(0,0,0,0.3);
  z-index:9999;
  user-select:none;
}

#mvchat-floating-btn:hover{
  background:#ff00d5;
}

#mvchat-toast{
  position:fixed;
  right:25px;
  bottom:95px;
  background:#333;
  color:#fff;
  padding:12px 16px;
  border-radius:8px;
  display:none;
  cursor:pointer;
  z-index:9999;
  box-shadow:0 4px 12px rgba(0,0,0,0.3);
  font-size:14px;
  max-width:260px;
}

@media (max-width: 768px){
  #mvchat-floating-btn{
    width:52px;
    height:52px;
    right:18px;
    bottom:18px;
  }

  #mvchat-toast{
    right:18px;
    left:18px;
    bottom:82px;
    max-width:none;
  }
}
