.filter-group:not(:first-child) {
  margin-top: var(--gap-xl);
}
.filter__range {
  display: flex;
  gap: var(--gap-xs);
}

.search-tags__list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap-xs);
}
.search-tags__list .tag::part(text) {
  max-width: 220px;
}

.news .search-form {
  max-width: 300px;
  width: 100%;
}
.news-empty {
  padding: var(--gap-xl) 0;
  color: var(--text-secondary-color);
  text-align: center;
}
.news__controls {
  display: flex;
  gap: var(--gap-s);
}
.news__filter {
  margin-top: var(--gap-m);
}
.news-list {
  padding: var(--gap-s);
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: var(--gap-s);
  background: var(--base-50);
  border-radius: var(--border-radius-300);
}
@media (min-width: 768px) {
  .news-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: var(--gap-m);
  }
}
@media (min-width: 1441px) {
  .news-list {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}
@media (min-width: 1920px) {
  .news-list {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}
.news-list-wrapper {
  margin-top: var(--gap-m);
}
.news-list__item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: var(--gap-s);
  border-radius: var(--border-radius-300);
  background: var(--white);
}
.news-item__date {
  font-size: var(--font-size-xs);
  line-height: var(--line-height-xs);
}
.news-item__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.news-item__image-wrapper {
  position: relative;
  aspect-ratio: 1/1;
  border-radius: var(--border-radius-300);
  background-color: var(--background-neutral);
  overflow: hidden;
}
.news-item__image-overlay {
  position: absolute;
  inset: 0;
}
.news-item__content {
  display: flex;
  flex-direction: column;
  row-gap: var(--gap-xxs);
  margin-top: var(--gap-s);
}
.news-item__author {
  font-size: var(--font-size-xs);
  line-height: var(--line-height-xs);
  color: var(--base-400);
}
.news-item__title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.news-item__title {
  font-size: var(--font-size-s, 14px);
  font-weight: 500;
  line-height: var(--line-height-s, 1.4);
}
.news-item__title {
  color: var(--text-default, var(--base-800, #171718));
  transition: color var(--transition, var(--transition-duration, 0.3s) var(--transition-timing-function, ease));
}
@media (hover: hover) {
  .news-item__title:hover {
    color: var(--text-primary, var(--primary-500, #087BF7));
  }
}
.news-item__title:focus-visible {
  color: var(--text-primary, var(--primary-500, #087BF7));
}
.news-item__title:active {
  color: var(--text-primary-pressed, var(--primary-700, #06467F));
}
.news-item__title {
  font-size: var(--font-size-m, 16px);
  font-weight: 600;
  line-height: var(--line-height-m, 1.5);
}
.news-item__text {
  font-size: var(--font-size-s, 14px);
  font-weight: 400;
  line-height: var(--line-height-s, 1.4);
  color: var(--text-secondary-color, var(--base-600, #5E5E62));
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.news-item__footer {
  margin-top: var(--gap-s);
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--base-400);
}
.news-item__views {
  display: flex;
  align-items: center;
  column-gap: var(--gap-xxs);
}
.news__footer {
  display: flex;
  margin-top: var(--gap-m);
}
.news__pagination {
  display: flex;
  gap: var(--gap-m);
  justify-content: flex-end;
}
.news__pagination--top {
  margin-bottom: var(--gap-3xl);
}
.news__pagination--bottom {
  margin-top: var(--gap-3xl);
}
.news__pagination__toggler {
  width: max-content;
  min-width: max-content;
  display: none;
}
@media (min-width: 768px) {
  .news__pagination__toggler {
    display: block;
  }
}

.news:has(.no-data) .news__controls,
.news:has(.no-data) .news__filter {
  display: none;
}
.news:has(.no-data) .news-list-wrapper {
  margin: 0;
}

.news__filter-button {
  --sotbit-button-icon-badge-size: 12px;
}

.search-language-guess {
  color: var(--text-secondary-color, var(--base-600, #5E5E62));
  margin: var(--gap-xxs) var(--gap-m);
  font-size: var(--font-size-xs, 12px);
  font-weight: 400;
  line-height: var(--line-height-xs, 1.3);
}