/* Huni terméktöltő — 10. kör: A KERESŐ.
   Három HELY, azonos viselkedéssel:
     K1  a kék oldalsávban, a márka alatt
     K2  a lap fejlécében, a nagy gomb mellett
     K3  a táblázat kártyáján belül, az oszlopnevek fölött                */

.kereso{position:relative;display:flex;align-items:center;min-width:0}
.kereso .ik{position:absolute;left:11px;display:grid;place-items:center;
  pointer-events:auto;cursor:pointer;opacity:.65}
.kereso .ik svg{width:15px;height:15px}
.kereso input{width:100%;font:inherit;font-size:13px;outline:0;
  padding:9px 32px 9px 34px;border-radius:10px;
  transition:border-color .13s,background .13s,box-shadow .13s}
.kereso .torol{position:absolute;right:6px;width:22px;height:22px;border:0;border-radius:50%;
  background:transparent;font-size:11px;line-height:1;display:none;place-items:center;
  opacity:.6}
.kereso.tele .torol{display:grid}
.kereso .torol:hover{opacity:1}

/* ── K1 — a kék sávban ─────────────────────────────────────────────── */
.kereso.savban{margin:0 2px 15px}
body.o1 .kereso.savban .ik{color:#fff}
body.o1 .kereso.savban input{background:rgba(255,255,255,.13);color:#fff;
  border:1px solid rgba(255,255,255,.17)}
body.o1 .kereso.savban input::placeholder{color:rgba(255,255,255,.5)}
body.o1 .kereso.savban input:focus{background:rgba(255,255,255,.2);
  border-color:rgba(255,255,255,.45)}
body.o1 .kereso.savban .torol{color:#fff}
/* csukva nagyítóvá zsugorodik — kattintásra kinyit és fókuszál */
body.osszecsukva .kereso.savban{margin:0 0 12px;justify-content:center}
body.osszecsukva .kereso.savban input,
body.osszecsukva .kereso.savban .torol{display:none}
body.osszecsukva .kereso.savban .ik{position:static;width:38px;height:38px;
  border-radius:10px;background:rgba(255,255,255,.12);opacity:1}
body.osszecsukva .kereso.savban .ik:hover{background:rgba(255,255,255,.2)}

/* ── K2 — a lap fejlécében, a nagy gomb mellett ────────────────────── */
.kereso.lapfejben{width:264px;flex:none}
.kereso.lapfejben .ik{color:var(--halvany)}
.kereso.lapfejben input{background:var(--lap);color:var(--szoveg);
  border:1px solid var(--keret);box-shadow:var(--arny-1)}
.kereso.lapfejben input::placeholder{color:var(--halvanyabb)}
.kereso.lapfejben input:focus{border-color:var(--kek);
  box-shadow:0 0 0 3px rgba(65,86,149,.13)}
.kereso.lapfejben .torol{color:var(--halvany)}
@container (max-width:1050px){ .kereso.lapfejben{width:210px} }
@container (max-width:880px){ .kereso.lapfejben{width:170px} }

/* ── K3 — a táblázat kártyáján belül ───────────────────────────────── */
.tablakereso{border-bottom:1px solid var(--keret);background:var(--papir);
  padding:0 6px}
.kereso.tablaban .ik{left:14px;color:var(--halvany)}
.kereso.tablaban input{background:transparent;border:0;border-radius:0;
  padding:13px 34px 13px 38px;font-size:13.5px;color:var(--szoveg)}
.kereso.tablaban input::placeholder{color:var(--halvanyabb);font-weight:400}
.kereso.tablaban input:focus{background:var(--lap)}
.kereso.tablaban .torol{right:10px;color:var(--halvany)}
.tabla .tablakereso + .tfej{top:51px}

/* ── „Máshol is van találat" — ez felel a valódi kérdésre: MELYIK FÜLÖN ── */
.mashol{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-bottom:11px;
  padding:9px 13px;border-radius:11px;background:var(--kek-50);
  border:1px solid var(--kek-100)}
.mashol .cim{font-size:11.5px;font-weight:600;color:var(--kek-900);margin-right:2px}
.mashol button{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;
  border-radius:999px;border:1px solid var(--kek-100);background:var(--lap);
  font-size:12px;font-weight:600;color:var(--kek-900);box-shadow:var(--arny-1)}
.mashol button:hover{border-color:var(--kek);box-shadow:var(--arny-2)}
.mashol button b{min-width:17px;height:17px;padding:0 5px;border-radius:9px;
  background:var(--kek);color:#fff;font-size:10.5px;display:grid;place-items:center;
  font-variant-numeric:tabular-nums}

/* Keresés közben a 0 találatos lépés elhalványul az oldalsávban — de az
   AKTÍV sor soha: azt épp nézi, és a fehér lapka kimosódna tőle. */
body .ossor.nincs:not(.itt){opacity:.35}

/* prezenter-váltó a három keresőhely közt */
.osvalto.ker{bottom:52px}

/* ── A KÖZÖS LISTA — a Mind fül (`t-mind`) ÉS a keresés (`t-talalat`) ───
   A keresés kilép a fülből: egy lista mind a négy állapotból, külön
   Állapot oszloppal. Ezért nincs kijelölő négyzet — a nagy gomb az átnézhető
   találatokat viszi be. */

@container (max-width:1130px){       /* 09-29: a rács töréspontjával együtt (lent) */
  
  /* ⛔ AUDIT (élesben, 2026-09-04): keskeny nézetben az EAN oszlop ELTŰNT, és
     a név alatt sem maradt azonosító — a raktár elsődleges kulcsa nem tűnhet
     el. Az EAN minden szélességen marad; a fotók/mikor oszlop adja a helyet. */
}
@container (max-width:965px){
  
  .lap.t-mind .tsor .tfoto, .lap.t-mind .tsor .tmikor,
  .lap.t-talalat .tsor .tfoto, .lap.t-talalat .tsor .tmikor{display:none}
}
/* a naplóból jövő találatnak nincs fotója — üres, halk lapka, nem törött kép */
.tkep.nincskep{display:block;background:var(--papir-2);
  box-shadow:inset 0 0 0 1px var(--keret)}
.lap.t-mind .tsor .tveg, .lap.t-talalat .tsor .tveg{opacity:.65}


/* ══ EGY RÁCS MINDEN LAPRA (Roland, 2026-09-04) ═══════════════════════════
   kép · név · EAN · fotók · állapot · jóváhagyta · Shoprenter · mikor · műveletek
   Az EAN SOHA nem esik ki (a raktár kulcsa); keskenyedve előbb a jóváhagyta,
   aztán a fotók és a mikor oszlop adja a helyet. */
.lap{--tosz:38px minmax(170px,1fr) 118px 52px 200px 96px 104px 96px 56px}
/* ⛔ MÉRVE (2026-09-29, 1290 px-es ablak): a 9 oszlopos rács legalább 1124 px-et kér (oszlopok 930 + rések 112 +
   sorpárna 32 + lappárna 48 + keret 2), a töréspont 1050-nél volt → a sor végén a kuka 35 px-re levágódott. A
   8 oszlopos 960 px-et kér → a következő töréspont 965 (a fenti, oszlopot rejtő szabályok is ide igazítva). */
@container (max-width:1130px){
  .lap{--tosz:38px minmax(150px,1fr) 112px 48px 190px 96px 90px 56px}
  .lap .tsor .tki{display:none}
}
@container (max-width:965px){
  .lap{--tosz:38px minmax(140px,1fr) 108px 180px 84px 56px}
  .lap .tsor .tki, .lap .tsor .tfoto, .lap .tsor .tmikor{display:none}
}
.tsor .tki, .tsor .tshop{min-width:0;font-size:12px}
.tsor .tshop .g.kici{padding:4px 9px;font-size:11.5px}
