/* stylelint-disable max-nesting-depth */
.TrackList {
    font-family: Rubik;
    padding-bottom: 80px;
    padding-left: 40px;
    padding-right: 40px;

    &-table {
        color: var(--gray-700, $gray-700);
        width: 100%;
    }

    &.TrackList-dark &-table {
        color: var(--koala, $koala);
    }

    &-span {
        display: inline-block;
        margin-left: 5px;
    }

    &-th {
        border-bottom: 1px solid var(--koala, $koala);
        border-top: 1px solid var(--koala, $koala);
        font-size: 12px;
        font-weight: 500;
        height: 30px;
        line-height: 30px;
    }

    &-td {
        border-bottom: 1px solid var(--koala, $koala);
        font-size: 14px;
        height: 40px;
    }

    &.TrackList-dark &-th,
    &.TrackList-dark &-td {
        border-color: var(--gray-800, $gray-800);
    }

    &-number {
        padding: 0 20px;
        width: 20px;
    }

    &-row-active {
        background-color: var(--white, $white);
        color: var(--gray-800, $gray-800);
        font-weight: 500;
    }

    &.TrackList-dark &-row-active {
        background-color: var(--gray-800, $gray-800);
        color: var(--white, $white);
    }

    &-row-disabled {
        color: $timberwolf;
    }

    &-duration {
        @media (max-width: 768px) {
            display: none;
        }
    }

    &-duration-active {
        color: var(--primary-ws);
    }

    &.PromoPlayerTrackList {
        padding: 0;

        @media (max-width: 768px) {
            margin-left: -20px;
            width: calc(100% + 40px);
        }
    }

    &.PromoPlayerTrackList &-playback {
        padding-right: 20px;
        text-align: right;
        width: 100px;

        @media (max-width: 768px) {
            width: 50px;
        }
    }

    &.PromoPlayerTrackList &-track-name {
        width: calc(100% - 100px);

        @media (max-width: 768px) {
            width: calc(100% - 50px);
        }
    }

    #audio-player-pause-lite-path {
        fill: var(--primary-ws);
    }
}
/* stylelint-enable max-nesting-depth */