/* =========================================================
   ETİKET SAYFASI  (pages/tag.php)
   =========================================================

   NE DEĞİŞTİ

   Sayfanın üstü "sticky top-0 bg-white border-b" ile düz beyaz bir
   şeritti; sitenin geri kalanı yuvarlak kabukken burası tablo başlığı
   gibi duruyordu. Orta sütunu çerçeveleyen kenar çizgileri de yoktu.

   YAPI

     .tag-center-surface  → orta sütunun zemini + sol/sağ kenar çizgisi
     .page-hero.tag-hero  → "#etiket" başlığı (öndeki kart)
     .page-tabs.tag-tabs  → Tümü / Gönderiler / Alıntılar / ...
                            (yalnızca birden fazla tür varsa çizilir)

   ---------------------------------------------------------
   ELEMAN HARİTASI — hangi sınıf ekranda neye denk geliyor
   ---------------------------------------------------------

     .tag-center-surface  Orta sütunun zemini ve kenar çizgileri
     .tag-hero            Üstteki "#etiket" kartı
     .tag-hero.is-solo      └ sekme barı YOKKEN kullanılan hali
                              (kabuğun -20px payını sıfırlar)
     .tag-title-line        └ geri oku + başlığı yan yana koyan satır
     .tag-back              └ geri okunun yuvarlak butonu
                              (entity.css'teki .entity-back'in aynısı)
     .tag-title             └ #etiket yazısı (taşarsa üç nokta)
     .tag-count             └ sağdaki "2 gönderi"

     .tag-tabs            Sekme barı
     .tag-tabs .page-tab    └ tek sekme (eşit paylaşır)

     .tag-feed            Gönderi kartlarının kapsayıcısı
     .tag-more            "Daha fazla göster" butonunun satırı
     .tag-more-btn          └ butonun kendisi
     .tag-empty           "Bu etikette henüz gönderi yok" kutusu

   Ölçüler (kart genişliği, köşe, gölge) post kartından geliyor;
   burada tekrar tanımlanmıyor. Kart kenar boşluğunu değiştirmek
   istersen post_card.css satır 149-150.
   ========================================================= */


/* ---------- ORTA YÜZEY ----------
   Değerler profil / keşfet / bildirimler / kaydedilenler / gönderi
   sayfalarıyla BİREBİR aynı. */
.tag-center-surface {
    box-sizing: border-box;
    min-height: 100vh;
    background: #f6f7f9;
    border-left: 1px solid #e2e5ea;
    border-right: 1px solid #e2e5ea;
    box-shadow: 0 12px 32px rgba(17, 24, 39, .04);
}
html.dark .tag-center-surface {
    background: transparent;
    border-left-color: rgba(255, 255, 255, .10);
    border-right-color: rgba(255, 255, 255, .10);
    box-shadow: none;
}


/* ---------- BAŞLIK ---------- */

/* Sekme barı çizilmediğinde hero'nun arkasında kart kalmıyor;
   -20px payı sıfırlanmazsa ilk gönderi kartı başlığın altına kayar. */
.page-hero.tag-hero.is-solo { margin-bottom: 0; }

/* .page-hero-head baseline hizalıyor; geri oku için center gerek. */
.tag-hero .page-hero-head { align-items: center; }

.tag-title-line {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

/* entity.css satır 59-75'ten birebir — kitap/yazar sayfalarındaki ok. */
.tag-back {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin-left: -6px;
    border-radius: 9999px;
    color: #6b7280;
    text-decoration: none;
    transition: background .15s ease, color .15s ease;
}
.tag-back:hover { background: #f1f3f5; color: #111827; }
html.dark .tag-back { color: #9ca3af; }
html.dark .tag-back:hover { background: rgba(255, 255, 255, .08); color: #f3f4f6; }

.tag-back svg { width: 19px; height: 19px; }

/* Başlık ölçüsü .page-hero-title'dan gelir; burada yalnızca taşma. */
.tag-title {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Sayı eskiden başlığın ALTINDAYDI ve şeridi 80px'e çıkarıyordu.
   Artık sağda, .page-hero-head'in "yardımcı bilgi" yuvasında —
   kitap/yazar sayfalarındaki "KİTAP" etiketiyle aynı yer. */
.tag-count { flex: 0 0 auto; }


/* ---------- SEKMELER ----------
   Ölçü ve zemin kabuktaki .page-tabs / .page-tab'dan geliyor;
   burada yalnızca eşit paylaşım var. */
.tag-tabs .page-tab { flex: 1 1 0; min-width: 0; }


/* ---------- AKIŞ ---------- */
.tag-feed { padding-bottom: 8px; }
/* TAG_CARD_LAYOUT_20261110 */
html:root .tag-center-surface:has(> #tagFeed) {
    background: var(--dp-post-card-canvas, transparent) !important;
}

html:root .tag-center-surface:has(> #tagFeed) > .tag-hero {
    background: var(--dp-panel-bg, var(--shell-hero-bg, #fff)) !important;
}

html:root .tag-center-surface > .tag-hero.is-solo:has(+ #tagFeed) {
    border-bottom-left-radius: var(--dp-panel-radius, 20px) !important;
    border-bottom-right-radius: var(--dp-panel-radius, 20px) !important;
}

html:root .tag-center-surface > #tagFeed {
    margin-top: 6px !important;
    background: transparent !important;
}


/* ---------- DAHA FAZLA GÖSTER ----------
   Etiket sayfası 30'ar gönderi yüklüyor; bu buton kalan gönderi
   bitene kadar duruyor ve kartları listenin ALTINA ekliyor
   (sayfa yenilenmiyor, önceki kartlar kaybolmuyor). */
.tag-more {
    display: flex;
    justify-content: center;
    padding: 4px 20px 28px;
}

.tag-more-btn {
    padding: 10px 22px;
    border: 1px solid #dfe3e8;
    border-radius: 9999px;
    background: #ffffff;
    color: #0f1419;
    font-family: inherit;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, opacity .15s ease;
}
.tag-more-btn:hover { background: #f5f7f9; border-color: #c9ced6; }
.tag-more-btn:disabled { opacity: .55; cursor: default; }
html.dark .tag-more-btn {
    border-color: rgba(255, 255, 255, .14);
    background: rgba(255, 255, 255, .045);
    color: #f3f5f7;
}
html.dark .tag-more-btn:hover { background: rgba(255, 255, 255, .09); border-color: rgba(255, 255, 255, .26); }


/* ---------- BOŞ DURUM ----------
   Bildirimler / Kaydedilenler / Gönderi sayfalarındaki kartın aynısı. */
/* Üstteki 24px açık yazıldı: "margin: 0 20px 24px" kısayolu kabuğun
   ".page-tabs + *" kuralını ezip kartı sekme barına yapıştırıyordu. */
.tag-empty {
    margin: 24px 20px;
    padding: 56px 28px;
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .06),
                0 1px 2px rgba(15, 23, 42, .04);
    color: #9aa3ae;
    font-size: 13.5px;
    line-height: 1.5;
    text-align: center;
}
html.dark .tag-empty {
    background: rgba(255, 255, 255, .045);   /* yanlış siyahtı — sözleşme kart rengi (SIYAH_20261027) */
    box-shadow: 0 10px 30px rgba(0, 0, 0, .35),
                inset 0 1px 0 rgba(255, 255, 255, .04);
    color: #79838f;
}


@media (max-width: 640px) {
    .tag-empty { margin-left: 12px; margin-right: 12px; padding: 44px 20px; }
}
