/* ============================================================
   HABER DETAY SAYFASI STİLLERİ
   Profesyonel tipografi, okunabilirlik odaklı
   ============================================================ */

/* Başlık */
.haber-detay-baslik {
    font-size: var(--yazi-3xl);
    font-weight: 900;
    line-height: 1.25;
    color: var(--renk-siyah);
    margin-bottom: var(--bosluk-12);
    letter-spacing: -0.3px;
}

/* Spot */
.haber-detay-spot {
    font-size: var(--yazi-lg);
    font-weight: 500;
    color: var(--renk-metin-orta);
    line-height: 1.6;
    margin-bottom: var(--bosluk-16);
    padding-left: var(--bosluk-16);
    border-left: 4px solid var(--renk-vurgu);
    font-style: italic;
}

/* Meta Satırı */
.haber-detay-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--bosluk-8);
    font-size: var(--yazi-sm);
    color: var(--renk-meta);
    padding: var(--bosluk-12) 0;
    border-top: 1px solid var(--renk-border-acik);
    border-bottom: 1px solid var(--renk-border-acik);
    margin-bottom: var(--bosluk-16);
}

.haber-detay-meta .meta-yazar {
    display: flex;
    align-items: center;
    gap: var(--bosluk-6);
}

.haber-detay-meta .meta-yazar a {
    font-weight: 600;
    color: var(--renk-metin);
}

.haber-detay-meta .meta-yazar a:hover { color: var(--renk-destek); }

.haber-detay-meta .meta-ayirici {
    color: var(--renk-border);
}

.yazar-mini-avatar {
    width: 28px;
    height: 28px;
    border-radius: var(--radius-tam);
    object-fit: cover;
}

/* Sosyal Paylaşım Butonları */
.paylasim-kutulari {
    display: flex;
    align-items: center;
    gap: var(--bosluk-6);
    margin-bottom: var(--bosluk-16);
    flex-wrap: wrap;
}

.paylasim-btn {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    color: #fff;
    font-size: var(--yazi-baz);
    transition: all var(--gecis-normal);
}

.paylasim-btn:hover {
    transform: translateY(-2px);
    box-shadow: var(--golge-md);
    color: #fff;
}

.paylasim-facebook { background: #1877f2; }
.paylasim-twitter { background: #000; }
.paylasim-whatsapp { background: #25d366; }
.paylasim-email { background: var(--renk-meta); }
.paylasim-kopyala { background: var(--renk-metin-acik); }

/* Ana Görsel */
.haber-detay-gorsel {
    margin-bottom: var(--bosluk-24);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.haber-detay-gorsel img {
    width: 100%;
    height: auto;
    aspect-ratio: 16/9;
    object-fit: cover;
}

.haber-detay-gorsel figcaption {
    padding: var(--bosluk-8) var(--bosluk-12);
    font-size: var(--yazi-xs);
    color: var(--renk-meta);
    background: var(--renk-arka-plan);
    font-style: italic;
}

/* Haber Gövdesi - Tipografi */
.haber-detay-govde {
    font-size: var(--yazi-md);
    line-height: 1.85;
    color: var(--renk-metin);
    max-width: 720px;
}

.haber-detay-govde p {
    margin-bottom: var(--bosluk-20);
}

.haber-detay-govde h2,
.haber-detay-govde h3,
.haber-detay-govde h4 {
    margin-top: var(--bosluk-32);
    margin-bottom: var(--bosluk-12);
}

.haber-detay-govde h2 { font-size: var(--yazi-xl); }
.haber-detay-govde h3 { font-size: var(--yazi-lg); }
.haber-detay-govde h4 { font-size: var(--yazi-md); }

.haber-detay-govde img {
    border-radius: var(--radius-md);
    margin: var(--bosluk-16) 0;
}

.haber-detay-govde blockquote {
    border-left: 4px solid var(--renk-destek);
    padding: var(--bosluk-16) var(--bosluk-20);
    background: var(--renk-arka-plan);
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    margin: var(--bosluk-20) 0;
    font-style: italic;
    color: var(--renk-metin-orta);
}

.haber-detay-govde ul, .haber-detay-govde ol {
    padding-left: var(--bosluk-24);
    margin-bottom: var(--bosluk-16);
}

.haber-detay-govde li { margin-bottom: var(--bosluk-6); }
.haber-detay-govde ul li { list-style: disc; }
.haber-detay-govde ol li { list-style: decimal; }

.haber-detay-govde a {
    color: var(--renk-destek);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.haber-detay-govde strong { color: var(--renk-siyah); }

.haber-detay-govde table {
    width: 100%;
    border-collapse: collapse;
    margin: var(--bosluk-16) 0;
    font-size: var(--yazi-baz);
}

.haber-detay-govde table th,
.haber-detay-govde table td {
    padding: var(--bosluk-8) var(--bosluk-12);
    border: 1px solid var(--renk-border);
    text-align: left;
}

.haber-detay-govde table th {
    background: var(--renk-arka-plan);
    font-weight: 700;
}

/* Video embed */
.haber-detay-govde iframe,
.haber-detay-govde .video-embed {
    width: 100%;
    aspect-ratio: 16/9;
    border-radius: var(--radius-md);
    border: none;
    margin: var(--bosluk-16) 0;
}

/* Kaynak */
.haber-kaynak {
    font-size: var(--yazi-sm);
    color: var(--renk-meta);
    padding: var(--bosluk-10) var(--bosluk-16);
    background: var(--renk-arka-plan);
    border-radius: var(--radius-md);
    margin: var(--bosluk-20) 0;
}

/* Etiketler */
.haber-etiketler {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--bosluk-6);
    padding: var(--bosluk-16) 0;
}

.haber-etiketler > i {
    color: var(--renk-meta);
    margin-right: var(--bosluk-4);
}

.etiket-chip {
    display: inline-block;
    padding: 3px 12px;
    background: var(--renk-arka-plan);
    border: 1px solid var(--renk-border);
    border-radius: var(--radius-xl);
    font-size: var(--yazi-xs);
    color: var(--renk-metin-orta);
    font-weight: 500;
    transition: all var(--gecis-hizli);
}

.etiket-chip:hover {
    background: var(--renk-destek);
    color: #fff;
    border-color: var(--renk-destek);
}

/* Yazar Kutusu */
.yazar-kutusu {
    display: flex;
    gap: var(--bosluk-20);
    padding: var(--bosluk-20);
    background: var(--renk-arka-plan);
    border-radius: var(--radius-lg);
    margin-top: var(--bosluk-24);
    border: 1px solid var(--renk-border-acik);
}

.yazar-kutusu-avatar img {
    width: 80px;
    height: 80px;
    border-radius: var(--radius-tam);
    object-fit: cover;
    border: 3px solid var(--renk-beyaz);
    box-shadow: var(--golge-sm);
}

.yazar-kutusu-bilgi h4 {
    font-size: var(--yazi-md);
    margin-bottom: var(--bosluk-4);
}

.yazar-kutusu-bilgi h4 a { color: var(--renk-siyah); }
.yazar-kutusu-bilgi h4 a:hover { color: var(--renk-destek); }

.yazar-kutusu-bilgi p {
    font-size: var(--yazi-sm);
    color: var(--renk-metin-acik);
    line-height: 1.5;
}

/* Yorum Alanı */
.yorum-alani {
    margin-top: var(--bosluk-32);
    padding-top: var(--bosluk-24);
    border-top: 2px solid var(--renk-border);
}

.yorum-listesi {
    margin-bottom: var(--bosluk-32);
}

.yorum-ogesi {
    display: flex;
    gap: var(--bosluk-12);
    padding: var(--bosluk-16) 0;
    border-bottom: 1px solid var(--renk-border-acik);
}

.yorum-avatar {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-tam);
    background: linear-gradient(135deg, var(--renk-marka) 0%, var(--renk-destek) 100%);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: var(--yazi-baz);
    flex-shrink: 0;
}

.yorum-icerik { flex: 1; min-width: 0; }

.yorum-baslik-satir {
    display: flex;
    align-items: center;
    gap: var(--bosluk-10);
    margin-bottom: var(--bosluk-4);
}

.yorum-baslik-satir strong {
    font-size: var(--yazi-sm);
    color: var(--renk-siyah);
}

.yorum-tarih {
    font-size: var(--yazi-xs);
    color: var(--renk-meta);
}

.yorum-icerik p {
    font-size: var(--yazi-sm);
    color: var(--renk-metin-orta);
    line-height: 1.5;
}

/* Yorum Formu */
.yorum-form-alani {
    background: var(--renk-arka-plan);
    padding: var(--bosluk-24);
    border-radius: var(--radius-lg);
}

.form-satir {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--bosluk-16);
}

.form-grup {
    margin-bottom: var(--bosluk-16);
}

.form-grup label {
    display: block;
    font-size: var(--yazi-sm);
    font-weight: 600;
    color: var(--renk-metin);
    margin-bottom: var(--bosluk-6);
}

.form-grup input,
.form-grup textarea {
    width: 100%;
    padding: var(--bosluk-10) var(--bosluk-12);
    border: 2px solid var(--renk-border);
    border-radius: var(--radius-md);
    font-size: var(--yazi-baz);
    background: var(--renk-beyaz);
    outline: none;
    transition: all var(--gecis-normal);
}

.form-grup input:focus,
.form-grup textarea:focus {
    border-color: var(--renk-destek);
    box-shadow: 0 0 0 3px rgba(21,101,192,0.1);
}

.form-grup textarea {
    resize: vertical;
    min-height: 100px;
}

/* Responsive */
@media (max-width: 768px) {
    .haber-detay-baslik { font-size: var(--yazi-xl); }
    .haber-detay-spot { font-size: var(--yazi-baz); }
    .haber-detay-govde { font-size: var(--yazi-baz); line-height: 1.75; }
    .haber-detay-meta { font-size: var(--yazi-xs); }
    .yazar-kutusu { flex-direction: column; align-items: center; text-align: center; }
    .form-satir { grid-template-columns: 1fr; }
}

@media (max-width: 576px) {
    .haber-detay-baslik { font-size: var(--yazi-lg); }
    .paylasim-btn { width: 32px; height: 32px; font-size: var(--yazi-sm); }
}