/**
 * ATS Mobile Menu V1 - Panta Rhei responsive header profile.
 *
 * Site/theme-specific layout only. The universal module stylesheet contains
 * controls and menu behaviour; this file maps the existing Panta Divi rows to
 * the requested mobile composition. Desktop is intentionally untouched.
 */

@media (max-width: 980px) {
  /* Topbar: contact left takes remaining width; wishlist/cart/hamburger right
   * stays content-width. The existing desktop Headermenu remains controlled by
   * Divi visibility and is not re-enabled here. */
  .ats-panta-topbar-row {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: .15rem !important;
    width: calc(100% - 12px) !important;
    max-width: none !important;
    margin-left: 6px !important;
    margin-right: 6px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .ats-panta-topbar-row > .et_pb_column {
    margin-bottom: 0 !important;
  }

  .ats-panta-topbar-row > .et_pb_column:first-child {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    margin-right: .1rem !important;
  }

  .ats-panta-topbar-row > .et_pb_column:last-child {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: max-content !important;
    margin-left: auto !important;
    margin-right: 0 !important;
  }

  .ats-panta-topbar-row .ats_mobile_menu_v1,
  .ats-panta-topbar-row .ats-mobile-menu-v1 {
    width: auto !important;
  }

  /* Main header: reuse the desktop three-column Divi row on mobile.
   * Logo and search become two full-width rows; account column disappears
   * because account navigation is already part of the ATS mobile menu. */
  .ats-panta-main-header-row {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
  }

  .ats-panta-main-header-row > .et_pb_column:nth-child(1),
  .ats-panta-main-header-row > .et_pb_column:nth-child(2) {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .ats-panta-main-header-row > .et_pb_column:nth-child(3) {
    display: none !important;
  }

  .ats-panta-main-header-row > .et_pb_column:nth-child(1) .et_pb_image {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  .ats-panta-main-header-row > .et_pb_column:nth-child(2) .et_pb_code,
  .ats-panta-main-header-row > .et_pb_column:nth-child(2) .et_pb_code_inner {
    width: 100% !important;
    max-width: none !important;
  }
}

/* Alpha35: Panta presentation polish only; functional controls remain generic. */
@media (max-width: 980px) {
  /* Badges overlap the icon itself, not the top edge of the 44px touch target. */
  .ats-panta-topbar-row .ats-mobile-menu-v1__controls .ats-header-wishlist-count,
  .ats-panta-topbar-row .ats-mobile-menu-v1__controls .ats-lcn-cart-count {
    top: 4px !important;
    right: 4px !important;
  }

  /* The dark Panta panel needs a slightly brighter divider than the neutral base. */
  .ats-panta-topbar-row .ats-mobile-menu-v1__section + .ats-mobile-menu-v1__section,
  .ats-panta-topbar-row .ats-mobile-menu-v1__language-row {
    border-top-color: rgba(255,255,255,.20) !important;
  }

  .ats-panta-topbar-row .ats-mobile-menu-v1__section + .ats-mobile-menu-v1__section {
    margin-top: .7rem;
    padding-top: .7rem;
  }

  .ats-panta-topbar-row .ats-mobile-menu-v1__submenu-toggle {
    min-width: 44px;
  }
}

/* Alpha36: keep the Panta contact address on one line on normal phone widths.
 * The row already consumes almost the full viewport; only very narrow devices
 * are allowed to wrap rather than overlap the 44px header controls. */
@media (min-width: 400px) and (max-width: 980px) {
  .ats-panta-topbar-row > .et_pb_column:first-child .et_pb_blurb_content {
    max-width: none !important;
  }

  .ats-panta-topbar-row > .et_pb_column:first-child .et_pb_blurb_description,
  .ats-panta-topbar-row > .et_pb_column:first-child .et_pb_blurb_description a {
    white-space: nowrap !important;
  }
}


/* Alpha37: compact the Panta mobile topbar without shrinking the 44px touch targets.
 * The row gets virtually full viewport width, visual gaps collapse, and Divi's
 * default left-position blurb icon/text padding is reduced so the email address
 * has more usable line width before the mobile controls begin. */
@media (min-width: 360px) and (max-width: 980px) {
  .ats-panta-topbar-row {
    width: calc(100% - 4px) !important;
    margin-left: 2px !important;
    margin-right: 2px !important;
    gap: 0 !important;
  }

  .ats-panta-topbar-row > .et_pb_column:first-child {
    margin-right: 0 !important;
  }

  .ats-panta-topbar-row .ats-mobile-menu-v1__controls {
    gap: 0 !important;
  }

  .ats-panta-topbar-row > .et_pb_column:first-child .et_pb_blurb_position_left .et_pb_blurb_container,
  .ats-panta-topbar-row > .et_pb_column:first-child .et_pb_blurb_container {
    padding-left: 4px !important;
  }

  .ats-panta-topbar-row > .et_pb_column:first-child .et_pb_main_blurb_image {
    margin-right: 0 !important;
    margin-bottom: 0 !important;
  }

  .ats-panta-topbar-row > .et_pb_column:first-child .et_pb_blurb_description {
    line-height: 1.15 !important;
  }
}


/* Alpha38: narrow-phone fail-safe. Function wins over single-line cosmetics:
 * below 400px the contact address may wrap instead of running underneath the
 * fixed-width wishlist/cart/menu controls. */
@media (max-width: 399px) {
  .ats-panta-topbar-row > .et_pb_column:first-child,
  .ats-panta-topbar-row > .et_pb_column:first-child .et_pb_blurb_content,
  .ats-panta-topbar-row > .et_pb_column:first-child .et_pb_blurb_container,
  .ats-panta-topbar-row > .et_pb_column:first-child .et_pb_blurb_description {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .ats-panta-topbar-row > .et_pb_column:first-child .et_pb_blurb_description,
  .ats-panta-topbar-row > .et_pb_column:first-child .et_pb_blurb_description a {
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }
}
