/**
 * ASTRA Sticky Menu - CSS
 * Version: 1.0.0
 */

/* Base sticky header styles */
#masthead {
  position: relative;
  z-index: 999;
  transition: all 0.3s ease-in-out;
  will-change: transform;
}

/* Sticky state */
.ast-header-sticked #masthead {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  transform: translateY(0);
}

/* Account for admin bar */
.admin-bar.ast-header-sticked #masthead {
  top: 32px;
}

@media screen and (max-width: 782px) {
  .admin-bar.ast-header-sticked #masthead {
    top: 46px;
  }
}

/* Shrink effect */
.ast-header-sticked.ast-header-shrink .ast-primary-header-bar {
  min-height: 60px;
  transition: min-height 0.3s ease-in-out;
}

.ast-header-sticked.ast-header-shrink .site-logo-img img,
.ast-header-sticked.ast-header-shrink .custom-logo {
  max-height: 100px;
  transition: max-height 0.3s ease-in-out;
}

/* Hide on scroll down */
.ast-header-hide #masthead {
  transform: translateY(-100%);
}

/* Ensure content doesn't jump */
.ast-header-sticked #content,
.ast-header-sticked .site-content {
  padding-top: 0;
}

/* Placeholder to prevent layout shift */
.ast-sticky-placeholder {
  display: none;
  visibility: hidden;
}

.ast-header-sticked .ast-sticky-placeholder {
  display: block;
  visibility: visible;
}

/* Mobile specific styles */
@media (max-width: 921px) {
  .ast-header-sticked #ast-mobile-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
  }

  .admin-bar.ast-header-sticked #ast-mobile-header {
    top: 46px;
  }

  .ast-header-sticked.ast-header-shrink .ast-mobile-header-wrap {
    min-height: 60px;
  }

  .ast-header-sticked.ast-header-shrink #ast-mobile-header .site-logo-img img {
    max-height: 120px;
  }
}

/* Desktop specific styles */
@media (min-width: 922px) {
  .ast-header-sticked #ast-desktop-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
  }

  .admin-bar.ast-header-sticked #ast-desktop-header {
    top: 32px;
  }
}

/* Smooth animations for menu items */
.ast-header-sticked .main-header-menu > li,
.ast-header-sticked .ast-builder-menu-1 {
  transition: all 0.3s ease-in-out;
}

/* Shadow effect (will be added via inline CSS if enabled) */
.ast-header-sticked #masthead {
  transition: all 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

/* Performance optimizations */
#masthead,
#ast-desktop-header,
#ast-mobile-header {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

/* Ensure menu toggle button stays visible */
.ast-header-sticked .menu-toggle {
  position: relative;
  z-index: 10000;
}

/* Fix for mobile menu overlay */
.ast-header-sticked .ast-mobile-header-content {
  position: fixed;
  top: 60px;
  left: 0;
  right: 0;
}

.admin-bar.ast-header-sticked .ast-mobile-header-content {
  top: 106px;
}

@media screen and (max-width: 782px) {
  .admin-bar.ast-header-sticked .ast-mobile-header-content {
    top: 106px;
  }
}

/* Accessibility improvements */
.ast-header-sticked #masthead:focus-within {
  outline: 2px solid #007cba;
  outline-offset: -2px;
}

/* RTL support */
[dir="rtl"] .ast-header-sticked #masthead {
  left: 0;
  right: 0;
}

/* Print styles - remove sticky behavior when printing */
@media print {
  .ast-header-sticked #masthead {
    position: relative !important;
    transform: none !important;
  }
}

/* ---------------------------------------
   Plugin-only logo swap (HOMEPAGE)
   Swap only AFTER alt logo is injected
---------------------------------------- */

.home .custom-logo-link {
  position: relative;
  display: inline-block;
}

/* Default: normal logo visible */
.home .custom-logo-link img {
  transition: opacity 0.2s ease-in-out;
  opacity: 1;
  visibility: visible;
}

/* Alt logo overlays the normal logo, hidden by default */
.home .custom-logo-link img.ast-alt-logo-img {
  position: absolute;
  left: 0;
  top: 0;
  width: auto;      /* important (avoid stretching) */
  height: 100%;
  opacity: 0;
  visibility: hidden;
}

/* Only when injected + active: hide normal, show alt */
.home.ast-alt-logo-ready.ast-alt-logo-active .custom-logo-link img:not(.ast-alt-logo-img) {
  opacity: 0;
  visibility: hidden;
}

.home.ast-alt-logo-ready.ast-alt-logo-active .custom-logo-link img.ast-alt-logo-img {
  opacity: 1;
  visibility: visible;
}




/* Only swap when alt logo exists (prevents blank logo on load) */
.home.ast-alt-logo-ready.ast-alt-logo-active .custom-logo-link img:not(.ast-alt-logo-img) {
  opacity: 0;
  visibility: hidden;
}

.home.ast-alt-logo-ready.ast-alt-logo-active .custom-logo-link img.ast-alt-logo-img {
  opacity: 1;
  visibility: visible;
}

/* Default: always show normal logo until alt is ready */
.home .custom-logo-link img {
  opacity: 1;
  visibility: visible;
}



/* ===== HOME: after scroll ===== */
.home.ast-header-sticked .site-header {
  background-color: #ffffff !important;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}

/* Menu + logo text becomes black */
.home.ast-header-sticked .main-header-menu a,
.home.ast-header-sticked .site-title a,
.home.ast-header-sticked .site-header a,
.home.ast-header-sticked .ast-header-social-wrap a {
  color: #111111 !important;
}

/* Mobile hamburger icon */
.home.ast-header-sticked .ast-mobile-menu-trigger-minimal .menu-toggle-icon {
  color: #111111 !important;
}

.home.ast-header-sticked .ast-primary-header-bar {
  background-color: #ffffff !important;
}



.ast-primary-header-bar  {
  background: rgba(255, 255, 255, 0.55);
  backdrop-filter: blur(6px) saturate(105%);
  -webkit-backdrop-filter: blur(6px) saturate(105%);
  
  transition: background 0.3s ease;
}

.ast-desktop .main-header-menu.ast-menu-shadow .sub-menu {

    background: transparent;
      background: rgba(255, 255, 255, 0.55);
  backdrop-filter: blur(6px) saturate(105%);
  -webkit-backdrop-filter: blur(6px) saturate(105%);
  
  transition: background 0.3s ease;
}


/* ==========================
   HOMEPAGE: Mobile MENU toggle colors
   Top = white, After scroll = black
   ========================== */
@media (max-width: 921px) {

  /* TOP of homepage (not sticky yet): white */
  .home:not(.ast-header-sticked) .ast-mobile-menu-trigger-minimal,
  .home:not(.ast-header-sticked) .ast-mobile-menu-trigger-minimal .mobile-menu,
  .home:not(.ast-header-sticked) .ast-mobile-menu-trigger-minimal .mobile-menu-toggle-icon,
  .home:not(.ast-header-sticked) .ast-mobile-menu-trigger-minimal svg {
    color: #ffffff !important;
    fill: #ffffff !important;
  }

  /* AFTER SCROLL (sticky): black */
  .home.ast-header-sticked .ast-mobile-menu-trigger-minimal,
  .home.ast-header-sticked .ast-mobile-menu-trigger-minimal .mobile-menu,
  .home.ast-header-sticked .ast-mobile-menu-trigger-minimal .mobile-menu-toggle-icon,
  .home.ast-header-sticked .ast-mobile-menu-trigger-minimal svg {
    color: #111111 !important;
    fill: #111111 !important;
  }
}
