/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */
.player__name {
  font-size: 0.75rem;
  color: #fff;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 0.125rem; }
  .player__name-picklist {
    font-size: 16px; }

.match-header {
  color: #fff;
  background-color: #4a3780;
  padding: 1rem;
  border-radius: 6px;
  margin: 5rem 0 2rem 0; }
  .match-header__title {
    color: #fff;
    margin: 0 0 1rem; }
  .match-header__subtitle {
    font-weight: 700;
    margin: 0 0 1rem; }
  .match-header__round {
    margin: 0 0 1rem; }
  .match-header > *:last-child {
    margin: 0; }

.match-container {
  border-radius: 6px;
  background-color: #212121;
  box-sizing: border-box;
  margin-bottom: 2rem;
  overflow: hidden; }

.team-score, .coach-score {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #212121;
  padding: 0.5rem 0.25rem 0; }
  .team-score__home, .team-score__away, .coach-score__home, .coach-score__away {
    display: flex;
    flex: 1 1 0;
    align-items: center;
    font-weight: 700; }
    .team-score__home a, .team-score__away a, .coach-score__home a, .coach-score__away a {
      overflow: hidden; }
      .team-score__home a:hover, .team-score__away a:hover, .coach-score__home a:hover, .coach-score__away a:hover {
        color: #936DFF;
        text-decoration: underline; }
    .team-score__home .flagcontainer, .team-score__away .flagcontainer, .coach-score__home .flagcontainer, .coach-score__away .flagcontainer {
      flex: 0 0 32px; }
  .team-score__home, .coach-score__home {
    text-align: right;
    justify-content: end; }
    .team-score__home .flagcontainer, .coach-score__home .flagcontainer {
      padding-left: 0.25rem; }
  .team-score__scores, .coach-score__scores {
    flex: 0 0 64px;
    height: 32px;
    font-size: 1.5rem;
    font-weight: 700;
    text-align: center;
    color: #212121;
    border-radius: 2px;
    margin: 0 0.25rem;
    background-color: #fff; }
  .team-score__away .flagcontainer, .coach-score__away .flagcontainer {
    padding-right: 0.25rem; }

.team-score__home, .team-score__away {
  height: 44px; }
  .team-score__home a, .team-score__away a {
    max-height: 44px; }

.coach-score {
  border-bottom: 2px dotted #616161;
  padding: 0 0.25rem 0.5rem; }
  .coach-score__scores {
    background-color: transparent; }
  .coach-score__home a, .coach-score__away a {
    font-weight: 400;
    color: #BDBDBD;
    max-height: 22px; }

.match-location {
  width: 100%;
  color: #a98aff;
  display: block;
  border: 0 none;
  outline: 0;
  box-shadow: none;
  box-sizing: border-box;
  border-radius: 0;
  background-color: #212121;
  margin: 0 auto;
  position: relative; }
  .match-location:hover, .match-location:focus, .match-location:active {
    color: #fff;
    background-color: #424242;
    outline: 0 none; }
  .match-location .icon-collapsed, .match-location .icon-expanded {
    position: absolute;
    top: 50%;
    right: 0.5rem;
    transform: translateY(-50%);
    z-index: 1;
    display: none; }
  .match-location.collapsed .icon-collapsed {
    display: block; }
  .match-location.collapsed .icon-expanded {
    display: none; }
  .match-location .icon-expanded {
    display: block; }

.match {
  padding: 0 1rem 1rem; }

.nav-tabs {
  display: flex;
  border: 0 none; }
  .nav-tabs > li {
    flex: 1 0 50%; }
    .nav-tabs > li:focus, .nav-tabs > li:focus-visible {
      border: 0 none;
      outline: 0; }
    .nav-tabs > li > a, .nav-tabs > li > a:hover, .nav-tabs > li a:focus {
      font-weight: 700;
      text-transform: uppercase;
      text-align: center;
      border-radius: 0;
      border: 0 none;
      outline: 0;
      margin: 0;
      background-color: transparent;
      border-bottom: 6px solid transparent; }
    .nav-tabs > li > a {
      color: #9E9E9E; }
      .nav-tabs > li > a:hover {
        border-bottom: 6px solid #9E9E9E; }
      .nav-tabs > li > a:focus {
        background-color: #424242 !important; }
    .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
      color: #fff;
      outline: 0;
      border: 0 none;
      border-bottom: 6px solid #fff;
      background-color: transparent; }
    .nav-tabs > li.active:focus, .nav-tabs > li.active:focus-visible {
      border: 0 none;
      outline: 0; }

.match-view {
  position: relative;
  margin: 0 auto; }
  .match-view .legend {
    position: absolute;
    top: 2rem;
    left: 0.5rem;
    z-index: 9; }
  .match-view__positions {
    width: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3; }
    @media (min-width: 768px) and (max-width: 1024px) {
      .match-view__positions {
        width: 640px; } }
    @media screen and (min-width: 1025px) {
      .match-view__positions {
        width: 900px; } }
  .match-view__position {
    display: flex;
    justify-content: space-around;
    margin-bottom: 1rem; }
    .match-view__position--glk {
      padding-top: 1rem;
      margin-bottom: 2rem; }
    .match-view__position--dmd {
      padding-top: 1rem;
      margin-bottom: -1rem; }
    .match-view__position--mid {
      margin-bottom: -1rem; }
    .match-view__position--mid .card-player-wrapper:nth-child(1) {
      order: 2;
      margin-top: 60px; }
    .match-view__position--mid .card-player-wrapper:nth-child(2) {
      order: 1; }
    .match-view__position--mid .card-player-wrapper:nth-child(3) {
      order: 3; }
    .match-view__position--stk .card-player-wrapper:nth-child(2) {
      order: 3; }
    .match-view__position--stk .card-player-wrapper.has-sub {
      order: 2;
      margin-top: 60px; }

.card-player-wrapper {
  width: 80px;
  height: 195px; }
  .card-player-wrapper.has-sub {
    position: relative;
    transition: transform 0.8s;
    transform-style: preserve-3d;
    perspective: 1000px; }
    .card-player-wrapper.has-sub.flipped {
      transform: rotateX(180deg); }
      .card-player-wrapper.has-sub.flipped .card-player:nth-child(1) {
        transform: rotateX(0); }
    .card-player-wrapper.has-sub .card-player {
      position: absolute;
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden; }
      .card-player-wrapper.has-sub .card-player:nth-of-type(1) {
        transform: rotateX(0); }
      .card-player-wrapper.has-sub .card-player:nth-of-type(2) {
        transform: rotateX(180deg); }

.card-player {
  width: 80px;
  text-align: center; }
  .card-player__content {
    position: relative;
    margin-bottom: 0.625rem; }
  .card-player__info {
    width: 100%;
    height: 102px;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 2; }
    .card-player__info .logo__club {
      width: 34px;
      height: 34px;
      line-height: calc(34px - 4px);
      border-radius: 100%;
      margin: 0.5rem 0 0.325rem;
      display: block; }
    .card-player__info .player__save, .card-player__info .player__clean-sheet {
      position: absolute;
      left: -10px;
      top: 5px;
      z-index: 2; }
    .card-player__info .player__is-sub {
      position: absolute;
      right: -12px;
      top: 4px; }
    .card-player__info .player__goals--total {
      position: absolute;
      top: 5px;
      right: -8px;
      z-index: 3; }
    .card-player__info .player__goals--final {
      position: absolute;
      left: 50%;
      bottom: -6px;
      z-index: 1;
      transform: translateX(-50%); }
  .card-player .crest__shape {
    width: 80px;
    height: 102px;
    background-color: #2E2E2E;
    background-image: linear-gradient(144deg, #4B4B4B 48.31%, #2E2E2E 48.32%);
    clip-path: path("M3.48 12.927 40 0l36.52 12.927c.987.241 1.87.846 2.502 1.713.633.868.978 1.947.978 3.059v34.334c0 4.829-1.084 17.583-3.156 21.84-2.072 4.258-5.067 7.887-8.72 10.565L40 102 11.876 84.438c-3.653-2.678-6.647-6.306-8.719-10.562C1.085 69.619.001 56.866 0 52.038v-34.34c0-1.111.345-2.19.978-3.058.632-.867 1.515-1.472 2.502-1.713Z"); }
  .card-player--to-play .crest {
    position: relative;
    filter: drop-shadow(0px 0px 10px #000); }
    .card-player--to-play .crest__shape {
      width: 80px;
      height: 102px;
      background-color: #000;
      background-image: linear-gradient(144deg, #212121 48.31%, #000 48.32%);
      clip-path: path("M3.48 12.927 40 0l36.52 12.927c.987.241 1.87.846 2.502 1.713.633.868.978 1.947.978 3.059v34.334c0 4.829-1.084 17.583-3.156 21.84-2.072 4.258-5.067 7.887-8.72 10.565L40 102 11.876 84.438c-3.653-2.678-6.647-6.306-8.719-10.562C1.085 69.619.001 56.866 0 52.038v-34.34c0-1.111.345-2.19.978-3.058.632-.867 1.515-1.472 2.502-1.713Z"); }
    .card-player--to-play .crest__border {
      width: 80px;
      height: 102px;
      background-color: #fff;
      clip-path: path("M0.97561 51.9577V18.3564C0.975779 17.2681 1.31225 16.2125 1.92949 15.3636C2.54674 14.5148 3.40786 13.9235 4.37073 13.6874L40 1.03801L75.6293 13.6874C76.5921 13.9235 77.4533 14.5148 78.0705 15.3636C78.6878 16.2125 79.0242 17.2681 79.0244 18.3564V51.953C79.0241 56.6781 77.9664 69.1582 75.9453 73.3242C73.9242 77.4901 71.0021 81.0411 67.4385 83.662L40 100.846L12.5615 83.662C8.99848 81.0416 6.07679 77.4913 4.05571 73.3263C2.03463 69.1613 0.976635 56.6821 0.97561 51.9577ZM75.9111 12.7494L40 0L4.08887 12.7494C2.90974 13.0516 1.87546 13.7774 1.14125 14.7871C0.3977 15.8096 0.000200272 17.0687 0 18.3562V51.9577C0.000523183 54.3693 0.269032 58.7114 0.789781 62.9709C1.05049 65.1033 1.37625 67.2306 1.7672 69.096C2.1543 70.943 2.6187 72.6009 3.17848 73.7545C5.2657 78.0558 8.28785 81.7324 11.9846 84.4511L12.0139 84.4727L40 102L67.9861 84.4727L68.0154 84.4511C71.7128 81.7319 74.7353 78.0546 76.8226 73.7523C77.3824 72.5985 77.8467 70.9404 78.2338 69.0931C78.6247 67.2275 78.9504 65.1 79.211 62.9673C79.7316 58.7074 79.9998 54.3651 80 51.953V18.3564C79.9998 17.0689 79.6023 15.8096 78.8587 14.7871C78.1245 13.7774 77.0903 13.0516 75.9111 12.7494Z");
      position: absolute;
      top: 0;
      left: 0; }
  .card-player--inactive {
    opacity: 0.8; }
    .card-player--inactive .crest__shape {
      background-color: #616161;
      background-image: none; }
  .card-player--no-player {
    opacity: 1; }
    .card-player--no-player .crest__shape {
      background-color: #000;
      background-image: none; }
    .card-player--no-player .card-player__info {
      flex-direction: row; }
  .card-player .position {
    margin: 0 auto 0.5rem; }
    .card-player .position__wrapper {
      position: relative; }
      .card-player .position__wrapper .rpl-icon--sub {
        top: 2px;
        right: 0;
        transform: scale(1.1);
        position: absolute;
        z-index: 1; }
  .card-player .sub {
    font-size: 0.75rem;
    position: relative;
    height: 55px; }
    .card-player .sub:before {
      color: #EEEEEE;
      display: block;
      height: 20px;
      line-height: 1.2; }
      @media (min-width: 768px) {
        .card-player .sub:before {
          line-height: 1; } }
    .card-player .sub__name {
      width: 100%;
      color: #E0E0E0;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      padding: 0 0.125rem;
      background-color: #212121;
      border-radius: 4px 4px 0 0;
      border-bottom: 2px solid #757575;
      margin-bottom: 0.125rem; }
      .card-player .sub__name--to-play {
        border: 1px solid #fff; }

.player__goal-stats {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-around;
  flex-wrap: nowrap;
  padding: 0; }

.ball--glk {
  fill: #FF4400; }

.ball--def {
  fill: #FFAE00; }

.ball--sub {
  fill: #757575; }