/* category.css */
body {
    background-color: #121212; /* Dark background color */
    color: #ffffff; /* Text color */
}

.container {
    padding: 20px; /* Add padding to the container for better spacing */
}

h1 {
    color: #ffffff; /* Title color */
}

.list-group-item {
    background-color: #1e1e1e; /* Dark background for list items */
    color: #ffffff; /* Text color for list items */
    border: 1px solid #23272a; /* Dark border for list items */
}

.list-group-item a {
    color: #007bff; /* Link color */
    text-decoration: none; /* Remove underline from links */
}

.list-group-item a:hover {
    text-decoration: underline; /* Underline on hover for links */
}

.btn-primary {
    background-color: #007bff; /* Primary button background color */
    border-color: #007bff; /* Primary button border color */
}

.btn-primary:hover {
    background-color: #0056b3; /* Darker shade on hover */
    border-color: #0056b3; /* Darker border on hover */
}

.pagination .page-link {
    background-color: #1e1e1e; /* Dark background for pagination */
    color: #ffffff; /* Text color for pagination links */
}

.pagination .page-link:hover {
    background-color: #007bff; /* Highlight on hover */
    color: #ffffff; /* Text color for highlighted links */
}

.pagination .active .page-link {
    background-color: #007bff; /* Active page link color */
    border-color: #007bff; /* Active page border color */
}

.pagination .disabled .page-link {
    background-color: #343a40; /* Dark gray for disabled state */
    color: #6c757d; /* Light gray for disabled text */
    cursor: not-allowed; /* Change cursor to not-allowed */
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .profile-picture {
        width: 40px; /* Smaller profile picture on mobile */
        height: 40px; /* Smaller profile picture on mobile */
    }

    .list-group-item {
        padding: 10px; /* Adjust padding for mobile */
    }
}