/* wwwroot/css/fileviewer.css
   Theme-aware přes Bootstrap 5.3 proměnné (--bs-*), které se samy překlápí
   podle data-bs-theme="dark". Fallback hodnoty za čárkou jsou světlé, takže
   i kdyby proměnná chyběla, vždycky vyjde čitelná kombinace pozadí + textu.

   Pravidlo: nikde nenastavovat background bez color. Přesně tím vzniklo
   bílé písmo na bílém pozadí. */

.fv-page {
    --fv-max-h: 800px;
    --fv-bg: var(--bs-body-bg, #fff);
    --fv-fg: var(--bs-body-color, #212529);
    --fv-muted-bg: var(--bs-tertiary-bg, #f8f9fa);
    --fv-header-bg: var(--bs-secondary-bg, #e9ecef);
    --fv-border: var(--bs-border-color, #dee2e6);
    --fv-checker: rgba(0, 0, 0, .05);
    color: var(--fv-fg);
}

[data-bs-theme="dark"] .fv-page {
    --fv-checker: rgba(255, 255, 255, .06);
    /* dark scrollbary a nativní ovládací prvky uvnitř náhledu */
    color-scheme: dark;
}

/* --- text --------------------------------------------------------------- */

.fv-text {
    white-space: pre-wrap;
    word-break: break-word;
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    font-size: .875rem;
    max-height: var(--fv-max-h);
    overflow: auto;
    background-color: var(--fv-muted-bg);
    color: var(--fv-fg);
    border: 1px solid var(--fv-border);
    border-radius: .375rem;
    padding: .75rem 1rem;
}

/* --- obrázek ------------------------------------------------------------ */
/* Šachovnice v pozadí, aby byly vidět průhledné PNG/SVG v obou tématech. */

.fv-image {
    display: block;
    max-width: 100%;
    max-height: var(--fv-max-h);
    object-fit: contain;
    border: 1px solid var(--fv-border);
    border-radius: .375rem;
    background-color: var(--fv-bg);
    background-image: linear-gradient(45deg, var(--fv-checker) 25%, transparent 25%), linear-gradient(-45deg, var(--fv-checker) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--fv-checker) 75%), linear-gradient(-45deg, transparent 75%, var(--fv-checker) 75%);
    background-size: 16px 16px;
    background-position: 0 0, 0 8px, 8px -8px, -8px 0;
}

/* --- video / audio / pdf ------------------------------------------------ */

.fv-media {
    max-width: 100%;
    max-height: 600px;
    background-color: #000; /* letterbox u videa je černý záměrně, v obou tématech */
}

.fv-frame {
    width: 100%;
    height: var(--fv-max-h);
    border: 1px solid var(--fv-border);
    border-radius: .375rem;
    background-color: var(--fv-muted-bg);
    /* Vnitřek PDF prohlížeče si kreslí prohlížeč sám, ten téma aplikace nezná. */
}

.fv-host {
    max-height: var(--fv-max-h);
    overflow: auto;
    color: var(--fv-fg);
}

/* --- Word --------------------------------------------------------------- */

.fv-doc {
    background-color: var(--fv-bg);
    color: var(--fv-fg);
    border: 1px solid var(--fv-border);
    border-radius: .375rem;
    padding: 2rem 2.5rem;
    max-width: 60rem;
    line-height: 1.6;
}

    .fv-doc img {
        max-width: 100%;
        height: auto;
    }

    .fv-doc a {
        color: var(--bs-link-color, #0d6efd);
    }

    .fv-doc h1.fv-doc-title {
        font-size: 1.75rem;
    }

    .fv-doc p.fv-doc-subtitle {
        color: var(--bs-secondary-color, #6c757d);
    }

    .fv-doc table {
        width: auto;
        max-width: 100%;
        --bs-table-color: var(--fv-fg);
        --bs-table-bg: transparent;
        border-color: var(--fv-border);
    }

    .fv-doc hr {
        border-color: var(--fv-border);
        opacity: 1;
    }

/* Word umí vložit tvrdě nastavené barvy textu (bílý text na barevném pozadí
   v tabulce apod.). Mammoth většinu z nich zahazuje, ale kdyby něco proteklo
   a v dark theme zmizelo, odkomentuj tohle: */
/*
[data-bs-theme="dark"] .fv-doc [style*="color"] { color: var(--fv-fg) !important; }
*/

/* --- Excel / CSV -------------------------------------------------------- */

.fv-sheet-tabs {
    position: sticky;
    top: 0;
    z-index: 2;
    background-color: var(--fv-bg);
    border-bottom-color: var(--fv-border);
}

.fv-grid {
    font-size: .8125rem;
    white-space: nowrap;
    margin-bottom: 0;
    --bs-table-color: var(--fv-fg);
    --bs-table-bg: var(--fv-bg);
    --bs-table-border-color: var(--fv-border);
    color: var(--fv-fg);
    border-color: var(--fv-border);
}

    .fv-grid td,
    .fv-grid th {
        padding: .2rem .45rem;
        max-width: 32rem;
        overflow: hidden;
        text-overflow: ellipsis;
        border-color: var(--fv-border);
    }

    /* SheetJS nedělá <thead>, první řádek listu bereme jako hlavičku */
    .fv-grid tr:first-child td {
        position: sticky;
        top: 0;
        z-index: 1;
        background-color: var(--fv-header-bg);
        color: var(--fv-fg);
        font-weight: 600;
    }

/* Když jsou nad tabulkou záložky listů, hlavička se lepí pod ně */
.fv-sheet-tabs ~ .fv-sheet-panes .fv-grid tr:first-child td {
    top: 2.5rem;
}