/**
 * 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 */
.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;
  }
}

/* =========================================
   HOMEPAGE HEADER — Glassmorphism (always)

   STATE 1: Top of page → glass on any bg
   STATE 2: After scroll → glass on white
   ========================================= */

/* --- Shared glass card base --- */
.home .ast-primary-header-bar {
  background: rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.18);
  transition:
    background 0.35s ease,
    box-shadow 0.35s ease,
    backdrop-filter 0.35s ease;
}

/* --- STATE 1: Top of page ---
   White text + subtle shadow for readability over hero imagery */
.home:not(.ast-header-sticked) .main-header-menu a,
.home:not(.ast-header-sticked) .site-title a,
.home:not(.ast-header-sticked) .site-header a,
.home:not(.ast-header-sticked) .ast-header-social-wrap a {
  color: #ffffff !important;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.25);
}

/* Mobile hamburger — top of page */
.home:not(.ast-header-sticked) .ast-mobile-menu-trigger-minimal,
.home:not(.ast-header-sticked) .ast-mobile-menu-trigger-minimal svg {
  color: #ffffff !important;
  fill:  #ffffff !important;
}

/* --- STATE 2: After scroll (sticky) ---
   More opaque glass so dark text has sufficient contrast */
.home.ast-header-sticked .ast-primary-header-bar {
  background: rgba(255, 255, 255, 0.72) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-color: rgba(255, 255, 255, 0.55) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.10) !important;
  border-radius: 0 !important;
}

/* Dark text over the lighter glass after scroll */
.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;
  text-shadow: none !important;
}

/* Mobile hamburger — after scroll */
.home.ast-header-sticked .ast-mobile-menu-trigger-minimal,
.home.ast-header-sticked .ast-mobile-menu-trigger-minimal svg {
  color: #111111 !important;
  fill:  #111111 !important;
}

/* Submenus — always solid so they're readable */
.home .main-header-menu .sub-menu {
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.home .main-header-menu .sub-menu a {
  color: #111111 !important;
}