@import url('../../styles/myaccount.css');
/* Search result container */
.livesearch .product-price {
  display: none;
}

.livesearch .product-name {
  line-height: 22.764px;
  color: #000;
}

.livesearch .product-result div {
  justify-content: flex-start !important;
}

.livesearch .product-result img {
  object-fit: contain;
}

.livesearch .view-all-footer {
  justify-content: center !important;
  line-height: 22.764px;
  color: #000;
}

input[type='search']::-webkit-search-decoration,
input[type='search']::-webkit-search-cancel-button,
input[type='search']::-webkit-search-results-button,
input[type='search']::-webkit-search-results-decoration {
  display: none;
}

/* header and nav layout */
#header.fixed-header {
  position: fixed;
  transform: translateY(200px);
  width: 100vw;
}

#header {
  background-color: var(--hvt-blue-dark);
  color: var(--c-white);
  font-size: .813rem;
  z-index: 99;
  transition: transform .25s;
  position: absolute;
  width: 100%;
  margin-top: -200px;
  top: 0;
}

.header-wrapper .header {
  height: 0 !important;
}

.header-top {
  width: 100%;
  background-color: var(--c-primary-dark);
  margin: 0 auto;
  max-width: 1900px;
  padding: 16px 35px 10px 20px;
  z-index: 2;
}

.header-top > .columns-wrapper {
  padding: 0 30px 10px;
}

.header-top > .columns-wrapper .columns.columns-2-cols {
  position: relative;
}

.header-top > .search-wrapper {
  padding: 0 30px 5px;
}

.header-top .icon {
  height: unset;
  width: unset;
}

.header-top .icon-header-logo {
  width: 145px;
  max-width: unset;
}

.header-top .icon-header-logo img {
  width: 145px;
  max-width: unset;
}

.header-top .icon-anniversary-header-logo,
.header-top .icon-anniversary-header-logo img {
  width: 165px;
}

.header-top div > div:nth-child(2) {
  display: flex;
  justify-content: flex-end;
  gap: 40px;
  align-items: center;
}

.header-top div > div:nth-child(2) a {
  display: flex;
  gap: 8px;
  align-items: center;
  color: var(--c-gray);
  font-size: 0.813rem;
  font-family: var(--ff-primary);
  text-decoration: none;
  margin-left: 2px;
  padding: 10px 0;
}

.header-top div > div:nth-child(2) a:hover {
  color: var(--c-link-hover);
}

.header-top div > div:nth-child(2) a::before {
  display: block;
  left: 0;
  top: 0;
  width: auto;
}

.header-top div > div:nth-child(2) a.header-my-store-link::before {
  content: url('../../icons/storelocator.svg');
}

.header-top div > div:nth-child(2) a.header-my-store-link:hover::before {
  /* preloaded in header.js during delayed phase, update there if updated here */
  content: url('../../icons/storelocator-icon-hover.svg');
}

.header-top div > div:nth-child(2) a.header-my-account::before {
  content: url('../../icons/account.svg');
}

.header-top div > div:nth-child(2) a.header-my-account:hover::before {
  /* preloaded in header.js during delayed phase, update there if updated here */
  content: url('../../icons/myhavertys-icon-hover.svg');
}

.header-top div > div:nth-child(2) a.header-my-cart::before {
  content: url('../../icons/cart.svg');
}

.header-top div > div:nth-child(2) a.header-my-cart:hover::before {
  /* preloaded in header.js during delayed phase, update there if updated here */
  content: url('../../icons/cart-icon-hover.svg');
}

.header-top div > div:nth-child(2) a.header-my-cart > span {
  font-size: 13px;
}

.header-top:has(.icon-header-logo) {
  display: block;
}

header .nav-wrapper {
  background-color: var(--background-color);
}

header nav {
  background: var(--c-primary-dark);
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  align-items: center;
  margin: auto;
  width: 100%;
  font-family: var(--ff-primary);
  font-size: 0.813rem;
  justify-content: space-between;
}

header nav p {
  margin: 0;
  line-height: 1;
}

@media (width <= 1899px) {
  .header-top {
    padding: 16px 15px 10px 0;
  }
}

@media (width <= 1199px) {
  body {
    --header-height: 109px;
  }

  .header-top {
    padding: 16px 17px 10px;
  }

  .header-top > .columns-wrapper,
  .header-top > .search-wrapper {
    padding: 0;
  }

  .header-top > .search-wrapper {
    margin-top: 11px;
  }

  .header-top .icon-header-logo img {
    width: 90px;
  }

  .header-top .icon-anniversary-header-logo,
  .header-top .icon-anniversary-header-logo img {
    width: 120px;
  }

  .header-top div > div:nth-child(2) p:last-child a {
    padding-right: 0;
  }

  .header-top div > div:nth-child(2) a.header-my-cart > span {
    padding-left: 8px;
  }

  .header-top .columns > div {
    flex-direction: row;
    justify-content: space-between;
  }

  .header-top > .columns-wrapper .columns.columns-2-cols {
    padding-right: 18px;
  }

  .header-top div > div:nth-child(2) {
    gap: 14px;
  }

  .header-top .columns > div > div:first-child {
    display: flex;
    flex-direction: row;
    gap: 1rem;
  }

  .header-top div > div:nth-child(2) a {
    font-size: 0;
    margin: 0;
    padding: 4px 10px;
    gap: 0;
  }
}

@media (width < 1024px) {
  .header-top > .columns-wrapper .columns.columns-2-cols {
    padding-right: 0;
  }
}

/* Mini Cart  */

.cart-mini-cart:not(:has(.cart-empty-cart)) {
  max-height: 760px;
  min-height: 360px;
}

/* If viewport height is below max, set max height to 90% of viewport */
@media (height < 820px) {
  .cart-mini-cart:not(:has(.cart-empty-cart)) {
    max-height: calc(100vh - var(--nav-height));
  }
}

header .nav-search-input .search_autocomplete .popover-container {
  width: 100%;
}

@media (width >= 1024px) {
  header nav .nav-tools-wrapper {
    position: relative;
  }

  header nav .nav-search-panel {
    width: 398px;
  }
}

/* TODO - CSS for authCombine demo (Auth Drop-In) */
#auth-combine-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0 0 0 / 50%);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 5;
}

#auth-combine-wrapper {
  background-color: var(--c-white);
  border-radius: var(--shape-border-radius-2);
  width: 800px;
  min-height: max-content;
  margin: 0 10px;
}

/* TODO - CSS for auth dropdown demo (Auth Drop-In) */

.hide {
  display: none;
}

.dropdown-wrapper.nav-tools-wrapper .nav-dropdown-button {
  font: var(--type-body-1-default-font) !important;
  letter-spacing: var(--type-body-1-default-letter-spacing) !important;
  background-color: transparent;
  margin: 0;
  padding: 0;
  border: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: auto;
  min-width: 40px;
}

.dropdown-wrapper.nav-tools-wrapper {
  font: var(--type-body-1-default-font) !important;
  letter-spacing: var(--type-body-1-default-letter-spacing) !important;
  width: 100%;
}

@media (width >= 1024px) {
  .dropdown-wrapper.nav-tools-wrapper {
    width: 398px;
  }
}

@media (width <= 767px) {
  .livesearch.popover-container {
    width: 430px;
    height: auto;
  }

  .search-autocomplete {
    left: 0;
  }

  .search-autocomplete .products-container a {
    padding: 16px;
  }

  .search-autocomplete .product-result {
    column-gap: 16px;
    align-self: center;
    box-sizing: inherit;
    display: grid;
    padding: unset;
    grid-template:
      'image' 1fr
      'productName'
      'price';
  }

  .search-autocomplete .product-result img {
    width: 60px;
    height: 60px;
    object-fit: contain;
  }
}

.dropdown-wrapper.nav-tools-wrapper .nav-auth-menu-panel .authenticated-user-menu {
  list-style: none;
  cursor: pointer;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

.dropdown-wrapper.nav-tools-wrapper .nav-auth-menu-panel .authenticated-user-menu li {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.dropdown-wrapper.nav-tools-wrapper .nav-auth-menu-panel .authenticated-user-menu li > a {
  padding: 12px 15px;
  display: inline-block;
  width: 100%;
  text-decoration: none;
}

.dropdown-wrapper.nav-tools-wrapper .nav-auth-menu-panel .authenticated-user-menu li > .logoutButton:hover {
  background-color: lightgray;
}

.dropdown-wrapper.nav-tools-wrapper .nav-auth-menu-panel .authenticated-user-menu li button {
  cursor: pointer;
  background-color: transparent !important;
  color: currentColor !important;
  padding: 12px 15px !important;
  display: inline-block !important;
  width: 100% !important;
  text-decoration: none !important;
  font: var(--type-body-1-strong-font) !important;
  letter-spacing: var(--type-body-1-strong-letter-spacing) !important;
  margin: 0 !important;
  text-align: start !important;
  box-sizing: border-box !important;
  border: none !important;
  border-radius: 0 !important;
}

.dropdown-wrapper.nav-tools-wrapper .nav-auth-menu-panel .authenticated-user-menu li button:hover {
  background-color: lightgray !important;
  border-radius: 0 !important;
}

.grecaptcha-badge {
  margin-top: 20px;
}

/* ADA changes */
@media (width >=75em) {
  .keyboardFocus .meganav-item a:focus {
    outline: 0;
    position: relative;
    background-color: hsl(0deg 0% 100% / 20%);
  }

  .keyboardFocus .meganav-item a[aria-expanded]:first-of-type::before {
    content: '⭣';
    display: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -15px;
    font-size: 0.9rem;
    z-index: 100;
  }

  .keyboardFocus .nav-drawer .columns .button-container a:focus-visible {
    border: none;
    border-bottom: none;
    color: var(--c-link-hover);
    text-decoration: underline;
    outline: none;
  }

  .keyboardFocus .meganav-item a[aria-expanded='true']:first-of-type::before,
  .keyboardFocus .meganav-item a[aria-expanded]:focus:first-of-type::before {
    display: block;
  }

  .keyboardFocus .meganav-item a[aria-expanded='true']:focus:first-of-type::before {
    display: block;
    transform: rotate(180deg) translateY(50%);
  }

  .keyboardFocus .meganav-item em a:focus:last-of-type {
    background-color: transparent;
    outline: solid var(--shape-border-width-1) var(--color-neutral-400);
    outline-offset: -2px;
  }
}

.header-my-account {
  cursor: pointer;
}

.bodyAppear {
  --header-height: 0;
}