/* Shared compact masthead; the homepage keeps its stacked logo variant. */
.retail-header .retail-header-main {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  min-height: 76px;
  height: 76px;
  padding: 8px 0;
  gap: 20px;
}
.retail-header .retail-brand--detail {
  width: 160px;
  flex-shrink: 0;
  margin: 0;
}
.retail-header .retail-brand--detail img {
  display: block;
  width: 100%;
  height: auto;
}
.retail-header .retail-header-main .retail-search {
  flex: 0 1 450px;
  width: 450px;
  margin-left: 0;
  order: initial;
  min-width: 0;
  height: 44px;
}
.retail-header .retail-search input {
  min-width: 0;
}
.retail-header .retail-search button {
  height: 42px;
  flex-shrink: 0;
}
.retail-header .header-store {
  margin-left: auto;
  display: flex;
  flex-shrink: 0;
  min-height: 44px;
}
@media(max-width:700px) {
  .retail-header .retail-header-main {
    height: 60px;
    min-height: 60px;
    gap: 10px;
    width: calc(100% - 24px);
  }
  .retail-header .retail-brand--detail {
    width: 104px;
  }
  .retail-header .retail-search input {
    padding-left: 10px;
    font-size: 14px;
  }
  .retail-header .retail-search button {
    width: 38px;
  }
  .retail-header .header-store {
    width: 44px;
    padding: 0;
    justify-content: center;
  }
  .retail-header .header-store span {
    display: none;
  }
}

/* Inner-page icon masthead, including its bottom border: 50px. */
.compact-page .retail-header {height: 50px;min-height: 50px;box-sizing: border-box;}
.compact-page .retail-header .retail-header-main {height: 49px;min-height: 49px;padding: 0;gap: 4px;}
.compact-page .retail-header .retail-brand--detail {width: 138px;}
.header-search-menu {margin-left: auto;position: relative;}
.header-search-menu>summary {
  display: flex;align-items: center;justify-content: center;
  width: 44px;height: 44px;list-style: none;cursor: pointer;color: #202124;
}
.header-search-menu>summary::-webkit-details-marker {display:none;}
.header-search-menu>summary .icon {width: 21px;height: 21px;}
.compact-page .retail-header .header-store {
  margin-left: 0;width: 44px;height: 44px;min-height: 44px;padding: 0;
  justify-content: center;background: transparent;color: #202124;
}
.compact-page .retail-header .header-store span {display: none;}
.header-search-panel {
  position: absolute;right: -48px;top: 47px;z-index: 100;
  width: min(360px,calc(100vw - 24px));padding: 12px;background: #fff;
  border: 1px solid #e5e5e5;border-radius: 6px;box-shadow: 0 6px 18px #00000012;
}
.compact-page .retail-header .header-search-panel .retail-search {width: 100%;height: 40px;}
.compact-page .retail-header .header-search-panel .retail-search button {height: 38px;}

@media(max-width:700px) {
  .home-page .retail-header .retail-header-main {height: 50px;min-height: 50px;padding: 6px 0;gap: 10px;}
  .home-page .retail-header .retail-brand,
  .home-page .retail-header .retail-brand img {width: 48px;height: 36px;}
  .home-page .retail-header .retail-brand img {object-fit: contain;}
  .home-page .retail-header .retail-header-main .retail-search {height: 34px;flex: 1;width: auto;}
  .home-page .retail-header .retail-search input {height: 32px;padding-block: 0;font-size: 13px;}
  .home-page .retail-header .retail-search button {height: 32px;width: 34px;}
}

/* The search container supplies the focus treatment; avoid a second input ring. */
.retail-header .retail-search input:focus,
.retail-header .retail-search input:focus-visible {
  outline: none;
  box-shadow: none;
}

/* Search results have their own always-visible search field. */
.compact-page[data-page="search"] .retail-header .header-store {margin-left: auto;}
.search-shell .search-page-form {margin-bottom: 16px;}
.search-shell .search-page-form .retail-search {width: 100%;height: 46px;border-radius: 6px;}
.search-shell .search-page-form input {height: 44px;font-size: 16px;padding: 10px 14px;border-radius: 6px;}
.search-shell .search-page-form input:focus,
.search-shell .search-page-form input:focus-visible {outline: none;box-shadow: none;}
.search-shell .search-page-form button {width: 46px;height: 44px;border-radius: 6px;flex-shrink: 0;}

@media (max-width: 700px) {
  .home-page .retail-header .retail-search input,
  .home-page .retail-header .retail-search input::placeholder {font-weight: 400;}
}