/* Algolia autocomplete — Absolute Web */

.algolia-autocomplete {
  width: 100%;
  display: block;
}

/*
 * Desktop header search teleports .aa-dropdown-menu into
 * .header-search-dropdown-anchor (outside .algolia-autocomplete).
 * Scope suggestion styles to both roots.
 */
.header-search-dropdown-anchor,
.mm-nav-search-dropdown-anchor,
.algolia-autocomplete {
  --aws-quick-search-border: #000;
  --aws-quick-search-muted: #60646C;
  --aws-quick-search-surface: #F7F6F9;
  --aws-quick-search-accent: #2E56FF;
  --aws-quick-search-divider: rgba(0, 0, 0, 0.2);
}

.header-search-dropdown-anchor .aa-dropdown-menu,
.mm-nav-search-dropdown-anchor .aa-dropdown-menu,
.mm-nav-search .algolia-autocomplete .aa-dropdown-menu,
.algolia-autocomplete .aa-dropdown-menu {
  width: 100%;
  max-width: none;
  margin: 8px 0 0;
  padding: 0;
  border: 1px solid var(--aws-quick-search-border);
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 9px 9px rgba(0, 0, 0, 0.03), 0 2px 5px rgba(0, 0, 0, 0.03);
  box-sizing: border-box;
  z-index: 200;
  max-height: 480px;
  overflow-x: hidden;
  overflow-y: auto;
}

.header-search-dropdown-anchor .aa-dropdown-menu {
  margin-top: 8px;
}

.mm-nav-search-dropdown-anchor .aa-dropdown-menu {
  margin-top: 8px;
  max-height: none;
  overflow-x: hidden;
  overflow-y: auto;
}

.header-search-dropdown-anchor .aa-dropdown-menu[style*="display: none"],
.mm-nav-search-dropdown-anchor .aa-dropdown-menu[style*="display: none"] {
  border: 0;
  padding: 0;
  margin: 0;
  box-shadow: none;
}

.algolia-autocomplete .aa-dropdown-menu.aws-autocomplete-dropdown--mobile {
  position: fixed !important;
  left: 16px !important;
  right: 16px !important;
  width: auto !important;
  max-width: none !important;
  margin-top: 0;
  z-index: 10000001;
  box-sizing: border-box;
}

.header-search-dropdown-anchor .aa-suggestions,
.mm-nav-search-dropdown-anchor .aa-suggestions,
.algolia-autocomplete .aa-dropdown-menu .aa-suggestions {
  max-height: none;
  overflow-x: hidden;
  overflow-y: visible;
}

.header-search-dropdown-anchor .aa-dataset,
.mm-nav-search-dropdown-anchor .aa-dataset,
.algolia-autocomplete .aa-dataset {
  border: 0;
}

.header-search-dropdown-anchor .autocomplete-header,
.mm-nav-search-dropdown-anchor .autocomplete-header,
.algolia-autocomplete .autocomplete-header {
  padding: 8px 12px 4px;
  border-bottom: 1px dashed var(--aws-quick-search-divider);
}

.header-search-dropdown-anchor .autocomplete-header-title,
.mm-nav-search-dropdown-anchor .autocomplete-header-title,
.algolia-autocomplete .autocomplete-header-title {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--aws-quick-search-muted);
}

.header-search-dropdown-anchor a.suggestion-link,
.mm-nav-search-dropdown-anchor a.suggestion-link,
.algolia-autocomplete a.suggestion-link {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
  max-width: 100%;
  padding: 8px 12px;
  color: #000;
  text-decoration: none;
  border: 0;
  box-sizing: border-box;
}

.header-search-dropdown-anchor .aa-suggestion,
.mm-nav-search-dropdown-anchor .aa-suggestion,
.algolia-autocomplete .aa-suggestion {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.header-search-dropdown-anchor .aa-suggestion + .aa-suggestion,
.mm-nav-search-dropdown-anchor .aa-suggestion + .aa-suggestion,
.algolia-autocomplete .aa-suggestion + .aa-suggestion {
  border-top: 1px dashed var(--aws-quick-search-divider);
}

.header-search-dropdown-anchor a.suggestion-link:hover,
.header-search-dropdown-anchor a.suggestion-link:focus,
.mm-nav-search-dropdown-anchor a.suggestion-link:hover,
.mm-nav-search-dropdown-anchor a.suggestion-link:focus,
.algolia-autocomplete a.suggestion-link:hover,
.algolia-autocomplete a.suggestion-link:focus {
  background: var(--aws-quick-search-surface);
  color: #000;
}

.header-search-dropdown-anchor .suggestion-post-thumbnail,
.mm-nav-search-dropdown-anchor .suggestion-post-thumbnail,
.algolia-autocomplete .suggestion-post-thumbnail {
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  border: 1px solid var(--aws-quick-search-border);
  border-radius: 6px;
  background: var(--aws-quick-search-surface);
  box-sizing: border-box;
  overflow: hidden;
}

.header-search-dropdown-anchor .suggestion-post-thumbnail--media,
.mm-nav-search-dropdown-anchor .suggestion-post-thumbnail--media,
.algolia-autocomplete .suggestion-post-thumbnail--media {
  display: block;
  line-height: 0;
}

.header-search-dropdown-anchor .suggestion-post-thumbnail--media img,
.mm-nav-search-dropdown-anchor .suggestion-post-thumbnail--media img,
.algolia-autocomplete .suggestion-post-thumbnail--media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 0;
  border-radius: 0;
}

.header-search-dropdown-anchor .suggestion-post-thumbnail--placeholder,
.mm-nav-search-dropdown-anchor .suggestion-post-thumbnail--placeholder,
.algolia-autocomplete .suggestion-post-thumbnail--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #A8ABB2;
}

.header-search-dropdown-anchor .suggestion-post-thumbnail--placeholder svg,
.mm-nav-search-dropdown-anchor .suggestion-post-thumbnail--placeholder svg,
.algolia-autocomplete .suggestion-post-thumbnail--placeholder svg {
  display: block;
  width: 20px;
  height: 20px;
}

.header-search-dropdown-anchor .suggestion-post-attributes,
.mm-nav-search-dropdown-anchor .suggestion-post-attributes,
.algolia-autocomplete .suggestion-post-attributes {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.header-search-dropdown-anchor .suggestion-post-title,
.mm-nav-search-dropdown-anchor .suggestion-post-title,
.algolia-autocomplete .suggestion-post-title {
  display: block;
  width: 100%;
  max-width: 100%;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  color: #000;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal !important;
}

.header-search-dropdown-anchor .suggestion-post-title em,
.mm-nav-search-dropdown-anchor .suggestion-post-title em,
.algolia-autocomplete .suggestion-post-title em {
  font-style: normal;
  font-weight: inherit;
  background: transparent;
  color: var(--aws-quick-search-accent);
}

.header-search-dropdown-anchor .suggestion-post-date,
.mm-nav-search-dropdown-anchor .suggestion-post-date,
.algolia-autocomplete .suggestion-post-date {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 4px;
  background: var(--aws-quick-search-surface);
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  color: var(--aws-quick-search-muted);
}

.header-search-dropdown-anchor .autocomplete-empty,
.mm-nav-search-dropdown-anchor .autocomplete-empty,
.algolia-autocomplete .autocomplete-empty {
  padding: 12px;
  text-align: center;
}

.header-search-dropdown-anchor .autocomplete-empty-message,
.mm-nav-search-dropdown-anchor .autocomplete-empty-message,
.algolia-autocomplete .autocomplete-empty-message {
  margin: 0 0 12px;
  font-size: 14px;
  color: var(--aws-quick-search-muted);
}

.header-search-dropdown-anchor .autocomplete-footer,
.algolia-autocomplete .autocomplete-footer {
  padding: 12px;
  border-top: 1px dashed var(--aws-quick-search-divider);
  text-align: center;
}

.header-search-dropdown-anchor .autocomplete-view-all,
.algolia-autocomplete .autocomplete-view-all {
  display: inline-block;
  font-size: 14px;
  font-weight: 500;
  color: var(--aws-quick-search-accent);
  text-decoration: none;
}

.header-search-dropdown-anchor .autocomplete-view-all:hover,
.algolia-autocomplete .autocomplete-view-all:hover {
  text-decoration: underline;
}

.header-search-dropdown-anchor .autocomplete-footer-branding,
.algolia-autocomplete .autocomplete-footer-branding {
  margin-top: 8px;
  font-size: 11px;
  color: var(--aws-quick-search-muted);
}

@media screen and (max-width: 991px) {
  .mm-nav-search-dropdown-anchor .aa-dropdown-menu {
    margin-top: 8px;
    max-height: none;
    box-shadow: none;
  }

  .mm-nav-search-dropdown-anchor .autocomplete-footer,
  .mm-nav-search-dropdown-anchor .autocomplete-view-all,
  .mm-nav-search-dropdown-anchor .autocomplete-footer-branding {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .header-search-dropdown-anchor .suggestion-post-thumbnail,
  .mm-nav-search-dropdown-anchor .suggestion-post-thumbnail,
  .algolia-autocomplete .suggestion-post-thumbnail {
    width: 48px;
    height: 48px;
  }

  .header-search-dropdown-anchor .suggestion-post-thumbnail--placeholder svg,
  .mm-nav-search-dropdown-anchor .suggestion-post-thumbnail--placeholder svg,
  .algolia-autocomplete .suggestion-post-thumbnail--placeholder svg {
    width: 18px;
    height: 18px;
  }
}
