/* ================================================
   SeoAds – Mega Menu CSS
   Fajl: /wp-content/themes/blocksy-child/assets/css/mega-menu.css
   ================================================ */

/* ------------------------------------------------
   1. NAVIGACIOS LINKEK (felso szint)
   ------------------------------------------------ */

#mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-menu-item {
  position: relative;
  overflow: visible !important;
}

#mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-menu-item > a.mega-menu-link {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 10px !important;
  display: flex !important;
  align-items: center !important;
  isolation: isolate !important;
  text-indent: 0px !important;
  transition: text-indent 0.22s cubic-bezier(0.4,0,0.2,1) !important;
}

/* Shimmer ::before */
#mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-menu-item > a.mega-menu-link::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: rgba(255,255,255,0.12) !important;
  transform: translateX(-110%) !important;
  transition: transform 0.3s cubic-bezier(0.4,0,0.2,1) !important;
  z-index: 0 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
}

#mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-menu-item:hover > a.mega-menu-link {
  text-indent: 6px !important;
}

#mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-menu-item:hover > a.mega-menu-link::before {
  transform: translateX(0) !important;
}

/* Aktiv link hatter */
#mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-current-menu-item > a.mega-menu-link,
#mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-current-menu-ancestor > a.mega-menu-link {
  background: rgba(255,255,255,0.08) !important;
}

/* Gradient alahuzo – mega menun kivul */
#mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-current-menu-item:not(.mega-menu-megamenu)::after,
#mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-current-menu-ancestor:not(.mega-menu-megamenu)::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: -2px;
  height: 3px;
  border-radius: 3px;
  background: linear-gradient(90deg, #ff2fb3, #ff6a00);
  z-index: 10;
  pointer-events: none;
  transform-origin: left center;
  animation: underline-in 0.35s cubic-bezier(0.4,0,0.2,1) forwards;
}

@keyframes underline-in {
  from { transform: scaleX(0); opacity: 0; }
  to   { transform: scaleX(1); opacity: 1; }
}

/* ------------------------------------------------
   2. MEGA MENU PANEL
   ------------------------------------------------ */

#mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-menu-megamenu > ul.mega-sub-menu {
  background: #fff !important;
  border: none !important;
  border-radius: 0 0 20px 20px !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.15) !important;
  padding: 0 !important;
  overflow: hidden !important;
  position: fixed !important;
  top: 100px !important;
  left: 0 !important;
  right: 0 !important;
  width: 100vw !important;
  transform: none !important;
  margin-left: 0 !important;
  pointer-events: none !important;
}

#mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-menu-megamenu.mega-toggle-on > ul.mega-sub-menu {
  pointer-events: auto !important;
}



/* Row – flex */
#mega-menu-wrap-menu_1 #mega-menu-menu_1 li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  width: 100% !important;
  padding: 0 !important;
  gap: 0 !important;
}

/* Oszlopok */
#mega-menu-wrap-menu_1 #mega-menu-menu_1 li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.mega-menu-column {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  padding: 32px 28px !important;
  background: #fff !important;
  border-right: 1px solid #eeecf4 !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
}

/* 3. oszlop – sotet */
#mega-menu-wrap-menu_1 #mega-menu-menu_1 li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.mega-menu-column:last-child {
  flex: 0 0 300px !important;
  width: 300px !important;
  border-right: none !important;
  background: #1a0a2e !important;
  padding: 36px 28px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

/* Oszlopon beluli ul – plugin override */
#mega-menu-wrap-menu_1 #mega-menu-menu_1 li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.mega-menu-column > ul.mega-sub-menu {
  display: block !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  position: static !important;
}

/* ------------------------------------------------
   3. KATEGORIA CIM
   ------------------------------------------------ */

#mega-menu-wrap-menu_1 #mega-menu-menu_1 li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-item-has-children > a.mega-menu-link {
  color: #1a0a2e !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  margin-bottom: 22px !important;
  padding: 0 0 12px !important;
  border-bottom: 2px solid #eeecf4 !important;
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
  border-radius: 0 !important;
  display: block !important;
  background: transparent !important;
  box-shadow: none !important;
  pointer-events: none !important;
  text-indent: 0 !important;
}

/* Sotet oszlopban a cim legyen feher */
#mega-menu-wrap-menu_1 #mega-menu-menu_1 li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.mega-menu-column:last-child li.mega-menu-item-has-children > a.mega-menu-link {
  color: rgba(255,255,255,0.4) !important;
  border-bottom-color: rgba(255,255,255,0.1) !important;
}

#mega-menu-wrap-menu_1 #mega-menu-menu_1 li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-item-has-children > a.mega-menu-link::before {
  display: none !important;
}

/* ------------------------------------------------
   4. CARD – menupontok
   ------------------------------------------------ */

#mega-menu-wrap-menu_1 #mega-menu-menu_1 li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-item-object-page > a.mega-menu-link {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 16px 18px !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.07) !important;
  margin-bottom: 20px !important;
  border: 1px solid #f0eef5 !important;
  color: #1a0a2e !important;
  font-weight: 600 !important;
  font-size: 18px !important;
  text-indent: 0 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  min-height: 90px !important;
  flex: 1 !important;
  transition: box-shadow 0.18s ease, transform 0.18s ease !important;
}

#mega-menu-wrap-menu_1 #mega-menu-menu_1 li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-item-object-page > a.mega-menu-link:hover {
  box-shadow: 0 6px 20px rgba(0,0,0,0.12) !important;
  transform: translateY(-2px) !important;
  border-color: #e0dbf0 !important;
  color: #1a0a2e !important;
}

/* Kep – ::before */
#mega-menu-wrap-menu_1 #mega-menu-menu_1 li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-item-object-page > a.mega-menu-link::before {
  content: "" !important;
  display: block !important;
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  border-radius: 8px !important;
  background-color: #f0eef5 !important;
  background-size: cover !important;
  background-position: center !important;
  flex-shrink: 0 !important;
  position: relative !important;
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

/* Kepek */
a.mega-menu-link[href*="google-ads-hirdeteskezeles"]::before {
  background-image: url('https://seoads.hu/wp-content/uploads/2025/11/google-ads3-scaled.jpg') !important;
}
a.mega-menu-link[href*="facebook-hirdeteskezeles"]::before {
  background-image: url('https://seoads.hu/wp-content/uploads/2025/11/om20a.webp') !important;
}
a.mega-menu-link[href*="ppc-seo-audit"]::before {
  background-image: url('https://seoads.hu/wp-content/uploads/2025/11/om26a.webp') !important;
}
a.mega-menu-link[href*="seo-keresooptimalizalas"]::before {
  background-image: url('https://seoads.hu/wp-content/uploads/2025/11/om5-wp.webp') !important;
}
a.mega-menu-link[href*="online-marketing-kivitelezes"]::before {
  background-image: url('https://seoads.hu/wp-content/uploads/2025/11/om1.webp') !important;
}
a.mega-menu-link[href*="weboldalkeszites-webfejlesztes"]::before {
  background-image: url('https://seoads.hu/wp-content/uploads/2025/11/om13-wp.webp') !important;
}

/* ------------------------------------------------
   5. CTA OSZLOP
   ------------------------------------------------ */

.mega-cta-box {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.mega-cta-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #ff2fb3;
  background: rgba(255,47,179,0.12);
  padding: 4px 12px;
  border-radius: 50px;
  width: fit-content;
}

.mega-cta-box h3 {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  line-height: 1.3;
  margin: 0;
}

h4.mega-block-title{
	color: #fff !important;
}

.mega-cta-box p {
  font-size: 13px;
  color: rgba(255,255,255,0.65);
  line-height: 1.6;
  margin: 0;
}

.mega-cta-btn {
  display: inline-block;
  margin-top: 6px;
  background: linear-gradient(90deg, #ff2fb3, #ff6a00);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  padding: 12px 22px;
  border-radius: 50px;
  text-decoration: none;
  width: fit-content;
  transition: opacity 0.2s ease;
}

.mega-cta-btn:hover {
  opacity: 0.85;
  color: #fff;
}