/*
 * EnFavori Design System — Typography Standard
 * ---------------------------------------------
 * Public arayüzdeki yazı hiyerarşisini tek sözleşmeye bağlar.
 * Görsel boyutu, kart geometrisi, spacing veya medya yerleşimine müdahale etmez.
 */

:root {
    /* Ana tipografi ailesi */
    --ef-type-font-family: var(--ef-font-sans);

    /* Başlık ölçeği — masaüstü */
    --ef-type-page-title-size: 30px;
    --ef-type-feature-title-size: 26px;
    --ef-type-section-title-size: 22px;
    --ef-type-card-title-size: 20px;
    --ef-type-compact-card-title-size: 16px;

    /* Gövde / UI ölçeği — masaüstü */
    --ef-description-font-family: var(--ef-font-sans);
    --ef-description-font-size: 14px;
    --ef-description-font-weight: 500;
    --ef-description-line-height: 1.55;
    --ef-description-color: var(--ef-color-muted);
    --ef-type-ui-size: 12.5px;
    --ef-type-meta-size: 11.5px;
    --ef-type-badge-size: 10.5px;
}

/* --------------------------------------------------------------------------
 * Public temel font ailesi
 * ----------------------------------------------------------------------- */
body #main-content,
body #main-content button,
body #main-content input,
body #main-content select,
body #main-content textarea {
    font-family: var(--ef-type-font-family) !important;
}

/* Semantik başlıklar için güvenli taban. Sayfaya özel sınıflar aşağıda
 * aynı ölçeğe bağlanır; renkler kendi sayfa tasarımından gelmeye devam eder. */
body #main-content h1 {
    font-family: var(--ef-type-font-family) !important;
    font-size: var(--ef-type-page-title-size) !important;
    font-weight: 850 !important;
    line-height: 1.18 !important;
    letter-spacing: -0.025em !important;
}

body #main-content h2 {
    font-family: var(--ef-type-font-family) !important;
    font-size: var(--ef-type-section-title-size) !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.02em !important;
}

body #main-content h3 {
    font-family: var(--ef-type-font-family) !important;
    font-size: var(--ef-type-card-title-size) !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    letter-spacing: -0.015em !important;
}

body #main-content h4 {
    font-family: var(--ef-type-font-family) !important;
    font-size: var(--ef-type-compact-card-title-size) !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    letter-spacing: -0.01em !important;
}

/* --------------------------------------------------------------------------
 * Sayfa ana başlıkları
 * ----------------------------------------------------------------------- */
body .ef-category-title-main,
body .ef-channel-heading,
body .ef-contact-page .ef-contact-hero-title,
body .hm-detail-title,
body .other-lists .list-title {
    font-family: var(--ef-type-font-family) !important;
    font-size: var(--ef-type-page-title-size) !important;
    font-weight: 850 !important;
    line-height: 1.18 !important;
    letter-spacing: -0.025em !important;
}

/* Ana sayfa karşılama ve büyük manşet — ana H1'den bir kademe küçük */
body .hm-home-page .hm-home-welcome-title,
body .hm-home-page .hm-home-hero-card-main .hm-home-hero-title {
    font-family: var(--ef-type-font-family) !important;
    font-size: var(--ef-type-feature-title-size) !important;
    font-weight: 850 !important;
    line-height: 1.18 !important;
    letter-spacing: -0.025em !important;
}

/* Ana sayfa yan manşetleri */
body .hm-home-page .hm-home-hero-side .hm-home-hero-title {
    font-family: var(--ef-type-font-family) !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1.28 !important;
    letter-spacing: -0.015em !important;
}

/* --------------------------------------------------------------------------
 * Bölüm başlıkları
 * ----------------------------------------------------------------------- */
body .hm-home-page .hm-home-section-title,
body .hm-home-page .hm-home-live-title,
body .hm-home-page .hm-home-insight-title,
body .ef-contact-page .ef-contact-card-title,
body .ef-contact-page .ef-contact-info-title,
body .ef-category-empty-title,
body .ef-channel-empty-title {
    font-family: var(--ef-type-font-family) !important;
    font-size: var(--ef-type-section-title-size) !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.02em !important;
}

/* --------------------------------------------------------------------------
 * Büyük kart başlıkları
 * ----------------------------------------------------------------------- */
body .ef-category-card-title,
body .ef-channel-card-title,
body .ef-channel-card.is-featured .ef-channel-card-title,
body .other-lists .votes .vote-container .title {
    font-family: var(--ef-type-font-family) !important;
    font-size: var(--ef-type-card-title-size) !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    letter-spacing: -0.015em !important;
}

/* Ana sayfadaki kompakt kart başlıkları */
body .hm-home-page .hm-home-rank-title,
body .hm-home-page .hm-home-trending-title,
body .hm-home-page .hm-home-list-title,
body .ef-contact-page .ef-contact-info-heading {
    font-family: var(--ef-type-font-family) !important;
    font-size: var(--ef-type-compact-card-title-size) !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    letter-spacing: -0.01em !important;
}

/* İletişim sağ kartındaki küçük alt başlıklar kompakt kart başlığından küçüktür. */
body .ef-contact-page .ef-contact-info-heading {
    font-size: 13px !important;
}

/* --------------------------------------------------------------------------
 * Açıklama / normal gövde metni
 * ----------------------------------------------------------------------- */
body .hm-home-page [class*="description"],
body .ef-category-page [class*="description"],
body .ef-channel-page [class*="description"],
body .ef-contact-page [class*="description"],
body .other-lists .list-description,
body .other-lists .votes .vote-container .description,
body .ef-page-description,
body .ef-empty-state__text {
    font-family: var(--ef-description-font-family) !important;
    font-size: var(--ef-description-font-size) !important;
    font-weight: var(--ef-description-font-weight) !important;
    line-height: var(--ef-description-line-height) !important;
    letter-spacing: 0 !important;
}

body .ef-category-card-description,
body .ef-channel-card-description,
body .ef-channel-card.is-featured .ef-channel-card-description {
    max-width: none !important;
    color: var(--ef-description-color) !important;
}

body .hm-home-page .hm-home-live-description,
body .hm-home-page .hm-home-section-description,
body .hm-home-page .hm-home-card-description,
body .hm-home-page .hm-home-list-description,
body .hm-home-page .hm-home-channel-description {
    color: var(--ef-description-color) !important;
}

body .other-lists .list-description,
body .other-lists .votes .vote-container .description {
    color: var(--ef-color-text-soft) !important;
}

body .ef-contact-page .ef-contact-info-text,
body .ef-contact-page .ef-contact-notice {
    font-family: var(--ef-description-font-family) !important;
    font-size: var(--ef-description-font-size) !important;
    font-weight: var(--ef-description-font-weight) !important;
    line-height: var(--ef-description-line-height) !important;
    letter-spacing: 0 !important;
}

/* --------------------------------------------------------------------------
 * Buton / CTA yazıları
 * ----------------------------------------------------------------------- */
body .hm-home-page .hm-home-hero-cta,
body .hm-home-page .hm-home-list-cta,
body .ef-category-vote-link,
body .ef-channel-card-action,
body .ef-contact-page .ef-contact-submit,
body .hm-item-detail-link {
    font-family: var(--ef-type-font-family) !important;
    font-size: var(--ef-type-ui-size) !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
}

/* --------------------------------------------------------------------------
 * Breadcrumb / meta / yardımcı metin
 * ----------------------------------------------------------------------- */
body .ef-category-breadcrumbs,
body .ef-channel-breadcrumbs,
body .ef-contact-page .ef-contact-breadcrumbs,
body .hm-list-stat-label,
body .hm-list-author-profile .profile {
    font-family: var(--ef-type-font-family) !important;
    font-size: var(--ef-type-meta-size) !important;
    line-height: 1.4 !important;
    letter-spacing: 0 !important;
}

/* --------------------------------------------------------------------------
 * Badge / metrik / chip
 * ----------------------------------------------------------------------- */
body .ef-category-badge,
body .ef-category-metric,
body .ef-category-hero-stat,
body .ef-channel-stat,
body .ef-channel-category-link,
body .ef-channel-category-badge,
body .ef-channel-featured-badge,
body .ef-channel-card-metric,
body .hm-home-page .hm-home-category,
body .hm-home-page .hm-home-channel,
body .hm-home-page .hm-home-list-metric,
body .hm-home-page .hm-home-rank-direction,
body .hm-home-page .hm-home-live-window,
body .hm-item-sponsored-badge {
    font-family: var(--ef-type-font-family) !important;
    font-size: var(--ef-type-badge-size) !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
}

/* --------------------------------------------------------------------------
 * Mobil tipografi ölçeği
 * ----------------------------------------------------------------------- */
@media (max-width: 767.98px) {
    :root {
        --ef-type-page-title-size: 24px;
        --ef-type-feature-title-size: 22px;
        --ef-type-section-title-size: 19px;
        --ef-type-card-title-size: 18px;
        --ef-type-compact-card-title-size: 15.5px;
        --ef-description-font-size: 13px;
        --ef-description-line-height: 1.5;
        --ef-type-ui-size: 12.5px;
        --ef-type-meta-size: 11px;
        --ef-type-badge-size: 10px;
    }

    body .hm-home-page .hm-home-hero-side .hm-home-hero-title {
        font-size: 17px !important;
    }

    body .ef-contact-page .ef-contact-info-heading {
        font-size: 12.5px !important;
    }
}