/* ═══════════════════════════════════════════
   HaberTanik - Modern UX Enhancements
   ═══════════════════════════════════════════ */

/* ── Reading Progress Bar (eğer style.css'te yoksa) ── */
.reading-progress-bar {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    width: 0%;
    background: linear-gradient(90deg, var(--primary, #dc2626), #f59e0b);
    z-index: 9999;
    transition: width .15s ease-out;
}

/* ═══ DARK MODE ═══ */
:root[data-theme="dark"] {
    --color-body-bg: #0f172a;
    --color-dark: #f1f5f9;
    --color-text: #e2e8f0;
    --color-card-bg: #1e293b;
    --color-border: #334155;
    --bg: #0f172a;
    --dark: #f1f5f9;
}

:root[data-theme="dark"] body {
    background: #0f172a !important;
    color: #e2e8f0 !important;
}

:root[data-theme="dark"] .news-card,
:root[data-theme="dark"] .section-block,
:root[data-theme="dark"] .sidebar-widget,
:root[data-theme="dark"] .detail-content,
:root[data-theme="dark"] .detail-wrapper,
:root[data-theme="dark"] .infinite-article,
:root[data-theme="dark"] .article-related,
:root[data-theme="dark"] .author-box,
:root[data-theme="dark"] .news-card-body,
:root[data-theme="dark"] .news-list-item,
:root[data-theme="dark"] .footer-newsletter,
:root[data-theme="dark"] .ad-placeholder-box {
    background-color: #1e293b !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}

:root[data-theme="dark"] .site-header,
:root[data-theme="dark"] .header-main,
:root[data-theme="dark"] .header-ticker-bar,
:root[data-theme="dark"] .offcanvas-menu {
    background: #0f172a !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}

:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3,
:root[data-theme="dark"] h4 {
    color: #f1f5f9 !important;
}

:root[data-theme="dark"] a {
    color: #93c5fd;
}

:root[data-theme="dark"] .news-card-body h3 a,
:root[data-theme="dark"] .news-card h3,
:root[data-theme="dark"] .detail-title {
    color: #f1f5f9 !important;
}

:root[data-theme="dark"] .article-content,
:root[data-theme="dark"] .news-detail,
:root[data-theme="dark"] .news-detail p {
    color: #cbd5e1 !important;
}

:root[data-theme="dark"] input,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select {
    background: #1e293b !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}

:root[data-theme="dark"] .breaking-news,
:root[data-theme="dark"] .breaking-bar {
    background: #7f1d1d !important;
}

/* Theme toggle button (header) */
.theme-toggle-btn {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, .25);
    color: inherit;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 8px;
    transition: background .2s, transform .2s;
}

.theme-toggle-btn:hover {
    background: rgba(255, 255, 255, .1);
    transform: rotate(20deg);
}

.theme-toggle-btn .icon-sun {
    display: none;
}

:root[data-theme="dark"] .theme-toggle-btn .icon-sun {
    display: inline;
}

:root[data-theme="dark"] .theme-toggle-btn .icon-moon {
    display: none;
}

/* ═══ SKELETON LOADING ═══ */
.skeleton {
    display: block;
    background: linear-gradient(90deg, #e2e8f0 0%, #f1f5f9 50%, #e2e8f0 100%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.4s ease-in-out infinite;
    border-radius: 6px;
}

:root[data-theme="dark"] .skeleton {
    background: linear-gradient(90deg, #1e293b 0%, #334155 50%, #1e293b 100%);
}

.skeleton-text {
    height: 14px;
    margin: 6px 0;
}

.skeleton-title {
    height: 22px;
    width: 80%;
    margin: 10px 0;
}

.skeleton-img {
    width: 100%;
    aspect-ratio: 16/9;
}

@keyframes skeleton-loading {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

img.lazy-loading {
    background: linear-gradient(90deg, #e2e8f0 0%, #f1f5f9 50%, #e2e8f0 100%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.4s ease-in-out infinite;
}

/* ═══ FONT SIZE CONTROLS (haber detayda) ═══ */
.font-controls {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #f1f5f9;
    border-radius: 999px;
    padding: 4px 8px;
    margin-left: 8px;
}

:root[data-theme="dark"] .font-controls {
    background: #1e293b;
}

.font-controls button {
    border: none;
    background: transparent;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    cursor: pointer;
    color: #475569;
    font-weight: 700;
    transition: background .15s;
}

.font-controls button:hover {
    background: rgba(0, 0, 0, .06);
}

:root[data-theme="dark"] .font-controls button {
    color: #e2e8f0;
}

.font-controls .fc-a {
    font-size: 12px;
}

.font-controls .fc-b {
    font-size: 16px;
}

/* Apply user font size to article body */
.news-detail[data-font-size="small"] {
    font-size: 15px;
    line-height: 1.7;
}

.news-detail[data-font-size="medium"] {
    font-size: 17px;
    line-height: 1.75;
}

.news-detail[data-font-size="large"] {
    font-size: 19px;
    line-height: 1.85;
}

.news-detail[data-font-size="xlarge"] {
    font-size: 22px;
    line-height: 1.9;
}

/* ═══ TTS (Sesli Dinle) BUTTON ═══ */
.tts-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--primary, #dc2626);
    color: #fff;
    border: none;
    padding: 8px 14px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    margin-right: 8px;
    transition: background .2s, transform .15s;
}

.tts-btn:hover {
    transform: translateY(-1px);
    filter: brightness(1.05);
}

.tts-btn.playing {
    background: #16a34a;
}

.tts-btn .fa-spinner {
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

.article-tools {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 12px 0 18px;
    padding: 10px 0;
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
}

:root[data-theme="dark"] .article-tools {
    border-color: #334155;
}

/* ═══ CANLI ARAMA (autocomplete) ═══ */
.search-suggest-wrap {
    position: relative;
}

.search-suggest-list {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .12);
    z-index: 9999;
    max-height: 420px;
    overflow-y: auto;
    display: none;
}

.search-suggest-list.active {
    display: block;
}

:root[data-theme="dark"] .search-suggest-list {
    background: #1e293b;
    border-color: #334155;
}

.search-suggest-item {
    display: flex;
    gap: 10px;
    padding: 10px 12px;
    text-decoration: none;
    color: inherit;
    border-bottom: 1px solid #f1f5f9;
    transition: background .15s;
}

.search-suggest-item:hover,
.search-suggest-item.active {
    background: #f8fafc;
}

:root[data-theme="dark"] .search-suggest-item {
    border-color: #334155;
}

:root[data-theme="dark"] .search-suggest-item:hover,
:root[data-theme="dark"] .search-suggest-item.active {
    background: #334155;
}

.search-suggest-item img {
    width: 56px;
    height: 40px;
    object-fit: cover;
    border-radius: 4px;
    flex-shrink: 0;
}

.search-suggest-item .ss-title {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.35;
    color: #0f172a;
}

:root[data-theme="dark"] .search-suggest-item .ss-title {
    color: #e2e8f0;
}

.search-suggest-item .ss-meta {
    font-size: 11px;
    color: #64748b;
    margin-top: 3px;
}

.search-suggest-empty {
    padding: 14px;
    text-align: center;
    color: #94a3b8;
    font-size: 13px;
}

/* ═══ MOBILE BOTTOM NAV ═══ */
.mobile-bottom-nav {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    border-top: 1px solid #e2e8f0;
    z-index: 1000;
    padding: 6px 0 calc(6px + env(safe-area-inset-bottom));
    box-shadow: 0 -2px 16px rgba(0, 0, 0, .08);
}

:root[data-theme="dark"] .mobile-bottom-nav {
    background: #0f172a;
    border-color: #334155;
}

.mobile-bottom-nav-inner {
    display: flex;
    justify-content: space-around;
    align-items: center;
    max-width: 600px;
    margin: 0 auto;
}

.mobile-bottom-nav a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    text-decoration: none;
    color: #64748b;
    font-size: 10px;
    font-weight: 600;
    padding: 6px 10px;
    border-radius: 8px;
    transition: color .15s, background .15s;
    min-width: 56px;
}

:root[data-theme="dark"] .mobile-bottom-nav a {
    color: #94a3b8;
}

.mobile-bottom-nav a i {
    font-size: 18px;
}

.mobile-bottom-nav a.active,
.mobile-bottom-nav a:hover {
    color: var(--primary, #dc2626);
    background: rgba(220, 38, 38, .08);
}

@media (max-width: 768px) {
    .mobile-bottom-nav {
        display: block;
    }

    body {
        padding-bottom: 70px;
    }

    .back-to-top {
        bottom: 78px !important;
    }
}

/* ═══ RELATIVE TIME ═══ */
.time-relative {
    font-weight: 500;
    color: #64748b;
}

/* ═══ Modern son dakika canlı band (#2) ═══ */
.live-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #dc2626;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    padding: 2px 8px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: .05em;
    animation: pulse-live 1.5s ease-in-out infinite;
}

.live-badge::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #fff;
    animation: blink-live 1s ease-in-out infinite;
}

@keyframes pulse-live {

    0%,
    100% {
        box-shadow: 0 0 0 0 rgba(220, 38, 38, .6);
    }

    50% {
        box-shadow: 0 0 0 8px rgba(220, 38, 38, 0);
    }
}

@keyframes blink-live {

    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: .3;
    }
}

/* ═══ News card stat badges (#4) ═══ */
.card-stats {
    display: flex;
    gap: 10px;
    font-size: 11px;
    color: #94a3b8;
    margin-top: 6px;
}

.card-stats span {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

/* ═══ Print clean ═══ */
@media print {

    .site-header,
    .site-footer,
    .mobile-bottom-nav,
    .reading-progress-bar,
    .reading-progress-pct,
    .article-tools,
    .back-to-top,
    .ad-space,
    .ad-placeholder-box,
    .article-related,
    #infiniteScrollContainer,
    .infinite-loading {
        display: none !important;
    }

    .news-detail {
        font-size: 14px;
    }
}

/* ═══ PARTI 2: Inline Related, Tabbed Popular, Card Stats ═══ */

/* İçerik içine gömülü ilgili haber kartı */
.inline-related {
    display: flex;
    gap: 12px;
    background: linear-gradient(135deg, #fef2f2, #fff);
    border-left: 4px solid var(--primary, #dc2626);
    border-radius: 8px;
    padding: 12px 14px;
    margin: 24px 0;
    align-items: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .04);
}

:root[data-theme="dark"] .inline-related {
    background: linear-gradient(135deg, #2a1a1a, #1a1a1a);
    color: #e5e5e5;
}

.inline-related-label {
    flex: 0 0 auto;
    background: var(--primary, #dc2626);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    padding: 4px 8px;
    border-radius: 4px;
    white-space: nowrap;
}

.inline-related-link {
    display: flex;
    gap: 12px;
    flex: 1;
    align-items: center;
    color: inherit;
    text-decoration: none;
    transition: opacity .15s;
}

.inline-related-link:hover {
    opacity: .8;
}

.inline-related-link img {
    width: 90px;
    height: 60px;
    object-fit: cover;
    border-radius: 6px;
    flex-shrink: 0;
}

.inline-related-title {
    font-weight: 600;
    font-size: 15px;
    line-height: 1.35;
}

@media (max-width: 600px) {
    .inline-related {
        flex-direction: column;
        align-items: stretch;
    }

    .inline-related-link img {
        width: 100%;
        height: 140px;
    }
}

/* Tabbed popular widget */
.widget-popular-tabs .popular-tabs {
    display: flex;
    gap: 4px;
    padding: 8px 12px 0;
    border-bottom: 1px solid var(--border, #e5e7eb);
}

.widget-popular-tabs .popular-tab {
    flex: 1;
    background: transparent;
    border: none;
    color: var(--text-secondary, #64748b);
    font-size: 12px;
    font-weight: 600;
    padding: 8px 6px;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: color .15s, border-color .15s;
}

.widget-popular-tabs .popular-tab:hover {
    color: var(--primary, #dc2626);
}

.widget-popular-tabs .popular-tab.active {
    color: var(--primary, #dc2626);
    border-bottom-color: var(--primary, #dc2626);
}

.popular-tabs-body.loading {
    opacity: .5;
    pointer-events: none;
}

/* Yeni popular item rendered by JS — aynı .popular-item yapısı kullanılıyor */
.popular-tabs-body .popular-item {
    transition: transform .15s;
}

.popular-tabs-body .popular-item:hover {
    transform: translateX(2px);
}

/* News card stat rozetleri (uniform display) */
.news-card .card-stats,
.news-list-item .card-stats {
    display: inline-flex;
    gap: 10px;
    align-items: center;
    font-size: 11px;
    color: var(--text-secondary, #64748b);
    margin-top: 4px;
}

.news-card .card-stats i,
.news-list-item .card-stats i {
    font-size: 11px;
    opacity: .7;
}

/* Yeni / Hot rozetleri */
.badge-new {
    display: inline-block;
    background: #10b981;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: .3px;
}

.badge-hot {
    display: inline-block;
    background: linear-gradient(135deg, #f59e0b, #ef4444);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: .3px;
}

/* Print için inline-related gizle */
@media print {

    .inline-related,
    .widget-popular-tabs .popular-tabs {
        display: none;
    }
}

/* PARTI 3: TOC + Floating Share + Tag Cloud Weights */

/* --- Otomatik Içindekiler --- */
.article-toc {
    background: #f8fafc;
    border: 1px solid var(--border, #e5e7eb);
    border-left: 4px solid var(--primary, #dc2626);
    border-radius: 8px;
    padding: 14px 18px;
    margin: 20px 0 24px;
}

:root[data-theme="dark"] .article-toc {
    background: #1f2937;
    border-color: #374151;
    border-left-color: var(--primary, #dc2626);
}

.article-toc-toggle {
    background: none;
    border: none;
    cursor: pointer;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    font-weight: 700;
    color: inherit;
    padding: 0;
    text-align: left;
}

.article-toc-toggle .toc-chevron {
    margin-left: auto;
    font-size: 12px;
    transition: transform .25s;
}

.article-toc[data-collapsed="1"] .toc-chevron {
    transform: rotate(180deg);
}

.article-toc[data-collapsed="1"] .article-toc-list {
    display: none;
}

.article-toc-list {
    list-style: decimal inside;
    margin: 12px 0 0;
    padding: 0 0 0 4px;
    font-size: 14px;
    line-height: 1.7;
}

.article-toc-list li {
    margin: 0;
}

.article-toc-list li.toc-h3 {
    padding-left: 18px;
    list-style-type: '— ';
    font-size: 13px;
}

.article-toc-list a {
    color: var(--text, #374151);
    text-decoration: none;
    transition: color .15s;
}

:root[data-theme="dark"] .article-toc-list a {
    color: #d1d5db;
}

.article-toc-list a:hover {
    color: var(--primary, #dc2626);
    text-decoration: underline;
}

.article-toc-list a.toc-active {
    color: var(--primary, #dc2626);
    font-weight: 700;
}

/* --- Floating Share Bar (sol kenar) --- */
.floating-share {
    position: fixed;
    left: 14px;
    top: 50%;
    transform: translateY(-50%) translateX(-100px);
    display: flex;
    flex-direction: column;
    gap: 6px;
    background: #fff;
    border: 1px solid var(--border, #e5e7eb);
    border-radius: 12px;
    padding: 8px 6px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, .08);
    z-index: 990;
    opacity: 0;
    pointer-events: none;
    transition: opacity .25s, transform .25s;
}

:root[data-theme="dark"] .floating-share {
    background: #1f2937;
    border-color: #374151;
}

.floating-share.visible {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(-50%) translateX(0);
}

.floating-share a,
.floating-share button {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: #475569;
    cursor: pointer;
    text-decoration: none;
    transition: background .15s, color .15s, transform .15s;
}

:root[data-theme="dark"] .floating-share a,
:root[data-theme="dark"] .floating-share button {
    color: #d1d5db;
}

.floating-share a:hover,
.floating-share button:hover {
    background: var(--primary, #dc2626);
    color: #fff;
    transform: scale(1.05);
}

.floating-share .fs-fb:hover {
    background: #1877f2;
}

.floating-share .fs-tw:hover {
    background: #1da1f2;
}

.floating-share .fs-wa:hover {
    background: #25d366;
}

.floating-share .fs-tg:hover {
    background: #0088cc;
}

.floating-share .fs-ln:hover {
    background: #0a66c2;
}

@media (max-width: 1024px) {
    .floating-share {
        display: none;
    }
}

/* --- Tag Cloud weighted --- */
.widget-tag-cloud .tag-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 8px;
    align-items: baseline;
    line-height: 1.4;
}

.widget-tag-cloud .trending-tag {
    display: inline-block;
    background: var(--bg-alt, #f1f5f9);
    color: var(--text, #475569);
    padding: 4px 10px;
    border-radius: 14px;
    text-decoration: none;
    transition: background .15s, color .15s, transform .15s;
}

:root[data-theme="dark"] .widget-tag-cloud .trending-tag {
    background: #374151;
    color: #d1d5db;
}

.widget-tag-cloud .trending-tag:hover {
    background: var(--primary, #dc2626);
    color: #fff;
    transform: translateY(-1px);
}

.widget-tag-cloud .tag-w1 {
    font-size: 11px;
    opacity: .75;
}

.widget-tag-cloud .tag-w2 {
    font-size: 12px;
    opacity: .85;
}

.widget-tag-cloud .tag-w3 {
    font-size: 13px;
}

.widget-tag-cloud .tag-w4 {
    font-size: 15px;
    font-weight: 600;
}

.widget-tag-cloud .tag-w5 {
    font-size: 17px;
    font-weight: 700;
}

/* Print */
@media print {

    .floating-share,
    .article-toc-toggle {
        display: none;
    }

    .article-toc-list {
        display: block !important;
    }
}

/* PARTI 4: Weather v2, Newsletter Popup, Social Embeds */

/* Weather v2 */
.widget-weather-v2 .weather-main {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.widget-weather-v2 .weather-icon {
    font-size: 42px;
    line-height: 1;
}

.widget-weather-v2 .weather-temp {
    font-size: 26px;
    font-weight: 800;
    color: var(--primary, #dc2626);
    line-height: 1;
}

.widget-weather-v2 .weather-city {
    font-size: 12px;
    color: var(--text-secondary, #64748b);
    margin-top: 4px;
}

.widget-weather-v2 .weather-detail {
    font-size: 13px;
    color: var(--text, #475569);
    margin-bottom: 8px;
    text-transform: capitalize;
}

.widget-weather-v2 .weather-meta {
    display: flex;
    justify-content: space-between;
    gap: 6px;
    font-size: 11px;
    color: var(--text-secondary, #64748b);
    padding: 8px 0;
    border-top: 1px solid var(--border, #e5e7eb);
    border-bottom: 1px solid var(--border, #e5e7eb);
    margin-bottom: 10px;
}

.widget-weather-v2 .weather-meta i {
    margin-right: 3px;
    opacity: .7;
}

.widget-weather-v2 .weather-forecast {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
}

.widget-weather-v2 .forecast-day {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 8px 4px;
    background: var(--bg-alt, #f8fafc);
    border-radius: 6px;
    font-size: 11px;
}

:root[data-theme="dark"] .widget-weather-v2 .forecast-day {
    background: #374151;
}

.widget-weather-v2 .forecast-name {
    font-weight: 700;
    color: var(--text-secondary, #64748b);
}

.widget-weather-v2 .forecast-icon {
    font-size: 18px;
    line-height: 1;
}

.widget-weather-v2 .forecast-temps b {
    color: var(--primary, #dc2626);
}

/* Newsletter Popup */
.newsletter-popup {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .55);
    z-index: 9998;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity .3s;
    padding: 20px;
}

.newsletter-popup.show {
    opacity: 1;
}

.newsletter-popup .np-card {
    background: #fff;
    border-radius: 16px;
    padding: 32px 28px 24px;
    max-width: 420px;
    width: 100%;
    text-align: center;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .25);
    position: relative;
    transform: translateY(20px);
    transition: transform .3s;
}

.newsletter-popup.show .np-card {
    transform: translateY(0);
}

:root[data-theme="dark"] .newsletter-popup .np-card {
    background: #1f2937;
    color: #f3f4f6;
}

.newsletter-popup .np-close {
    position: absolute;
    top: 8px;
    right: 12px;
    background: none;
    border: none;
    font-size: 28px;
    color: #9ca3af;
    cursor: pointer;
    line-height: 1;
}

.newsletter-popup .np-close:hover {
    color: var(--primary, #dc2626);
}

.newsletter-popup .np-icon {
    font-size: 48px;
    color: var(--primary, #dc2626);
    margin-bottom: 12px;
}

.newsletter-popup h3 {
    font-size: 20px;
    margin: 0 0 8px;
    color: inherit;
}

.newsletter-popup p {
    font-size: 14px;
    color: var(--text-secondary, #64748b);
    margin: 0 0 20px;
}

.newsletter-popup .np-form {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
}

.newsletter-popup .np-form input {
    flex: 1;
    padding: 12px 14px;
    border: 1px solid var(--border, #e5e7eb);
    border-radius: 8px;
    font-size: 14px;
    background: var(--bg-alt, #f8fafc);
    color: inherit;
}

:root[data-theme="dark"] .newsletter-popup .np-form input {
    background: #374151;
    border-color: #4b5563;
    color: #f3f4f6;
}

.newsletter-popup .np-form button {
    padding: 12px 18px;
    background: var(--primary, #dc2626);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.newsletter-popup .np-form button:hover {
    opacity: .9;
}

.newsletter-popup .np-form button:disabled {
    opacity: .7;
    cursor: wait;
}

.newsletter-popup .np-note {
    font-size: 11px;
    color: #9ca3af;
}

@media (max-width: 480px) {
    .newsletter-popup .np-card {
        padding: 24px 18px 18px;
    }

    .newsletter-popup .np-form {
        flex-direction: column;
    }
}

/* Social Embeds */
.social-embed {
    margin: 18px 0;
}

.yt-embed {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    border-radius: 8px;
    background: #000;
}

.yt-embed iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.tw-embed,
.ig-embed {
    border: 1px solid var(--border, #e5e7eb);
    border-radius: 8px;
    padding: 14px 16px;
    background: var(--bg-alt, #f8fafc);
}

:root[data-theme="dark"] .tw-embed,
:root[data-theme="dark"] .ig-embed {
    background: #374151;
    border-color: #4b5563;
}

.tw-embed a,
.ig-embed a {
    color: var(--text, #1f2937);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
}

:root[data-theme="dark"] .tw-embed a,
:root[data-theme="dark"] .ig-embed a {
    color: #f3f4f6;
}

.tw-embed a:hover {
    color: #1da1f2;
}

.ig-embed a:hover {
    color: #e1306c;
}

/* Print */
@media print {

    .newsletter-popup,
    .widget-weather-v2 .weather-forecast {
        display: none;
    }
}

/* ============= PARTI 5: Reactions, Reading List, Card Quick Actions ============= */

/* Reactions */
.reactions {
    margin: 24px 0;
    padding: 18px 12px;
    background: var(--bg-alt, #f8fafc);
    border-radius: 12px;
}

:root[data-theme="dark"] .reactions {
    background: #1f2937;
}

.reactions-title {
    font-size: 15px;
    font-weight: 700;
    margin: 0 0 14px;
    color: var(--text, #1f2937);
}

.reactions-box {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    list-style: none;
    padding: 0;
    margin: 0;
}

.reactions-box .reaction {
    cursor: pointer;
    transition: transform .15s;
}

.reactions-box .reaction:hover {
    transform: translateY(-3px);
}

.reactions-box .reaction.pulse {
    animation: rxPulse .4s ease;
}

@keyframes rxPulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.18);
    }

    100% {
        transform: scale(1);
    }
}

.reactions-box .emoji {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: #fff;
    border: 2px solid var(--border, #e5e7eb);
    border-radius: 10px;
    padding: 8px 10px;
    min-width: 72px;
    transition: border-color .2s, background .2s;
}

:root[data-theme="dark"] .reactions-box .emoji {
    background: #374151;
    border-color: #4b5563;
}

.reactions-box .reaction.reacted .emoji {
    border-color: var(--primary, #dc2626);
    background: #fff5f5;
}

:root[data-theme="dark"] .reactions-box .reaction.reacted .emoji {
    background: #4b1d1d;
}

.emoji-img {
    font-size: 26px;
    line-height: 1;
}

.emoji-text {
    font-size: 10px;
    font-weight: 800;
    color: var(--text-secondary, #64748b);
    margin-top: 4px;
    letter-spacing: .3px;
}

.emoji-count {
    font-size: 13px;
    font-weight: 800;
    color: var(--primary, #dc2626);
    margin-top: 2px;
}

.reactions-total {
    margin-top: 12px;
    font-size: 12px;
    color: var(--text-secondary, #64748b);
}

.reactions-total span {
    font-weight: 800;
    color: var(--primary, #dc2626);
}

/* Reading list button (article) */
.reading-list-btn {
    display: block;
    margin: 18px auto;
    padding: 10px 22px;
    background: #fff;
    color: var(--text, #1f2937);
    border: 2px solid var(--border, #e5e7eb);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all .2s;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.reading-list-btn:hover {
    border-color: var(--primary, #dc2626);
    color: var(--primary, #dc2626);
}

.reading-list-btn.saved {
    background: var(--primary, #dc2626);
    color: #fff;
    border-color: var(--primary, #dc2626);
}

:root[data-theme="dark"] .reading-list-btn {
    background: #374151;
    color: #f3f4f6;
    border-color: #4b5563;
}

/* Reading list widget (sidebar) */
#readingListWidget .reading-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

#readingListWidget .reading-list li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border, #e5e7eb);
    font-size: 13px;
}

#readingListWidget .reading-list li:last-child {
    border-bottom: 0;
}

#readingListWidget .reading-list a {
    flex: 1;
    color: var(--text, #1f2937);
    text-decoration: none;
    font-weight: 600;
    line-height: 1.4;
}

#readingListWidget .reading-list a:hover {
    color: var(--primary, #dc2626);
}

:root[data-theme="dark"] #readingListWidget .reading-list a {
    color: #f3f4f6;
}

.reading-list-remove {
    background: transparent;
    border: 0;
    color: #9ca3af;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    padding: 0 4px;
}

.reading-list-remove:hover {
    color: var(--primary, #dc2626);
}

.reading-list-empty {
    text-align: center;
    padding: 18px 12px;
    font-size: 13px;
    color: var(--text-secondary, #64748b);
    line-height: 1.5;
}

.reading-list-empty i {
    font-size: 26px;
    opacity: .35;
    display: block;
    margin-bottom: 8px;
}

.reading-list-clear {
    margin-top: 10px;
    width: 100%;
    padding: 8px;
    background: transparent;
    border: 1px dashed var(--border, #e5e7eb);
    color: var(--text-secondary, #64748b);
    font-size: 11px;
    border-radius: 6px;
    cursor: pointer;
}

.reading-list-clear:hover {
    color: var(--primary, #dc2626);
    border-color: var(--primary, #dc2626);
}

/* Card quick actions (bookmark on every card) */
.card-quick-actions {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 5;
    display: flex;
    gap: 6px;
    opacity: 0;
    transform: translateY(-4px);
    transition: opacity .2s, transform .2s;
}

.news-card:hover .card-quick-actions,
.related-card:hover .card-quick-actions,
.popular-item:hover .card-quick-actions,
.haber-card:hover .card-quick-actions,
.card-quick-actions:focus-within {
    opacity: 1;
    transform: translateY(0);
}

@media (max-width: 768px) {
    .card-quick-actions {
        opacity: 1;
        transform: none;
    }
}

.cqa-btn {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .95);
    border: 1px solid var(--border, #e5e7eb);
    color: var(--text, #1f2937);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
    transition: background .15s, color .15s, transform .15s;
}

.cqa-btn:hover {
    background: var(--primary, #dc2626);
    color: #fff;
    transform: scale(1.08);
}

.cqa-btn.active {
    background: var(--primary, #dc2626);
    color: #fff;
}

:root[data-theme="dark"] .cqa-btn {
    background: rgba(31, 41, 55, .95);
    color: #f3f4f6;
    border-color: #4b5563;
}

@media print {

    .reactions,
    .reading-list-btn,
    .card-quick-actions {
        display: none;
    }
}

/* ============= PARTI 6: Comments v2 ============= */
.comments-section {
    margin: 32px 0;
    padding: 24px;
    background: var(--bg-alt, #f8fafc);
    border-radius: 12px;
}

:root[data-theme="dark"] .comments-section {
    background: #1f2937;
}

.comments-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18px;
    flex-wrap: wrap;
    gap: 10px;
    border-bottom: 2px solid var(--border, #e5e7eb);
    padding-bottom: 12px;
}

.comments-title {
    font-size: 18px;
    font-weight: 800;
    color: var(--text, #1f2937);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.comments-title i {
    color: var(--primary, #dc2626);
}

.comments-count {
    background: var(--primary, #dc2626);
    color: #fff;
    font-size: 12px;
    padding: 2px 10px;
    border-radius: 999px;
    min-width: 24px;
    text-align: center;
}

.comments-sort {
    display: flex;
    gap: 4px;
}

.cs-btn {
    background: transparent;
    border: 1px solid var(--border, #e5e7eb);
    color: var(--text-secondary, #64748b);
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 600;
    border-radius: 6px;
    cursor: pointer;
    transition: all .15s;
}

.cs-btn:hover {
    color: var(--primary, #dc2626);
    border-color: var(--primary, #dc2626);
}

.cs-btn.active {
    background: var(--primary, #dc2626);
    color: #fff;
    border-color: var(--primary, #dc2626);
}

.comment-form-v2 {
    position: relative;
    background: #fff;
    padding: 16px;
    border-radius: 10px;
    margin-bottom: 20px;
    border: 1px solid var(--border, #e5e7eb);
}

:root[data-theme="dark"] .comment-form-v2 {
    background: #374151;
    border-color: #4b5563;
}

.cf-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 10px;
}

@media (max-width: 600px) {
    .cf-row {
        grid-template-columns: 1fr;
    }
}

.cf-input,
.cf-textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--border, #e5e7eb);
    border-radius: 6px;
    font-size: 14px;
    background: var(--bg-alt, #f8fafc);
    color: inherit;
    font-family: inherit;
}

:root[data-theme="dark"] .cf-input,
:root[data-theme="dark"] .cf-textarea {
    background: #1f2937;
    border-color: #4b5563;
    color: #f3f4f6;
}

.cf-input:focus,
.cf-textarea:focus {
    outline: none;
    border-color: var(--primary, #dc2626);
}

.cf-textarea {
    resize: vertical;
    min-height: 90px;
    margin-bottom: 10px;
}

.cf-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.cf-status {
    font-size: 13px;
}

.cf-status .cf-ok {
    color: #16a34a;
    font-weight: 600;
}

.cf-status .cf-err {
    color: #dc2626;
    font-weight: 600;
}

.cf-status .cf-cancel-reply {
    color: var(--primary, #dc2626);
    text-decoration: underline;
    font-size: 12px;
}

.cf-submit {
    background: var(--primary, #dc2626);
    color: #fff;
    border: none;
    padding: 10px 22px;
    border-radius: 6px;
    font-weight: 700;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.cf-submit:hover {
    opacity: .92;
}

.cf-submit:disabled {
    opacity: .6;
    cursor: wait;
}

.comments-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.comments-loading,
.comments-empty {
    text-align: center;
    padding: 30px 20px;
    color: var(--text-secondary, #64748b);
    font-size: 14px;
}

.comments-empty i {
    font-size: 32px;
    opacity: .3;
    display: block;
    margin-bottom: 10px;
}

.cmt {
    background: #fff;
    padding: 14px 16px;
    border-radius: 10px;
    border: 1px solid var(--border, #e5e7eb);
}

:root[data-theme="dark"] .cmt {
    background: #374151;
    border-color: #4b5563;
}

.cmt-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.cmt-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    color: #fff;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    flex-shrink: 0;
}

.cmt-meta {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.cmt-meta b {
    font-size: 13px;
    color: var(--text, #1f2937);
    font-weight: 700;
}

:root[data-theme="dark"] .cmt-meta b {
    color: #f3f4f6;
}

.cmt-meta time {
    font-size: 11px;
    color: var(--text-secondary, #64748b);
}

.cmt-body {
    font-size: 14px;
    line-height: 1.55;
    color: var(--text, #374151);
    word-break: break-word;
    white-space: pre-wrap;
    margin-bottom: 8px;
}

:root[data-theme="dark"] .cmt-body {
    color: #d1d5db;
}

.cmt-actions {
    display: flex;
    gap: 14px;
    padding-top: 4px;
}

.cmt-like,
.cmt-reply-btn {
    background: transparent;
    border: 0;
    color: var(--text-secondary, #64748b);
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 0;
}

.cmt-like:hover,
.cmt-reply-btn:hover {
    color: var(--primary, #dc2626);
}

.cmt-like.liked {
    color: var(--primary, #dc2626);
}

.cmt-like.liked i::before {
    content: "\f004";
    font-weight: 900;
}

.cmt-replies {
    margin-top: 12px;
    padding-left: 16px;
    border-left: 3px solid var(--border, #e5e7eb);
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cmt-reply {
    background: var(--bg-alt, #f8fafc);
}

:root[data-theme="dark"] .cmt-reply {
    background: #1f2937;
}

@media print {
    .comments-section {
        display: none;
    }
}

/* ============= PARTI 7: Akıllı Arama (Komut Paleti) ============= */
.ht-srch {
    position: fixed;
    inset: 0;
    z-index: 99999;
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s;
}

.ht-srch.show {
    opacity: 1;
    pointer-events: auto;
}

.ht-srch-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, .65);
    backdrop-filter: blur(4px);
}

.ht-srch-panel {
    position: relative;
    width: min(680px, calc(100% - 32px));
    max-height: 80vh;
    margin: 8vh auto 0;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .4);
    display: flex;
    flex-direction: column;
    transform: translateY(-8px);
    transition: transform .18s;
    overflow: hidden;
}

.ht-srch.show .ht-srch-panel {
    transform: translateY(0);
}

:root[data-theme="dark"] .ht-srch-panel {
    background: #1f2937;
    color: #f3f4f6;
}

.ht-srch-input-wrap {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--border, #e5e7eb);
    position: relative;
}

:root[data-theme="dark"] .ht-srch-input-wrap {
    border-color: #4b5563;
}

.ht-srch-icon {
    font-size: 18px;
    color: var(--text-secondary, #94a3b8);
}

.ht-srch-input {
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: 17px;
    color: inherit;
    padding: 4px 0;
}

.ht-srch-input::placeholder {
    color: #9ca3af;
}

.ht-srch-clear {
    background: transparent;
    border: 0;
    font-size: 22px;
    color: #9ca3af;
    cursor: pointer;
    padding: 0 6px;
    line-height: 1;
}

.ht-srch-clear:hover {
    color: var(--primary, #dc2626);
}

.ht-srch-esc {
    background: var(--bg-alt, #f1f5f9);
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 11px;
    color: var(--text-secondary, #64748b);
    border: 1px solid var(--border, #e5e7eb);
    font-family: inherit;
}

:root[data-theme="dark"] .ht-srch-esc {
    background: #374151;
    border-color: #4b5563;
    color: #d1d5db;
}

.ht-srch-body {
    flex: 1;
    overflow-y: auto;
    padding: 8px;
}

.ht-srch-section {
    padding: 8px 6px;
}

.ht-srch-section+.ht-srch-section {
    border-top: 1px solid var(--border, #f1f5f9);
}

:root[data-theme="dark"] .ht-srch-section+.ht-srch-section {
    border-top-color: #374151;
}

.ht-srch-stitle {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .8px;
    color: var(--text-secondary, #64748b);
    text-transform: uppercase;
    padding: 6px 8px;
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: space-between;
}

.ht-srch-stitle i {
    color: var(--primary, #dc2626);
}

.ht-srch-clr-hist {
    background: transparent;
    border: 0;
    font-size: 10px;
    color: var(--text-secondary, #94a3b8);
    cursor: pointer;
    text-decoration: underline;
    text-transform: lowercase;
    letter-spacing: 0;
    font-weight: 600;
}

.ht-srch-clr-hist:hover {
    color: var(--primary, #dc2626);
}

.ht-srch-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 4px 8px;
}

.ht-srch-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--bg-alt, #f1f5f9);
    color: var(--text, #1f2937);
    border: 1px solid transparent;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 13px;
    cursor: pointer;
    text-decoration: none;
    font-weight: 500;
    transition: all .12s;
}

.ht-srch-chip:hover,
.ht-srch-chip.active {
    background: var(--primary, #dc2626);
    color: #fff;
}

:root[data-theme="dark"] .ht-srch-chip {
    background: #374151;
    color: #f3f4f6;
}

.ht-srch-chip-c {
    font-size: 10px;
    opacity: .65;
    background: rgba(0, 0, 0, .1);
    padding: 1px 6px;
    border-radius: 999px;
}

.ht-srch-chip:hover .ht-srch-chip-c {
    background: rgba(255, 255, 255, .25);
}

.ht-srch-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px;
    border-radius: 8px;
    text-decoration: none;
    color: var(--text, #1f2937);
    cursor: pointer;
    transition: background .12s;
}

.ht-srch-item:hover,
.ht-srch-item.active {
    background: var(--bg-alt, #f1f5f9);
}

:root[data-theme="dark"] .ht-srch-item {
    color: #f3f4f6;
}

:root[data-theme="dark"] .ht-srch-item:hover,
:root[data-theme="dark"] .ht-srch-item.active {
    background: #374151;
}

.ht-srch-news img,
.ht-srch-noimg {
    width: 56px;
    height: 42px;
    object-fit: cover;
    border-radius: 6px;
    flex-shrink: 0;
    background: var(--bg-alt, #f1f5f9);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 16px;
}

.ht-srch-meta {
    flex: 1;
    min-width: 0;
}

.ht-srch-itl {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ht-srch-meta small {
    font-size: 11px;
    color: var(--text-secondary, #64748b);
}

.ht-srch-itl mark {
    background: #fef08a;
    padding: 0 2px;
    border-radius: 3px;
    color: inherit;
}

:root[data-theme="dark"] .ht-srch-itl mark {
    background: #ca8a04;
    color: #fff;
}

.ht-srch-loading,
.ht-srch-empty {
    padding: 36px 18px;
    text-align: center;
    color: var(--text-secondary, #64748b);
    font-size: 14px;
}

.ht-srch-empty i {
    font-size: 32px;
    opacity: .35;
    display: block;
    margin-bottom: 10px;
}

.ht-srch-allwrap {
    padding: 10px;
    text-align: center;
    border-top: 1px solid var(--border, #f1f5f9);
    margin-top: 6px;
}

.ht-srch-allbtn {
    display: inline-block;
    padding: 8px 16px;
    background: var(--primary, #dc2626);
    color: #fff;
    border-radius: 6px;
    text-decoration: none;
    font-weight: 600;
    font-size: 13px;
}

.ht-srch-allbtn:hover {
    opacity: .92;
}

.ht-srch-footer {
    display: flex;
    justify-content: center;
    gap: 16px;
    padding: 10px 16px;
    border-top: 1px solid var(--border, #e5e7eb);
    font-size: 11px;
    color: var(--text-secondary, #64748b);
    flex-wrap: wrap;
}

:root[data-theme="dark"] .ht-srch-footer {
    border-color: #4b5563;
}

.ht-srch-footer kbd {
    background: var(--bg-alt, #f1f5f9);
    border: 1px solid var(--border, #e5e7eb);
    padding: 1px 6px;
    border-radius: 3px;
    font-size: 10px;
    font-family: inherit;
    margin: 0 2px;
}

:root[data-theme="dark"] .ht-srch-footer kbd {
    background: #374151;
    border-color: #4b5563;
    color: #d1d5db;
}

@media (max-width: 600px) {
    .ht-srch-panel {
        margin: 4vh 16px 0;
        max-height: 92vh;
    }

    .ht-srch-footer {
        font-size: 10px;
        gap: 8px;
    }

    .ht-srch-footer span:nth-child(3) {
        display: none;
    }
}

@media print {
    .ht-srch {
        display: none;
    }
}

/* ============= PARTI 8: Lightbox + LQIP ============= */
.ht-lb {
    position: fixed;
    inset: 0;
    z-index: 99998;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ht-lb.show {
    opacity: 1;
    pointer-events: auto;
}

.ht-lb-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .92);
}

.ht-lb-stage {
    position: relative;
    max-width: 95vw;
    max-height: 85vh;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
    overflow: hidden;
}

.ht-lb-img {
    max-width: 95vw;
    max-height: 85vh;
    object-fit: contain;
    transition: transform .25s, opacity .2s;
    cursor: zoom-in;
    user-select: none;
    -webkit-user-drag: none;
}

.ht-lb.zoomed .ht-lb-img {
    cursor: zoom-out;
}

.ht-lb-spin {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 32px;
    pointer-events: none;
}

.ht-lb-btn {
    position: absolute;
    z-index: 2;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    border: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    backdrop-filter: blur(6px);
    transition: background .15s, transform .15s;
}

.ht-lb-btn:hover {
    background: rgba(255, 255, 255, .25);
    transform: scale(1.06);
}

.ht-lb-close {
    top: 16px;
    right: 16px;
    font-size: 26px;
    line-height: 1;
}

.ht-lb-prev {
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
}

.ht-lb-next {
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
}

.ht-lb-prev:hover {
    transform: translateY(-50%) scale(1.06);
}

.ht-lb-next:hover {
    transform: translateY(-50%) scale(1.06);
}

.ht-lb-zoom {
    top: 16px;
    right: 70px;
}

.ht-lb-dl {
    top: 16px;
    right: 124px;
}

.ht-lb-counter {
    position: absolute;
    top: 22px;
    left: 22px;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    background: rgba(0, 0, 0, .45);
    padding: 5px 12px;
    border-radius: 20px;
    z-index: 2;
}

.ht-lb-caption {
    position: absolute;
    bottom: 18px;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    font-size: 13px;
    max-width: 80vw;
    text-align: center;
    background: rgba(0, 0, 0, .55);
    padding: 8px 16px;
    border-radius: 6px;
    z-index: 2;
    line-height: 1.4;
}

@media (max-width: 600px) {
    .ht-lb-btn {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }

    .ht-lb-zoom {
        right: 64px;
        top: 14px;
    }

    .ht-lb-dl {
        right: 112px;
        top: 14px;
    }

    .ht-lb-close {
        top: 14px;
        right: 14px;
    }

    .ht-lb-prev {
        left: 8px;
    }

    .ht-lb-next {
        right: 8px;
    }

    .ht-lb-counter {
        font-size: 11px;
        padding: 4px 9px;
        top: 18px;
        left: 14px;
    }

    .ht-lb-caption {
        font-size: 12px;
        bottom: 14px;
        max-width: 92vw;
    }
}

/* LQIP blur-in */
.ht-img-lqip {
    filter: blur(8px);
    opacity: .6;
    transition: filter .35s ease, opacity .35s ease;
    background: linear-gradient(110deg, #ececec 8%, #f5f5f5 18%, #ececec 33%);
    background-size: 200% 100%;
    animation: htShimmer 1.4s linear infinite;
}

.ht-img-loaded {
    filter: blur(0);
    opacity: 1;
    animation: none;
    background: none;
}

@keyframes htShimmer {
    to {
        background-position-x: -200%;
    }
}

:root[data-theme="dark"] .ht-img-lqip {
    background: linear-gradient(110deg, #1f2937 8%, #374151 18%, #1f2937 33%);
}

/* Article görselleri için zoom-in cursor */
.detail-content img,
.infinite-article img,
.article-content img,
.news-detail img,
.news-content img,
.haber-detay-icerik img,
.article-body img,
img.img-fluid:not(.no-zoom) {
    cursor: zoom-in;
    transition: filter .2s;
}

.detail-content img:hover,
.infinite-article img:hover,
.article-content img:hover,
.news-detail img:hover,
.news-content img:hover,
.haber-detay-icerik img:hover {
    filter: brightness(.92);
}

@media print {
    .ht-lb {
        display: none !important;
    }
}

/* ============= PARTI 9: Anketler ============= */
.ht-poll-section {
    margin: 30px 0;
}

.ht-poll-card {
    background: #fff;
    border: 1px solid var(--border, #e5e7eb);
    border-left: 4px solid var(--primary, #dc2626);
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .04);
}

:root[data-theme="dark"] .ht-poll-card {
    background: #1f2937;
    border-color: #4b5563;
    border-left-color: var(--primary, #dc2626);
    color: #f3f4f6;
}

.ht-poll-q {
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 16px;
    line-height: 1.4;
    display: flex;
    gap: 10px;
    align-items: center;
}

.ht-poll-q i {
    color: var(--primary, #dc2626);
    font-size: 20px;
}

.ht-poll-options {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ht-poll-opt {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    text-align: left;
    padding: 12px 14px;
    background: var(--bg-alt, #f8fafc);
    border: 2px solid transparent;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
    color: inherit;
    transition: all .15s;
    font-family: inherit;
}

.ht-poll-opt:hover:not(:disabled) {
    background: #fff5f5;
    border-color: var(--primary, #dc2626);
    transform: translateX(2px);
}

:root[data-theme="dark"] .ht-poll-opt {
    background: #374151;
}

:root[data-theme="dark"] .ht-poll-opt:hover:not(:disabled) {
    background: #4b5563;
}

.ht-poll-opt:disabled {
    opacity: .65;
    cursor: wait;
}

.ht-poll-opt-radio {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 2px solid var(--text-secondary, #9ca3af);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary, #dc2626);
    font-size: 11px;
}

.ht-poll-opt:hover .ht-poll-opt-radio {
    border-color: var(--primary, #dc2626);
}

.ht-poll-opt-label {
    flex: 1;
    font-weight: 500;
}

.ht-poll-results {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.ht-poll-row {
    padding: 8px 12px;
    border-radius: 8px;
    background: var(--bg-alt, #f8fafc);
    position: relative;
    transition: all .2s;
}

:root[data-theme="dark"] .ht-poll-row {
    background: #374151;
}

.ht-poll-row.leader {
    background: #fff5f5;
    border: 1px solid var(--primary, #dc2626);
}

:root[data-theme="dark"] .ht-poll-row.leader {
    background: #4c1d24;
    border-color: var(--primary, #dc2626);
}

.ht-poll-row.voted {
    font-weight: 700;
}

.ht-poll-row-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
    font-size: 14px;
}

.ht-poll-label {
    display: flex;
    align-items: center;
    gap: 6px;
}

.ht-poll-label i {
    color: #16a34a;
}

.ht-poll-pct {
    font-weight: 800;
    color: var(--primary, #dc2626);
    font-size: 15px;
}

.ht-poll-bar {
    height: 8px;
    background: #e5e7eb;
    border-radius: 4px;
    overflow: hidden;
}

:root[data-theme="dark"] .ht-poll-bar {
    background: #1f2937;
}

.ht-poll-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--primary, #dc2626), #f87171);
    border-radius: 4px;
    transition: width .8s cubic-bezier(.4, 0, .2, 1);
}

.ht-poll-row.voted .ht-poll-bar-fill {
    background: linear-gradient(90deg, #16a34a, #4ade80);
}

.ht-poll-votes {
    font-size: 11px;
    color: var(--text-secondary, #64748b);
    margin-top: 4px;
}

.ht-poll-foot {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--border, #e5e7eb);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 12px;
    color: var(--text-secondary, #64748b);
}

:root[data-theme="dark"] .ht-poll-foot {
    border-color: #4b5563;
}

.ht-poll-foot i {
    margin-right: 4px;
}

.ht-poll-tag {
    background: #d1fae5;
    color: #065f46;
    padding: 4px 10px;
    border-radius: 999px;
    font-weight: 600;
}

.ht-poll-tag.closed {
    background: #fee2e2;
    color: #991b1b;
}

:root[data-theme="dark"] .ht-poll-tag {
    background: #064e3b;
    color: #6ee7b7;
}

:root[data-theme="dark"] .ht-poll-tag.closed {
    background: #7f1d1d;
    color: #fca5a5;
}

.ht-poll-show-results {
    background: transparent;
    border: 0;
    color: var(--primary, #dc2626);
    cursor: pointer;
    font-weight: 600;
    font-size: 12px;
    padding: 0;
    font-family: inherit;
}

.ht-poll-show-results:hover {
    text-decoration: underline;
}

.ht-poll-loading,
.ht-poll-err {
    text-align: center;
    color: var(--text-secondary, #64748b);
    padding: 20px;
}

.ht-poll-err {
    color: #b91c1c;
}

@media (max-width: 600px) {
    .ht-poll-card {
        padding: 16px;
    }

    .ht-poll-q {
        font-size: 15px;
    }
}

/* ============= PARTI 10: Son Dakika Ticker + Toast ============= */
.ht-ticker {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9990;
    background: linear-gradient(90deg, #dc2626, #b91c1c);
    color: #fff;
    display: flex;
    align-items: center;
    height: 38px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .25);
    font-size: 13px;
    overflow: hidden;
}

body.ht-has-ticker {
    padding-top: 38px;
}

body.ht-has-ticker header,
body.ht-has-ticker .site-header,
body.ht-has-ticker .main-header {
    top: 38px !important;
}

.ht-ticker-label {
    background: #fff;
    color: #dc2626;
    font-weight: 800;
    padding: 0 14px;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    font-size: 12px;
    letter-spacing: .6px;
    box-shadow: 2px 0 8px rgba(0, 0, 0, .15);
    position: relative;
    z-index: 2;
}

.ht-ticker-label i {
    animation: htBoltPulse 1.4s infinite;
}

@keyframes htBoltPulse {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.25);
    }
}

.ht-ticker-track-wrap {
    flex: 1;
    overflow: hidden;
    position: relative;
    height: 100%;
}

.ht-ticker-track {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 100%;
    white-space: nowrap;
    animation: htTickerScroll 80s linear infinite;
    padding-left: 100%;
}

@keyframes htTickerScroll {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

.ht-ticker-item {
    color: #fff;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 6px;
    font-weight: 500;
    transition: opacity .15s;
}

.ht-ticker-item:hover {
    opacity: .82;
    text-decoration: underline;
    color: #fff;
}

.ht-ticker-cat {
    background: rgba(255, 255, 255, .22);
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .4px;
}

.ht-ticker-time {
    font-size: 11px;
    opacity: .75;
}

.ht-ticker-sep {
    color: rgba(255, 255, 255, .45);
    padding: 0 4px;
}

.ht-ticker-ctrl {
    display: flex;
    gap: 4px;
    padding: 0 8px;
    flex-shrink: 0;
    background: linear-gradient(90deg, transparent, #b91c1c 30%);
    padding-left: 28px;
}

.ht-ticker-btn {
    background: transparent;
    border: 0;
    color: #fff;
    cursor: pointer;
    width: 28px;
    height: 28px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    opacity: .8;
    transition: all .15s;
}

.ht-ticker-btn:hover {
    background: rgba(255, 255, 255, .18);
    opacity: 1;
}

@media (max-width: 600px) {
    .ht-ticker {
        font-size: 12px;
        height: 34px;
    }

    body.ht-has-ticker {
        padding-top: 34px;
    }

    body.ht-has-ticker header,
    body.ht-has-ticker .site-header,
    body.ht-has-ticker .main-header {
        top: 34px !important;
    }

    .ht-ticker-label {
        padding: 0 10px;
        font-size: 10px;
    }

    .ht-ticker-cat {
        display: none;
    }

    .ht-ticker-time {
        display: none;
    }

    .ht-ticker-track {
        animation-duration: 60s;
    }
}

/* Toast */
.ht-toast-new {
    position: fixed;
    bottom: 24px;
    left: 24px;
    max-width: 380px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .18);
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px 14px 12px;
    z-index: 9995;
    transform: translateX(-110%);
    transition: transform .35s cubic-bezier(.4, 0, .2, 1);
    border-left: 4px solid #dc2626;
}

.ht-toast-new.show {
    transform: translateX(0);
}

:root[data-theme="dark"] .ht-toast-new {
    background: #1f2937;
    color: #f3f4f6;
}

.ht-toast-icon {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #fee2e2;
    color: #dc2626;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
    animation: htBoltPulse 1.4s infinite;
}

:root[data-theme="dark"] .ht-toast-icon {
    background: #4c1d24;
}

.ht-toast-body {
    flex: 1;
    min-width: 0;
}

.ht-toast-head {
    font-size: 11px;
    font-weight: 700;
    color: #dc2626;
    text-transform: uppercase;
    letter-spacing: .5px;
    margin-bottom: 4px;
}

.ht-toast-head span {
    color: var(--text-secondary, #64748b);
    font-weight: 600;
}

.ht-toast-title {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--text, #1f2937);
    text-decoration: none;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

:root[data-theme="dark"] .ht-toast-title {
    color: #f3f4f6;
}

.ht-toast-title:hover {
    color: #dc2626;
}

.ht-toast-close {
    background: transparent;
    border: 0;
    color: #9ca3af;
    font-size: 22px;
    cursor: pointer;
    padding: 0 4px;
    line-height: 1;
    align-self: flex-start;
}

.ht-toast-close:hover {
    color: #dc2626;
}

@media (max-width: 600px) {
    .ht-toast-new {
        left: 12px;
        right: 12px;
        max-width: none;
        bottom: 80px;
    }
}

@media print {

    .ht-ticker,
    .ht-toast-new {
        display: none !important;
    }
}

/* ============= PARTI 11: Okuma Deneyimi ============= */
/* Reading progress bar */
.ht-rprog {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: rgba(0, 0, 0, .04);
    z-index: 9991;
    pointer-events: none;
}

body.ht-has-ticker .ht-rprog {
    top: 38px;
}

@media (max-width: 600px) {
    body.ht-has-ticker .ht-rprog {
        top: 34px;
    }
}

.ht-rprog-fill {
    height: 100%;
    width: 0;
    background: linear-gradient(90deg, #dc2626, #f87171, #fbbf24);
    transition: width .12s linear;
    box-shadow: 0 0 10px rgba(220, 38, 38, .5);
    border-radius: 0 2px 2px 0;
}

:root[data-theme="dark"] .ht-rprog {
    background: rgba(255, 255, 255, .08);
}

/* Reading time badge */
.ht-rtime {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--text-secondary, #64748b);
    margin-left: 12px;
    padding: 3px 10px;
    background: var(--bg-alt, #f1f5f9);
    border-radius: 999px;
    font-weight: 500;
}

.ht-rtime i {
    color: var(--primary, #dc2626);
}

:root[data-theme="dark"] .ht-rtime {
    background: #374151;
    color: #d1d5db;
}

.ht-rtime-block {
    display: flex;
    margin: 0 0 16px 0;
    padding: 10px 14px;
    border-radius: 8px;
    border-left: 3px solid var(--primary, #dc2626);
    background: linear-gradient(90deg, #fff5f5 0%, transparent 100%);
    font-size: 14px;
}

:root[data-theme="dark"] .ht-rtime-block {
    background: linear-gradient(90deg, #4c1d24 0%, transparent 100%);
}

.ht-rtime-block strong {
    color: var(--primary, #dc2626);
    margin: 0 4px;
}

/* Back-to-top */
.ht-btt {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: var(--primary, #dc2626);
    color: #fff;
    border: 0;
    cursor: pointer;
    box-shadow: 0 6px 20px rgba(220, 38, 38, .4);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px) scale(.8);
    transition: all .25s cubic-bezier(.4, 0, .2, 1);
    z-index: 9990;
}

.ht-btt.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
}

.ht-btt:hover {
    background: #b91c1c;
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 10px 28px rgba(220, 38, 38, .55);
}

.ht-btt:active {
    transform: translateY(-1px) scale(.96);
}

@media (max-width: 600px) {
    .ht-btt {
        bottom: 80px;
        right: 16px;
        width: 42px;
        height: 42px;
        font-size: 14px;
    }
}

@media print {

    .ht-rprog,
    .ht-btt,
    .ht-rtime {
        display: none !important;
    }
}

/* ============= PARTI 12: Akıllı Paylaşım ============= */
/* Selection tooltip */
.ht-sel-tip {
    position: absolute;
    transform: translate(-50%, -4px);
    background: #1f2937;
    color: #fff;
    border-radius: 24px;
    padding: 6px;
    display: flex;
    gap: 4px;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .3);
    opacity: 0;
    visibility: hidden;
    transition: all .18s;
    z-index: 9994;
}

.ht-sel-tip.show {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0);
}

.ht-sel-tip::after {
    content: '';
    position: absolute;
    bottom: -6px;
    left: 50%;
    transform: translateX(-50%);
    width: 12px;
    height: 12px;
    background: #1f2937;
    clip-path: polygon(50% 100%, 0 0, 100% 0);
}

.ht-sel-tip button {
    background: transparent;
    border: 0;
    color: #fff;
    cursor: pointer;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: background .12s, transform .12s;
}

.ht-sel-tip button:hover {
    background: rgba(255, 255, 255, .18);
    transform: scale(1.1);
}

/* Mini toast */
.ht-mini-toast {
    position: fixed;
    left: 50%;
    bottom: 90px;
    transform: translate(-50%, 20px);
    background: #1f2937;
    color: #fff;
    padding: 10px 18px;
    border-radius: 999px;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .3);
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 500;
    opacity: 0;
    transition: all .25s cubic-bezier(.4, 0, .2, 1);
    z-index: 9996;
    pointer-events: none;
}

.ht-mini-toast.show {
    opacity: 1;
    transform: translate(-50%, 0);
}

.ht-mini-toast i {
    color: #4ade80;
}

.ht-mini-toast.err i {
    color: #f87171;
}

/* Quick share floating left bar (desktop) */
.ht-qshare {
    position: fixed;
    left: 16px;
    top: 50%;
    transform: translate(-80px, -50%);
    background: #fff;
    border-radius: 30px;
    padding: 8px 6px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .12);
    z-index: 9989;
    transition: transform .35s cubic-bezier(.4, 0, .2, 1);
    border: 1px solid var(--border, #e5e7eb);
}

.ht-qshare.show {
    transform: translate(0, -50%);
}

:root[data-theme="dark"] .ht-qshare {
    background: #1f2937;
    border-color: #4b5563;
}

.ht-qshare button {
    background: var(--bg-alt, #f1f5f9);
    border: 0;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: var(--text, #1f2937);
    transition: all .15s;
}

:root[data-theme="dark"] .ht-qshare button {
    background: #374151;
    color: #f3f4f6;
}

.ht-qshare button:hover {
    transform: scale(1.12);
    color: #fff;
}

.ht-qshare button[data-net="wa"]:hover {
    background: #25D366;
}

.ht-qshare button[data-net="tg"]:hover {
    background: #0088cc;
}

.ht-qshare button[data-net="x"]:hover {
    background: #000;
}

.ht-qshare button[data-net="fb"]:hover {
    background: #1877F2;
}

.ht-qshare button[data-net="copy"]:hover {
    background: #6366f1;
}

.ht-qshare button[data-net="more"]:hover {
    background: var(--primary, #dc2626);
}

@media (max-width: 992px) {
    .ht-qshare {
        left: 0;
        right: 0;
        bottom: 60px;
        top: auto;
        transform: translateY(120%);
        flex-direction: row;
        justify-content: center;
        border-radius: 0;
        padding: 8px;
        border-left: 0;
        border-right: 0;
        border-bottom: 0;
    }

    .ht-qshare.show {
        transform: translateY(0);
    }
}

@media (max-width: 600px) {
    .ht-qshare button {
        width: 36px;
        height: 36px;
    }

    .ht-mini-toast {
        bottom: 130px;
        font-size: 12px;
        padding: 9px 14px;
    }
}

@media print {

    .ht-sel-tip,
    .ht-qshare,
    .ht-mini-toast {
        display: none !important;
    }
}

/* ============================== */
/* Parti 15 — Dark Mode 2.0 + Read Modes */
/* ============================== */
.ht-prefs-fab {
    position: fixed;
    right: 16px;
    bottom: 90px;
    z-index: 9998;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--primary, #dc2626);
    color: #fff;
    border: 0;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    transition: transform .15s, background .15s;
}

.ht-prefs-fab:hover {
    transform: scale(1.06);
}

.ht-prefs-panel {
    position: fixed;
    right: 16px;
    bottom: 144px;
    z-index: 9999;
    width: 280px;
    max-width: calc(100vw - 32px);
    background: #fff;
    color: #0f172a;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .18);
    padding: 14px;
    opacity: 0;
    transform: translateY(8px) scale(.98);
    pointer-events: none;
    transition: opacity .18s, transform .18s;
}

.ht-prefs-panel.is-open {
    opacity: 1;
    transform: none;
    pointer-events: auto;
}

.ht-prefs-h {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.ht-prefs-h strong {
    font-size: 15px;
}

.ht-prefs-h i {
    color: var(--primary, #dc2626);
    margin-right: 4px;
}

.ht-prefs-x {
    background: transparent;
    border: 0;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    color: #64748b;
}

.ht-prefs-x:hover {
    color: #0f172a;
}

.ht-prefs-section {
    margin-top: 10px;
}

.ht-prefs-section+.ht-prefs-section {
    border-top: 1px dashed #e5e7eb;
    padding-top: 12px;
    margin-top: 12px;
}

.ht-prefs-label {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #64748b;
    margin-bottom: 8px;
    font-weight: 600;
}

.ht-prefs-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
}

.ht-prefs-grid button {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 10px 6px;
    border: 1px solid #e5e7eb;
    background: #f8fafc;
    border-radius: 10px;
    cursor: pointer;
    color: #334155;
    font-size: 12px;
    transition: all .15s;
}

.ht-prefs-grid button i {
    font-size: 16px;
    color: #64748b;
}

.ht-prefs-grid button:hover {
    background: #eef2f7;
}

.ht-prefs-grid button.is-on {
    background: rgba(220, 38, 38, .08);
    border-color: var(--primary, #dc2626);
    color: var(--primary, #dc2626);
}

.ht-prefs-grid button.is-on i {
    color: var(--primary, #dc2626);
}

.ht-prefs-hint {
    display: block;
    margin-top: 6px;
    font-size: 11px;
    color: #94a3b8;
}

:root[data-theme="dark"] .ht-prefs-panel {
    background: #1e293b;
    color: #f1f5f9;
    border-color: #334155;
}

:root[data-theme="dark"] .ht-prefs-x {
    color: #94a3b8;
}

:root[data-theme="dark"] .ht-prefs-x:hover {
    color: #f1f5f9;
}

:root[data-theme="dark"] .ht-prefs-section+.ht-prefs-section {
    border-top-color: #334155;
}

:root[data-theme="dark"] .ht-prefs-grid button {
    background: #0f172a;
    border-color: #334155;
    color: #e2e8f0;
}

:root[data-theme="dark"] .ht-prefs-grid button i {
    color: #94a3b8;
}

:root[data-theme="dark"] .ht-prefs-grid button:hover {
    background: #1e293b;
}

@media (max-width: 768px) {
    .ht-prefs-fab {
        right: 12px;
        bottom: 80px;
        width: 42px;
        height: 42px;
    }

    .ht-prefs-panel {
        right: 12px;
        bottom: 130px;
        width: 260px;
    }
}

/* Reading modes — sadece detail içerikte uygula */
body[data-read="sepia"] .detail-content,
body[data-read="sepia"] .infinite-article,
body[data-read="sepia"] .article-content,
body[data-read="sepia"] .news-detail,
body[data-read="sepia"] .article-body {
    background: #f4ecd8 !important;
    color: #5b4636 !important;
    padding: 14px 18px;
    border-radius: 8px;
    font-family: Georgia, "Times New Roman", serif;
    line-height: 1.85;
}

body[data-read="sepia"] .detail-content a,
body[data-read="sepia"] .infinite-article a,
body[data-read="sepia"] .article-content a,
body[data-read="sepia"] .news-detail a,
body[data-read="sepia"] .article-body a {
    color: #8b4a1c;
}

body[data-read="hcontrast"] .detail-content,
body[data-read="hcontrast"] .infinite-article,
body[data-read="hcontrast"] .article-content,
body[data-read="hcontrast"] .news-detail,
body[data-read="hcontrast"] .article-body {
    background: #000 !important;
    color: #fff !important;
    padding: 14px 18px;
    border-radius: 8px;
    font-weight: 500;
    line-height: 1.8;
}

body[data-read="hcontrast"] .detail-content a,
body[data-read="hcontrast"] .infinite-article a,
body[data-read="hcontrast"] .article-content a,
body[data-read="hcontrast"] .news-detail a,
body[data-read="hcontrast"] .article-body a {
    color: #ffea00;
    text-decoration: underline;
}

@media print {

    .ht-prefs-fab,
    .ht-prefs-panel {
        display: none !important;
    }
}

/* ============================== */
/* Parti 14 — Akıllı Rozet         */
/* ============================== */
.ht-smart-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 8px;
    padding: 2px 8px;
    border-radius: 999px;
    background: linear-gradient(135deg, #6366f1, #ec4899);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    vertical-align: middle;
    letter-spacing: .02em;
}

.ht-smart-badge i {
    font-size: 10px;
}

/* Parti 17 — Arama: Bunu mu demek istediniz */
.ht-srch-dym {
    margin-top: 10px;
    font-size: 14px;
    color: #475569;
}

.ht-srch-dym-btn {
    background: #eef2ff;
    color: #4f46e5;
    border: 1px solid #c7d2fe;
    padding: 4px 12px;
    border-radius: 999px;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
    margin: 0 2px;
    transition: all .15s;
}

.ht-srch-dym-btn:hover {
    background: #4f46e5;
    color: #fff;
    border-color: #4f46e5;
    transform: translateY(-1px);
}

:root[data-theme="dark"] .ht-srch-dym {
    color: #cbd5e1;
}

:root[data-theme="dark"] .ht-srch-dym-btn {
    background: #312e81;
    color: #c7d2fe;
    border-color: #4338ca;
}

:root[data-theme="dark"] .ht-srch-dym-btn:hover {
    background: #6366f1;
    color: #fff;
}

/* Parti 18 — Push Bell Button */
.ht-push-bell {
    position: fixed;
    right: 16px;
    bottom: 144px;
    z-index: 9997;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #fff;
    color: #475569;
    border: 1px solid #e5e7eb;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    transition: transform .15s, background .15s, color .15s;
}

.ht-push-bell:hover {
    transform: scale(1.06);
}

.ht-push-bell.is-on {
    background: #dc2626;
    color: #fff;
    border-color: #dc2626;
}

.ht-push-bell.is-off {
    background: #fff;
    color: #64748b;
}

.ht-push-bell.is-block {
    background: #f1f5f9;
    color: #94a3b8;
    cursor: not-allowed;
}

:root[data-theme="dark"] .ht-push-bell {
    background: #1e293b;
    color: #cbd5e1;
    border-color: #334155;
}

:root[data-theme="dark"] .ht-push-bell.is-on {
    background: #dc2626;
    color: #fff;
    border-color: #dc2626;
}

@media (max-width: 768px) {
    .ht-push-bell {
        right: 12px;
        bottom: 130px;
        width: 42px;
        height: 42px;
    }
}

@media print {
    .ht-push-bell {
        display: none !important;
    }
}

/* N11 TTS bar */
.ht-tts-bar {
    display: flex;
    gap: 8px;
    align-items: center;
    background: linear-gradient(135deg, #0ea5e9, #6366f1);
    color: #fff;
    padding: 10px 14px;
    border-radius: 10px;
    margin: 0 0 18px;
    font-size: 14px;
    flex-wrap: wrap;
}

.ht-tts-bar button {
    background: rgba(255, 255, 255, .2);
    border: 1px solid rgba(255, 255, 255, .3);
    color: #fff;
    padding: 7px 14px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
    display: inline-flex;
    gap: 6px;
    align-items: center;
    font-size: 13px;
}

.ht-tts-bar button:hover {
    background: rgba(255, 255, 255, .35);
}

.ht-tts-bar select {
    background: rgba(255, 255, 255, .2);
    border: 1px solid rgba(255, 255, 255, .3);
    color: #fff;
    padding: 6px 8px;
    border-radius: 6px;
    font-size: 12px;
}

.ht-tts-bar select option {
    color: #000;
}

/* ═════════════════════════════════════════════ */
/* KATEGORİ BLOKLARI — Yeni Tasarım (12 öneri)   */
/* ═════════════════════════════════════════════ */

/* Renkli şerit başlık + gradient (#1) */
.cat-block {
    --cat-color: #dc2626;
    margin-bottom: 32px;
}

.cat-block .cat-header-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 0 12px 0;
    margin-bottom: 18px;
    border-bottom: 2px solid var(--cat-color);
    background: linear-gradient(90deg, color-mix(in srgb, var(--cat-color) 8%, transparent), transparent 40%);
    border-radius: 4px 4px 0 0;
}

.cat-block .cat-header-left {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    padding-left: 14px;
    position: relative;
}

.cat-block .cat-header-bar {
    position: absolute;
    left: 0;
    top: 4px;
    bottom: 4px;
    width: 5px;
    border-radius: 3px;
    background: var(--cat-color);
}

.cat-block .cat-header-strip h2 {
    font-size: 19px;
    font-weight: 800;
    margin: 0;
    line-height: 1;
}

.cat-block .cat-header-strip h2 a {
    color: #1e293b;
    text-decoration: none;
}

.cat-block .cat-header-strip h2 a:hover {
    color: var(--cat-color);
}

.cat-block .cat-header-strip .section-more {
    color: var(--cat-color);
    font-weight: 600;
    font-size: 13px;
    text-decoration: none;
    padding: 6px 12px;
    border-radius: 6px;
    transition: background .15s;
}

.cat-block .cat-header-strip .section-more:hover {
    background: color-mix(in srgb, var(--cat-color) 12%, transparent);
}

/* Alt-kategori sekmeleri (#9) */
.cat-subnav {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.cat-subnav-pill {
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 11.5px;
    font-weight: 600;
    background: #f1f5f9;
    color: #475569;
    text-decoration: none;
    transition: all .15s;
}

.cat-subnav-pill:hover {
    background: var(--cat-color);
    color: #fff;
}

/* Hover zoom + kategori pill (#4) */
.cat-card-zoom {
    position: relative;
    overflow: hidden;
    transition: box-shadow .2s, transform .2s;
}

.cat-card-zoom:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
}

.cat-card-zoom img {
    transition: transform .4s ease;
}

.cat-card-zoom:hover img {
    transform: scale(1.06);
}

.cat-pill-on-card {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 2;
    padding: 4px 10px;
    border-radius: 4px;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .3px;
    backdrop-filter: blur(4px);
    box-shadow: 0 2px 6px rgba(0, 0, 0, .2);
}

.cat-pill-on-card i {
    margin-right: 4px;
}

/* YENİ + Editör Seçimi rozetleri (#10, #12) */
.cat-badge-new {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 3;
    background: #16a34a;
    color: #fff;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .5px;
    box-shadow: 0 2px 6px rgba(22, 163, 74, .4);
    animation: catNewPulse 2s infinite;
}

@keyframes catNewPulse {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.06);
    }
}

.cat-badge-pick {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 3;
    background: #f59e0b;
    color: #fff;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    box-shadow: 0 2px 6px rgba(245, 158, 11, .5);
}

.cat-badge-new+.cat-badge-pick,
.cat-badge-pick+.cat-badge-new {
    right: 48px;
}

/* Meta footer (#11): göz/yorum/dakika */
.cat-meta {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-top: 8px;
    padding-top: 6px;
    font-size: 11.5px;
    color: #64748b;
    border-top: 1px dashed #e5e7eb;
}

.cat-meta span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.cat-meta i {
    font-size: 10.5px;
    opacity: .8;
}

/* Featured layout — numaralı liste (#3) */
.cat-numbered {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px;
    padding: 10px 12px !important;
}

.cat-rank {
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    color: #fff;
    font-weight: 800;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
}

.cat-list-text {
    flex: 1;
    min-width: 0;
}

.cat-list-text h4 {
    font-size: 13.5px;
    line-height: 1.4;
    margin: 0 0 2px;
    color: #1e293b;
}

.cat-list-text .cat-meta {
    margin-top: 4px;
    padding-top: 4px;
}

/* Featured big card pill ve overlay altta meta */
.cat-featured-main {
    position: relative;
}

.featured-card-big {
    position: relative;
    display: block;
}

.featured-card-overlay .cat-meta {
    color: rgba(255, 255, 255, .85);
    border-top-color: rgba(255, 255, 255, .2);
}

.featured-card-overlay .cat-meta i {
    color: rgba(255, 255, 255, .85);
}

/* #5 Magazine Layout */
.cat-magazine-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 16px;
}

.cat-mag-big {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .08);
    display: grid;
    grid-template-columns: 45% 1fr;
}

.cat-mag-img {
    position: relative;
    min-height: 180px;
}

.cat-mag-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cat-mag-body {
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.cat-mag-body .cat-pill-on-card {
    position: static;
    align-self: flex-start;
}

.cat-mag-body h3 {
    font-size: 16px;
    line-height: 1.35;
    color: #1e293b;
    margin: 4px 0 6px;
}

.cat-mag-body p {
    font-size: 13px;
    color: #64748b;
    line-height: 1.5;
    margin: 0;
}

.cat-mag-mini {
    gap: 12px;
}

@media (max-width: 768px) {
    .cat-magazine-grid {
        grid-template-columns: 1fr;
    }

    .cat-mag-big {
        grid-template-columns: 1fr;
    }

    .cat-mag-img {
        min-height: 160px;
    }
}

/* #6 Headline Split */
.cat-split-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 16px;
}

.cat-split-main {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
}

.cat-split-main a {
    color: inherit;
    text-decoration: none;
}

.cat-split-img {
    position: relative;
    height: 280px;
    overflow: hidden;
}

.cat-split-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s;
}

.cat-split-main:hover .cat-split-img img {
    transform: scale(1.05);
}

.cat-split-panel {
    padding: 18px 20px;
    color: #fff;
}

.cat-split-panel .cat-pill-on-card {
    position: static;
    display: inline-block;
    margin-bottom: 10px;
}

.cat-split-panel h3 {
    font-size: 18px;
    line-height: 1.35;
    margin: 0 0 8px;
}

.cat-split-panel p {
    font-size: 13px;
    opacity: .92;
    margin: 0;
    line-height: 1.5;
}

.cat-split-side {
    background: #fff;
    border-radius: 10px;
    padding: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
    border-left: 4px solid;
}

.cat-split-item {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 12px 10px;
    border-bottom: 1px solid #f1f5f9;
    text-decoration: none;
    color: inherit;
    position: relative;
}

.cat-split-item:last-child {
    border-bottom: none;
}

.cat-split-num {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    color: #fff;
    font-weight: 800;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.cat-split-text {
    flex: 1;
    min-width: 0;
}

.cat-split-text h4 {
    font-size: 13.5px;
    line-height: 1.4;
    margin: 0;
    color: #1e293b;
}

@media (max-width: 768px) {
    .cat-split-grid {
        grid-template-columns: 1fr;
    }

    .cat-split-img {
        height: 200px;
    }
}

/* #7 Wide Strip */
.cat-wide-strip {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 12px;
    scrollbar-width: thin;
}

.cat-wide-strip::-webkit-scrollbar {
    height: 8px;
}

.cat-wide-strip::-webkit-scrollbar-thumb {
    background: var(--cat-color);
    border-radius: 4px;
}

.cat-strip-card {
    flex: 0 0 240px;
    scroll-snap-align: start;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .08);
}

.cat-strip-card a {
    color: inherit;
    text-decoration: none;
}

.cat-strip-img {
    position: relative;
    height: 140px;
    overflow: hidden;
}

.cat-strip-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s;
}

.cat-strip-card:hover .cat-strip-img img {
    transform: scale(1.06);
}

.cat-strip-body {
    padding: 10px 12px;
}

.cat-strip-body h3 {
    font-size: 13.5px;
    line-height: 1.35;
    color: #1e293b;
    margin: 0;
}

/* #8 Compact List */
.cat-compact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.cat-compact-item {
    display: flex;
    gap: 12px;
    padding: 10px;
    background: #fff;
    border-radius: 8px;
    border-left: 3px solid var(--cat-color);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
    text-decoration: none;
    color: inherit;
    transition: all .2s;
}

.cat-compact-item:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, .1);
    transform: translateX(2px);
}

.cat-compact-thumb {
    flex-shrink: 0;
    width: 90px;
    height: 90px;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
}

.cat-compact-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cat-compact-thumb .cat-badge-new,
.cat-compact-thumb .cat-badge-pick {
    top: 4px;
    right: 4px;
    transform: scale(.85);
}

.cat-compact-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.cat-compact-text h4 {
    font-size: 13.5px;
    line-height: 1.35;
    color: #1e293b;
    margin: 0 0 3px;
}

.cat-compact-text p {
    font-size: 11.5px;
    color: #64748b;
    line-height: 1.4;
    margin: 0 0 4px;
}

.cat-compact-text .cat-meta {
    margin-top: auto;
    padding-top: 4px;
}

@media (max-width: 768px) {
    .cat-compact-grid {
        grid-template-columns: 1fr;
    }
}

/* Numbered list — spor-num override (#3) */
.spor-numbered-item {
    position: relative;
}

.spor-numbered-item .cat-badge-new,
.spor-numbered-item .cat-badge-pick {
    position: static;
    margin-left: 6px;
    transform: scale(.8);
}

/* ═════════════════════════════════════════════ */
/* GENEL ALT SAYFA STİLLERİ                      */
/* (son-dakika, foto/video-galeri, basın ilanları, haber-ajansları) */
/* ═════════════════════════════════════════════ */

/* fade-in animasyonu */
.fade-in {
    animation: ftFadeIn .35s ease both;
}

@keyframes ftFadeIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

/* Empty state */
.empty-state {
    text-align: center;
    padding: 60px 20px;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
    color: #64748b;
}

.empty-state i {
    font-size: 56px;
    color: #cbd5e1;
    margin-bottom: 16px;
    display: block;
}

.empty-state p {
    font-size: 17px;
    font-weight: 600;
    color: #1e293b;
    margin: 0 0 6px;
}

.empty-state small {
    font-size: 13.5px;
    color: #64748b;
}

.btn-primary-link {
    display: inline-block;
    padding: 10px 22px;
    border-radius: 8px;
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    color: #fff !important;
    font-weight: 600;
    text-decoration: none;
    transition: transform .15s;
}

.btn-primary-link:hover {
    transform: translateY(-1px);
}

/* Sayfa başlık banner (foto-galeri, video-galeri, ruya, basın ilanları) */
.page-header-banner {
    background: linear-gradient(135deg, #1e293b, #334155);
    color: #fff;
    padding: 36px 28px;
    border-radius: 14px;
    margin: 0 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    flex-wrap: wrap;
    box-shadow: 0 4px 18px rgba(15, 23, 42, .12);
    position: relative;
    overflow: hidden;
}

.page-header-banner::before {
    content: '';
    position: absolute;
    right: -40px;
    top: -40px;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(99, 102, 241, .25), transparent 70%);
    border-radius: 50%;
    pointer-events: none;
}

.page-header-banner h1 {
    font-size: 28px;
    font-weight: 800;
    margin: 0 0 6px;
    line-height: 1.15;
}

.page-header-banner p {
    margin: 0;
    opacity: .85;
    font-size: 14.5px;
}

.page-header-banner i.fa-camera,
.page-header-banner i.fa-video,
.page-header-banner i.fa-images,
.page-header-banner i.fa-film,
.page-header-banner i.fa-landmark,
.page-header-banner i.fa-moon {
    margin-right: 10px;
    color: #818cf8;
}

/* ── son-dakika TIMELINE ── */
.breaking-page-header {
    background: linear-gradient(135deg, #dc2626, #991b1b);
    color: #fff;
    padding: 32px 28px;
    border-radius: 14px;
    margin: 0 0 28px;
    box-shadow: 0 6px 22px rgba(220, 38, 38, .25);
    position: relative;
    overflow: hidden;
}

.breaking-page-header::before {
    content: '';
    position: absolute;
    right: -30px;
    bottom: -30px;
    width: 180px;
    height: 180px;
    background: radial-gradient(circle, rgba(255, 255, 255, .12), transparent 70%);
    border-radius: 50%;
}

.breaking-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: rgba(255, 255, 255, .2);
    border-radius: 20px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .5px;
    margin-bottom: 12px;
    backdrop-filter: blur(4px);
}

.breaking-badge i {
    animation: brkBolt 1.5s infinite;
}

@keyframes brkBolt {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.18);
    }
}

.breaking-page-header h1 {
    font-size: 30px;
    font-weight: 800;
    margin: 0 0 6px;
}

.breaking-page-header p {
    margin: 0;
    opacity: .92;
    font-size: 15px;
}

.timeline {
    position: relative;
    padding-left: 28px;
    margin: 0;
}

.timeline::before {
    content: '';
    position: absolute;
    left: 8px;
    top: 0;
    bottom: 0;
    width: 3px;
    background: linear-gradient(to bottom, #dc2626 0%, #f1f5f9 100%);
    border-radius: 3px;
}

.timeline-date-header {
    background: #fff;
    padding: 8px 16px;
    border-radius: 20px;
    display: inline-block;
    font-weight: 700;
    font-size: 13px;
    color: #dc2626;
    margin: 18px 0 14px -4px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .06);
    position: relative;
    z-index: 2;
}

.timeline-item {
    position: relative;
    margin-bottom: 14px;
    padding-left: 24px;
}

.timeline-item::before {
    content: '';
    position: absolute;
    left: -24px;
    top: 14px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #dc2626;
    border: 3px solid #fff;
    box-shadow: 0 0 0 2px #dc2626;
    z-index: 2;
}

.timeline-time {
    position: absolute;
    left: -78px;
    top: 12px;
    width: 50px;
    font-size: 13px;
    font-weight: 700;
    color: #64748b;
    text-align: right;
}

@media (max-width: 768px) {
    .timeline-time {
        position: static;
        display: inline-block;
        margin-bottom: 4px;
        color: #dc2626;
    }
}

.timeline-content a {
    color: inherit;
    text-decoration: none;
    display: block;
}

.timeline-card {
    display: flex;
    gap: 16px;
    background: #fff;
    border-radius: 12px;
    padding: 14px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
    transition: all .2s ease;
}

.timeline-card:hover {
    box-shadow: 0 8px 22px rgba(0, 0, 0, .1);
    transform: translateX(3px);
}

.timeline-image {
    flex-shrink: 0;
    width: 140px;
    height: 100px;
    border-radius: 8px;
    overflow: hidden;
}

.timeline-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s;
}

.timeline-card:hover .timeline-image img {
    transform: scale(1.06);
}

.timeline-body {
    flex: 1;
    min-width: 0;
}

.timeline-body h3 {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0 0 6px;
    color: #1e293b;
}

.timeline-body p {
    font-size: 13.5px;
    color: #64748b;
    line-height: 1.5;
    margin: 0 0 8px;
}

.timeline-meta {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    font-size: 12px;
    color: #64748b;
}

.timeline-meta .news-card-cat {
    background: #dc2626;
    color: #fff;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.timeline-meta span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

@media (max-width: 600px) {
    .timeline-card {
        flex-direction: column;
    }

    .timeline-image {
        width: 100%;
        height: 180px;
    }
}

/* Basın ilanları filter bar */
.classified-filter-bar {
    background: #fff;
    padding: 14px 18px;
    border-radius: 12px;
    margin-bottom: 18px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
}

.classified-filter-bar a,
.classified-filter-bar button {
    padding: 8px 14px;
    border-radius: 8px;
    background: #f1f5f9;
    color: #475569;
    text-decoration: none;
    font-weight: 600;
    font-size: 13px;
    border: none;
    cursor: pointer;
    transition: all .15s;
}

.classified-filter-bar a:hover,
.classified-filter-bar a.active,
.classified-filter-bar button:hover,
.classified-filter-bar button.active {
    background: #6366f1;
    color: #fff;
}

/* news-detail-card (basın ilanı kartı) */
.news-detail-card {
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
    margin-bottom: 12px;
    transition: all .2s;
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.news-detail-card:hover {
    box-shadow: 0 6px 18px rgba(0, 0, 0, .1);
}

.news-detail-card h3 {
    font-size: 15px;
    line-height: 1.4;
    margin: 0 0 6px;
    color: #1e293b;
}

.news-detail-card .news-card-cat {
    background: #6366f1;
    color: #fff;
    padding: 2px 9px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
}

/* ── HABER AJANSLARI ── */
.agency-page {
    padding: 0;
}

.agency-header {
    background: linear-gradient(135deg, #0ea5e9, #6366f1);
    color: #fff;
    padding: 28px;
    border-radius: 14px;
    margin-bottom: 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 14px;
}

.agency-header h1 {
    font-size: 26px;
    font-weight: 800;
    margin: 0;
}

.agency-header h1 i {
    margin-right: 10px;
    opacity: .85;
}

.agency-stats {
    display: flex;
    gap: 18px;
}

.stat-item {
    text-align: center;
}

.stat-value {
    font-size: 22px;
    font-weight: 800;
    display: block;
}

.stat-label {
    font-size: 11.5px;
    opacity: .85;
    text-transform: uppercase;
    letter-spacing: .4px;
}

.agency-layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 20px;
}

@media (max-width: 1024px) {
    .agency-layout {
        grid-template-columns: 1fr;
    }
}

.agency-sidebar {
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
}

.source-filter-card h3 {
    font-size: 14px;
    font-weight: 700;
    margin: 0 0 12px;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 6px;
}

.source-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.source-list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    border-radius: 6px;
    text-decoration: none;
    color: #475569;
    font-size: 13px;
    transition: all .15s;
}

.source-list a:hover,
.source-list a.active {
    background: #6366f1;
    color: #fff;
}

.source-list .source-count {
    font-size: 11px;
    opacity: .7;
}

.agency-content {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.agency-news-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: 1fr;
}

.agency-news-card {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 14px;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
    transition: all .2s;
}

.agency-news-card:hover {
    box-shadow: 0 8px 22px rgba(0, 0, 0, .1);
}

.agency-news-card .news-image {
    height: 130px;
    overflow: hidden;
}

.agency-news-card .news-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s;
}

.agency-news-card:hover .news-image img {
    transform: scale(1.06);
}

.news-body {
    padding: 12px 14px;
    min-width: 0;
}

.news-cat {
    display: inline-block;
    background: #0ea5e9;
    color: #fff;
    padding: 2px 9px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 700;
    margin-bottom: 6px;
}

.news-title {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
    color: #1e293b;
    margin: 0 0 4px;
}

.news-summary {
    font-size: 13px;
    color: #64748b;
    line-height: 1.4;
    margin: 0 0 8px;
}

.news-meta {
    display: flex;
    gap: 12px;
    font-size: 11.5px;
    color: #94a3b8;
    flex-wrap: wrap;
}

.news-meta span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.news-source {
    font-weight: 600;
    color: #6366f1 !important;
}

.no-news {
    text-align: center;
    padding: 40px;
    color: #94a3b8;
    background: #fff;
    border-radius: 12px;
}

.active-filter {
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    padding: 10px 14px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    font-size: 13px;
    color: #065f46;
}

.active-filter .clear-filter {
    margin-left: auto;
    padding: 4px 10px;
    background: #10b981;
    color: #fff;
    border-radius: 6px;
    text-decoration: none;
    font-size: 12px;
    font-weight: 600;
}

/* Pagination */
.pagination-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    margin-top: 18px;
    flex-wrap: wrap;
}

.pagination {
    display: flex;
    gap: 4px;
}

.pagination a,
.pagination span {
    padding: 7px 12px;
    border-radius: 6px;
    background: #fff;
    color: #475569;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
    transition: all .15s;
}

.pagination a:hover {
    background: #6366f1;
    color: #fff;
}

.pagination .active {
    background: #6366f1;
    color: #fff;
}

.pagination .dots {
    background: transparent;
    box-shadow: none;
}

.pagination-info {
    font-size: 12.5px;
    color: #64748b;
}

@media (max-width: 600px) {
    .agency-news-card {
        grid-template-columns: 1fr;
    }

    .agency-news-card .news-image {
        height: 180px;
    }
}


/* ═════════════════════════════════════════════ */
/* GENEL ALT SAYFA STİLLERİ                      */
/* (son-dakika, foto/video-galeri, basın ilanları, haber-ajansları) */
/* ═════════════════════════════════════════════ */

/* fade-in animasyonu */
.fade-in {
    animation: ftFadeIn .35s ease both;
}

@keyframes ftFadeIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

/* Empty state */
.empty-state {
    text-align: center;
    padding: 60px 20px;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
    color: #64748b;
}

.empty-state i {
    font-size: 56px;
    color: #cbd5e1;
    margin-bottom: 16px;
    display: block;
}

.empty-state p {
    font-size: 17px;
    font-weight: 600;
    color: #1e293b;
    margin: 0 0 6px;
}

.empty-state small {
    font-size: 13.5px;
    color: #64748b;
}

.btn-primary-link {
    display: inline-block;
    padding: 10px 22px;
    border-radius: 8px;
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    color: #fff !important;
    font-weight: 600;
    text-decoration: none;
    transition: transform .15s;
}

.btn-primary-link:hover {
    transform: translateY(-1px);
}

/* Sayfa başlık banner */
.page-header-banner {
    background: linear-gradient(135deg, #1e293b, #334155);
    color: #fff;
    padding: 36px 28px;
    border-radius: 14px;
    margin: 0 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    flex-wrap: wrap;
    box-shadow: 0 4px 18px rgba(15, 23, 42, .12);
    position: relative;
    overflow: hidden;
}

.page-header-banner::before {
    content: '';
    position: absolute;
    right: -40px;
    top: -40px;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(99, 102, 241, .25), transparent 70%);
    border-radius: 50%;
    pointer-events: none;
}

.page-header-banner h1 {
    font-size: 28px;
    font-weight: 800;
    margin: 0 0 6px;
    line-height: 1.15;
}

.page-header-banner p {
    margin: 0;
    opacity: .85;
    font-size: 14.5px;
}

.page-header-banner i.fa-camera,
.page-header-banner i.fa-video,
.page-header-banner i.fa-images,
.page-header-banner i.fa-film,
.page-header-banner i.fa-landmark,
.page-header-banner i.fa-moon {
    margin-right: 10px;
    color: #818cf8;
}

/* ── son-dakika TIMELINE ── */
.breaking-page-header {
    background: linear-gradient(135deg, #dc2626, #991b1b);
    color: #fff;
    padding: 32px 28px;
    border-radius: 14px;
    margin: 0 0 28px;
    box-shadow: 0 6px 22px rgba(220, 38, 38, .25);
    position: relative;
    overflow: hidden;
}

.breaking-page-header::before {
    content: '';
    position: absolute;
    right: -30px;
    bottom: -30px;
    width: 180px;
    height: 180px;
    background: radial-gradient(circle, rgba(255, 255, 255, .12), transparent 70%);
    border-radius: 50%;
}

.breaking-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: rgba(255, 255, 255, .2);
    border-radius: 20px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .5px;
    margin-bottom: 12px;
    backdrop-filter: blur(4px);
}

.breaking-badge i {
    animation: brkBolt 1.5s infinite;
}

@keyframes brkBolt {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.18);
    }
}

.breaking-page-header h1 {
    font-size: 30px;
    font-weight: 800;
    margin: 0 0 6px;
}

.breaking-page-header p {
    margin: 0;
    opacity: .92;
    font-size: 15px;
}

.timeline {
    position: relative;
    padding-left: 28px;
    margin: 0;
}

.timeline::before {
    content: '';
    position: absolute;
    left: 8px;
    top: 0;
    bottom: 0;
    width: 3px;
    background: linear-gradient(to bottom, #dc2626 0%, #f1f5f9 100%);
    border-radius: 3px;
}

.timeline-date-header {
    background: #fff;
    padding: 8px 16px;
    border-radius: 20px;
    display: inline-block;
    font-weight: 700;
    font-size: 13px;
    color: #dc2626;
    margin: 18px 0 14px -4px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .06);
    position: relative;
    z-index: 2;
}

.timeline-item {
    position: relative;
    margin-bottom: 14px;
    padding-left: 24px;
}

.timeline-item::before {
    content: '';
    position: absolute;
    left: -24px;
    top: 14px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #dc2626;
    border: 3px solid #fff;
    box-shadow: 0 0 0 2px #dc2626;
    z-index: 2;
}

.timeline-time {
    position: absolute;
    left: -78px;
    top: 12px;
    width: 50px;
    font-size: 13px;
    font-weight: 700;
    color: #64748b;
    text-align: right;
}

@media (max-width: 768px) {
    .timeline-time {
        position: static;
        display: inline-block;
        margin-bottom: 4px;
        color: #dc2626;
    }
}

.timeline-content a {
    color: inherit;
    text-decoration: none;
    display: block;
}

.timeline-card {
    display: flex;
    gap: 16px;
    background: #fff;
    border-radius: 12px;
    padding: 14px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
    transition: all .2s ease;
}

.timeline-card:hover {
    box-shadow: 0 8px 22px rgba(0, 0, 0, .1);
    transform: translateX(3px);
}

.timeline-image {
    flex-shrink: 0;
    width: 140px;
    height: 100px;
    border-radius: 8px;
    overflow: hidden;
}

.timeline-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s;
}

.timeline-card:hover .timeline-image img {
    transform: scale(1.06);
}

.timeline-body {
    flex: 1;
    min-width: 0;
}

.timeline-body h3 {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0 0 6px;
    color: #1e293b;
}

.timeline-body p {
    font-size: 13.5px;
    color: #64748b;
    line-height: 1.5;
    margin: 0 0 8px;
}

.timeline-meta {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    font-size: 12px;
    color: #64748b;
}

.timeline-meta .news-card-cat {
    background: #dc2626;
    color: #fff;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.timeline-meta span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

@media (max-width: 600px) {
    .timeline-card {
        flex-direction: column;
    }

    .timeline-image {
        width: 100%;
        height: 180px;
    }
}

/* Basın ilanları filter bar */
.classified-filter-bar {
    background: #fff;
    padding: 14px 18px;
    border-radius: 12px;
    margin-bottom: 18px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
}

.classified-filter-bar a,
.classified-filter-bar button {
    padding: 8px 14px;
    border-radius: 8px;
    background: #f1f5f9;
    color: #475569;
    text-decoration: none;
    font-weight: 600;
    font-size: 13px;
    border: none;
    cursor: pointer;
    transition: all .15s;
}

.classified-filter-bar a:hover,
.classified-filter-bar a.active,
.classified-filter-bar button:hover,
.classified-filter-bar button.active {
    background: #6366f1;
    color: #fff;
}

.news-detail-card {
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
    margin-bottom: 12px;
    transition: all .2s;
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.news-detail-card:hover {
    box-shadow: 0 6px 18px rgba(0, 0, 0, .1);
}

.news-detail-card h3 {
    font-size: 15px;
    line-height: 1.4;
    margin: 0 0 6px;
    color: #1e293b;
}

.news-detail-card .news-card-cat {
    background: #6366f1;
    color: #fff;
    padding: 2px 9px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
}

/* ── HABER AJANSLARI ── */
.agency-page {
    padding: 0;
}

.agency-header {
    background: linear-gradient(135deg, #0ea5e9, #6366f1);
    color: #fff;
    padding: 28px;
    border-radius: 14px;
    margin-bottom: 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 14px;
}

.agency-header h1 {
    font-size: 26px;
    font-weight: 800;
    margin: 0;
}

.agency-header h1 i {
    margin-right: 10px;
    opacity: .85;
}

.agency-stats {
    display: flex;
    gap: 18px;
}

.stat-item {
    text-align: center;
}

.stat-value {
    font-size: 22px;
    font-weight: 800;
    display: block;
}

.stat-label {
    font-size: 11.5px;
    opacity: .85;
    text-transform: uppercase;
    letter-spacing: .4px;
}

.agency-layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 20px;
}

@media (max-width: 1024px) {
    .agency-layout {
        grid-template-columns: 1fr;
    }
}

.agency-sidebar {
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
}

.source-filter-card h3 {
    font-size: 14px;
    font-weight: 700;
    margin: 0 0 12px;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 6px;
}

.source-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.source-list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    border-radius: 6px;
    text-decoration: none;
    color: #475569;
    font-size: 13px;
    transition: all .15s;
}

.source-list a:hover,
.source-list a.active {
    background: #6366f1;
    color: #fff;
}

.source-list .source-count {
    font-size: 11px;
    opacity: .7;
}

.agency-content {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.agency-news-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: 1fr;
}

.agency-news-card {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 14px;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
    transition: all .2s;
}

.agency-news-card:hover {
    box-shadow: 0 8px 22px rgba(0, 0, 0, .1);
}

.agency-news-card .news-image {
    height: 130px;
    overflow: hidden;
}

.agency-news-card .news-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s;
}

.agency-news-card:hover .news-image img {
    transform: scale(1.06);
}

.news-body {
    padding: 12px 14px;
    min-width: 0;
}

.news-cat {
    display: inline-block;
    background: #0ea5e9;
    color: #fff;
    padding: 2px 9px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 700;
    margin-bottom: 6px;
}

.news-title {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
    color: #1e293b;
    margin: 0 0 4px;
}

.news-summary {
    font-size: 13px;
    color: #64748b;
    line-height: 1.4;
    margin: 0 0 8px;
}

.news-meta {
    display: flex;
    gap: 12px;
    font-size: 11.5px;
    color: #94a3b8;
    flex-wrap: wrap;
}

.news-meta span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.news-source {
    font-weight: 600;
    color: #6366f1 !important;
}

.no-news {
    text-align: center;
    padding: 40px;
    color: #94a3b8;
    background: #fff;
    border-radius: 12px;
}

.active-filter {
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    padding: 10px 14px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    font-size: 13px;
    color: #065f46;
}

.active-filter .clear-filter {
    margin-left: auto;
    padding: 4px 10px;
    background: #10b981;
    color: #fff;
    border-radius: 6px;
    text-decoration: none;
    font-size: 12px;
    font-weight: 600;
}

.pagination-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    margin-top: 18px;
    flex-wrap: wrap;
}

.pagination {
    display: flex;
    gap: 4px;
}

.pagination a,
.pagination span {
    padding: 7px 12px;
    border-radius: 6px;
    background: #fff;
    color: #475569;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
    transition: all .15s;
}

.pagination a:hover {
    background: #6366f1;
    color: #fff;
}

.pagination .active {
    background: #6366f1;
    color: #fff;
}

.pagination .dots {
    background: transparent;
    box-shadow: none;
}

.pagination-info {
    font-size: 12.5px;
    color: #64748b;
}

@media (max-width: 600px) {
    .agency-news-card {
        grid-template-columns: 1fr;
    }

    .agency-news-card .news-image {
        height: 180px;
    }
}



/* ════════════════════════════════════════════════════ */
/* MODERN PRO BLOCKS — Faz 1 (6 yeni blok tipi)         */
/* editorial_spotlight, numbered_top_list,              */
/* two_column_compare, topic_cluster,                   */
/* latest_live_feed, newsletter_cta_pro                 */
/* ════════════════════════════════════════════════════ */

.pro-block {
    margin: 0 0 28px;
}

/* ── 1) EDİTORYAL SPOTLIGHT ── */
.edt-spot-card {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(15, 23, 42, .07);
    border: 1px solid #eef2f7;
}

.edt-spot-img {
    position: relative;
    display: block;
    min-height: 360px;
    overflow: hidden;
}

.edt-spot-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s ease;
}

.edt-spot-card:hover .edt-spot-img img {
    transform: scale(1.04);
}

.edt-badge {
    position: absolute;
    top: 18px;
    left: 18px;
    background: linear-gradient(135deg, #0f172a, #334155);
    color: #fff;
    padding: 7px 14px;
    border-radius: 24px;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: .8px;
    box-shadow: 0 4px 12px rgba(15, 23, 42, .4);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.edt-badge i {
    color: #fbbf24;
}

.edt-spot-body {
    padding: 32px 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.edt-cat {
    display: inline-block;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .8px;
    border: 1.5px solid;
    padding: 4px 10px;
    border-radius: 4px;
    align-self: flex-start;
    margin-bottom: 14px;
}

.edt-spot-body h2 {
    font-size: 26px;
    line-height: 1.25;
    margin: 0 0 14px;
    font-weight: 800;
    color: #0f172a;
}

.edt-spot-body h2 a {
    color: inherit;
    text-decoration: none;
}

.edt-spot-body h2 a:hover {
    color: #6366f1;
}

.edt-excerpt {
    font-size: 15px;
    line-height: 1.65;
    color: #475569;
    margin: 0 0 22px;
}

.edt-author {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 18px;
    border-top: 1px solid #eef2f7;
}

.edt-author-avatar {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    overflow: hidden;
    background: #f1f5f9;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 18px;
    flex-shrink: 0;
}

.edt-author-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.edt-author-info {
    display: flex;
    flex-direction: column;
}

.edt-author-info strong {
    color: #0f172a;
    font-size: 14px;
    font-weight: 700;
}

.edt-author-info span {
    color: #64748b;
    font-size: 12px;
    margin-top: 2px;
}

@media (max-width: 900px) {
    .edt-spot-card {
        grid-template-columns: 1fr;
    }

    .edt-spot-img {
        min-height: 240px;
    }

    .edt-spot-body {
        padding: 22px 20px;
    }

    .edt-spot-body h2 {
        font-size: 22px;
    }
}

/* ── 2) NUMARALI TOP-N LİSTE ── */
.ntop {
    background: #fff;
    border-radius: 14px;
    padding: 20px 22px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .05);
    border: 1px solid #eef2f7;
}

.ntop-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid #f1f5f9;
}

.ntop-header h2 {
    font-size: 17px;
    font-weight: 800;
    margin: 0;
    color: #0f172a;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.ntop-header h2 i {
    color: #f59e0b;
}

.ntop-sub {
    font-size: 12px;
    color: #94a3b8;
}

.ntop-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.ntop-item {
    display: grid;
    grid-template-columns: 56px 80px 1fr;
    gap: 14px;
    align-items: center;
    padding: 8px;
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    transition: all .15s;
}

.ntop-item:hover {
    background: #f8fafc;
    transform: translateX(3px);
}

.ntop-rank {
    font-size: 38px;
    font-weight: 900;
    line-height: 1;
    color: transparent;
    -webkit-text-stroke: 2px #cbd5e1;
    text-align: center;
    font-family: 'Inter', sans-serif;
}

.ntop-rank-1 {
    -webkit-text-stroke-color: #f59e0b;
    color: rgba(245, 158, 11, .1);
}

.ntop-rank-2 {
    -webkit-text-stroke-color: #94a3b8;
    color: rgba(148, 163, 184, .1);
}

.ntop-rank-3 {
    -webkit-text-stroke-color: #b45309;
    color: rgba(180, 83, 9, .1);
}

.ntop-thumb {
    width: 80px;
    height: 60px;
    border-radius: 8px;
    overflow: hidden;
    background: #f1f5f9;
    flex-shrink: 0;
}

.ntop-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ntop-body {
    min-width: 0;
}

.ntop-cat {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.ntop-body h3 {
    font-size: 14.5px;
    line-height: 1.4;
    margin: 4px 0 0;
    color: #0f172a;
    font-weight: 600;
}

@media (max-width: 600px) {
    .ntop-item {
        grid-template-columns: 44px 64px 1fr;
        gap: 10px;
    }

    .ntop-rank {
        font-size: 30px;
    }

    .ntop-thumb {
        width: 64px;
        height: 48px;
    }

    .ntop-body h3 {
        font-size: 13.5px;
    }
}

/* ── 3) İKİ SÜTUN KARŞILAŞTIRMA ── */
.twocol-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.twocol-card {
    --accent: #6366f1;
    display: block;
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .05);
    border: 1px solid #eef2f7;
    text-decoration: none;
    color: inherit;
    transition: all .25s;
    border-top: 4px solid var(--accent);
}

.twocol-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 28px rgba(0, 0, 0, .1);
}

.twocol-img {
    position: relative;
    height: 220px;
    overflow: hidden;
}

.twocol-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s;
}

.twocol-card:hover .twocol-img img {
    transform: scale(1.06);
}

.twocol-cat {
    position: absolute;
    top: 12px;
    left: 12px;
    background: var(--accent);
    color: #fff;
    padding: 5px 12px;
    border-radius: 4px;
    font-size: 11.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.twocol-body {
    padding: 20px 22px 22px;
}

.twocol-body h3 {
    font-size: 19px;
    line-height: 1.35;
    margin: 0 0 10px;
    font-weight: 700;
    color: #0f172a;
}

.twocol-body p {
    font-size: 14px;
    line-height: 1.55;
    color: #64748b;
    margin: 0 0 14px;
}

.twocol-readmore {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--accent);
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .4px;
}

.twocol-readmore i {
    transition: transform .2s;
}

.twocol-card:hover .twocol-readmore i {
    transform: translateX(4px);
}

@media (max-width: 768px) {
    .twocol-grid {
        grid-template-columns: 1fr;
    }

    .twocol-img {
        height: 180px;
    }
}

/* ── 4) TOPIC CLUSTER ── */
.cluster {
    --cls-color: #0ea5e9;
}

.cluster-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 2px solid var(--cls-color);
}

.cluster-header h2 {
    font-size: 17px;
    font-weight: 800;
    margin: 0;
    color: #0f172a;
    text-transform: uppercase;
    letter-spacing: .6px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.cluster-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--cls-color);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--cls-color) 22%, transparent);
}

.cluster-more {
    color: var(--cls-color);
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.cluster-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 16px;
}

.cluster-hero {
    position: relative;
    display: block;
    border-radius: 14px;
    overflow: hidden;
    min-height: 360px;
    text-decoration: none;
    color: #fff;
}

.cluster-hero img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s;
}

.cluster-hero:hover img {
    transform: scale(1.05);
}

.cluster-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, .92) 0%, transparent 60%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 26px 24px;
}

.cluster-hero-overlay h3 {
    font-size: 22px;
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 8px;
    color: #fff;
}

.cluster-hero-overlay p {
    font-size: 14px;
    opacity: .92;
    margin: 0;
    line-height: 1.45;
}

.cluster-side {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cluster-item {
    display: grid;
    grid-template-columns: 90px 1fr;
    gap: 12px;
    background: #fff;
    padding: 10px;
    border-radius: 10px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
    text-decoration: none;
    color: inherit;
    border-left: 3px solid var(--cls-color);
    transition: all .2s;
}

.cluster-item:hover {
    transform: translateX(3px);
    box-shadow: 0 6px 14px rgba(0, 0, 0, .08);
}

.cluster-thumb {
    width: 90px;
    height: 70px;
    border-radius: 6px;
    overflow: hidden;
}

.cluster-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cluster-item h4 {
    font-size: 13.5px;
    line-height: 1.4;
    margin: 0;
    align-self: center;
    color: #0f172a;
    font-weight: 600;
}

@media (max-width: 900px) {
    .cluster-grid {
        grid-template-columns: 1fr;
    }

    .cluster-hero {
        min-height: 240px;
    }
}

/* ── 5) CANLI AKIŞ FEED ── */
.live-feed {
    background: #fff;
    border-radius: 14px;
    padding: 22px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .05);
    border: 1px solid #eef2f7;
}

.lfeed-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
    padding-bottom: 12px;
    border-bottom: 1px solid #f1f5f9;
}

.lfeed-header h2 {
    font-size: 17px;
    font-weight: 800;
    margin: 0;
    color: #0f172a;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-transform: uppercase;
    letter-spacing: .6px;
}

.lfeed-pulse {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #ef4444;
    position: relative;
}

.lfeed-pulse::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: #ef4444;
    animation: lfeedPulse 1.5s infinite;
}

@keyframes lfeedPulse {
    0% {
        transform: scale(1);
        opacity: .8;
    }

    100% {
        transform: scale(2.6);
        opacity: 0;
    }
}

.lfeed-sub {
    font-size: 12px;
    color: #94a3b8;
}

.lfeed-list {
    display: flex;
    flex-direction: column;
}

.lfeed-item {
    display: grid;
    grid-template-columns: 70px auto 1fr 80px;
    gap: 12px;
    align-items: center;
    padding: 14px 0;
    border-bottom: 1px dashed #e2e8f0;
    text-decoration: none;
    color: inherit;
    transition: all .15s;
}

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

.lfeed-item:hover {
    background: #f8fafc;
    padding-left: 8px;
    padding-right: 8px;
}

.lfeed-time {
    font-size: 11.5px;
    font-weight: 700;
    color: #ef4444;
    text-align: center;
    padding: 5px 8px;
    background: rgba(239, 68, 68, .08);
    border-radius: 4px;
}

.lfeed-cat {
    color: #fff;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .4px;
    white-space: nowrap;
}

.lfeed-item h3 {
    font-size: 14.5px;
    line-height: 1.45;
    margin: 0;
    color: #0f172a;
    font-weight: 600;
}

.lfeed-thumb {
    width: 80px;
    height: 56px;
    border-radius: 6px;
    overflow: hidden;
    flex-shrink: 0;
}

.lfeed-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 768px) {
    .lfeed-item {
        grid-template-columns: 60px 1fr;
        gap: 8px;
        padding: 12px 0;
    }

    .lfeed-cat {
        display: none;
    }

    .lfeed-thumb {
        display: none;
    }

    .lfeed-item h3 {
        font-size: 13.5px;
    }
}

/* ── 6) NEWSLETTER CTA PRO ── */
.nl-cta-card {
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #ec4899 100%);
    border-radius: 18px;
    padding: 36px 40px;
    color: #fff;
    display: grid;
    grid-template-columns: 80px 1fr 360px;
    gap: 24px;
    align-items: center;
    position: relative;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(99, 102, 241, .3);
}

.nl-cta-card::before {
    content: '';
    position: absolute;
    right: -60px;
    top: -60px;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, .18), transparent 70%);
}

.nl-cta-card::after {
    content: '';
    position: absolute;
    left: -40px;
    bottom: -40px;
    width: 160px;
    height: 160px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, .12), transparent 70%);
}

.nl-cta-icon {
    width: 80px;
    height: 80px;
    border-radius: 20px;
    background: rgba(255, 255, 255, .18);
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 36px;
    color: #fff;
    border: 1.5px solid rgba(255, 255, 255, .25);
    position: relative;
    z-index: 2;
}

.nl-cta-text {
    position: relative;
    z-index: 2;
}

.nl-cta-text h2 {
    font-size: 22px;
    font-weight: 800;
    margin: 0 0 6px;
    line-height: 1.25;
}

.nl-cta-text p {
    font-size: 14px;
    opacity: .92;
    margin: 0;
    line-height: 1.5;
}

.nl-cta-form {
    position: relative;
    z-index: 2;
    display: flex;
    gap: 8px;
    flex-direction: column;
}

.nl-cta-form input {
    width: 100%;
    padding: 14px 18px;
    border: none;
    border-radius: 10px;
    background: rgba(255, 255, 255, .95);
    color: #0f172a;
    font-size: 14px;
    font-weight: 500;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .1);
}

.nl-cta-form input:focus {
    outline: 2px solid #fff;
}

.nl-cta-form button {
    padding: 14px 20px;
    border: none;
    border-radius: 10px;
    background: #0f172a;
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all .2s;
    box-shadow: 0 4px 12px rgba(15, 23, 42, .3);
}

.nl-cta-form button:hover {
    background: #fff;
    color: #6366f1;
}

.nl-cta-form button:disabled {
    opacity: .7;
    cursor: wait;
}

.nl-cta-note {
    grid-column: 1 / -1;
    font-size: 11.5px;
    opacity: .8;
    margin-top: 4px;
    position: relative;
    z-index: 2;
}

.nl-cta-note a {
    color: #fff;
    text-decoration: underline;
}

@media (max-width: 900px) {
    .nl-cta-card {
        grid-template-columns: 1fr;
        gap: 18px;
        padding: 28px 24px;
        text-align: center;
    }

    .nl-cta-icon {
        margin: 0 auto;
        width: 64px;
        height: 64px;
        font-size: 28px;
    }
}



/* === MANŞET YÜKSEKLİK ARTIRIMI === */
.manset-hero-layout {
    min-height: 560px;
}

.manset-slider-wrap {
    min-height: 560px;
}

.manset-slider,
.manset-slide,
.manset-slide-img {
    height: 560px !important;
}

.manset-slide-img img {
    height: 100% !important;
    object-fit: cover;
}

.manset-sidebar-list {
    /* scroll kaldırıldı */
}

@media (max-width: 1100px) {

    .manset-hero-layout,
    .manset-slider-wrap {
        min-height: 460px;
    }

    .manset-slider,
    .manset-slide,
    .manset-slide-img {
        height: 460px !important;
    }

    .manset-sidebar-list {
        max-height: none;
    }
}

@media (max-width: 768px) {

    .manset-hero-layout,
    .manset-slider-wrap {
        min-height: 360px;
    }

    .manset-slider,
    .manset-slide,
    .manset-slide-img {
        height: 360px !important;
    }
}


/* === MANŞET YÜKSEKLİK ARTIRIMI === */
.manset-hero-layout {
    min-height: 560px;
}

.manset-slider-wrap {
    min-height: 560px;
}

.manset-slider,
.manset-slide,
.manset-slide-img {
    height: 560px !important;
}

.manset-slide-img img {
    height: 100% !important;
    width: 100%;
    object-fit: cover;
}

.manset-sidebar-list {
    /* scroll kaldırıldı */
}

@media (max-width: 1100px) {

    .manset-hero-layout,
    .manset-slider-wrap {
        min-height: 460px;
    }

    .manset-slider,
    .manset-slide,
    .manset-slide-img {
        height: 460px !important;
    }

    .manset-sidebar-list {
        max-height: none;
    }
}

@media (max-width: 768px) {

    .manset-hero-layout,
    .manset-slider-wrap {
        min-height: 360px;
    }

    .manset-slider,
    .manset-slide,
    .manset-slide-img {
        height: 360px !important;
    }
}



/* ═══════════════════════════════════════════════════════════════
   MODERN HABER DETAY SIDEBAR (Faz 2)
   ═══════════════════════════════════════════════════════════════ */

/* Sidebar genel - sticky + spacing */
@media (min-width: 1100px) {
    .modern-sidebar {
        position: sticky;
        top: 90px;
        align-self: flex-start;
    }
}

.modern-sidebar .widget {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 14px;
    margin-bottom: 18px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(15, 23, 42, .04);
    transition: box-shadow .25s ease, transform .25s ease;
}

.modern-sidebar .widget:hover {
    box-shadow: 0 6px 24px rgba(15, 23, 42, .08);
}

.modern-sidebar .widget-header {
    padding: 14px 16px 10px;
    border-bottom: 1px solid #f1f5f9;
    background: linear-gradient(180deg, #fafbfc 0%, #fff 100%);
    position: relative;
}

.modern-sidebar .widget-header::before {
    content: '';
    position: absolute;
    left: 0;
    top: 12px;
    bottom: 12px;
    width: 4px;
    background: linear-gradient(180deg, #dc2626 0%, #f87171 100%);
    border-radius: 0 3px 3px 0;
}

.modern-sidebar .widget-title,
.modern-sidebar .widget-header h3,
.modern-sidebar .widget-header h4 {
    font-size: 13px !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: .8px;
    color: #1e293b !important;
    margin: 0 !important;
    padding-left: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.modern-sidebar .widget-title i,
.modern-sidebar .widget-header h3 i {
    color: #dc2626;
    font-size: 14px;
}

.modern-sidebar .widget-body {
    padding: 14px 16px;
}

/* ─── Şu an X kişi okuyor (live readers) ─── */
.widget-live-readers {
    background: linear-gradient(135deg, #fef2f2 0%, #fff 70%) !important;
    border-color: #fecaca !important;
    padding: 0;
}

.live-readers-inner {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
}

.live-pulse {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #dc2626;
    box-shadow: 0 0 0 0 rgba(220, 38, 38, .65);
    animation: livePulseAnim 1.6s infinite;
    flex-shrink: 0;
}

@keyframes livePulseAnim {
    0% {
        box-shadow: 0 0 0 0 rgba(220, 38, 38, .65);
    }

    70% {
        box-shadow: 0 0 0 14px rgba(220, 38, 38, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(220, 38, 38, 0);
    }
}

.live-readers-text {
    flex: 1;
    line-height: 1.2;
}

.live-readers-count {
    display: block;
    font-size: 22px;
    font-weight: 900;
    color: #dc2626;
    line-height: 1;
}

.live-readers-label {
    display: block;
    font-size: 11px;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: .5px;
    margin-top: 3px;
    font-weight: 600;
}

.live-readers-icon {
    color: #dc2626;
    font-size: 22px;
    opacity: .35;
}

/* ─── İçindekiler (TOC) ─── */
.widget-toc .toc-list {
    list-style: none;
    margin: 0;
    padding: 0;
    counter-reset: toc;
}

.widget-toc .toc-list li {
    margin: 0;
    padding: 0;
    border-bottom: 1px dashed #f1f5f9;
}

.widget-toc .toc-list li:last-child {
    border-bottom: none;
}

.widget-toc .toc-list a {
    display: block;
    padding: 9px 0 9px 22px;
    color: #334155;
    font-size: 13px;
    line-height: 1.4;
    text-decoration: none;
    position: relative;
    transition: color .2s, padding-left .2s;
}

.widget-toc .toc-list a::before {
    counter-increment: toc;
    content: counter(toc);
    position: absolute;
    left: 0;
    top: 9px;
    font-size: 11px;
    font-weight: 800;
    color: #94a3b8;
    width: 16px;
    text-align: center;
}

.widget-toc .toc-list a:hover {
    color: #dc2626;
    padding-left: 26px;
}

.widget-toc .toc-list .toc-h3 a {
    padding-left: 36px;
    font-size: 12px;
    color: #64748b;
}

.widget-toc .toc-list .toc-h3 a::before {
    left: 18px;
    color: #cbd5e1;
}

.widget-toc .toc-list .toc-h3 a:hover {
    padding-left: 40px;
}

/* ─── Numbered list (popüler haberler) modernize ─── */
.modern-sidebar .numbered-list {
    padding: 0 !important;
    margin: 0 !important;
}

.modern-sidebar .numbered-item {
    padding: 12px 0 !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

.modern-sidebar .numbered-item:last-child {
    border-bottom: none !important;
    padding-bottom: 4px !important;
}

.modern-sidebar .numbered-item:first-child {
    padding-top: 4px !important;
}

.modern-sidebar .numbered-item a {
    align-items: center !important;
    gap: 12px !important;
}

.modern-sidebar .numbered-item .numbered-count {
    font-size: 26px !important;
    font-weight: 900 !important;
    background: linear-gradient(135deg, #dc2626 0%, #f87171 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    min-width: 28px;
    text-align: center;
    line-height: 1;
    flex-shrink: 0;
}

.modern-sidebar .numbered-item:nth-child(1) .numbered-count {
    background: linear-gradient(135deg, #b91c1c 0%, #ef4444 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.modern-sidebar .numbered-item:nth-child(n+4) .numbered-count {
    background: linear-gradient(135deg, #94a3b8 0%, #cbd5e1 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.modern-sidebar .numbered-item .numbered-text {
    font-size: 13px !important;
    line-height: 1.4 !important;
    color: #1e293b !important;
    font-weight: 600 !important;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.modern-sidebar .numbered-item a:hover .numbered-text {
    color: #dc2626 !important;
}

/* ─── Similar news (büyük resimli) ─── */
.modern-sidebar .widget-similar-news .widget-body {
    padding: 0 !important;
}

.modern-sidebar .widget-similar-news a {
    display: block;
    text-decoration: none;
    color: inherit;
    overflow: hidden;
    position: relative;
}

.modern-sidebar .widget-similar-news img {
    width: 100% !important;
    height: 180px !important;
    object-fit: cover;
    transition: transform .4s ease;
    display: block;
}

.modern-sidebar .widget-similar-news a:hover img {
    transform: scale(1.05);
}

.modern-sidebar .widget-similar-news .similar-news-content,
.modern-sidebar .widget-similar-news .similar-news-info {
    padding: 12px 14px 14px;
}

.modern-sidebar .widget-similar-news .similar-news-title,
.modern-sidebar .widget-similar-news h4 {
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    color: #1e293b !important;
    margin: 0 0 6px !important;
}

.modern-sidebar .widget-similar-news a:hover .similar-news-title,
.modern-sidebar .widget-similar-news a:hover h4 {
    color: #dc2626 !important;
}

.modern-sidebar .widget-similar-news .similar-news-excerpt,
.modern-sidebar .widget-similar-news p {
    font-size: 12px !important;
    color: #64748b !important;
    line-height: 1.5 !important;
    margin: 0 !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* İlgili içerikler liste (4 tip rozetli) */
.modern-sidebar .widget-similar-news ul,
.modern-sidebar .widget-similar-news .related-items-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.modern-sidebar .widget-similar-news li {
    padding: 10px 0;
    border-bottom: 1px solid #f1f5f9;
    font-size: 13px;
    line-height: 1.4;
}

.modern-sidebar .widget-similar-news li:last-child {
    border-bottom: none;
}

.modern-sidebar .widget-similar-news li a {
    color: #334155 !important;
    text-decoration: none;
    font-weight: 600;
    transition: color .2s;
}

.modern-sidebar .widget-similar-news li a:hover {
    color: #dc2626 !important;
}

/* ─── Social follow modern ─── */
.modern-sidebar .widget-social-follow .social-grid,
.modern-sidebar .widget-social-follow .social-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

.modern-sidebar .widget-social-follow a {
    display: flex !important;
    align-items: center;
    gap: 8px;
    padding: 10px 12px !important;
    border-radius: 10px !important;
    background: #f8fafc;
    color: #475569 !important;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: all .2s ease;
    border: 1px solid transparent;
}

.modern-sidebar .widget-social-follow a i {
    font-size: 16px;
}

.modern-sidebar .widget-social-follow a:hover {
    transform: translateY(-2px);
    color: #fff !important;
}

.modern-sidebar .widget-social-follow a[href*="facebook"]:hover {
    background: #1877f2;
}

.modern-sidebar .widget-social-follow a[href*="twitter"]:hover,
.modern-sidebar .widget-social-follow a[href*="x.com"]:hover {
    background: #000;
}

.modern-sidebar .widget-social-follow a[href*="instagram"]:hover {
    background: linear-gradient(135deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
}

.modern-sidebar .widget-social-follow a[href*="youtube"]:hover {
    background: #ff0000;
}

.modern-sidebar .widget-social-follow a[href*="rss"]:hover,
.modern-sidebar .widget-social-follow a[href*="feed"]:hover {
    background: #f59e0b;
}

/* ─── Reading list (Sonra Oku) modern ─── */
.modern-sidebar .widget-reading-list .empty-state,
.modern-sidebar .widget-reading-list .reading-list-empty {
    text-align: center;
    padding: 8px 0;
    color: #94a3b8;
    font-size: 12px;
    font-style: italic;
}

.modern-sidebar .widget-reading-list ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.modern-sidebar .widget-reading-list li {
    padding: 8px 0;
    border-bottom: 1px solid #f1f5f9;
    font-size: 13px;
    line-height: 1.4;
}

.modern-sidebar .widget-reading-list li:last-child {
    border-bottom: none;
}

/* ─── Poll modern ─── */
.modern-sidebar .widget-poll .poll-options {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.modern-sidebar .widget-poll .poll-option {
    padding: 10px 12px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    cursor: pointer;
    transition: all .2s;
    font-size: 13px;
    font-weight: 600;
    color: #334155;
}

.modern-sidebar .widget-poll .poll-option:hover {
    background: #fef2f2;
    border-color: #fecaca;
    color: #dc2626;
    transform: translateX(2px);
}

/* Mobile */
@media (max-width: 1099px) {
    .modern-sidebar {
        margin-top: 24px;
    }

    .modern-sidebar .widget-similar-news img {
        height: 200px !important;
    }
}

@media (max-width: 768px) {
    .modern-sidebar .widget {
        border-radius: 12px;
        margin-bottom: 14px;
    }

    .modern-sidebar .widget-social-follow .social-grid,
    .modern-sidebar .widget-social-follow .social-list {
        grid-template-columns: 1fr 1fr;
    }

    .live-readers-count {
        font-size: 20px;
    }
}



/* ═══════════════════════════════════════════════════════════════
   ANASAYFA BLOK TASARIM YENİLEME (Faz 2 — manşet hariç)
   ═══════════════════════════════════════════════════════════════ */

/* ─── TOP NEWS STRIP (üst son dakika şeridi) ─── */
.top-news-strip {
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%) !important;
    border-radius: 12px !important;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(15, 23, 42, .12);
    margin-bottom: 16px;
}

.top-news-strip a {
    transition: background .2s, padding-left .2s;
}

.top-news-strip a:hover {
    background: rgba(220, 38, 38, .15);
    padding-left: 20px !important;
}

.top-news-strip .strip-label,
.top-news-strip .top-news-label {
    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%) !important;
    box-shadow: 0 2px 8px rgba(220, 38, 38, .35);
    text-shadow: 0 1px 2px rgba(0, 0, 0, .2);
    letter-spacing: .8px;
}

/* ─── STORY BAR (yatay scroll story'leri) ─── */
.story-bar {
    background: linear-gradient(180deg, #fafbfc 0%, #fff 100%) !important;
    padding: 16px !important;
    border-radius: 14px !important;
    border: 1px solid #eef2f7;
    margin-bottom: 20px !important;
}

.story-bar .story-item,
.story-bar .story-card {
    transition: transform .25s ease;
}

.story-bar .story-item:hover,
.story-bar .story-card:hover {
    transform: translateY(-3px);
}

.story-bar .story-thumb,
.story-bar .story-image {
    border: 3px solid transparent !important;
    background: linear-gradient(135deg, #dc2626, #f87171) padding-box,
        linear-gradient(135deg, #dc2626 0%, #f59e0b 100%) border-box !important;
    box-shadow: 0 4px 12px rgba(220, 38, 38, .2);
    transition: box-shadow .25s ease;
}

.story-bar a:hover .story-thumb,
.story-bar a:hover .story-image {
    box-shadow: 0 6px 20px rgba(220, 38, 38, .35);
}

/* ─── ÖZEL HABERLER (son_haberler_sidebar) ─── */
.home-layout .news-card {
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    border: 1px solid #eef2f7;
    box-shadow: 0 2px 10px rgba(15, 23, 42, .04);
    transition: transform .3s ease, box-shadow .3s ease;
}

.home-layout .news-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(15, 23, 42, .1);
}

.home-layout .news-card-image {
    overflow: hidden;
    display: block;
    position: relative;
}

.home-layout .news-card-image img {
    transition: transform .5s ease;
    width: 100%;
    aspect-ratio: 16/10;
    object-fit: cover;
}

.home-layout .news-card:hover .news-card-image img {
    transform: scale(1.06);
}

.home-layout .news-card-cat-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: linear-gradient(135deg, #dc2626 0%, #ef4444 100%) !important;
    color: #fff !important;
    padding: 4px 10px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .5px;
    text-transform: uppercase;
    border-radius: 6px !important;
    box-shadow: 0 2px 8px rgba(220, 38, 38, .35);
}

.home-layout .news-card-body {
    padding: 14px 16px 16px !important;
}

.home-layout .news-card-body h3 {
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    color: #1e293b !important;
    margin: 0 0 8px !important;
    transition: color .2s;
}

.home-layout .news-card a:hover h3 {
    color: #dc2626 !important;
}

.home-layout .news-card-excerpt {
    font-size: 13px !important;
    color: #64748b !important;
    line-height: 1.5 !important;
    margin: 0 !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ─── ANASAYFA SIDEBAR — En Çok Okunan, Hızlı Erişim ─── */
.home-sidebar .sidebar-widget {
    background: #fff !important;
    border: 1px solid #eef2f7 !important;
    border-radius: 14px !important;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(15, 23, 42, .04);
    margin-bottom: 18px !important;
}

.home-sidebar .widget-header {
    padding: 14px 16px 10px !important;
    border-bottom: 1px solid #f1f5f9 !important;
    background: linear-gradient(180deg, #fafbfc 0%, #fff 100%) !important;
    position: relative;
}

.home-sidebar .widget-header::before {
    content: '';
    position: absolute;
    left: 0;
    top: 12px;
    bottom: 12px;
    width: 4px;
    background: linear-gradient(180deg, #dc2626, #f87171);
    border-radius: 0 3px 3px 0;
}

.home-sidebar .widget-header h3 {
    font-size: 13px !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: .8px;
    color: #1e293b !important;
    margin: 0 !important;
    padding-left: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.home-sidebar .widget-header h3 i {
    color: #dc2626;
}

.home-sidebar .popular-list {
    padding: 10px 16px;
}

.home-sidebar .popular-item {
    display: flex !important;
    align-items: center;
    gap: 12px;
    padding: 11px 0 !important;
    border-bottom: 1px solid #f1f5f9 !important;
    text-decoration: none;
    transition: padding-left .2s ease;
}

.home-sidebar .popular-item:last-child {
    border-bottom: none !important;
    padding-bottom: 4px !important;
}

.home-sidebar .popular-item:hover {
    padding-left: 4px !important;
}

.home-sidebar .popular-rank {
    font-size: 24px !important;
    font-weight: 900 !important;
    background: linear-gradient(135deg, #dc2626 0%, #f87171 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    min-width: 26px;
    text-align: center;
    line-height: 1;
    flex-shrink: 0;
}

.home-sidebar .popular-item:nth-child(n+4) .popular-rank {
    background: linear-gradient(135deg, #94a3b8 0%, #cbd5e1 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.home-sidebar .popular-content h4 {
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    color: #1e293b !important;
    margin: 0 0 2px !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.home-sidebar .popular-item:hover .popular-content h4 {
    color: #dc2626 !important;
}

.home-sidebar .popular-cat {
    font-size: 11px !important;
    color: #94a3b8 !important;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .4px;
}

/* Hızlı Erişim service grid */
.home-sidebar .sidebar-services .service-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
    padding: 14px 16px !important;
}

.home-sidebar .service-btn {
    display: flex !important;
    align-items: center;
    gap: 8px;
    padding: 10px 12px !important;
    border-radius: 10px !important;
    background: #f8fafc !important;
    color: #475569 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-decoration: none;
    transition: all .2s ease;
    border: 1px solid transparent !important;
}

.home-sidebar .service-btn:hover {
    background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%) !important;
    color: #dc2626 !important;
    border-color: #fecaca !important;
    transform: translateY(-2px);
}

.home-sidebar .service-btn i {
    font-size: 14px;
}

/* ─── FOTO GALERİ slider ─── */
.foto-galeri-section {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%) !important;
    padding: 28px 0 !important;
    border-radius: 14px;
    margin-bottom: 24px;
}

.foto-galeri-section .section-header-light h2 {
    color: #fff !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    letter-spacing: .5px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.foto-galeri-section .section-header-light h2 i {
    color: #f59e0b;
    background: rgba(245, 158, 11, .15);
    padding: 8px;
    border-radius: 8px;
}

.foto-galeri-section .section-more-light {
    color: #f59e0b !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: .5px;
    text-transform: uppercase;
    transition: color .2s;
}

.foto-galeri-section .section-more-light:hover {
    color: #fbbf24 !important;
}

.foto-galeri-card {
    border-radius: 12px !important;
    overflow: hidden;
    position: relative;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .3);
    transition: transform .3s ease;
}

.foto-galeri-card:hover {
    transform: translateY(-4px);
}

.foto-galeri-card img {
    transition: transform .5s ease;
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
}

.foto-galeri-card:hover img {
    transform: scale(1.08);
}

.foto-galeri-overlay {
    position: absolute !important;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, .85) 0%, rgba(0, 0, 0, 0) 50%) !important;
    display: flex;
    align-items: flex-end;
    padding: 14px !important;
}

.foto-galeri-overlay h4 {
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    text-shadow: 0 2px 6px rgba(0, 0, 0, .6);
}

.foto-nav {
    background: rgba(255, 255, 255, .15) !important;
    backdrop-filter: blur(8px);
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, .2) !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    transition: background .2s ease, transform .2s ease;
}

.foto-nav:hover {
    background: linear-gradient(135deg, #dc2626, #f87171) !important;
    border-color: transparent !important;
    transform: scale(1.1);
}

/* ─── VİDEO GALERİ ─── */
.video-galeri-section {
    background: linear-gradient(135deg, #1e1b4b 0%, #312e81 100%) !important;
    padding: 28px 0 !important;
    border-radius: 14px;
    margin-bottom: 24px;
}

.video-galeri-section .section-header-light h2 {
    color: #fff !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    display: flex;
    align-items: center;
    gap: 10px;
}

.video-galeri-section .section-header-light h2 i {
    color: #ef4444;
    background: rgba(239, 68, 68, .2);
    padding: 8px;
    border-radius: 8px;
}

.video-galeri-section .section-more-light {
    color: #c7d2fe !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.video-galeri-section .section-more-light:hover {
    color: #fff !important;
}

.video-galeri-section .video-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important;
    gap: 16px !important;
    margin-top: 16px;
}

.video-galeri-section .video-card {
    border-radius: 12px !important;
    overflow: hidden;
    background: rgba(255, 255, 255, .04);
    text-decoration: none !important;
    transition: transform .3s ease;
}

.video-galeri-section .video-card:hover {
    transform: translateY(-4px);
}

.video-galeri-section .video-thumb {
    position: relative !important;
    overflow: hidden;
    aspect-ratio: 16/9;
}

.video-galeri-section .video-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform .5s ease, filter .3s;
    filter: brightness(.85);
}

.video-galeri-section .video-card:hover .video-thumb img {
    transform: scale(1.08);
    filter: brightness(1);
}

.video-galeri-section .play-icon {
    position: absolute !important;
    inset: 0;
    display: flex !important;
    align-items: center;
    justify-content: center;
    color: #fff !important;
    font-size: 28px !important;
    background: rgba(0, 0, 0, .25);
    transition: background .25s ease;
}

.video-galeri-section .play-icon i {
    background: linear-gradient(135deg, #dc2626 0%, #ef4444 100%) !important;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 20px rgba(220, 38, 38, .5);
    padding-left: 4px;
    transition: transform .25s ease;
}

.video-galeri-section .video-card:hover .play-icon i {
    transform: scale(1.15);
}

.video-galeri-section .video-card h4 {
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    padding: 12px 14px !important;
    margin: 0 !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ─── KÖŞE YAZARLARI (yazar-card) ─── */
.yazar-card {
    background: #fff !important;
    border: 1px solid #eef2f7 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    text-align: center !important;
    padding: 18px 14px !important;
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s !important;
    text-decoration: none !important;
}

.yazar-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .12) !important;
    border-color: #fecaca !important;
}

.yazar-avatar,
.yazar-avatar-placeholder {
    width: 84px !important;
    height: 84px !important;
    margin: 0 auto 12px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    border: 3px solid transparent !important;
    background: linear-gradient(#fff, #fff) padding-box,
        linear-gradient(135deg, #dc2626, #f59e0b) border-box !important;
    box-shadow: 0 4px 14px rgba(220, 38, 38, .2) !important;
    transition: transform .3s ease;
}

.yazar-card:hover .yazar-avatar,
.yazar-card:hover .yazar-avatar-placeholder {
    transform: scale(1.06);
}

.yazar-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50%;
}

.yazar-avatar-placeholder {
    display: flex !important;
    align-items: center;
    justify-content: center;
    color: #94a3b8 !important;
    font-size: 30px !important;
    background: #f8fafc !important;
}

.yazar-info {
    padding: 0 !important;
}

.yazar-info h4 {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #1e293b !important;
    margin: 0 0 6px !important;
    transition: color .2s;
}

.yazar-card:hover .yazar-info h4 {
    color: #dc2626 !important;
}

.yazar-title {
    font-size: 12px !important;
    color: #64748b !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ─── Genel section header (block-section) ─── */
.block-section .section-header,
.foto-galeri-section .section-header,
.video-galeri-section .section-header,
.home-layout .section-header,
.section-block .section-header {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    padding: 0 0 14px !important;
    margin-bottom: 16px !important;
    border-bottom: 2px solid #f1f5f9;
    position: relative;
}

.block-section .section-header h2,
.section-block .section-header h2 {
    font-size: 18px !important;
    font-weight: 800 !important;
    color: #1e293b !important;
    margin: 0 !important;
    padding-left: 14px;
    text-transform: uppercase;
    letter-spacing: .5px;
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
}

.block-section .section-header h2::before,
.section-block .section-header h2::before {
    content: '';
    position: absolute;
    left: 0;
    top: 4px;
    bottom: 4px;
    width: 4px;
    background: linear-gradient(180deg, #dc2626, #f87171);
    border-radius: 3px;
}

.block-section .section-header h2 i,
.section-block .section-header h2 i {
    color: #dc2626;
    font-size: 16px;
}

.block-section .section-more,
.section-block .section-more {
    font-size: 12px !important;
    font-weight: 800 !important;
    color: #dc2626 !important;
    text-transform: uppercase;
    letter-spacing: .5px;
    text-decoration: none !important;
    padding: 6px 12px;
    border-radius: 6px;
    transition: background .2s;
}

.block-section .section-more:hover,
.section-block .section-more:hover {
    background: #fef2f2 !important;
}

/* ─── Reklam alanı sidebar widget'ı (yeni) ─── */
.modern-sidebar .widget-ad-sidebar {
    padding: 0;
    background: transparent !important;
    border: 1px dashed #e2e8f0 !important;
    box-shadow: none !important;
}

.modern-sidebar .widget-ad-sidebar:hover {
    box-shadow: 0 4px 12px rgba(15, 23, 42, .06) !important;
}

.modern-sidebar .widget-ad-sidebar .ad-space {
    padding: 8px;
    text-align: center;
}

.modern-sidebar .widget-ad-sidebar .ad-space::before {
    content: 'REKLAM';
    display: block;
    font-size: 9px;
    color: #94a3b8;
    letter-spacing: 1.5px;
    margin-bottom: 6px;
    font-weight: 700;
}

/* ─── Mobile genel ─── */
@media (max-width: 768px) {
    .home-sidebar .sidebar-services .service-grid {
        grid-template-columns: 1fr 1fr !important;
    }

    .video-galeri-section .video-grid {
        grid-template-columns: 1fr 1fr !important;
    }

    .yazar-avatar,
    .yazar-avatar-placeholder {
        width: 72px !important;
        height: 72px !important;
    }

    .block-section .section-header h2,
    .section-block .section-header h2 {
        font-size: 16px !important;
    }
}


/* ═══════════════════════════════════════════════════════════════════
   PHASE E — GELİŞMİŞ HABER BLOKLARI (mega_grid, breaking_ticker_pro,
   dual_hero_split, timeline_today, category_carousel_pro, magazine_overlap)
═══════════════════════════════════════════════════════════════════ */

/* ── 7) MEGA HABER GRID ── */
.mega-grid {
    margin: 32px 0;
}

.mega-grid-header {
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 3px solid var(--mg-accent, #ef4444);
}

.mega-grid-header h2 {
    font-size: 1.35rem;
    font-weight: 800;
    color: #1e293b;
    letter-spacing: .5px;
    margin: 0;
}

.mega-grid-header h2 i {
    color: var(--mg-accent, #ef4444);
    margin-right: 8px;
}

.mega-grid-wrap {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    grid-template-rows: 220px 220px;
    gap: 16px;
}

.mg-big {
    grid-row: 1 / 3;
    grid-column: 1;
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none;
    box-shadow: 0 8px 28px rgba(0, 0, 0, .18);
    transition: transform .25s;
}

.mg-big:hover {
    transform: translateY(-4px);
}

.mg-big img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s;
}

.mg-big:hover img {
    transform: scale(1.05);
}

.mg-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, .92) 0%, rgba(0, 0, 0, .55) 50%, transparent 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 22px;
    color: #fff;
}

.mg-cat {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    color: #fff;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .5px;
    text-transform: uppercase;
    align-self: flex-start;
    margin-bottom: 10px;
}

.mg-big .mg-overlay h3 {
    font-size: 1.55rem;
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 10px;
    color: #fff;
}

.mg-big .mg-overlay p {
    font-size: .92rem;
    line-height: 1.5;
    margin: 0 0 10px;
    color: rgba(255, 255, 255, .88);
}

.mg-meta {
    font-size: .78rem;
    color: rgba(255, 255, 255, .7);
}

.mg-mid {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    text-decoration: none;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .12);
    transition: transform .25s;
}

.mg-mid:hover {
    transform: translateY(-3px);
}

.mg-mid img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s;
}

.mg-mid:hover img {
    transform: scale(1.06);
}

.mg-mid .mg-overlay {
    padding: 14px;
}

.mg-mid .mg-overlay h4 {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
    margin: 0;
    color: #fff;
}

.mg-sm {
    display: flex;
    gap: 10px;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    text-decoration: none;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .08);
    transition: transform .2s, box-shadow .2s;
    padding: 8px;
    align-items: center;
}

.mg-sm:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, .12);
}

.mg-sm-img {
    width: 90px;
    height: 70px;
    flex-shrink: 0;
    border-radius: 8px;
    overflow: hidden;
}

.mg-sm-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mg-sm-body {
    flex: 1;
    min-width: 0;
}

.mg-sm-cat {
    display: block;
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .4px;
    margin-bottom: 4px;
}

.mg-sm-body h5 {
    font-size: .85rem;
    font-weight: 700;
    line-height: 1.35;
    color: #1e293b;
    margin: 0;
}

@media (max-width: 900px) {
    .mega-grid-wrap {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 240px 180px auto auto;
    }

    .mg-big {
        grid-column: 1 / 3;
        grid-row: 1;
    }

    .mg-mid {
        grid-row: 2;
    }

    .mg-sm {
        grid-column: 1 / 3;
    }
}

@media (max-width: 600px) {
    .mega-grid-wrap {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

    .mg-big,
    .mg-mid,
    .mg-sm {
        grid-column: 1;
        grid-row: auto;
    }

    .mg-big,
    .mg-mid {
        height: 220px;
    }
}

/* ── 8) BREAKING TICKER PRO ── */
.bt-pro {
    margin: 24px 0;
}

.bt-pro-wrap {
    display: flex;
    align-items: stretch;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .08);
    overflow: hidden;
    border: 1px solid #fee2e2;
}

.bt-pro-label {
    background: linear-gradient(135deg, #dc2626, #ef4444);
    color: #fff;
    padding: 14px 22px;
    font-weight: 800;
    font-size: .95rem;
    letter-spacing: .8px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    position: relative;
}

.bt-pro-label::after {
    content: '';
    position: absolute;
    right: -10px;
    top: 0;
    bottom: 0;
    width: 20px;
    background: linear-gradient(135deg, #dc2626, #ef4444);
    clip-path: polygon(0 0, 50% 50%, 0 100%);
}

.bt-pro-label i {
    animation: btPulse 1.2s ease-in-out infinite;
}

@keyframes btPulse {

    0%,
    100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.25);
        opacity: .7;
    }
}

.bt-pro-track {
    flex: 1;
    overflow: hidden;
    position: relative;
    padding-left: 18px;
    display: flex;
    align-items: center;
}

.bt-pro-marquee {
    display: inline-flex;
    gap: 32px;
    white-space: nowrap;
    animation: btMarquee 60s linear infinite;
    padding-right: 32px;
}

.bt-pro-track:hover .bt-pro-marquee {
    animation-play-state: paused;
}

@keyframes btMarquee {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

.bt-pro-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    color: #1e293b;
    padding: 14px 0;
    font-weight: 500;
    transition: color .2s;
}

.bt-pro-item:hover {
    color: #dc2626;
}

.bt-pro-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.bt-pro-cat {
    font-size: .72rem;
    font-weight: 800;
    color: #ef4444;
    text-transform: uppercase;
    letter-spacing: .5px;
    padding: 2px 8px;
    border: 1px solid #fecaca;
    border-radius: 4px;
}

.bt-pro-title {
    font-size: .92rem;
}

@media (max-width: 600px) {
    .bt-pro-label {
        padding: 12px 14px;
        font-size: .85rem;
    }

    .bt-pro-cat {
        display: none;
    }
}

/* ── 9) DUAL HERO SPLIT ── */
.dh-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin: 32px 0;
}

.dh-card {
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none;
    min-height: 380px;
    box-shadow: 0 8px 28px rgba(0, 0, 0, .15);
    transition: transform .3s, box-shadow .3s;
    display: block;
}

.dh-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 14px 36px rgba(0, 0, 0, .22);
}

.dh-img {
    position: absolute;
    inset: 0;
}

.dh-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s;
}

.dh-card:hover .dh-img img {
    transform: scale(1.06);
}

.dh-body {
    position: relative;
    z-index: 2;
    height: 100%;
    min-height: 380px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 26px;
    color: #fff;
    background: linear-gradient(to top, rgba(0, 0, 0, .92) 0%, rgba(0, 0, 0, .6) 50%, transparent 100%);
}

.dh-cat {
    display: inline-block;
    padding: 5px 14px;
    border-radius: 20px;
    color: #fff;
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .6px;
    text-transform: uppercase;
    align-self: flex-start;
    margin-bottom: 12px;
}

.dh-card h2 {
    font-size: 1.45rem;
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 10px;
    color: #fff;
}

.dh-card p {
    font-size: .92rem;
    line-height: 1.5;
    margin: 0 0 12px;
    color: rgba(255, 255, 255, .88);
}

.dh-meta {
    font-size: .8rem;
    color: rgba(255, 255, 255, .75);
    display: flex;
    align-items: center;
    gap: 12px;
}

.dh-meta i {
    margin-right: 4px;
}

@media (max-width: 800px) {
    .dh-split {
        grid-template-columns: 1fr;
    }

    .dh-card {
        min-height: 320px;
    }

    .dh-body {
        min-height: 320px;
    }

    .dh-card h2 {
        font-size: 1.2rem;
    }
}

/* ── 10) TIMELINE TODAY ── */
.tl-today {
    margin: 32px 0;
    background: #f8fafc;
    border-radius: 14px;
    padding: 24px;
}

.tl-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 14px;
    border-bottom: 2px solid #e2e8f0;
}

.tl-header h2 {
    font-size: 1.25rem;
    font-weight: 800;
    color: #1e293b;
    margin: 0;
}

.tl-header h2 i {
    color: #6366f1;
    margin-right: 8px;
}

.tl-date {
    font-size: .85rem;
    color: #64748b;
    font-weight: 600;
    padding: 6px 14px;
    background: #fff;
    border-radius: 20px;
}

.tl-wrap {
    position: relative;
    padding-left: 70px;
}

.tl-wrap::before {
    content: '';
    position: absolute;
    left: 60px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: linear-gradient(to bottom, #6366f1 0%, #c7d2fe 100%);
}

.tl-item {
    position: relative;
    margin-bottom: 18px;
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.tl-item:last-child {
    margin-bottom: 0;
}

.tl-time {
    position: absolute;
    left: -70px;
    top: 8px;
    width: 50px;
    text-align: right;
    font-size: .78rem;
    font-weight: 800;
    color: #6366f1;
    font-variant-numeric: tabular-nums;
}

.tl-bullet {
    position: absolute;
    left: -16px;
    top: 14px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #6366f1;
    border: 3px solid #fff;
    box-shadow: 0 0 0 2px #6366f1;
    z-index: 2;
}

.tl-content {
    display: flex;
    gap: 14px;
    background: #fff;
    padding: 12px;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .06);
    flex: 1;
    text-decoration: none;
    transition: transform .2s, box-shadow .2s;
}

.tl-content:hover {
    transform: translateX(4px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, .1);
}

.tl-thumb {
    width: 80px;
    height: 60px;
    flex-shrink: 0;
    border-radius: 8px;
    overflow: hidden;
}

.tl-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tl-text {
    flex: 1;
    min-width: 0;
}

.tl-cat {
    display: inline-block;
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .4px;
    padding: 2px 8px;
    border: 1px solid;
    border-radius: 4px;
    margin-bottom: 6px;
}

.tl-text h4 {
    font-size: .95rem;
    font-weight: 700;
    line-height: 1.35;
    color: #1e293b;
    margin: 0;
}

@media (max-width: 600px) {
    .tl-wrap {
        padding-left: 56px;
    }

    .tl-wrap::before {
        left: 46px;
    }

    .tl-time {
        left: -56px;
        width: 40px;
        font-size: .72rem;
    }

    .tl-thumb {
        width: 60px;
        height: 50px;
    }
}

/* ── 11) CATEGORY CAROUSEL PRO ── */
.ccp-block {
    margin: 32px 0;
}

.ccp-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 3px solid #6366f1;
}

.ccp-header h2 {
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: .5px;
    margin: 0;
}

.ccp-header h2 i {
    margin-right: 8px;
}

.ccp-nav {
    display: flex;
    gap: 8px;
    align-items: center;
}

.ccp-prev,
.ccp-next {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #fff;
    border: 1.5px solid #e2e8f0;
    color: #1e293b;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all .2s;
}

.ccp-prev:hover,
.ccp-next:hover {
    background: #6366f1;
    color: #fff;
    border-color: #6366f1;
    transform: scale(1.05);
}

.ccp-all {
    font-size: .85rem;
    font-weight: 700;
    color: #6366f1;
    text-decoration: none;
    padding: 6px 14px;
    border-radius: 20px;
    background: rgba(99, 102, 241, .1);
    transition: all .2s;
}

.ccp-all:hover {
    background: #6366f1;
    color: #fff;
}

.ccp-track {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding: 4px 4px 12px;
}

.ccp-track::-webkit-scrollbar {
    height: 6px;
}

.ccp-track::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 3px;
}

.ccp-track::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 3px;
}

.ccp-card {
    flex: 0 0 280px;
    scroll-snap-align: start;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .08);
    text-decoration: none;
    transition: transform .25s, box-shadow .25s;
    display: block;
}

.ccp-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .14);
}

.ccp-img {
    height: 170px;
    overflow: hidden;
}

.ccp-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s;
}

.ccp-card:hover .ccp-img img {
    transform: scale(1.07);
}

.ccp-body {
    padding: 14px 16px 18px;
}

.ccp-time {
    font-size: .72rem;
    color: #64748b;
    font-weight: 600;
    margin-bottom: 6px;
    display: block;
}

.ccp-card h3 {
    font-size: .98rem;
    font-weight: 700;
    line-height: 1.35;
    color: #1e293b;
    margin: 0;
}

@media (max-width: 600px) {
    .ccp-card {
        flex: 0 0 240px;
    }

    .ccp-img {
        height: 140px;
    }

    .ccp-all {
        display: none;
    }
}

/* ── 12) MAGAZINE OVERLAP ── */
.mag-overlap {
    margin: 32px 0;
}

.mag-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 24px;
    align-items: stretch;
}

.mag-hero {
    position: relative;
    min-height: 480px;
    border-radius: 16px;
    overflow: hidden;
    text-decoration: none;
    box-shadow: 0 12px 36px rgba(0, 0, 0, .18);
}

.mag-hero-img {
    position: absolute;
    inset: 0;
}

.mag-hero-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s;
}

.mag-hero:hover .mag-hero-img img {
    transform: scale(1.06);
}

.mag-hero-tag {
    position: absolute;
    top: 18px;
    left: 18px;
    background: linear-gradient(135deg, #f59e0b, #ef4444);
    color: #fff;
    padding: 8px 16px;
    border-radius: 30px;
    font-weight: 800;
    font-size: .78rem;
    letter-spacing: .8px;
    box-shadow: 0 4px 14px rgba(239, 68, 68, .4);
    z-index: 3;
}

.mag-hero-tag i {
    margin-right: 6px;
}

.mag-hero-card {
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 24px;
    background: rgba(255, 255, 255, .97);
    backdrop-filter: blur(10px);
    padding: 22px 24px;
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .2);
    z-index: 2;
}

.mag-hero-cat {
    font-size: .75rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .6px;
}

.mag-hero-card h2 {
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1.25;
    margin: 8px 0 10px;
    color: #1e293b;
}

.mag-hero-card p {
    font-size: .92rem;
    line-height: 1.5;
    color: #475569;
    margin: 0 0 12px;
}

.mag-hero-author {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px solid #e2e8f0;
    font-size: .8rem;
    color: #64748b;
}

.mag-hero-author img {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
}

.mag-author-ph {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #e2e8f0;
    color: #94a3b8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .85rem;
}

.mag-side {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.mag-side-item {
    display: flex;
    gap: 12px;
    background: #fff;
    padding: 12px;
    border-radius: 12px;
    box-shadow: 0 3px 12px rgba(0, 0, 0, .06);
    text-decoration: none;
    transition: transform .2s, box-shadow .2s;
    flex: 1;
    align-items: center;
}

.mag-side-item:hover {
    transform: translateX(4px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, .12);
}

.mag-side-img {
    width: 100px;
    height: 80px;
    flex-shrink: 0;
    border-radius: 8px;
    overflow: hidden;
}

.mag-side-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mag-side-body {
    flex: 1;
    min-width: 0;
}

.mag-side-cat {
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .4px;
}

.mag-side-body h4 {
    font-size: .92rem;
    font-weight: 700;
    line-height: 1.35;
    color: #1e293b;
    margin: 4px 0;
}

.mag-side-time {
    font-size: .72rem;
    color: #94a3b8;
}

@media (max-width: 900px) {
    .mag-grid {
        grid-template-columns: 1fr;
    }

    .mag-hero {
        min-height: 380px;
    }

    .mag-hero-card h2 {
        font-size: 1.2rem;
    }
}

/* === Top News Strip — hover devre dışı (kullanıcı isteği) === */
.top-news-strip .strip-card,
.strip-card {
    transition: none !important;
}

.top-news-strip .strip-card:hover,
.strip-card:hover {
    transform: none !important;
    box-shadow: none !important;
}

.top-news-strip .strip-card:hover .strip-card-img img,
.strip-card:hover .strip-card-img img {
    transform: none !important;
}

.top-news-strip .strip-card:hover h3,
.strip-card:hover h3 {
    color: inherit !important;
}

/* ════════════════════════════════════════════════════════
   PHASE F: Anasayfa kart hover sönümlemesi
   - Karartma overlay kaldırıldı
   - Kalkma/zoom efektleri kapatıldı
   - Görsel sade kalır, sadece imleç değişir
   ════════════════════════════════════════════════════════ */
.news-card:hover,
.featured-card-big:hover,
.cluster-hero:hover,
.cluster-item:hover,
.mg-big:hover,
.mg-mid:hover,
.mg-sm:hover,
.dh-card:hover,
.tl-content:hover,
.ccp-card:hover,
.mag-hero:hover,
.mag-side-item:hover,
.cat-list-link:hover,
.lfeed-item:hover,
.twocol-card:hover,
.ntop-item:hover,
.popular-item:hover,
.story-item:hover,
.editor-pick-card:hover,
.carousel-card:hover,
.gunun-item:hover,
.bt-pro-item:hover,
.foto-galeri-card:hover,
.video-card:hover,
.spor-numbered-item:hover,
.related-card:hover,
.widget-news-item:hover,
.cat-grid-item:hover,
.cat-sidebar-item:hover,
.manset-list-item:hover,
.buyuk-manset-card-sm:hover,
.buyuk-manset-card-big:hover,
.popular-card:hover,
.five-headline-card:hover,
.manset-2-card:hover,
.manset-3-card:hover,
.manset-5-card:hover,
.cat-split-item:hover,
.cat-compact-item:hover,
.cat-mag-img:hover {
    transform: none !important;
    box-shadow: none !important;
    filter: none !important;
}

.news-card:hover img,
.featured-card-big:hover img,
.cluster-hero:hover img,
.cluster-item:hover img,
.mg-big:hover img,
.mg-mid:hover img,
.mg-sm:hover img,
.dh-card:hover .dh-img img,
.mag-hero:hover img,
.foto-galeri-card:hover img,
.video-card:hover img,
.bt-pro-item:hover img,
.ccp-card:hover img,
.tl-content:hover img,
.related-card:hover img,
.cat-grid-item:hover img,
.story-item:hover img,
.editor-pick-card:hover img,
.carousel-card:hover img {
    transform: none !important;
    filter: none !important;
}

/* Hover-ile beliren karartma katmanlarını kapat */
.news-card:hover .news-card-image::after,
.cluster-hero:hover .cluster-hero-overlay::before,
.mg-big:hover .mg-overlay::before,
.featured-card-big:hover .featured-card-overlay::before,
.dh-card:hover .dh-body::before {
    opacity: 0 !important;
    background: transparent !important;
}

/* Üst hizadaki butonlar/ikonlar hareket etmesin */
.cluster-hero:hover .cluster-hero-overlay,
.mg-big:hover .mg-overlay,
.featured-card-big:hover .featured-card-overlay {
    transform: none !important;
}

/* Phase F end */

/* ════════════════════════════════════════════════════════
   PHASE F: EnsonHaber tarzı yeni bloklar
   esh_hero_split, gozden_kacmasin, yazarlar_pro, double_column_list
   ════════════════════════════════════════════════════════ */

/* ── ESH Hero Split ── */
.esh-hero {
    margin: 28px 0;
}

.esh-hero-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 18px;
}

.esh-hero-big {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    min-height: 460px;
    display: block;
    text-decoration: none;
    box-shadow: 0 6px 24px rgba(0, 0, 0, .15);
}

.esh-hero-big img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    inset: 0;
}

.esh-hero-overlay {
    position: absolute;
    inset: 0;
    padding: 24px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background: linear-gradient(180deg, transparent 40%, rgba(0, 0, 0, .85) 100%);
    color: #fff;
}

.esh-hero-cat {
    display: inline-block;
    align-self: flex-start;
    background: var(--esh-color, #dc2626);
    color: #fff;
    padding: 4px 12px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .8px;
    border-radius: 3px;
    margin-bottom: 10px;
}

.esh-hero-overlay h2 {
    font-size: 26px;
    font-weight: 800;
    line-height: 1.22;
    margin: 0 0 10px;
    color: #fff;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .4);
}

.esh-hero-overlay p {
    font-size: 14px;
    line-height: 1.5;
    opacity: .92;
    margin: 0;
}

.esh-hero-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
}

.esh-hero-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    text-decoration: none;
    color: inherit;
    border-bottom: 1px solid #f1f5f9;
    transition: background .15s;
}

.esh-hero-item:last-child {
    border-bottom: none;
}

.esh-hero-item:hover {
    background: #f8fafc;
}

.esh-hero-num {
    background: var(--esh-color, #dc2626);
    color: #fff;
    min-width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 800;
    flex-shrink: 0;
}

.esh-hero-item-cat {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .5px;
    text-transform: uppercase;
    display: block;
    margin-bottom: 3px;
}

.esh-hero-item-body h4 {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
    color: #1e293b;
}

@media (max-width: 800px) {
    .esh-hero-grid {
        grid-template-columns: 1fr;
    }

    .esh-hero-big {
        min-height: 280px;
    }

    .esh-hero-overlay h2 {
        font-size: 18px;
    }
}

/* ── Gözden Kaçmasın ── */
.gozden {
    margin: 28px 0;
}

.gozden-header {
    padding: 0 0 14px;
    border-bottom: 3px solid #1e293b;
    margin-bottom: 18px;
    display: flex;
    align-items: center;
}

.gozden-header h2 {
    font-size: 18px;
    font-weight: 800;
    color: #1e293b;
    margin: 0;
    letter-spacing: .5px;
}

.gozden-header h2 i {
    color: #dc2626;
    margin-right: 6px;
}

.gozden-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.gozden-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .06);
    border: 1px solid #f1f5f9;
    text-decoration: none;
    color: inherit;
    transition: box-shadow .2s;
}

.gozden-card:hover {
    box-shadow: 0 4px 18px rgba(0, 0, 0, .1);
}

.gozden-thumb {
    position: relative;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #f1f5f9;
}

.gozden-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gozden-body {
    padding: 12px 14px 14px;
}

.gozden-cat {
    display: inline-block;
    color: #fff;
    padding: 3px 8px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .5px;
    border-radius: 3px;
    margin-bottom: 6px;
    text-transform: uppercase;
}

.gozden-body h3 {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    margin: 0;
    color: #1e293b;
}

@media (max-width: 800px) {
    .gozden-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .gozden-grid {
        grid-template-columns: 1fr;
    }
}

/* ── Yazarlar Pro Strip ── */
.yazarlar-pro {
    margin: 28px 0;
}

.yazarlar-pro-header {
    padding: 0 0 14px;
    border-bottom: 3px solid #6366f1;
    margin-bottom: 18px;
}

.yazarlar-pro-header h2 {
    font-size: 18px;
    font-weight: 800;
    color: #1e293b;
    margin: 0;
}

.yazarlar-pro-header h2 i {
    color: #6366f1;
    margin-right: 6px;
}

.yazarlar-pro-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 14px;
}

.yazar-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 18px 12px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    text-decoration: none;
    color: inherit;
    position: relative;
    transition: border-color .2s;
}

.yazar-card:hover {
    border-color: #6366f1;
}

.yazar-num {
    position: absolute;
    top: 8px;
    left: 10px;
    background: #f1f5f9;
    color: #64748b;
    min-width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
}

.yazar-avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    overflow: hidden;
    background: #e2e8f0;
    margin-bottom: 10px;
    border: 3px solid #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .1);
}

.yazar-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.yazar-avatar-fallback {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    color: #fff;
    font-size: 24px;
    font-weight: 800;
}

.yazar-name {
    font-size: 13px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 6px;
}

.yazar-last {
    font-size: 11.5px;
    color: #64748b;
    line-height: 1.4;
}

/* ── Double Column List ── */
.dcl {
    margin: 28px 0;
}

.dcl-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.dcl-col {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px 18px;
}

.dcl-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 10px;
    border-bottom: 3px solid var(--dcl-color, #dc2626);
    margin-bottom: 12px;
}

.dcl-header h3 {
    font-size: 15px;
    font-weight: 800;
    color: var(--dcl-color, #dc2626);
    margin: 0;
    letter-spacing: .5px;
}

.dcl-more {
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
    text-decoration: none;
}

.dcl-more:hover {
    color: var(--dcl-color, #dc2626);
}

.dcl-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 8px 0;
    text-decoration: none;
    color: inherit;
    border-bottom: 1px dashed #f1f5f9;
}

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

.dcl-item h4 {
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.4;
    margin: 0;
    color: #1e293b;
    flex: 1;
}

.dcl-item:hover h4 {
    color: var(--dcl-color, #dc2626);
}

.dcl-bullet {
    color: var(--dcl-color, #dc2626);
    font-weight: 800;
    font-size: 16px;
    line-height: 1;
    padding-top: 2px;
}

.dcl-item-first {
    flex-direction: column;
    padding-bottom: 14px;
    margin-bottom: 6px;
}

.dcl-item-first .dcl-thumb {
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 10px;
}

.dcl-item-first .dcl-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dcl-item-first h4 {
    font-size: 16px;
    font-weight: 800;
    line-height: 1.3;
}

@media (max-width: 800px) {
    .dcl-grid {
        grid-template-columns: 1fr;
    }
}

/* Phase F EnsonHaber blocks end */

/* ════════════════════════════════════════════════════════
   PHASE G: Yerel gazete tarzı bloklar
   gecen_yil_bugun, sehir_haberleri, saatli_son_dakika, roportaj_vitrin
   ════════════════════════════════════════════════════════ */

/* ── Geçen Yıl Bugün ── */
.gyb {
    margin: 28px 0;
    background: linear-gradient(135deg, #fff7ed 0%, #fef3c7 100%);
    border-radius: 12px;
    padding: 18px 20px;
    border-left: 4px solid #d97706;
}

.gyb-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 1px dashed #d97706;
}

.gyb-header h2 {
    font-size: 16px;
    font-weight: 800;
    color: #7c2d12;
    margin: 0;
    letter-spacing: .5px;
}

.gyb-header h2 i {
    color: #d97706;
    margin-right: 6px;
}

.gyb-date {
    font-size: 12px;
    font-weight: 700;
    color: #92400e;
    background: #fef3c7;
    padding: 4px 10px;
    border-radius: 12px;
    border: 1px solid #fde68a;
}

.gyb-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.gyb-item {
    display: flex;
    gap: 14px;
    text-decoration: none;
    color: inherit;
    background: #fff;
    border-radius: 10px;
    padding: 10px;
    transition: box-shadow .15s;
}

.gyb-item:hover {
    box-shadow: 0 2px 10px rgba(217, 119, 6, .18);
}

.gyb-thumb {
    position: relative;
    width: 90px;
    height: 64px;
    flex-shrink: 0;
    border-radius: 8px;
    overflow: hidden;
    background: #fef3c7;
}

.gyb-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gyb-tag {
    position: absolute;
    top: 4px;
    left: 4px;
    background: rgba(124, 45, 18, .92);
    color: #fef3c7;
    font-size: 8px;
    font-weight: 800;
    padding: 2px 6px;
    border-radius: 3px;
    letter-spacing: .8px;
}

.gyb-body {
    flex: 1;
    min-width: 0;
}

.gyb-cat {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .5px;
    display: block;
    margin-bottom: 4px;
}

.gyb-body h3 {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    margin: 0;
    color: #1e293b;
}

/* ── Şehir Haberleri ── */
.sehir {
    margin: 28px 0;
}

.sehir-header {
    padding-bottom: 10px;
    border-bottom: 3px solid #dc2626;
    margin-bottom: 16px;
}

.sehir-header h2 {
    font-size: 17px;
    font-weight: 800;
    color: #1e293b;
    margin: 0;
    letter-spacing: .5px;
}

.sehir-header h2 i {
    color: #dc2626;
    margin-right: 6px;
}

.sehir-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 18px;
}

.sehir-hero {
    display: block;
    text-decoration: none;
    color: inherit;
    border-radius: 12px;
    overflow: hidden;
    background: #1e293b;
    position: relative;
    min-height: 360px;
}

.sehir-hero-img {
    position: absolute;
    inset: 0;
}

.sehir-hero-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .9;
}

.sehir-hero-body {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px;
    background: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .85) 100%);
    color: #fff;
}

.sehir-citylabel {
    display: inline-block;
    background: #dc2626;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    padding: 4px 10px;
    border-radius: 3px;
    letter-spacing: 1px;
    margin-bottom: 8px;
}

.sehir-hero-body h3 {
    font-size: 20px;
    font-weight: 800;
    line-height: 1.3;
    margin: 0;
    color: #fff;
}

.sehir-list {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.sehir-item {
    display: block;
    padding: 12px 0;
    border-bottom: 1px solid #e2e8f0;
    text-decoration: none;
    color: inherit;
}

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

.sehir-citylabel-sm {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
    display: block;
    margin-bottom: 4px;
}

.sehir-item h4 {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    margin: 0;
    color: #1e293b;
}

.sehir-item:hover h4 {
    color: #dc2626;
}

@media (max-width: 800px) {
    .sehir-grid {
        grid-template-columns: 1fr;
    }

    .sehir-hero {
        min-height: 240px;
    }
}

/* ── Saatli Son Dakika ── */
.ssd {
    margin: 28px 0;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
}

.ssd-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    background: #dc2626;
    color: #fff;
}

.ssd-header h2 {
    font-size: 15px;
    font-weight: 800;
    margin: 0;
    letter-spacing: .8px;
}

.ssd-header h2 i {
    margin-right: 6px;
}

.ssd-live {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
}

.ssd-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
    animation: ssdPulse 1.4s infinite;
}

@keyframes ssdPulse {

    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: .35;
    }
}

.ssd-list {
    display: flex;
    flex-direction: column;
}

.ssd-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 18px;
    text-decoration: none;
    color: inherit;
    border-bottom: 1px dashed #f1f5f9;
    font-size: 13.5px;
}

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

.ssd-item:hover {
    background: #fef2f2;
}

.ssd-time {
    font-weight: 800;
    color: #dc2626;
    min-width: 42px;
    font-variant-numeric: tabular-nums;
}

.ssd-sep {
    color: #cbd5e1;
    font-weight: 300;
}

.ssd-cat {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    min-width: 60px;
}

.ssd-title {
    font-weight: 600;
    color: #1e293b;
    flex: 1;
    line-height: 1.4;
}

.ssd-item:hover .ssd-title {
    color: #dc2626;
}

@media (max-width: 600px) {
    .ssd-cat {
        display: none;
    }
}

/* ── Röportaj/Özel Vitrin ── */
.rvit {
    margin: 28px 0;
}

.rvit-header {
    padding-bottom: 10px;
    border-bottom: 3px solid #7c3aed;
    margin-bottom: 16px;
}

.rvit-header h2 {
    font-size: 17px;
    font-weight: 800;
    color: #1e293b;
    margin: 0;
    letter-spacing: .5px;
}

.rvit-header h2 i {
    color: #7c3aed;
    margin-right: 6px;
}

.rvit-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.rvit-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .06);
    border: 1px solid #f1f5f9;
    text-decoration: none;
    color: inherit;
    transition: box-shadow .2s;
}

.rvit-card:hover {
    box-shadow: 0 6px 20px rgba(124, 58, 237, .18);
}

.rvit-img {
    position: relative;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    background: #f1f5f9;
}

.rvit-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.rvit-rozet {
    position: absolute;
    top: 14px;
    left: -28px;
    background: #7c3aed;
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    padding: 4px 32px;
    letter-spacing: 1.2px;
    transform: rotate(-30deg);
    box-shadow: 0 2px 6px rgba(0, 0, 0, .25);
}

.rvit-body {
    padding: 14px 16px 18px;
}

.rvit-body h3 {
    font-size: 15px;
    font-weight: 800;
    line-height: 1.35;
    margin: 0 0 6px;
    color: #1e293b;
}

.rvit-body p {
    font-size: 12.5px;
    color: #64748b;
    line-height: 1.5;
    margin: 0;
}

@media (max-width: 900px) {
    .rvit-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .rvit-grid {
        grid-template-columns: 1fr;
    }
}

/* Phase G end */
/* ════════════════════════════════════════════════════════
   PHASE H: Yeni kategori blok şablonları
   list_with_hero, mosaic_4, top_card_plus_list
   ════════════════════════════════════════════════════════ */

/* ── Hero + Mini Liste ── */
.cat-lwh-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 18px;
}

.cat-lwh-hero {
    position: relative;
    display: block;
    border-radius: 12px;
    overflow: hidden;
    min-height: 380px;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 4px 18px rgba(0, 0, 0, .1);
}

.cat-lwh-hero img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    inset: 0;
}

.cat-lwh-hero-body {
    position: absolute;
    inset: 0;
    padding: 22px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background: linear-gradient(180deg, transparent 40%, rgba(0, 0, 0, .85) 100%);
    color: #fff;
}

.cat-lwh-hero-body h3 {
    font-size: 22px;
    font-weight: 800;
    line-height: 1.25;
    margin: 8px 0 8px;
    color: #fff;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .4);
}

.cat-lwh-hero-body p {
    font-size: 13px;
    line-height: 1.5;
    opacity: .92;
    margin: 0;
}

.cat-lwh-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cat-lwh-item {
    display: flex;
    gap: 12px;
    padding: 8px;
    background: #fff;
    border-radius: 10px;
    border: 1px solid #f1f5f9;
    text-decoration: none;
    color: inherit;
    align-items: center;
    transition: border-color .15s;
}

.cat-lwh-item:hover {
    border-color: var(--cat-color, #dc2626);
}

.cat-lwh-thumb {
    width: 90px;
    height: 64px;
    flex-shrink: 0;
    border-radius: 6px;
    overflow: hidden;
    background: #f1f5f9;
}

.cat-lwh-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cat-lwh-item h4 {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    margin: 0;
    color: #1e293b;
    flex: 1;
}

@media (max-width: 800px) {
    .cat-lwh-grid {
        grid-template-columns: 1fr;
    }

    .cat-lwh-hero {
        min-height: 240px;
    }
}

/* ── Mozaik 4'lü ── */
.cat-mosaic {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 12px;
    height: 440px;
}

.cat-mosaic-item {
    position: relative;
    display: block;
    border-radius: 12px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
}

.cat-mosaic-0 {
    grid-row: span 2;
}

.cat-mosaic-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    inset: 0;
}

.cat-mosaic-overlay {
    position: absolute;
    inset: 0;
    padding: 14px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background: linear-gradient(180deg, transparent 50%, rgba(0, 0, 0, .85) 100%);
    color: #fff;
}

.cat-mosaic-0 .cat-mosaic-overlay {
    padding: 22px;
}

.cat-mosaic-overlay h4 {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
    color: #fff;
    text-shadow: 0 2px 6px rgba(0, 0, 0, .5);
}

.cat-mosaic-0 .cat-mosaic-overlay h4 {
    font-size: 22px;
    font-weight: 800;
    line-height: 1.25;
    margin-top: 8px;
}

@media (max-width: 700px) {
    .cat-mosaic {
        grid-template-columns: 1fr;
        grid-template-rows: 240px repeat(3, 140px);
        height: auto;
    }

    .cat-mosaic-0 {
        grid-row: span 1;
    }
}

/* ── Üst Kart + Alt 4 Mini Yatay ── */
.cat-tcl-hero {
    position: relative;
    display: block;
    border-radius: 12px;
    overflow: hidden;
    min-height: 320px;
    text-decoration: none;
    color: inherit;
    margin-bottom: 14px;
}

.cat-tcl-hero img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    inset: 0;
}

.cat-tcl-hero-body {
    position: absolute;
    inset: 0;
    padding: 24px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background: linear-gradient(180deg, transparent 40%, rgba(0, 0, 0, .85) 100%);
    color: #fff;
}

.cat-tcl-hero-body h3 {
    font-size: 24px;
    font-weight: 800;
    line-height: 1.25;
    margin: 8px 0 0;
    color: #fff;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .4);
}

.cat-tcl-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.cat-tcl-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #f1f5f9;
    text-decoration: none;
    color: inherit;
    transition: border-color .15s;
}

.cat-tcl-card:hover {
    border-color: var(--cat-color, #dc2626);
}

.cat-tcl-thumb {
    aspect-ratio: 16/10;
    overflow: hidden;
    background: #f1f5f9;
}

.cat-tcl-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cat-tcl-card h5 {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
    margin: 0;
    padding: 10px 12px 12px;
    color: #1e293b;
}

@media (max-width: 800px) {
    .cat-tcl-row {
        grid-template-columns: repeat(2, 1fr);
    }

    .cat-tcl-hero {
        min-height: 200px;
    }
}

@media (max-width: 480px) {
    .cat-tcl-row {
        grid-template-columns: 1fr;
    }
}

/* Phase H end */

/* ════════════════════════════════════════════════════════
   PHASE I: Sidebar widget — Kategori Numaralı (GÜNÜN ...)
   ════════════════════════════════════════════════════════ */
.widget-cat-numbered {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .06);
    margin-bottom: 18px;
}

.widget-cat-numbered .wcn-header {
    background: var(--wcn, #ec4899);
    color: #fff;
    padding: 14px 18px;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .3px;
}

.widget-cat-numbered .wcn-body {
    padding: 6px 0;
}

.widget-cat-numbered .wcn-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-bottom: 1px solid #f1f5f9;
    text-decoration: none;
    color: inherit;
    transition: background .15s;
}

.widget-cat-numbered .wcn-item:last-child {
    border-bottom: none;
}

.widget-cat-numbered .wcn-item:hover {
    background: #fafafa;
}

.widget-cat-numbered .wcn-num {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 2px solid var(--wcn, #ec4899);
    color: var(--wcn, #ec4899);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 13px;
}

.widget-cat-numbered .wcn-title {
    flex: 1;
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.4;
    color: #1e293b;
}

.widget-cat-numbered .wcn-icons {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.widget-cat-numbered .wcn-icons i {
    color: #f59e0b;
    font-size: 13px;
}

.widget-cat-numbered .wcn-badge {
    background: #10b981;
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    padding: 3px 7px;
    border-radius: 4px;
    letter-spacing: .5px;
}

/* Phase I end */

/* === Sidebar 'Son Haberler' (recent_news) widget — added by perf/seo upgrade === */
.widget-recent .widget-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.widget-recent .widget-news-item {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 8px 0;
    border-bottom: 1px solid var(--border, #eee);
    text-decoration: none;
    color: inherit;
}

.widget-recent .widget-news-item:last-child {
    border-bottom: none;
}

.widget-recent .widget-thumb {
    flex: 0 0 72px;
    height: 54px;
    overflow: hidden;
    border-radius: 6px;
    background: #f3f3f3;
}

.widget-recent .widget-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.widget-recent .widget-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1 1 auto;
    min-width: 0;
}

.widget-recent .widget-title-text {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--text, #222);
}

.widget-recent .widget-meta {
    font-size: 12px;
    color: var(--text-muted, #888);
}

.widget-recent .widget-news-item:hover .widget-title-text {
    color: var(--accent, #ec4899);
}

/* =================================================================
   MODERN SIDEBAR FAZ 3 - Kapsamli yenileme
   ================================================================= */

/* -- Genel widget kart -- */
.modern-sidebar .widget {
    background: #fff;
    border: none;
    border-radius: 16px;
    margin-bottom: 20px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(15,23,42,.06), 0 4px 16px rgba(15,23,42,.04);
    transition: box-shadow .3s ease, transform .3s ease;
}
.modern-sidebar .widget:hover {
    box-shadow: 0 4px 20px rgba(15,23,42,.10);
}

/* -- Widget baslik bandi -- */
.modern-sidebar .widget-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px 12px;
    border-bottom: 1px solid #f1f5f9;
    background: linear-gradient(135deg, #fcfcfd 0%, #fff 100%);
    position: relative;
}
.modern-sidebar .widget-header::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, #dc2626 0%, #f87171 100%);
    border-radius: 0 3px 3px 0;
}
.modern-sidebar .widget-header::after {
    content: '';
    position: absolute;
    bottom: 0; left: 18px; right: 18px;
    height: 1px;
    background: linear-gradient(90deg, rgba(220,38,38,.3) 0%, transparent 70%);
}
.modern-sidebar .widget-header h3,
.modern-sidebar .widget-header h4,
.modern-sidebar .widget-title {
    font-size: 12px !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #0f172a !important;
    margin: 0 !important;
    padding: 0 0 0 10px !important;
    display: flex;
    align-items: center;
    gap: 8px;
}
.modern-sidebar .widget-header h3 i,
.modern-sidebar .widget-header h4 i,
.modern-sidebar .widget-title i {
    width: 26px; height: 26px;
    border-radius: 7px;
    background: linear-gradient(135deg, #dc2626, #ef4444);
    color: #fff;
    font-size: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 2px 6px rgba(220,38,38,.3);
}
.modern-sidebar .widget-body {
    padding: 14px 18px;
}

/* -- Popular Tabs (sekme) -- */
.modern-sidebar .widget-popular-tabs .popular-tabs {
    display: flex;
    gap: 6px;
    padding: 10px 14px 10px;
    border-bottom: 1px solid #f1f5f9;
    background: #fafbfc;
}
.modern-sidebar .widget-popular-tabs .popular-tab {
    flex: 1;
    background: #f1f5f9;
    border: none;
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    padding: 7px 4px;
    cursor: pointer;
    border-radius: 8px;
    transition: all .2s ease;
    text-transform: uppercase;
    letter-spacing: .4px;
    border-bottom: 2px solid transparent;
}
.modern-sidebar .widget-popular-tabs .popular-tab:hover {
    background: #fee2e2;
    color: #dc2626;
}
.modern-sidebar .widget-popular-tabs .popular-tab.active {
    background: #dc2626;
    color: #fff;
    border-bottom-color: #b91c1c;
    box-shadow: 0 2px 8px rgba(220,38,38,.3);
}

/* -- Popular haber satiri -- */
.modern-sidebar .popular-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 18px;
    color: #334155;
    text-decoration: none;
    transition: background .15s, transform .15s;
    border-bottom: 1px solid #f8fafc;
}
.modern-sidebar .popular-item:last-child { border-bottom: none; }
.modern-sidebar .popular-item:hover {
    background: #fef2f2;
    transform: translateX(3px);
}
.modern-sidebar .popular-rank {
    width: 30px; height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 900;
    flex-shrink: 0;
    background: #f1f5f9;
    color: #94a3b8;
    transition: all .2s;
}
.modern-sidebar .popular-item:nth-child(1) .popular-rank {
    background: linear-gradient(135deg,#fbbf24,#f59e0b);
    color: #fff;
    box-shadow: 0 2px 8px rgba(245,158,11,.4);
}
.modern-sidebar .popular-item:nth-child(2) .popular-rank {
    background: linear-gradient(135deg,#94a3b8,#64748b);
    color: #fff;
    box-shadow: 0 2px 6px rgba(100,116,139,.3);
}
.modern-sidebar .popular-item:nth-child(3) .popular-rank {
    background: linear-gradient(135deg,#f97316,#ea580c);
    color: #fff;
    box-shadow: 0 2px 6px rgba(249,115,22,.3);
}
.modern-sidebar .popular-item:hover .popular-rank {
    transform: scale(1.1);
}
.modern-sidebar .popular-content {
    flex: 1; min-width: 0;
}
.modern-sidebar .popular-content h4 {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    color: #1e293b;
    margin: 0 0 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color .15s;
}
.modern-sidebar .popular-item:hover .popular-content h4 { color: #dc2626; }
.modern-sidebar .popular-content .popular-cat {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: #dc2626;
    background: #fef2f2;
    padding: 2px 7px;
    border-radius: 20px;
    display: inline-block;
    line-height: 1.6;
}

/* -- Doviz & Altin widget -- */
.modern-sidebar .widget-exchange .widget-body { padding: 8px 0; }
.modern-sidebar .exchange-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 18px;
    transition: background .15s;
    border-bottom: 1px solid #f8fafc;
}
.modern-sidebar .exchange-item:last-child { border-bottom: none; }
.modern-sidebar .exchange-item:hover { background: #fafbfc; }
.modern-sidebar .exchange-divider {
    height: 0 !important;
    padding: 0 !important;
    border-top: 1.5px dashed #f1f5f9;
    margin: 2px 14px;
}
.modern-sidebar .exchange-name {
    font-size: 13px;
    font-weight: 600;
    color: #334155;
    display: flex;
    align-items: center;
    gap: 7px;
}
.modern-sidebar .exchange-val {
    font-size: 14px;
    font-weight: 800;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
    background: #f1f5f9;
    padding: 3px 10px;
    border-radius: 8px;
    min-width: 68px;
    text-align: right;
    transition: background .2s;
}
.modern-sidebar .exchange-val.up   { color: #16a34a; background: #f0fdf4; }
.modern-sidebar .exchange-val.down { color: #dc2626; background: #fef2f2; }

/* -- Hava durumu widget -- */
.modern-sidebar .widget-weather-v2 .widget-body { padding: 14px; }
.modern-sidebar .widget-weather-v2 .weather-main {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px;
    background: linear-gradient(135deg, #1e40af 0%, #3b82f6 100%);
    border-radius: 12px;
    margin-bottom: 12px;
    color: #fff;
}
.modern-sidebar .widget-weather-v2 .weather-icon {
    font-size: 46px;
    line-height: 1;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,.25));
}
.modern-sidebar .widget-weather-v2 .weather-temp {
    font-size: 34px;
    font-weight: 900;
    color: #fff;
    line-height: 1;
}
.modern-sidebar .widget-weather-v2 .weather-city {
    font-size: 11px;
    color: rgba(255,255,255,.8);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .7px;
    margin-top: 4px;
}
.modern-sidebar .widget-weather-v2 .weather-detail {
    font-size: 13px;
    color: #475569;
    margin-bottom: 6px;
    padding: 0 2px;
}
.modern-sidebar .widget-weather-v2 .weather-meta {
    font-size: 12px;
    color: #64748b;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 10px;
    padding: 0 2px;
}
.modern-sidebar .widget-weather-v2 .weather-meta i { color: #3b82f6; margin-right: 3px; }
.modern-sidebar .widget-weather-v2 .weather-forecast {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 6px;
}
.modern-sidebar .widget-weather-v2 .forecast-day {
    background: #f8fafc;
    border-radius: 10px;
    padding: 8px 4px;
    text-align: center;
    transition: background .15s, transform .15s;
    border: 1px solid #f1f5f9;
}
.modern-sidebar .widget-weather-v2 .forecast-day:hover {
    background: #eff6ff;
    border-color: #bfdbfe;
    transform: translateY(-2px);
}
.modern-sidebar .widget-weather-v2 .forecast-name {
    font-size: 10px;
    font-weight: 700;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: .3px;
    margin-bottom: 4px;
}
.modern-sidebar .widget-weather-v2 .forecast-icon { font-size: 20px; }
.modern-sidebar .widget-weather-v2 .forecast-temps {
    font-size: 11px;
    color: #64748b;
    margin-top: 4px;
}
.modern-sidebar .widget-weather-v2 .forecast-temps b {
    font-weight: 800;
    color: #1e293b;
    font-size: 12px;
}

/* -- Burc grid -- */
.modern-sidebar .widget-horoscope .widget-body { padding: 12px; }
.modern-sidebar .horoscope-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 7px;
}
.modern-sidebar .horoscope-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px 4px 9px;
    border-radius: 12px;
    background: #f8fafc;
    text-decoration: none;
    color: #475569;
    transition: all .2s ease;
    border: 1px solid transparent;
}
.modern-sidebar .horoscope-item:hover {
    background: #fef2f2;
    border-color: #fecaca;
    transform: translateY(-2px);
    color: #dc2626;
    box-shadow: 0 4px 12px rgba(220,38,38,.12);
}
.modern-sidebar .horoscope-icon {
    font-size: 22px;
    line-height: 1;
    margin-bottom: 5px;
}
.modern-sidebar .horoscope-name {
    font-size: 9.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .3px;
    line-height: 1;
    color: inherit;
}

/* -- Trend Etiket bulutu -- */
.modern-sidebar .widget-tag-cloud .widget-body { padding: 14px; }
.modern-sidebar .tag-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}
.modern-sidebar .trending-tag {
    display: inline-block;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    background: #f1f5f9;
    color: #475569;
    transition: all .2s ease;
    border: 1px solid #e2e8f0;
    line-height: 1.5;
}
.modern-sidebar .trending-tag:hover {
    background: #dc2626;
    color: #fff;
    border-color: #dc2626;
    transform: translateY(-2px);
    box-shadow: 0 3px 8px rgba(220,38,38,.25);
}
.modern-sidebar .tag-w4,
.modern-sidebar .tag-w5 {
    background: #fef2f2;
    color: #dc2626;
    border-color: #fecaca;
    font-size: 12px;
}
.modern-sidebar .tag-w3 {
    background: #fff7ed;
    color: #ea580c;
    border-color: #fed7aa;
}
.modern-sidebar .tag-w2 {
    background: #fafaf9;
    color: #57534e;
    border-color: #d6d3d1;
}

/* -- Reklam kutusu -- */
.modern-sidebar .widget-ad {
    border-radius: 16px;
    overflow: hidden;
}
.modern-sidebar .widget-ad .widget-body { padding: 0; }

/* -- Live readers bandi -- */
.modern-sidebar .widget-live-readers {
    background: linear-gradient(135deg, #fff5f5 0%, #fff 70%) !important;
    border: 1px solid #fecaca !important;
    padding: 0 !important;
}
.modern-sidebar .live-readers-count {
    font-size: 28px;
    font-weight: 900;
    color: #dc2626;
    line-height: 1;
}
.modern-sidebar .live-readers-label {
    font-size: 11px;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: .5px;
    font-weight: 600;
    margin-top: 3px;
}

/* -- Sonra Oku listesi -- */
.modern-sidebar #readingListWidget .reading-list { list-style: none; margin: 0; padding: 0; }
.modern-sidebar #readingListWidget .reading-list li {
    padding: 10px 0;
    border-bottom: 1px solid #f1f5f9;
    font-size: 13px;
    line-height: 1.4;
}
.modern-sidebar #readingListWidget .reading-list li:last-child { border-bottom: none; }
.modern-sidebar #readingListWidget .reading-list a {
    color: #334155;
    text-decoration: none;
    font-weight: 600;
    transition: color .15s;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.modern-sidebar #readingListWidget .reading-list a:hover { color: #dc2626; }
.modern-sidebar .reading-list-empty {
    text-align: center;
    color: #94a3b8;
    font-size: 13px;
    padding: 16px 0;
}
.modern-sidebar .reading-list-empty i {
    display: block;
    font-size: 24px;
    margin-bottom: 8px;
    opacity: .4;
}

/* -- Dark mode uyum -- */
:root[data-theme="dark"] .modern-sidebar .widget {
    background: #1e293b;
    box-shadow: 0 2px 12px rgba(0,0,0,.3);
}
:root[data-theme="dark"] .modern-sidebar .widget-header {
    background: linear-gradient(135deg, #1a2234 0%, #1e293b 100%);
    border-bottom-color: #334155;
}
:root[data-theme="dark"] .modern-sidebar .widget-header h3,
:root[data-theme="dark"] .modern-sidebar .widget-header h4 {
    color: #f1f5f9 !important;
}
:root[data-theme="dark"] .modern-sidebar .popular-item { color: #cbd5e1; border-bottom-color: #1e293b; }
:root[data-theme="dark"] .modern-sidebar .popular-item:hover { background: #263248; }
:root[data-theme="dark"] .modern-sidebar .popular-content h4 { color: #e2e8f0; }
:root[data-theme="dark"] .modern-sidebar .exchange-item { border-bottom-color: #263248; }
:root[data-theme="dark"] .modern-sidebar .exchange-item:hover { background: #263248; }
:root[data-theme="dark"] .modern-sidebar .exchange-name { color: #94a3b8; }
:root[data-theme="dark"] .modern-sidebar .exchange-val { background: #263248; color: #e2e8f0; }
:root[data-theme="dark"] .modern-sidebar .trending-tag { background: #263248; color: #94a3b8; border-color: #334155; }
:root[data-theme="dark"] .modern-sidebar .tag-w3,
:root[data-theme="dark"] .modern-sidebar .tag-w4,
:root[data-theme="dark"] .modern-sidebar .tag-w5 { background: #3d1a1a; color: #f87171; border-color: #7f1d1d; }
:root[data-theme="dark"] .modern-sidebar .horoscope-item { background: #263248; color: #94a3b8; }
:root[data-theme="dark"] .modern-sidebar .horoscope-item:hover { background: #3d1a1a; color: #f87171; }
:root[data-theme="dark"] .modern-sidebar .forecast-day { background: #263248; border-color: #334155; }
:root[data-theme="dark"] .modern-sidebar .forecast-day:hover { background: #1e3a5f; }
:root[data-theme="dark"] .modern-sidebar .popular-tabs { background: #1a2234; }
:root[data-theme="dark"] .modern-sidebar .popular-tab { background: #263248; color: #64748b; }
:root[data-theme="dark"] .modern-sidebar .popular-tab:hover { background: #3d1a1a; color: #f87171; }
:root[data-theme="dark"] .modern-sidebar .popular-tab.active { background: #dc2626; color: #fff; }