.fisch-trainer-stats {
    --fisch-trainer-blue: #0878a6;
    --fisch-trainer-border: #d2d7da;
    margin: 1.5rem 0;
}

.fisch-trainer-stats__filter {
    display: grid;
    max-width: 32rem;
    gap: .35rem;
    margin: 1rem 0;
    font-weight: 700;
}

.fisch-trainer-stats__filter input,
.fisch-trainer-stats__actions input {
    min-height: 42px;
}
.fisch-trainer-stats__filters { display: flex; flex-wrap: wrap; align-items: end; gap: .75rem; margin-bottom: 1rem; }
.fisch-trainer-stats__filters label { display: grid; gap: .25rem; width: min(100%, 190px); }
.fisch-trainer-stats__filters input, .fisch-trainer-stats__filters select { width: 100%; min-height: 40px; }
.fisch-trainer-stats__filters select[multiple] { height: 80px; }
.fisch-trainer-stats__pagination { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; margin: 1rem 0; }
.fisch-trainer-stats__pagination label { display: flex; align-items: center; gap: .5rem; }
.fisch-trainer-stats th button { border: 0; padding: .2rem; background: transparent; color: inherit; font-weight: 700; cursor: pointer; }
.fisch-trainer-stats th[aria-sort="ascending"] button::after { content: ' ↑'; }
.fisch-trainer-stats th[aria-sort="descending"] button::after { content: ' ↓'; }
.fisch-trainer-progress details { padding: .4rem .5rem; border-left: 2px solid #d2d7da; margin: .35rem 0; }
.fisch-trainer-progress summary { cursor: pointer; }
.fisch-trainer-progress ul { margin: .5rem 0 .5rem 1.5rem; }
.fisch-trainer-stats tr[hidden] { display: none !important; }
.fisch-trainer-stats [data-fisch-progress] { display: block; margin-top: .4rem; }

.fisch-trainer-stats__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: .65rem;
    margin-bottom: 1rem;
}

.fisch-trainer-stats__actions label {
    display: grid;
    gap: .2rem;
}

.fisch-trainer-stats__table-wrap {
    overflow-x: auto;
    border: 1px solid var(--fisch-trainer-border);
}

.fisch-trainer-stats table {
    width: 100%;
    min-width: 1080px;
    margin: 0;
    border-collapse: collapse;
    background: #fff;
}

.fisch-trainer-stats th,
.fisch-trainer-stats td {
    padding: .65rem;
    border-bottom: 1px solid var(--fisch-trainer-border);
    text-align: left;
    vertical-align: top;
}

.fisch-trainer-stats th {
    background: #edf6fa;
    color: #173d4d;
    white-space: nowrap;
}

.fisch-trainer-stats progress {
    display: block;
    width: 9rem;
    margin-top: .3rem;
    accent-color: var(--fisch-trainer-blue);
}

.fisch-trainer-stats__notice,
.fisch-trainer-stats__denied {
    padding: .85rem 1rem;
    border-left: 4px solid var(--fisch-trainer-blue);
    background: #edf6fa;
}

.fisch-certificate-output {
    margin-top: 2rem;
}

.fisch-certificate {
    box-sizing: border-box;
    max-width: 900px;
    min-height: 1120px;
    margin: 2rem auto;
    padding: 2.5rem;
    border: 1px solid #aaa;
    background: #fff;
    color: #111;
}

.fisch-certificate img {
    max-width: 100%;
    height: auto;
}

.fisch-intro-tour {
    position: fixed;
    z-index: 100000;
    inset: 0;
}

.fisch-intro-tour__backdrop {
    position: absolute;
    inset: 0;
    background: rgb(0 0 0 / 58%);
}

.fisch-intro-tour__dialog {
    position: absolute;
    left: 50%;
    bottom: 2rem;
    width: min(92vw, 520px);
    padding: 1.4rem;
    transform: translateX(-50%);
    border: 4px solid #0878a6;
    border-radius: .45rem;
    background: #fff;
    box-shadow: 0 1rem 3rem rgb(0 0 0 / 35%);
}

.fisch-intro-tour__close {
    position: absolute;
    top: .35rem;
    right: .55rem;
    border: 0;
    background: transparent;
    font-size: 2rem;
    cursor: pointer;
}

.fisch-intro-tour__counter {
    color: #5f666a;
    font-weight: 700;
}

.fisch-intro-tour__actions {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1rem;
}

.fisch-intro-tour__target {
    position: relative !important;
    z-index: 100001 !important;
    outline: 5px solid #f5b43c !important;
    outline-offset: 4px;
}

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

@media print {
    body * {
        visibility: hidden !important;
    }

    .fisch-certificate-output,
    .fisch-certificate-output * {
        visibility: visible !important;
    }

    .fisch-certificate-output {
        position: absolute;
        inset: 0;
    }

    .fisch-certificate-print {
        display: none !important;
    }

    .fisch-certificate {
        min-height: auto;
        margin: 0;
        padding: 0;
        border: 0;
        page-break-after: always;
    }

    .fisch-certificate:last-child {
        page-break-after: auto;
    }
}
