/* Top Navigation Enhancements - Scroll reveal & banner overlay
   --------------------------------------------------------------
   Behavior:
   - Header starts hidden (translated upward) and overlays the banner with a gradient.
   - Once user scrolls a bit (>10px), header slides in (header--visible).
   - While within the banner height, header uses overlay style (transparent gradient, light text).
   - After passing banner height, header becomes solid (white background + shadow) and spacer div creates layout offset.
*/

.header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1030; /* above banner */
  /* transform: translateY(-100%); */
  transition: transform 0.45s ease, background-color 0.35s ease,
    box-shadow 0.35s ease, color 0.35s ease;
  will-change: transform, background-color;
}

/* Ensure we don't keep old box shadows when overlaying */
.header.header--overlay {
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.55) 0%,
    rgba(0, 0, 0, 0) 70%
  ) !important;
  box-shadow: none !important;
  color: #fff;
}

/* Force override if original markup has bg-light */
.header.header--overlay.bg-light {
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.55) 0%,
    rgba(0, 0, 0, 0) 70%
  ) !important;
}

.header.header--visible {
  transform: translateY(0);
}

.header.header--solid {
  background: #ffffff !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
  color: #222;
}

/* Minimal (logo-only) initial state */
.header.header--minimal {
  background: transparent !important;
  box-shadow: none !important;
  transform: translateY(0); /* visible */
}

/* Container that holds full navigation content (menus, search, ticker) */
.nav-full-content {
  opacity: 1;
  /* pointer-events: none; */
  transition: opacity 0.35s ease;
}
.header--expanded .nav-full-content {
  opacity: 1;
  pointer-events: auto;
}

/* While minimal, hide news bar & menu wrappers */
/* .header.header--minimal .header-menu,
.header.header--minimal .news-header,
.header.header--minimal .search-box,
.header.header--minimal ul.list-unstyled {
  display: none !important;
}    */
.header.header--minimal .news-header {
  display: none !important;
}

/* Keep only logo area sizing in minimal state */
.header .navbar-brand img {
  max-height: 75px;
  height: 75px;
  width: auto;
}

/* Link coloring adjustments in overlay mode */
.header.header--overlay a,
.header.header--overlay .news-title,
.header.header--overlay .news-header a,
.header.header--overlay .navbar-toggler-icon {
  color: #fff !important;
}

/* Optional: dark mode icon fill tweaks */
.header.header--overlay img[alt="Login"],
.header.header--overlay img[alt="Language"],
.header.header--overlay img[alt="Accesibility"],
.header.header--overlay img[alt="Call"] {
  filter: brightness(0) invert(1);
}

/* Banner block sits underneath */
.banner-block {
  position: relative;
  z-index: 10;
}
/* Ensure tabs and overlay elements are below header */
.banner-block .swiper-tabs {
  z-index: 5;
}

/* Spacer updates dynamically */
#header-space {
  width: 100%;
  height: 0;
  transition: height 0.35s ease;
}

/* Responsive tweaks */
@media (max-width: 992px) {
  .header {
    transition-duration: 0.4s;
  }
  .header.header--overlay {
    background: rgba(0, 0, 0, 0.55) !important;
  }
}

/* Smooth fade of news ticker background if desired */
.header.header--overlay .news-header {
  background: transparent;
}
.header.header--solid .news-header {
  background: linear-gradient(249deg, #1a4b84 0%, #06111e 100%);
}

/* Accessibility: reduce motion preference */
@media (prefers-reduced-motion: reduce) {
  .header {
    transition: none;
  }
  #header-space {
    transition: none;
  }
}
.header.header--overlay a.dropdown-item {
  color: var(--si-dropdown-link-color) !important;
}
@media (max-width: 992px) {
  .header.header.header--minimal a,
  .header.header.header--minimal .news-title,
  .header.header.header--minimal .news-header a,
  .header.header.header--minimal .navbar-toggler-icon {
    color: #004b8d !important;
  }
}
