/* Rozložení administrátorských seznamů (/Admin/Users, /Admin/Transactions, /Admin/GameStats).

   Psáno MOBILE-FIRST (jako site.css): výchozí = kartové zobrazení, od 1200 px = tabulka.
   Jedno HTML (semantická <table> s data-label na buňkách) se vykresluje dvěma způsoby:
     • úzká plocha (telefon, monitor na výšku)  → každý řádek je KARTA s popiskami polí,
       karty se skládají do mřížky podle šířky (telefon 1 sloupec, 1080px na výšku 2–3 sloupce);
     • široká plocha (1920, 3440 ultrawide)     → klasická tabulka s lepivou hlavičkou.
   Díky tomu jsou na každém zařízení vidět VŠECHNY údaje – nic se neschovává.

   Řazení: v tabulkovém režimu klikem na hlavičku sloupce, v kartovém režimu lištou .admin-sortbar
   (v tabulkovém režimu je skrytá, aby se ovládání nezdvojovalo). */

/* Kontejner administrace: na širokém monitoru potřebuje víc než 1550 px, na které MainLayout omezuje
   .container. Rozšiřuje se proto PŘÍMO ten kontejner (přes :has), NE vystoupením z něj posunem/transformem —
   to sice vypadá stejně, ale obsah pak přetéká mimo rodiče (main i .container hlásily ~430 px přesahu),
   což prohlížeči dává důvod vykreslit vodorovný posuvník. Takhle nic nikde nepřetéká. */
.container:has(.admin-page) {
    max-width: 2400px;
}

.admin-page {
    width: 100%;
    padding-inline: 12px;
}

/* ---------- Výchozí (kartový) režim ---------- */

/* Rámec tabulky ZÁMĚRNĚ nemá vodorovný posuv: tabulka se do něj vždy vejde (v kartovém režimu z podstaty,
   v tabulkovém díky table-layout: fixed a procentním šířkám sloupců). Bez tohoto pravidla stačí přetečení
   o zlomek pixelu (zaokrouhlení procent při zlomkové šířce stránky) a prohlížeč pod tabulkou vykreslí
   vodorovný posuvník – proužek, který vypadá jako rozbitá čára. `clip` posuvník nikdy nevytvoří. */
.admin-table-wrap {
    overflow-x: clip;
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
}

/* Prvky tabulky se v kartovém režimu chovají jako bloky. */
.admin-table,
.admin-table tbody,
.admin-table tr,
.admin-table td {
    display: block;
}

/* Hlavička tabulky nese v kartovém režimu jen popisky, které jsou už u buněk (data-label). */
.admin-table thead {
    display: none;
}

/* Karty se skládají do mřížky: kolik se jich vejde vedle sebe, tolik jich bude. */
.admin-table tbody {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 12px;
    align-items: start;
}

.admin-table tbody tr {
    border: 1px solid #dee2e6;
    border-radius: 8px;
    background-color: #fff;
    padding: 8px 12px;
}

/* Buňka karty = popisek vlevo, hodnota vpravo. */
.admin-table tbody td {
    display: grid;
    grid-template-columns: minmax(92px, 38%) 1fr;
    gap: 8px;
    align-items: center;
    padding: 5px 0;
    border-top: 1px solid #f1f3f5;
    min-width: 0;
    overflow-wrap: anywhere;
}

.admin-table tbody td::before {
    content: attr(data-label);
    color: #6c757d;
    font-size: 0.85rem;
}

/* První buňka je nadpis karty (přezdívka / datum) – přes celou šířku, bez popisku. */
.admin-table tbody td:first-child {
    grid-template-columns: 1fr;
    border-top: 0;
    font-weight: 700;
    font-size: 1.05rem;
    padding-top: 2px;
}

.admin-table tbody td:first-child::before {
    display: none;
}

/* Herní statistiky: první buňka je „Hráč A" – rovnocenná s „Hráč B" v řádku pod ní, ne nadpis karty.
   Proto se v kartovém režimu (úzká plocha) zobrazuje jako běžné pole s popiskem „Hráč A", stejně jako
   ostatní údaje. Guardováno max-width, aby to neovlivnilo tabulkový režim (tam popisky nese hlavička). */
@media (max-width: 1199.98px) {
    .admin-table--games tbody td:first-child {
        grid-template-columns: minmax(92px, 38%) 1fr;
        border-top: 0;
        font-weight: 400;
        font-size: inherit;
        padding-top: 5px;
    }

    .admin-table--games tbody td:first-child::before {
        display: block;
    }
}

/* Lišta řazení pro kartový režim. */
.admin-sortbar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin-bottom: 12px;
}

.admin-sortbar .form-select {
    max-width: 260px;
}

/* Volba počtu položek na stránku – viditelná v obou režimech (na rozdíl od lišty řazení). */
.admin-pagesize {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 12px;
}

.admin-pagesize .form-select {
    width: auto;
}

/* ---------- Tabulkový režim (široká plocha) ---------- */
@media (min-width: 1200px) {
    .admin-sortbar {
        display: none;
    }

    .admin-table {
        display: table;
        /* Pevné rozložení: šířky sloupců určuje CSS níže, ne délka obsahu (jinak si dlouhý e-mail
           urve celý sloupec a ostatní se zmáčknou do několikařádkových „sloupečků"). */
        table-layout: fixed;
    }

    /* Šířky sloupců (součet 100 %) – /Admin/Users. */
    .admin-table--users th:nth-child(1) { width: 10%; }
    .admin-table--users th:nth-child(2) { width: 15%; }
    .admin-table--users th:nth-child(3) { width: 6%; }
    .admin-table--users th:nth-child(4) { width: 9%; }
    .admin-table--users th:nth-child(5) { width: 9%; }
    .admin-table--users th:nth-child(6) { width: 4%; }
    .admin-table--users th:nth-child(7) { width: 11%; }
    .admin-table--users th:nth-child(8) { width: 11%; }
    .admin-table--users th:nth-child(9) { width: 13%; }
    .admin-table--users th:nth-child(10) { width: 12%; }

    /* Šířky sloupců – /Admin/Transactions. */
    .admin-table--tx th:nth-child(1) { width: 12%; }
    .admin-table--tx th:nth-child(2) { width: 18%; }
    .admin-table--tx th:nth-child(3) { width: 18%; }
    .admin-table--tx th:nth-child(4) { width: 7%; }
    .admin-table--tx th:nth-child(5) { width: 12%; }
    .admin-table--tx th:nth-child(6) { width: 11%; }
    .admin-table--tx th:nth-child(7) { width: 22%; }

    /* Šířky sloupců – /Admin/GameStats. */
    .admin-table--games th:nth-child(1) { width: 15%; }
    .admin-table--games th:nth-child(2) { width: 15%; }
    .admin-table--games th:nth-child(3) { width: 13%; }
    .admin-table--games th:nth-child(4) { width: 9%; }
    .admin-table--games th:nth-child(5) { width: 15%; }
    .admin-table--games th:nth-child(6) { width: 17%; }
    .admin-table--games th:nth-child(7) { width: 16%; }

    .admin-table thead {
        display: table-header-group;
    }

    .admin-table tbody {
        display: table-row-group;
    }

    .admin-table tr {
        display: table-row;
    }

    .admin-table thead th,
    .admin-table tbody td {
        display: table-cell;
        padding: 8px 10px;
        border: 0;
        border-bottom: 1px solid #e9ecef;
        vertical-align: middle;
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .admin-table tbody tr {
        border: 0;
        border-radius: 0;
        padding: 0;
    }

    .admin-table tbody tr:nth-child(even) {
        background-color: #fbfcfd;
    }

    .admin-table tbody td::before {
        display: none;
    }

    .admin-table tbody td:first-child {
        font-weight: 600;
        font-size: inherit;
    }

    /* Herní statistiky: první sloupec (Hráč A) NENÍ nadpisový sloupec – váhu písma řídí až
       zvýraznění vedoucího hráče (.fw-bold), aby neveducí „Hráč A" nebyl polotučný. */
    .admin-table--games tbody td:first-child {
        font-weight: 400;
    }

    /* Hlavička zůstane vidět i při dlouhém seznamu. */
    .admin-table thead th {
        position: sticky;
        top: 0;
        z-index: 2;
        background-color: #f8f9fa;
        border-bottom: 2px solid #dee2e6;
        text-align: left;
    }
}

/* Kompaktní ovládací prvky uvnitř buněk (platí v obou režimech). */
.admin-table .btn-cell {
    padding: 0.1rem 0.4rem;
    font-size: 0.8rem;
    line-height: 1.25;
    white-space: nowrap;
}

.admin-table .cell-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.admin-table .cell-inline {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
}

.admin-table .cell-credits-input {
    width: 90px;
}

.admin-table .cell-sub {
    color: #6c757d;
    font-size: 0.82em;
}