/* assets/css/style.css */
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer components {
  .card-hover {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  }
  
  .card-hover:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  }

  .stratagem-card {
    transition: all 0.2s ease;
  }

  .modal {
    animation: modalPop 0.3s ease forwards;
  }

  @keyframes modalPop {
    from {
      opacity: 0;
      transform: scale(0.95);
    }
    to {
      opacity: 1;
      transform: scale(1);
    }
  }
}

/* Scrollbar for dark theme */
::-webkit-scrollbar {
  height: 8px;
  width: 8px;
}

::-webkit-scrollbar-thumb {
  background-color: #d97706;
  border-radius: 20px;
}