/**
 * Isolate header “Donate Now” mega-menu from UIkit + page CSS.
 * Load AFTER uikit.min.css (see uk-lightbox-styles / event-detail-head-styles).
 * Keep in sync with navBar.css responsive donate-menu architecture.
 */

.nav-section .seedout-donate-menu {
  isolation: isolate;
  position: relative;
  z-index: 10060;
}

.nav-section .seedout-donate-menu > .donate-btn {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
  padding: 6.5px 12px !important;
  min-height: 44px !important;
  height: auto !important;
  font-family: "Outfit", sans-serif;
  font-size: 16px !important;
  line-height: normal !important;
  text-transform: uppercase;
  border-radius: 9999px !important;
  box-sizing: border-box;
  cursor: pointer;
}

.nav-section .seedout-donate-menu #menu.menu-div {
  margin: 0 !important;
}

@media (min-width: 768px) {
  .nav-section .seedout-donate-menu #menu.menu-div {
    top: 100% !important;
  }
}

.nav-section .seedout-donate-menu #menu,
.nav-section .seedout-donate-menu #menu .donate-main-div {
  font-family: "Outfit", sans-serif;
  box-sizing: border-box;
}

.nav-section .seedout-donate-menu #menu .donate-main-div {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
}

.nav-section .seedout-donate-menu #menu .tab-content,
.nav-section .seedout-donate-menu #menu .donate-tab-content-wrap {
  display: block !important;
  float: none !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  align-self: flex-start !important;
  flex: 0 0 auto !important;
}

.nav-section .seedout-donate-menu #menu ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.nav-section .seedout-donate-menu #menu .donate-nav,
.nav-section .seedout-donate-menu #menu .donate-tab-content {
  background-color: #fff !important;
  padding: 12px 16px !important;
  width: min(320px, calc(50vw - 28px)) !important;
  max-width: 100% !important;
  margin: 0 !important;
  border-radius: 12px !important;
  box-shadow:
    0 8px 28px rgba(15, 23, 42, 0.1),
    0 2px 8px rgba(15, 23, 42, 0.06) !important;
  border: 1px solid rgba(15, 23, 42, 0.06) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  align-self: flex-start !important;
  transform: none !important;
  max-height: min(70vh, 560px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

.nav-section .seedout-donate-menu #menu .donate-nav.nav,
.nav-section .seedout-donate-menu #menu .nav.flex-column {
  display: block !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
}

.nav-section .seedout-donate-menu #menu .menu-btns-div .nav-link,
.nav-section .seedout-donate-menu #menu .menu-btns-div button.nav-link,
.nav-section .seedout-donate-menu #menu .menu-btns-div a.nav-link {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: 100% !important;
  text-align: left !important;
  border: none !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: inherit !important;
  padding: 8px 10px !important;
  margin: 0 0 4px 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
  font-weight: 400 !important;
  line-height: normal !important;
  cursor: pointer;
  min-height: 48px !important;
  height: auto !important;
}

.nav-section .seedout-donate-menu #menu .menu-btns-div .nav-link h4,
.nav-section .seedout-donate-menu #menu h4 {
  font-family: "Outfit", sans-serif !important;
  font-weight: 500 !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  color: #111 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-transform: none !important;
}

.nav-section .seedout-donate-menu #menu .menu-btns-div .nav-link p,
.nav-section .seedout-donate-menu #menu p {
  font-family: "Outfit", sans-serif !important;
  font-weight: 400 !important;
  font-size: 12px !important;
  line-height: 1.3 !important;
  color: #5c5c5c !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
}

.nav-section .seedout-donate-menu #menu h2,
.nav-section .seedout-donate-menu #menu .menu-heading {
  font-family: "Outfit", sans-serif !important;
  margin: 16px 0 8px 0 !important;
  color: var(--seedout-chocolate) !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  letter-spacing: 0.02em !important;
  text-transform: uppercase !important;
  padding: 0 !important;
}

.nav-section .seedout-donate-menu #menu .nav-pills .nav-link.active,
.nav-section .seedout-donate-menu #menu .nav-pills .show > .nav-link,
.nav-section .seedout-donate-menu #menu .menu-btns-div .nav-link.active {
  background-color: var(--seedout-chocolate) !important;
  color: var(--seedout-chocolate-contrast) !important;
  border-color: transparent !important;
}

.nav-section .seedout-donate-menu #menu .menu-btns-div .nav-link.active h4,
.nav-section .seedout-donate-menu #menu .menu-btns-div .nav-link.active p {
  color: #fff !important;
}

.nav-section .seedout-donate-menu #menu .menu-btns-div .nav-link.active img {
  filter: brightness(0) invert(1) !important;
}

.nav-section .seedout-donate-menu #menu .sub-menu-tab-div > ul > li {
  margin: 0 !important;
  padding: 0 !important;
}

.nav-section .seedout-donate-menu #menu .sub-menu-tab-div > ul > li > a {
  display: flex !important;
  align-items: center !important;
  text-decoration: none !important;
  font-weight: 400 !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  color: #111 !important;
  padding: 10px 4px !important;
  margin: 0 !important;
  min-height: 44px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 6px !important;
}

.nav-section .seedout-donate-menu #menu .tab-content .tab-pane.fade {
  transition: none !important;
}

.nav-section .seedout-donate-menu #menu .tab-content .tab-pane.fade:not(.show) {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

.nav-section .seedout-donate-menu #menu .tab-content .tab-pane.fade.show {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.nav-section .menu-li .main-menu .main-menu-ul > li > a.main-menu-nav-row .main-menu-nav-icon,
.nav-section .menu-li .main-menu .accordion-button > .main-menu-nav-icon {
  flex: 0 0 20px !important;
  width: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
}

/* Tablet + mobile — stacked sheet / drill-down (must override desktop flex row) */
@media (max-width: 1023.98px) {
  .nav-section .seedout-donate-menu #menu.menu-div {
    max-width: min(420px, calc(100vw - 24px)) !important;
  }

  .nav-section .seedout-donate-menu #menu .donate-main-div {
    flex-direction: column !important;
    position: relative !important;
    overflow: hidden !important;
  }

  .nav-section .seedout-donate-menu #menu .donate-nav,
  .nav-section .seedout-donate-menu #menu .donate-tab-content,
  .nav-section .seedout-donate-menu #menu .tab-content,
  .nav-section .seedout-donate-menu #menu .donate-tab-content-wrap {
    width: 100% !important;
    max-width: 100% !important;
  }

  .nav-section .seedout-donate-menu #menu .donate-nav,
  .nav-section .seedout-donate-menu #menu .donate-tab-content {
    box-shadow: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    max-height: none !important;
    padding: 8px 12px 16px !important;
  }

  .nav-section .seedout-donate-menu #menu .donate-tab-content-wrap {
    position: absolute !important;
    inset: 0 !important;
    z-index: 3 !important;
    background: #fff !important;
    display: flex !important;
    flex-direction: column !important;
  }
}

@media (max-width: 767.98px) {
  .nav-section .seedout-donate-menu > .donate-btn {
    font-size: 11px !important;
    padding: 8px 14px !important;
    min-height: 40px !important;
  }

  .nav-section .seedout-donate-menu #menu.menu-div {
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    z-index: 10070 !important;
  }
}