/* Custom styles */
.sort:hover {
    background-color: #f3f4f6;
}

.sort::after {
    content: "↑↓";
    margin-left: 5px;
    font-size: 0.8em;
    opacity: 0.5;
}

.sort[data-direction="asc"]::after {
    content: "↑";
    opacity: 1;
}

.sort[data-direction="desc"]::after {
    content: "↓";
    opacity: 1;
}

/* Responsive adjustments */
@media (max-width: 640px) {
    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    table {
        font-size: 0.875rem;
    }

    th, td {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
}