/* === Infobrand – luksusowe mega menu „Nasze marki" === */
/* Autor: Infobrand sp. z o.o. */

/* 1. GÓRNE MENU – białe czcionki + złoty hover */
.jet-mega-menu .jet-mega-menu-item__link--top-level .jet-mega-menu-item__label,
.jet-mega-menu .jet-mega-menu-item__link--top-level .jet-mega-menu-item__dropdown i {
  color: #ffffff !important;
  transition: color .2s ease !important;
}
.jet-mega-menu .jet-mega-menu-item__link--top-level:hover .jet-mega-menu-item__label,
.jet-mega-menu .jet-mega-menu-item--mega:hover .jet-mega-menu-item__label,
.jet-mega-menu .jet-mega-menu-item__link--top-level:hover .jet-mega-menu-item__dropdown i,
.jet-mega-menu .jet-mega-menu-item--mega:hover .jet-mega-menu-item__dropdown i {
  color: #B59759 !important;
}

/* 2. POKAZANIE panelu na hover (niezależne od JS) */
.jet-mega-menu .jet-mega-menu-item--mega:hover > .jet-mega-menu-mega-container,
.jet-mega-menu .jet-mega-menu-item-has-children:hover > .jet-mega-menu-mega-container {
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  overflow: visible !important;
  pointer-events: auto !important;
}
.jet-mega-menu .jet-mega-menu-item--mega:hover .jet-mega-menu-mega-container__inner,
.jet-mega-menu .jet-mega-menu-item--mega:hover .jet-mega-menu-mega-container * {
  visibility: visible !important;
}

/* 3. PEŁNA SZEROKOŚĆ (100vw) – offset --mm-left ustawiany przez JS */
.jet-mega-menu-mega-container {
  position: absolute !important;
  left: 0 !important;
  top: 100% !important;
  width: 0 !important;
  min-width: 0 !important;
  overflow: visible !important;
}
.jet-mega-menu-mega-container__inner {
  position: absolute !important;
  left: var(--mm-left, 0px) !important;
  top: 0 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  transform: none !important;
  margin-top: 0 !important;
  background-color: #121426 !important;
  border-top: 2px solid #B59759 !important;
  box-shadow: 0 22px 50px rgba(0,0,0,0.5) !important;
  padding: 42px 0 48px !important;
}
.jet-mega-menu-mega-container__inner > .elementor {
  max-width: 1140px !important;
  margin: 0 auto !important;
  padding: 0 30px !important;
}
.jet-mega-menu-mega-container__inner .elementor-column,
.jet-mega-menu-mega-container__inner .elementor-widget-wrap,
.jet-mega-menu-mega-container__inner .elementor-container {
  width: 100% !important;
  max-width: 100% !important;
}

/* 4. NAGŁÓWEK „Nasze marki" */
.jet-mega-menu-mega-container__inner .elementor-heading-title {
  color: #B59759 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  letter-spacing: 3px !important;
  font-size: 18px !important;
  margin-bottom: 30px !important;
  position: relative !important;
  padding-bottom: 16px !important;
}
.jet-mega-menu-mega-container__inner .elementor-heading-title::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  bottom: 0 !important;
  transform: translateX(-50%) !important;
  width: 46px !important;
  height: 1px !important;
  background: #B59759 !important;
}

/* 5. MARKI – siatka, białe czcionki */
.jet-mega-menu-mega-container__inner .elementor-nav-menu {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important;
  gap: 0 24px !important;
}
.jet-mega-menu-mega-container__inner .elementor-nav-menu a.elementor-item {
  color: #ffffff !important;
  font-weight: 400 !important;
  letter-spacing: .5px !important;
  padding: 12px 14px !important;
  border-radius: 3px !important;
  position: relative !important;
  white-space: nowrap !important;
  transition: color .2s ease, background-color .2s ease !important;
}

/* 6. HOVER marki – złoty tekst + złota linia */
.jet-mega-menu-mega-container__inner .elementor-nav-menu a.elementor-item:hover {
  color: #B59759 !important;
  background-color: rgba(255,255,255,0.05) !important;
}
.jet-mega-menu-mega-container__inner .elementor-nav-menu a.elementor-item::after {
  content: "" !important;
  position: absolute !important;
  left: 14px !important;
  right: 14px !important;
  bottom: 7px !important;
  height: 1px !important;
  background: #B59759 !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform .25s ease !important;
}
.jet-mega-menu-mega-container__inner .elementor-nav-menu a.elementor-item:hover::after {
  transform: scaleX(1) !important;
}

/* === 7. WYŚRODKOWANIE MENU NA WSZYSTKICH PODSTRONACH === */
/* Wymusza wyśrodkowanie całego paska menu wszędzie (homepage + podstrony) */

/* Kontener widgetu JetMegaMenu w Elementorze */
.elementor-widget-jet-mega-menu > .elementor-widget-container {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
}

/* Główny wrapper menu */
.jet-mega-menu {
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Lista pozycji menu – wyśrodkowanie poziome */
.jet-mega-menu .jet-mega-menu-list,
.jet-mega-menu > ul {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  margin: 0 auto !important;
  padding-left: 0 !important;
  float: none !important;
  width: auto !important;
}

/* Reset ewentualnego przesunięcia/ucięcia pierwszej pozycji w lewo */
.jet-mega-menu .jet-mega-menu-item:first-child {
  margin-left: 0 !important;
}
.jet-mega-menu .jet-mega-menu-item {
  float: none !important;
}
