/* ==== BASE =============================================================== */
:root{
  --bg:#f6f7f9; --card:#ffffff; --ink:#0f172a; --muted:#6b7280; --line:#e5e7eb;
  --brand:#111827; --ring:#11182733; --err:#ef4444; --ok:#16a34a;
  --radius:16px; --shadow:0 2px 10px rgba(0,0,0,.06);
  --g-card-h: 260px;     /* celková výška dlaždice */
  --g-viewport-h: 160px; /* okno pro náhled obrázku */

  /* Buttons */
  --btn-h: 36px;
  --btn-pad-x: 12px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial}
.container{max-width:1120px;margin:0 auto;padding:24px}
main{min-height:calc(100vh - 120px)}

/* Topbar & footer */
.topbar{position:sticky;top:0;z-index:10;background:#fff;backdrop-filter:saturate(1.1) blur(6px);border-bottom:1px solid var(--line)}
.topbar .brand{font-weight:800;padding:12px 16px;display:flex;align-items:center;gap:12px}
.topbar nav{display:flex;gap:8px;align-items:center;padding:12px 16px}
.topbar a{padding:8px 12px;border-radius:12px;color:var(--ink);text-decoration:none}
.topbar a:hover{background:#f3f4f6}
.topbar .right{margin-left:auto;display:flex;align-items:center;gap:8px}
/* aktivní záložka v topbaru */
.topbar a.active,
.topbar a[aria-current="page"]{
  background:#e5edff;     /* jemné zvýraznění */
  font-weight:600;
}


.footer{border-top:1px solid var(--line);padding:16px;color:var(--muted);text-align:center;background:#fff}
.footer{ position:relative }
.footer::before{content:none;}

/* Cards */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.card .head{padding:16px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}
.card .body{padding:16px}
.card + .card{margin-top:12px} /* rytmus mezi kartami */

/* ==== Jednotné Buttony =============================== */
.btn,
a.btn,
button.btn,
input[type="button"].btn,
input[type="submit"].btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  height:var(--btn-h); padding:0 var(--btn-pad-x); line-height:1; box-sizing:border-box;
  border-radius:12px; border:1px solid var(--brand);
  background:var(--brand); color:#fff; cursor:pointer; text-decoration:none;
}
.btn:hover, a.btn:hover{ text-decoration:none }
.btn:focus{ outline:3px solid var(--ring); outline-offset:2px }

/* Varianty */
.btn.primary{ background:var(--brand); color:#fff; border-color:var(--brand) }  /* Upravit */
.btn.secondary{ background:#fff; color:var(--brand); border:1px solid var(--line) } /* Tisk štítku */
.btn.link{
  background:transparent; border-color:transparent; color:var(--brand);
}
.btn.link:hover{ background:#f3f4f6 }
.btn.ghost{ background:transparent; color:var(--brand); border-color:transparent }
.btn.alt{ background:#1118270d; color:#111827; border-color:var(--line) }

/* Velikosti */
.btn.s{   --btn-h:32px; --btn-pad-x:10px; border-radius:10px }
.btn.xxs{ --btn-h:28px; --btn-pad-x: 8px; border-radius: 8px; font-size:12px }
.btn, .btn.primary, .btn.secondary, .btn.link{
  min-height:36px; line-height:1; padding:8px 12px;
}

/* Disabled stav pro tlačítka */
.btn:disabled,
.btn[disabled]{
  background: #e5e7eb !important;    /* šedé pozadí */
  border-color: #e5e7eb !important;
  color: #94a3b8 !important;          /* šedý text */
  cursor: not-allowed;
  box-shadow: none;
  opacity: 1;                         /* nechceme průhlednost, měníme barvy */
  pointer-events: none;               /* pro jistotu */
}

/* Přepiš „danger“ i v disabled stavu */
.btn.danger:disabled,
.btn.danger[disabled]{
  background: #e5e7eb !important;
  border-color: #e5e7eb !important;
  color: #94a3b8 !important;
}

/* zruš hover efekty na disabled */
.btn:disabled:hover,
.btn.danger:disabled:hover{
  filter: none;
}


/* Forms */
.input, select.input, textarea.input{width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:#fff;outline:none}
.input:focus, select.input:focus, textarea.input:focus{box-shadow:0 0 0 4px var(--ring)}
textarea.input{resize:vertical;min-height:120px}
label{display:block;font-size:13px;color:#111827;font-weight:600;margin-bottom:6px}
.field{display:flex;flex-direction:column;margin-bottom:14px}
.help{font-size:12px;color:var(--muted);margin-top:6px}

/* Flash */
.flash{padding:10px 12px;border-radius:12px;margin:10px 0}
.flash.ok{background:#ecfdf5;color:#065f46;border:1px solid #a7f3d0}
.flash.err{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}

/* Tables */
.grid{display:grid;gap:16px}
.grid-2{grid-template-columns:1fr}
.grid-3{grid-template-columns:1fr}
@media(min-width:960px){.grid-2{grid-template-columns:1fr 1fr}.grid-3{grid-template-columns:1fr 1fr 1fr}}
.table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.table th,.table td{text-align:left;padding:12px;border-bottom:1px solid var(--line)}
.table th{color:#6b7280;font-weight:600}
.table tr:hover td{background:#fafafa}

/* Chips */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{padding:6px 10px;border-radius:999px;border:1px solid var(--line);background:#f3f4f6;font-size:12px;color:#374151;font-weight:600}
.chip.active{background:var(--brand);color:#fff;border-color:var(--brand)}

/* barevné varianty pro detail */
.chip--sale{background:#fef2f2;border-color:#fecaca;color:#991b1b}
.chip--hint{background:#eef2ff;border-color:#c7d2fe;color:#3730a3}
.chip--new{ background:#ecfeff;border-color:#a5f3fc;color:#155e75}

/* jemnější look v hlavičce */
.chip.chip--soft{
  background:#f7f7f8; border-color:#ececec; color:#334155;
  padding:4px 8px; font-weight:600;
}

/* Utils */
.img-preview{max-height:220px;width:100%;object-fit:contain;border:1px solid var(--line);border-radius:12px;margin-top:8px}
h1{font-size:22px;margin:16px 0 12px 0}
.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#f3f4f6;border:1px solid var(--line);color:#374151;font-size:12px}
.mt-2{margin-top:8px}.mt-3{margin-top:12px}.mr-2{margin-right:8px}
.center{display:flex;align-items:center;justify-content:center}
.hidden{display:none}
.muted{color:var(--muted)}
.mono{font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace}
.strike{text-decoration:line-through;color:#6b7280;margin-left:6px}
.save-badge{margin-left:8px;padding:2px 8px;border-radius:999px;background:#ecfdf5;color:#065f46;font-size:12px}

/* ==== GALLERY INPUTS (form) ============================================= */
.filewrap{position:relative; display:inline-block;}
.filewrap input[type="file"]{position:absolute; inset:0; opacity:0; cursor:pointer; width:100%; height:100%;}
.filewrap .filebtn{display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:12px; background:#fff; border:1px solid var(--line); font-size:13px;}
.filewrap .filebtns{display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:12px; color:#fff;background:#f10202; border:1px solid var(--line); font-size:13px;}
.filewrap .filebtn:hover{background:#f9fafb}
.primary-pill{display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:999px; border:1px solid var(--line); background:#fff; font-size:12px}
.primary-pill.is-disabled{opacity:.5; pointer-events:none}
.btn.danger{background:#b91c1c; border-color:#b91c1c}


.g-grid{
  display:grid;
  gap:12px;
  grid-template-columns:repeat(2, minmax(0,1fr));
  grid-auto-rows: var(--g-card-h);    /* <<< stejná výška všech řádků */
}
@media (min-width:900px){
  .g-grid{ grid-template-columns:repeat(4, minmax(0,1fr)); }
}

.g-grid > *{ height:100%; min-width:0; }  /* natáhne .g-card i .add-card na výšku řádku */

.g-card{
  display:flex; flex-direction:column;
}
.g-viewport{
  flex:1 1 auto; height:var(--g-viewport-h); /* náhled vyplní zbytek */
}



label:has(#catInput) { position: relative; } /* pokud nechceš :has, dej na label class="cat-wrap" a použij .cat-wrap */
#catSug {
  position: absolute; left: 0; right: 0; top: 100%;
  z-index: 10; background: #fff; border: 1px solid #ddd;
  border-radius: 6px; box-shadow: 0 8px 24px rgba(0,0,0,.08);
  margin-top: 4px; max-height: 220px; overflow: auto;
}
#catSug[hidden] { display: none; }
#catSug [role="option"].is-active { background: #f5f5f7; }



.g-card{border:1px dashed var(--line); border-radius:12px; padding:10px; background:#fff; position:relative}
.g-viewport{border:1px solid var(--line); border-radius:10px; height:160px; display:flex; align-items:center; justify-content:center; background:#fafafa; overflow:hidden}
.g-viewport img.g-prev{max-width:100%; max-height:100%; object-fit:contain; display:block}
.g-viewport .g-empty{color:#6b7280; font-size:13px}
.g-actions{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:8px}
.add-card{display:flex; align-items:center; justify-content:center; gap:8px; border:2px dashed var(--line); border-radius:12px; background:#fff/*; min-height:120px*/}

/* ==== SUGGEST & LIGHTBOX ================================================= */
.suggest{position:relative}
.suggest .item-list{position:absolute;z-index:20;left:0;right:0;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);margin-top:6px;overflow:hidden}
.suggest .item{padding:8px 12px;cursor:pointer}
.suggest .item:hover{background:#f9fafb}

.lb{
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(0,0,0,.85);
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
}
.lb__img{
  max-width: min(96vw, 1400px);
  max-height: 92vh;
  border-radius: 8px;
  box-shadow: 0 8px 30px rgba(0,0,0,.4);
}
.lb__close, .lb__prev, .lb__next{
  position: absolute; border: 0; cursor: pointer;
  width: 48px; height: 48px; border-radius: 50%;
  background: #fff; color: #111; font-size: 26px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 10px rgba(0,0,0,.25);
}
.lb__close{ top:16px; right:16px; }
.lb__prev{ left:16px; top:50%; transform:translateY(-50%); }
.lb__next{ right:16px; top:50%; transform:translateY(-50%); }
.lb__close:hover, .lb__prev:hover, .lb__next:hover{ filter:brightness(.9); }


.lb[hidden]{ display: none !important; }
/* ==== PRODUCT DETAIL ===================================================== */

/* Akce nahoře */
.pd-actions{display:flex;gap:8px;justify-content:flex-end;margin:-8px 0 8px}

/* INFO-KARTA */
.info-card .info-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  column-gap:32px;
  row-gap:16px;
}
@media(max-width:1100px){
  .info-card .info-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.info-card .info-grid > div{padding:8px 4px;border-radius:10px}
.info-card .wide{grid-column:1 / -1}

.info-card .k{
  color:#1f2937; font-weight:700; font-size:13px; letter-spacing:.1px; line-height:1.25;
}
.info-card .v{
  font-weight:800; font-size:16px; line-height:1.35;
}


/* DVOU-SLOUPEC*/
.two-col{display:grid;grid-template-columns:1fr;gap:28px}
@media(min-width:1100px){.two-col{grid-template-columns:1fr 1fr}}

.media-square{
  aspect-ratio:1/1; width:100%; max-width:500px;
  border:1px solid var(--line); border-radius:16px; background:#fff;
  overflow:hidden; display:flex; align-items:center; justify-content:center;
  min-height:280px;
}
.media-square img{width:100%;height:100%;object-fit:cover;border-radius:12px}
.media-square.fit-contain img{object-fit:contain}
.media-square .empty{color:var(--muted);font-style:italic}

.desc h3{margin:0 0 10px}
.desc .muted{margin-bottom:8px}

/* GALERIE  */
.media-strip{display:flex;gap:12px;overflow-x:auto;padding:4px 2px}
.media-strip .thumb{flex:0 0 auto;border:none;background:transparent;padding:0;cursor:pointer}
.media-strip .thumb img{width:120px;height:120px;object-fit:cover;border-radius:12px;border:1px solid var(--line)}


.longtext[data-collapsed="true"]{
  display:none;              
  max-height:none;
  mask-image:none;
}
.longtext[data-collapsed="false"]{
  display:block;
}

/* ==== PRINT (štítky) ===================================================== */
@media print{
  body{background:#fff}
  .noprint{display:none !important}
  @page{size:50mm 25mm;margin:0}
  .label-sheet{display:grid;grid-template-columns:1fr 1fr;gap:2mm;padding:0}
  .label{width:50mm;height:25mm;box-sizing:border-box;padding:2mm 2.5mm;display:flex;flex-direction:column;justify-content:center}
  .label .code{font:700 10pt/1 system-ui}
  .label .ean{font:500 8pt/1 system-ui;color:#111}
  .barcode{margin-top:2mm;height:10mm;border:1px dashed #bbb;display:flex;align-items:center;justify-content:center;font:600 7pt/1 system-ui;color:#777}
}


/* ===== Product grid ===== */
.product-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:24px}
@media(max-width:1200px){.product-grid{grid-template-columns:1fr}}
.media-col{position:sticky;top:96px;height:fit-content}
.media-hero.square{aspect-ratio:1/1;border:1px solid var(--line);border-radius:16px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden}
.media-hero.square img{width:100%;height:100%;object-fit:contain}
.media-hero .empty{color:var(--muted)}
.thumbs{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.thumbs .thumb{border:none;background:transparent;padding:0;cursor:pointer}
.thumbs img{width:88px;height:88px;object-fit:cover;border:1px solid var(--line);border-radius:10px}
.thumbs .thumb:focus img{outline:3px solid var(--ring);outline-offset:2px}

/* ===== Header stack / price / meta (původní) ===== */
.header-stack{display:flex;flex-direction:column;gap:16px}
.title-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.product-title{margin:0;font-size:22px;font-weight:700}
.price-block{display:flex;align-items:center;gap:8px}
.price-main{font-size:26px;font-weight:800}
.price-was{color:#6b7280;text-decoration:line-through}
.status-block .badge{padding:6px 10px;border-radius:999px;border:1px solid var(--line);font-weight:700}
.badge--ok{background:#ecfdf5;color:#065f46;border-color:#a7f3d0}
.badge--warn{background:#fff7ed;color:#9a3412;border-color:#fed7aa}
.quick-row{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:flex-start}
.warehouse-block{display:flex;align-items:center;gap:6px}
.meta-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 16px}
@media(max-width:900px){.meta-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.meta-grid dt{color:#1f2937;font-weight:700;font-size:13px}
.meta-grid dd{margin:0;font-weight:800}

/* ===== CTA row ===== */
.cta-row{display:flex;gap:8px;flex-wrap:wrap}

/* ===== Tabs ===== */
.tabs{display:flex;gap:8px;border-bottom:1px solid var(--line)}
.tab{border:none;background:transparent;padding:10px 12px;border-radius:10px 10px 0 0;cursor:pointer}
.tab.is-active{background:#fff;border:1px solid var(--line);border-bottom-color:#fff}
.tabpanes{padding-top:12px}
.pane{display:none}
.pane.is-active{display:block}

/* Galerie v tabu */
.gal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.gal-grid .gal-cell{border:none;background:transparent;padding:0;cursor:pointer}
.gal-grid img{width:100%;height:140px;object-fit:cover;border:1px solid var(--line);border-radius:12px}

/* ===== Modal ===== */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:50}
.modal.hide{display:none}
.modal__card{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);width:min(640px,92vw)}
.modal__head{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line)}
.modal__body{padding:16px}

/* ===== A11y ===== */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* === PATCH: Product detail – sticky actions ============================= */
.pd .actionbar{
  position: sticky;
  top: calc(56px + 8px);
  z-index: 15;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin: 8px 0 16px;
}
.pd .actionbar__title{ display:none }
.pd .actionbar__actions{ display:flex; gap:8px; align-items:center }

@media (max-width:700px){
  .pd .actionbar{
    position: fixed; left:16px; right:16px; bottom:16px; top:auto;
    border-radius:999px; justify-content:center
  }
  body{ padding-bottom:80px }
}

/* ===== Product hero – klidnější hlavička ================================ */
.hero-card .hero{ display:flex; flex-direction:column; gap:12px }

/* 1) Titulek + štítky */
.hero__title{ display:flex; align-items:flex-start; gap:12px; flex-wrap:wrap }
.hero__name{ margin:0; font-size:22px; font-weight:700 }
.hero__chips{ display:flex; gap:6px; flex-wrap:wrap }

/* 2) Primární řádek */
.hero__primary{ display:flex; align-items:center; gap:16px; flex-wrap:wrap }
.price{ display:flex; align-items:baseline; gap:8px }
.price__now{ font-size:22px; font-weight:800 }
.price__was{ color:#6b7280; text-decoration:line-through }
.hero__avail{ line-height:1; }
.hero__warehouse{ display:flex; align-items:center; gap:6px }
/* jen ceny v tabulce produktů */
.table td.price {
  white-space: nowrap;
  display: table-cell; /* přepíše ten flex z .price */
}


/* oddělovač mezi primárem a metadaty */

.hero__divider{ height:1px; border:0; background:var(--line); margin:4px 0 0 }

/* 3) Sekundární meta – klidná mřížka */
.hero__meta{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px 16px; margin-top:8px;
}
@media(max-width:900px){ .hero__meta{ grid-template-columns:repeat(2,minmax(0,1fr)) } }
.hero__meta dt{ color:#475569; font-weight:700; font-size:12px; letter-spacing:.1px }
.hero__meta dd{ margin:0; font-weight:700 }
.hero-card .badge{ padding:4px 8px; border-radius:999px; font-size:12px }

/* ===== Label preview – vertical (náhled štítku) ========================= */
.label-preview.is-vertical{
  display:flex; flex-direction:column; gap:6px;
  padding:12px; background:#fff; border:1px solid var(--line); border-radius:12px;
  max-width:520px; align-items:stretch;
  --lp-nudge: 0px;           /* jemný ruční posun (např. 20px) */
}
.label-preview.is-vertical .lp-bar{
  display:flex; flex-direction:column; align-items:center; gap:2px; width:100%;
}
.label-preview.is-vertical .lp-bar img{ height:48px; width:auto; display:block }
.label-preview.is-vertical .lp-code{ font-weight:800; font-size:14px; letter-spacing:.5px; text-align:center }

/* texty zarovnáme se skutečnou šířkou čárového kódu (šířku nastaví JS do --lp-w) */
.label-preview.is-vertical .lp-textwrap{
  width: var(--lp-w, auto);
  margin: 0 auto;                 /* stejné levé zarovnání jako img */
  transform: translateX(var(--lp-nudge, 0px));
}
.label-preview.is-vertical .lp-textwrap > *{ margin:0 }
.label-preview.is-vertical .lp-cat{ color:var(--muted); font-weight:600 }
.label-preview.is-vertical .lp-name{ font-weight:700 }


/* ===== Dostupnost – banner nad cenou ===== */
.status-banner{
  display:flex; align-items:center;
  padding:10px 12px;
  border-radius:12px;
  font-weight:700;
  border:1px solid var(--line);
}
.status--ok{
  background:#ecfdf5; border-color:#a7f3d0; color:#065f46;
}
.status--warn{
  background:#fef2f2; border-color:#fecaca; color:#991b1b;
}


/* ===== Meta sekce – 3 logické bloky ===== */
.meta-sections{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
 /* margin-top:12px;*/
}
@media (max-width:900px){
  .meta-sections{ grid-template-columns:1fr; }
}
.meta-group {
  background:#fff;
 /* border:1px solid var(--line);*/
  border-radius:12px;
  padding:10px 12px;
}
.meta-group h4{
  margin:0 0 6px 0;
  font-size:11px;                 
  font-weight:600;                
  color:var(--muted);             
  letter-spacing:.06em;
  text-transform:uppercase;
  opacity:.95;
}

.kv.kv-two{ display:grid; grid-template-columns:1fr /*1fr*/; gap:10px 16px }
.kv.kv-two dt{ color:#1f2937; font-weight:700; font-size:12px; letter-spacing:.1px }
.kv.kv-two dd{ margin:0; font-weight:700 }


/* ===== „Obchodní parametry“ jako jemné čipy vedle tagů ===== */
.chips.meta-chips{ display:flex; gap:6px; flex-wrap:wrap }
.chip--meta{
  background:#f7f7f8; border:1px solid #ececec; color:#475569;
  padding:4px 8px; border-radius:999px; font-size:12px; font-weight:600;
}
/* === Category chips suggest – finální override === */
.suggest{
  margin-top:6px;
  display:flex; flex-wrap:wrap; gap:6px;
  padding:0; background:transparent; border:0; box-shadow:none;
  position:static;              /* žádné absolute ani overlay */
}

/* vypnout starý dropdown, který dělal "bílý obdélník" */
.suggest .item-list,
.suggest .item{ display:none !important; }

/* drobné vylepšení chování chipů */
.suggest .chip{ cursor:pointer; }
.suggest .chip:hover{ filter:brightness(.97); }

/* lepší fokus na čipech */
.suggest .chip:focus-visible{
  outline: 2px solid #94a3b8; /* slate-400-ish */
  outline-offset: 2px;
}

/* Chips-only pro #catSug (žádný dropdown) */
#catSug.suggest{
  position: static !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-top: 6px;
  display: flex; flex-wrap: wrap; gap: 6px;
}

/* skryj cokoli „dropdownového“ v catSug */
#catSug .item-list,
#catSug .item,
#catSug [role="listbox"],
#catSug [role="option"],
#catSug .dropdown,
#catSug .menu,
#catSug ul,
#catSug li { display: none !important; }

/* čipy */
#catSug .chip{ cursor:pointer; }
#catSug .chip:hover{ filter: brightness(.97); }
#catSug .chip:focus-visible{ outline:2px solid #94a3b8; outline-offset:2px; }

/* chips suggest jen pro náš box */
.suggest--chips{
  margin-top:6px; display:flex; flex-wrap:wrap; gap:6px;
  padding:0; background:transparent; border:0; box-shadow:none; position:static;
}
.suggest--chips .chip{ cursor:pointer; }
.suggest--chips .chip:hover{ filter:brightness(.97); }
.suggest--chips .chip:focus-visible{ outline:2px solid #94a3b8; outline-offset:2px; }

/* volitelně: úplně skryj starý dropdown, i kdyby si tam něco dosadil */
#catSug{ display:none !important; }


.table td.actions { text-align: right; }
.actions-row { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: nowrap; }
/* všechny badge štítky v buňce tabulky na jednom řádku */
.table td.tags-cell {
  white-space: nowrap;
}

.table td.tags-cell .badge {
  margin-right: 6px;
}


/* export označení*/
/* === Stav exportu: toggle switch (bez textu) ============================= */
.table th.stav-col, .table td.stav-col { width:120px; }

.switch {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: 44px; height: 24px;
  padding: 2px;
  border-radius: 999px;
  background: #e5e7eb;               /* off */
  border: 1px solid var(--line);
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
}
.switch.is-on {                       /* on */
  background: #d1fae5;
  border-color: #a7f3d0;
}
.switch:focus-within {
  outline: 3px solid var(--ring);
  outline-offset: 2px;
}

.switch input {                       /* visually hidden checkbox */
  position: absolute; inset: 0;
  opacity: 0; width: 100%; height: 100%;
  margin: 0; cursor: pointer;
}

.switch__thumb {
  width: 18px; height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.15);
  transform: translateX(0);
  transition: transform .2s ease;
}
.switch.is-on .switch__thumb { transform: translateX(20px); }

.switch.is-busy { opacity:.6; pointer-events:none; }



/* mřížka meta sekcí (už ji máš, jen doplněk pro full šířku) */
.meta-sections{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
@media (max-width:900px){
  .meta-sections{ grid-template-columns:1fr; }
}
/* skupina přes celou šířku – kategorie */
.meta-group--full{
  grid-column:1 / -1;
  margin-bottom:4px; /* malý odstup pod kategorií */
}


/* jednotné řádky uvnitř <dl> */
.kv.kv-one div,
.kv.kv-two div{
  display:grid;
  grid-template-columns: 120px 1fr; /* číslo klidně zvyš na 140px */
  column-gap:12px;
  align-items:baseline;
}
.kv dt{
  color:#1f2937; font-weight:700; font-size:12px; letter-spacing:.1px;
}
.kv dd{ margin:0; font-weight:700; min-width:0; }

/* dlouhá kategorie se nehne layoutem */
.truncate{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* Stack varianta: titulek nahoře, hodnota pod ním */
.kv.kv--stack div{
  grid-template-columns: 1fr;   /* už ne 120px 1fr */
  row-gap: 4px;
}
.kv.kv--stack dt{
  font-weight: 600;
  color: #6b7280;               /* lehce tlumené */
  font-size: 12px;
}
.kv.kv--stack dd{
  font-weight: 700;
}





/* 3-sloupcová meta mřížka se „stack“ páry (dt nad dd) */
.meta-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px 32px;         /* řádková / sloupcová mezera */
  align-items: start;
}
@media (max-width: 960px){ .meta-grid-3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px){ .meta-grid-3 { grid-template-columns: 1fr; } }

/* stacked dvojice – subtilnější titulek, výrazná hodnota */
.kv.kv--stack div{ display:grid; grid-template-columns: 1fr; row-gap: 2px; }
.kv.kv--stack dt{ color:#6b7280; font-weight:600; font-size:12px; }
.kv.kv--stack dd{ margin:0; font-weight:800; line-height:1.25; }

/* jen trochu míň vzduchu nad/po bloku */
.meta-block{ margin-top: 8px; margin-bottom: 8px; }


.cat-row{ display:flex; gap:8px; align-items:center }
.assign-radio{ margin-right:6px }