/* Nabídka pod polem hledání v černé liště.

   Roman 18. 9. 2026: „hledat funguje špatně, když píšu, tak to jede dolů,
   musí to zůstat, kde to je, ale nabízí to možnosti pět pod sebou a mezi
   tím se dá listovat, ale je to pořád na stejném místě."

   Nabídka proto visí nad stránkou (`position: absolute`), takže katalog
   pod ní nikam neuteče a pole zůstává, kde bylo. Pět řádků je strop —
   delší seznam by na liště přerostl hlavičku a začal překrývat menu.

   Vlastní soubor, protože je to vlastní prvek; zbozi-weber.css zůstává
   beze změny. */

.lista-navrhy {
  position: absolute;
  left: 0;
  /* Širší než pole: do 242 px se název grilu nevejde a krátil se na
     „Chytrý plyno…". Vlevo zarovnaná s polem, přesahuje doprava. */
  width: 430px;
  max-width: calc(100vw - 40px);
  top: calc(100% + 6px);
  z-index: 60;
  margin: 0;
  padding: 4px;
  list-style: none;
  border: 1px solid #2c2c2c;
  border-radius: 12px;
  background: #101010;
  box-shadow: 0 18px 36px rgb(0 0 0 / .45);
}

.lista-navrhy[hidden] { display: none; }

.lista-navrhy li { margin: 0; }

.lista-navrhy button {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 42px;
  padding: 5px 8px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #fff;
  text-align: left;
  font: inherit;
  cursor: pointer;
}

/* Listování klávesami i myší vypadá stejně — jinak člověk neví, co Enter
   vybere. */
.lista-navrhy button:hover,
.lista-navrhy button[aria-selected="true"] { background: #232323; }

.lista-navrhy img {
  width: 34px;
  height: 34px;
  object-fit: contain;
  background: #fff;
  border-radius: 6px;
}

.navrh-text { min-width: 0; }

.navrh-nazev {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
}

.navrh-kod { display: block; margin-top: 2px; color: #8a8a8a; font-size: 11px; }

.navrh-cena { color: #fff; font-size: 12px; font-weight: 800; white-space: nowrap; }

/* Poslední řádek: „zobrazit všech N" — když hledané zboží není mezi pěti. */
.lista-navrhy .navrh-vse {
  grid-template-columns: 1fr;
  min-height: 36px;
  margin-top: 2px;
  border-top: 1px solid #262626;
  border-radius: 0 0 8px 8px;
  color: var(--red, #c8102e);
  font-size: 12px;
  font-weight: 800;
}

@media (max-width: 760px) {
  /* Na telefonu je pole úzké; nabídka se rozšíří na celou obrazovku pod
     lištou, ať se názvy vejdou. */
  .lista-navrhy { left: -8px; width: calc(100vw - 16px); }
  .lista-navrhy button { min-height: 46px; }
}