@import './assets/styles/global.scss';

.search-results {

  li {
    margin-bottom: calculateRem(32);
    cursor: pointer;

    h3 {
      font-size: calculateRem(24);
      margin-bottom: calculateRem(8);
      color: #fff;
      display: inline-block;

      &.matched-name {
        @include hasRedUnderline;
        position: relative;
      }
    }

    h5 {
      font-size: calculateRem(16);
      margin-bottom: calculateRem(8);
      color: #fff;
    }

    p {
      font-size: calculateRem(14);
      display: inline;

      span {
        position: relative;
        
        &::before {
          content: '';
          position: absolute;
          top: -10%;
          left: -2%;
          height: 120%;
          width: 104%;
          background-color: $red;
          color: $navy;
          z-index: -1;
        }
      }
    }
  }
}