/*******************************************************************************
 * NAVIGÁCIÓ, KERESŐ ÉS UTILS
 ******************************************************************************/

/* Logó */

.navbar .navbar-brand {
  z-index: 999;
}

/*
 * FONTOS: a Bootstrap 5 alap .navbar-brand osztály "white-space: nowrap"-ot
 * és (flex elemként) "min-width: auto"-t ad. Amíg csak a logókép volt benne,
 * ez nem tűnt fel - de mivel most a webhelynév (site_name) szövege is
 * megjelenik ebben a blokkban, a hosszú cím ("Neumann János
 * Számítógéptudományi Társaság") nem tör sorba, hanem kilóg a doboz jobb
 * széle mellett, RÁLÓGVA a szomszédos blokkra (kereső / fiókmenü / hamburger).
 * Ezért felülírjuk, hogy tördelhessen és a flex elem összenyomódhasson.
 */
.navbar-brand {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;    /* a logó és a felirat egy sorban, egymás mellett maradjon */
  gap: 0.6rem;
  white-space: normal !important;
  min-width: 0;     /* enélkül a flex elem nem mehetne a szöveg természetes szélessége alá */
  max-width: 65%;   /* ne foglalhassa el a jobb oldali gombok helyét kis képernyőn */
}

/* A logókép ne zsugorodjon össze a mellette lévő felirat miatt */
.navbar-brand img,
.navbar-brand picture {
  flex: 0 0 auto;
}

/* A webhelynév szövege (a Drupal / bootstrap5 alap branding sablon jellemzően
   "site-title", "site-name" vagy "site-name-slogan" osztállyal látja el):
   a maradék helyet kapja, és abban törjön sorba, ha nem fér ki egy sorban */
.navbar-brand .site-title,
.navbar-brand .site-name,
.navbar-brand a.site-title,
.navbar-brand .site-name-slogan,
.navbar-brand .site-name a {
  flex: 1 1 auto;
  min-width: 0;
  display: block;
  white-space: normal;
  overflow-wrap: break-word;
  line-height: 1.15;
  font-size: 1.2rem;
  font-weight: 700;
  color: #172981;
}

@media (min-width: 768px) {
  .navbar-brand .site-title,
  .navbar-brand .site-name,
  .navbar-brand .site-name-slogan {
    font-size: 1.1rem;
  }
}

/* Logókép: mobil-first alapméret. A nagyobb (85px-es) méretet
   a njszt_theme_responsive.css adja hozzá 1280px fölött. */
.navbar-brand img {
  height: 40px;
  width: auto;
  /* max-width: 100%; */
}

@media (min-width: 576px) {
  .navbar-brand img {
    height: 50px;
  }
}

@media (min-width: 992px) {
  .navbar-brand img {
    height: 60px;
  }
}

/* A fejléc belső sora (logó + jobb oldali blokk) törhessen sorba,
   ha a jobb oldali tartalom (kereső, fiókmenü, hamburger) nem fér el */
.header-inner-row {
  flex-wrap: wrap;
  row-gap: 0.5rem;
}

/* Additional navigation (kereső, fiókmenü, nyelvváltó stb.) sora:
   tördelhető legyen, hogy kis képernyőn ne csússzon ki a lapból */
.nav-additional-row {
  flex-wrap: wrap;
  row-gap: 0.35rem;
  max-width: 100%;
}

/* Nagyon keskeny (< 360px) képernyőn a hamburger gomb melletti
   "Menü" felirat helyett inkább a hely marad az ikonnak */
@media (max-width: 359.98px) {
  #njsztMenuTrigger {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}


/* "Additional navigation" régió belsejének rendezése */
.region-navigation-collapsible {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

/* Hogy az ikonok színe kövesse a menü stílusát */
.nav-link svg {
  vertical-align: middle;
  transition: color 0.2s ease;
}

.nav-link:hover svg {
  color: #007bff;
}

/* Eltávolítja a Bootstrap alapértelmezett lefelé mutató nyilát az ikon mellől */
.dropdown-toggle::after {
  display: none !important;
}

/* Egy kis árnyék és kerekítés a lenyíló menünek */
.dropdown-menu {
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  border: none;
  margin-top: 10px;
}

/* Google Translate Wrapper */
.block-gtranslate .gtranslate_wrapper {
  padding: 0.5rem;
}

/*--- KERESŐ MEZŐ (EXPANDABLE SEARCH) ---*/

/* Elrejtjük a Drupal alapértelmezett küldés gombját */
.search-expandable-wrapper .form-actions, 
.search-expandable-wrapper button[id^="edit-submit"] {
  display: none !important;
}

/* A nagyító gomb stílusa */
.search-toggle-btn {
  padding: 5px;
  color: inherit;
  z-index: 2;
  border: none;
  background: transparent;
  cursor: pointer;
}

/* A mező wrapperje: alaphelyzetben 0 szélesség */
.search-input-wrapper {
  max-width: 0;
  overflow: hidden;
  transition: max-width 0.4s ease-in-out, opacity 0.3s ease;
  opacity: 0;
}

/* Aktív kereső mező állapot */
.search-input-wrapper.active {
  max-width: 250px;
  opacity: 1;
  overflow: visible;
  display: flex;
  align-items: center;
}

/* A beviteli mező csinosítása */
.search-input-wrapper input {
  border-radius: 20px;
  border: 1px solid #ccc;
  padding: 4px 12px;
  margin-right: 5px;
}

/* Drupal által generált mező-burkoló */
.search-expandable-wrapper .form-item-keys {
  padding-left: 8px;
  padding-right: 8px;
  margin-bottom: 0;
  display: flex;
  align-items: center;
  margin: 0;
}

.search-expandable-wrapper input[type="search"] {
  margin: 2px;
}

