/* Estilo para o placeholder do drag-and-drop */
.task-placeholder {
  background-color: rgba(0, 0, 0, 0.1);
  border: 2px dashed #ccc;
  height: 50px;
  margin-bottom: 12px;
  border-radius: 0.5rem;
}
/* Estilo para o loader */
.loader {
  border: 5px solid #f3f3f3;
  border-top: 5px solid #3498db;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: spin 1s linear infinite;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* Estilo para a barra de scroll */
main,
.overflow-y-auto,
#kanban-board-wrapper {
  scrollbar-width: thin;
  scrollbar-color: #a0aec0 #e2e8f0;
}
main::-webkit-scrollbar,
.overflow-y-auto::-webkit-scrollbar,
#kanban-board-wrapper::-webkit-scrollbar {
  height: 8px;
  width: 8px;
}
main::-webkit-scrollbar-track,
.overflow-y-auto::-webkit-scrollbar-track,
#kanban-board-wrapper::-webkit-scrollbar-track {
  background: #e2e8f0;
  border-radius: 10px;
}
main::-webkit-scrollbar-thumb,
.overflow-y-auto::-webkit-scrollbar-thumb,
#kanban-board-wrapper::-webkit-scrollbar-thumb {
  background-color: #a0aec0;
  border-radius: 10px;
  border: 2px solid #e2e8f0;
}
.dark main,
.dark .overflow-y-auto,
.dark #kanban-board-wrapper {
  scrollbar-color: #4a5568 #2d3748;
}
.dark main::-webkit-scrollbar-track,
.dark .overflow-y-auto::-webkit-scrollbar-track,
.dark #kanban-board-wrapper::-webkit-scrollbar-track {
  background: #2d3748;
}
.dark .overflow-y-auto::-webkit-scrollbar-thumb,
.dark #kanban-board-wrapper::-webkit-scrollbar-thumb {
  background-color: #4a5568;
  border: 2px solid #2d3748;
}
/* Dropdown de ações da coluna */
.column-header-menu {
  position: relative;
}
.column-actions-dropdown {
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 10;
  width: 120px;
}
/* Anexos */
#attachment-dropzone.dragover {
  border-color: #3498db;
  background-color: rgba(52, 152, 219, 0.1);
}
/* Tarefas Arquivadas */
.archived-item {
  @apply flex justify-between items-center p-2 bg-gray-100 dark:bg-gray-700 rounded;
}
/* Tarefa bloqueada */
.task-card.is-blocked {
  opacity: 0.7;
  background-color: #f8f8f8;
}
.dark .task-card.is-blocked {
  background-color: #3a3a3a;
}
/* Notificações */
.notification-item {
  @apply p-3 border-b dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600;
}
.notification-item.is-unread {
  @apply bg-blue-50 dark:bg-blue-900/20 font-semibold;
}
/* Modelos */
.template-list-item {
  @apply p-2 rounded cursor-pointer border border-transparent;
}
.template-list-item:hover {
  @apply bg-gray-200 dark:bg-gray-700;
}
.template-list-item.selected {
  @apply bg-blue-500 text-white border-blue-500;
}
/* View Switcher e Filtros de Data */
.view-switcher button {
    @apply px-3 py-1 rounded-md text-sm font-medium;
}
.view-switcher button.active {
  @apply bg-blue-500 text-white;
}
.view-switcher button:not(.active) {
  @apply text-gray-600 dark:text-gray-300;
}

/* Dashboard */
.overdue-task-item, .summary-task-item {
  @apply flex justify-between items-center p-2 border-b dark:border-gray-700;
}
.overdue-task-item:last-child, .summary-task-item:last-child {
  @apply border-b-0;
}
.summary-task-item {
    @apply cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-700 rounded;
}

/* Modal Genérico */
#generic-modal.hidden .generic-modal-content {
  transform: scale(0.95);
  opacity: 0;
}
#generic-modal .generic-modal-content {
  transition: all 0.2s ease-out;
}

/* Modal de Partilha */
.tab-button {
    @apply py-2 px-1 border-b-2 font-medium text-sm;
    @apply border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300;
    @apply dark:text-gray-400 dark:hover:text-gray-300 dark:hover:border-gray-600;
}
.tab-button.active {
    @apply border-blue-500 text-blue-600 dark:border-blue-500 dark:text-blue-500;
}

/* Chat */
#chat-sidebar .conversation-item {
    padding: 8px 12px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.9rem;
    transition: background-color 0.2s;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#chat-sidebar .conversation-item:hover {
    background-color: rgba(0, 0, 0, 0.05);
}
.dark #chat-sidebar .conversation-item:hover {
    background-color: rgba(255, 255, 255, 0.05);
}
#chat-sidebar .conversation-item.active {
    background-color: #3b82f6;
    color: white;
    font-weight: bold;
}

/* --- Estilos da Mensagem para incluir Avatar --- */
.chat-message {
    display: flex;
    align-items: flex-end; /* Alinha avatar e balão pela base */
    gap: 0.75rem; /* 12px */
    margin-bottom: 1rem;
}

.chat-message.my-message {
    justify-content: flex-end;
}

.message-content {
    display: flex;
    flex-direction: column;
    flex-grow: 1; 
    min-width: 0;
}

.chat-message.my-message .message-content {
    align-items: flex-end;
}

.message-bubble {
    max-width: 75%;
    padding: 0.75rem;
    border-radius: 12px;
    word-wrap: break-word;
}
.chat-message.my-message .message-bubble {
    background-color: #3b82f6;
    color: white;
    border-bottom-right-radius: 4px;
}
.chat-message.their-message .message-bubble {
    background-color: #e5e7eb;
    color: #1f2937;
    border-bottom-left-radius: 4px;
}
.dark .chat-message.their-message .message-bubble {
     background-color: #374151;
     color: #f3f4f6;
}
.message-time {
    font-size: 0.7rem;
    text-align: right;
    margin-top: 4px;
    opacity: 0.7;
}

/* --- Estilos para o Avatar do Chat --- */
.chat-avatar, .chat-avatar-initials {
    width: 40px;
    height: 40px;
    border-radius: 9999px;
    flex-shrink: 0;
}

.chat-avatar {
    object-fit: cover;
}

.chat-avatar-initials {
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: white;
    background-color: #6b7280;
}

.dark .chat-avatar-initials {
    background-color: #4b5563;
}


/* ESTILOS DE NOTIFICAÇÃO DO CHAT */
.unread-badge {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    width: 10px;
    height: 10px;
    background-color: #3b82f6;
    border-radius: 50%;
    border: 2px solid white;
}
.dark .unread-badge {
    border-color: #374151;
}
#chat-toggle-btn.has-unread::after {
    content: '';
    position: absolute;
    top: 10px;
    right: 10px;
    width: 12px;
    height: 12px;
    background-color: #ef4444;
    border-radius: 50%;
    border: 2px solid white;
}
.dark #chat-toggle-btn.has-unread::after {
    border-color: #3b82f6;
}

/* FUNDO DO CHAT ESTILO WHATSAPP */
:root {
  --doodle-color: #a1a1aa;
}

.dark {
  --doodle-color: #52525b;
}

#chat-main {
    background-color: #e5ddd5;
    background-image: url("data:image/svg+xml,%3Csvg width='160' height='160' viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3Epath %7B fill: none; stroke: var(--doodle-color, %23a1a1aa); stroke-width: 0.5; stroke-opacity: 0.5; %7D%3C/style%3E%3Cpath d='M28.21 11.23c2.72.45 5.32 1.3 7.8 2.53 2.89 1.44 5.5 3.3 7.9 5.47 2.23 2.02 4.2 4.2 5.9 6.58 1.4 1.95 2.5 4 3.32 6.13 .6 1.6 .93 3.24 1.1 4.9 .14 1.34.1 2.7-.12 4.04-.32 1.9-.9 3.75-1.7 5.5-.94 2.05-2.1 4-3.5 5.8-1.54 2-3.3 3.9-5.3 5.5-2.12 1.7-4.4 3.2-6.8 4.3-2.6 1.2-5.3 2-8.1 2.4-2.1.3-4.2.3-6.3.04-3.2-.4-6.3-1.3-9.2-2.8-2.9-1.4-5.6-3.3-8-5.5-2.07-1.87-3.9-4-5.5-6.2-1.3-1.8-2.4-3.7-3.2-5.7-.8-2-1.3-4-1.5-6.1-.2-2.1-.1-4.2.3-6.3 .5-2.5 1.4-5 2.8-7.3 1.4-2.4 3.2-4.5 5.2-6.5 2.1-2 4.4-3.7 6.9-5.1 2.8-1.5 5.8-2.7 8.8-3.4 1.6-.4 3.2-.6 4.8-.6 1.6-.04 3.2.1 4.8.4z'/%3E%3Cpath d='M81.28 15.76c.8.6 1.5 1.2 2.2 1.9 .7.7 1.3 1.4 1.9 2.2 .5.6.9 1.3 1.3 2 .4.7.7 1.4 1 2.1 .3.7.5 1.5.7 2.2 .2.7.3 1.5.4 2.3 .1.8.1 1.6.1 2.4 0 .8-.1 1.6-.2 2.4-.1.8-.3 1.6-.5 2.3-.2.8-.5 1.5-.8 2.2-.3.7-.7 1.4-1.1 2.1-.4.7-1 1.3-1.5 1.9-.5.6-1.2 1.2-1.8 1.7s-1.3.9-2 .9c-.7 0-1.4-.3-2-.9s-1.2-1.2-1.8-1.7c-.5-.6-1-1.3-1.5-1.9-.4-.7-.8-1.4-1.1-2.1-.3-.7-.6-1.5-.8-2.2-.2-.8-.4-1.6-.5-2.3-.1-.8-.2-1.6-.2-2.4s.1-1.6.2-2.4c.1-.8.3-1.5.5-2.3 .2-.7.5-1.5.8-2.2 .3-.7.7-1.4 1.1-2.1 .4-.7.9-1.3 1.5-1.9 .6-.5 1.2-1.1 1.8-1.7 .6-.6 1.3-.9 2-.9 .7 0 1.4.3 2 .9z'/%3E%3Cpath d='M153.3 13.5c1.4.1 2.8.3 4.2.7 2.8.8 5.4 2 7.8 3.7 2.2 1.5 4.2 3.4 5.9 5.5 1.4 1.7 2.5 3.6 3.4 5.7 .8 1.9 1.3 3.8 1.6 5.9 .3 2 .3 4.1 0 6.1s-.9 3.9-1.9 5.7c-1.1 2-2.5 3.9-4.1 5.5-1.8 1.8-3.8 3.3-6.1 4.5-2.5 1.3-5.1 2.3-7.9 2.9-2.1.5-4.2.7-6.4.5-1.6-.1-3.2-.5-4.8-.9-1.5-.5-3-.1-4.5-.8-1.5-.7-2.9-1.6-4.3-2.6-1.3-1.1-2.6-2.3-3.7-3.6-1-1.2-1.9-2.5-2.7-3.8-.7-1.3-1.3-2.6-1.7-4-.5-1.5-.8-3-1-4.6-.2-1.6-.2-3.2-.1-4.8 .2-2.1.6-4.2 1.3-6.2s1.6-3.9 2.8-5.7c1.2-1.8 2.7-3.5 4.3-4.9 1.9-1.6 3.9-2.9 6.1-3.9 2.4-1 4.9-1.7 7.5-2.1 1.6-.3 3.2-.4 4.8-.4z'/%3E%3Cpath d='M118.8 100.2c.1 1.7.2 3.3.1 5-.2 1.6-.5 3.2-1 4.8-.5 1.6-1.2 3.1-2 4.5-.8 1.4-1.8 2.7-2.9 3.9-1.1 1.2-2.4 2.3-3.8 3.2-1.4.9-3 1.7-4.6 2.3-1.6.6-3.3 1.1-5 1.4-1.8.3-3.5.4-5.3.3-1.7-.1-3.4-.4-5-.9-1.6-.5-3.2-1.1-4.6-1.9-1.5-.8-2.9-1.7-4.2-2.8-1.3-1.1-2.5-2.3-3.6-3.6-1.1-1.3-2-2.7-2.8-4.2-.8-1.5-1.4-3.1-1.8-4.7-.4-1.7-.6-3.3-.6-5 .1-1.7.3-3.3.6-5 .4-1.7 1-3.3 1.8-4.8 .8-1.5 1.7-3 2.8-4.3 1.1-1.3 2.4-2.5 3.8-3.6 1.4-1.1 2.9-2.1 4.4-2.9 1.6-.8 3.3-1.5 5-1.9 1.7-.5 3.5-.8 5.2-.8 1.8 0 3.5.2 5.2.6 1.7.4 3.4.9 5 1.6 1.6.7 3.1 1.5 4.5 2.5 1.4 1 2.8 2.2 4 3.5 1.2 1.3 2.3 2.8 3.2 4.3 1 1.6 1.8 3.2 2.4 5 .6 1.7 1 3.5 1.3 5.3z'/%3E%3Cpath d='M97.5 142.8c2.2.6 4.4 1.4 6.5 2.4 2.1 1 4.1 2.2 6 3.6 1.9 1.4 3.6 3 5.1 4.8 1.5 1.8 2.8 3.7 3.8 5.8 .9 2 1.6 4.1 2 6.2 .4 2.2.5 4.4.3 6.6-.2 2.2-.7 4.4-1.5 6.5-.8 2-1.9 4-3.2 5.8-1.3 1.7-2.9 3.3-4.6 4.7-1.7 1.3-3.6 2.5-5.6 3.4-2 .9-4.1 1.5-6.2 1.9-2.1.4-4.3.5-6.4.3-1.7-.2-3.4-.6-5-1.2-1.7-.6-3.3-1.4-4.9-2.4-1.6-1-3.1-2.2-4.5-3.6-1.4-1.4-2.6-2.9-3.6-4.5-1-1.6-1.8-3.3-2.4-5.1-.6-1.8-1-3.6-1.2-5.5-.2-1.9-.2-3.8.1-5.7s.8-3.8 1.5-5.6c.8-1.9 1.8-3.6 2.9-5.3 1.2-1.6 2.5-3.2 4-4.6 1.5-1.4 3.1-2.7 4.8-3.8 1.9-1.2 3.9-2.2 6-3 2.1-.8 4.3-1.5 6.5-1.9 1.7-.3 3.5-.5 5.2-.5z'/%3E%3Cpath d='M14.2 73.5c1.1.2 2.3.4 3.4.7 1.1.3 2.2.7 3.3 1.2 1.1.5 2.1 1 3.1 1.7 .9.6 1.8 1.3 2.6 2 .8.7 1.5 1.4 2.1 2.2 .6.8 1.1 1.6 1.6 2.5 .4.8.8 1.7 1.1 2.5 .3.9.5 1.7.6 2.6 .1.9.2 1.8.2 2.7s-.1 1.8-.2 2.7c-.1.9-.3 1.8-.6 2.6-.3.9-.7 1.7-1.1 2.5-.4.8-1 1.6-1.6 2.5-.6.8-1.2 1.6-2.1 2.2-.8.7-1.7 1.3-2.6 2-.9.6-2 1.2-3.1 1.7-1.1.5-2.2.9-3.3 1.2-1.1.3-2.2.5-3.4.7-1.1.2-2.3.3-3.4.3-1.1 0-2.3-.1-3.4-.3-1.1-.2-2.2-.4-3.3-.7-1.1-.3-2.1-.7-3.2-1.2s-2-1-3-1.7c-.9-.6-1.8-1.3-2.6-2-.8-.7-1.5-1.4-2.1-2.2-.6-.8-1.1-1.6-1.6-2.5-.4-.8-.8-1.7-1.1-2.5-.3-.9-.5-1.7-.6-2.6-.1-.9-.2-1.8-.2-2.7s.1-1.8.2-2.7c.1-.9.3-1.8.6-2.6 .3-.9.7-1.7 1.1-2.5 .4-.8 1-1.6 1.6-2.5 .6-.8 1.2-1.6 2.1-2.2 .8-.7 1.7-1.3 2.6-2 .9-.6 2-1.2 3.1-1.7 1.1-.5 2.2-.9 3.3-1.2 1.1-.3 2.2-.5 3.4-.7 1.1-.2 2.3-.3 3.4-.3 1.1 0 2.3.1 3.4.3z'/%3E%3C/svg%3E");
}

.dark #chat-main {
    background-color: #0d1418;
}

#chat-main .message-bubble {
    box-shadow: 0 1px 1px rgba(0,0,0,0.1);
}

/* --- Seletor de Emojis do Chat --- */
#emoji-toggle-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.5rem; /* 8px */
    border-radius: 50%;
}
#emoji-toggle-btn:hover {
    background-color: rgba(0,0,0,0.1);
}
.dark #emoji-toggle-btn:hover {
     background-color: rgba(255,255,255,0.1);
}

emoji-picker {
    z-index: 10; /* Garante que fica por cima de outros elementos */
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    border-radius: 0.5rem; /* 8px */
    border: 1px solid #e5e7eb;
}
.dark emoji-picker {
    border-color: #4b5563;
}

/* --- ADIÇÃO: Estilos para o Seletor de Emojis na página de Perfil --- */
#bio-emoji-toggle-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.25rem;
}


/* Swimlanes */
.swimlane-header {
    transition: all 0.3s ease;
}
.swimlane-header:hover {
    opacity: 0.9;
}
.swimlane-collapsed .swimlane-content {
    display: none;
}
.swimlane-item {
    transition: all 0.2s ease;
}
.swimlane-collapse-btn {
    transition: transform 0.2s ease;
}
.swimlane-collapse-btn.rotate-90 {
    transform: rotate(90deg);
}
.swimlane-collapse-btn.rotate-0 {
    transform: rotate(0deg);
}

/* Swimlane Board Sections */
.swimlane-section {
    margin-bottom: 1.5rem;
}

.swimlane-section .swimlane-header {
    cursor: pointer;
    user-select: none;
}

.swimlane-section .swimlane-content {
    transition: all 0.3s ease;
    overflow: hidden;
}

.swimlane-section .swimlane-content.hidden {
    max-height: 0;
    padding: 0;
    opacity: 0;
}

.swimlane-section .swimlane-content:not(.hidden) {
/*    max-height: 1000px; */
    opacity: 1;
}

/* Scrollbar for swimlane columns */
.swimlane-content > div {
    scrollbar-width: thin;
    scrollbar-color: #a0aec0 #e2e8f0;
}

.swimlane-content > div::-webkit-scrollbar {
    height: 8px;
}

.swimlane-content > div::-webkit-scrollbar-track {
    background: #e2e8f0;
    border-radius: 10px;
}

.swimlane-content > div::-webkit-scrollbar-thumb {
    background-color: #a0aec0;
    border-radius: 10px;
    border: 2px solid #e2e8f0;
}

.dark .swimlane-content > div {
    scrollbar-color: #4a5568 #2d3748;
}

.dark .swimlane-content > div::-webkit-scrollbar-track {
    background: #2d3748;
}

.dark .swimlane-content > div::-webkit-scrollbar-thumb {
    background-color: #4a5568;
    border: 2px solid #2d3748;
}

/* Format toolbar active button state */
#format-bold-btn.active,
#format-italic-btn.active,
#format-underline-btn.active {
    background-color: rgba(59, 130, 246, 0.2);
    color: rgb(59, 130, 246);
}

.dark #format-bold-btn.active,
.dark #format-italic-btn.active,
.dark #format-underline-btn.active {
    background-color: rgba(59, 130, 246, 0.3);
    color: rgb(96, 165, 250);
}
