﻿.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap; /* Ensure items stay in one row */
    gap: 10px;
}

    .pagination .prev,
    .pagination .next {
        padding: 8px 12px;
        background-color: #007bff;
        color: white;
        border: none;
        cursor: pointer;
        border-radius: 4px;
    }

        .pagination .prev:disabled,
        .pagination .next:disabled {
            background-color: #cccccc;
            cursor: not-allowed;
        }

    .pagination .page-info {
        margin: 0 15px;
    }

    .pagination .page-numbers {
        display: flex;
        gap: 5px;
    }

    .pagination .page-link {
        padding: 8px 12px;
        background-color: #f1f1f1;
        border: 1px solid #ddd;
        border-radius: 4px;
        cursor: pointer;
    }

        .pagination .page-link.active {
            background-color: #007bff;
            color: white;
        }

    .pagination .ellipsis {
        padding: 8px 12px;
        cursor: pointer;
    }

        .pagination .ellipsis span {
            color: #007bff;
            cursor: pointer;
            text-decoration: underline;
        }
/*sort link*/
/* Base styles for sort columns */
.sort-column {
    display: flex;
    align-items: center;
    margin-bottom: 10px; /* Add spacing between sort columns */
    justify-content: space-between; /* Equal space between items */
}

/* Flexbox to align the sort link and arrow */
.sort-link {
    display: flex;
    align-items: center;
    text-decoration: none; /* Remove underline from links */
    color: inherit; /* Inherit color from parent */
    width: 100%; /* Ensure sort link takes full width of its container */
    justify-content: space-between; /* Space between text and arrow */
}

/* Initially hide all arrows */
    .sort-link .arrow {
        display: none; /* Hide arrows by default */
        margin-left: 5px; /* Space between text and arrow */
        transition: transform 0.3s ease; /* Smooth transition for rotation */
    }

/* Show arrow next to sort link */
.sort-link .arrow {
    display: inline; /* Ensure it’s visible next to the sort link */
}

/* Rotation for ascending and descending sort */
.arrow.rotate-up {
    transform: rotate(0deg); /* Default rotation for ascending */
}

.arrow.rotate-down {
    transform: rotate(180deg); /* Rotation for descending */
}

/* Optional: Additional styling for the sort links */
.sort-link {
    font-weight: bold; /* Highlight sort links */
    color: #007bff; /* Change color to indicate interactiveness */
}

    .sort-link:hover {
        text-decoration: underline; /* Add underline on hover */
    }

/* Responsive adjustments */
@media (max-width: 768px) {
    .sort-column {
        flex-direction: column; /* Stack items vertically on smaller screens */
        margin-bottom: 15px; /* Add more space between stacked items */
    }

    .sort-link {
        justify-content: flex-start; /* Align text to the start, and move arrow down */
    }

        .sort-link .arrow {
            margin-left: 0; /* Remove margin on small screens to prevent excessive space */
            margin-top: 5px; /* Add space between text and arrow */
        }
}

@media (max-width: 576px) {
    .sort-column {
        margin-bottom: 20px; /* Increase space between stacked items for very small screens */
    }
}

/* Large screen adjustments */
@media (min-width: 992px) {
    .sort-column {
        margin-bottom: 10px; /* Reset bottom margin on large screens */
    }

    .sort-link {
        justify-content: flex-end; /* Align text and arrow to the end */
    }

        .sort-link .arrow {
            margin-left: 5px; /* Adjust spacing between text and arrow */
        }
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #495057;
    background-color: #0e6ddb;
    border-color: #dee2e6 #dee2e6 #fff;
    color: white;
}
