@import "settings.colors";

@import "mixins/settings.fonts";
@import "mixins/tools.mixins";

// Table for "Top results in Stocks, EFTS and Commodities"
// -----

$c-search-padding-t: rem(13);
$c-search-padding-r: rem(15);
$c-search-padding-b: rem(12);
$c-search-padding-l: rem(15);

.c-search__results {
  @include font-gm-sans;
  margin-bottom: rem(18);
  border-top: 1px solid transparent;
  font-size: rem(16);
}

.c-search__item {
  border-bottom: 1px solid transparent;
}
.c-search__link {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  align-content: center;
  text-decoration: none;
}
.c-search__col {
  padding: $c-search-padding-t 0 $c-search-padding-b 0;
}

// Column types
.c-search__col--symbol {
  padding-right: $c-search-padding-r;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-transform: uppercase;
  flex-basis: rem(80);
  flex-shrink: 0;
}

.c-search__col--name {
  padding-left: $c-search-padding-l;
  padding-right: $c-search-padding-r;
  flex-grow: 1;
}

.c-search__col--security {
  padding-left: $c-search-padding-l;
  padding-right: $c-search-padding-r;
  font-size: rem(12);
  line-height: 1;
  letter-spacing: rem(1);
  text-transform: uppercase;
  text-align: left;
  flex-basis: rem(65);
  flex-shrink: 0;
}

.c-search__col--flag {
  flex-basis: rem(20);
  flex-grow: 0;
  flex-shrink: 0;
}

.c-search__col__flag {
  display: block;
  width: rem(20);
  height: rem(14);
  border: 1px solid transparent;
}

.c-search__col--symbol,
.c-search__col--security {
  letter-spacing: rem(1);
}

.c-search__col--name {
  letter-spacing: rem(0.3);
}

// Default - light version
.c-search__results {
  color: $color-grey-800;
  border-top-color: $color-grey-100;
  .c-search__item {
    border-bottom-color: $color-grey-100;
  }
  .c-search__link {
    color: $color-grey-800;

    &:visited {
      .c-search__col--name,
      .c-search__col--news .c-card__hed {
        color: $color-grey-800;
        text-decoration: underline;
      }
    }
    &:hover, &:focus {
      .c-search__col--name,
      .c-search__col--news .c-card__hed {
        color: $color-grey-800;
        text-decoration: underline;
      }
    }
    &:active {
      .c-search__col--name,
      .c-search__col--news .c-card__hed {
        color: $color-grey-500;
        text-decoration: underline;
      }
    }
  }
  .c-search__col--security {
    color: $color-grey-660;
  }
  .c-search__col__flag {
    border-color: $color-grey-100;
  }
}


// Alternate - dark version
.c-search__results--dark {
  color: $color-white;
  border-top-color: $color-grey-700;
  .c-search__item {
    border-bottom-color: $color-grey-700;
  }
  .c-search__link {
    color: $color-white;

    &:visited {
      .c-search__col--name,
      .c-search__col--news .c-card__hed {
        color: $color-white;
        text-decoration: underline;
      }
    }
    &:hover, &:focus {
      .c-search__col--name,
      .c-search__col--news .c-card__hed {
        color: $color-white;
        text-decoration: underline;
      }
    }
    &:active {
      .c-search__col--name,
      .c-search__col--news .c-card__hed {
        color: $color-grey-500;
        text-decoration: underline;
      }
    }
  }
  .c-search__col--security {
    color: $color-white;
  }
  .c-search__col__flag {
    border-color: $color-grey-800;
  }

  // Emulate Inverted card - Text colours
  .c-card__hed,
  .c-card__author,
  .c-timestamp,
  .c-card__video-duration {
    color: $color-white;
  }

  // Icon colours
  .c-indicator-icon__art {
    fill: $color-white;
  }
  .c-indicator-icon__art--ga {
    fill: $color-blue-200;
  }

  .c-card--adv .c-card__hed {
    color: $color-grey-900;
  }
}
