@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  body {
    @apply antialiased bg-[#0b0f14] text-[#e0e6ed];
    font-family: 'Inter', sans-serif;
  }
}

@layer components {
  /* Painéis estilo Cyber/Neon */
  .panel {
    @apply bg-[#121820] border border-[#1e293b] rounded-xl shadow-lg relative overflow-hidden;
  }
  
  /* Gradiente subtil no border topo para dar efeito luminoso */
  .panel::before {
    content: '';
    @apply absolute top-0 left-0 right-0 h-[1px] bg-gradient-to-r from-transparent via-[#00e5ff]/50 to-transparent opacity-0 transition-opacity duration-300;
  }
  .panel:hover::before {
    @apply opacity-100;
  }

  /* Efeito glow para alertas/accent */
  .glow-accent {
    box-shadow: 0 0 15px rgba(0, 229, 255, 0.2);
  }
  .glow-alert {
    box-shadow: 0 0 15px rgba(255, 61, 61, 0.2);
  }
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #0b0f14; 
}
::-webkit-scrollbar-thumb {
  background: #1e293b; 
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #00e5ff; 
}