.snack-notify-container {
  position: fixed;
  z-index: 99999; // Muito alto para ficar acima de tudo
  pointer-events: none; // Permite cliques através do container vazio
  
  // Posicionamento padrão: top-right
  &.top-right {
    top: 80px; // Abaixo do header
    right: 16px;
    
    @media (max-width: 768px) {
      top: 80px;
      right: 8px;
      left: 8px; // Em mobile, ocupa largura total com margens
    }
  }
  
  &.top-center {
    top: 80px;
    left: 50%;
    transform: translateX(-50%);
    
    @media (max-width: 768px) {
      left: 8px;
      right: 8px;
      transform: none;
    }
  }
  
  &.top-left {
    top: 80px;
    left: 16px;
    
    @media (max-width: 768px) {
      left: 8px;
      right: 8px;
    }
  }
  
  &.bottom-right {
    bottom: 16px;
    right: 16px;
    
    @media (max-width: 768px) {
      bottom: 90px; // Acima do footer mobile se houver
      right: 8px;
      left: 8px;
    }
  }
  
  // Permitir interação com as notificações
  app-snack-notify {
    pointer-events: auto;
  }
}

// Garantir que o container seja sempre visível
.snack-notify-container {
  max-height: calc(100vh - 100px); // Deixar espaço para header/footer
  overflow-y: auto;
  overflow-x: hidden;
  
  // Scrollbar customizada (webkit)
  &::-webkit-scrollbar {
    width: 4px;
  }
  
  &::-webkit-scrollbar-track {
    background: transparent;
  }
  
  &::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 2px;
  }
  
  &::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.3);
  }
}

// Animação de entrada do container
.snack-notify-container {
  animation: containerFadeIn 0.3s ease-out;
}

@keyframes containerFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
} 