/* ========================================================== */
/* ========== SENİN ORİJİNAL SİTE KODLARIN (DOKUNULMADI) ========== */
/* ========================================================== */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');

:root {
--birincil-renk: #28a745;
--kirmizi-renk: #dc3545;
--arka-plan: #000000;
--kutu-arka-plan: #000000;
--ikincil-renk: #1a1a1a;
--metin-renk: #a9a9a9;
--baslik-renk: #f5f5f5;
--kenarlik-renk: #000000;
--golge: 0 4px 20px rgba(0, 0, 0, 0.5);
}

* { margin: 0; padding: 0; box-sizing: border-box; text-decoration: none; list-style: none; }

html, body { 
    font-family: 'Poppins', sans-serif; 
    background-color: var(--arka-plan); 
    color: var(--metin-renk); 
    line-height: 1.6; 
    overflow-x: hidden; 
}

.konteyner { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

#ana-header { background: var(--kutu-arka-plan); padding: 0.8rem 0; border-bottom: 1px solid #2f2f2f; position: sticky; top: 0; z-index: 1000; }
.header-konteyner { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; }
.logo { font-size: 1.4rem; font-weight: 700; color: var(--birincil-renk); flex-shrink: 0; }
.logo .logo-man { color: var(--kirmizi-renk); }
.header-nav { flex-grow: 1; min-width: 0; }
.header-nav ul { display: flex; justify-content: center; gap: 1.8rem; padding: 0; margin: 0; flex-wrap: nowrap; }
.header-nav a { color: var(--metin-renk); font-weight: 500; font-size: 0.95rem; transition: color 0.3s ease; white-space: nowrap; }
.header-nav a:hover { color: var(--birincil-renk); }
.user-actions { display: flex; align-items: center; gap: 0.8rem; flex-shrink: 0; white-space: nowrap; }
.welcome-link { text-decoration: none; }
.welcome-link .welcome-msg { color: var(--metin-renk); font-weight: 500; font-size: 0.9rem; transition: color 0.3s ease; }
.welcome-link:hover .welcome-msg { color: var(--birincil-renk); }

.btn { padding: 8px 15px; border-radius: 5px; font-weight: 600; transition: all 0.3s ease; border: 1px solid transparent; font-size: 0.9rem; white-space: nowrap; cursor: pointer; }
.btn-birincil { background-color: var(--birincil-renk); color: white; border-color: var(--birincil-renk); }
.btn-birincil:hover { opacity: 0.9; }
.btn-ikincil { background-color: transparent; color: var(--metin-renk); border-color: #444; }
.btn-ikincil:hover { background-color: var(--ikincil-renk); border-color: var(--ikincil-renk); }
.btn-admin { border-color: var(--kirmizi-renk) !important; color: var(--kirmizi-renk) !important; }
.btn-admin:hover { background-color: rgba(220, 53, 69, 0.1) !important; }
.btn-buyuk { font-size: 1.1rem; padding: 15px 30px; }

.slider { 
    width: 100%; 
    max-height: 500px; 
    position: relative; 
    overflow: hidden; 
    margin-top: 40px; 
    aspect-ratio: 16 / 9; 
}
.slides { 
    display: flex; 
    width: 300%; 
    height: 100%; 
    transition: transform 0.5s ease-in-out; 
}
.slide { width: 100%; height: 100%; }
.slide img { width: 100%; height: 100%; object-fit: cover; }

main { padding-bottom: 40px; }
.sayfa-basligi { text-align: center; padding-bottom: 40px; padding-top: 40px; }
.sayfa-basligi h1 { font-size: 2.8rem; margin-bottom: 10px; color: var(--baslik-renk); }
.sayfa-basligi p { font-size: 1.1rem; }
.hero { background-color: var(--kutu-arka-plan); text-align: center; padding: 100px 20px; border-radius: 10px; border: 1px solid var(--kenarlik-renk); margin-top: 40px; box-shadow: var(--golge); }
.hero h1 { font-size: 3rem; margin-bottom: 1rem; color: var(--baslik-renk); }
.hero p { font-size: 1.2rem; margin-bottom: 2rem; }
.kurslar { padding-top: 40px; }
.kurslar h2 { font-size: 2.5rem; margin-bottom: 3rem; text-align: center; color: var(--baslik-renk); }
.kurs-kartlari { display: flex; justify-content: center; gap: 2rem; flex-wrap: wrap; }
.kurs-karti-link { display: block; color: inherit; }
.kurs-karti { background: var(--kutu-arka-plan); border: 1px solid var(--kenarlik-renk); border-radius: 10px; box-shadow: var(--golge); overflow: hidden; text-align: left; width: 350px; transition: all 0.3s ease; height: 100%; display: flex; flex-direction: column;}
.kurs-karti:hover { transform: translateY(-10px); }
.kurs-karti img { width: 100%; height: 180px; object-fit: cover; display: block; }
.kurs-karti h3 { padding: 1.5rem 1.5rem 0.5rem 1.5rem; color: var(--baslik-renk); margin: 0;}
.kurs-karti .egitmen { padding: 0 1.5rem; font-size: 0.9rem; margin-bottom: auto; }
.kurs-karti .fiyat { padding: 1rem 1.5rem 1.5rem 1.5rem; font-size: 1.3rem; font-weight: 700; color: var(--birincil-renk); margin-top: 10px;}

.kurs-grid, .egitmen-grid, .degerler-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 2rem; padding-bottom: 40px; }
.kurs-karti-vitrin, .kurs-karti-derslerim, .egitmen-karti, .deger-karti { background: var(--kutu-arka-plan); border-radius: 10px; overflow: hidden; border: 1px solid var(--kenarlik-renk); box-shadow: var(--golge); transition: all 0.3s ease; height: 100%; display: flex; flex-direction: column; }
.kurs-karti-vitrin:hover, .kurs-karti-derslerim:hover, .egitmen-karti:hover { transform: translateY(-10px); }
.kart-icerik { padding: 25px; display: flex; flex-direction: column; flex-grow: 1; }
.kart-icerik h3 { color: var(--baslik-renk); margin-bottom: 10px; font-size: 1.4rem; }
.kart-icerik p { color: var(--metin-renk); margin-bottom: 20px; flex-grow: 1; line-height: 1.5; font-size: 0.9rem;}
.kart-icerik .btn { width: 100%; text-align: center; margin-top: auto; }
.kategori { display: inline-block; background-color: var(--birincil-renk); color: #fff; padding: 4px 10px; border-radius: 20px; font-size: 0.8rem; font-weight: 600; margin-bottom: 15px; align-self: flex-start; }
.kurs-karti-vitrin img { width: 100%; height: 180px; object-fit: cover; display: block; }
.kurs-karti-vitrin .kart-icerik .fiyat { font-size: 1.5rem; font-weight: 700; color: var(--baslik-renk); margin-top: auto;}

.egitmen-karti { padding: 30px; text-align: center; }
.egitmen-karti img { width: 150px; height: 150px; object-fit: cover; border-radius: 50%; border: 4px solid var(--ikincil-renk); margin-bottom: 20px; }
.egitmen-karti h3 { font-size: 1.5rem; color: var(--baslik-renk); margin-bottom: 5px; }
.egitmen-karti .unvan { font-size: 1rem; color: var(--birincil-renk); font-weight: 600; margin-bottom: 15px; }
.egitmen-karti .biyografi { font-size: 0.9rem; color: var(--metin-renk); line-height: 1.5; }

.hakkimizda-icerik { padding: 40px 0; overflow-wrap: break-word; word-wrap: break-word; hyphens: auto; color: var(--metin-renk); line-height: 1.7; }
.hakkimizda-icerik p { margin-bottom: 1rem; }
.hakkimizda-icerik ul, .hakkimizda-icerik ol { margin-bottom: 1rem; padding-left: 30px; }
.hakkimizda-icerik li { margin-bottom: 0.5rem; }
.hakkimizda-icerik a { color: var(--birincil-renk); text-decoration: underline; }
.hakkimizda-icerik a:hover { opacity: 0.8; }
.hakkimizda-icerik img { max-width: 100%; height: auto; border-radius: 10px; margin: 25px auto; display: block; box-shadow: var(--golge); }

.degerlerimiz { padding: 80px 0; text-align: center; }
.degerlerimiz h2 { font-size: 2.5rem; margin-bottom: 3rem; color: var(--baslik-renk); }
.degerler-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem; }
.deger-karti { background: var(--kutu-arka-plan); padding: 30px; border-radius: 10px; border: 1px solid var(--kenarlik-renk); }
.deger-karti h3 { color: var(--birincil-renk); margin-bottom: 15px; }
.deger-karti p { color: var(--metin-renk); }

.yasal-icerik { padding: 40px 0; line-height: 1.8; color: var(--metin-renk); }
.yasal-icerik h2 { margin-top: 30px; margin-bottom: 15px; color: var(--baslik-renk); border-bottom: 1px solid var(--kenarlik-renk); padding-bottom: 10px;}
.yasal-icerik h3 { margin-top: 20px; margin-bottom: 10px; color: var(--baslik-renk); }
.yasal-icerik ul { padding-left: 30px; margin-bottom: 15px; }
.yasal-icerik li { margin-bottom: 8px; }

.bonus-indir { background-color: var(--kutu-arka-plan); border: 1px solid var(--kenarlik-renk); border-left: 5px solid var(--birincil-renk); padding: 25px; border-radius: 10px; margin: 40px 0; text-align: center; }
.bonus-indir h3 { margin-top: 0; margin-bottom: 15px; color: var(--baslik-renk); }
.bonus-indir p { margin: 0; color: var(--metin-renk); font-size: 1.1rem; }
.bonus-indir a { color: var(--kirmizi-renk); font-weight: bold; text-decoration: underline; transition: opacity 0.3s ease; }
.bonus-indir a:hover { opacity: 0.8; }

.izleme-konteyner { display: flex; max-width: 1400px; margin: 40px auto; gap: 30px; padding: 0 20px; }
.video-alani { flex-grow: 1; background-color: var(--arka-plan); border: 1px solid var(--kenarlik-renk); border-radius: 10px; padding: 30px; box-shadow: var(--golge); }
.video-alani h1 { font-size: 2rem; color: var(--baslik-renk); margin-top: 0; margin-bottom: 20px; }
.video-alani video { width: 100%; height: auto; display: block; border-radius: 5px; background-color: #000; }
.video-aciklama { margin-top: 25px; color: var(--metin-renk); line-height: 1.7; border-top: 1px solid var(--kenarlik-renk); padding-top: 20px; }
.ders-listesi { width: 350px; flex-shrink: 0; background-color: var(--kutu-arka-plan); border: 1px solid var(--kenarlik-renk); border-radius: 10px; padding: 20px; height: fit-content; box-shadow: var(--golge); }
.ders-listesi h3 { margin-top: 0; margin-bottom: 20px; color: var(--baslik-renk); border-bottom: 1px solid var(--kenarlik-renk); padding-bottom: 15px; font-size: 1.3rem; }
.ders-listesi ul { list-style: none; padding: 0; margin: 0; max-height: 60vh; overflow-y: auto; }
.ders-listesi li a { display: block; padding: 12px 15px; color: var(--metin-renk); text-decoration: none; border-radius: 5px; margin-bottom: 5px; transition: background-color 0.2s ease, color 0.2s ease; }
.ders-listesi li a:hover { background-color: var(--ikincil-renk); color: var(--baslik-renk); }
.ders-listesi li.aktif a { background-color: var(--birincil-renk); color: white; font-weight: bold; }

.hesap-konteyner { max-width: 700px; }
.hesap-bolumu { background-color: var(--kutu-arka-plan); border: 1px solid var(--kenarlik-renk); padding: 30px; border-radius: 10px; margin-bottom: 30px; box-shadow: var(--golge); }
.hesap-bolumu h2 { margin-top: 0; margin-bottom: 25px; color: var(--baslik-renk); border-bottom: 1px solid var(--kenarlik-renk); padding-bottom: 15px; }
.hesap-bolumu .form-grup label { color: var(--metin-renk); font-weight: normal; font-size: 0.9rem; margin-bottom: 2px; }
.hesap-bolumu .form-grup p { color: var(--baslik-renk); font-size: 1.1rem; margin: 0 0 15px 0; }
.hesap-bolumu form .form-grup label { font-size: 1rem; font-weight: bold; margin-bottom: 8px; color: var(--baslik-renk); }
.hesap-bolumu form input[type="password"] { background-color: #0d0d0d; color: var(--metin-renk); border: 1px solid var(--kenarlik-renk); }
.hesap-bolumu form button { margin-top: 10px; }
.eposta-dogrulama p { color: var(--metin-renk); margin-bottom: 15px; }
.eposta-dogrulama.pasif p em { color: #6c757d; }
.eposta-dogrulama button:disabled { opacity: 0.5; cursor: not-allowed; }
.mesaj { padding: 15px; margin-bottom: 20px; border-radius: 5px; text-align: center; font-weight: bold; }
.mesaj.basari { background-color: rgba(40, 167, 69, 0.2); color: #28a745; border: 1px solid #28a745; }
.mesaj.hata { background-color: rgba(220, 53, 69, 0.1); color: #dc3545; border: 1px solid #dc3545; }

.form-konteyner { background-color: var(--kutu-arka-plan); border: 1px solid var(--kenarlik-renk); padding: 40px; border-radius: 10px; box-shadow: var(--golge); width: 100%; max-width: 450px; margin: 40px auto; }
.form-konteyner h1 { color: var(--baslik-renk); }
.form-grup input[type="text"], .form-grup input[type="email"], .form-grup input[type="password"] { background-color: #0d0d0d; color: var(--metin-renk); border: 1px solid var(--kenarlik-renk); width: 100%; padding: 12px; border-radius: 5px; font-size: 1rem; }
.form-grup input:focus { outline: none; border-color: var(--birincil-renk); }
.btn-tam-genislik { width: 100%; padding: 15px; font-size: 1.1rem; margin-top: 10px; }
.checkbox-grup { display: flex; align-items: center; font-size: 0.9rem; color: var(--metin-renk); }
.checkbox-grup input[type="checkbox"] { margin-right: 10px; width: auto; }
.checkbox-grup a { color: var(--birincil-renk); font-weight: 600; text-decoration: none; }
.checkbox-grup a:hover { text-decoration: underline; }
.ek-secenekler { display: flex; justify-content: space-between; align-items: center; font-size: 0.9rem; margin-bottom: 20px; color: var(--metin-renk); }
.sifremi-unuttum { color: var(--birincil-renk); font-weight: 600; text-decoration: none; }
.sifremi-unuttum:hover { text-decoration: underline; }
.hesap-varmi, .hesap-yok { text-align: center; margin-top: 25px; font-size: 0.95rem; color: var(--metin-renk); }
.hesap-varmi a.link-kirmizi, .hesap-varmi a.link-kirmizi:visited, .hesap-yok a { color: var(--kirmizi-renk) !important; font-weight: 600; text-decoration: none; }
.hesap-varmi a.link-kirmizi:hover, .hesap-yok a:hover { text-decoration: underline; opacity: 0.9; }
.hata-mesaji-genel { color: #dc3545; text-align: center; margin-bottom: 15px; font-weight: bold; background-color: rgba(220, 53, 69, 0.1); padding: 10px; border-radius: 5px; border: 1px solid #dc3545; }
.odeme-cercevesi { border: 2px dashed #555; padding: 40px; text-align: center; margin-top: 30px; margin-bottom: 20px; color: #aaa; border-radius: 10px; background-color: #0d0d0d; }
.test-onay { margin-top: 15px; font-size: 0.9rem; color: #ccc;}
.test-onay input { margin-right: 5px; }

footer { background: var(--arka-plan); color: var(--metin-renk); text-align: center; padding: 2rem 0; border-top: 1px solid #2f2f2f; }
footer .footer-konteyner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; }
footer .footer-linkler a { color: var(--metin-renk); text-decoration: none; margin-left: 15px; font-size: 0.9rem; }
footer .footer-linkler a:hover { color: var(--birincil-renk); text-decoration: underline; }
footer .footer-linkler span { color: #555; margin-left: 15px; }

/* === MASAÜSTÜ DOĞRULAMA UYARISI === */
.dogrulama-uyari {
background-color: #ffc107; 
color: #333; 
padding: 10px 0; 
text-align: center;
font-weight: 500;
font-size: 0.9rem;
border-bottom: 1px solid #e0a800;
position: sticky; /* Masaüstünde yapışkan */
top: 70px; /* Header'ın yüksekliğine göre ayarlı */
z-index: 999; 
}
.dogrulama-uyari .konteyner {
display: flex; 
justify-content: center; 
align-items: center;
position: relative; 
padding-left: 30px; 
padding-right: 30px;
}
.dogrulama-uyari a {
color: #0056b3; 
font-weight: bold;
text-decoration: underline;
}
.dogrulama-uyari .kapat-btn { 
background: none;
border: none;
color: #333;
font-size: 1.5rem; 
cursor: pointer;
padding: 0 10px;
line-height: 1;
position: absolute; /* Masaüstünde sağda */
right: 15px;
top: 50%;
transform: translateY(-50%); 
}
.dogrulama-uyari .kapat-btn:hover {
opacity: 0.7;
}

@media (max-width: 992px) {
.header-konteyner { flex-wrap: wrap; }
.header-nav { order: 3; width: 100%; margin-top: 1rem; }
.header-nav ul { justify-content: space-around; }
.user-actions { order: 2; }
.izleme-konteyner { flex-direction: column; margin-top: 20px; gap: 20px; }
.ders-listesi { width: 100%; max-height: none; overflow-y: visible; }
.video-alani { padding: 20px; }

.kurs-detay-konteyner { flex-direction: column; }
.satin-alma-kutusu { position: static; margin-top: 30px; }
}

@media (max-width: 768px) {
.footer-konteyner { flex-direction: column; text-align: center; }
.footer-linkler { margin-top: 10px; }
.footer-linkler a, .footer-linkler span { margin: 0 8px; }

    .sayfa-basligi h1 { font-size: 2.2rem; }
    .hero h1 { font-size: 2.5rem; }
    .kurslar h2, .degerlerimiz h2 { font-size: 2rem; }
    /* Detay modal mobil ayarı */
    .detay-modal-box { height: 100%; max-height: 100%; border-radius: 0; }
    .tv-img-kutusu { height: 160px; }
}

@media (max-width: 600px) {
    /* Genel Ayarlamalar */
    .konteyner { padding: 0 15px; } 

    /* HEADER (MOBİL) */
    #ana-header { padding: 0.6rem 0; }
    .header-konteyner { 
        flex-wrap: wrap; 
        gap: 0.5rem;
    }
    .logo { font-size: 1.2rem; order: 1; }
    .user-actions { 
        order: 2; 
        margin-left: auto; 
        flex-wrap: wrap; 
        justify-content: flex-end; 
        gap: 0.5rem;
    }
    .header-nav { 
        order: 3; 
        width: 100%; 
        margin-top: 0.5rem;
        padding-top: 0.5rem;
        border-top: 1px solid #2f2f2f;
        overflow-x: hidden; 
    }
    .header-nav ul { 
        flex-wrap: wrap; 
        justify-content: center; 
        gap: 1rem; 
        overflow: hidden; 
    }
    .header-nav a { font-size: 0.9rem; }
    .btn { padding: 6px 10px; font-size: 0.8rem; }
    
    /* SLIDER (MOBİL) */
    .slider { margin-top: 20px; }

    /* İÇERİK (MOBİL) */
    .sayfa-basligi { padding-bottom: 30px; padding-top: 30px; }
    .sayfa-basligi h1 { font-size: 1.8rem; }
    .sayfa-basligi p { font-size: 1rem; }
    .hero { padding: 60px 20px; margin-top: 20px; }
    .hero h1 { font-size: 2rem; }
    .hero p { font-size: 1rem; }
    .kurs-kartlari { gap: 1rem; }
    .kurs-karti { 
        width: 100%; 
        max-width: none; 
    } 
    .kurs-grid, .egitmen-grid, .degerler-grid { 
        grid-template-columns: 1fr; 
        gap: 1.5rem; 
    }
    .form-konteyner { padding: 25px; margin: 20px auto; }
    .video-alani { padding: 15px; }
    .video-alani h1 { font-size: 1.5rem; }

    
    /* === MOBİL DOĞRULAMA UYARISI (DÜZELTME) === */
    .dogrulama-uyari {
        position: static; /* Mobilde yapışkan değil, normal */
        top: auto;
    }
    .dogrulama-uyari .konteyner {
        flex-direction: row; 
        padding: 10px 15px; 
        justify-content: center;
        text-align: center;
    }
    .dogrulama-uyari .kapat-btn { 
        position: relative; /* Mobilde akışa dahil */
        right: auto;
        top: auto;
        transform: none; 
        margin-left: 10px; 
    }
}

/* === H TAGLARI === */
.hakkimizda-icerik h1, .yasal-icerik h1, .kurs-aciklama h1, .biyografi h1, .playlist-aciklama h1, .video-aciklama h1,
.hakkimizda-icerik h2, .yasal-icerik h2, .kurs-aciklama h2, .biyografi h2, .playlist-aciklama h2, .video-aciklama h2,
.hakkimizda-icerik h3, .yasal-icerik h3, .kurs-aciklama h3, .biyografi h3, .playlist-aciklama h3, .video-aciklama h3,
.hakkimizda-icerik h4, .yasal-icerik h4, .kurs-aciklama h4, .biyografi h4, .playlist-aciklama h4, .video-aciklama h4 { 
color: var(--baslik-renk) !important; 
}

/* ========================================================== */
/* ========= YENİ EKLENEN ÖZELLİKLER (SADECE BUNLAR) ========= */
/* ========================================================== */

/* 1. YORUM KARTI */
.yorumlar-bolumu { padding: 60px 0; text-align: center; border-top: 1px solid var(--kenarlik-renk); margin-top: 40px;}
.yorum-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 20px; margin-top: 30px; }

.tv-karti {
    background-color: var(--kutu-arka-plan); /* Siyah */
    border: 1px solid #2f2f2f; /* Hafif görünür çerçeve */
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.3s, box-shadow 0.3s;
    display: flex;
    flex-direction: column;
    text-align: left;
    height: 100%;
}

.tv-karti:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(40, 167, 69, 0.2); /* Yeşil Gölge */
    border-color: var(--birincil-renk);
}

.tv-img-kutusu {
    width: 100%;
    height: 180px;
    background-color: #000;
    overflow: hidden;
    position: relative;
}

.tv-img-kutusu img { width: 100%; height: 100%; object-fit: cover; }

.tv-icerik { padding: 20px; flex-grow: 1; display: flex; flex-direction: column; }

.tv-baslik {
    color: var(--baslik-renk);
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 10px;
    line-height: 1.4;
    word-break: break-word; 
    overflow-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tv-ozet {
    font-size: 0.9rem;
    color: var(--metin-renk);
    line-height: 1.6;
    margin-bottom: 15px;
    word-break: break-word;
    overflow-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tv-footer {
    margin-top: auto;
    border-top: 1px solid var(--kenarlik-renk);
    padding-top: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.85rem;
}

.tv-yazar { font-weight: 600; color: var(--birincil-renk); }
.tv-begeni-stat { color: var(--metin-renk); display: flex; align-items: center; gap: 5px; }

/* 2. PENCERE İÇİ BEĞENİ BUTONU */
.btn-begen-modal {
    background: none;
    border: 1px solid var(--kenarlik-renk);
    color: var(--metin-renk);
    padding: 8px 15px;
    border-radius: 20px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: 0.2s;
    font-size: 1rem;
    margin-top: 10px;
}
.btn-begen-modal:hover { border-color: var(--kirmizi-renk); color: var(--kirmizi-renk); }
.btn-begen-modal.begenildi { background-color: rgba(220, 53, 69, 0.1); border-color: var(--kirmizi-renk); color: var(--kirmizi-renk); }

/* 3. SABİT BUTONLAR */
.sabit-butonlar-kapsayici { position: fixed; bottom: 20px; right: 20px; z-index: 9999; display: flex; flex-direction: column; gap: 15px; align-items: flex-end; }
.yuvarlak-btn { width: 60px; height: 60px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: white; font-size: 1.8rem; box-shadow: 0 4px 15px rgba(0,0,0,0.5); transition: transform 0.3s; text-decoration: none; position: relative; }
.yuvarlak-btn:hover { transform: scale(1.1); }
.whatsapp-btn { background-color: #25D366; }
.yorum-btn { background-color: var(--birincil-renk); width: 50px; height: 50px; font-size: 1.4rem; }
.btn-tooltip { position: absolute; right: 70px; background-color: #333; color: #fff; padding: 5px 10px; border-radius: 5px; font-size: 0.8rem; white-space: nowrap; opacity: 0; transition: opacity 0.3s; pointer-events: none; }
.yuvarlak-btn:hover .btn-tooltip { opacity: 1; }

/* 4. DETAY PENCERESİ (MODAL) - GİZLİ BAŞLA */
.detay-modal-overlay {
    display: none; 
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0,0,0,0.95);
    z-index: 20000;
    justify-content: center;
    align-items: center;
    padding: 20px;
    backdrop-filter: blur(5px);
}

.detay-modal-box {
    background: var(--kutu-arka-plan);
    width: 100%; max-width: 800px; max-height: 90vh;
    border-radius: 10px;
    border: 1px solid var(--kenarlik-renk);
    display: flex; flex-direction: column;
    overflow: hidden;
    position: relative;
    box-shadow: 0 0 30px rgba(40, 167, 69, 0.2);
    animation: zoomIn 0.3s ease;
}

.detay-scroll-area { overflow-y: auto; padding: 0; }
.detay-resim { width: 100%; height: auto; max-height: 450px; object-fit: contain; background: #000; border-bottom: 1px solid var(--kenarlik-renk); }
.detay-icerik { padding: 30px; }
.detay-baslik { color: var(--birincil-renk); font-size: 1.6rem; margin-bottom: 15px; font-weight: bold; line-height: 1.3; word-break: break-word; }
.detay-metin { font-size: 1.1rem; color: #dcdcdc; line-height: 1.8; white-space: pre-wrap; word-break: break-word; }
.detay-footer { margin-top: 30px; padding-top: 20px; border-top: 1px solid var(--kenarlik-renk); display: flex; justify-content: space-between; align-items: center; color: #777; }
.detay-kapat, .modal-kapat { position: absolute; top: 15px; right: 15px; background: rgba(0,0,0,0.6); color: #fff; width: 40px; height: 40px; border-radius: 50%; border:none; font-size: 24px; cursor: pointer; z-index: 10; display:flex; align-items:center; justify-content:center; }
.detay-kapat:hover { background: var(--kirmizi-renk); }

/* 5. YORUM EKLEME KUTUSU */
.modal-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 10000; align-items: center; justify-content: center; }
.modal-box { background: var(--kutu-arka-plan); padding: 30px; border-radius: 10px; border: 1px solid var(--kenarlik-renk); width: 90%; max-width: 500px; position: relative; box-shadow: 0 10px 30px rgba(0,0,0,0.5); }
.modal-kapat { position: absolute; top: 10px; right: 15px; font-size: 2rem; cursor: pointer; color: #fff; }
.form-grup { margin-bottom: 15px; }
.form-grup label { display: block; margin-bottom: 5px; color: #aaa; }
.form-grup textarea { width: 100%; background: #0d0d0d; border: 1px solid #333; color: #fff; padding: 12px; border-radius: 5px; font-family: inherit; font-size: 1rem; }

@keyframes zoomIn { from { transform: scale(0.8); opacity: 0; } to { transform: scale(1); opacity: 1; } }
/* ================================================= */
/* === MODAL KAYDIRMA ÇUBUĞUNU GİZLEME (NO-SCROLLBAR) === */
/* ================================================= */

/* Firefox için gizle */
.detay-scroll-area {
    scrollbar-width: none;
    -ms-overflow-style: none;  /* IE ve Edge için */
}

/* Chrome, Safari ve Opera için gizle */
.detay-scroll-area::-webkit-scrollbar {
    display: none;
}
/* Başlık Link Stili */
.sayfa-basligi a {
    color: inherit; /* Rengi babasından (h2) alsın */
    text-decoration: none;
    transition: color 0.3s ease;
}

.sayfa-basligi a:hover {
    color: var(--birincil-renk); /* Üstüne gelince yeşil olsun */
}

/* Mobilde başlık biraz daha belirgin olsun */
@media (max-width: 768px) {
    .sayfa-basligi a {
        border-bottom: 2px solid var(--birincil-renk); /* Mobilde link olduğu belli olsun */
    }
}
/* Başlık Link Düzeltmesi */
.sayfa-basligi h2 a {
    color: var(--baslik-renk) !important; /* Rengi zorla başlık rengi yap */
    font-size: inherit !important; /* Boyutu babasından (h2) al */
    font-weight: inherit !important; /* Kalınlığı babasından al */
    text-decoration: none !important; /* Alt çizgiyi kaldır */
    transition: color 0.3s ease;
}

.sayfa-basligi h2 a:hover {
    color: var(--birincil-renk) !important; /* Üstüne gelince yeşil olsun */
    cursor: pointer;
}

/* Yanındaki ok işareti için */
.sayfa-basligi h2 a span {
    display: inline-block;
    transition: transform 0.3s ease;
}

.sayfa-basligi h2 a:hover span {
    transform: translateX(5px); /* Ok işareti sağa kaysın */
}