.navbar {
background-color: #FFFFFF !important;
}

.navbar-collapse {
    background-color: #FFFFFF !important;
}

.navbar-expand-lg .navbar-nav .dropdown-menu {
     background-color: #FFFFFF !important;
}

.nav-link {
    color: #000000 !important;
}

.navbar-nav a {
    color: #000000 !important;
}

.nav-link:hover {
    color: #111111 !important;
}

.navbar-toggler svg {
    fill: #111111 !important;
}

.dropdown-item:active, .dropdown-item:hover {
  background-color: #FFFFFF !important;
  color: #111111 !important;
}

.dropdown-toggle::after {
      color: #111111 !important;
}

.offcanvas-title {
      color: #000000 !important;
}

/* === CLS / aspect-ratio reserves (perf) === */
/* Square app icons: width/height attrs ignored by Bootstrap .img-fluid otherwise */
.app-list img.lazy,
.app-list img.img-fluid,
.top-apps img.lazy,
.top-apps img.img-fluid {
  aspect-ratio: 1 / 1;
  width: 100%;
  height: auto;
  object-fit: cover;
  background-color: #f3f3f3;
}

/* Main slider banner 850x410 — reserve space before image/CSS paint */
.swiper-main {
  aspect-ratio: 850 / 410;
  width: 100%;
  max-width: 100%;
  background-color: #e9ecef;
  overflow: hidden;
}
.swiper-main .swiper-slide > a > img.img-fluid {
  aspect-ratio: 850 / 410;
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
}

/* Topic cards often 880x514 */
.topics img.lazy,
.topics img.img-fluid {
  aspect-ratio: 880 / 514;
  width: 100%;
  height: auto;
  object-fit: cover;
  background-color: #f3f3f3;
}