#algolia-search
  .ais-search-box
    margin: 0 auto
    max-width: 100%
    width: 100%

    input
      padding: 0.25rem 0.7rem
      outline: none
      border: 2px solid $light-blue
      border-radius: 2rem
      font-size: 14px

  .ais-hits--item.algolia-hit-item
    position: relative
    padding-left: 1.5rem

    &:hover
      &:before
        border-color: $ruby

    &:before
      $w = 0.3rem
      position: absolute
      top: 0.4rem
      left: 0
      width: w = $w
      height: h = w
      border: 0.5 * w solid $light-blue
      border-radius: w
      background: $white
      content: ""
      line-height: h
      transition: all 0.2s ease-in-out

    a
      display: block
      color: $font-black
      text-decoration: none
      font-size: 14px
      cursor: pointer

      &:hover
        color: $light-blue

  .ais-pagination.pagination
    margin: 0.8rem 0 0 0
    padding: 0
    text-align: center

    .ais-pagination--item
      margin: 0 0.2rem
      padding: 0

      a
        display: inline-block
        min-width: 1.2rem
        height: 1.2rem
        text-align: center
        line-height: 1.2rem

    .ais-pagination--item.current
      a
        background: $cyan
        color: $white
        text-decoration: none
        cursor: default

  .algolia-logo
    padding-top: 2px
    width: 4rem
    height: 1.5rem