/* Genel Ayarlar ve Karanlık Tema */
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Poppins", sans-serif;
}

/* Birleştirilmiş ve düzeltilmiş Ana Body Kuralı */
body {
    font-family: "Poppins", sans-serif;
    margin: 0;
    padding: 0;
    background-color: #1a1a1a; /* Koyu arka plan */
    color: #f0f0f0; /* Açık renk yazı */
    overflow-y: auto; /* Sayfanın kaydırılmasına izin verir */
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

/* Üst Menü (Navbar) */
.navbar {
    background-color: #252525;
    border-bottom: 1px solid #444;
    padding: 10px 0;
}

.navbar .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo {
    font-size: 24px;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
}

.navbar nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.navbar nav li {
    display: inline-block;
    margin-left: 20px;
}

.navbar nav a {
    color: #ccc;
    text-decoration: none;
    font-size: 16px;
}

.navbar nav a:hover {
    color: #fff;
}

/* Sayfa Başlığı */
h1 {
    text-align: center;
    margin-bottom: 40px;
}

/* Footer */
footer {
    text-align: center;
    padding: 30px;
    margin-top: 40px;
    background-color: #252525;
    color: #888;
    font-size: 14px;
}

/* Küçük ekranlar için (Mobil Uyumluluğu) */
@media (max-width: 480px) {
    .navbar .container {
        flex-direction: column;
    }
}

/* --- FLIPBOOK STİLLERİ --- */

/* Kitabı ortalamak için bir sarmalayıcı ve Logo Gizleme için konumlandırma */
.flipbook-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px 0;
    margin-top: 20px;
    margin-bottom: 20px;
    position: relative; 
}

/* Kitabın kendisi */
.flipbook {
    width: 1000px;
    height: 300px;
    max-width: 100%;
}

.flipbook .page {
    background: rgb(255, 255, 255);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0px;
    border: 0px solid rgba(0, 0, 0, 0.11);
    color: #333; 
}

.flipbook .hard {
    color: #fff;
    font-weight: bold;
    border: none;
    font-size: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

/*
 * ==================================================================
 * === VARSAYILAN (PC) AYARI: TÜM RESİMLERİ KIRPARAK KAPLA ===
 * ==================================================================
 */
.flipbook .page img,
.flipbook .hard img {
    width: 100%;
    height: 100%; 
    object-fit: cover; /* Varsayılan 'cover' (Kırp) */
}
/* ================================================================== */


.flipbook .page small {
    font-size: 14px;
    margin-bottom: 10px;
    color: #555;
}


/* Flipbook Navigasyon Buton Stilleri */

.nav-button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1000;
    background-color: rgba(0, 0, 0, 0.4);
    color: #f0f0f0;
    border: 1px solid #555;
    font-family: "Poppins", sans-serif;
    font-size: 28px;
    font-weight: bold;
    padding: 15px 10px;
    cursor: pointer;
    opacity: 0.6;
    transition: all 0.3s ease;
    border-radius: 5px;
    line-height: 1;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.nav-button:hover {
    background-color: rgba(0, 0, 0, 0.7);
    opacity: 1;
}

/* Masaüstü Buton Konumlandırması (GÜNCELLENDİ) */
#prev-page {
    left: 50%;
    margin-left: -560px; /* Dışarı alındı */
}

#next-page {
    right: 50%;
    margin-right: -560px; /* Dışarı alındı */
}


/* --- MOBİL İÇİN NAV BUTON AYARLARI --- */

@media (max-width: 1050px) { 
    #prev-page {
        left: 10px;
        margin-left: 0;
    }

    #next-page {
        right: 10px;
        margin-right: 0;
    }
}

@media (max-width: 767px) {
    .nav-button {
        font-size: 20px;
        padding: 10px 8px;
    }
    
    #prev-page {
        left: 0px; 
    }

    #next-page {
        right: 0px;
    }

    .flipbook-wrapper {
        padding: 20px 0;
    }
    
    /* * ==================================================================
     * === MOBİL KIRPMA SORUNU ÇÖZÜMÜ BURADA ===
     * ==================================================================
     * SADECE İÇ SAYFALARI (Kapaklar Hariç) 'contain' (Sığdır) yap.
     */
    .flipbook .page img {
        object-fit: contain; 
    }
    /* Kapaklar (.hard img) 'cover' olarak kalmaya devam edecek. */
    /* ================================================================== */
}


/* --- HAKKIMDA VE İLETİŞİM STİLLERİ (Diğer sayfalar için) --- */
.about-content {
    max-width: 800px; 
    margin: 40px auto; 
    background-color: #252525; 
    padding: 30px 40px; 
    border-radius: 8px; 
    border: 1px solid #333; 
}
.about-content p { margin-bottom: 1.5em; line-height: 1.7; color: #ccc; }
.about-content p:last-child { margin-bottom: 0; }
.about-content ul { list-style-position: inside; margin-top: 1.5em; line-height: 1.8; }
.about-content li { margin-bottom: 0.5em; }
.contact-form-wrapper { max-width: 700px; margin: 40px auto; background-color: #252525; padding: 30px 40px; border-radius: 8px; border: 1px solid #333; }
.form-description { text-align: center; color: #ccc; margin-bottom: 30px; line-height: 1.6; }
.contact-form { display: flex; flex-direction: column; gap: 20px; }
.form-group { display: flex; flex-direction: column; }
.form-group label { margin-bottom: 8px; color: #f0f0f0; font-weight: 500; }
.form-group input[type="text"], .form-group input[type="email"], .form-group textarea { width: 100%; padding: 12px; background-color: #1a1a1a; border: 1px solid #444; border-radius: 5px; color: #f0f0f0; font-family: "Poppins", sans-serif; font-size: 16px; transition: border-color 0.3s, box-shadow 0.3s; }
.form-group input[type="text"]:focus, .form-group input[type="email"]:focus, .form-group textarea:focus { outline: none; border-color: #fff; box-shadow: 0 0 8px rgba(255, 255, 255, 0.2); }
.form-group textarea { resize: vertical; min-height: 120px; }
.submit-button { background-color: #fff; color: #1a1a1a; border: none; padding: 15px; font-size: 16px; font-weight: 600; font-family: "Poppins", sans-serif; border-radius: 5px; cursor: pointer; transition: background-color 0.3s, color 0.3s; width: 100%; margin-top: 10px; }
.submit-button:hover { background-color: #ccc; color: #000; }
@media (max-width: 768px) {
    .contact-form-wrapper { max-width: 90%; margin: 20px auto; padding: 20px; }
}

/* Dil Değiştirici Stilleri */
.navbar nav { display: flex; align-items: center; gap: 30px; }
.navbar nav ul { list-style: none; margin: 0; padding: 0; }
.navbar nav li { display: inline-block; margin-left: 20px; }
.lang-switcher { margin: 0; padding: 0; display: flex; align-items: center; }
.lang-switcher li { margin-left: 8px; font-size: 14px; font-weight: 500; }
.lang-switcher a { color: #888; text-decoration: none; transition: color 0.3s; }
.lang-switcher a:hover { color: #fff; }
.lang-switcher a.active { color: #fff; font-weight: 700; cursor: default; }
.lang-switcher span { color: #555; margin-left: -4px; margin-right: -4px; }
.navbar nav > ul > li { display: inline-block; margin-left: 20px;}
.navbar nav > ul > li:first-child { margin-left: 0;}


/* --- GENEL BÜYÜTME BUTONU STİLLERİ --- */

#global-zoom-button {
    position: absolute;
    top: -5px; 
    right: 50%;
    margin-right: -515px; 
    z-index: 1001; 

    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: opacity 0.3s;
}

#global-zoom-button:hover {
    opacity: 0.8;
}

#global-zoom-button img {
    width: 30px; 
    height: 30px;
    display: block;
    border-radius: 5px; 
}

/* --- MOBİL UYUM İÇİN BUTON KONUMU --- */
@media (max-width: 1050px) { 
    #global-zoom-button {
        right: 10px;
        top: 20px;
        margin-right: 0;
    }
}


/* --- LIGHTBOX MODAL STİLLERİ --- */

.lightbox-modal {
    display: none; 
    position: fixed; 
    z-index: 9999; 
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    background-color: rgba(0, 0, 0, 0.9); 
    justify-content: center;
    align-items: center;
}

.lightbox-content {
    margin: auto;
    display: block;
    width: 90%; 
    max-width: 1000px; 
    max-height: 90vh; 
    object-fit: contain; 
    animation-name: zoom;
    animation-duration: 0.6s;
}

.lightbox-close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
    cursor: pointer;
    z-index: 10001; /* Navigasyonun üstünde */
}

.lightbox-close:hover,
.lightbox-close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

/* --- ŞIK LIGHTBOX NAVİGASYON BUTONLARI (DIŞARI ALINDI) --- */

.lightbox-nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    
    /* Yeni görünüm */
    background-color: rgba(255, 255, 255, 0.1); 
    color: #FFFFFF; 
    border: 1px solid rgba(255, 255, 255, 0.3); 
    border-radius: 50%; /* Tam yuvarlak */
    
    /* Boyutlandırma */
    width: 50px;
    height: 50px;
    font-size: 24px; 
    font-weight: bold;
    line-height: 48px; 
    text-align: center; 
    
    cursor: pointer;
    z-index: 10000;
    transition: background-color 0.3s, opacity 0.3s;
    opacity: 0.7; 
    
    user-select: none;
    -webkit-user-select: none;
}

.lightbox-nav-btn:hover {
    background-color: rgba(255, 255, 255, 0.3); 
    opacity: 1;
}

#lightbox-prev {
    left: 5vw; /* Ekranın sol kenarından %5 boşluk */
}

#lightbox-next {
    right: 5vw; /* Ekranın sağ kenarından %5 boşluk */
}


@keyframes zoom {
    from {transform: scale(0.5)} 
    to {transform: scale(1)}
}

/* --- ORTA ÇİZGİ İSTEK ÜZERİNE KALDIRILDI --- */
/*
.flipbook-wrapper::after {
    content: ''; 
    position: absolute; 
    left: 50%;
    top: 0;
    bottom: 0;
    width: 2px; 
    background-color: #333; 
    transform: translateX(-50%);
    z-index: 999;
    pointer-events: none; 
}
*/