/* Apply custom fonts from Google Fonts */
body {
    font-family: 'Poppins', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Montserrat', sans-serif;
}

/* Base styles for filter buttons */
.filter-btn {
    padding: 0.5rem 1rem;
    border-radius: 9999px; /* pill shape */
    font-weight: 500;
    font-size: 0.875rem;
    background-color: #374151; /* bg-gray-700 */
    color: #D1D5DB; /* text-gray-300 */
    transition: all 0.2s ease-in-out;
    border: 2px solid transparent;
}

.filter-btn:hover {
    background-color: #4B5563; /* bg-gray-600 */
}

/* Style for the active filter button */
.filter-btn.active {
    background-color: #22d3ee; /* bg-cyan-400 */
    color: #111827; /* text-gray-900 */
    font-weight: 600;
}

/* Style for the "New" badge on tool cards */
.new-badge {
    position: absolute;
    top: -10px;
    right: -10px;
    background-color: #ec4899; /* bg-pink-500 */
    color: white;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 9999px;
    transform: rotate(15deg);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
}