﻿.search-table {
    position: relative;
    width: 100%;
    z-index: 0;
}

    .search-table tr {
        border-bottom: 1px solid var(--grey-border);
    }

    .search-table td:hover::before {
        content: '';
        position: absolute;
        top: -1px;
        left: -5000px;
        height: calc(100% + 2px);
        width: 10000px;
        background-color: var(--grey-border);
        z-index: -1;
    }

    .search-table :where(td, th) {
        position: relative;
        padding: 20px 20px;
        text-align: end;
        font-weight: 500;
        color: var(--grey-color);
    }

        .search-table :where(td, th):first-child {
            padding-left: 0;
            text-align: start;
            overflow-wrap: anywhere;
        }

        .search-table :where(td, th):last-child {
            padding-right: 0;
        }

        .search-table :where(th):last-child {
            min-width: 114px;
        }

        .search-table th:nth-child(3) {
            min-width: 94px;
        }

    .search-table th:last-child .tooltip-text {
        left: -150px;
    }

    .search-table td {
        font-weight: 300;
    }

    .search-table th .s-tooltip {
        transform: translateY(2px);
    }

    .search-table a.link-to-source {
        color: gray;
    }

    .search-table span.link-to-source {
        vertical-align: text-bottom;
        font-size: 2.2rem;
    }

    .search-table tbody .tooltip-wrapper:has(.concurrency-value) .tooltip-text {
        top: 38px;
        right: 50%;
        left: unset;
        width: fit-content;
    }

    .search-table > thead > tr > th > .sort-arrow {
        display: none;
        width: 1.6rem;
        color: var(--dark-blue-color);
        vertical-align: sub;
        justify-content: center;
        font-size: 2.2rem;
        font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 200, 'opsz' 20;
        cursor: default;
    }

        .search-table > thead > tr.sort-desc > th > .sort-arrow {
            transform: rotate(180deg);
        }

        .search-table > thead > tr.sort-by-Text > th > .sort-arrow.text {
            display: inline-flex;
        }
    
        .search-table > thead > tr.sort-by-RequestCount > th > .sort-arrow.requestCount {
            display: inline-flex;
        }
    
        .search-table > thead > tr.sort-by-Trend > th > .sort-arrow.trend {
            display: inline-flex;
        }
        
        .search-table > thead > tr.sort-by-Cards > th > .sort-arrow.cards {
            display: inline-flex;
        }

        .search-table > thead > tr.sort-by-Concurrency > th > .sort-arrow.concurrency {
            display: inline-flex;
        }
        
@media (max-width: 1000px) {
    .search-table th:last-child .tooltip-text {
        left: unset;
        right: 0;
    }

    .search-table td:hover::before {
        display: none;
    }
}

@media (max-width: 840px) {
    .search-table :where(td, th) {
        padding-inline: 15px;
    }

    .search-table td {
        padding-top: 15px;
        padding-bottom: 10px;
    }
}

@media (max-width: 780px) {
    .search-table :where(td, th) {
        vertical-align: top;
    }

    .search-table :where(th, td):nth-child(4) {
        padding-right: 0;
    }

    .search-table .value, .search-table .concurrency-value {
        margin-top: 2px;
    }

    .search-table .mobile-hidden {
        display: none;
    }

    .search-table .desktop-hidden {
        display: inline-block;
    }

    .search-table th:nth-child(5) .tooltip-text {
        left: -165px;
    }
}

@media (max-width: 500px) {
    .search-table :where(td, th) {
        padding-inline: 6px;
    }

    .search-table :where(td, th):nth-child(2) {
        padding-inline: 0;
    }
    
    .search-table th:nth-child(5) .tooltip-text {
        left: -180px;
    }

    .search-table th:nth-child(1) .tooltip-text {
        left: -56px;
    }

    .search-table th:nth-child(3) .tooltip-text {
        left: -90px;
    }
}