/* kiegeszites.css · a 2026-11-01-i javítókör kiegészítései a v2.css-hez (a header.php a v2.css UTÁN tölti be).
   Csoportonként egy szakasz; a szakaszok egymás osztályait nem írják felül. */

/* ====================================================================
   A csoport: főoldal, kapcsolat, felvásárlás
   ==================================================================== */
/* A-fooldal-kapcsolat-felvasarlas · kiegészítő CSS a v2.css-hez (az összefésülő illeszti be).
   A főoldal, a kapcsolat és a felvásárlás többi új eleme a v2.css meglévő osztályait használja. */

/* E6 (technikai audit): a /tankony-felvasarlas/ 375 px-en 7 px-szel túllógott. Ok: a .lapfej rácsának egyetlen implicit
   oszlopa (auto) a legszélesebb tartalomhoz nő, ez itt a leadben álló hivatalos tankönyvjegyzék webcíme (törhetetlen,
   ~48 karakter). Az oszlop minmax(0, 1fr), a hosszú cím pedig bárhol törhet. A h1-en az overflow-wrap már rajta volt,
   ezért az nem segített. A .tt-felv-fej osztályt csak a book-buying.php teszi a fejlécre. */
.tt-felv-fej { grid-template-columns: minmax(0, 1fr); }
.tt-felv-fej .lead,
.tt-felv-fo .szoveg { overflow-wrap: anywhere; }

/* ====================================================================
   B csoport: kategória, keresés, termék
   ==================================================================== */
/* B csoport (kategória, keresés, termék) kiegészítő CSS az összefésülőnek: a v2.css végére másolandó.
   V-termek-4: a „Kosárba” gomb(ok) töltsék ki a sort. A termékoldalon a gombok az .order-control.kv-kosarba.gomb-sor
   tárolóban vannak (a v2.css .kv-kosarba { flex: 1 1 200px } a tárolót nyújtja, a gombok viszont magukhoz méretezettek
   maradtak: gomb 128 px, a sor 585 px). A vázlatban a .kv-kosarba maga a gomb, ezért ott kitöltött. */
.kv-kosarba > .gomb { flex: 1 1 200px; }

/* ====================================================================
   C csoport: vásárlás, SimplePay
   ==================================================================== */
/* C-vasarlas-simplepay · a kosár (newui/cart.php) új szerkezetéhez: bal oszlop + oldalsáv-összesítő (V-vas-12).
   Az .ks-racs (8fr 4fr, ragadós .v-osszesito), .pontsor, .savmero, .figy, .kicsi, .gomb-sor már a v2.css-ben van;
   itt csak a bal oszlop ritmusa és a JS-sel beszúrt engedmény-sor jut hely. Csak tokeneket használ. */
.ks-racs > * { min-width: 0; }
.ks-fo { display: grid; gap: var(--v-ter-4); align-content: start; }
.ks-fo > * { margin: 0; }
.ks-fo .h-kis { margin-bottom: 0; }
.ks-fo .ks-lista { margin: 0; }

/* oldalsáv: az engedmények (szerver rajzolja, a main.js a kosár módosításakor beszúrja/törli) */
[data-ks-kedvezmeny]:empty { display: none; }
[data-ks-kedvezmeny] .h-kis, [data-ks-kedvezmeny] h2 { margin: 0 0 var(--v-ter-2); font-size: var(--v-betu-meret-kicsi); }
[data-ks-kedvezmeny] .total { font-size: var(--v-betu-meret-kicsi); }

/* ====================================================================
   D csoport: fiók, tartalom, technika
   ==================================================================== */
/* D-fiok-tartalom-technika · kiegészítés a v2.css-hez (az összefésülő illeszti be a v2.css végére) */

/* M-128 · Admin-HTML CSS-védelem: a szerkesztő (admin) által beszúrt táblázat ne nyúljon túl a lapon, hanem
   vízszintesen görgethető legyen. A kép szűkülése már megvan; a biztonság kedvéért itt is rögzítjük. */
.tt-lap .szoveg table { display: block; max-width: 100%; overflow-x: auto; }
.tt-lap .szoveg img { max-width: 100%; height: auto; }

/* ====================================================================
   Összefésülő: a főoldali „Szállítás és fizetés” módválasztója (A csoport, V-fooldal-2)
   ==================================================================== */
/* A .valaszto a vázlat rövid módneveire készült („Postapont”), a módnevek itt a Delivery táblából jönnek. Egy hosszú név
   (pl. „Házhozszállítás futárral”) a b::after szélesség-tartalékával a fieldset min-content szélességét a lap fölé
   nyújtotta (375 px-en 434 px, a body levágta). A fieldset így zsugorodhat, a hosszú név pedig törhet. */
.ix-szall .valaszto { min-inline-size: 0; }
.ix-szall .valaszto label { min-width: 0; max-width: 100%; }
.ix-szall .valaszto b { overflow-wrap: anywhere; }

/* ====================================================================
   Javítókör, 2. menet: a főoldali „Hol vagyunk” (M-012, V-fooldal-4)
   ==================================================================== */
/* A Google-térkép marad (M-012), a homlokzat-fotó mellé, alá kerül: a .ix-foto két eleme között térköz. */
.ix-foto { display: grid; gap: var(--v-ter-4); }

/* ====================================================================
   Listaoldalak (kategória, keresés): az utolsó sor mindig teli (11-01)
   ==================================================================== */
/* Oldalanként 24 könyv; a rács csak 2, 3, 4 vagy 6 oszlopos lehet (24 mindegyikkel osztható).
   A konténer a .fo, a rács ennél 2 × 16–24 px-szel keskenyebb; egy oszlop legalább 150 px, köztük 24 px. */
.konyvracs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@container (min-width: 530px) { .konyvracs { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@container (min-width: 710px) { .konyvracs { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@container (min-width: 1068px) { .konyvracs { grid-template-columns: repeat(6, minmax(0, 1fr)); } }

/* ====================================================================
   Jelszómezők: szem-gomb (11-01) — a kiegeszites.js teszi be
   ==================================================================== */
.jelszo-burok { position: relative; display: grid; min-width: 0; }
.jelszo-burok > .bemenet { padding-right: 48px; }
.jelszo-burok > input::-ms-reveal { display: none; }   /* Edge saját szeme ne legyen a miénk mellett kettő */
.jelszo-szem { position: absolute; inset-block: 0; right: 0; width: 44px; display: grid; place-items: center; padding: 0; border: 0; background: none; color: var(--v-szin-tinta-2); cursor: pointer; }
.jelszo-szem:focus-visible { outline-offset: -4px; }
@media (hover: hover) and (pointer: fine) { .jelszo-szem:hover { color: var(--v-szin-tinta); } .jelszo-burok:hover > .bemenet { border-color: var(--v-mezo-keret-hover); } }
.jelszo-szem[aria-pressed="true"] { color: var(--v-szin-tinta); }