/* Navbar starts */

.navbar__search-container:hover {
  background-color: var(--bg-secondary);
  box-shadow: 0 0 0 var(--spacing-4px) var(--bg-secondary-shade);
}

.navbar-search-focus {
  background-color: var(--bg-secondary);
  box-shadow: 0 0 0 var(--spacing-4px) var(--bg-secondary-shade);
}

.navbar__links-bookmarks:hover {
  background-color: var(--color-secondary-dark);
}

.navbar__search__clear-icon:hover {
  color: var(--bg-primary-shade);
}

.navbar__links > *:hover {
  color: var(--text-primary);
}

.navbar__datetime:hover {
  color: var(--text-primary);
}

.navbar__links > *:focus {
  border-radius: var(--spacing-4px);
  box-shadow: 0 0 0 var(--spacing-4px) var(--bg-secondary-shade);
  color: var(--text-primary);
  outline: none;
}

.category-list__item__link:hover {
  background-color: var(--bg-secondary);
}

/* Navbar ends */

/* Trending section starts */

.trending-section__grid__item:hover .action-container {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}

.trending-section__card__title:hover {
  text-decoration: underline;
}

.trending-section__card:hover {
  filter: brightness(80%);
}

/* Trending section ends */

/* Carousel starts */

.carousel__btn:hover {
  background-color: var(--bg-secondary);
}

.carousel__btn:focus .btn__icon {
  box-shadow: 0 0 0 var(--spacing-4px) var(--bg-secondary-shade);
}

.carousel__btn:focus {
  background-color: var(--bg-secondary);
}

/* Carousel ends */

/* Button states starts */

.btn:hover .btn__icon {
  background-color: var(--color-white-transparent-bright);
}

.btn:focus .btn__icon {
  background-color: var(--color-white-transparent-bright);
}

/* Button states ends */

/* Top news starts */

.news-card:hover .news-card__img-container .news-card__img {
  filter: brightness(70%);
}

.news-card:hover .action-container {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}

.news-card:hover .news-card__title {
  text-decoration: underline;
}

.news__btn:hover,
.news__btn:focus {
  opacity: 0.9;
}

/* .news__btn--right:hover,
.news__btn--right:focus {
  border-top: 5px solid #ccc;
  border-left: 5px solid #ccc;
  border-bottom: 5px solid #ccc;
} */

/* .news__btn--left:hover,
.news__btn--left:focus {
  border-top: 5px solid #ccc;
  border-right: 5px solid #ccc;
  border-bottom: 5px solid #ccc;
} */

.news__btn:hover .btn__icon,
.news__btn:focus .btn__icon {
  color: #444;
}

/* Top news ends */

/* Search page filter section starts */

.filter:hover {
  color: var(--text-dark);
}

input[type="date"]:hover,
input[type="date"]:active {
  background-color: #ddd;
}

input[type="date"]:focus {
  box-shadow: 0 0 0 var(--spacing-4px) var(--bg-secondary-shade);
}

.filter__date-btn:hover,
.filter__date-btn:focus {
  background-color: var(--bg-primary);
}

.filter__date-btn:focus {
  box-shadow: 0 0 0 var(--spacing-4px) var(--bg-secondary-shade);
}

.filters__btn:hover,
.filters__btn:active,
.filters__btn:focus {
  color: var(--text-secondary);
}

.filters__btn:focus {
  box-shadow: 0 0 0 var(--spacing-4px) var(--bg-primary);
}

.filters__section--sources .filters__body:hover {
  overflow: auto;
}

/* Search page filter section ends */

/* Search results styles starts */

.search-results__card:hover {
  background-color: #f3f3f4;
}

.search-results__card__link:hover .search-results__card__title {
  text-decoration: underline;
}

.search-results__card__link:hover .search-results__card__img-container img {
  filter: brightness(80%);
}

.search-results__card__btn-read-more:hover {
  background-color: var(--bg-primary);
  color: var(--text-primary);
}

.search-results__card__btn-read-more:active,
.search-results__card__btn-read-more:focus {
  background-color: var(--bg-primary);
  color: var(--text-primary);
  box-shadow: 0 0 0 var(--spacing-4px) var(--bg-secondary-shade);
}

.search__clear-icon:hover,
.search__clear-icon:active,
.search__clear-icon:focus {
  color: #333;
}
/* Search results styles ends */

/* Language filters styles starts */

.language-filter__selected:hover,
.language-filter__selected:active,
.language-filter__selected:focus {
  background-color: #e9eff2;
  color: #333;
}

.language-filter__selected:active {
  background-color: #e9eff2;
  transform: translateY(1px) scale(0.95);
}

.language-filter__selected:focus {
  box-shadow: 0 0 0 var(--spacing-4px) var(--bg-secondary-shade);
}

.language-filter__dropdown__item:hover {
  background-color: #e9eff2;
  color: #444;
}

/* Language filters styles ends */

/* Pagination styles starts */

.pagination__pages__list__item:hover,
.pagination__pages__item:hover {
  background-color: var(--bg-primary-tint);
  color: var(--text-primary);
}

.pagination__pages__list__item:hover {
  transform: scale(1.1);
}

.pagination__pages__item:focus {
  background-color: var(--bg-primary-tint);
  color: var(--text-primary);
  box-shadow: 0 0 0 var(--spacing-4px) var(--bg-secondary-shade);
  border: none;
}

.pagination__pages--disabled:hover,
.pagination__pages--disabled:focus {
  background-color: #ddd;
  color: #999;
  box-shadow: none;
}

/* Pagination styles ends */

/* Action btn styles starts */

.action__btn:hover {
  background-color: var(--bg-primary);
}

.action__btn:active,
.action__btn:focus {
  background-color: var(--bg-primary);
  box-shadow: 0 0 0 var(--spacing-2px) var(--bg-secondary-shade);
}

/* Action btn styles ends */

/* Bookmarks styles starts */

.bookmarks__card:hover .action-container {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}

/* Bookmarks styles ends */

/* Categories styles starts */

.featured-grid__item:hover .featured-grid__item__title {
  text-decoration: underline;
}

.featured-grid__item:hover img {
  filter: brightness(80%);
}

.category-news__card:hover .category-news__card__title {
  text-decoration: underline;
}

.category-news__card:hover img {
  filter: brightness(80%);
}

.more-news__item:hover img {
  filter: brightness(80%);
}

.more-news__item:hover .more-news__item__title {
  text-decoration: underline;
}

/* Categories styles ends */

/* Footer starts */

.footer__category-links li a:hover,
.footer__category-links li a:active,
.footer__category-links li a:focus,
.footer__quick-links li a:hover,
.footer__quick-links li a:active,
.footer__quick-links li a:focus {
  text-decoration: underline;
}

/* Footer ends */