/**
 * Bradley Custom Search Styles
 */

 #ais-wrapper {
     padding: 0 2rem;
 }
 
 #ais-main {
     max-width: 1200px;
     margin: 2rem auto 0 auto;
 }

 #ais-main h1 {
     margin: 0 0 1rem 0;
 }
 
  .search__box-wrapper {
      width: 100%;
      margin-bottom: 2rem;
      position: relative;
  }

  #algolia-search-box#algolia-search-box {
      margin-bottom: 0.5rem;
      width: 100%;
      position: relative;
      input {
          border: none;
          font-weight: normal;
          padding: 0.5rem 1.0rem;
          width: 100%;
          box-sizing: border-box;
      }
  }

  /* Query Suggestions Styling - @algolia/autocomplete-js */
  
  .aa-Label {
      display: none;
  }
  
  .aa-ClearButton {
      background-color: transparent;
      
      &:is(:hover, :focus, :active) {
          background-color: transparent !important;
      }
  }
  
  .aa-Autocomplete {
      position: relative;
      width: 100%;
  }

  .aa-Panel {
      position: absolute;
      top: 100%;
      left: 0;
      right: 0;
      background: white;
      border: 1px solid #ccc;
      border-top: none;
      border-radius: 0 0 4px 4px;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
      z-index: 9999;
      max-height: 300px;
      overflow-y: auto;
      width: 100%;
      box-sizing: border-box;
  }

  .aa-Item {
      padding: 12px 16px;
      cursor: pointer;
      border-bottom: 1px solid #eee;
      transition: background-color 0.2s ease;
      font-size: 1rem;
      color: #333;
      display: block;
      text-decoration: none;
  }

  .aa-Item:hover,
  .aa-Item:focus,
  .aa-Item[aria-selected="true"] {
      background-color: #f8f9fa;
      outline: none;
  }

  .aa-Source:last-of-type .aa-Item:last-child {
      border-bottom: none;
  }
  
  .aa-SourceHeader {
      display: none;
  }

  .aa-NoResults {
      padding: 12px 16px;
      color: #666;
      font-style: italic;
      text-align: center;
  }

  .suggestions-header {
      padding: 8px 16px;
      background-color: #f8f9fa;
      border-bottom: 1px solid #eee;
      font-weight: 600;
      color: #666;
      font-size: 0.9rem;
      text-transform: uppercase;
      letter-spacing: 0.5px;
  }

  /* Override default autocomplete styles that show HTML */
  .aa-Item {
      white-space: normal;
  }

  .aa-Item div,
  .aa-Item span {
      display: block;
      white-space: normal;
  }

.ais-Stats.ais-Stats {
    position: static;
}

#algolia-powered-by {
    display: none;
}

.search__box-wrapper .search__icon {
     left: 14px;
     fill: var(--red);
     display: none;
 }
 
 #algolia-hits {
     margin-top: 3rem;
 }
 
 .ais-Menu-item {
     margin: 0.5rem 0;
 }
 
  .ais-Hits-list,
  .ais-InfiniteHits-list {
     list-style: none;
     padding: 0;
     margin: 0;
 }
 
 .ais-Hits-item,
 .ais-InfiniteHits-item {
     margin: 0 0 2rem 0;
 }
 
 .ais-hits--post-type {
    text-transform: uppercase;
    font-size: 0.9rem;
    color: #444;
 }
 
  .ais-Hits-item.ais-Hits-item :is(em, mark),
  .ais-InfiniteHits-item :is(em, mark) {
    color: inherit;
    background-color: #ffe7ee;
  }
 
 
  .ais-Hits-item .ais-hits--content,
  .ais-InfiniteHits-item .ais-hits--content {
     h2 {
         margin: 0;
         margin-bottom: 0.5rem;
     }
     p {
         margin: 0;
         font-size: 1rem;
     }
     a {
         color: var(--red);
         &:is(:hover, :focus) {
             text-decoration: underline;
         }
     }
 }
 
 .ais-hits--job-title {
     font-weight: 600;
     
 }
 
 .ais-hits--contact {
     margin-top: 0.5rem;
 }
 
 .ais-hits--thumbnail.ais-hits--thumbnail {
     max-width: 100px;
     float: right;
     margin-left: 2rem;
     margin-bottom: 1rem;
     img {
         border-radius: 8px;
     }
 }
 
 .ais-Menu-count {
     &:before {
         content: "(";
     }
     &:after {
         content: ")";
     }
 }

.search__results-layout {
    display: flex;
    flex-direction: column;
    gap: 1rem 4rem;
}

#algolia-hits {
    margin-top: 0;
}

/* Mobile-first: Show mobile filter by default, hide desktop sidebar */
.search__facets-mobile {
    display: block;
    margin: 1rem 0 2rem 0;
}

#ais-facets {
    display: none;
    padding: 0;

    .widgettitle {
        margin-top: 0;
        margin-bottom: 1rem;
        font-size: 1.1rem;
        font-weight: 700;
        color: #333;
    }
}

/* Menu widget styles for desktop sidebar */
.ais-Menu-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.ais-Menu-item {
    margin: 0;
    padding: 0;
}

.ais-Menu-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
    color: #333;
    text-decoration: none;
    border-bottom: 1px solid #eee;
    transition: color 0.2s ease;
}

.ais-Menu-link:hover,
.ais-Menu-link:focus {
    color: var(--red);
}

.ais-Menu-link--selected,
.ais-Menu-item--selected .ais-Menu-link {
    color: var(--red);
    font-weight: 600;
}

.ais-Menu-label {
    flex: 1;
}

.ais-Menu-count {
    color: #666;
    font-size: 0.9rem;
    margin-left: 0.5rem;
}

/* MenuSelect widget styles for mobile dropdown */
.ais-MenuSelect {
    width: 100%;
}

.ais-MenuSelect-select {
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 1rem;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: #fff;
    color: #333;
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    padding-right: 2.5rem;
}

.ais-MenuSelect-select:focus {
    outline: none;
    border-color: var(--red);
    box-shadow: 0 0 0 2px rgba(185, 28, 28, 0.2);
}

.ais-MenuSelect-option {
    padding: 0.5rem;
}



/* Desktop: Show sidebar filter, hide mobile dropdown */
@media (min-width: 1001px) {
    .search__results-layout {
        flex-direction: row-reverse;
        align-items: flex-start;
        gap: 0 4rem;
    }

    #algolia-hits {
        flex: 1;
    }

    #ais-facets {
        display: block;
        flex: 0 0 250px;
        position: sticky;
        top: 2rem;
    }

    .search__facets-mobile {
        display: none;
    }
}

.ais-Pagination-link {
    color: var(--red);
    padding: 8px 12px;
    border-radius: 4px;
    border: 1px solid var(--red);
    &:is(:hover, :focus) {
        background-color: var(--red);
        color: #fff;
    }
}
.ais-Pagination-item--selected .ais-Pagination-link {
    background-color: var(--red);
    color: #fff;
}







.ais-hits--description {
    line-height: 1.4;
    margin-top: 0.5rem;
}

.ais-hits--domain {
    color: #444;
    font-size: 0.85rem;
    margin-top: 0.25rem;
    font-weight: 500;
}

/* Show More button styling */
.ais-InfiniteHits-loadMore {
    margin: 2rem auto;
    padding: 0.75rem 1.5rem;
    background-color: var(--red);
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s ease;
    display: block;
    text-align: center;
}

.ais-InfiniteHits-loadMore:hover {
    background-color: var(--red-dark, #b91c1c);
}

.ais-InfiniteHits-loadMore:disabled {
    background-color: #ccc;
    cursor: not-allowed;
}