header {
    background-color: var(--background-boja); /* Tamna pozadina za header */
    color: var(--tekst-boja); /* Bež boja za tekst */
    text-align: center;
    padding: 0px 20px 0px 20px;
    margin-bottom: 0;
    position: relative; /* Pozicioniranje za jezični dropdown */
    display: flex;
    justify-content: center; /* Centriranje loga */
    align-items: center;
    margin-top: 0px;

}

.logo-container {
    display: flex;
    align-items: center;
    justify-content: center; /* Centriranje loga unutar kontejnera */
    background-color: white;
    border-radius: 100%;
}

.logo {
    height: 250px; /* Veličina loga */
    cursor: pointer;
    border-radius: 50%;
    margin-top: 0px;
}

.language-dropdown {
    position: absolute; /* Pozicioniramo jezični gumb u gornji desni kut */
    top: 20px;
    right: 20px;
    display: inline-block;
}

.language-button {
    background-color: var(--background-boja);
    color: var(--tekst-boja);
    border: 2px solid var(--tekst-boja);
    border-radius: 8px;
    padding: 0.5rem 1rem; /* Dodaj prostor oko sadržaja */
    font-size: 1rem; /* Prilagodi veličinu fonta prema sadržaju */
    cursor: pointer;
}


.language-button:hover {
    color: var(--tekst-boja-hover);
}

.language-options {
    display: none;
    position: absolute;
    background-color: var(--background-boja);
    border: 2px solid var(--tekst-boja);
    border-radius: 8px;
    margin-top: 5px;
    padding: 10px 2vw;
    list-style-type: none;
    z-index: 100;
    min-width: max-content; /* Automatski širi prema sadržaju */
    width: auto; /* Osigurava da se širi prema tekstu */
    right: 0;
    left: auto;
    overflow: hidden;
}


.language-options li {
    text-align: center;
    padding: 5px 15px;
}

.language-options li a {
    color: var(--tekst-boja);
    text-decoration: none;
    display: block;
    font-size: clamp(1rem, 3vw, 3.5rem);
}

.language-options li a:hover {

    color: var(--background-boja-hover);
}

.language-dropdown.active .language-options {
    display: block;
}

.language-options li a {
    font-size: clamp(0.7rem, 2vw, 1rem); /* Fleksibilna veličina teksta unutar opcija jezika */
}

.language-options {
    font-size: clamp(0.7rem, 2vw, 1rem); /* Fleksibilna veličina teksta za cijeli popis opcija */
}

.lang {
    font-size: clamp(0.7rem, 2vw, 1rem); /* Fleksibilna veličina fonta za jezične opcije */
    display: block;
}

.svgclass{
    max-height: 50px;
    max-width: 50px;

}

/* Responzivni dizajn za jezični dropdown */
@media screen and (max-width: 1400px) {
    header h1 {
        font-size: clamp(1.8rem, 5vw, 2.5rem); /* Manja veličina za tablete */
    }
    .language-button {
        font-size: clamp(1.2rem, 3vw, 2.5rem); /* Manja veličina za gumb */
        padding: 8px 10px;
    }
    .language-options li {
        padding: 8px 6px;
    }
    .language-options {
        width: 23vw;
    }
    .logo {
        height: 200px;
    }
}

@media screen and (max-width: 2000px){
    .svgclass{
        max-height: 7vw;
        max-width: 7vw;
    }
}