/**
 * Navigation & Menu Styles (UPDATED – clean + ordered mega grids)
 * - Keeps your Astra + Max Mega Menu styles
 * - FIXES CME Conferences submenu ordering issues (removes display:contents flattening)
 * - Keeps CME Conferences as 2 rows x 5 via CSS grid (when the submenu is a single UL list)
 *
 * @package SBHPP_2026_REBUILD
 */

/* ========================================
   HEADER DASH BUTTON
   ======================================== */

.header-btn { position: static; right: auto; }

.header-btn .dash-ast-custom-button{
  border-style: solid;
  border-width: 0;
  padding: 10px 15px;
  font-family: 'Niveau-Grotesk', niveau-grotesk, sans-serif;
  font-weight: 900;
  font-size: 14px;
  line-height: 1.5em;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-radius: 3px;
  background-color: #fff;
  color: #52287E;
}

.dash-ast-custom-button:after{
  font-family: FontAwesome;
  font-weight: 400;
  vertical-align: middle;
  padding-left: 10px;
  content: "\f054";
}

.header-btn .dash-ast-custom-button:hover{ color: #52287E !important; }

/* ========================================
   PRIMARY NAVIGATION (TOP LEVEL)
   ======================================== */

#mega-menu-wrap-primary{
  width: 100%;
  background: none;
}

/* Remove Max Mega Menu indicator arrow */
#mega-menu-wrap-primary #mega-menu-primary
li.mega-menu-item-has-children > a.mega-menu-link > span.mega-indicator:after{
  content: unset;
  font-family: unset;
}

/* Top-level links */
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link{
  font-size: 0.75rem !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: normal !important;
  text-transform: uppercase !important;
  color: #fff !important;
  letter-spacing: 0.5px;
  height: unset !important;
  background: none !important;
  padding: 0 !important;
}

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:first-of-type{
  padding-left: 0;
}

/* keep hover subtle */
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:hover,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:focus,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:active{
  background: none !important;
  color: rgba(255, 255, 255, .85) !important;
}

/* Sticky header top-level link colors */
.ast-header-sticked #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link,
.ast-sticky-active #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link,
.site-header.sticky #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link{
  color: #000 !important;
}

.site-above-header-wrap{ padding: 1rem 0; }

/* Layout of the main nav list */
#mega-menu-wrap-primary #mega-menu-primary{
  display: flex;
  gap: 60px;
}

@media (max-width: 1430px){
  #mega-menu-wrap-primary #mega-menu-primary{ gap: 30px; }
}

/* ========================================
   ASTRA BASE NAV (NON-MEGA) — KEEP SAFE
   ======================================== */

.main-header-bar-navigation,
.ast-main-header-bar-alignment{
  display: flex;
  align-items: center;
}

.main-navigation,
.ast-desktop-navigation{
  display: flex;
  align-items: center;
}

/* ========================================
   MAX MEGA MENU — GLOBAL DROPDOWN PANEL
   (ALL TOP-LEVEL SUBMENUS get white card + teal border)
   ======================================== */

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > ul.mega-sub-menu{
  background: #fff !important;
  border-radius: 12px !important;
  padding: 8px !important;

  /* OUTER white card */
  box-shadow: 0 8px 24px rgba(0,0,0,.12) !important;

  /* teal border */
  border: 3px solid #52C4C7 !important;

  margin: 20px 0 0 !important;
}

/* DO NOT make rows flex globally */
#mega-menu-wrap-primary #mega-menu-primary li.mega-menu-row{
  display: block !important;
  flex-wrap: nowrap !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Clean row wrapper UL */
#mega-menu-wrap-primary #mega-menu-primary li.mega-menu-row > ul.mega-sub-menu{
  margin: 0 !important;
  padding: 0 !important;
}

/* Default column padding for standard mega menus */
#mega-menu-wrap-primary #mega-menu-primary li.mega-menu-column{
  padding: 0 12px !important;
}

/* Menu item reset */
#mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item{
  margin: 0 !important;
}

/* Default dropdown link styling */
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > ul.mega-sub-menu a.mega-menu-link{
  color: #111 !important;
  font-size: 14px !important;
  font-style: normal !important;
  font-weight: 600 !important;
  font-family: inherit !important;
  line-height: 1.35 !important;
  text-transform: none !important;
  letter-spacing: normal !important;

  white-space: normal !important;
  padding: 10px 12px !important;
  background: transparent !important;
  border: 0 !important;

  transition: color .2s ease, transform .2s ease;
}

/* If submenu items use <strong>Title</strong><span>Description</span> */
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > ul.mega-sub-menu strong{
  display: block;
  color: #52287E;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.15;
  margin: 0 0 8px;
}

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > ul.mega-sub-menu span{
  display: block;
  color: #111;
  font-size: 16px !important;
  font-weight: 500;
  line-height: 1.45;
}

/* Mega menu headings */
#mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item h4.mega-block-title{
  color: #52287E;
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  margin: 0 0 15px;
  padding: 0 0 10px;
  border-bottom: 2px solid #52C4C7;
}

/* Sticky header dropdown link colors */
.ast-header-sticked #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > ul.mega-sub-menu a.mega-menu-link,
.ast-sticky-active #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > ul.mega-sub-menu a.mega-menu-link{
  color: #111 !important;
}

/* ========================================
   CME CONFERENCES — SPECIAL GRID DROPDOWN
   Requires top-level menu item class: menu-cme-conferences
   GOAL: 2 rows x 5 columns (admin order preserved)
   ======================================== */

/* Outer dropdown padding (panel already has border/shadow) */
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-conferences > ul.mega-sub-menu{
  padding: 8px !important;
  border-radius: 12px !important;
}



/*
  ✅ IMPORTANT FIX:
  Do NOT flatten columns via display:contents.
  Flattening makes the grid follow the plugin’s column-distribution order, not admin order.
*/

/* Preferred layout: make the UL inside the row the grid (single list) */
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-conferences
  > ul.mega-sub-menu
  > li.mega-menu-row
  > ul.mega-sub-menu{
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 24px 0 !important;
  grid-auto-flow: row !important; /* left-to-right, then wrap */
  align-items: start !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Make sure columns don’t float weird if MMM outputs them */
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-conferences li.mega-menu-column{
  float: none !important;
  clear: none !important;
  width: auto !important;
  padding: 0 !important;
}

/* If MMM still outputs nested ULs under columns, keep them normal (no contents) */
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-conferences li.mega-menu-column > ul.mega-sub-menu{
  margin: 0 !important;
  padding: 0 !important;
}

/* Items inside the CME grid */
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-conferences li.mega-menu-item{
  margin: 0 !important;
  padding: 0 !important;
}

/* Tighten links for grid items */
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-conferences a.mega-menu-link{
  padding: 0 !important;
  transform: none !important;
}

/* CME typography */
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-conferences b.menu-date-b{
  display: inline-block;
  font-weight: 700;
  font-size: 20px;
  color: #52c4c7;
  margin: 0 0 12px;
}

#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-conferences strong{
  font-size: 20px;
  margin: 0 0 10px;
}

#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-conferences span{
  font-size: 16px !important;
}

/* CME responsive */
@media (max-width: 1200px){
  #mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-conferences
    > ul.mega-sub-menu
    > li.mega-menu-row
    > ul.mega-sub-menu{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 18px 24px !important;
  }
}
@media (max-width: 782px){
  #mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-conferences
    > ul.mega-sub-menu
    > li.mega-menu-row
    > ul.mega-sub-menu{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* ========================================
   CME ONLINE — 1 row x 4 columns
   Requires top-level menu item class: menu-cme-online
   ======================================== */

#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-online > ul.mega-sub-menu{
  padding: 20px !important;
}

/* Flatten rows so multiple plugin rows don't create multiple panels */
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-online li.mega-menu-row{
  display: contents !important;
  padding: 0 !important;
}

/* Use the OUTER dropdown as the grid */
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-online > ul.mega-sub-menu{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 26px 60px !important;
  align-items: start !important;
}

/* Flatten nested ULs/columns so ITEMS become grid cells */
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-online li.mega-menu-row > ul.mega-sub-menu,
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-online li.mega-menu-column,
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-online li.mega-menu-column > ul.mega-sub-menu{
  display: contents !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  float: none !important;
  clear: none !important;
}

/* Each menu item becomes a grid cell */
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-online li.mega-menu-item{
  margin: 0 !important;
  padding: 0 !important;
}

/* Tighten links for this grid */
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-online a.mega-menu-link{
  padding: 0 !important;
  transform: none !important;
}

/* CME Online responsive */
@media (max-width: 1200px){
  #mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-online > ul.mega-sub-menu{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px 24px !important;
  }
}
@media (max-width: 782px){
  #mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-online > ul.mega-sub-menu{
    grid-template-columns: 1fr !important;
  }
}

/* ========================================
   SB Custom Mobile Menu Drawer
   ======================================== */

/* ========================================
   SB MOBILE MENU DRAWER — FINAL
   - Purple background on whole drawer
   - Only logo/close row sticky
   - Icon links NOT sticky
   - White carets
   - Transparent submenus
   ======================================== */

@media (min-width: 1201px){
  #sb-mobile-menu{
    display: none;
  }
}

@media (max-width: 1200px){

  #sb-mobile-menu{
    --sbmm-panel-bg:
      linear-gradient(135deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,0) 22%, rgba(255,255,255,0) 55%, rgba(255,255,255,.06) 56%, rgba(255,255,255,0) 72%),
      linear-gradient(315deg, rgba(255,255,255,.05) 0%, rgba(255,255,255,0) 24%, rgba(255,255,255,0) 70%, rgba(255,255,255,.06) 71%, rgba(255,255,255,0) 100%),
      linear-gradient(180deg, #8f17c9 0%, #6c119d 55%, #4f0c78 100%);
  }

  html.sb-mm-open,
  html.sb-mm-open body{
    overflow: hidden;
  }



  .sb-mobile-menu{
    position: fixed;
    inset: 0;
    z-index: 999999;
    pointer-events: none;
  }

  .sb-mobile-menu.is-open{
    pointer-events: auto;
  }

  .sb-mobile-menu__backdrop{
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.35);
    opacity: 0;
    transition: opacity .25s ease;
  }

  .sb-mobile-menu.is-open .sb-mobile-menu__backdrop{
    opacity: 1;
  }

  .sb-mobile-menu__panel{
    position: absolute;
    top: 0;
    right: 0;
    height: 100dvh;
    width: min(92vw, 390px);
    color: #fff;
    transform: translateX(100%);
    transition: transform .28s ease;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    box-shadow: -10px 0 30px rgba(0,0,0,.2);
    background: var(--sbmm-panel-bg) !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-position: center top !important;
  }

  .sb-mobile-menu.is-open .sb-mobile-menu__panel{
    transform: translateX(0);
  }

  .sb-mobile-menu__topbar{
    position: sticky;
    top: 0;
    z-index: 50;
    min-height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 12px 12px;
    margin-bottom: 44px;
    background: rgba(122, 18, 177, 0.08);
    border-bottom: 0;
    box-shadow: none;
    backdrop-filter: blur(25px);
    -webkit-backdrop-filter: blur(25px);
  }

  .sb-mobile-menu__header{
    padding: 0 0 10px;
    background: transparent !important;
    border-bottom: 0;
  }

  .sb-mobile-menu__brand{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    margin: 0 auto;
  }

  .sb-mobile-menu__brand img{
    display: block;
    max-width: 175px;
    width: 100%;
    height: auto;
    margin: 0 auto;
  }

  .sb-mobile-menu__close{
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border: 0;
    background: transparent !important;
    color: #fff;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    padding: 0;
    box-shadow: none !important;
  }

  .sb-mobile-menu__close:focus,
  .sb-mobile-menu__close:active,
  .sb-mobile-menu__close:focus-visible{
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  .sb-mobile-menu__quicklinks{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px;
    align-items: start;
    padding: 0 10px;
    margin-bottom: 8px;
    background: transparent !important;
  }

  .sb-mobile-menu__quicklink{
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    padding: 6px 4px 4px;
    text-decoration: none;
    color: #fff;
    text-align: center;
    background: transparent !important;
  }

  .sb-mobile-menu__quickicon{
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    font-size: 16px;
    line-height: 1;
    color: #fff;
  }

  .sb-mobile-menu__quicklabel{
    display: block;
    font-family: 'Niveau-Grotesk', niveau-grotesk, sans-serif;
    font-size: 11px;
    line-height: 1.15;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .4px;
    color: #fff;
  }

  /* optional cart count badge if markup exists */
  .sb-mobile-menu__quickcount{
    position: absolute;
    top: -6px;
    right: -10px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: #fff;
    color: #6c119d;
    font-size: 10px;
    font-weight: 900;
    line-height: 16px;
    text-align: center;
  }

  .sb-mobile-menu__nav{
    padding: 6px 0 14px;
    background: transparent !important;
  }

  .sb-mobile-menu__list,
  .sb-mobile-menu__list ul{
    list-style: none;
    margin: 0;
    padding: 0;
    background: transparent !important;
  }

  .sb-mobile-menu__list > .sb-mm-item,
  .sb-mobile-menu__sub > .sb-mm-item{
    position: relative;
    background: transparent !important;
  }

  .sb-mobile-menu__sub,
  .sb-mobile-menu__sub ul,
  .sb-mobile-menu__sub li,
  .sb-mobile-menu__sub a,
  .sb-mobile-menu__sub div,
  .sb-mobile-menu__list,
  .sb-mobile-menu__list ul,
  .sb-mobile-menu__list li,
  .sb-mobile-menu__list a,
  .sb-mobile-menu__list div{
    background: transparent !important;
    background-color: transparent !important;
  }

  .sb-mobile-menu__sub{
  padding: 0;
  margin: 0;
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition:
    max-height .38s cubic-bezier(0.22, 1, 0.36, 1),
    opacity .22s ease,
    transform .22s ease,
    visibility .22s ease;
  will-change: max-height, opacity, transform;
}

.sb-mm-item.is-sub-open > .sb-mobile-menu__sub{
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  max-height: 100% !important;
}

  .sb-mobile-menu__list > .sb-mm-item > .sb-mm-link,
  .sb-mobile-menu__sub > .sb-mm-item > .sb-mm-link{
    display: block;
    position: relative;
    margin: 0 16px;
    text-decoration: none;
    color: #fff !important;
    border-bottom: 1px solid #eee;
    background: transparent !important;
    font-family: 'Niveau-Grotesk', niveau-grotesk, sans-serif !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
  }

  /* top-level links: more vertical padding */
  .sb-mobile-menu__list > .sb-mm-item > .sb-mm-link{
    padding: 19px 72px 19px 22px;
    font-family: 'Niveau-Grotesk', niveau-grotesk, sans-serif !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
  }

  /* submenu items keep current spacing, plus more left indent */
  .sb-mobile-menu__sub > .sb-mm-item > .sb-mm-link{
    padding: 15px 22px 15px 34px;
  }

  .sb-mm-link > div{
    display: grid;
    gap: 4px;
  }

  /* bigger tap target without bigger caret */
  .sb-mm-toggle{
    position: absolute;
    top: 0;
    right: 0;
    width: 64px;
    min-height: 58px;
    border: 0;
    background: transparent !important;
    color: #fff !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: none !important;
    border-radius: 0 !important;
    z-index: 5;
    -webkit-tap-highlight-color: transparent;
  }

  .sb-mm-toggle span{
    display: inline-block;
    color: #fff !important;
    font-size: 16px !important;
    line-height: 1;
    transition: transform .2s ease;
    transform: rotate(0deg);
    background: transparent !important;
    pointer-events: none;
  }

  li.is-sub-open > .sb-mm-toggle span{
    transform: rotate(180deg);
  }

  .sb-mm-toggle:focus,
  .sb-mm-toggle:active,
  .sb-mm-toggle:focus-visible{
    background: transparent !important;
    outline: none !important;
    box-shadow: none !important;
  }

  .simple-banner{
    display: none !important;
  }
}

@media (max-width: 921px){
  .ast-mobile-header-wrap .menu-toggle,
  .ast-mobile-header-wrap .main-header-menu-toggle,
  .ast-mobile-header-wrap .ast-button-wrap{
    display: flex !important;
    align-items: center;
    justify-content: center;
    visibility: visible !important;
    opacity: 1 !important;
  }
}

/* ========================================
   Footer button styles (kept from your file)
   ======================================== */

.site-footer-section .wp-block-button__link {
  border-style: solid;
  border-width: 0;
  padding: 10px 15px;
  font-weight: 900;
  font-size: 14px;
  line-height: 1.5em;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-radius: 3px;
  background-color: #fff;
  color: #52287E;
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  align-self: flex-start;
  justify-content: space-between;
  font-family: 'Niveau-Grotesk', niveau-grotesk, sans-serif;
}

.site-footer-section .wp-block-button__link:after {
  font-family: FontAwesome;
  font-weight: 400;
  vertical-align: middle;
  padding-left: 10px;
  content: "\f054";
}

.site-footer-section .wp-block-button__link:hover {
  color: #52287E;
}

@media (max-width: 1200px){

  .sb-mm-toggle{
    opacity: 1 !important;
    visibility: visible !important;
  }

  .sb-mm-toggle span{
    color: #fff !important;
    font-size: 18px !important;
    line-height: 1 !important;
    display: inline-block !important;
  }

  /* open state rotation (your existing rule is fine, just ensure it applies) */
  li.is-sub-open > .sb-mm-toggle span{
    transform: rotate(180deg);
  }
}

@media (max-width: 1200px){
  .sb-mm-item.menu-item-has-children > a{
    padding-right: 62px; /* give room for toggle */
  }
}

@media (max-width: 1200px){

  .ast-header-break-point #masthead .ast-mobile-header-wrap .ast-primary-header-bar, .ast-header-break-point #masthead .ast-mobile-header-wrap .ast-below-header-bar, .ast-header-break-point #masthead .ast-mobile-header-wrap .ast-above-header-bar {
    padding-left: 0;
    padding-right: 0;
  }

  /* Default mobile header background */
  .ast-main-header-wrap {
    background-image: url("/wp-content/uploads/2025/04/sbhpp-purple-bg-d973d1.svg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }

  .lesson-template-default .ast-main-header-wrap {
    background: transparent !important;
    background-image: none !important;
  }

  .newsletters-template-default .ast-main-header-wrap {
    background: transparent !important;
    background-image: none !important;
  }

  /* If simple-hero exists, remove it */
  body.has-simple-hero .ast-main-header-wrap {
    background: transparent !important;
    background-image: none !important;
  }

  body.has-simple-hero .ast-main-header-wrap, body.single-course .ast-main-header-wrap{
    background: transparent !important;
    background-image: none !important;
  }

  body.single-course.ast-primary-sticky-header-active #ast-mobile-header {
    top: 0 !important;
  }

  body.ast-primary-sticky-header-active .ast-main-header-wrap {
    background-image: url(/wp-content/uploads/2025/04/sbhpp-purple-bg-d973d1.svg) !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
  }

  }

  /* ----------------------------
     SUBMENU CONTAINER + ITEMS
  ---------------------------- */

  .sb-mobile-menu__sub{
    padding: 6px 0 12px;
    background: #fff;
  }

  /* each submenu <li> */

  /* submenu link block spacing */
  .sb-mobile-menu__sub a.sb-mm-link{
    padding: 14px 18px;           /* more breathing room */
    text-transform: none;         /* stop yelling for subitems */
    letter-spacing: 0;
    font-weight: 800;
  }

  /* the inner <div> that wraps title + description */
  .sb-mobile-menu__sub a.sb-mm-link > div{
    display: grid;
    gap: 6px;                     /* ✅ space between title + description */
  }

  /* title */

  /* description */
  .sb-mobile-menu__sub a.sb-mm-link span{
    display: block;
    color: #fff !important;
    font-size: 14px !important;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
  }

  /* add spacing BETWEEN submenu items (visual rhythm) */
  .sb-mobile-menu__sub > li + li a.sb-mm-link{
    padding-top: 16px;
  }


  /* ----------------------------
     CARET BUTTON (NO BACKGROUND)
  ---------------------------- */

  .sb-mm-toggle{
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    -webkit-tap-highlight-color: transparent;
  }

  .sb-mm-toggle:active,
  .sb-mm-toggle:focus,
  .sb-mm-toggle:focus-visible{
    background: transparent !important;  /* ✅ remove “active bg” */
    outline: none !important;
    box-shadow: none !important;
  }

  /* if you used the CSS-drawn caret version */
  .sb-mm-toggle::after{
    background: transparent !important;
  }

  /* if you kept the ▾ span version */
  .sb-mm-toggle span{
    background: transparent !important;
  }


@media (max-width: 1200px){
  .sb-mobile-menu__sub a.sb-mm-link{
    padding-left: 28px;
  }
  .ast-off-canvas-active .sb-mobile-menu {
    display:block !important;
  }
}

/* ========================================
   CME CONFERENCES — add space between rows
   (spacing between the 2 items stacked in each column)
   ======================================== */

#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-conferences
  li.mega-menu-column > ul.mega-sub-menu{
  display: flex;
  flex-direction: column;
  gap: 22px; /* ✅ increase to match CME Info */
}

/* Optional: if you want a touch more breathing room inside each item too */
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-conferences
  li.mega-menu-item > a.mega-menu-link{
  margin: 0;
  padding: 10px 12px !important;
}

/* Optional: if you want a touch more breathing room inside each item too */
#mega-menu-wrap-primary #mega-menu-primary > li.menu-cme-conferences
  li.mega-menu-item {
  padding: 15px !important; /* keep your 0 if you prefer tighter */
}

.simple-banner .simple-banner-text {
  margin-left: 0 !important;
}

@media (max-width: 921px) {
  .ast-mobile-header-wrap .menu-toggle,
  .ast-mobile-header-wrap .main-header-menu-toggle,
  .ast-mobile-header-wrap .ast-button-wrap {
    display: flex !important;
    align-items: center;
    justify-content: center;
    visibility: visible !important;
    opacity: 1 !important;
  }
}


@media (min-width: 1201px) {

  .page-template-page-cart-custom-php #ast-desktop-header {
    background-image: url("/wp-content/uploads/2025/04/sbhpp-purple-bg-d973d1.svg") !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
  }

  .page-template-default #ast-desktop-header {
    background-image: url("/wp-content/uploads/2025/04/sbhpp-purple-bg-d973d1.svg") !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
  }

  .post-type-archive #ast-desktop-header {
	  background-image: url("/wp-content/uploads/2025/04/sbhpp-purple-bg-d973d1.svg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }

  .error404 #ast-desktop-header {
    background-image: url("/wp-content/uploads/2025/04/sbhpp-purple-bg-d973d1.svg") !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
  }

  .ast-primary-sticky-header-active #ast-desktop-header {
    background: #ffffff !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    top: 0 !important;
  }

  .ast-primary-sticky-header-active #ast-desktop-header #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link {
    color: #000 !important;
    cursor: pointer !important;
  }

  .ast-primary-sticky-header-active #ast-desktop-header #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:hover {
    color: #52287E !important;
  }

  .ast-primary-sticky-header-active #ast-desktop-header .dash-ast-custom-button {
    background-color: #52287E;
    color: #fff;
  }
  .ast-primary-sticky-header-active #ast-desktop-header .ast-icon.icon-cart {
    background-image: url("/wp-content/themes/skinbonescme/assets/images/cart.svg") !important;
  }

  /* keep wrapper visible */
  .ast-primary-sticky-header-active #ast-desktop-header .site-logo-img {
    display: inline-block !important;
    position: relative;
  }

  /* swap the actual desktop logo */
  .ast-primary-sticky-header-active #ast-desktop-header .custom-logo {
    content: url('/wp-content/themes/skinbonescme/assets/images/sbhpp-wide-logo-d.svg');
    width: auto;
    max-height: 50px;
  }

  body.ast-primary-sticky-header-active .ast-site-header-cart .ast-addon-cart-wrap i.astra-icon:after {
    background-color: #52287E;
    color: #fff;
  }

  /* admin logged in */
  .admin-bar.ast-primary-sticky-header-active #ast-desktop-header {
    top: 32px !important;
  }

   .post-type-archive-newsletters #ast-desktop-header {
    background: transparent !important;
    background-image: none !important;
  }

  .ast-primary-sticky-header-active.post-type-archive-newsletters #ast-desktop-header {
    background: #ffffff !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
  }

}


@media (min-width: 1201px) and (max-width: 1530px) {
#ast-fixed-header #mega-menu-wrap-primary #mega-menu-primary {
  gap: 15px !important;
}
}