/* Mobile-first tweaks */
.list-group-item { cursor: pointer; }
.card.selected { border-color: #0d6efd; box-shadow: 0 0 0 0.15rem rgba(13,110,253,.25); }
table tbody tr.selected { background-color: #e7f1ff; }
.message-item { padding: 0.75rem; }
.message-meta { font-size: 0.8rem; color: #666; }
.message-media img, .message-media video, .message-media audio { max-width: 100%; }
.message-media audio { display: block; height: 40px;margin-top: 4px; }

/* Bubbles for messages */
.bubble {
  display: inline-block;
  padding: 0.6rem 0.8rem;
  border-radius: 14px;
  max-width: 85%;
  position: relative;
}
.bubble.incoming { background-color: #f1f3f5; color: #111; }
.bubble.outgoing { background-color: #0d6efd; color: #fff; margin-left: auto; }
.bubble.outgoing a { color: #fff; text-decoration: underline; }
.bubble .message-text { white-space: pre-wrap; word-wrap: break-word; }
.bubble .message-meta { opacity: 0.8; margin-top: 0.25rem; }
.bubble.outgoing .message-meta { opacity: 0.6; color: rgba(255,255,255,0.9); }
.message-row { display: flex; margin-bottom: 8px; }
.message-row.incoming { justify-content: flex-start; }
.message-row.outgoing { justify-content: flex-end; }

/* Deleted messages */
.bubble.deleted { outline: 2px dashed #dc3545; opacity: 0.85; }
.bubble.deleted .message-text { text-dxecoration: line-through; }

/* Badges for activity */
.badge-green { background-color: #28a745; }
.badge-yellow { background-color: #ffc107; color: #212529; }
.badge-blue { background-color: #0d6efd; }
.badge-gray { background-color: #6c757d; }

/* DataTables selections and suspicious rows */
table.dataTable tbody tr.selected { background-color: #d6eaff; }
table.dataTable tbody tr.row-suspicious { border-left: 4px solid #dc3545; background-color: #fff7e6; }

/* Align DataTables search box to the left */
.dataTables_wrapper .dataTables_filter, #dialogsTable_filter { float: left !important; text-align: left !important; }

/* Chat panel sizing */
#messages-list { overflow-y: auto; }

/* Compact profile header & cards */
.profile-header { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:10px; }
.profile-header .avatar { width:56px; height:56px; border-radius:50%; object-fit:cover; border:1px solid #ddd; }
.profile-header .fullname { font-weight:600; }
.profile-header .phone { color:#555; }
.card-toggle { cursor:pointer; }
.card-toggle:hover { opacity:.85; }
.himera-content table { margin-bottom:8px; }
.himera-content .fw-semibold { font-weight:600; }