/* Roma Örökség – egyedi CSS
   Fejlesztés lokálban (localhost:8080), majd deploy élesre a tools/deploy.py-val. */

/* ===== Fejléc-duplikáció megszüntetése =====
   A fejléc-layout (16) kétszer renderel a belső oldalakon: egyszer a header-widgetből
   (.header_widgets_wrap – ez a főoldalon is ez), egyszer a "normál" fejléc-mechanizmusból.
   A widget-példányt tartjuk meg (minden oldalon konzisztens), a normál duplikátumot elrejtjük. */
.top_panel .elementor.elementor-16 { display: none !important; }
.top_panel .header_widgets_wrap .elementor.elementor-16 { display: block !important; }

/* ===== Fejléc menü – OldStory template-szerű megjelenés ===== */

/* 1) Ékezet-konzisztencia: a menü betűi (sima ÉS ékezetes) ugyanabból a
      latin-ext-es Robotóból jöjjenek, hogy az ékezetesek NE fallback-fontból,
      nagyobbként renderelődjenek. */
.sc_layouts_menu_nav > li > a,
.sc_layouts_menu_nav > li > a > span,
.menu_mobile_nav > li > a,
.menu_mobile_nav > li > a > span {
  font-family: "Roboto", "Segoe UI", Arial, sans-serif !important;
  font-synthesis: none;
}

/* 2) Asztali nézet: a menüpontok EGY tiszta, vízszintes sorban, függőlegesen
      középre igazítva, kényelmes (de a 33%-os fejléc-oszlopba beférő) méretben.
      Korábban 13px-re kellett zsugorítani + a tételek 10px-et csúsztak egymáshoz
      képest (eltérő függőleges igazítás) -> "csúnya". A flex + align-items:center
      egységesíti a sort. */
.elementor-16 .sc_layouts_menu_nav,
.sc_layouts_menu_nav.menu_main_nav {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  white-space: nowrap;
}
.sc_layouts_menu_nav > li {
  display: flex !important;
  align-items: center !important;
  float: none !important;       /* a téma helyenként float-ol; flexben ne */
  white-space: nowrap;
  /* a téma a 2./3. tételre 10px felső margót tesz (az elsőre nem) -> flex sorban
     ez 5px-et lökött rajtuk, ezért "lépcsőztek". Nullázzuk a függőleges margót. */
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.sc_layouts_menu > nav > .sc_layouts_menu_nav > li > a,
.sc_layouts_menu_nav > li > a {
  display: inline-flex;
  align-items: center;
  padding: 0 11px !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
}

/* ===== Fejléc fixálása görgetéskor + a felső hézag megszüntetése ===== */

/* 3) A fejléc fixen a tetején marad görgetéskor.
      A header eleve "over" elrendezésű (position:absolute, top:0, z-index:8000),
      tehát fixed-re váltva a tartalom NEM ugrik – csak görgetéskor a képernyő
      tetején marad. Finom árnyékkal elválik a tartalomtól, ha fölé görget a user. */
.top_panel.top_panel_custom {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .12);
}

/* 4) A felső ~17px hézag megszüntetése.
      Ok: a header-widget trx_addons layout-csomagolója (.sc_layouts_16) kapott egy
      17px felső margót, ami letolta a teljes szürke fejléc-sávot (fölötte a sötét
      slider látszott ki). A csomagoló(k) margóját nullázzuk -> a szürke fejléc a
      lap legtetejéhez tapad. */
.top_panel .header_widgets_wrap .sc_layouts,
.top_panel .header_widgets_wrap,
.top_panel .header_widgets_inner,
.top_panel .header_widgets_inner > .widget,
.top_panel .header_widgets_wrap .widget_block {
  margin-top: 0 !important;
}

/* 5) Tablet és alatta (max 1024px): a 4 menüpont (Főoldal, Blog, Alapítványunkról,
      Programterv) + a középre zárt logó NEM fér el egy vízszintes sorban (átfedné
      a logót). Ezért itt a téma saját hamburger gombja jelenik meg a vízszintes
      menü helyett (ugyanazt a mobil menüt nyitja, mint <768px-en). Asztali nézetben
      (1025px felett) marad a vízszintes, egysoros menü. */
@media (max-width: 1024px) {
  .elementor-16 .sc_layouts_hide_on_mobile nav.sc_layouts_menu_dir_horizontal {
    display: none !important;
  }
  .elementor-16 .sc_layouts_hide_on_mobile .sc_layouts_menu_mobile_button {
    display: inline-block !important;
  }
}