/* Rozmístění hlavičky a spodního řádku podle místa (core/layout-fit.js, nové rozvržení, spec 2026-10-30 § 2–5).
   Port CSS makety docs/mockups/2026-10-29-nove-rozvrzeni/page.html (mk- → uc-lf-). Platí jen pro prvky, které modul
   označil (.uc-lf-head, .uc-lf-row …), dnešní rozvržení nemění. Jen tmavé téma. */

/* Hlavička: zleva nápis, diváci, popup; akce vpravo. Nápis a verzi řídí JS podle kolize (ne kontejnerové dotazy). */
.uc-lf-head { position: relative; justify-content: flex-start; }
.uc-lf-head > .uc-lf-title { flex: none; }
.uc-lf-head .hdr-verbox { display: inline-flex; }
.uc-lf-head .hdr-name { display: inline; }
.uc-lf-head .uc-lf-viewers { flex: none; }
.uc-lf-head .uc-lf-actions { margin-left: auto; }
.uc-lf-row { position: relative; }
.uc-lf-hide { display: none !important; }
/* Duch mizejícího prvku (FLIP, polohu a rozměr nastaví JS inline); nesmí chytat myš ani tooltip. */
.uc-lf-ghost { pointer-events: none !important; }

/* Ikony zavřených lišt (trio / sloučená) samostatně uprostřed řádku — nahoře i dole. Posun do volného místa = translate. */
.uc-lf-status, .uc-lf-center { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; gap: 2px; z-index: 1; }
.uc-lf-status:empty, .uc-lf-center:empty { display: none; }
.uc-lf-status .uc-adm-btn, .uc-lf-center .uc-adm-btn { margin: 0 !important; }

/* Zhuštění po krocích (proměnné nastavuje JS): mezery, odsazení po stranách, odsazení tlačítek / pilulek. */
.uc-lf-head.uc-lf-tight { gap: var(--uc-lf-g) !important; padding-left: var(--uc-lf-s) !important; padding-right: var(--uc-lf-s) !important; }
.uc-lf-head.uc-lf-tight .uc-lf-actions { gap: calc(var(--uc-lf-g) / 3) !important; }
.uc-lf-head.uc-lf-tight :is(.uc-lf-actions > *, .uc-lf-pop) { padding-left: var(--uc-lf-b) !important; padding-right: var(--uc-lf-b) !important; }
.uc-lf-row.uc-lf-tight { gap: var(--uc-lf-g) !important; padding-left: var(--uc-lf-s) !important; padding-right: var(--uc-lf-s) !important; }
.uc-lf-row.uc-lf-tight > .tc-pill { padding-left: var(--uc-lf-b) !important; padding-right: var(--uc-lf-b) !important; gap: 3px; }
.uc-lf-row.uc-lf-tight > .uc-adm-btn ~ .uc-adm-btn { margin-left: 0 !important; }

/* Sloučená ikona: shluk 22×20 — 3 = dvě nahoře a jedna dole uprostřed, 2 = úhlopříčně; každá ve své barvě. */
.uc-lf-group { position: relative; }
.uc-lf-group[hidden] { display: none !important; }
.uc-lf-group.open { background: var(--bg-hover, #26262c); }
.uc-lf-stack { position: relative; display: block; width: 22px; height: 20px; }
.uc-lf-stack > svg { position: absolute; width: 11px; height: 11px; }
.uc-lf-stack.n3 > svg:nth-child(1) { left: 0; top: 0; }
.uc-lf-stack.n3 > svg:nth-child(2) { right: 0; top: 0; }
.uc-lf-stack.n3 > svg:nth-child(3) { left: 5.5px; bottom: 0; }
.uc-lf-stack.n2 > svg:nth-child(1) { left: 1px; top: 1px; }
.uc-lf-stack.n2 > svg:nth-child(2) { right: 1px; bottom: 1px; }
/* 4 zavřené lišty (s Proměnnými, 2026-11-08) = mřížka 2 × 2. */
.uc-lf-stack.n4 { height: 22px; }
.uc-lf-stack.n4 > svg { width: 10px; height: 10px; }
.uc-lf-stack.n4 > svg:nth-child(1) { left: 0; top: 0; }
.uc-lf-stack.n4 > svg:nth-child(2) { right: 0; top: 0; }
.uc-lf-stack.n4 > svg:nth-child(3) { left: 0; bottom: 0; }
.uc-lf-stack.n4 > svg:nth-child(4) { right: 0; bottom: 0; }

/* Nabídka sloučené ikony: jen ikony vedle sebe (název v tooltipu UC), tlačítka ve stylu UC. */
.uc-lf-gmenu { position: absolute; z-index: 50; display: flex; flex-direction: row; gap: 2px; padding: 4px; background: var(--bg-tertiary, #1f1f23); border: 1px solid var(--border, #2f2f35); border-radius: 9px; box-shadow: 0 12px 30px rgba(0, 0, 0, .6); }
.uc-lf-gmenu[hidden] { display: none; }
.uc-lf-gmenu .it { display: flex; align-items: center; justify-content: center; padding: 0; width: 32px; height: 32px; border-radius: 7px; border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; }
.uc-lf-gmenu .it:hover, .uc-lf-gmenu .it:focus-visible { background: var(--bg-hover, #26262c); outline: none; }
.uc-lf-gmenu .it svg { width: 18px; height: 18px; flex: none; }