/* check-list.css — ZAŠKRTÁVÁTKO a SEZNAM S VÍCENÁSOBNÝM VÝBĚREM.
   ⚓ VYDĚLENO z `components.css` 2026-09-05 (owner „OPRAV TO VŠE PODLE UI!").
   ⚠️ **DŮVOD JE TÝŽ, JAKÝ MÁ U SEBE ZAPSANÝ `data-table.css`:** admin `components.css`
   NENAČÍTÁ (kolidovalo by sedm jmen tříd, změřeno 2026-08-20), takže by si musel
   zaškrtávátko nakreslit sám — a tím by vznikla DALŠÍ kopie. ⚠️ Jedna už existuje:
   `mfr-form.css:39-42` (`.checkbox-row .check-box`) má tytéž deklarace pod jiným
   rodičem. ⛔ Tu jsem nesloučil — jsou to veřejné formuláře výrobce a je to samostatný
   úklid; ⚓ ale je to doklad, že se opsané zaškrtávátko množí.
   ⚓ **VÝBĚR NESE FAJFKA, ⛔ ne výplň řádku.** `.facet-row.on` dostává jen rozsvícený text;
   `--accent-dim` výplň má až `a.facet-row.on`, tedy JEDNOhodnotový navigační řádek.
   Rozlišení je záměrné: „jedna z N" = výplň, „víc z N" = zaškrtnutí.
   ⛔ Žádný rámeček kolem vybraného řádku (root CLAUDE.md §2).
   Konzumenti: `showroom.html` · `account.html` · `login.html` · `admin.html` ·
   `UI/app_UI.html` (§ Web — Checkboxes, § Web — Catalog). */

.check{display:inline-flex;align-items:center;gap:8px;cursor:pointer;user-select:none;color:var(--text-secondary);font-size:11px}
.check input[type="checkbox"]{display:none}
.check-box{width:14px;height:14px;flex-shrink:0;border:none;border-radius:3px;background:var(--bg-well);box-shadow:var(--well-shadow);display:flex;align-items:center;justify-content:center;transition:background .15s}
.check:hover .check-box{background:var(--bg-card-hover)}
.check-box svg{width:10px;height:10px;opacity:0;transition:opacity .15s}
.check input:checked+.check-box svg{opacity:1}
/* (b) Bare <input> for JS-generated rows (no span) — same look via data-URI SVG check */
.check-input{-webkit-appearance:none;appearance:none;margin:0;cursor:pointer;flex:0 0 auto;vertical-align:middle;width:14px;height:14px;border:none;border-radius:3px;background:var(--bg-well);box-shadow:var(--well-shadow);display:inline-flex;align-items:center;justify-content:center;transition:background .15s}
.check-input:hover{background:var(--bg-card-hover)}
/* gold check via mask so the color stays tokenised (--accent-active); SVG only defines the shape */
.check-input:checked::after{content:"";width:10px;height:10px;background-color:var(--accent-active);-webkit-mask:center/10px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.5L5 9L9.5 3.5' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");mask:center/10px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.5L5 9L9.5 3.5' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}

.facet{margin-bottom:22px}
.facet-title{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin:0 0 6px}
.facet-list{display:flex;flex-direction:column;gap:1px}
.facet-row{display:flex;align-items:center;gap:8px;padding:5px 8px;margin:0 -8px;border-radius:var(--radius-sm);font-size:11px;color:var(--text-secondary);cursor:pointer;user-select:none;text-decoration:none;transition:background .15s,color .15s}
.facet-row:hover{background:var(--bg-card-hover);color:var(--text-primary)}
.facet-row .lbl{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.facet-row .cnt{font-size:10px;color:var(--text-muted);font-variant-numeric:tabular-nums}
.facet-row.on{color:var(--text-primary)}
a.facet-row.on{background:var(--accent-dim);color:var(--accent-active)}
a.facet-row.on .cnt{color:var(--text-secondary)}