/* ==========================================================================
   fejlec.css - A FEJLEC-SAV KOZOS FORRASA          2026-09-05 (B249)

   MIERT VAN: a B244-es felmeres szerint ugyanaz a ceg NEGY kulonbozo fejlecet
   kapott. A savok magassaga sablononkent kulon volt beegetve:
       landing 52px | overview 56px | index 60px | expert 60px (28px oldalpad)
   ...es ehhez jott 119 sajat .shell szabaly hat fajlban, 63 !important-tal.
   Ez a fajl a GEOMETRIAT viszi: magassag, belso margo, a logo merete. A szint
   tovabbra is az arculat adja (--shell-bg), a lap-specifikus dísz (arnyek,
   also vonal) pedig a sablonban maradt.

   REFERENCIA (Peter dontese, B247): az overview mai allapota - 56px deklaralt
   sav, ami kompakt modban 45px-nek latszik.

   BETOLTESI SORREND: a system.css UTAN kell allnia. A sablonok sajat
   <style> blokkja meg kesobb jon, ezert azokbol a GEOMETRIAI deklaraciok
   KI LETTEK VEVE - ha valaki visszateszi oda a height-ot, ez a fajl megint
   tehetetlen lesz.
   ========================================================================== */

/* --- 0. A FEJLEC MAGASSAGA ES A RAGADO FULSOR (2026-09-25, Peter nagy3/1b) ---------------------------
   Peter: "az admin es a szakertoi felulet fulsora gorgeteskor is maradjon a helyen - rendszerszinten, minden feluleten".
   Merve elotte: csak a ceg-admin fulsora ragadt (beegetett top:60px - 4 px res a 56 px-es fejlec alatt); a szakertoi
   (#tabBar) es az ugyfelportal (.tabs) fulsora elgordult. A fejlec valodi magassagat a fejlec_kozos.js meri (keskeny
   ablakban a fejlec tordelodik), --fejlec-h valtozoba; a 56px csak a meres elotti tartalek. A B606 tanulsaga all:
   a body overflow-x:clip (mobile_fixes.css) nelkul a sticky nem ragad. */
:root{--fejlec-h:56px}
.nav.nav-bar,#tabBar,#appScreen .main>.tabs{position:sticky;top:var(--fejlec-h,56px);z-index:99}
#tabBar{background:var(--bg)}

/* --- 1. A SAV MAGA ------------------------------------------------------- */
.shell{
  height:56px;
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:sticky;
  top:0;
  z-index:100;
  /* 2026-09-05 (B249): a sav SOHA nem nyomodhat ossze. Az ugyfelportalon a
     .shell egy flex-konteneren BELUL all (#authScreen), es flex-shrink nelkul
     a bongeszo 56px helyett 36px-re nyomta - a tobbi lapon 45, ott 36 latszott.
     Megmerve: a szamitott height 56px volt, a valodi doboz megis 36px. */
  flex-shrink:0;
}

/* --- 2. A BAL OLDALI CSOPORT --------------------------------------------- */
.shell-logo{
  display:flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
  flex-shrink:0;
  min-width:0;
}

/* --- 3. A LOGO HELYE ------------------------------------------------------
   KET ALLAPOTA VAN, es ez SZANDEKOS:
   a) NINCS LOGO -> kor, benne a cegnev kezdobetuje. Ez az itt allo alapertek.
   b) VAN LOGO   -> a brand_apply.js _dom() INLINE stilust ad az elemre
                    (width:auto; height:40px; border-radius:0; background:transparent),
                    es az inline eros'ebb ennel a fajlnal. Nem kell ide "logo-s"
                    valtozat: a JS mondja meg, mikor valtson.
   A 40px SZANDEKOS: a sav 56px, tehat a logo folott-alatt 8-8px levego marad.
   Eddig a JS 56px-et irt, vagyis a logo PONTOSAN akkora volt, mint a sav, es
   2-2 pixellel ki is logott belole (B244/5 merese). */
.shell-logo-circle,
.shell-logo-icon{
  width:30px;
  height:30px;
  flex:0 0 auto;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:16px;
  line-height:1;
}

/* A logo-kep: az aranyat MINDIG megtartja, es soha nem vagodik. */
.shell-logo-circle img,
.shell-logo-icon img{
  height:40px;
  width:auto;
  max-width:220px;
  object-fit:contain;
  display:block;
}

/* --- 4. A FELIRATOK ------------------------------------------------------- */
.shell-logo-text-wrap{ display:flex; flex-direction:column; justify-content:center; min-width:0; }
.shell-logo-text,.shell-title{ font-weight:700; font-size:15px; line-height:1.2; white-space:nowrap; }
.shell-logo-sub{ font-size:11px; letter-spacing:.5px; line-height:1.2; white-space:nowrap; }

/* 2026-09-05 (B255): AZ ALCIM SZELESSEG-KORLATJA.
   MIERT KELL: az alcim mostantol a ceg SAJAT tagline-jabol jon, tehat a hossza
   nem a mi dolgunk - a scanner 160 karakteren vagja el, es ket cegnel MA is
   ennyi all benne. A sav egysoros (white-space:nowrap), a .shell-logo pedig
   NEM zsugorodhat (flex:0 0 auto), ezert a hosszu szoveg egyszeruen KITOLJA a
   savot. MEGMERVE, valodi bongeszovel, a 160 karakteres tagline-nal:
       390px  /demo/client    a sav 508 pixellel tullogott
       390px  /demo/overview  a sav 594 pixellel tullogott
      1440px  mindketto       nem logott tul (ott van hely)
   MIERT NEM A .shell-logo zsugoritasa a megoldas: kiprobaltam
   (flex-shrink:1 + min-width:0), es a /client lapon meg hatott, az
   ATTEKINTON NEM - ott a logo egy .shell-left dobozban ul, ami maga is
   flex:0 0 auto. Ket lap, ket szerkezet; a korlat az ALCIMEN mindketton hat.
   A KET ERTEK MERT, NEM BECSULT (a 160 karakteres tagline-nal, tullogas=0):
       80ch  769 / 820 / 900 / 1024 / 1280 / 1440 px szelessegen mindket lapon
       38ch  320 es 390 px szelessegen mindket lapon (46ch mar tullogott 320-on)
   A 'ch' a sajat betumerethez igazodik, tehat a mobil 8px-es alcimnel is ugyanaz
   a karakterszam. A tores 768px - ugyanaz a hatar, amit a mobile_fixes.css
   hasznal; a @media SZANDEKOSAN ITT all, a kozos fajlban, kulonben a geometria
   megint sablononkent csuszna szet (B249 tanulsaga). */
.shell-logo-sub{ max-width:80ch; overflow:hidden; text-overflow:ellipsis; }
@media (max-width:768px){
  .shell-logo-sub{ max-width:38ch; }
}

/* --- 5. A JOBB OLDALI CSOPORT --------------------------------------------- */
/* 2026-09-05 (B249): a jobb oldali csoport SZANDEKOSAN zsugorodhat (nincs
   flex-shrink:0). Elsore beleirtam, es a b05 (mobil) azonnal pirosra valt:
   telefonon a mobile_fixes.css a .shell-right-ot TORDELI (flex-wrap:wrap), de
   ha nem zsugorodhat, a szelessege a tartalma marad, es a gombok KIFUTNAK a
   390px-es kepernyorol - "Szakértői felület" a 401., "Kilépés" a 677. pixelen.
   Megmerve valodi mobil-nezetben, 5 elerhetetlen vezerlovel. */
.shell-right{ display:flex; align-items:center; gap:8px; }

/* --- 6. A SAV NEM TAKARHAT SEMMIT ---------------------------------------
   2026-09-09 (B340). A HIBA, AMIT ORVOSOL: belepve a .shell-right HET elemre
   no (Udvozlunk / [szerep] / Sajat felulet / Sugo / Kilepes / kompakt / sotet),
   es mivel a lapok flex-wrap:wrap-ot adtak ra, MASODIK SORBA tort - egy FIX
   magassagu savon belul. A masodik sor igy kilogott a savbol, es ratakart az
   alcimre. VALODI BONGESZOVEL MERVE, a /colorplaycenter/client lapon:
       1440 / 1280 / 1024 / 900 px   a jobb csoport 6 pixellel logott a sav ala
        769 px                       19 px
        390 px                       103 px (a sav 56 px, a csoport 159 px-ig ert)
        320 px                       93 px
   KET DOLGOT KELL EGYSZERRE KIMONDANI, ezert all itt mindketto:
   (a) 769 px FELETT a jobb csoport EGY SORBAN all (nincs tores), es helyet a
       BAL csoport ad: az alcim es a cegnev ellipszissel rovidul. Enelkul a
       nowrap csak athelyezne a bajt - a csoport kifutna a kepernyorol.
       A .shell-logo eddig flex-shrink:0 volt (B249); a B255 mar probalta az
       ellenkezojet, es akkor MAGABAN nem volt eleg - a ketto EGYUTT hat.
   (b) 768 px ALATT a tordeles MARAD (B249 merese: nowrap eseten a gombok
       kifutnak a 390 px-es kepernyorol), de akkor a SAV NO a tartalmaval.
       A magassagot a mobile_fixes.css mar height:auto-ra allitja; itt csak
       megerositjuk, hogy a kozos fajl se mondjon mast.
   AMIT NEM ER EL: az admin (index.html) sajat, !important-os .shell-right
   szabalya erosebb ennel - ott a tores megmaradt. Felirva a leltarba.

   A ZSUGORODAS IRANYA KI VAN MONDVA, es ez a resze a legfontosabb. Elsore
   csak a nowrap-et irtam ide, es a meres megmutatta, hogy AZ MAGABAN
   ATHELYEZI A BAJT, nem szunteti meg: 769 px-en a "Udvozlunk, <nev>" szoveg
   HAROM SORBA tort a csoporton BELUL (a doboz 47 px lett egy 45 px-es savban),
   a kompakt- es a sotet-gomb pedig KIFUTOTT a kepernyorol (785. es 772. pixel
   a 769-es lapon). Ezert nem eleg megmondani, hogy egy sor van - azt is meg
   kell mondani, MI adja at a helyet:
     1. eloszor a BAL oldal rovidul (cegnev, alcim - ellipszissel),
     2. utana a jobb oldali SZOVEGEK (koszonto, szerep - szinten ellipszissel),
     3. a GOMBOK ES A LINKEK SOHA nem zsugorodnak es nem tornek sorba.
   Igy a csoport legkisebb szelessege a fix elemek osszege (~400 px), a logoe
   ~38 px; 769 px-en 721 px all rendelkezesre, tehat a legrosszabb eset is befer.

   EGY HIBAT ITT KOVETTEM EL, ES A MERES MUTATTA MEG - ezert all felirva:
   elsore a .shell-right-ra is min-width:0-t irtam. Ez KIKAPCSOLJA a flex-elem
   sajat, tartalom-alapu also korlatjat, vagyis a csoport a GOMBJAI ALA
   zsugorodhat - a gombok pedig kilognak belole, egyenesen a kepernyon KIVULRE.
   A /colorplaycenter/expert lapon 769 px-en HAROM vezerlo futott ki igy
   (Kilepes a 783., a kompakt-gomb a 821., a sotet-gomb a 868. pixelen, a lap
   769 px szeles). A min-width:0 tehat a BAL oldalra valo - ott VAN mit
   rovidteni (ellipszis) -, a jobbra NEM. */
@media (min-width:769px){
  .shell-right{ flex-wrap:nowrap; }
  .shell-right > *{ flex-shrink:0; }
  .shell-right > span{ flex-shrink:1; min-width:0; white-space:nowrap;
                       overflow:hidden; text-overflow:ellipsis; }
  .shell-left{ min-width:0; }
  .shell-logo{ flex-shrink:1; }
  .shell-logo-text-wrap{ overflow:hidden; }
  .shell-logo-text,.shell-title{ overflow:hidden; text-overflow:ellipsis; }
}
@media (max-width:768px){
  .shell{ height:auto; min-height:56px; }
}

/* --- 7. A KOZOS FEJLEC: BAL CEG / KOZEP GOMBSOR / JOBB JBS (2026-09-13) ------
   Peter kerese, rendszerszinten, minden cegnek az alapertelmezett fejlec:
     balra fixen a ceg sajat logoja es neve
     jobbra a JokerBooking jele, kisebben es halvanyabban, elotte "működteti"
     kozte a gombsor, aranyosan elosztva
     mobilon a gombsor menube kerul, a ket logo marad
   A SZERKEZETET a static/js/fejlec_kozos.js teszi ra (jel + menugomb), ez a
   szakasz a geometriat mondja ki. Felulirja a B254/B256 "a JBS-jelzes csak a
   lablecben" dontest - a lablec sora ettol valtozatlan.

   MIERT A MAGAS FAJSULY ES AZ !important: az admin (index.html) sajat
   .shell-right es .shell-right > * szabalyai !important-osak (B341), es a
   mobile_fixes.css 768 px alatt szinten !important-tal tordel. Ket osztalyos
   (.shell > .shell-right) !important szabaly mindkettot uti, sorrendtol
   fuggetlenul. */

/* 7a. KOZEP: a gombsor kitolti a helyet; a gombok EGY CSOPORTBAN, JOBBRA ZARVA (a JBS-jel elott), EGYFORMA KOZZEL.
   2026-09-27 (Peter valasztasa: "Csoportban, jobbra"): a 2026-09-13-i "aranyosan elosztva" (space-evenly) HELYETT.
   MIERT: a space-evenly a SZABAD HELYET osztotta szet a gombok kozott, ezert a koz a gombok szamatol fuggott - merve 1440 px-en:
   admin 25, berlo 63, portal 104, vendeg-naptar 144 px; szukebb ablakban 6 px. A sablonok sajat alap-koze is elter (admin 4 px
   !important, portal 12, a tobbi 8) - a ket osztalyos !important koz mindet egysegesiti. A sorrend es a tartalom valtozatlan. */
.shell > .shell-right{
  flex:1 1 auto !important;
  justify-content:flex-end !important;
  column-gap:8px !important;
  margin:0 16px !important;
  /* min-width:0 SZANDEKOSAN NINCS: lasd az 5-6. pontot (B340) - a gombok kilognanak.
     Ha a gombsor nem fer ki, a fejlec_kozos.js menure valt. */
}

/* 7a/2. AZ URES DOBOZ NEM KAP HELYET. A space-evenly az ures elemet (overview:
   ures .legend; belepes elott ures #userName) is tagkent osztja el, es a lathato
   gombok kozott egy "lyuk" maradt (merve 2026-09-13: 420 / 204 / 204 / 204 px).
   Csak div es span: az img es az input mindig :empty. A csak szokozt tartalmazo
   dobozt a :empty nem fogja meg - azt a fejlec_kozos.js jeloli (.shell-ures-elem). */
/* 7a/1. A BEAGYAZOTT GOMBCSOPORT NEM KULON TAG. Az attekintoben a belepes utan az #overviewAuthBtn span-be kerul az udvozles es
   a navigacios gombok (Admin/Berloi felulet, Sugo, Kilepes) - rés NELKUL (merve: 0 px), es a sor tobbi elemetol kulon csoportkent.
   A display:contents a span gyermekeit a gombsor sajat tagjaiva teszi: ugyanazt a kozt kapjak, a sorrend nem valtozik. */
.shell > .shell-right > span:has(> .shell-btn){ display:contents !important; }
/* 7a/1b. A KOZ CSAK A GAP-BOL JON. Merve: a 🌙 (bkDarkToggle) sajat 8 px bal margoja es az attekinto udvozlo szovegenek 8 px jobb
   margoja a tobbinel nagyobb rest adott (14/15 px a 8 helyett). A lenyilo menu (7c) sajat, erosebb szabalyai ezt felulirjak. */
.shell > .shell-right > *,
.shell > .shell-right > span:has(> .shell-btn) > *{ margin-left:0 !important; margin-right:0 !important; }

.shell > .shell-right > div:empty,
.shell > .shell-right > span:empty,
.shell > .shell-right > .shell-ures-elem{ display:none !important; }

/* 7b. JOBB: "működteti" + JBS-jel - kicsi es halvany, SOHA nem zsugorodik */
.shell > .shell-jbs{
  display:inline-flex; align-items:center; gap:6px;
  /* 2026-09-22 (Peter): a szlogenes logo LATSZODJON - a regi .72-es halvanyitas a kis jelhez keszult. */
  flex:0 0 auto; opacity:.92; white-space:nowrap; line-height:1;
}
.shell > .shell-jbs .shell-jbs-szo{
  font-size:10px !important; font-weight:500 !important; letter-spacing:.2px;
  color:var(--shell-fg,#fff) !important; text-shadow:none !important;
}
/* 2026-09-22 (Peter): a jobb felso sarokban a SZLOGENES (fekvo) logo - ezert magasabb, mint a regi keskeny jel volt. */
/* 2026-09-23 (Peter kimondta): "egyforma legyen a bal es a jobb oldali" - a JBS szlogenes logoja UGYANOLYAN MAGAS,
   mint a ceg sajat logo-kepe a bal oldalon (.shell-logo-circle img / .shell-logo-icon img: 40 px). Ez FELULIRJA a
   korabbi "a JBS jelzese legyen kisebb" szabalyt (b60). A szelesseget a fekvo elrendezes adja; mobilon a max-width
   fogja vissza. */
.shell > .shell-jbs .shell-jbs-logo{ height:var(--shell-jbs-h,40px); width:auto; max-width:46vw; object-fit:contain; display:block; }
/* a "mukodteti" felirat 2026-09-22 ota nem keszul el (Peter) - a szabalya tartalekban marad: */
/* MOBILON a CEG NEVE az elso: 72vw-nel a szlogenes logo kiszoritotta a fejlecbol (merve). Ezert ott a szelesseg
   a korlat (46vw), es a logo ennyibe belefer - a magassaga igy kisebb, mint a ceg logojae. Asztalon EGYFORMA. */
@media (max-width:600px){ .shell > .shell-jbs .shell-jbs-logo{ max-width:46vw; } }
/* 2026-10-03 (B909): MOBILON MENU-MOD NELKUL IS ROVIDULHET A BAL OLDAL. MERVE (390 px, szallasfoglalo /<ceg>/client, menu nelkuli sav =
   .shell-menu-ures): a .shell-logo (220 px, flex-shrink:0) + a JBS-jel (167 px) a 24 px-es behuzassal 443 px-ig ert -> vizszintes
   tulcsordulas. A zsugorodast eddig csak a menu-mod (7d) es a 769 px feletti szabaly (6.) adta. Itt CSAK a sav kozvetlen .shell-logo
   gyerekere hat (a B255 merese: a .shell-left-es szerkezetnel ez nem eleg - ott a menu-mod segit), es csak akkor rovidit, ha nem fer el. */
@media (max-width:768px){
  .shell > .shell-logo{ flex-shrink:1; min-width:0; }
  .shell > .shell-logo .shell-logo-text-wrap{ overflow:hidden; min-width:0; }
  .shell > .shell-logo .shell-logo-text,
  .shell > .shell-logo .shell-logo-sub{ overflow:hidden; text-overflow:ellipsis; }
}

/* 7c. A MENUGOMB: csak menu-modban latszik, es csak ha van mit mutatni */
.shell > .shell-menu-gomb{ display:none !important; }
.shell.shell-menu-mod:not(.shell-menu-ures) > .shell-menu-gomb{
  display:inline-flex !important; flex:0 0 auto; margin-left:auto !important;
  margin-right:12px !important; font-size:16px !important; line-height:1 !important;
}
html.bk-beagyazott .shell > .shell-menu-gomb{ display:none !important; }

/* 7d. MENU-MOD: egy sor, a bal oldal rovidul, a gombsor rejtve */
.shell.shell-menu-mod{ flex-wrap:nowrap !important; }
.shell.shell-menu-mod > .shell-right{ display:none !important; }
.shell.shell-menu-mod > .shell-logo,
.shell.shell-menu-mod > .shell-left{ flex:0 1 auto !important; min-width:0 !important; overflow:hidden; }
.shell.shell-menu-mod .shell-logo{ flex-shrink:1 !important; min-width:0 !important; }
.shell.shell-menu-mod .shell-logo-text-wrap{ overflow:hidden; min-width:0; }
.shell.shell-menu-mod .shell-logo-text,
.shell.shell-menu-mod .shell-logo-sub{ overflow:hidden; text-overflow:ellipsis; }

/* 7e. A NYITOTT MENU: a gombsor a SAJAT HELYEN nyilik le panelkent. A hattere a
   sav SZAMITOTT hattere (a fejlec_kozos.js nyitaskor teszi a --fejlec-menu-szin/
   -kep valtozoba), igy a sav szovegszinei a panelen is olvashatok maradnak.
   A --shell-bg csak tartalek: elesben merve az a LAP hattere is lehet. */
.shell.shell-menu-mod.shell-menu-nyitva > .shell-right{
  display:flex !important; position:absolute !important; top:100% !important;
  right:8px !important; left:auto !important; margin:4px 0 0 !important;
  flex-direction:column !important; align-items:stretch !important;
  justify-content:flex-start !important; flex-wrap:nowrap !important;
  gap:6px !important; padding:8px !important; min-width:214px;
  max-width:calc(100vw - 16px); max-height:calc(100vh - 80px); overflow:auto !important;
  background-color:var(--fejlec-menu-szin,var(--shell-bg,#1e293b)) !important;
  background-image:var(--fejlec-menu-kep,none) !important;
  border-radius:10px; box-shadow:0 12px 36px rgba(0,0,0,.28); z-index:300;
}
.shell.shell-menu-mod.shell-menu-nyitva > .shell-right > *{
  justify-content:flex-start !important; margin:0 !important; white-space:nowrap;
}
.shell.shell-menu-mod.shell-menu-nyitva > .shell-right > span{ max-width:none !important; }

/* 7f. A CEGNEV ES AZ ALCIM SZOVEG, NEM IKON-DOBOZ. Az ugyfelportal sajat szabalya
   (portal.html: ".shell-logo span{width:34px;height:34px;...}") MINDEN span-t
   34 px-es szinatmenetes negyzette tett - a cegnevet es az alcimet is. MERVE
   2026-09-13: a nev 54 px magasra tort egy 45 px-es savban, mobilon a sav 86 px
   lett. A kozos fejlecben a bal oldalon a ceg NEVE all, ezert itt mondjuk ki. */
.shell .shell-logo .shell-logo-text,
.shell .shell-logo .shell-logo-sub{
  width:auto; height:auto; border-radius:0; background:none; display:block;
}

/* 2026-10-05 (B1001, Peter): TOMOR LEPES a hamburger elott (fejlec_kozos.js .shell-tomor) - a gombok a savon maradnak, csak az udvozlo
   felirat tunik el es a skin-gomb ikonra szukul (a teljes nev a gomb title-jeben). */
.shell.shell-tomor:not(.shell-menu-mod) #userName{ display:none !important; }
.shell.shell-tomor:not(.shell-menu-mod) #skinValasztoGomb .sv-szoveg{ display:none !important; }

/* 2026-10-11 (B1099, Peter #43): A CEG LOGO-KEPE A SAVBAN NEM VAGODIK LE - a tartoba zsugorodik (minden cegnel, minden lapon).
   MERVE (eles, 360 px, /enszakerto/portal): a .shell-logo menu-modban overflow:hidden es 108 px-re rovidul, a logo-doboz viszont
   flex:0 0 auto, a kep inline max-width:220px -> a 115 px-es kep jobb szele (az "o" vege) levagodott. Most a doboz legfeljebb a tarto szeles (a cegnev-felirat rovidul elobb),
   a kep a doboz szelessegeig kicsinyedik (object-fit:contain: az arany marad, csak kisebb). Ahol elfer, semmi nem valtozik. */
.shell .shell-logo .shell-logo-circle,
.shell .shell-logo .shell-logo-icon{ flex-shrink:0; max-width:100%; }
.shell .shell-logo .shell-logo-circle img,
.shell .shell-logo .shell-logo-icon img{ max-width:100% !important; }