.chat-shadow { box-shadow: 0 1px 0 rgba(0,0,0,.06); }
.wa-shadow { box-shadow: 0 2px 8px rgba(0,0,0,.15); }
.msg-tail-left:after {
  content:""; position:absolute; left:-6px; bottom:0;
  border-width:6px; border-style:solid;
  border-color: transparent #fff transparent transparent;
}
.msg-tail-right:after {
  content:""; position:absolute; right:-6px; bottom:0;
  border-width:6px; border-style:solid;
  border-color: transparent transparent transparent #DCF8C6;
}
.dark .msg-tail-left:after {
  border-color: transparent #202C33 transparent transparent;
}
.dark .msg-tail-right:after {
  border-color: transparent transparent transparent #005C4B;
}
.chat-bg {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="chat" x="0" y="0" width="20" height="20" patternUnits="userSpaceOnUse"><circle cx="10" cy="10" r="0.5" fill="%23ffffff" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23chat)"/></svg>');
}
.dark .chat-bg {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="chat-dark" x="0" y="0" width="20" height="20" patternUnits="userSpaceOnUse"><circle cx="10" cy="10" r="0.5" fill="%23ffffff" opacity="0.05"/></pattern></defs><rect width="100" height="100" fill="url(%23chat-dark)"/></svg>');
}

/* Botones de edición admin */
.admin-edit-btn {
  transition: all 0.2s ease;
  opacity: 0.7;
}
.admin-edit-btn:hover {
  opacity: 1;
  transform: scale(1.1);
}

/* Drag & Drop */
.category-item[draggable="true"] {
  cursor: move;
}
.category-item.drag-over {
  border-left: 3px solid #075E54;
  background-color: rgba(7, 94, 84, 0.1);
}
.drag-handle {
  cursor: grab;
}
.drag-handle:active {
  cursor: grabbing;
}