/* BUN Click Menu Override */

.bun-menu-wrap{
  position: relative;
  z-index: 9999;
  background: var(--bun-bg) !important;
  color: var(--bun-text) !important;
  border: 1px solid var(--bun-border) !important;
  border-radius: 14px;
  box-shadow: 0 12px 34px rgba(0,0,0,.06);
  /* IMPORTANT: allow dropdowns to extend outside the bar (desktop). */
  overflow: visible;
}

/* Keep background FX clipped to rounded corners even when overflow is visible */
.bun-menu-wrap::before,
.bun-menu-wrap::after{
  border-radius: 14px;
  /* Clip blur/glow inside the rounded container */
  clip-path: inset(0 round 14px);
}

/* Force-hide theme search area (Cream Magazine) when enabled */
body.bun-hide-theme-search-enabled .header-search-container{ display:none !important; }

/* Kill Cream Magazine's stellarnav black mobile bar (MENU toggle) when our menu is active */
body.bun-menu-active .primary-navigation > a.menu-toggle,
body.bun-menu-active .primary-navigation > a.close-menu,
body.bun-menu-active .primary-navigation .dd-toggle,
body.bun-menu-active .primary-navigation .menu-toggle{
  display:none !important;
}
body.bun-menu-active .primary-navigation{ background: transparent !important; }
body.bun-menu-active .primary-navigation.dark,
body.bun-menu-active .primary-navigation.light{ background: transparent !important; }

/* Keep our menu visible even if theme targets .main-navigation ul */
body.bun-menu-active .bun-menu-wrap ul{ list-style:none; margin:0; padding:0; }

.bun-menu-wrap.is-sticky{
  position: sticky;
  top: 0;
}

.bun-menu-inner{
  display:flex;
  align-items:center;
  gap:12px;
  padding: 10px 14px;
}

/* Mobile burger */
.bun-burger{
  display:none;
  height:40px;
  padding: 0 12px;
  border:1px solid var(--bun-border);
  background:#fff;
  border-radius:12px;
  cursor:pointer;
  align-items:center;
  justify-content:center;
  position:relative;
  gap:10px;
}
.bun-burger .bun-bar{
  width:18px;
  height:2px;
  background: var(--bun-text);
  border-radius:2px;
  transition: transform .2s ease, opacity .2s ease;
}
.bun-burger .bun-bar:nth-child(2){ opacity:.9; }
.bun-burger .bun-bar:nth-child(3){ opacity:.8; }
.bun-burger-label{
  font-weight: 800;
  letter-spacing: .08em;
  font-size: 12px;
  text-transform: uppercase;
  color: var(--bun-text);
  white-space: nowrap;
}
.bun-menu-wrap.is-open .bun-burger .bun-bar:nth-child(1){ transform: translateY(6px) rotate(45deg); }
.bun-menu-wrap.is-open .bun-burger .bun-bar:nth-child(2){ opacity:0; }
.bun-menu-wrap.is-open .bun-burger .bun-bar:nth-child(3){ transform: translateY(-6px) rotate(-45deg); }

/* Left action pills */
.bun-left-actions{
  display:flex;
  align-items:center;
  gap:10px;
}
.bun-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid var(--bun-border);
  background: rgba(255,255,255,.72);
  color: var(--bun-text);
  text-decoration:none;
  font-weight: 700;
  letter-spacing: .1px;
  font-size: var(--bun-left-font, 13px);
  transition: transform .15s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
  white-space:nowrap;
}
.bun-pill:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(17, 24, 39, 0.10);
  background: rgba(0,0,0,0.02);
}
.bun-pill-ico{ font-size:18px; line-height:1; width:18px; height:18px; }

/* Dashicons rendering in menu */
.bun-menu-wrap .dashicons{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height: 1;
}

.bun-pill-left1{
  border-color: var(--bun-left1-border);
  background: var(--bun-left1-bg);
  color: var(--bun-left1-text);
}
.bun-pill-left1:hover{ background: rgba(37,99,235,0.10); box-shadow: 0 10px 24px rgba(37,99,235,.12); }

.bun-pill-left2{
  border-color: var(--bun-left2-border);
  background: var(--bun-left2-bg);
  color: var(--bun-left2-text);
}
.bun-pill-left2:hover{ box-shadow: 0 10px 24px rgba(0,0,0,.08); }

/* Mobile-only quick actions (inside panel) */
.bun-mobile-actions{ display:none; }

/* Menu area */
.bun-menu-area{ flex: 1 1 auto; }

.bun-menu{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  gap: 8px;
}

.bun-menu > li{ position:relative; }

.bun-link{
  display:flex;
  align-items:center;
  gap:8px;
  padding: 10px 12px;
  border-radius: 12px;
  text-decoration:none;
  color: var(--bun-text) !important;
  font-weight: 700;
  transition: background .2s ease, transform .15s ease;
}
.bun-link:hover{
  background: rgba(0,0,0,0.04);
  transform: translateY(-1px);
}

.bun-ico{ font-size: 18px; line-height: 1; }

.bun-title{ line-height: 1; }

.bun-link .bun-caret{
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  opacity: .65;
  margin-left: 2px;
}

/* Dropdown */
.bun-menu li ul{
  list-style:none;
  margin: 0;
  padding: 8px;
  position:absolute;
  left: 0;
  top: calc(100% + 10px);
  min-width: 240px;
  background: #fff;
  border: 1px solid var(--bun-border);
  border-radius: 14px;
  box-shadow: 0 18px 40px rgba(17,24,39,.14);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
}

/* Ensure dropdowns are not hidden behind other header elements */
.bun-menu li ul,
.bun-member-dd{ z-index: 10000; }

.bun-menu li.is-open > ul{
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.bun-menu li ul li{ position:relative; }
.bun-menu li ul a{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 10px 10px;
  border-radius: 12px;
  color: var(--bun-text);
  text-decoration:none;
  font-weight: 650;
}
.bun-menu li ul a:hover{
  background: rgba(37,99,235,0.10);
}

/* Third level */
.bun-menu li ul li ul{
  left: calc(100% + 10px);
  top: 0;
}

/* Right membership */
.bun-right-actions{
  margin-left:auto;
  position:relative;
  display:flex;
  align-items:center;
}

.bun-member-btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 11px 14px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,0.08);
  background: var(--bun-member);
  color: #fff;
  cursor:pointer;
  font-weight: 800;
  transition: transform .15s ease, background .2s ease, box-shadow .2s ease;
}

.bun-member-btn:hover{
  transform: translateY(-1px);
  background: var(--bun-member-hover);
  box-shadow: 0 18px 44px var(--bun-member-glow);
}

.bun-member-dd{
  position:absolute;
  right: 0;
  top: calc(100% + 10px);
  min-width: 260px;
  max-width: min(340px, calc(100vw - 24px));
  box-sizing: border-box;
  background: #fff;
  border: 1px solid var(--bun-border);
  border-radius: 14px;
  box-shadow: 0 18px 40px rgba(17,24,39,.14);
  padding: 8px;
}

/* Mobile/desktop membership containers */
.bun-member-mobile{ display:none; }

.bun-member-dd a{
  display:block;
  padding: 11px 12px;
  border-radius: 12px;
  text-decoration:none;
  color: var(--bun-text);
  font-weight: 750;
}
.bun-member-dd a:hover{
  background: rgba(225, 29, 72, 0.10);
}

.bun-menu-warning{
  padding: 10px 12px;
  border: 1px dashed var(--bun-border);
  border-radius: 12px;
  background: rgba(0,0,0,0.02);
  font-weight: 700;
}

/* Mobile styles */
@media (max-width: 991px){
  .bun-burger{ display:flex; }
  .bun-left-actions{ display:none; }

  /* Mobile panel: keep everything inside */
  .bun-member-desktop{ display:none !important; }
  .bun-member-mobile{ display:block; margin-top: 10px; }

  .bun-menu-inner{ gap:10px; }

  .bun-menu-area{
    position: fixed;
    left: 0;
    right: 0;
    top: 64px;
    background: var(--bun-bg);
    border-top: 1px solid var(--bun-border);
    border-bottom: 1px solid var(--bun-border);
    padding: 10px 12px 14px;
    box-shadow: 0 18px 40px rgba(17,24,39,.14);
    transform: translateY(-10px);
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
    max-height: calc(100vh - 80px);
    overflow:auto;
    box-sizing: border-box;
  }

  .bun-pill{ font-size: var(--bun-left-font-m, 14px); }

  .bun-mobile-actions{
    display:flex;
    flex-direction: column;
    gap: 10px;
    padding: 4px 0 10px;
  }
  .bun-mobile-actions .bun-pill{ width:100%; justify-content:center; padding: 12px 14px; }

  .bun-menu-wrap.is-open .bun-menu-area{
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }

  .bun-menu{
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
  }

  .bun-menu > li{ width: 100%; }

  .bun-link{
    width: 100%;
    justify-content: space-between;
    background: rgba(0,0,0,0.02);
  }

  .bun-menu li ul{
    position: static;
    top: auto;
    left: auto;
    min-width: 100%;
    box-shadow: none;
    border: 1px solid var(--bun-border);
    opacity: 1;
    visibility: visible;
    transform: none;
    display: none;
  }

  .bun-menu li.is-open > ul{ display:block; }

  .bun-menu li ul li ul{
    border-radius: 12px;
  }

  .bun-right-actions{ margin-left: 0; }

  .bun-member-btn{ width: 100%; justify-content:center; }

  .bun-member-dd{
    position: static;
    width: 100%;
    max-width: 100%;
    margin-top: 10px;
  }
}

/* --- Background FX presets (light, BUN vibes) --- */
.bun-bgfx-aurora::before,
.bun-bgfx-aurora::after,
.bun-bgfx-shine::before,
.bun-bgfx-pulse::before,
.bun-bgfx-sparkle::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.55;
}
.bun-bgfx-aurora::before{
  background:
    radial-gradient(60% 50% at 20% 30%, rgba(37,99,235,.20), transparent 60%),
    radial-gradient(55% 45% at 80% 20%, rgba(225,29,72,.14), transparent 60%),
    radial-gradient(45% 45% at 60% 80%, rgba(16,185,129,.10), transparent 60%);
  filter: blur(18px);
  animation: bunAurora 9s ease-in-out infinite alternate;
}
.bun-bgfx-aurora::after{
  background:
    radial-gradient(55% 45% at 10% 80%, rgba(245,158,11,.10), transparent 60%),
    radial-gradient(40% 40% at 90% 70%, rgba(99,102,241,.12), transparent 60%);
  filter: blur(22px);
  animation: bunAurora2 11s ease-in-out infinite alternate;
  opacity:.45;
}
@keyframes bunAurora{
  0%{ transform: translate3d(-10px,-6px,0) scale(1); }
  100%{ transform: translate3d(14px,10px,0) scale(1.05); }
}
@keyframes bunAurora2{
  0%{ transform: translate3d(12px,-8px,0) scale(1); }
  100%{ transform: translate3d(-12px,10px,0) scale(1.08); }
}

.bun-bgfx-shine::before{
  background: linear-gradient(115deg, transparent 0%, rgba(255,255,255,.55) 30%, rgba(37,99,235,.12) 45%, transparent 60%);
  transform: translateX(-60%);
  animation: bunShine 4.8s ease-in-out infinite;
  opacity:.35;
}
@keyframes bunShine{
  0%{ transform: translateX(-70%); }
  60%{ transform: translateX(30%); }
  100%{ transform: translateX(70%); }
}

.bun-bgfx-pulse::before{
  background: radial-gradient(60% 60% at 50% 50%, rgba(37,99,235,.16), transparent 65%);
  filter: blur(14px);
  animation: bunPulse 3.6s ease-in-out infinite;
  opacity:.45;
}
@keyframes bunPulse{
  0%,100%{ transform: scale(1); opacity:.40; }
  50%{ transform: scale(1.04); opacity:.60; }
}

.bun-bgfx-sparkle::before{
  background:
    radial-gradient(circle at 10% 20%, rgba(255,255,255,.75) 0 2px, transparent 3px),
    radial-gradient(circle at 70% 25%, rgba(37,99,235,.35) 0 2px, transparent 3px),
    radial-gradient(circle at 90% 70%, rgba(225,29,72,.28) 0 2px, transparent 3px),
    radial-gradient(circle at 30% 80%, rgba(16,185,129,.22) 0 2px, transparent 3px);
  background-size: 240px 140px;
  animation: bunSparkle 6.5s linear infinite;
  opacity:.28;
}
@keyframes bunSparkle{
  0%{ transform: translate3d(0,0,0); }
  100%{ transform: translate3d(60px,-40px,0); }
}