/*!
 * LIMITSIZ Eğitim — "Blog Detay" sayfası ([limitsiz_post]) stilleri.
 * Kaynak: dc-preview/Blog Yazisi.dc.html (inline stil değerleri BİREBİR taşındı).
 *
 * KAPSAM: her kural `.limitsiz-app` kökü + `.le-post-*` sayfa namespace'i (0,2,0).
 * Paylaşılan bileşenler (.le-h1/.le-tag/.le-prose/.le-media/.le-btn/.le-iconbtn/
 * .le-panel/.le-grid/.le-post-card/.le-link…) BURADA YENİDEN TANIMLANMAZ; yalnız
 * sayfaya özel bileşenler + .le-prose'a makale-tipi eklerin (blockquote/img/figure/
 * table/hr/pre/code) ince ayarı var — bunlar paylaşılan .le-prose çekirdeğinde
 * tanımlı DEĞİL. .le-post-card ("İlgili Yazılar") artık limitsiz.css §7b'de PAYLAŞILAN
 * bileşen — burada kopyası tutulmaz.
 * Bu dosya limitsiz.css'ten SONRA yüklenir (Limitsiz_Assets::enqueue_page).
 */

/* =============================================================================
 * 1) İLGİLİ YAZILAR IZGARASI — Blog Yazisi.dc.html birebir boşluk
 *    (blog.php'deki grid ile aynı gap; blog.css'te de tekrarlanır çünkü sayfalar
 *    bağımsız enqueue edilir — bkz. blog.css §3 notu).
 * ========================================================================== */
.limitsiz-app .le-blog-grid{gap:clamp(16px,1.8vw,24px)}

/* Kompakt kart (partials/blog-card.php variant="compact") — Blog Yazisi.dc.html
 * satır 121-131 birebir: 16/9 görsel + 1px alt kenarlık, 17px başlık, ÖZET YOK,
 * meta yalnız tarih (padding-top 12), yedek zemin açık lila degrade + #8E80BC ikon.
 * Paylaşılan .le-post-card çekirdeği (limitsiz.css §7b) değiştirilmez. */
.limitsiz-app[data-page="post"] .le-post-card__media{
  border-bottom:1px solid var(--le-border);
  background:linear-gradient(135deg,var(--le-surface-2),var(--le-surface-3));
}
.limitsiz-app[data-page="post"] .le-post-card__ph{color:#8E80BC}
.limitsiz-app[data-page="post"] .le-post-card__ph .le-ico{width:30px;height:30px}
.limitsiz-app[data-page="post"] .le-post-card__meta{gap:12px;padding-top:12px;line-height:normal}

/* =============================================================================
 * 2) HERO — breadcrumb + kategori rozeti + h1 + meta (yazar/tarih/okuma)
 * ========================================================================== */
.limitsiz-app .le-post-hero{
  background:linear-gradient(180deg,var(--le-surface),var(--le-white));
  border-bottom:1px solid var(--le-border);
  padding:clamp(20px,2.6vw,32px) 0 clamp(28px,3.4vw,48px);
}
.limitsiz-app .le-post-hero__crumb{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  font-size:13px;color:var(--le-muted);
}
.limitsiz-app .le-post-hero__crumb a{
  display:inline-flex;align-items:center;min-height:44px;color:var(--le-muted);
  transition:color var(--le-t-color) ease;
}
.limitsiz-app .le-post-hero__crumb a:hover,
.limitsiz-app .le-post-hero__crumb a:focus-visible{color:var(--le-brand-700)}
.limitsiz-app .le-post-hero__crumb [aria-current]{color:var(--le-ink);font-weight:600}

.limitsiz-app .le-post-hero__cat{margin:6px 0 14px}

.limitsiz-app .le-post-hero__meta{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:18px;
  font-size:14px;color:var(--le-muted);
}
.limitsiz-app .le-post-hero__author{display:flex;align-items:center;gap:10px}
.limitsiz-app .le-post-hero__author-name{font-weight:600;color:var(--le-ink)}

/* Markalı yazar avatarı — WP gravatar yerine baş harfli dolgu daire (dc.html: 36px). */
.limitsiz-app .le-post-avatar{
  width:36px;height:36px;flex:none;border-radius:50%;
  background:var(--le-brand-900);color:#fff;
  display:grid;place-items:center;font-size:13px;font-weight:700;line-height:1;user-select:none;
}

/* =============================================================================
 * 3) KAPAK GÖRSELİ — 16:9, öne çıkan görsel yoksa marka yüzeyi + ikon (gri kutu YOK)
 * ========================================================================== */
.limitsiz-app .le-post-cover{padding:clamp(24px,3vw,40px) 0 0}
.limitsiz-app .le-post-cover__box{border-radius:20px;border:1px solid var(--le-border)}
.limitsiz-app .le-post-cover__ph{position:absolute;inset:0;display:grid;place-items:center;color:#8E80BC}
.limitsiz-app .le-post-cover__ph .le-ico{width:42px;height:42px}

/* =============================================================================
 * 4) MAKALE GÖVDESİ — .le-prose çekirdeğine the_content öğeleri için ek biçim
 * ========================================================================== */
.limitsiz-app .le-post-body{padding-top:clamp(20px,2.6vw,32px);padding-bottom:clamp(48px,6vw,80px)}
.limitsiz-app .le-post-article__prose{scroll-margin-top:96px}

/* --- MAKALE TİPOGRAFİSİ — Blog Yazisi.dc.html'den ÖLÇÜLEN literal değerler -------
 * Paylaşılan .le-prose çekirdeği (17px/1.85/--le-ink-soft/70ch) GLOBAL DEĞİŞTİRİLMEZ:
 * [limitsiz_legal] aynı sınıfı kullanıyor ve orada maketle tam eşleşiyor. Sapma
 * yalnız bu sayfada, `[data-page="post"]` (0,3,x) ile kapatılır.
 *
 * Maket (satır 66-98) İKİ paragraf rolü tanımlar:
 *   giriş (lead, ilk çocuk) : 19px / 1.75 (33.25) / 500 / #19132E / mt clamp(24,3vw,36)
 *   gövde  p                : 17px / 1.80 (30.60) / 400 / #625D70 / mt 14px
 *   h2                      : clamp(23px,2.1vw,28px) / 1.28 / -.01em / mt clamp(28,3vw,40)
 *   satır ölçüsü            : 772px (820px kap − 2×24px iç boşluk) → max-width kısıtı YOK
 * ⚠ .le-prose'un `>*+*{margin-top:1.15em}` ritmi burada em yerine maketin px
 *   değerlerine sabitlenir; bu yüzden her öğe tipi ayrı ayrı yazılmıştır.
 * -------------------------------------------------------------------------- */
.limitsiz-app[data-page="post"] .le-post-article__prose{
  max-width:none;              /* 70ch (725.9px) kısıtı kalkar → maket ölçüsü 772px */
  font-size:17px;line-height:1.8;color:var(--le-muted);
}
.limitsiz-app[data-page="post"] .le-post-article__prose>p{margin-top:14px}
/* Giriş (lead) paragrafı — maketteki 19px/500/#19132E açılış cümlesi.
   Üst boşluğu .le-post-body'nin padding-top'u verir (maket: kap içi 36px mt). */
.limitsiz-app[data-page="post"] .le-post-article__prose>p:first-child{
  font-size:19px;line-height:1.75;font-weight:500;color:var(--le-ink);
}
.limitsiz-app[data-page="post"] .le-post-article__prose>:where(h2){
  font-size:clamp(23px,2.1vw,28px);line-height:1.28;letter-spacing:-.01em;
  margin-top:clamp(28px,3vw,40px);
}
.limitsiz-app[data-page="post"] .le-post-article__prose>:where(ul,ol){margin-top:16px}
.limitsiz-app[data-page="post"] .le-post-article__prose>:where(blockquote,figure,table,pre,hr){margin-top:22px}
/* İlk öğe hangisi olursa olsun gövde kabın tepesine yaslanır (maket: mt yok). */
.limitsiz-app[data-page="post"] .le-post-article__prose>:first-child{margin-top:0}

.limitsiz-app .le-post-article__prose :where(h4){
  font-size:16.5px;font-weight:700;color:var(--le-brand-900);margin-top:1.4em;
}
.limitsiz-app .le-post-article__prose :where(h2,h3,h4){scroll-margin-top:96px}
.limitsiz-app .le-post-article__prose :where(strong,b){color:var(--le-ink);font-weight:700}

.limitsiz-app .le-post-article__prose :where(blockquote){
  margin-top:1.15em;padding:20px 22px;border:1px solid var(--le-border);border-radius:16px;
  background:var(--le-surface);font-size:16px;line-height:1.7;color:var(--le-ink);font-weight:600;
}
.limitsiz-app .le-post-article__prose :where(blockquote p){margin:0}
.limitsiz-app .le-post-article__prose :where(blockquote p+p){margin-top:.8em}

.limitsiz-app .le-post-article__prose :where(img,figure){border-radius:16px;max-width:100%}
.limitsiz-app .le-post-article__prose :where(figure){margin-top:1.15em}
.limitsiz-app .le-post-article__prose :where(figure img){margin:0}
.limitsiz-app .le-post-article__prose :where(figcaption){margin-top:8px;font-size:13px;color:var(--le-muted);text-align:center}

.limitsiz-app .le-post-article__prose :where(table){width:100%;border-collapse:collapse;font-size:14.5px;margin-top:1.15em}
.limitsiz-app .le-post-article__prose :where(th,td){padding:10px 14px;border:1px solid var(--le-border);text-align:left;color:var(--le-ink-soft)}
.limitsiz-app .le-post-article__prose :where(th){background:var(--le-surface);color:var(--le-brand-900);font-weight:700}

.limitsiz-app .le-post-article__prose :where(hr){border-top:1px solid var(--le-border);margin:2em 0}
.limitsiz-app .le-post-article__prose :where(pre){
  background:var(--le-brand-900);color:#E4EBF7;padding:16px 18px;border-radius:12px;
  overflow-x:auto;font-size:13.5px;margin-top:1.15em;
}
.limitsiz-app .le-post-article__prose :where(code){
  background:var(--le-surface-2);color:var(--le-brand-700);padding:2px 6px;border-radius:5px;font-size:13.5px;
}
.limitsiz-app .le-post-article__prose :where(pre code){background:none;color:inherit;padding:0}

/* --- gövde içi CTA kutusu --- */
.limitsiz-app .le-post-cta{
  display:flex;flex-wrap:wrap;align-items:center;gap:16px;
  margin-top:clamp(28px,3.2vw,40px);padding:clamp(20px,2.4vw,28px);
  border-radius:20px;border:1px solid var(--le-border);background:var(--le-surface);
}
.limitsiz-app .le-post-cta__text{flex:1 1 280px;min-width:0}
.limitsiz-app .le-post-cta__title{margin:0;font-size:17px;font-weight:800;color:var(--le-brand-900);line-height:1.3}
.limitsiz-app .le-post-cta__text p+p{margin-top:6px}
.limitsiz-app .le-post-cta__actions{display:flex;flex-wrap:wrap;gap:10px}

/* --- paylaşım satırı --- */
.limitsiz-app .le-post-share{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;
  margin-top:26px;padding-top:20px;border-top:1px solid var(--le-border);
}
.limitsiz-app .le-post-share__label{font-size:13.5px;font-weight:700;color:var(--le-ink);margin-right:4px}
.limitsiz-app .le-post-share__copy.is-copied{background:var(--le-success-bg);border-color:var(--le-success);color:#0B5F3D}

/* =============================================================================
 * 5) İLGİLİ YAZILAR — başlık satırı (sol h2 / sağ "Tüm Yazıları Gör")
 * ========================================================================== */
.limitsiz-app .le-post-related__head{
  display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 24px;
  margin-bottom:clamp(20px,2.4vw,30px);
}

/* =============================================================================
 * 6) KAPANIŞ CTA BANDI — .le-panel/.le-panel--dark üzerine
 * ========================================================================== */
.limitsiz-app .le-post-endcta{
  display:flex;flex-wrap:wrap;align-items:center;gap:20px;
  padding:clamp(28px,3.4vw,44px);
}
.limitsiz-app .le-post-endcta__text{flex:1 1 320px;min-width:0}
.limitsiz-app .le-panel--dark .le-post-endcta__title{color:#fff}
.limitsiz-app .le-post-endcta__lead{margin:12px 0 0;font-size:16px;line-height:1.6;color:rgba(255,255,255,.82);max-width:52ch}
.limitsiz-app .le-post-endcta__actions{display:flex;flex-wrap:wrap;gap:12px}

/* =============================================================================
 * 7) BOŞ DURUM — "Yazı bulunamadı"
 * ========================================================================== */
.limitsiz-app .le-post-notfound{max-width:560px;margin-inline:auto}
.limitsiz-app .le-post-notfound__title{margin-top:14px}
.limitsiz-app .le-post-notfound__text{margin-top:10px;max-width:48ch}
.limitsiz-app .le-post-notfound__actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:20px}

/* =============================================================================
 * 8) DAR EKRAN AYARLARI
 * ========================================================================== */
@media (max-width:560px){
  .limitsiz-app .le-post-cover__box{border-radius:16px}
  .limitsiz-app .le-post-cta{padding:18px}
  .limitsiz-app .le-post-endcta{padding:24px 20px}
}

/* =============================================================================
 * 9) ELEMENTOR ÇAKIŞMA DÜZELTMELERİ (bu sayfaya özel yüzeyler)
 *    Genel armor limitsiz.css §19'da; burada yalnız sayfa bileşenleri (savunmacı
 *    tekrar — about.css/blog.css ile aynı kural).
 * ========================================================================== */
.limitsiz-app .le-post-cover__box{border:1px solid var(--le-border)}
.limitsiz-app .le-post-cta{border:1px solid var(--le-border)}
