/*
 * Ravix Store 2.9.44 — split the right-side desktop navigation into two
 * independent capsules: (1) logo + product categories, (2) regular WP menu.
 * The account/cart/search capsule remains on the opposite side.
 * Mobile header, drawer navigation, category data and WooCommerce actions
 * retain their existing markup and behaviour.
 */
@media (min-width: 1051px) {
  .rvx-site-header .rvx-header-main__inner {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: row !important;
    direction: rtl !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    width: min(calc(100% - 40px), 1540px) !important;
    max-width: 1540px !important;
    min-height: 78px !important;
    height: auto !important;
    margin-inline: auto !important;
    padding: 7px 0 !important;
    overflow: visible !important;
  }

  /* Keep the two right-side capsules together as one visual navigation group. */
  .rvx-site-header .rvx-desktop-nav-group {
    box-sizing: border-box !important;
    display: flex !important;
    flex: 0 1 auto !important;
    flex-direction: row !important;
    direction: rtl !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: calc(100% - 330px) !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Capsule 1 — brand and product categories. */
  .rvx-site-header .rvx-premium-nav-capsule {
    box-sizing: border-box !important;
    position: relative !important;
    isolation: isolate !important;
    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 62px !important;
    min-height: 62px !important;
    margin: 0 !important;
    padding: 5px 11px !important;
    border: 1px solid #e2e9f4 !important;
    border-radius: 19px !important;
    background: #fff !important;
    box-shadow: 0 7px 22px rgba(25, 48, 88, .075) !important;
    overflow: visible !important;
  }
  .rvx-site-header .rvx-brand--desktop {
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
    width: 68px !important;
    min-width: 68px !important;
    max-width: 68px !important;
    margin: 0 !important;
  }
  .rvx-site-header .rvx-brand--desktop .custom-logo {
    display: block !important;
    width: auto !important;
    max-width: 62px !important;
    max-height: 42px !important;
    object-fit: contain !important;
  }
  .rvx-site-header .rvx-brand--desktop .rvx-text-logo {
    font-size: 17px !important;
    white-space: nowrap !important;
  }
  .rvx-site-header .rvx-premium-nav-capsule > .rvx-category-nav {
    position: relative !important;
    display: flex !important;
    flex: 0 0 auto !important;
    align-self: stretch !important;
    align-items: center !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .rvx-site-header .rvx-premium-nav-capsule .rvx-category-nav__toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    height: 44px !important;
    padding: 0 10px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: transparent !important;
    color: #263449 !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
  }
  .rvx-site-header .rvx-premium-nav-capsule .rvx-category-nav__toggle:hover,
  .rvx-site-header .rvx-premium-nav-capsule .rvx-category-nav.is-open .rvx-category-nav__toggle {
    background: #f1f5fd !important;
    color: #2453c8 !important;
  }

  /* Capsule 2 — regular WordPress navigation, visually separate. */
  .rvx-site-header .rvx-header-nav-row.rvx-primary-menu-capsule {
    box-sizing: border-box !important;
    position: relative !important;
    top: auto !important;
    z-index: 2 !important;
    display: flex !important;
    flex: 0 1 auto !important;
    align-items: center !important;
    justify-content: center !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: calc(100% - 215px) !important;
    height: 62px !important;
    min-height: 62px !important;
    margin: 0 !important;
    padding: 4px 8px !important;
    border: 1px solid #e2e9f4 !important;
    border-radius: 19px !important;
    background: #fff !important;
    box-shadow: 0 7px 22px rgba(25, 48, 88, .075) !important;
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
    overflow: visible !important;
    transition: box-shadow .2s ease, border-color .2s ease !important;
  }
  .rvx-site-header .rvx-primary-menu-capsule .rvx-header-nav-row__inner {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    width: max-content !important;
    max-width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .rvx-site-header .rvx-primary-menu-capsule .rvx-primary-nav {
    display: flex !important;
    flex: 0 1 auto !important;
    align-items: center !important;
    justify-content: center !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
  }
  .rvx-site-header .rvx-primary-menu-capsule .rvx-menu {
    display: flex !important;
    flex: 0 1 auto !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    gap: 2px !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .rvx-site-header .rvx-primary-menu-capsule .rvx-menu > li {
    display: flex !important;
    flex: 0 1 auto !important;
    align-items: center !important;
    min-width: 0 !important;
    white-space: nowrap !important;
  }
  .rvx-site-header .rvx-primary-menu-capsule .rvx-menu > li > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 44px !important;
    padding: 0 clamp(7px, .72vw, 12px) !important;
    border: 0 !important;
    border-radius: 11px !important;
    background: transparent !important;
    color: #344052 !important;
    font-size: 11.5px !important;
    font-weight: 760 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    transition: color .16s ease, background-color .16s ease !important;
  }
  .rvx-site-header .rvx-primary-menu-capsule .rvx-menu > li > a:hover,
  .rvx-site-header .rvx-primary-menu-capsule .rvx-menu > li.current-menu-item > a,
  .rvx-site-header .rvx-primary-menu-capsule .rvx-menu > li.current-menu-ancestor > a {
    background: #f1f5fd !important;
    color: #2453c8 !important;
  }
  .rvx-site-header .rvx-primary-menu-capsule .rvx-menu .sub-menu {
    top: calc(100% + 9px) !important;
    z-index: 900 !important;
    border: 1px solid #e3eaf5 !important;
    border-radius: 14px !important;
    box-shadow: 0 18px 42px rgba(18, 39, 82, .15) !important;
  }

  /* The left action capsule remains a separate third group. */
  .rvx-site-header .rvx-premium-actions-capsule {
    flex: 0 0 320px !important;
    width: 320px !important;
    min-width: 320px !important;
    max-width: 320px !important;
    height: 62px !important;
    min-height: 62px !important;
    margin: 0 !important;
  }

  /* Mega-menu remains anchored to the brand/category capsule and can span the header. */
  .rvx-site-header .rvx-premium-nav-capsule:has(.rvx-category-nav.is-open) {
    z-index: 260 !important;
    background: #fff !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}

@media (min-width: 1051px) and (max-width: 1350px) {
  .rvx-site-header .rvx-header-main__inner {
    width: calc(100% - 24px) !important;
    gap: 7px !important;
  }
  .rvx-site-header .rvx-desktop-nav-group {
    gap: 6px !important;
    max-width: calc(100% - 318px) !important;
  }
  .rvx-site-header .rvx-premium-nav-capsule {
    gap: 5px !important;
    padding-inline: 7px !important;
  }
  .rvx-site-header .rvx-brand--desktop {
    width: 58px !important;
    min-width: 58px !important;
    max-width: 58px !important;
  }
  .rvx-site-header .rvx-brand--desktop .custom-logo {
    max-width: 54px !important;
  }
  .rvx-site-header .rvx-premium-nav-capsule .rvx-category-nav__toggle {
    gap: 4px !important;
    padding-inline: 6px !important;
    font-size: 10.5px !important;
  }
  .rvx-site-header .rvx-header-nav-row.rvx-primary-menu-capsule {
    padding-inline: 4px !important;
  }
  .rvx-site-header .rvx-primary-menu-capsule .rvx-menu > li > a {
    padding-inline: 6px !important;
    font-size: 10px !important;
  }
  .rvx-site-header .rvx-header-nav-row.rvx-primary-menu-capsule {
    max-width: calc(100% - 190px) !important;
  }
  .rvx-site-header .rvx-premium-actions-capsule {
    flex-basis: 308px !important;
    width: 308px !important;
    min-width: 308px !important;
    max-width: 308px !important;
  }
}

@media (max-width: 1050px) {
  /* Unwrap the desktop-only group so the original mobile header layout is preserved. */
  .rvx-site-header .rvx-desktop-nav-group {
    display: contents !important;
  }
  /* The split capsules are desktop-only. Mobile keeps its original header/drawer. */
  .rvx-site-header .rvx-premium-nav-capsule > .rvx-category-nav {
    display: none !important;
  }
  .rvx-site-header .rvx-header-nav-row.rvx-primary-menu-capsule {
    display: none !important;
  }
}