/* =========================================================
   search.css (loaded AFTER stylesan.css)
   Scope: search results page only
   Goals:
   - Cart icon renders correctly (icon + badge aligned)
   - H1 sits 20px below header (reliable even with <br>)
   ========================================================= */

/* ---------- 1) Header: remove stray top whitespace ---------- */
html, body{
  margin: 0 !important;
  padding: 0 !important;
}

#mu-header,
#mu-header .navbar{
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: #fff !important;
}

#mu-header{
  border-bottom: 1px solid #e5e5e5 !important;
}

/* Bootstrap default adds bottom margin to navbar */
#mu-header .navbar{
  margin-bottom: 0 !important;
}

/* ---------- 2) H1: force 20px below nav/header ---------- */
/* Your page has: <section id="mu-chef"><br> ... so margin alone won't behave.
   We remove the <br> effect by zeroing the first element spacing and adding padding. */
#mu-chef{
  padding-top: 40px !important;   /* the actual 20px requirement */
}

/* If the theme has extra top padding/margin inside, normalise it */
#mu-chef .mu-chef-area,
#mu-chef .mu-rec-sold-title,
#mu-chef .mu-chef-area-squeeze{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Keep the H1 itself tidy */
#mu-chef .mu-chef-area-squeeze h1.newArrivals{
  margin-top: 0 !important;       /* spacing is controlled by #mu-chef padding */
}

/* ---------- 3) Cart icon: render via ::before (bulletproof) ---------- */
/* Ensure the link is a positioning context for the badge */
a.cartIconStyle{
  position: relative !important;
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

/* Hide any original <i> icon so we fully control output */
a.cartIconStyle i.fa{
  display: none !important;
}

/* Draw the cart color: lime !important; */
a.cartIconStyle::before{
  content: "\f07a" !important;              /* FontAwesome shopping-cart */
  font-family: "FontAwesome" !important;    /* FA4 */
  font-size: 25px !important;
  line-height: 25px !important;
  color: #008080 !important;
  display: inline-block !important;
}

/* Badge sits top-right of icon */
a.cartIconStyle #cartCount{
  position: absolute !important;
  top: 3px !important;
  right: -24px !important;
  z-index: 2 !important;
  margin: 0 !important;
  line-height: 1 !important;
  background: #777 !important;
  color: #fff !important;
}

/* ---------- 4) RESPONSIVE PLACEMENT ---------- */
/* Desktop: cart should sit in the normal nav flow (NOT fixed). */
@media (min-width: 1200px){
  a.cartIconStyle{
    position: absolute !important;
    top: 50% !important;
    right: 15px !important;
    transform: translateY(-50%) !important;
    z-index: 1001 !important;
  }
}

/* Mobile/tablet: cart pinned left of burger */
@media (max-width: 1199px){
  #mu-header{
    position: relative !important;
  }

  /* Burger top-right */
  #mu-header .navbar-toggle{
    position: absolute !important;
    top: 14px !important;
    right: 12px !important;
    margin: 0 !important;
    z-index: 1002 !important;
  }

  /* Cart left of burger */
  a.cartIconStyle{
    position: absolute !important;
    top: 14px !important;
    right: 78px !important; /* space for burger */
    transform: none !important;
    z-index: 1001 !important;
  }
}
.buycontainer{  
text-align: center;  
padding-top: 10px;  
}
.smallref
{
    font-size:10px;
}
.float{
	position:fixed;
	width:60px;
	height:60px;
	bottom:40px;
	left:40px;
	background-color:#25d366;
	color:#FFF;
	border-radius:50px;
	text-align:center;
  font-size:30px;
	box-shadow: 2px 2px 3px #999;
  z-index:100;
}

.my-float{
	margin-top:16px;
}
/* Product page: remove the huge global padding from stylesan.css */
#mu-about-us{
  padding-top: 24px !important;
  padding-bottom: 40px !important;
}

/* The page-title block looks empty in your snippet; remove its margins so it can't create a gap */
#mu-about-us .page-title,
#mu-about-us .page-title p{
  margin: 0 !important;
  padding: 0 !important;
}

@media (max-width: 767px){
  #mu-about-us{
    padding-top: 16px !important;
    padding-bottom: 28px !important;
  }
}
.product-title-mobile{
  margin: 0 !important;
  line-height: 1.15;
}/* =========================================================
   PRODUCT PAGE (FULL WIDTH): add breathing room under header
   ========================================================= */
@media (min-width: 1200px){

  /* Increase spacing under the nav before content starts */
  #mu-about-us{
    padding-top: 90px !important;   /* was 24px */
  }

  /* Put a little space back on the H1/title itself */
  .product-title-mobile{
    margin-top: 20px !important;    /* you currently force margin:0 */
  }

  /* If the slider is still tight, give the slider container a nudge */
  .bx-wrapper,
  .bx-viewport{
    margin-top: 20px !important;
  }
}