.language-selector {
    display: flex;
    gap: 15px; /* Butonlar arası boşluk artırıldı */
    align-items: center;
    justify-content: center; /* Butonları yatay olarak ortalar */
    margin: 20px 0; /* Üst ve alt boşluk eklendi */
}

.language-selector button {
    background-color: #333;
    color: white;
    border: none;
    padding: 8px 15px; /* Daha geniş bir alan ekleyerek görünürlüğü artırır */
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.2s ease; /* Hover sırasında küçük bir büyütme efekti eklenebilir */
    outline: none; /* Tarayıcı varsayılan çerçevesini kaldırır */
    border-radius: 5px; /* Daha yumuşak köşeler için */
    font-size: 14px;
}

.language-selector button:hover {
    background-color: #ff6347; /* Turuncu arka plan */
    transform: scale(1.05); /* Hafif büyütme efekti */
}

.language-selector button:active {
    background-color: #cc5038; /* Daha koyu turuncu */
    transform: scale(0.95); /* Tıklandığında hafif küçülme efekti */
}

/* Aktif buton için stil */
.language-selector button.active {
    background-color: #4CAF50; /* Yeşil renk - aktif butonun rengi */
    transform: scale(1); /* Aktif buton büyümesin */
}

/* Responsive ayarlar */
@media screen and (max-width: 768px) {
    .language-selector {
        flex-wrap: wrap; /* Daha küçük ekranlarda butonları alt alta alabilir */
        justify-content: center; /* Tam merkezleme */
        gap: 10px;
        margin: 10px 0; /* Kenar boşluklarını azaltır */
    }

    .language-selector button {
        width: 80%; /* Mobil cihazlarda genişliği artırır */
        font-size: 16px; /* Daha okunabilir bir boyut */
        padding: 10px 20px; /* Daha geniş tıklama alanı */
    }

    .language-selector button {
        margin-right: 30px;
    }
}