.storefront-header {
  position: relative;
  z-index: 101;
  background: #fff;
  font-family: 'Poppins', sans-serif;
}

.storefront-offer {
  background: #4F171B;
  color: #fff;
  text-align: center;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 600;
}

.storefront-main {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 15px;
}

.storefront-logo {
  flex: 0 0 155px;
}

.storefront-logo img {
  display: block;
  width: 100%;
  height: 50px;
  object-fit: contain;
}

.storefront-search {
  display: flex;
  flex: 1;
  min-width: 0;
  border: 1px solid #c5b9ba;
  border-radius: 6px;
  background: #fff;
}

.storefront-search input {
  min-width: 0;
  width: 100%;
  border: 0;
  background: transparent;
  padding: 8px 10px;
  font: inherit;
  font-size: 13px;
  color: #000;
}

.storefront-search button,
.storefront-bell {
  border: 0;
  background: transparent;
  color: #4F171B;
  padding: 8px;
  font-size: 20px;
}

.storefront-profile {
  flex: 0 0 36px;
}

.storefront-profile img {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
}

.storefront-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 4px 10px;
  background: #f0ecec;
  gap: 2px;
  border-bottom: 1px solid #ead7d9;
}

.storefront-nav-link {
  display: block;
  border: 0;
  background: transparent;
  color: #000;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  padding: 9px 5px;
  white-space: nowrap;
}

.storefront-nav .dropdown-menu {
  max-height: 65vh;
  overflow-y: auto;
  font-size: 13px;
  border-color: #ead7d9;
}

.storefront-nav .dropdown-item {
  color: #000;
  padding: 9px 16px;
}

.storefront-nav .dropdown-item:hover,
.storefront-nav .dropdown-item:focus {
  color: #4F171B;
  background: #f5eeee;
}

body.petmagnet-home .storefront-header~main.page-content.space-top {
  padding-top: 0;
}

@media (max-width: 575.98px) {
  .storefront-main {
    gap: 5px;
    padding: 10px 8px;
  }

  .storefront-logo {
    flex-basis: 106px;
  }

  .storefront-logo img {
    height: 41px;
  }

  .storefront-search input {
    font-size: 11px;
    padding: 8px 5px;
  }

  .storefront-search button,
  .storefront-bell {
    font-size: 17px;
    padding: 6px;
  }

  .storefront-profile {
    flex-basis: 29px;
  }

  .storefront-profile img {
    width: 29px;
    height: 29px;
  }

  .storefront-nav {
    justify-content: center;
    padding: 3px 4px;
    column-gap: 6px;
  }

  .storefront-nav-link {
    font-size: 10px;
    padding: 8px 2px;
  }
}
/* Red, single-line sliding announcement strip. */
.storefront-header .storefront-offer{background:#e31c35;color:#fff;padding:6px 0;overflow:hidden;white-space:nowrap;line-height:1.5;font-size:12px;min-height:30px;text-align:left}
.storefront-offer .offer-strip-link{display:block;color:#fff;text-decoration:none;overflow:hidden}
.storefront-offer .offer-strip-track{display:flex;width:max-content;max-width:none;white-space:nowrap;animation:offer-strip-slide 22s linear infinite;will-change:transform}
.storefront-offer .offer-strip-copy{display:block;flex:none;min-width:430px;padding:0 30px;box-sizing:border-box;text-align:center;white-space:nowrap}
.storefront-offer:hover .offer-strip-track,.storefront-offer:focus-within .offer-strip-track{animation-play-state:paused}
@keyframes offer-strip-slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.storefront-offer .offer-strip-track{animation:none;transform:none}.storefront-header .storefront-offer,.storefront-offer .offer-strip-link{overflow-x:auto}.storefront-offer .offer-strip-copy[aria-hidden]{display:none}}
/* Give the homepage search more breathing room beside the logo and icons. */
body.petmagnet-home .page-wrapper .storefront-main{gap:9px}
body.petmagnet-home .page-wrapper .storefront-search{height:36px;margin-inline:3px}
body.petmagnet-home .page-wrapper .storefront-search input{padding-top:6px;padding-bottom:6px}
body.petmagnet-home .page-wrapper .storefront-search button{display:flex;align-items:center;justify-content:center;padding-top:5px;padding-bottom:5px}
@media(max-width:575.98px){body.petmagnet-home .page-wrapper .storefront-main{gap:9px}body.petmagnet-home .page-wrapper .storefront-search input{font-size:11px}}
/* Homepage search uses Pet Magnet burgundy. */
html body.petmagnet-home .page-wrapper header.storefront-header form.storefront-search button[type="submit"]{background:#4f171b!important;border-color:#4f171b!important;color:#fff!important}
html body.petmagnet-home .page-wrapper header.storefront-header form.storefront-search button[type="submit"]:hover,html body.petmagnet-home .page-wrapper header.storefront-header form.storefront-search button[type="submit"]:active{background:#3c1115!important;border-color:#3c1115!important}
html body.petmagnet-home .page-wrapper header.storefront-header form.storefront-search button[type="submit"]:focus-visible{outline:2px solid #4f171b;outline-offset:3px}
/* Center search in the space between the logo and account controls. */
body.petmagnet-home .page-wrapper .storefront-main{display:grid;grid-template-columns:121px minmax(0,1fr) auto 29px;align-items:center;column-gap:9px}
body.petmagnet-home .page-wrapper .storefront-search{width:100%;margin:0;justify-self:center;align-self:center}
@media(max-width:370px){body.petmagnet-home .page-wrapper .storefront-main{grid-template-columns:106px minmax(0,1fr) auto 29px;column-gap:7px}body.petmagnet-home .page-wrapper .storefront-logo{width:106px}}
