@font-face {
  font-family: 'guaruja';
  src: url('/fonts/guaruja/guaruja.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

.font-guaruja {
  font-family: 'guaruja', sans-serif;
}


#modalAgendamentoTitulo,
#modal h2 {
  cursor: move;
}

/* Animação de rotação sutil para o ícone */
#menuContainer.open #menuIcon {
  transform: rotate(180deg);
  filter: invert(16%) sepia(98%) saturate(5000%) hue-rotate(260deg) brightness(90%) contrast(100%);
}

/* Estado aberto do menu */
#menuContainer.open #dropdownMenu {
  opacity: 1;
  scale: 1;
  pointer-events: auto;
}

#dropdownMenu {
  transform-origin: top right;
}

#dropdownMenu.opacity-100.translate-y-0.scale-100 {
  opacity: 1 !important;
  transform: translateY(0) scale(1) !important;
}

#campoParticipantes {
  position: relative;
  overflow: visible;
}

/* padrão (claro) */
.custom-scroll::-webkit-scrollbar-thumb {
  background-color: #cbd5e1;
  border-radius: 8px;
  transition: background-color 0.2s;
}

.custom-scroll::-webkit-scrollbar-track {
  background: transparent;
}

/* modo escuro via media query */
@media (prefers-color-scheme: dark) {
  .custom-scroll::-webkit-scrollbar-thumb {
    background-color: #ffffff;
  }

  .custom-scroll::-webkit-scrollbar-track {
    background: #ffffff;
  }
}

/* Firefox */
.custom-scroll {
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
  /* thumb track (claro) */
}

@media (prefers-color-scheme: dark) {
  .custom-scroll {
    scrollbar-color: #ffffff #ffffff;
    /* thumb track (escuro) */
  }
}

#chipsContainer div {
  transition: all 0.25s ease;
}

@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(5px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-chip {
  animation: fadeUp 0.3s ease-out forwards;
}


.tarefa-card {
  background: linear-gradient(145deg, rgba(255,255,255,0.9), rgba(245,245,255,0.7));
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,0.4);
  transition: all 0.3s ease;
}
.dark .tarefa-card {
  background: linear-gradient(145deg, rgba(30,30,46,0.8), rgba(42,42,60,0.8));
  border-color: rgba(255,255,255,0.1);
}
.tarefa-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

@keyframes fadeSlide {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.tarefa-card {
  animation: fadeSlide 0.25s ease-out;
}

.w-20 {
  width: 5rem !important;
}
.ml-20 {
  margin-left: 5rem !important;
}
.ml-72 {
  margin-left: 18rem !important;
}