/*
 * Session report (Pages/SessionReport.cshtml): readable on screen, laid out for an A4 PDF ("Print / PDF").
 * Plain CSS loaded by the page only: no Tailwind rebuild needed for its layout.
 */

.lv-report-cols {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
}

.lv-report-figures {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
    gap: 0.75rem;
}

.lv-report-figures .lv-stat {
    min-width: 0;
}

.lv-report-section-title {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--muted-foreground);
}

/* Lap and sector chips: the colors of the session dashboard (lv-time-best / improved / slower) */
.lv-report-chip {
    display: inline-block;
    border-radius: 0.25rem;
    padding: 0.0625rem 0.375rem;
}

.lv-report-laps td,
.lv-report-laps th {
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
    white-space: nowrap;
}

.lv-report-laps tr.lv-report-unclean td {
    color: var(--muted-foreground);
}

.lv-report-bar {
    height: 0.5rem;
    overflow: hidden;
    border-radius: 9999px;
    background: var(--muted);
}

.lv-report-bar > span {
    display: block;
    height: 100%;
    border-radius: 9999px;
    background: #f97316;
}

.lv-report-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.5rem;
    font-size: 0.75rem;
    color: var(--muted-foreground);
}

@media (min-width: 1024px) {
    .lv-report-cols {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@page {
    size: A4 portrait;
    margin: 12mm 10mm;
}

@media print {
    /* rem-based sizes shrink with the root: more content per page */
    html {
        font-size: 12px;
    }

    html, body {
        background: #fff !important;
    }

    /* Keep the colors of the chips, bars and charts */
    #report, #report * {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    /* Block layout: Chrome splits flex containers badly across pages */
    #report.lv-page {
        display: block;
        padding: 0;
    }

    #report.lv-page > * + * {
        margin-top: 0.75rem;
    }

    #report .lv-report-breakable,
    #report .lv-report-breakable > :not(.kt-card-header) {
        display: block;
        height: auto !important;
        max-height: none !important;
    }

    #report .lv-report-breakable table {
        width: 100%;
    }

    #report .kt-card {
        border-color: #e4e4e7;
    }

    /* The A4 width is below the lg breakpoint: two columns all the same */
    .lv-report-cols {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.75rem;
    }

    .lv-report-figures {
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 0.5rem;
    }

    .lv-report-figures .lv-stat {
        padding: 0.5rem 0.625rem;
    }

    /* Scroll containers and clipped cards would cut the rows that move to the next page */
    #report .kt-card,
    #report .kt-card-table,
    #report .kt-scrollable-x-auto {
        overflow: visible !important;
    }

    /* Long tables continue on the next page, their header repeated */
    #report .lv-report-breakable {
        break-inside: auto;
    }

    #report thead {
        display: table-header-group;
    }

    #report tr {
        break-inside: avoid;
    }

    .lv-report-page-break {
        break-before: page;
    }

    .lv-report-footer {
        position: static;
    }
}