.datalist-item{display:block}

.data-filters {
    grid-column-end: -1;
    grid-column-start: 1;
}

.data-filters > div {
    width: fit-content;
    border: 1px solid #235580;
    border-radius: 9999px;
    padding: 3px;
    margin: auto;
    display: flex;
    flex-wrap: nowrap;
    font-weight: 500;
}

.data-filters > div > a {
    padding: 8px 22px;
    border-radius: 9999px;
    text-decoration: none;
}

.data-filters > div > a.active {
    background-color: #235580;
    color: white;
}

.see-more {
    margin-top: 1em;

}
.datalist-item .datalist-item-date {
    font-weight: 300;
}

.data-filters:has(.remove-tags) {
    display: flex;
    justify-content: center;
    gap: .5em;
}

.data-filters:has(.remove-tags) > div {
    margin: 0;
    padding: 4px 20px;
}

.data-filters:has(.remove-tags) > div > a {
    padding-top: 4px;
    padding-bottom: 4px;
}

.data-filters div:has(.remove-tags) {
    padding-left: 2px;
    padding-right: 2px;
}

.data-filters .remove-tags {
    scale: 1.7;
    translate: 0 -.125em;
    font-weight: 100;
    padding-left: 0 !important;
    padding-right: 0 !important;
    min-width: 2.3em;
    text-align: center;
}

.datalist-item-tag:hover,
.data-filters:has(.remove-tags) > div:has(a:hover) {
    background-color: #235580;
    color: white;
}

.data-filters:not(:has(.remove-tags)) a {
    background-color: #235580;
    color: white;
}

.data-filters:not(:has(.remove-tags)) a:not(.active) {
    background-color: white;
    color: #235580;
}

.data-filters:has(.remove-tags) > div:has(a.active),
.data-filters:has(.remove-tags) a.active {
    background-color: white;
    color: #235580;
}

.data-filters a.active {
    pointer-events: none;
}