/******************************************************************************
 *
 * HoFi Billard
 * Bordfordelingsanalyse v1.1
 *
 ******************************************************************************/

.statistics-tables-page {

    max-width: 1100px;
    margin: 0 auto;

}


/******************************************************************************
 * Filter
 ******************************************************************************/

.statistics-filter-card {

    margin-bottom: 24px;

}

.statistics-filter-form {

    display: flex;
    gap: 24px;
    align-items: end;
    flex-wrap: wrap;

}

.statistics-filter-field {

    display: flex;
    flex-direction: column;
    gap: 7px;

}

.statistics-filter-field label {

    font-weight: 600;
    color: var(--text);

}

.statistics-filter-field select {

    min-width: 240px;

}


/******************************************************************************
 * Summary
 ******************************************************************************/

.analysis-summary {

    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 24px;

}

.analysis-summary-card {

    padding: 20px;

}

.analysis-summary-label {

    color: var(--text-muted);
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;

}

.analysis-summary-value {

    margin-top: 6px;
    font-size: 30px;
    font-weight: 700;

}

.analysis-ok {

    color: var(--success);

}

.analysis-warning {

    color: var(--warning);

}


/******************************************************************************
 * Heading
 ******************************************************************************/

.analysis-heading {

    margin: 24px 0 14px;

}

.analysis-heading h2 {

    margin: 0;

}

.analysis-heading p {

    margin: 4px 0 0;
    color: var(--text-muted);

}


/******************************************************************************
 * Table
 ******************************************************************************/

.table-analysis-card {

    padding: 0;
    overflow: hidden;

}

.table-analysis-scroll {

    overflow-x: auto;

}

.table-analysis {

    width: 100%;
    border-collapse: collapse;

}

.table-analysis th,
.table-analysis td {

    padding: 14px 16px;
    border-bottom: 1px solid var(--border);
    text-align: center;

}

.table-analysis th {

    background: var(--surface-light);
    color: var(--text-muted);
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;

}

.table-analysis th:first-child,
.table-analysis td:first-child {

    text-align: left;

}

.table-analysis tbody tr:last-child td {

    border-bottom: 0;

}

.table-analysis tbody tr:hover {

    background: rgba(255,255,255,.035);

}

.team-name {

    font-weight: 650;

}

.matches {

    font-weight: 700;

}


/******************************************************************************
 * Rating
 ******************************************************************************/

.distribution-rating {

    display: inline-block;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;

}

.distribution-rating.excellent {

    background: rgba(67,160,71,.18);
    color: #75d27a;

}

.distribution-rating.good {

    background: rgba(41,182,246,.16);
    color: #66c9f5;

}

.distribution-rating.warning {

    background: rgba(249,168,37,.18);
    color: #ffbd45;

}


/******************************************************************************
 * Explanation / Empty
 ******************************************************************************/

.analysis-explanation {

    margin-top: 20px;
    padding: 20px 22px;

}

.analysis-explanation h3 {

    margin-top: 0;

}

.analysis-explanation p {

    color: var(--text-light);
    line-height: 1.55;

}

.analysis-empty {

    padding: 36px;
    text-align: center;
    color: var(--text-muted);

}

.analysis-empty i {

    display: block;
    margin-bottom: 12px;
    font-size: 34px;

}


/******************************************************************************
 * Print / deling
 ******************************************************************************/

@media print {

    .site-header,
    .site-menu,
    .site-footer,
    .back-link,
    .statistics-filter-card {

        display: none !important;

    }

    .statistics-tables-page {

        max-width: none;

    }

    .card {

        box-shadow: none !important;

    }

}


/******************************************************************************
 * Mobile
 ******************************************************************************/

@media (max-width: 700px) {

    .analysis-summary {

        grid-template-columns: 1fr;

    }

    .statistics-filter-form {

        display: block;

    }

    .statistics-filter-field {

        margin-bottom: 14px;

    }

    .statistics-filter-field select {

        width: 100%;
        min-width: 0;

    }

    .table-analysis th,
    .table-analysis td {

        padding: 11px 12px;

    }

}


/******************************************************************************
 * v1.1 - Primære borde
 ******************************************************************************/

.analysis-primary-tables {

    margin: -4px 0 18px;
    padding: 10px 14px;

    border: 1px solid var(--border);
    border-radius: 8px;

    color: var(--text-light);
    background: var(--surface-light);

    font-size: 14px;

}

.analysis-primary-tables strong {

    color: var(--text);

}

.analysis-primary-tables span {

    color: var(--text-muted);

}

@media print {

    .analysis-primary-tables {

        border-color: #d7e0e8;
        background: transparent;

    }

}