/* Alap stílusok (Változatlan) */
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;

    font-style: normal;
}
#head-img {
    background-image: url("https://kolcsonzes.sdnholding.hu/assets/head_n.png"); /* The image used */
    background-color: #2a4e36; /* Used if the image is unavailable */
    width: 100%; /* You must set a specified height */
    background-position: top; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
    }

    h1.h6{
        font-size: 1.1rem;
        margin-bottom: 0.5rem;
        margin-top: 0.5rem;
     
    
       }

       h2.h5{
        font-size: 1.1rem;
        margin-bottom: 0.5rem;
        margin-top: 0.5rem;
     
    
       }
#app-container {
    height: 100dvh;
    height: calc(var(--vh, 1vh) * 100);
    display: flex;
    flex-direction: column;
}
/* === ÚJ: Prediktív Kereső Találati Lista Stílus === */
#szakma-suggestions .list-group-item {
    cursor: pointer; /* Mutassa, hogy kattintható */
    padding: 0.5rem 1rem; /* Kényelmesebb padding */
}

#szakma-suggestions .list-group-item:hover,
#szakma-suggestions .list-group-item:focus {
    background-color: #f8f9fa; /* Enyhe háttérszín hover esetén */
}

/* Pozicionálás finomítása (opcionális, ha az alap nem tökéletes) */
#szakma-suggestions {
   /* A position-absolute és w-100 a HTML-ben van Bootstrap osztályokkal */
   /* Lehet, hogy szükség van egy kis top eltolásra, ha a keret zavaró */
   /* top: calc(100% + 2px); */
   max-height: 200px; /* Korlátozzuk a magasságot, legyen görgethető */
   overflow-y: auto;
   border: 1px solid #dee2e6; /* Keret a jobb elhatároláshoz */
   border-top: none; /* Nincs felső keret, mert közvetlenül az input alatt van */
   border-radius: 0 0 var(--bs-border-radius) var(--bs-border-radius); /* Lekerekítés alul */
}

/* Kisebb betűméret az infónak */
#selected-info {
    color: #6c757d; /* Szürke szín */
}

.bg-sdn{
    background-color: #2a4e36; 
    color:#FFFF;
}

.strong{
    font-weight: bold;
}

.leadm{
    font-size: 1rem;
    color: #000000; /* Szürke szín */
    margin-left: 1rem;
    font-weight: bold;
    border-bottom: 1px solid #2a4e36; /* Alsó szegély */
}

.text-sdn{
    background-color: #FFFF; 
    color:#2a4e36;
}
.text-sdn-list{
    background-color: #FFFF; 
    color:#2a4e36;
    font-size: 1.2rem;
    font-weight: bold;
}
.text-sdn-flow{
    background-color: #FFFF; 
    font-style: italic;
    font-size: 0.9rem;
    margin-left: 1.1rem;
}
/* Fő tartalom terület */
main.flex-grow-1 {
    padding-bottom: 70px; /* Igazítsd a lábléc magasságához */

}

/* Görgethetőség */
main.overflow-auto {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* Alsó Nav Stílusok (Változatlan) */
.bottom-nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-grow: 1;
    padding: 5px 0;
    text-decoration: none;
    font-size: 0.75rem;
    transition: color 0.15s ease-in-out;
    color: var(--bs-secondary-color); /* Alapértelmezett szín */
}
.bottom-nav-item.active {
     color: var(--bs-primary); /* Aktív szín */
}
.bottom-nav-item i {
   margin-bottom: 2px;
}

.bottom-nav-item i {
    margin-bottom: 2px;
 }

.bottom-nav-item:hover,
.bottom-nav-item:focus {
    color: var(--bs-emphasis-color);
    text-decoration: none;
    outline: none;
}

/* === ÚJ: Slider Képek Magassága (Opcionális) === */
/* Beállíthatunk egy maximális magasságot, hogy ne legyen túl nagy asztali nézetben,
   de mobilon a szélességhez igazodjon. */
#topSlider .carousel-item img {
   max-height: 400px; /* Példa érték, állítsd be igény szerint */
   object-fit: cover; /* Biztosítja, hogy a kép kitöltse a területet vágással, ha az arányok nem egyeznek */
   width: 100%; /* Biztosítja a reszponzivitást */
}

/* Árnyékok (Változatlan) */
.navbar.sticky-top {
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
}
footer.fixed-bottom {
    box-shadow: 0 -.25rem .5rem rgba(0, 0, 0, .1) !important;
}


@media (min-width: 768px) {
    .block-w {
        width: 768px;
        margin: auto;
        width: 50%;
    }

  
  }

  @media (max-width: 375px) {
   h1.h6{
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
    margin-top: 0.5rem;
 

   }

  
  }