/*
 Theme Name:   GeneratePress Child - İlim Saati Atöyelesi
 Theme URI:    https://www.ilimsaati.com
 Description:  İlim Saati projesi için Dilaver Hocam ve yol arkadaşı tarafından özenle hazırlanan, ışık hızında ve esnek GeneratePress Çocuk Teması.
 Author:       Dilaver Hocam & Dostu
 Author URI:   https://www.ilimsaati.com
 Template:     generatepress
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  generatepress_child
*/

/* ================================================================
 * [BAŞLANGIÇ] İlim Saati v2 - Gece ve Işık Temel Stilleri
 * ================================================================ */

/* Kök Değişkenler: Sitemizin tüm görsel kimliği bu bloktan yönetilir. */
:root {
    --zenhar-zemin-koyu: #111827;
    --zenhar-kutu-koyu: #1F2937;
    --zenhar-yazi-ana: #D1D5DB;
    --zenhar-yazi-baslik: #F9FAFB;
    --zenhar-isik: #2DD4BF;
    --zenhar-isik-koyu: #14B8A6;
    --zenhar-altin: #F59E0B;
    --zenhar-gri-cizgi: #374151;
}

/* Genel Gövde Ayarları */
body {
    background-color: var(--zenhar-zemin-koyu);
    color: var(--zenhar-yazi-ana);
    font-family: 'Inter', sans-serif;
    line-height: 1.8;
    -webkit-font-smoothing: antialiased;
}

/* Tipografi */
h1,
h2,
h3,
h4,
h5,
h6,
.entry-title,
.entry-title a {
    font-family: 'Merriweather', serif;
    color: var(--zenhar-yazi-baslik);
}

a {
    color: var(--zenhar-isik);
    text-decoration: none;
    transition: all 0.3s ease;
}

a:hover {
    color: var(--zenhar-isik-koyu);
    text-decoration: underline;
}

/* Ana İçerik Alanı */
.site-main {
    background-color: var(--zenhar-kutu-koyu);
    padding: 30px;
    border-radius: 10px;
    border: 1px solid var(--zenhar-gri-cizgi);
}

/* ================================================================
 * [BİTİŞ] İlim Saati v2 - Gece ve Işık Temel Stilleri
 * ================================================================ */


/* ================================================================
 * [BAŞLANGIÇ] ZeNHaR Ayar Paneli - Topbar Stili
 * ================================================================ */
.ilimsaati-topbar {
    background-color: var(--zenhar-altin);
    color: var(--zenhar-zemin-koyu);
    padding: 8px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.5px;
}

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

/* ================================================================
 * [BİTİŞ] ZeNHaR Ayar Paneli - Topbar Stili
 * ================================================================ */


/* ================================================================
 * [BAŞLANGIÇ] Genel Site Yerleşimi
 * ================================================================ */
.grid-container {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
}

.page-header {
    margin-bottom: 40px;
}

/* ================================================================
 * [BİTİŞ] Genel Site Yerleşimi
 * ================================================================ */

/* ================================================================
 * [BAŞLANGIÇ] Anasayfa Hero (Giriş) Bölümü Stilleri
 * ================================================================ */
.zenhar-hero {
    padding: 100px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
}

.zenhar-hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path d="M12.5 0 L12.5 12.5 L0 12.5 M87.5 0 L87.5 12.5 L100 12.5 M12.5 100 L12.5 87.5 L0 87.5 M87.5 100 L87.5 87.5 L100 87.5 M0 37.5 L12.5 37.5 L12.5 62.5 L0 62.5 M100 37.5 L87.5 37.5 L87.5 62.5 L100 62.5 M37.5 0 L37.5 12.5 L62.5 12.5 L62.5 0 M37.5 100 L37.5 87.5 L62.5 87.5 L62.5 100" fill="none" stroke="rgba(55, 65, 81, 0.5)" stroke-width="2"/></svg>');
    opacity: 0.2;
    z-index: 1;
}

.zenhar-hero .grid-container {
    position: relative;
    z-index: 2;
}

.zenhar-hero h1 {
    font-size: 52px;
    margin-bottom: 20px;
    text-shadow: 0 0 20px rgba(45, 212, 191, 0.2);
}

.zenhar-hero h1 span {
    color: var(--zenhar-isik);
}

.zenhar-hero p {
    font-size: 20px;
    max-width: 700px;
    margin: 0 auto 40px;
    color: var(--zenhar-yazi-ana);
}

/* ================================================================
 * [BİTİŞ] Anasayfa Hero (Giriş) Bölümü Stilleri
 * ================================================================ */

/* ================================================================
 * [BAŞLANGIÇ] Buton Stilleri (Süper Parlama Versiyonu)
 * ================================================================ */

/* Tüm butonlar için temel stil */
.button,
a.button,
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    background-color: var(--zenhar-isik);
    color: var(--zenhar-zemin-koyu) !important;
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    border-radius: 8px;
    border: none;
    padding: 12px 24px;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
    cursor: pointer;
    line-height: 1.5;
    box-shadow: 0 0 25px rgba(45, 212, 191, 0.4);
}

/* Çœzerine gelinceki efekt */
.button:hover,
a.button:hover,
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
    background-color: var(--zenhar-isik-koyu);
    color: var(--zenhar-zemin-koyu) !important;
    text-decoration: none;
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 0 35px rgba(45, 212, 191, 0.6);
}

/* Hero bölümündeki daha büyük ve gösterişli butonumuz için özel ayarlar */
.zenhar-hero .zenhar-hero-btn {
    padding: 16px 40px;
    font-size: 18px;
}

/* ================================================================
 * [BİTİŞ] Buton Stilleri (Süper Parlama Versiyonu)
 * ================================================================ */

/* ================================================================
 * [BAŞLANGIÇ] Anasayfa Öne Çıkan Kartlar Stilleri
 * ================================================================ */
.zenhar-features {
    padding: 80px 0;
    background-color: var(--zenhar-zemin-koyu);
}

.section-title {
    text-align: center;
    margin-bottom: 60px;
    font-size: 36px;
    color: var(--zenhar-yazi-baslik);
}

.section-title span {
    color: var(--zenhar-altin);
}

.zenhar-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    align-items: stretch;
    /* Tüm kartları aynı yükseklikte yap */
}

.card {
    background: var(--zenhar-kutu-koyu);
    padding: 40px;
    /* Tüm kartlarda aynı */
    border-radius: 15px;
    position: relative;
    overflow: hidden;
    transition: all 0.4s ease;
    border: 1px solid var(--zenhar-gri-cizgi);
    /* Tüm kartlarda aynı */
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 300px;
}

.card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 15px;
    padding: 2px;
    background: linear-gradient(135deg, var(--zenhar-isik), var(--zenhar-altin));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.card:hover {
    transform: translateY(-10px);
    border-color: transparent;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.3);
}

.card:hover::before {
    opacity: 1;
}

.card-icon {
    font-size: 32px;
    color: var(--zenhar-isik);
    margin-bottom: 25px;
    display: inline-block;
    background: var(--zenhar-gri-cizgi);
    width: 70px;
    height: 70px;
    line-height: 70px;
    text-align: center;
    border-radius: 50%;
}

.card h3 {
    font-size: 24px;
    margin-bottom: 15px;
    color: var(--zenhar-yazi-baslik);
}

.card a {
    color: var(--zenhar-altin);
    font-weight: 500;
    margin-top: 20px;
    display: inline-block;
}

.card a:hover {
    text-decoration: underline;
    color: var(--zenhar-altin);
}

/* ================================================================
 * [BİTİŞ] Anasayfa Öne Çıkan Kartlar Stilleri
 * ================================================================ */


/* ================================================================
 * [BAŞLANGIÇ] Özel Footer (Alt Bilgi) Stilleri (v3 - Kompakt Tasarım)
 * ================================================================ */

.zenhar-footer {
    background-color: var(--zenhar-kutu-koyu);
    color: var(--zenhar-yazi-ana);
    border-top: 1px solid var(--zenhar-gri-cizgi);
    padding-top: 1px;
    font-size: 15px;
}

.footer-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding-bottom: 1px;
}

.footer-branding .footer-text {
    margin-top: 5px;
    max-width: 100%;
    font-size: 14px;
    color: var(--zenhar-yazi-ana);
    margin-bottom: 10px;
}

.footer-navigation {
    margin-top: 1px;
}

.footer-menu {
    list-style: none;
    padding-left: 0;
    margin: 0 auto 10px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px 25px;
    width: 100%;
    max-width: 600px;
}

.footer-menu a {
    color: var(--zenhar-yazi-ana);
    text-decoration: none;
    font-size: 13px;
    transition: color 0.3s;
    position: relative;
    padding-bottom: 5px;
}

.footer-menu a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(135deg, #667eea, #764ba2);
    transform: scaleX(0);
    transition: transform 0.3s ease-out;
}

.footer-menu a:hover {
    color: var(--zenhar-yazi-ana);
}

.footer-menu a:hover::after {
    transform: scaleX(1);
}

.site-info {
    background-color: var(--zenhar-zemin-koyu);
    padding: 5px 0;
    text-align: center;
    font-size: 14px;
    color: var(--zenhar-yazi-ana);
    border-top: 1px solid var(--zenhar-gri-cizgi);
}

/* ================================================================
 * [BİTİŞ] Özel Footer (Alt Bilgi) Stilleri (v3 - Kompakt Tasarım)
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] Tam Ekran Arama Paneli (Overlay) Stilleri
 * ================================================================ */

/* Panel açıldığında arka planın kaymasını engelle */
body.search-overlay-is-active {
    overflow: hidden;
}

/* Arama panelinin ana katmanı */
.zenhar-search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(17, 24, 39, 0.95);
    /* Yarı saydam koyu zemin */
    backdrop-filter: blur(10px);
    /* Arka planı bulanıklaştır */
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease, visibility 0.4s ease;
}

/* Panel aktif olduğunda görünür yap */
.zenhar-search-overlay.is-active {
    opacity: 1;
    visibility: visible;
}

/* Arama panelinin içeriği (başlık, form vb.) */
.zenhar-search-overlay .search-overlay-content {
    max-width: 700px;
    width: 90%;
    position: relative;
    transform: translateY(20px);
    opacity: 0;
    transition: transform 0.4s ease 0.2s, opacity 0.4s ease 0.2s;
}

/* Panel aktif olduğunda içeriği de animasyonla getir */
.zenhar-search-overlay.is-active .search-overlay-content {
    transform: translateY(0);
    opacity: 1;
}

/* Arama başlığı */
.zenhar-search-overlay h2 {
    font-size: 42px;
    margin-bottom: 15px;
    color: var(--zenhar-yazi-baslik);
}

.zenhar-search-overlay h2 span {
    color: var(--zenhar-isik);
}

/* Arama açıklama metni */
.zenhar-search-overlay p {
    font-size: 18px;
    color: var(--zenhar-yazi-ana);
    margin-bottom: 40px;
}

/* Kapatma butonu (çarpı) */
.zenhar-search-overlay .close-search {
    position: absolute;
    top: -40px;
    right: 0px;
    font-size: 50px;
    color: var(--zenhar-yazi-ana);
    cursor: pointer;
    line-height: 1;
    transition: color 0.3s ease, transform 0.3s ease;
}

.zenhar-search-overlay .close-search:hover {
    color: var(--zenhar-isik);
    transform: rotate(90deg);
}

/* WordPress'in varsayılan arama formunu stillendirme */
.zenhar-search-overlay .search-form {
    position: relative;
}

/* Arama input alanı */
.zenhar-search-overlay .search-field {
    width: 100%;
    padding: 20px 30px;
    font-size: 22px;
    color: var(--zenhar-yazi-baslik);
    background-color: transparent;
    border: none;
    border-bottom: 2px solid var(--zenhar-gri-cizgi);
    border-radius: 0;
    outline: none;
    transition: border-color 0.3s ease;
    -webkit-appearance: none;
    /* iOS'taki çirkin stili kaldır */
}

.zenhar-search-overlay .search-field:focus {
    border-bottom-color: var(--zenhar-isik);
}

/* Arama butonu (Genellikle gizlenir, Enter kullanılır) */
.zenhar-search-overlay .search-submit {
    display: none;
}

/* ================================================================
 * [BİTİŞ] Tam Ekran Arama Paneli (Overlay) Stilleri
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] Arama Sonuçları Sayfası Stilleri (v6 - Baş Mühendis Versiyonu)
 * ================================================================ */

/* GENİŞLİK SORUNU NİHAİ ÇÖZÇœMÇœ: GeneratePress'in %70 kuralını ez! */
.search-results .content-area {
    width: 100% !important;
}

/* Ana site içeriği için genel ayar */
.search .site-main {
    padding-top: 50px;
    padding-bottom: 50px;
}

/* Bizim özel, geniş konteynerimiz */
.search-results-container,
.no-results-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* BEYAZ KUTU SORUNU ÇÖZÇœMÇœ: Başlığı ve formu yeniden stillendir */
.search .search-page-header {
    background: var(--zenhar-kutu-koyu);
    /* Arka planı koyu yap */
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 15px;
    padding: 40px;
    margin-bottom: 40px;
    text-align: center;
}

.search .page-title {
    color: var(--zenhar-yazi-baslik);
    margin-bottom: 20px;
}

.search .page-title .search-results-summary {
    color: var(--zenhar-isik);
    font-style: italic;
}

/* Sayfadaki arama formu (Tüm formlar için genel kural) */
.search-form {
    position: relative;
    max-width: 600px;
    margin: 0 auto;
}

.search-page-form p {
    color: var(--zenhar-yazi-ana);
    margin-bottom: 10px;
    text-align: center;
}

.search-field {
    background-color: var(--zenhar-zemin-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    color: var(--zenhar-yazi-baslik);
    padding: 15px 20px;
    border-radius: 8px;
    width: 100%;
    font-size: 16px;
}

.search-submit {
    position: absolute;
    top: 5px;
    /* Ayarlanabilir */
    right: 7px;
    background-color: var(--zenhar-isik);
    border: none;
    color: var(--zenhar-zemin-koyu);
    width: 40px;
    height: 40px;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    /* Ekledik */
}

.search-submit:hover {
    background-color: var(--zenhar-isik-koyu);
}

.search-submit::before {
    /* Tek ve gerçek ikonumuz! */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f002";
    font-size: 16px;
    line-height: 1;
    /* Ekledik */
}

/* Arama Sonuçları Listesi */
.search-results-list {
    background: var(--zenhar-kutu-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 15px;
    padding: 40px;
}

.search-result-item {
    padding: 30px 0;
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
}

.search-result-item:first-child {
    padding-top: 0;
}

.search-result-item:last-child {
    border-bottom: none;
}

.search-result-item .entry-title a:hover {
    color: var(--zenhar-isik);
}

/* ================================================================
 * [BAŞLANGIÇ] Evrensel Şık Sayfalama Stilleri
 * ================================================================ */
.paging-navigation {
    background: none !important;
    padding: 0 !important;
    border: none !important;
    margin-top: 40px;
}

.nav-links {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    /* Mobil cihazlarda taşmayı önler */
}

.page-numbers {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-width: 44px;
    height: 44px;
    padding: 0 15px;
    background-color: var(--zenhar-kutu-koyu);
    color: var(--zenhar-yazi-ana) !important;
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 8px;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.3s ease;
}

.page-numbers.current,
.page-numbers:not(.dots):hover {
    background-color: var(--zenhar-isik);
    color: var(--zenhar-zemin-koyu) !important;
    border-color: var(--zenhar-isik);
    transform: translateY(-3px);
    box-shadow: 0 4px 10px rgba(45, 212, 191, 0.2);
}

.page-numbers.current {
    font-weight: 700;
    cursor: default;
    transform: none;
    box-shadow: none;
}

.dots {
    background: transparent;
    border: none;
}

.screen-reader-text {
    display: none;
}

/* ================================================================
 * [BİTİŞ] Evrensel Şık Sayfalama Stilleri
 * ================================================================ */

/* ================================================================
 * [BİTİŞ] Arama Sonuçları Sayfası Stilleri (v6 - Baş Mühendis Versiyonu)
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] Hibrit Arama Filtreleri Stilleri (JS Destekli)
 * ================================================================ */

.arama-filtreleri {
    background-color: var(--zenhar-zemin-koyu);
    border-radius: 10px;
    padding: 20px 25px;
    margin-bottom: 40px;
    border: 1px solid var(--zenhar-gri-cizgi);
}

.filtre-basligi {
    font-size: 16px;
    font-family: 'Inter', sans-serif;
    color: var(--zenhar-yazi-ana);
    margin: 0 0 15px 0;
    font-weight: 500;
}

.filtre-butonlari {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.filtre-butonu {
    display: inline-flex;
    align-items: center;
    background-color: var(--zenhar-kutu-koyu);
    color: var(--zenhar-yazi-ana) !important;
    font-size: 14px;
    padding: 8px 15px;
    border-radius: 8px;
    text-decoration: none;
    border: 1px solid var(--zenhar-gri-cizgi);
    cursor: pointer;
    /* Buton olduğu için imleci değiştir */
    font-family: 'Inter', sans-serif;
    /* Fontu eşitle */
    transition: all 0.3s ease;
}

.filtre-butonu:hover {
    background-color: var(--zenhar-gri-cizgi);
    color: var(--zenhar-isik) !important;
    border-color: var(--zenhar-isik);
    transform: translateY(-2px);
}

.filtre-sayaci {
    background-color: var(--zenhar-gri-cizgi);
    color: var(--zenhar-isik);
    font-size: 12px;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 5px;
    margin-left: 10px;
    transition: all 0.3s ease;
    /* Yumuşak geçiş için eklendi */
}

/* Aktif Filtre Butonu Stili */
.filtre-butonu.aktif-filtre {
    background-color: var(--zenhar-isik);
    color: var(--zenhar-zemin-koyu) !important;
    border-color: var(--zenhar-isik);
    font-weight: 700;
}

.filtre-butonu.aktif-filtre .filtre-sayaci {
    background-color: var(--zenhar-zemin-koyu);
    color: var(--zenhar-isik);
}

/* ================================================================
 * [BİTİŞ] Hibrit Arama Filtreleri Stilleri (JS Destekli)
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] Kademeli Keşif Filtreleri Stilleri (NİHAİ VERSİYON)
 * ================================================================ */

.arama-filtreleri {
    background-color: var(--zenhar-zemin-koyu);
    border-radius: 10px;
    padding: 20px 25px;
    margin-bottom: 40px;
    border: 1px solid var(--zenhar-gri-cizgi);
}

.filtre-basligi {
    font-size: 16px;
    font-family: 'Inter', sans-serif;
    color: var(--zenhar-yazi-ana);
    margin: 0 0 15px 0;
    font-weight: 500;
}

.filtre-butonlari {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.filtre-butonu {
    display: inline-flex;
    align-items: center;
    background-color: var(--zenhar-kutu-koyu);
    color: var(--zenhar-yazi-ana) !important;
    font-size: 14px;
    padding: 8px 15px;
    border-radius: 8px;
    text-decoration: none;
    border: 1px solid var(--zenhar-gri-cizgi);
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    transition: all 0.3s ease;
}

.filtre-butonu:hover:not(.aktif-filtre) {
    background-color: var(--zenhar-gri-cizgi);
    color: var(--zenhar-isik) !important;
    border-color: var(--zenhar-isik);
}

.filtre-butonu.aktif-filtre {
    background-color: var(--zenhar-isik);
    color: var(--zenhar-zemin-koyu) !important;
    border-color: var(--zenhar-isik);
    font-weight: 700;
}

.filtre-sayaci {
    background-color: var(--zenhar-gri-cizgi);
    color: var(--zenhar-isik);
    font-size: 12px;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 5px;
    margin-left: 10px;
    transition: all 0.3s ease;
}

.filtre-butonu.aktif-filtre .filtre-sayaci {
    background-color: var(--zenhar-zemin-koyu);
    color: var(--zenhar-isik);
}

.daha-fazla-butonu {
    font-style: italic;
    background-color: transparent;
    border-style: dashed;
}

.arama-filtreleri.genisletildi {
    /* Genişleme için JS sınıfı */
}

/* NİHAİ SAYFALAMA ÇÖZÇœMÇœ */
.arama-sayfalama-kutusu {
    margin-top: 40px;
    border-top: 1px solid var(--zenhar-gri-cizgi);
    padding-top: 40px;
}

.arama-sayfalama-kutusu .nav-links {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.filtre-sonuc-yok,
.yukleniyor {
    text-align: center;
    padding: 40px;
    font-size: 18px;
    color: var(--zenhar-yazi-ana);
}

/* ================================================================
 * [BAŞLANGIÇ] 41. KADEMELİ FİLTRE GİZLEME KURALI (GÇœÇLENDİRİLMİŞ)
 * ================================================================ */

/* Başlangıçta 5'ten sonraki butonları kesin olarak gizle! */
.gizli-filtre {
    display: none !important;
}

/* "Daha Fazla" butonuna özel, dikkat çekici stil */
.daha-fazla-butonu {
    background-color: transparent !important;
    border: 1px dashed var(--zenhar-isik) !important;
    color: var(--zenhar-isik) !important;
    font-style: italic;
}

.daha-fazla-butonu:hover {
    background-color: rgba(45, 212, 191, 0.1) !important;
    color: var(--zenhar-yazi-baslik) !important;
}

/* ================================================================
 * [BİTİŞ] 41. KADEMELİ FİLTRE GİZLEME KURALI (GÇœÇLENDİRİLMİŞ)
 * ================================================================ */
/* ================================================================
 * [BİTİŞ] Kademeli Keşif Filtreleri Stilleri (NİHAİ VERSİYON)
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] Anlık Arama Sonuçları Stilleri
 * ================================================================ */

.anlik-arama-sonuclari {
    margin-top: 30px;
    text-align: left;
    max-height: 40vh;
    /* Yüksekliği ekranın %40'ı ile sınırla */
    overflow-y: auto;
    /* Gerekirse kaydırma çubuğu çıksın */
}

.anlik-arama-sonuclari ul {
    list-style: none;
    margin: 0;
    padding: 0;
    border-top: 1px solid var(--zenhar-gri-cizgi);
}

.anlik-arama-sonuclari li a {
    display: block;
    padding: 15px 20px;
    color: var(--zenhar-yazi-ana);
    text-decoration: none;
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
    transition: all 0.3s ease;
}

.anlik-arama-sonuclari li a:hover {
    background-color: var(--zenhar-kutu-koyu);
    color: var(--zenhar-isik);
    padding-left: 30px;
}

.anlik-arama-yukleniyor,
.anlik-arama-sonuc-yok {
    padding: 20px;
    color: var(--zenhar-yazi-ana);
    font-style: italic;
    text-align: center;
}

/* ================================================================
 * [BİTİŞ] Anlık Arama Sonuçları Stilleri
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] Tekil İçerik Sayfası Stilleri (v5 - DİREKT HEDEF)
 * ================================================================ */

/* --- 1. ANA YAPI ve ZEMİN (SİZİN TESPİTİNİZLE ÇÖZÇœLDÇœ) --- */

/* GeneratePress'in ana içerik alanındaki varsayılan boşluklarını sıfırla */
.single-post.no-sidebar .site-main {
    padding: 0 !important;
    margin: 40px 0;
}

/* Doğrudan hedef: .inside-article! Beyaz arka planı yok et ve stilimizi uygula! */
.single-post .inside-article {
    background-color: var(--zenhar-kutu-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 15px;
    padding: 50px;
}

/* --- 2. BAŞLIK ALANI --- */

.single-post .entry-header {
    margin-bottom: 40px;
    text-align: center;
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
    padding-bottom: 30px;
}

.single-post .entry-title {
    font-size: 44px;
    line-height: 1.3;
    color: var(--zenhar-yazi-baslik);
    text-shadow: 0 0 15px rgba(45, 212, 191, 0.1);
}

.single-post .entry-meta {
    font-size: 15px;
    color: var(--zenhar-yazi-ana);
    margin-top: 15px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.single-post .entry-meta a {
    color: var(--zenhar-yazi-ana);
}

.single-post .entry-content {
    max-width: 1100px;
    /* Okunabilirlik için 820px'den genişlettik, %100'den daralttık */
    margin-left: auto;
    margin-right: auto;
}

.single-post .entry-content p {
    font-size: 18px;
    line-height: 1.8;
    margin-bottom: 1.5em;
    color: var(--zenhar-yazi-ana);
}

.single-post .entry-content a {
    color: var(--zenhar-isik);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.single-post .entry-content a:hover {
    color: var(--zenhar-isik-koyu);
}

.single-post .entry-content h2,
.single-post .entry-content h3 {
    margin-top: 2.5em;
    margin-bottom: 1.2em;
    padding-bottom: 0.5em;
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
    color: var(--zenhar-yazi-baslik);
}

.single-post .entry-content blockquote {
    margin: 30px 0;
    padding: 20px 30px;
    background-color: var(--zenhar-zemin-koyu);
    border-left: 4px solid var(--zenhar-isik);
    font-style: italic;
    font-size: 19px;
    color: var(--zenhar-yazi-ana);
}

.single-post .entry-content blockquote p:last-child {
    margin-bottom: 0;
}

/* --- 4. KAYNAKCA KUTUSU --- */
.kaynakca-kutusu {
    background-color: var(--zenhar-zemin-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 10px;
    padding: 25px 30px;
    margin-top: 50px;
    position: relative;
}

.kaynakca-kutusu::before {
    content: 'Kaynak';
    display: inline-block;
    background-color: var(--zenhar-altin);
    color: var(--zenhar-zemin-koyu);
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    font-size: 14px;
    padding: 4px 12px;
    border-radius: 6px;
    position: absolute;
    top: -15px;
    left: 25px;
}

.kaynakca-kutusu p {
    font-size: 16px;
    margin-bottom: 0;
    color: var(--zenhar-yazi-ana);
}

.kaynakca-kutusu a {
    color: var(--zenhar-isik);
    text-decoration: underline;
}

/* --- 5. MOBİL UYUM --- */
@media (max-width: 768px) {
    .single-post .inside-article {
        padding: 30px 20px;
    }

    .single-post .site-main {
        margin-top: 20px;
    }

    .single-post .entry-title {
        font-size: 32px;
    }

    .single-post .entry-content p {
        font-size: 17px;
    }
}

/* ================================================================
 * [BİTİŞ] Tekil İçerik Sayfası Stilleri (v5 - DİREKT HEDEF)
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] İçerikteki Siyah Renk Sorununu Düzeltme
 * ================================================================ */

/* İçerikte manuel olarak siyah renk (#000000 veya #000) atanmış
   tüm elementleri hedef al ve rengini bizim ana yazı rengimizle değiştir! */
.entry-content [style*="color:#000000"],
.entry-content [style*="color: #000000"],
.entry-content [style*="color:#000"],
.entry-content [style*="color: #000"] {
    color: var(--zenhar-yazi-ana) !important;
}

/* ================================================================
 * [BAŞLANGIÇ] Yorumlar Bölümü Stilleri (Gece ve Işık Teması)
 * ================================================================ */

/* Yorumlar alanının tamamı */
.comments-area {
    background-color: transparent !important;
    /* Beyaz arka planı kaldır */
    padding: 50 !important;
    margin-top: 50px;
    border-top: 1px solid var(--zenhar-gri-cizgi);
    padding-top: 40px;
}

.comments-area .comments-title,
.comments-area .comment-reply-title {
    color: var(--zenhar-yazi-baslik);
    text-align: center;
    margin-bottom: 40px;
}

/* Yorum listesi */
.comment-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.comment-body {
    background-color: var(--zenhar-zemin-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    padding: 20px;
    border-radius: 10px;
    margin-bottom: 20px;
}

/* Yorum yazar bilgisi */
.comment-author .fn {
    color: var(--zenhar-yazi-baslik);
    font-style: normal;
}

.comment-meta a {
    color: var(--zenhar-yazi-ana);
    font-size: 14px;
}

/* Yorum içeriği */
.comment-content p {
    color: var(--zenhar-yazi-ana);
    font-size: 16px;
    line-height: 1.7;
}

/* "Yorum yap" formu */
.comment-form p,
.comment-form label {
    color: var(--zenhar-yazi-ana);
}

.logged-in-as a {
    color: var(--zenhar-isik);
}

/* Yorum metin alanı ve diğer inputlar */
.comment-form textarea,
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"] {
    background-color: var(--zenhar-zemin-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    color: var(--zenhar-yazi-baslik);
    padding: 12px 20px;
    border-radius: 8px;
    width: 100%;
}

.comment-form textarea:focus,
.comment-form input:focus {
    border-color: var(--zenhar-isik);
    outline: none;
}

/* Form butonu */
.comment-form .form-submit .submit {
    /* Genel buton stilimizi burada da kullanalım */
    background-color: var(--zenhar-isik);
    color: var(--zenhar-zemin-koyu) !important;
    border: none;
    padding: 12px 30px;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    display: block;
    margin: 0 auto;
}

.comment-form .form-submit .submit:hover {
    background-color: var(--zenhar-isik-koyu);
}

/* ================================================================
 * [BİTİŞ] Yorumlar Bölümü Stilleri
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] Yazı Sonu Bölümleri (v2 - Işık HarekÇ¢tı Tasarımı)
 * ================================================================ */

/* Ana Kapsayıcı */
.yazi-sonu-bolumleri {
    background-color: var(--zenhar-kutu-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 15px;
    margin-top: 40px;
    overflow: hidden;
}

/* 1. Yazı Navigasyonu (Stilleri aynı kaldı) */
.yazi-sonu-bolumleri .post-navigation {
    padding: 30px 40px;
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
}

.yazi-sonu-bolumleri .post-navigation .nav-links {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 30px;
}

.yazi-sonu-bolumleri .post-navigation .nav-previous,
.yazi-sonu-bolumleri .post-navigation .nav-next {
    flex: 1;
}

.yazi-sonu-bolumleri .post-navigation .nav-next {
    text-align: right;
}

.yazi-sonu-bolumleri .post-navigation a {
    color: var(--zenhar-yazi-ana);
    text-decoration: none;
    transition: color 0.3s ease;
}

.yazi-sonu-bolumleri .post-navigation a:hover .post-title {
    color: var(--zenhar-isik);
}

/* Düzeltme: Sadece başlığın rengi değişsin */
.yazi-sonu-bolumleri .post-navigation .meta-nav {
    display: block;
    font-size: 14px;
    font-family: 'Inter', sans-serif;
    color: var(--zenhar-yazi-ana);
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: color 0.3s ease;
}

.yazi-sonu-bolumleri .post-navigation a:hover .meta-nav {
    color: var(--zenhar-yazi-baslik);
}

/* Düzeltme: Çœst metin de aydınlansın */
.yazi-sonu-bolumleri .post-navigation .post-title {
    font-family: 'Merriweather', serif;
    font-weight: 700;
    font-size: 18px;
    color: var(--zenhar-yazi-baslik);
    line-height: 1.4;
    transition: color 0.3s ease;
}

/* 2. İlgili Yazılar (Yenilendi) */
.ilgili-yazilar {
    padding: 40px;
}

.ilgili-yazilar-baslik {
    text-align: center;
    margin-bottom: 30px;
    font-size: 28px;
    color: var(--zenhar-yazi-baslik);
}

.ilgili-yazilar-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 25px;
}

.ilgili-yazi-karti {
    position: relative;
    /* Okun pozisyonu için gerekli */
    display: flex;
    /* İçeriği daha iyi kontrol etmek için */
    flex-direction: column;
    /* İçerik alt alta dizilsin */
    background-color: var(--zenhar-zemin-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 10px;
    padding: 25px;
    text-decoration: none;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    /* Daha esnek bir animasyon */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2);
}

.ilgili-yazi-karti:hover {
    transform: translateY(-8px) scale(1.02);
    border-color: var(--zenhar-isik);
    /* YENİ: Kartın etrafına o istediğiniz "Işık Seli" efekti */
    box-shadow: 0 0 25px -5px rgba(45, 212, 191, 0.4);
}

.ilgili-yazi-karti-baslik {
    font-size: 18px;
    color: var(--zenhar-yazi-baslik);
    margin: 0 0 15px 0;
    line-height: 1.5;
    transition: color 0.3s ease;
    flex-grow: 1;
    /* Başlığın kalan boşluğu doldurmasını sağlar */
}

.ilgili-yazi-karti:hover .ilgili-yazi-karti-baslik {
    color: var(--zenhar-isik);
    /* YENİ: Çœzerine gelince başlık rengi değişir */
}

.ilgili-yazi-karti-kategori {
    font-size: 13px;
    color: var(--zenhar-yazi-ana);
    font-family: 'Inter', sans-serif;
    margin-top: auto;
    /* Kendini en alta iter */
}

.ilgili-yazi-karti-kategori i {
    color: var(--zenhar-isik);
    margin-right: 5px;
}

/* YENİ: "Devamını Oku" oku, başlangıçta gizli */
.ilgili-yazi-karti::after {
    content: 'â†’';
    position: absolute;
    right: 25px;
    bottom: 22px;
    font-size: 24px;
    color: var(--zenhar-isik);
    opacity: 0;
    transform: translateX(-10px);
    transition: all 0.3s ease;
}

/* YENİ: Çœzerine gelince ok belirir ve sağa kayar */
.ilgili-yazi-karti:hover::after {
    opacity: 1;
    transform: translateX(0);
}


/* Mobil Uyum (Aynı kaldı) */
@media (max-width: 768px) {
    .yazi-sonu-bolumleri .post-navigation .nav-links {
        flex-direction: column;
    }

    .yazi-sonu-bolumleri .post-navigation .nav-next {
        text-align: left;
    }

    .yazi-sonu-bolumleri {
        margin-top: 20px;
    }

    .yazi-sonu-bolumleri .post-navigation {
        padding: 20px;
    }

    .ilgili-yazilar {
        padding: 30px 20px;
    }
}

/* ================================================================
 * [BİTİŞ] Yazı Sonu Bölümleri (v2 - Işık HarekÇ¢tı Tasarımı)
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 17. Kutsal Metin (Arapça) Vurgu Stilleri
 * ================================================================ */

/* Bu sınıf, Arapça metinlerin veya Ayet/Hadislerin
   bulunduğu paragraflara uygulanacak. */
.kutsal-metin-vurgu {
    background-color: var(--zenhar-zemin-koyu);
    /* Ana zeminden bir ton açık */
    border: 1px solid var(--zenhar-gri-cizgi);
    border-right: 4px solid var(--zenhar-altin);
    /* Sağ tarafa altın rengi bir şerit */
    border-left: 4px solid var(--zenhar-altin);
    /* Sol tarafa altın rengi bir şerit */
    padding: 25px 30px;
    margin: 30px 0;
    border-radius: 10px;

    /* Arapça metinler için özel font ve ayarlar */
    font-family: 'Scheherazade New', 'Times New Roman', serif;
    /* Özel Arapça fontu, bulunamazsa Times */
    font-size: 22px;
    /* Daha büyük ve okunaklı */
    line-height: 2;
    /* Satır aralığını artır */
    text-align: center;
    /* Metni ortala */
    color: var(--zenhar-yazi-baslik);
    direction: rtl;
    /* Metin yönünü sağdan sola ayarla */
}

/* İçindeki Türkçe mealler için (gerekirse) */
.kutsal-metin-vurgu .meal {
    display: block;
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-style: italic;
    line-height: 1.8;
    margin-top: 20px;
    color: var(--zenhar-yazi-ana);
    direction: ltr;
    /* Meal soldan sağa */
}

/* ================================================================
 * [BİTİŞ] 17. Kutsal Metin (Arapça) Vurgu Stilleri
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 18. Akıllı Kategori Sayfası Stilleri (Nihai Versiyon)
 * ================================================================ */

/* Bu stiller, alt kategorisi olan TÇœM ana kategori sayfalarını hedefler. */
.category .site-main {
    padding: 0 !important;
    margin: 40px 0;
}

.category .direk-sayfa-icerik {
    background-color: var(--zenhar-kutu-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 15px;
    padding: 50px;
}

.category .entry-header {
    text-align: center;
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
}

.category .kategori-aciklama {
    font-size: 18px;
    margin-top: 15px;
    color: var(--zenhar-yazi-ana);
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.direk-sayfa-baslik {
    text-align: center;
    font-size: 32px;
    margin-top: 60px;
    margin-bottom: 40px;
    position: relative;
}

.direk-sayfa-baslik::after {
    content: '';
    display: block;
    width: 80px;
    height: 3px;
    background: var(--zenhar-isik);
    margin: 15px auto 0;
}

/* ================================================================
 * [BAŞLANGIÇ] 18.2 Standart Arşiv Listesi Stilleri (Nihai Zafer)
 * ================================================================ */
.standard-list-container {
    background-color: var(--zenhar-kutu-koyu);
    padding: 20px 50px 50px 50px;
    /* Çœst boşluğu azalttık */
    border-radius: 15px;
    border: 1px solid var(--zenhar-gri-cizgi);
}

.standard-list-container .entry-header {
    text-align: center;
    margin-bottom: 20px;
    padding-bottom: 30px;
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
}

.standard-list-item {
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
}

.standard-list-item:last-of-type {
    /* Sadece son elemanı hedefler */
    border-bottom: none;
}

a.standard-list-item-link {
    display: block;
    padding: 30px 0;
    text-decoration: none;
}

a.standard-list-item-link .entry-title {
    color: var(--zenhar-yazi-baslik);
    font-size: 24px;
    margin: 0 0 15px 0;
    transition: color 0.3s ease;
}

a.standard-list-item-link:hover .entry-title {
    color: var(--zenhar-isik);
}

a.standard-list-item-link .entry-summary {
    color: var(--zenhar-yazi-ana);
}

/* functions.php'den gelen yeni linkin stili */
.entry-summary .read-more {
    color: var(--zenhar-altin);
    font-weight: 500;
    text-decoration: none;
}

.entry-summary .read-more:hover {
    text-decoration: underline;
}

/* ================================================================
 * [BİTİŞ] 18.2 Standart Arşiv Listesi Stilleri (Nihai Zafer)
 * ================================================================ */
/* Kategori Kartları Grid */
.direk-kategori-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 25px;
}

.direk-kategori-karti {
    display: block;
    background-color: var(--zenhar-zemin-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 10px;
    padding: 25px;
    text-decoration: none;
    text-align: center;
    transition: all 0.3s ease;
}

.direk-kategori-karti:hover {
    transform: translateY(-5px);
    border-color: var(--zenhar-altin);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.direk-kategori-karti-baslik {
    font-size: 22px;
    color: var(--zenhar-yazi-baslik);
    margin: 0 0 10px 0;
}

.direk-kategori-karti p {
    font-size: 14px;
    color: var(--zenhar-yazi-ana);
    margin: 0 0 20px 0;
}

.direk-kategori-karti-sayac {
    display: inline-block;
    background: var(--zenhar-gri-cizgi);
    color: var(--zenhar-altin);
    font-size: 12px;
    font-weight: 600;
    padding: 5px 12px;
    border-radius: 20px;
}

/* Yazı Kartları Grid */
.direk-yazi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 30px;
}

.direk-yazi-karti {
    display: flex;
    flex-direction: column;
    background-color: var(--zenhar-zemin-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 10px;
    padding: 25px;
    text-decoration: none;
    transition: all 0.3s ease;
    min-height: 200px;
}

.direk-yazi-karti:hover {
    transform: translateY(-5px);
    border-color: var(--zenhar-isik);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.direk-yazi-karti-baslik {
    font-size: 20px;
    color: var(--zenhar-yazi-baslik);
    line-height: 1.4;
    margin: 0 0 15px 0;
}

.direk-yazi-karti-ozet {
    color: var(--zenhar-yazi-ana);
    font-size: 15px;
    line-height: 1.7;
    flex-grow: 1;
    margin-bottom: 20px;
}

.direk-yazi-karti-devamini-oku {
    color: var(--zenhar-altin);
    font-weight: 500;
    margin-top: auto;
    align-self: flex-start;
}

.direk-yazi-karti:hover .direk-yazi-karti-devamini-oku {
    text-decoration: underline;
}

/* Bilgilendirme Mesajı */
.direk-sayfa-bilgi-mesaji {
    text-align: center;
    padding: 20px;
    background-color: var(--zenhar-zemin-koyu);
    border-radius: 8px;
    margin-bottom: 30px;
    font-style: italic;
    color: var(--zenhar-yazi-ana);
}

/* ================================================================
 * [BİTİŞ] 18. Akıllı Kategori Sayfası Stilleri (Nihai Versiyon)
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 18.1 Akıllı Kategori Sayfası - "Tümünü Gör" Butonu
 * ================================================================ */

.direk-sayfa-hepsini-gor {
    text-align: center;
    margin-top: 40px;
    padding-top: 40px;
    border-top: 1px solid var(--zenhar-gri-cizgi);
}

/* ================================================================
 * [BİTİŞ] 18.1 Akıllı Kategori Sayfası - "Tümünü Gör" Butonu
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 18.2 Standart Arşiv Listesi Stilleri (Zırh Delici)
 * ================================================================ */

/* Genel Konteyner: Standart listeyi de bizim şık kutumuzun içine al */
.archive .site-main>.inside-article {
    background-color: var(--zenhar-kutu-koyu);
    padding: 50px;
    border-radius: 15px;
    border: 1px solid var(--zenhar-gri-czi);
}

/* GP'nin varsayılan arşiv başlığındaki beyaz kutuyu kaldır ve stil ver */
.archive .page-header {
    background: none;
    padding: 0;
    border: none;
    text-align: center;
    margin-bottom: 40px;
    padding-bottom: 30px;
    border-bottom: 1px solid var(--zenhar-gri-czi);
}

.archive .page-header .page-title {
    font-size: 32px;
    color: var(--zenhar-yazi-baslik);
}

/* YENİ VE DAHA GÇœÇLÇœ HEDEFLEME */
/* Arşiv sayfasının içindeki TÇœM .post sınıflarını hedefle */
.archive .post {
    background: none;
    padding: 0;
    margin-bottom: 0;
    border: none;
    transition: background-color 0.3s ease;
}

/* ZEBRA DESENİ - Çift sayılı makalelere farklı bir arka plan ver */
.archive .post:nth-child(even) {
    background-color: var(--zenhar-zemin-koyu);
}

/* ÇœZERİNE GELİNCE AYDINLATMA */
.archive .post:hover {
    background-color: rgba(45, 212, 191, 0.05);
}

/* Tıklanabilir başlık */
.archive .post .entry-title a {
    color: var(--zenhar-yazi-baslik);
    text-decoration: none;
    transition: color 0.3s ease;
}

.archive .post:hover .entry-title a {
    color: var(--zenhar-isik);
}

/* Yazı Özeti */
.archive .post .entry-summary {
    color: var(--zenhar-yazi-ana);
    padding: 15px 0 30px 0;
}

/* "Devamını oku" linki */
.archive .post .read-more {
    display: inline-block;
    color: var(--zenhar-altin);
    font-weight: 500;
    text-decoration: none;
}

.archive .post .read-more:hover {
    text-decoration: underline;
}

/* Her bir liste öğesi için ayırıcı çizgi */
.archive .post {
    padding-left: 30px;
    padding-right: 30px;
}

.archive .post:not(:last-child) {
    border-bottom: 1px solid var(--zenhar-gri-czi);
}

.archive .post:first-child {
    padding-top: 30px;
}

.archive .post:last-child {
    padding-bottom: 30px;
}

/* ================================================================
 * [BİTİŞ] 18.2 Standart Arşiv Listesi Stilleri (Zırh Delici)
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 18.3 EVRENSEL Liste Stilleri (İmparatorun Fermanı)
 * ================================================================ */

/* HEDEF 1: Blog anasayfası, arşivler, arama sonuçları gibi TÇœM listeleme
   sayfalarındaki her bir YAZI (.post) kutusunun içindeki o lanetli
   beyaz .inside-article kutusunu hedef al ve etkisiz hale getir! */
.home .post .inside-article,
.archive .post .inside-article,
.search .post .inside-article {
    background: none !important;
    /* Beyaz rengi zorla yok et! */
    padding: 0 !important;
    /* Kendi iç boşluklarını sıfırla! */
}

/* HEDEF 2: O beyaz kutunun babası olan .post etiketine kendi stilimizi verelim */
.home .post,
.archive .post,
.search .post {
    background-color: var(--zenhar-kutu-koyu);
    padding: 40px;
    margin-bottom: 30px;
    border-radius: 15px;
    border: 1px solid var(--zenhar-gri-czi);
    transition: background-color 0.3s ease;
}

/* HEDEF 3: Zebra desenini bu yeni yapıya uygula */
.home .post:nth-child(even),
.archive .post:nth-child(even),
.search .post:nth-child(even) {
    background-color: var(--zenhar-zemin-koyu);
}

/* HEDEF 4: Çœzerine gelince aydınlatmayı bu yeni yapıya uygula */
.home .post:hover,
.archive .post:hover,
.search .post:hover {
    background-color: rgba(45, 212, 191, 0.05);
}

/* Kalan stiller (Başlık, Özet vb.) aynı kalabilir, sadece hedefleri güçlendirelim */
.post .entry-title a {
    color: var(--zenhar-yazi-baslik);
    text-decoration: none;
    transition: color 0.3s ease;
}

.post:hover .entry-title a {
    color: var(--zenhar-isik);
}

.post .entry-summary {
    color: var(--zenhar-yazi-ana);
    margin-top: 15px;
}

.post .read-more {
    display: inline-block;
    color: var(--zenhar-altin);
    font-weight: 500;
    text-decoration: none;
    margin-top: 15px;
}

.post .read-more:hover {
    text-decoration: underline;
}

/* Metadatanın (kategori, yazar vb.) çirkin görünmesini engelle */
.home .post .entry-meta,
.archive .post .entry-meta,
.search .post .entry-meta {
    margin-top: 30px;
    font-size: 14px;
}

/* ================================================================
 * [BİTİŞ] 18.3 EVRENSEL Liste Stilleri (İmparatorun Fermanı)
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 25. Anasayfa Dinamik Kategori Kartları Stilleri
 * ================================================================ */

.zenhar-kategori-vitrini {
    padding: 80px 0;
    background-color: var(--zenhar-zemin-koyu);
    border-top: 1px solid var(--zenhar-gri-cizgi);
}

.kategori-vitrini-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 30px;
}

.kategori-vitrini-karti {
    display: flex;
    flex-direction: column;
    background-color: var(--zenhar-kutu-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 15px;
    padding: 30px;
    text-decoration: none;
    transition: all 0.3s ease-in-out;
    position: relative;
    overflow: hidden;
}

.kategori-vitrini-karti:hover {
    transform: translateY(-10px);
    border-color: var(--zenhar-isik);
    box-shadow: 0 0 30px rgba(45, 212, 191, 0.3);
}

.kategori-karti-baslik {
    font-size: 24px;
    color: var(--zenhar-yazi-baslik);
    margin: 0 0 15px 0;
    transition: color 0.3s ease;
}

.kategori-vitrini-karti:hover .kategori-karti-baslik {
    color: var(--zenhar-isik);
}

.kategori-karti-aciklama {
    color: var(--zenhar-yazi-ana);
    font-size: 16px;
    line-height: 1.7;
    margin-bottom: 25px;
    flex-grow: 1;
    /* Açıklamanın kalan boşluğu doldurmasını sağlar */
}

.kategori-karti-link {
    color: var(--zenhar-altin);
    font-weight: 500;
    margin-top: auto;
    /* Kendini en alta iter */
    align-self: flex-start;
    transition: transform 0.3s ease;
}

.kategori-karti-link i {
    margin-left: 5px;
    transition: transform 0.3s ease;
}

.kategori-vitrini-karti:hover .kategori-karti-link i {
    transform: translateX(5px);
}

/* ================================================================
 * [BİTİŞ] 25. Anasayfa Dinamik Kategori Kartları Stilleri
 * ================================================================ */


/* ğŸ” 4. İkinci büyüteci kaldır (GeneratePressâ€™in kendi arama butonu) */
.menu-bar-item.search-item,
.main-navigation .search-item,
.nav-search-enabled .search-item {
    display: none !important;
}

/* âœ… 5. Sadece özel headerâ€™daki büyüteç görünsün */
.header-actions .search-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    background-color: rgba(45, 212, 191, 0.15);
    border-radius: 8px;
    padding: 8px;
}

/* ================================================================
 * [BAŞLANGIÇ] 13. NİHAİ HEADER STİLLERİ (v16 - SADE VE KARARLI)
 * ================================================================ */

/* --- ANA YAPI: 3 SÇœTUNLU NİHAİ DÇœZEN --- */
.site-header {
    background: rgba(17, 24, 39, 0.85);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
    position: sticky;
    top: 0;
    z-index: 1000;
}

.inside-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 80px;
}

/* --- SÇœTUN 1: SOL (LOGO) --- */
.site-branding {
    flex-shrink: 0;
}

.zenhar-logo {
    font-family: 'Merriweather', serif;
    font-size: 28px;
    font-weight: 700;
    color: var(--zenhar-yazi-baslik);
    text-decoration: none;
}

.zenhar-logo span {
    color: var(--zenhar-isik);
}

/* --- SÇœTUN 2: ORTA (DİNAMİK MENÇœ) --- */
/* Menüyü ortalamak ve gereksiz stilleri ezmek için */
nav.main-navigation.zenhar-desktop-nav {
    background: none !important;
    padding: 0 !important;
    line-height: 1 !important;
    flex-grow: 1;
    /* Ortada kalan tüm boşluğu kapla */
    display: flex;
    justify-content: center;
    /* İçindeki 'ul' listesini ortala */
}

.zenhar-desktop-nav ul {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 40px;
}

/* Menü linklerinin son hali: Önce yeşil, üzerine gelince beyaz */
.zenhar-desktop-nav ul li a {
    font-weight: 500;
    font-size: 16px;
    color: var(--zenhar-isik) !important;
    text-decoration: none;
    padding: 10px 5px;
    position: relative;
    background: none !important;
    transition: color 0.25s ease;
}

.zenhar-desktop-nav ul li a:hover,
.zenhar-desktop-nav .current-menu-item>a {
    color: var(--zenhar-yazi-baslik) !important;
}

/* Çœzerine gelince çıkan alt çizgi */
.zenhar-desktop-nav ul li a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background-color: var(--zenhar-isik);
    transition: width 0.25s ease;
}

.zenhar-desktop-nav ul li a:hover::after,
.zenhar-desktop-nav .current-menu-item>a::after {
    width: 100%;
}

/* --- SÇœTUN 3: SAÄ (SADECE ARAMA) --- */
.header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    /* İçeriği sağa yasla */
    min-width: 150px;
    /* Logo ile simetriyi korumak için (ayarlanabilir) */
}

.search-btn {
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 10px;
    border-radius: 8px;
    transition: background-color 0.3s ease;
}

.search-btn i {
    color: var(--zenhar-yazi-ana);
    font-size: 20px;
    transition: color 0.3s ease;
}

.search-btn:hover {
    background-color: var(--zenhar-gri-cizgi);
}

.search-btn:hover i {
    color: var(--zenhar-yazi-baslik);
}

/* --- MOBİL GÖRÜNÜM --- */
@media (max-width: 768px) {

    /* Mobilde orta menü tamamen gizlenir */
    .zenhar-desktop-nav,
    nav.main-navigation.zenhar-desktop-nav {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        width: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
        position: absolute !important;
        left: -9999px !important;
    }

    /* Mobilde header: Logo sol, Arama sağ */
    .inside-header {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        align-items: center !important;
        height: 60px !important;
        padding: 0 15px !important;
    }

    /* Logo sola yaslanır */
    .site-branding {
        flex-shrink: 0 !important;
    }

    .zenhar-logo {
        font-size: 22px !important;
    }

    /* Arama butonu sağda görünür */
    .header-actions {
        display: flex !important;
        visibility: visible !important;
        min-width: auto !important;
    }

    .search-btn {
        padding: 8px !important;
    }

    .search-btn i {
        font-size: 18px !important;
    }
}

/* ================================================================
 * [BİTİŞ] 13. NİHAİ HEADER STİLLERİ (v16 - SADE VE KARARLI)
 * ================================================================ */
/* ================================================================
 * [DÇœZELTME] Mobil Menü Panelini Masaüstünde Tamamen Gizle
 * ================================================================ */
#mobile-menu-panel,
.mobile-menu-panel,
.mobile-navigation {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    z-index: -1 !important;
}

/* ================================================================
 * ZeNHaR Evrensel Görsel Sistem (v1)
 * ================================================================ */
.zenhar-page {
    background-color: var(--zenhar-zemin-koyu);
    color: var(--zenhar-yazi-ana);
    padding: 40px 0;
    position: relative;
    z-index: 1;
}

.zenhar-page::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: var(--zenhar-deseni);
    opacity: 0.05;
    z-index: -1;
}

.zenhar-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 25px;
    padding: 0 20px;
}

.zenhar-card {
    background: var(--zenhar-kutu-koyu);
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
    transition: transform 0.3s, box-shadow 0.3s;
}

.zenhar-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.3);
}

.kategori-karti-baslik {
    color: var(--zenhar-isik);
    margin-bottom: 10px;
}

.kategori-karti-aciklama {
    color: var(--zenhar-yazi-ana);
    font-size: 14px;
    line-height: 1.5;
    margin-bottom: 15px;
}

.kategori-karti-link {
    color: var(--zenhar-isik);
    font-weight: 600;
    font-size: 14px;
}

/* ================================================================
 * [BAŞLANGIÇ] 26. BÇœYÇœK KÇœTÇœPHANE SALONU (page-kutuphane.php)
 * ================================================================ */

/* Sayfanın genel yerleşimini düzenle */
.kutuphane-sayfasi .site-main {
    padding: 0 !important;
    margin: 40px 0;
}

.kutuphane-sayfasi .inside-article {
    background-color: var(--zenhar-kutu-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 15px;
    padding: 50px;
}

.kutuphane-sayfasi .entry-header {
    text-align: center;
    margin-bottom: 50px;
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
    padding-bottom: 30px;
}

/* Ana Grid Yapısı: Kütüphane raflarını yan yana diz */
.kutuphane-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 40px;
}

/* Her bir ana kategori sütunu (Raf) */
.kutuphane-raf {
    background-color: var(--zenhar-zemin-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 10px;
    padding: 25px;
    display: flex;
    flex-direction: column;
}

/* Raf Başlığı (Ana Kategori) */
.raf-basligi {
    font-size: 24px;
    margin: 0 0 20px 0;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
    text-align: center;
}

.raf-basligi a {
    color: var(--zenhar-yazi-baslik);
    text-decoration: none;
    transition: color 0.3s ease;
}

.raf-basligi a:hover {
    color: var(--zenhar-isik);
    text-decoration: none;
}

/* Kitaplık Listesi (Alt Kategoriler) */
.kitaplik-listesi {
    list-style: none;
    margin: 0;
    padding: 0;
    flex-grow: 1;
    /* Listenin kalan boşluğu doldurmasını sağlar */
}

.kitaplik-listesi li {
    margin-bottom: 5px;
}

.kitaplik-listesi a {
    display: flex;
    justify-content: space-between;
    /* Yazı ve sayacı iki uca yasla */
    align-items: center;
    padding: 10px 15px;
    border-radius: 6px;
    color: var(--zenhar-yazi-ana);
    text-decoration: none;
    transition: all 0.3s ease;
}

.kitaplik-listesi a:hover {
    background-color: var(--zenhar-gri-cizgi);
    color: var(--zenhar-isik-koyu);
    text-decoration: none;
    transform: translateX(5px);
}

/* Yazı Sayacı Etiketi */
.yazi-sayaci {
    background-color: var(--zenhar-gri-cizgi);
    color: var(--zenhar-isik);
    font-size: 12px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 5px;
    transition: all 0.3s ease;
}

.kitaplik-listesi a:hover .yazi-sayaci {
    background-color: var(--zenhar-isik);
    color: var(--zenhar-zemin-koyu);
}

/* Raf boş mesajı stili */
.raf-bos-mesaji {
    font-style: italic;
    color: var(--zenhar-yazi-ana);
    text-align: center;
    padding: 20px;
}

/* ================================================================
 * [BİTİŞ] 26. BÇœYÇœK KÇœTÇœPHANE SALONU (page-kutuphane.php)
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 26.1 HIZLI ERİŞİM ARAMA KUTUSU STİLİ
 * ================================================================ */

.hizli-erisim-arama {
    position: relative;
    margin-bottom: 40px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

#kategoriAramaInput {
    width: 100%;
    padding: 18px 25px 18px 60px;
    /* İkon için solda boşluk */
    font-size: 18px;
    background-color: var(--zenhar-zemin-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 10px;
    color: var(--zenhar-yazi-baslik);
    outline: none;
    transition: all 0.3s ease;
}

#kategoriAramaInput:focus {
    border-color: var(--zenhar-isik);
    box-shadow: 0 0 15px rgba(45, 212, 191, 0.2);
}

.hizli-erisim-arama .arama-ikonu {
    position: absolute;
    top: 50%;
    left: 25px;
    transform: translateY(-50%);
    color: var(--zenhar-yazi-ana);
    font-size: 20px;
    transition: color 0.3s ease;
}

#kategoriAramaInput:focus+.arama-ikonu {
    color: var(--zenhar-isik);
}

/* ================================================================
 * [BİTİŞ] 26.1 HIZLI ERİŞİM ARAMA KUTUSU STİLİ
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 26.2 KÇœTÇœPHANE RAFI İKON STİLİ
 * ================================================================ */

.raf-basligi a i {
    color: var(--zenhar-isik);
    /* İkon rengi */
    margin-right: 12px;
    /* İkon ile yazı arası boşluk */
    width: 25px;
    /* İkonların farklı genişlikte olmasını engeller */
    text-align: center;
    /* İkonu kendi alanında ortalar */
    transition: transform 0.3s ease;
}

.raf-basligi a:hover i {
    transform: scale(1.2) rotate(-5deg);
    /* Çœzerine gelince hafifçe büyüyüp dönsün */
}

/* ================================================================
 * [BİTİŞ] 26.2 KÇœTÇœPHANE RAFI İKON STİLİ
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 32. KEŞİF PORTALI STİLLERİ
 * ================================================================ */

.zenhar-kesif-portali {
    padding: 80px 0;
    background-color: var(--zenhar-zemin-koyu);
    border-top: 1px solid var(--zenhar-gri-cizgi);
}

.zenhar-kesif-portali .section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px;
}

.zenhar-kesif-portali .section-title {
    margin-bottom: 0;
    text-align: left;
}

.tumunu-gor-link {
    color: var(--zenhar-altin);
    font-weight: 500;
    text-decoration: none;
    transition: color 0.3s ease;
}

.tumunu-gor-link:hover {
    color: var(--zenhar-yazi-baslik);
    text-decoration: none;
}

.tumunu-gor-link i {
    margin-left: 5px;
}

.kesif-portali-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.kesif-karti {
    background-color: var(--zenhar-kutu-koyu);
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--zenhar-gri-cizgi);
    transition: all 0.4s ease;
}

.kesif-karti:hover {
    transform: translateY(-8px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
    border-color: var(--zenhar-isik);
}

.kart-link-wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
    text-decoration: none;
}

.kart-gorsel {
    width: 100%;
    height: 180px;
    /* Sabit yükseklik */
    overflow: hidden;
}

.kart-gorsel img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* Görseli kırparak sığdırır */
    transition: transform 0.4s ease;
}

.kesif-karti:hover .kart-gorsel img {
    transform: scale(1.05);
}

.kart-icerik {
    padding: 25px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    /* Kalan boşluğu doldurur */
}

.kart-baslik {
    font-size: 20px;
    color: var(--zenhar-yazi-baslik);
    margin: 0 0 15px 0;
    line-height: 1.4;
    transition: color 0.3s ease;
}

.kesif-karti:hover .kart-baslik {
    color: var(--zenhar-isik);
}

.kart-ozet {
    color: var(--zenhar-yazi-ana);
    font-size: 15px;
    line-height: 1.7;
    margin-bottom: 20px;
    flex-grow: 1;
}

.kart-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
    /* Kendini en alta iter */
    font-size: 14px;
    font-family: 'Inter', sans-serif;
}

.kart-okunma {
    color: var(--zenhar-yazi-ana);
}

.kart-okunma i {
    color: var(--zenhar-isik);
    margin-right: 5px;
}

.kart-devamini-oku {
    color: var(--zenhar-altin);
    font-weight: 500;
}

/* ================================================================
 * [BİTİŞ] 32. KEŞİF PORTALI STİLLERİ
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 33. TÇœM YAZILAR ARŞİV SAYFASI (page-arsiv.php)
 * ================================================================ */

.arsiv-sayfasi .site-main {
    padding: 0 !important;
    margin: 40px 0;
}

.arsiv-sayfasi .inside-article {
    background-color: var(--zenhar-kutu-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 15px;
    padding: 50px;
}

.arsiv-sayfasi .entry-header {
    text-align: center;
    margin-bottom: 40px;
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
    padding-bottom: 30px;
}

.zebra-liste .zebra-item {
    padding: 25px;
    border-radius: 8px;
    transition: background-color 0.3s ease;
}

/* Zebra Deseni */
.zebra-liste .zebra-item:nth-child(even) {
    background-color: var(--zenhar-zemin-koyu);
}

.zebra-liste .zebra-item:hover {
    background-color: rgba(45, 212, 191, 0.08);
}

.zebra-link {
    display: block;
    text-decoration: none;
}

.zebra-baslik {
    font-size: 22px;
    color: var(--zenhar-yazi-baslik);
    margin: 0 0 10px 0;
    transition: color 0.3s ease;
}

.zebra-item:hover .zebra-baslik {
    color: var(--zenhar-isik);
}

.zebra-ozet {
    color: var(--zenhar-yazi-ana);
    font-size: 16px;
    line-height: 1.7;
}

.zebra-meta {
    display: flex;
    gap: 20px;
    margin-top: 15px;
    font-size: 14px;
    color: var(--zenhar-yazi-ana);
}

.zebra-meta i {
    margin-right: 5px;
    color: var(--zenhar-isik);
}

.arsiv-sayfalama {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 40px;
    padding-top: 30px;
    border-top: 1px solid var(--zenhar-gri-cizgi);
}

/* Sayfalama stilleri zaten evrensel olduğu için (.page-numbers) tekrar yazmaya gerek yok */

/* ================================================================
 * [BİTİŞ] 33. TÇœM YAZILAR ARŞİV SAYFASI (page-arsiv.php)
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 34. ANASAYFA HAYALET KUTU TEMİZLİÄİ
 * ================================================================ */

/* Sadece ve sadece anasayfada (.home), GeneratePress'in ana içerik
   kapsayıcısını (.site-main) hedef al ve tamamen gizle. */
body.home .site-main {
    display: none !important;
}

/* ================================================================
 * [BİTİŞ] 34. ANASAYFA HAYALET KUTU TEMİZLİÄİ
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 35. DİJİTAL İBADET YOLDAŞI KARTI STİLLERİ
 * ================================================================ */

/* Kartın genel yapısı ve diğerlerinden ayrışması */
.ibadet-yoldasi-karti {
    /* Diğer kartlardan daha fazla öne çıkması için özel bir gradyan */
    background: linear-gradient(145deg, var(--zenhar-kutu-koyu), #2c3a4f);
    /* Çerçeve rengi artık diğer kartlarla aynı */
    grid-row: span 2;
    /* Mümkünse 2 birimlik yer kaplasın (grid yapısına göre) */
    grid-column: span 1;
    /* Diğer kartların yanına sığmazsa alt alta dizilsin */
    display: flex;
    flex-direction: column;
}

/* Kart başlığındaki (İstanbul) yazısı */
.ibadet-yoldasi-karti h3 .konum-bilgisi {
    font-size: 14px;
    font-family: 'Inter', sans-serif;
    color: var(--zenhar-yazi-ana);
    font-weight: 400;
}

/* Bir sonraki vakit ve geri sayım alanı */
.yakin-vakit-bilgisi {
    text-align: center;
    margin: 20px 0;
    padding: 20px;
    background-color: rgba(45, 212, 191, 0.1);
    border-radius: 10px;
    border: 1px solid var(--zenhar-isik);
}

.yakin-vakit-metin {
    display: block;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--zenhar-yazi-ana);
}

.yakin-vakit-isim {
    display: block;
    font-size: 36px;
    font-family: 'Merriweather', serif;
    color: var(--zenhar-isik);
    margin: 5px 0 10px 0;
    font-weight: 700;
}

/* İşte kalbin attığı yer: Geri sayım sayacı! */
.geri-sayim {
    font-family: 'Inter', monospace;
    /* Sayılar için tek aralıklı font */
    font-size: 28px;
    font-weight: 500;
    color: var(--zenhar-yazi-baslik);
    background-color: var(--zenhar-zemin-koyu);
    padding: 10px;
    border-radius: 8px;
    letter-spacing: 2px;
    /* Işık yansıması efekti */
    text-shadow: 0 0 15px rgba(45, 212, 191, 0.5);
}

/* Günlük vakitlerin listesi */
.tum-vakitler-listesi {
    list-style: none;
    padding: 0;
    margin: 20px 0;
    flex-grow: 1;
    /* Kalan boşluğu doldur */
}

.tum-vakitler-listesi li {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
    font-size: 16px;
    color: var(--zenhar-yazi-ana);
    transition: all 0.3s ease;
}

.tum-vakitler-listesi li:last-child {
    border-bottom: none;
}

/* Aktif (bir sonraki) vaktin listede vurgulanması */
.tum-vakitler-listesi li.aktif {
    color: var(--zenhar-yazi-baslik);
    font-weight: 700;
}

.tum-vakitler-listesi li.aktif span:last-child {
    color: var(--zenhar-isik);
}

/* "Tüm Vakitler" linki en altta kalsın */
.ibadet-yoldasi-karti a {
    margin-top: auto;
}

/* ================================================================
 * [BİTİŞ] 35. DİJİTAL İBADET YOLDAŞI KARTI STİLLERİ
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 37. İBADET YOLDAŞI YÇœKLEME/HATA STİLLERİ
 * ================================================================ */
.ibadet-yoldasi-icerik .yukleniyor-mesaji,
.ibadet-yoldasi-icerik .hata-mesaji {
    text-align: center;
    padding: 40px 10px;
    font-size: 16px;
    color: var(--zenhar-yazi-ana);
}

.ibadet-yoldasi-icerik .yukleniyor-mesaji i {
    font-size: 32px;
    color: var(--zenhar-isik);
    display: block;
    margin-bottom: 20px;
}

/* ================================================================
 * [BİTİŞ] 37. İBADET YOLDAŞI YÇœKLEME/HATA STİLLERİ
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 38. ÖZEL SAYFA ŞABLONLARI İÇİN EVRENSEL STİL
 * ================================================================ */

/* HEDEF: Hem Kütüphane sayfası hem de Namaz Vakitleri sayfası gibi
   özel şablonlarımızın içindeki o lanetli beyaz kutuyu yok et ve
   bizim "Gece ve Işık" stilimizi uygula! */

.kutuphane-sayfasi .site-main,
.namaz-vakitleri-sayfasi .site-main {
    padding: 0 !important;
    margin: 40px 0;
}

.kutuphane-sayfasi .inside-article,
.namaz-vakitleri-sayfasi .inside-article {
    background-color: var(--zenhar-kutu-koyu);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 15px;
    padding: 50px;
}

.kutuphane-sayfasi .entry-header,
.namaz-vakitleri-sayfasi .entry-header {
    text-align: center;
    margin-bottom: 50px;
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
    padding-bottom: 30px;
}

/* ================================================================
 * [BİTİŞ] 38. ÖZEL SAYFA ŞABLONLARI İÇİN EVRENSEL STİL
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 39. NAMAZ VAKİTLERİ PORTALI STİLLERİ
 * ================================================================ */

/* Sayfanın genel kontrol merkezi */
.portal-kontrol-merkezi {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: var(--zenhar-zemin-koyu);
    padding: 20px;
    border-radius: 10px;
    margin-bottom: 40px;
    flex-wrap: wrap;
    gap: 20px;
}

.il-secim-kutusu label {
    margin-right: 15px;
    font-weight: 500;
}

.il-secim-kutusu select {
    min-width: 250px;
    padding: 12px;
    background-color: var(--zenhar-kutu-koyu);
    color: var(--zenhar-yazi-baslik);
    border: 1px solid var(--zenhar-gri-cizgi);
    border-radius: 8px;
    font-size: 16px;
}

.tarih-bilgisi {
    font-size: 18px;
    font-weight: 500;
    color: var(--zenhar-yazi-ana);
}

/* Aylık Vakitler Tablosu */
.aylik-vakitler-baslik h2 {
    text-align: center;
    margin-bottom: 30px;
}

.portal-aylik-vakitler-tablosu {
    overflow-x: auto;
    /* Mobilde taşmayı önler */
}

.portal-aylik-vakitler-tablosu table {
    width: 100%;
    border-collapse: collapse;
    text-align: center;
}

.portal-aylik-vakitler-tablosu th,
.portal-aylik-vakitler-tablosu td {
    padding: 15px 10px;
    border-bottom: 1px solid var(--zenhar-gri-cizgi);
}

.portal-aylik-vakitler-tablosu thead th {
    background-color: var(--zenhar-zemin-koyu);
    color: var(--zenhar-isik);
    font-size: 16px;
}

.portal-aylik-vakitler-tablosu tbody tr:hover {
    background-color: var(--zenhar-zemin-koyu);
}

.portal-aylik-vakitler-tablosu td {
    font-size: 18px;
    font-family: 'Inter', monospace;
}

.portal-aylik-vakitler-tablosu td small {
    font-size: 12px;
    color: var(--zenhar-yazi-ana);
    font-family: 'Inter', sans-serif;
}

/* Yükleniyor ve Hata mesajları */
.yukleniyor-mesaji-tablo,
.hata-mesaji-tablo {
    text-align: center;
    padding: 60px 20px;
    font-size: 18px;
    color: var(--zenhar-yazi-ana);
}

.yukleniyor-mesaji-tablo i {
    font-size: 40px;
    color: var(--zenhar-isik);
    display: block;
    margin-bottom: 25px;
}

/* ================================================================
 * [BİTİŞ] 39. NAMAZ VAKİTLERİ PORTALI STİLLERİ
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 40. PORTAL SEKME VE SAYACI STİLLERİ
 * ================================================================ */

/* Geri Sayım Alanı (Çœst bar için) */
.portal-geri-sayim-alani .yakin-vakit-bilgisi.portal-sayac {
    padding: 10px 20px;
    margin: 0;
    min-width: 250px;
}

.portal-geri-sayim-alani .yakin-vakit-isim {
    font-size: 24px;
    margin: 0;
}

.portal-geri-sayim-alani .geri-sayim {
    font-size: 20px;
    padding: 5px;
}

.portal-geri-sayim-alani .yakin-vakit-metin {
    display: none;
}

.yukleniyor-mesaji-sayac i {
    font-size: 24px;
    color: var(--zenhar-isik);
}


/* Sekme Navigasyonu */
.portal-sekmeler {
    display: flex;
    border-bottom: 2px solid var(--zenhar-gri-cizgi);
    margin-bottom: 30px;
}

.sekme-link {
    padding: 15px 30px;
    cursor: pointer;
    background: none;
    border: none;
    /* DİÄER BUTON STİLLERİNİ EZMEK İÇİN "!important" EKLEDİK */
    color: var(--zenhar-yazi-ana) !important;
    font-size: 18px;
    font-weight: 500;
    position: relative;
    transition: color 0.3s ease;
}

.sekme-link:hover {
    color: var(--zenhar-yazi-baslik);
}

.sekme-link::after {
    content: '';
    position: absolute;
    bottom: -2px;
    /* Border'ın üstüne gelsin */
    left: 0;
    width: 100%;
    height: 2px;
    background-color: var(--zenhar-isik);
    transform: scaleX(0);
    transition: transform 0.3s ease;
}

.sekme-link.aktif {
    color: var(--zenhar-isik);
}

.sekme-link.aktif::after {
    transform: scaleX(1);
}

/* Sekme İçerikleri */
.sekme-icerik {
    display: none;
    /* Başlangıçta hepsi gizli */
}

.sekme-icerik.aktif {
    display: block;
    /* Sadece aktif olan görünsün */
}

/* ================================================================
 * [BİTİŞ] 40. PORTAL SEKME VE SAYACI STİLLERİ
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 42. TopyekÇ»n Tıklanabilir Kart Stilleri
 * ================================================================ */

/* Genel olarak, bir "card" sınıfına sahip "a" etiketlerinin
   altı çizili olmamasını ve normal kart gibi görünmesini sağla. */
a.card,
a.card:hover {
    text-decoration: none;
}

/* Kartın içindeki "Tüm Vakitler ->" yazısını, eski linkimiz gibi göster. */
.card .card-link-footer {
    color: #2dd4bf;
    font-weight: 500;
    margin-top: auto;
    /* Kendini her zaman en alta itsin */
    display: inline-block;
    /* Diğer kartlardaki a etiketiyle aynı davranması için */
}

/* Çœzerine gelince de rengi koru ve altını çiz */
a.card:hover .card-link-footer {
    text-decoration: underline;
    color: #5eead4;
}

/* Özellikle İbadet Yoldaşı kartının içindeki yazılar, link rengini almasın */
.ibadet-yoldasi-karti h3,
.ibadet-yoldasi-karti h3 .konum-bilgisi,
.ibadet-yoldasi-karti .ibadet-yoldasi-icerik,
.ibadet-yoldasi-karti .ibadet-yoldasi-icerik p {
    color: inherit;
    /* Ana kartın yazı rengini miras al */
}

/* ================================================================
 * [BİTİŞ] 42. TopyekÇ»n Tıklanabilir Kart Stilleri
 * ================================================================ */
/* ================================================================
 * [BAŞLANGIÇ] 43. OPERASYON: MOBİL TAARRUZ (EVRENSEL DUYARLILIK)
 * ================================================================ */

/* --- Orta ve Küçük Ekranlar İçin Genel Kurallar (Tablet ve altı) --- */
@media (max-width: 768px) {

    /* Sayfa kenar boşluklarını azalt */
    .inside-article {
        padding: 25px 15px !important;
    }

    .site-main {
        margin: 20px 0 !important;
    }

    /* Anasayfa Başlığını Küçült */
    .zenhar-hero h1 {
        font-size: 38px;
    }

    /* Kartların arasındaki boşluğu azalt */
    .features-grid {
        gap: 20px;
    }

    /* --- Namaz Vakitleri Portalı Mobil Uyum --- */

    /* Kontrol merkezini alt alta diz */
    .portal-kontrol-merkezi {
        flex-direction: column;
        align-items: stretch;
        /* Öğeleri tam genişliğe yay */
    }

    .il-secim-kutusu select {
        width: 100%;
        /* Select menüsü tam genişlik olsun */
        min-width: unset;
    }

    /* Geri sayım sayacını daha kompakt yap */
    .portal-geri-sayim-alani .yakin-vakit-bilgisi.portal-sayac {
        min-width: unset;
        width: 100%;
        padding: 15px;
    }

    .portal-geri-sayim-alani .yakin-vakit-isim {
        font-size: 28px;
    }

    .portal-geri-sayim-alani .geri-sayim {
        font-size: 22px;
    }

    /* Sekme butonlarını daha küçük yap */
    .sekme-link {
        font-size: 16px;
        padding: 12px 15px;
        flex-grow: 1;
        /* Boşluğu eşit paylaşsınlar */
        text-align: center;
    }

    /* Aylık tablo yazılarını küçült */
    .portal-aylik-vakitler-tablosu td {
        font-size: 15px;
        padding: 12px 5px;
    }

    .portal-aylik-vakitler-tablosu th {
        font-size: 14px;
    }

    .portal-aylik-vakitler-tablosu td small {
        font-size: 11px;
    }

}

/* @media (max-width: 768px) sonu */


/* --- Sadece Çok Küçük Ekranlar İçin (Dar Telefonlar) --- */
@media (max-width: 480px) {

    /* Header'daki menü yazılarını ve boşlukları azalt */
    .zenhar-desktop-nav ul {
        gap: 15px;
    }

    .zenhar-desktop-nav ul li a {
        font-size: 15px;
    }

    /* Portal başlığını küçült */
    .namaz-vakitleri-sayfasi .entry-header h1 {
        font-size: 28px;
    }

    /* Sekme butonlarını daha da küçült */
    .sekme-link {
        font-size: 14px;
        padding: 10px 8px;
    }
}

/* ================================================================
 * [BİTİŞ] 43. OPERASYON: MOBİL TAARRUZ
 * ================================================================ */
/* ==========================================================================
 * ZİKİRMATİK WIDGET STİLLERİ (ANASAYFA)
 * ========================================================================== */

.zikirmatik-karti {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--zenhar-gri-cizgi);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    min-height: 450px !important;
    display: flex;
    flex-direction: column;
}

.zikirmatik-karti:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
    border-color: var(--zenhar-altin);
}

.zikirmatik-karti .card-icon {
    color: var(--zenhar-altin);
    background: rgba(212, 175, 55, 0.1);
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    margin-bottom: 15px;
}

.zikir-badge {
    background: var(--zenhar-altin);
    color: var(--zenhar-zemin-koyu);
    font-size: 11px;
    padding: 3px 8px;
    border-radius: 10px;
    font-weight: 600;
    margin-left: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.zikirmatik-icerik {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin: 15px 0;
}

.zikir-sayac-widget {
    text-align: center;
}

.zikir-sayi-buyuk {
    font-size: 48px;
    font-weight: 700;
    color: var(--zenhar-altin);
    font-family: 'Inter', monospace;
    line-height: 1;
}

.zikir-sayac-widget small {
    display: block;
    margin-top: 5px;
    color: var(--zenhar-yazi-ana);
    font-size: 12px;
}

.zikir-hedef-widget {
    text-align: center;
}

.mini-progress {
    width: 100%;
    height: 6px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 5px;
}

.mini-progress-bar {
    height: 100%;
    background: linear-gradient(90deg, var(--zenhar-isik), var(--zenhar-altin));
    transition: width 0.3s ease;
    border-radius: 3px;
}

.zikir-hedef-widget small {
    color: var(--zenhar-yazi-ana);
    font-size: 11px;
}

/* ================================================================
 * [BAŞLANGIÇ] Mobil Menü Z-Index Düzeltmesi
 * ================================================================ */

/* Mobil menü açıldığında içeriğin üzerinde kalmasını sağla */
.main-navigation.toggled {
    position: relative;
    z-index: 10000 !important;
}

.main-navigation.toggled .main-nav {
    background-color: var(--zenhar-zemin-koyu);
    position: relative;
    z-index: 10000;
}

.main-navigation.toggled .main-nav>ul {
    background-color: var(--zenhar-zemin-koyu);
    position: relative;
    z-index: 10000;
}

/* Site header'ın her zaman üstte kalmasını garantile */
.site-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 10001 !important;
}

/* Mobil menü alt menüleri için z-index */
.main-navigation.toggled ul ul {
    z-index: 10002 !important;
}

/* ================================================================
 * [BİTİŞ] Mobil Menü Z-Index Düzeltmesi
 * ================================================================ */

/* ================================================================
 * [BAŞLANGIÇ] Paylaş ve Kalplere Dokun Kartı Stilleri
 * ================================================================ */
.paylasim-karti {
    text-decoration: none;
}

.paylasim-karti .paylasim-icon {
    background: linear-gradient(135deg, #ec4899, #8b5cf6);
    color: #fff;
}

.paylasim-karti .paylasim-icon i {
    color: #fff;
}

.paylasim-karti h3 {
    color: var(--zenhar-yazi-baslik);
}

.paylasim-karti .kart-alt-metin {
    color: var(--zenhar-yazi-ana);
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 15px;
}

.paylasim-karti:hover .paylasim-icon {
    transform: scale(1.1);
    transition: transform 0.3s ease;
}

.paylasim-karti .card-link-footer {
    color: #ec4899;
    font-weight: 500;
    margin-top: auto;
}

/* ================================================================
 * [BİTİŞ] Paylaş ve Kalplere Dokun Kartı Stilleri
 * ================================================================ */

/* ================================================================
 * [BAŞLANGIÇ] Video Kütüphanesi Kartı Stilleri
 * ================================================================ */
.video-kutuphane-karti {
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
    border: 1px solid rgba(45, 212, 191, 0.2);
    text-decoration: none;
}

.video-kutuphane-karti:hover {
    border-color: rgba(45, 212, 191, 0.5);
    box-shadow: 0 10px 40px rgba(45, 212, 191, 0.2);
}

.video-kutuphane-karti .card-icon {
    background: rgba(45, 212, 191, 0.15);
    color: #2dd4bf;
}

.video-kutuphane-karti h3 {
    color: #f8fafc;
}

.video-ozellik-listesi {
    list-style: none;
    padding: 0;
    margin: 10px 0 0 0;
    flex-grow: 1;
}

.video-ozellik-listesi li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    margin-bottom: 8px;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 8px;
    font-size: 14px;
    color: #cbd5e1;
    transition: all 0.3s ease;
    border-left: 3px solid transparent;
}

.video-ozellik-listesi li:hover {
    background: rgba(45, 212, 191, 0.1);
    border-left-color: #2dd4bf;
}

.video-ozellik-listesi li i {
    color: #2dd4bf;
    font-size: 16px;
    width: 20px;
    text-align: center;
}

.video-kutuphane-karti .card-link-footer {
    color: #2dd4bf;
    font-weight: 500;
    margin-top: auto;
    display: block;
}

.video-kutuphane-karti:hover .card-link-footer {
    color: #5eead4;
}

/* ================================================================
 * [BİTİŞ] Video Kütüphanesi Kartı Stilleri
 * ================================================================ */

/* ================================================================
 * [BAŞLANGIÇ] Paylaş ve Kalplere Dokun Kartı Stilleri
 * ================================================================ */
.paylasim-karti {
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
    border: 1px solid rgba(45, 212, 191, 0.2);
    text-decoration: none;
}

.paylasim-karti:hover {
    border-color: rgba(45, 212, 191, 0.5);
    box-shadow: 0 10px 40px rgba(45, 212, 191, 0.2);
}

.paylasim-karti .card-icon,
.paylasim-karti .paylasim-icon {
    background: rgba(45, 212, 191, 0.15);
    color: #2dd4bf;
}

.paylasim-karti h3 {
    color: #f8fafc;
}

.paylasim-karti .kart-alt-metin {
    color: #cbd5e1;
}

.paylasim-karti .card-link-footer {
    color: #2dd4bf;
    font-weight: 500;
    margin-top: auto;
    display: block;
}

.paylasim-karti:hover .card-link-footer {
    color: #5eead4;
}

/* ================================================================
 * [BİTİŞ] Paylaş ve Kalplere Dokun Kartı Stilleri
 * ================================================================ */

/* ================================================================
 * [BAŞLANGIÇ] Zikirmatik Kartı İkon Stilleri
 * ================================================================ */
.zikirmatik-karti .card-icon {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
    transition: all 0.3s ease;
}

.zikirmatik-karti:hover .card-icon {
    background: rgba(245, 158, 11, 0.15);
    color: #f59e0b;
}

/* ================================================================
 * [BİTİŞ] Zikirmatik Kartı İkon Stilleri
 * ================================================================ */

/* Ramazan kartı footer sola yasla */
.ramazan-karti .card-link-footer {
    text-align: left;
    display: block;
}

/* ================================================================
 * [BAŞLANGIÇ] 22. Blog Ana Sayfası Zigzag Liste Tasarımı
 * ================================================================ */

/* Blog sayfası genel container */
.blog .site-main,
.home.blog .site-main {
    background-color: var(--zenhar-zemin-koyu) !important;
    padding: 40px 20px !important;
    max-width: 1000px;
    margin: 0 auto;
}

/* Blog sayfası içerik alanı tam genişlik */
.blog .content-area,
.home.blog .content-area {
    width: 100% !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
}

/* Blog sayfası başlık */
.blog .page-header,
.home.blog .page-header {
    background: none !important;
    border: none !important;
    text-align: center;
    margin-bottom: 50px;
    padding: 30px 0;
}

.blog .page-header .page-title,
.home.blog .page-header .page-title {
    color: #2ecc71 !important;
    font-size: 2.2rem;
    position: relative;
}

.blog .page-header .page-title::after {
    content: '';
    display: block;
    width: 80px;
    height: 3px;
    background: linear-gradient(90deg, #2ecc71, #27ae60);
    margin: 15px auto 0;
    border-radius: 2px;
}

/* Her yazı kartı - Zigzag Flexbox düzeni */
.blog .site-main>article,
.blog .site-main>.post,
.home.blog .site-main>article,
.home.blog .site-main>.post {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    width: 100% !important;
    margin-bottom: 40px !important;
    background: var(--zenhar-kutu-koyu) !important;
    border-radius: 20px !important;
    border: 1px solid var(--zenhar-gri-cizgi) !important;
    overflow: hidden !important;
    transition: all 0.4s ease !important;
    padding: 0 !important;
}

/* Zigzag efekti - Çift satırlar ters yönde */
.blog .site-main>article:nth-child(even),
.blog .site-main>.post:nth-child(even),
.home.blog .site-main>article:nth-child(even),
.home.blog .site-main>.post:nth-child(even) {
    flex-direction: row-reverse !important;
}

/* Hover efekti */
.blog .site-main>article:hover,
.blog .site-main>.post:hover,
.home.blog .site-main>article:hover,
.home.blog .site-main>.post:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 40px rgba(46, 204, 113, 0.15);
    border-color: #2ecc71 !important;
}

/* Blog yazı içerik alanı */
.blog .post .inside-article,
.home.blog .post .inside-article {
    display: flex !important;
    flex-direction: inherit !important;
    align-items: center !important;
    width: 100% !important;
    padding: 0 !important;
    background: none !important;
}

/* Görsel Container */
.blog .post .post-image,
.blog .post .featured-image,
.blog .post .entry-image,
.home.blog .post .post-image,
.home.blog .post .featured-image {
    flex: 0 0 40% !important;
    max-width: 40% !important;
    height: 220px !important;
    overflow: hidden !important;
    border-radius: 15px !important;
    margin: 15px !important;
}

/* Görsel stilleri - yuvarlatılmış ve hareketli */
.blog .post .post-image img,
.blog .post .featured-image img,
.home.blog .post .post-image img,
.home.blog .post .featured-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 15px !important;
    transition: transform 0.5s ease, filter 0.3s ease !important;
}

/* Görsel hover efekti */
.blog .post:hover .post-image img,
.blog .post:hover .featured-image img,
.home.blog .post:hover .post-image img,
.home.blog .post:hover .featured-image img {
    transform: scale(1.08) rotate(1deg);
    filter: brightness(1.1);
}

/* İçerik alanı */
.blog .post .entry-header,
.blog .post .entry-summary,
.blog .post .entry-content,
.home.blog .post .entry-header,
.home.blog .post .entry-summary {
    flex: 1 !important;
    padding: 20px 30px !important;
}

/* Başlık - YEŞİL */
.blog .post .entry-title,
.home.blog .post .entry-title {
    font-size: 1.4rem !important;
    line-height: 1.5 !important;
    margin: 0 0 15px 0 !important;
    padding: 0 !important;
}

.blog .post .entry-title a,
.home.blog .post .entry-title a {
    color: #2ecc71 !important;
    text-decoration: none !important;
    transition: color 0.3s ease;
    font-weight: 600;
}

.blog .post:hover .entry-title a,
.home.blog .post:hover .entry-title a {
    color: #27ae60 !important;
    text-shadow: 0 0 10px rgba(46, 204, 113, 0.3);
}

/* Yazı özeti */
.blog .post .entry-summary,
.home.blog .post .entry-summary {
    color: var(--zenhar-yazi-ana) !important;
    font-size: 0.95rem !important;
    line-height: 1.7 !important;
    margin: 0 !important;
    padding: 0 30px 20px 30px !important;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Özetteki görselleri gizle */
.blog .post .entry-summary img,
.home.blog .post .entry-summary img {
    display: none !important;
}

/* ETİKETLERİ GİZLE */
.blog .post .entry-meta,
.blog .post .cat-links,
.blog .post .tags-links,
.blog .post .post-categories,
.blog .post footer.entry-meta,
.home.blog .post .entry-meta,
.home.blog .post .cat-links,
.home.blog .post .tags-links {
    display: none !important;
}

/* Devamını oku linki */
.blog .post .read-more,
.home.blog .post .read-more {
    display: inline-block;
    padding: 10px 25px;
    margin: 0 30px 20px 30px;
    background: linear-gradient(135deg, #27ae60, #2ecc71);
    color: #fff !important;
    border-radius: 25px;
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none !important;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(46, 204, 113, 0.3);
}

.blog .post .read-more:hover,
.home.blog .post .read-more:hover {
    transform: translateX(5px);
    box-shadow: 0 6px 20px rgba(46, 204, 113, 0.4);
    background: linear-gradient(135deg, #2ecc71, #27ae60);
}

/* Responsive - Tablet */
@media (max-width: 768px) {

    .blog .site-main>article,
    .blog .site-main>.post,
    .home.blog .site-main>article,
    .home.blog .site-main>.post,
    .blog .site-main>article:nth-child(even),
    .blog .site-main>.post:nth-child(even),
    .home.blog .site-main>article:nth-child(even),
    .home.blog .site-main>.post:nth-child(even) {
        flex-direction: column !important;
    }

    .blog .post .post-image,
    .blog .post .featured-image,
    .home.blog .post .post-image,
    .home.blog .post .featured-image {
        flex: none !important;
        max-width: 100% !important;
        width: calc(100% - 30px) !important;
        height: 200px !important;
        margin: 15px !important;
    }

    .blog .post .entry-title,
    .home.blog .post .entry-title {
        font-size: 1.2rem !important;
        text-align: center;
    }

    .blog .post .entry-summary,
    .home.blog .post .entry-summary {
        text-align: center;
    }

    .blog .post .read-more,
    .home.blog .post .read-more {
        display: block;
        text-align: center;
        margin: 0 30px 20px 30px;
    }
}

/* Sayfalama stilleri */
.blog .paging-navigation,
.home.blog .paging-navigation {
    text-align: center;
    margin-top: 50px;
    clear: both;
}

.blog .paging-navigation a,
.home.blog .paging-navigation a {
    display: inline-block;
    padding: 12px 25px;
    background: var(--zenhar-kutu-koyu);
    color: #2ecc71 !important;
    border: 2px solid #2ecc71;
    border-radius: 25px;
    text-decoration: none;
    margin: 0 10px;
    transition: all 0.3s ease;
}

.blog .paging-navigation a:hover,
.home.blog .paging-navigation a:hover {
    background: #2ecc71;
    color: #fff !important;
}

/* ================================================================
 * [BİTİŞ] 22. Blog Ana Sayfası Zigzag Liste Tasarımı
 * ================================================================ */

/* ================================================================
 * [BAŞLANGIÇ] 23. Hakkında Sayfası Premium Stiller
 * ================================================================ */

/* GeneratePress varsayılan beyaz container'ı ez - Tüm sayfalar için koyu tema */
.page .inside-article,
.page article,
.page .site-main,
.single .inside-article,
.single article {
    background-color: var(--zenhar-kutu-koyu) !important;
    color: var(--zenhar-yazi-ana) !important;
}

/* Sayfa içerik alanı */
.page .entry-content,
.single .entry-content {
    background-color: transparent !important;
    color: var(--zenhar-yazi-ana);
}

/* Sayfa başlık */
.page .entry-header .entry-title,
.page-header h1,
.single .entry-header .entry-title {
    color: var(--zenhar-yazi-baslik) !important;
    font-size: 2.2rem;
    margin-bottom: 30px;
    text-align: center;
    position: relative;
    padding-bottom: 20px;
}

/* Başlık altı dekoratif çizgi */
.page .entry-header .entry-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 3px;
    background: linear-gradient(90deg, var(--zenhar-isik), var(--zenhar-altin));
    border-radius: 2px;
}

/* Sayfa paragraflar */
.page .entry-content p,
.single .entry-content p {
    color: var(--zenhar-yazi-ana) !important;
    font-size: 1.05rem;
    line-height: 1.9;
    margin-bottom: 20px;
}

/* İlk paragraf vurgusu */
.page .entry-content p:first-of-type {
    font-size: 1.1rem;
    color: var(--zenhar-yazi-baslik) !important;
    border-left: 4px solid var(--zenhar-isik);
    padding: 20px;
    background: rgba(45, 212, 191, 0.08);
    border-radius: 0 10px 10px 0;
    margin-bottom: 25px;
}

/* Vurgulu metinler */
.page .entry-content strong,
.page .entry-content b {
    color: var(--zenhar-isik) !important;
    font-weight: 600;
}

/* Alt başlıklar */
.page .entry-content h2,
.page .entry-content h3,
.page .entry-content h4 {
    color: var(--zenhar-yazi-baslik) !important;
    margin-top: 35px;
    margin-bottom: 15px;
}

/* Listeler */
.page .entry-content ul,
.page .entry-content ol {
    color: var(--zenhar-yazi-ana);
    padding-left: 25px;
    margin-bottom: 20px;
}

.page .entry-content li {
    margin-bottom: 8px;
    line-height: 1.8;
    color: var(--zenhar-yazi-ana);
}

/* Linkler */
.page .entry-content a {
    color: var(--zenhar-isik) !important;
    text-decoration: none;
    border-bottom: 1px dashed var(--zenhar-isik);
    transition: all 0.3s ease;
}

.page .entry-content a:hover {
    color: var(--zenhar-altin) !important;
    border-bottom-color: var(--zenhar-altin);
}

/* Alıntılar */
.page .entry-content blockquote {
    background: linear-gradient(135deg, rgba(45, 212, 191, 0.1), rgba(245, 158, 11, 0.05));
    border-left: 4px solid var(--zenhar-altin);
    padding: 25px 30px;
    margin: 30px 0;
    border-radius: 0 15px 15px 0;
    font-style: italic;
    color: var(--zenhar-yazi-baslik);
}

.page .entry-content blockquote p {
    margin-bottom: 0;
    font-size: 1.1rem;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}

/* Responsive */
@media (max-width: 768px) {
    .page .entry-header .entry-title {
        font-size: 1.6rem;
    }

    .page .entry-content p {
        font-size: 1rem;
        line-height: 1.8;
    }

    .page .entry-content p:first-of-type {
        font-size: 1rem;
        padding: 15px;
    }
}

/* ================================================================
 * [BİTİŞ] 23. Hakkında Sayfası Premium Stiller
 * ================================================================ */