/* ===== GLOBAL OVERFLOW GUARD (prevents "too wide" pages) ===== */
html, body {
  overflow-x: hidden !important;
}

/* MW Custom Header */
.mw-custom-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 20px;
  background-color: #fff; /* Adjust as needed */
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.mw-logo {
  position: relative;
}

.mw-custom-header .logo-normal,
.mw-custom-header .logo-sticky {
  position: absolute;
  top: 0;
  left: 0;
  transition: opacity 220ms ease;
}

.mw-custom-header .logo-normal {
  opacity: 1;
  visibility: visible;
  z-index: 2;
}

.mw-custom-header .logo-sticky {
  opacity: 0;
  visibility: hidden;
  z-index: 3;
  pointer-events: none;
}

.mw-custom-header .logo-normal img,
.mw-custom-header .logo-sticky img {
  display: block;
  height: auto;
  max-width: 100%;
}

.nav {
  /* Additional nav styles if needed */
}

/* Prevent header builder containers from creating horizontal overflow */
.et-l--header,
.et-l--header .et_builder_inner_content,
.et-l--header .et_pb_section,
.et-l--header .et_pb_row,
.et-l--header .et_pb_column,
.et-l--header .et_pb_module {
  max-width: 100% !important;
}

/* ===== HEADER & NAVIGATION ===== */

/* Set the Divi menu dropdown auto width */
@media only screen and (min-width: 981px) {
  .nav li ul,
  .et-db #et-boc .et-l .nav li ul {
    width: fit-content;
    display: flex;
    flex-direction: column;
  }

  .nav li li {
    white-space: nowrap;
  }

  .nav li li a,
  .et-menu li li a {
    width: auto !important;
  }

  /* If your header section class changes, update this selector */
  .et_pb_section_0_tb_header {
    padding-bottom: 5px !important;
    padding-top: 5px !important;
  }
}

/* Display a line under the sub-menu item on hover */
.nav li li a:hover,
.et-menu li li a:hover {
  border-bottom: 3px solid #fff !important;
}

/* ===== PRODUCT PAGES ===== */

/* Remove the yellow highlight from the product count */
.woocommerce-loop-category__title mark.count {
  background: none;
  color: #000;
  opacity: 0.6;
  letter-spacing: 1px;
}

/* Hide Stripe express payment buttons on product pages */
.single-product .payment-request-button,
.single-product .wc-stripe-payment-request-wrapper {
  display: none !important;
}

/* Hide on specific product types for extra safety */
.product-type-variable .payment-request-button,
.product-type-subscription .payment-request-button,
body.has-nyp-form .payment-request-button {
  display: none !important;
}

/* ===== BUTTONS & ICONS ===== */

/* Social button icon styling */
.social-button,
.social-login-button,
.button-with-icon {
  position: relative;
  padding-left: 40px !important;
  background-position: 10px center !important;
  background-repeat: no-repeat !important;
  background-size: 20px 20px !important;
}

/* =========================================================
   MW HEADER LOGO SWAP — NORMAL vs STICKY (DESKTOP ONLY)
   IMPORTANT:
   - Green logo module class:  logo-normal
   - White logo module class:  logo-sticky
   - Parent column must be Position: Relative
   - White logo module should be Position: Absolute (top:0 left:0)
   ========================================================= */
@media only screen and (min-width: 981px) {

  /* Default state: show green, hide white */
  .logo-normal {
    opacity: 1;
    visibility: visible;
    position: relative;
    z-index: 2;
    transition: opacity 220ms ease;
  }

  .logo-sticky {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3;
    pointer-events: none;
    transition: opacity 220ms ease;
  }

  /* Sticky state: hide green, show white */
  .et_pb_sticky--top .logo-normal {
    opacity: 0 !important;
    visibility: hidden !important;
  }

  .et_pb_sticky--top .logo-sticky {
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* Prevent layout weirdness */
  .logo-normal img,
  .logo-sticky img {
    display: block;
    height: auto;
    max-width: 100%;
  }
}