/* ============================================================
   MOBİL UYUMLULUK - RESPONSIVE CSS
   Breakpoint sistemi: 1200, 992, 768, 576, 480
   ============================================================ */

/* ============================================================
   1200px ve altı - Geniş tablet / dar masaüstü
   ============================================================ */
@media (max-width: 1200px) {
    .konteyner { max-width: 100%; padding: 0 var(--bosluk-16); }
    .yan-sutun { width: 280px; }
    .manset-alt-serit { grid-template-columns: repeat(2, 1fr); }
    .header-reklam-alan { width: 100%; max-width: 468px; height: 60px; }
    .izgara-5 { grid-template-columns: repeat(4, 1fr); }
    .footer-ust { grid-template-columns: 1.2fr 1fr 1fr 1fr; gap: var(--bosluk-24); }
}

/* ============================================================
   992px ve altı - Tablet
   ============================================================ */
@media (max-width: 992px) {
    .yan-sutun { display: none; }
    .satir { flex-direction: column; }
    .ana-icerik { width: 100%; }

    .manset-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto;
        min-height: 300px;
    }
    .manset-buyuk { grid-row: auto; }
    .manset-overlay h2 { font-size: var(--yazi-xl); }

    .izgara-4 { grid-template-columns: repeat(3, 1fr); }
    .izgara-5 { grid-template-columns: repeat(3, 1fr); }

    .footer-ust {
        grid-template-columns: 1fr 1fr;
        gap: var(--bosluk-24);
    }

    .header-reklam { display: none; }
    .header-icerik { justify-content: space-between; }
}

/* ============================================================
   768px ve altı - Küçük tablet / büyük telefon
   ============================================================ */
@media (max-width: 768px) {
    :root {
        --yazi-2xl: 1.25rem;
        --yazi-3xl: 1.5rem;
        --yazi-4xl: 1.875rem;
    }

    /* Üst bilgi düzeni */
    .ust-bilgi {
        overflow: hidden;
        max-width: 100vw;
    }
    .ust-bilgi .konteyner {
        flex-wrap: wrap;
        gap: var(--bosluk-6);
        overflow: hidden;
        max-width: 100%;
    }
    .ust-bilgi-sol {
        max-width: 100%;
        overflow: hidden;
        min-width: 0;
    }
    .son-dakika-bant {
        max-width: 100%;
        margin: 0;
        order: 3;
        flex-basis: 100%;
        overflow: hidden;
        min-width: 0;
    }
    .son-dakika-icerik {
        overflow: hidden;
        max-width: 100%;
    }
    .son-dakika-kayan {
        max-width: none;
    }
    .servis-linkler { display: none; }
    .sosyal-ikonlar-ust { gap: var(--bosluk-6); }

    /* Menü — Hamburger butonu göster, üst menü çubuğunu gizle */
    .ana-menu {
        z-index: 10000;
        overflow: visible;
    }
    .mobil-menu-btn { display: flex; }

    .menu-listesi {
        display: flex !important;
        flex-direction: column;
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: 280px;
        max-width: 85vw;
        background: linear-gradient(180deg, #8e0000 0%, #c62828 30%, #1a1a1a 100%);
        box-shadow: 4px 0 24px rgba(0,0,0,0.3);
        z-index: 9999;
        overflow-y: auto;
        overflow-x: hidden;
        padding: 0 0 24px 0;
        transform: translateX(-105%);
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        justify-content: flex-start;
        -webkit-overflow-scrolling: touch;
    }
    .menu-listesi.acik {
        transform: translateX(0);
    }

    .menu-listesi > li {
        width: 100%;
    }
    .menu-listesi > li > a {
        padding: 14px 20px;
        font-size: 14px !important;
        font-weight: 600;
        text-transform: none;
        letter-spacing: 0;
        color: rgba(255,255,255,0.95);
        border-bottom: 1px solid rgba(255,255,255,0.1);
        white-space: normal;
        gap: 10px;
    }
    .menu-listesi > li > a i {
        font-size: 16px !important;
        width: 20px;
        text-align: center;
    }
    .menu-listesi > li > a::after { display: none; }
    .menu-listesi > li > a:hover,
    .menu-listesi > li.aktif > a {
        background: rgba(249,195,0,0.15);
        color: #f9c300;
    }

    /* Mobil menü overlay */
    .mobil-menu-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0,0,0,0.45);
        z-index: 9998;
    }
    .mobil-menu-overlay.acik {
        display: block;
    }

    /* Alt menü (dropdown) mobilde */
    .alt-menu {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        border-top: none;
        border-radius: 0;
        background: rgba(0,0,0,0.15);
        display: none;
    }
    .alt-menu.acik { display: block; }
    .alt-menu a {
        color: rgba(255,255,255,0.8);
        border-bottom-color: rgba(255,255,255,0.05);
        padding-left: var(--bosluk-32);
        font-size: 13px;
    }
    .alt-menu a:hover {
        background: rgba(255,255,255,0.05);
        color: #fff;
    }

    /* Manşet */
    .manset-grid {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        min-height: auto;
    }
    .manset-buyuk { min-height: 250px; }
    .manset-yan { min-height: 160px; }
    .manset-alt-serit { grid-template-columns: 1fr 1fr; }

    /* Grid'ler */
    .izgara-3 { grid-template-columns: repeat(2, 1fr); }
    .izgara-4 { grid-template-columns: repeat(2, 1fr); }
    .izgara-5 { grid-template-columns: repeat(2, 1fr); }

    /* Video blok */
    .video-blok { padding: var(--bosluk-24) 0; }

    /* Footer */
    .footer-ust { grid-template-columns: 1fr; gap: var(--bosluk-24); }
    .footer-alt { flex-direction: column; gap: var(--bosluk-10); text-align: center; }
    .footer-alt-linkler { flex-wrap: wrap; justify-content: center; }

    /* Bülten */
    .bulten-form { flex-direction: column; }

    /* Mobil menü başlık */
    .mobil-menu-baslik {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        padding: 16px 20px;
        background: rgba(0,0,0,0.2);
        border-bottom: 1px solid rgba(255,255,255,0.15);
    }
    .mobil-logo {
        font-size: 18px;
        font-weight: 900;
        color: #fff;
        letter-spacing: -0.5px;
    }
    .mobil-logo span {
        color: #f9c300;
    }
    .mobil-menu-kapat {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        background: rgba(255,255,255,0.15);
        border: none;
        border-radius: 8px;
        color: #fff;
        font-size: 18px;
        cursor: pointer;
        transition: background 0.2s;
    }
    .mobil-menu-kapat:hover {
        background: rgba(255,255,255,0.25);
    }

    /* Mobil menü ayırıcı */
    .mobil-menu-ayirici {
        display: block !important;
        height: 1px;
        background: rgba(255,255,255,0.12);
        margin: 8px 20px;
    }

    /* Mobil menü ikonları */
    .mobil-menu-ikon {
        display: inline-block;
        width: 20px;
        text-align: center;
        font-size: 12px !important;
        opacity: 0.7;
    }
    .mobil-menu-yazi { display: inline; }

    /* Arama */
    .arama-kutusu { width: 140px; }

    /* Yan sütun blokları mobilde göster */
    .mobil-yan-kutu {
        display: block;
        margin: var(--bosluk-20) 0;
    }
}

/* ============================================================
   576px ve altı - Telefon
   ============================================================ */
@media (max-width: 576px) {
    :root {
        --bosluk-24: 1rem;
        --bosluk-32: 1.5rem;
    }

    body { font-size: var(--yazi-sm); }

    .konteyner { padding: 0 var(--bosluk-12); }

    /* Header */
    .header-icerik { gap: var(--bosluk-12); padding: var(--bosluk-10) 0; }
    .logo-baslik { font-size: var(--yazi-lg); }
    .logo-slogan { font-size: 9px; }
    .site-header { padding: var(--bosluk-10) 0; }

    /* Manşet */
    .manset-buyuk { min-height: 200px; }
    .manset-overlay { padding: var(--bosluk-16) var(--bosluk-12) var(--bosluk-12); }
    .manset-overlay h2 { font-size: var(--yazi-md); }
    .manset-overlay .spot { display: none; }
    .manset-yan .manset-overlay h3 { font-size: var(--yazi-sm); }
    .manset-alt-serit { grid-template-columns: 1fr; gap: var(--bosluk-8); }

    /* Kartlar */
    .kart-buyuk .kart-baslik { font-size: var(--yazi-md); }
    .kart-buyuk .kart-icerik { padding: var(--bosluk-12); }
    .kart-yatay .kart-resim-alani { width: 90px; height: 65px; }
    .kart-yatay { padding: var(--bosluk-10); gap: var(--bosluk-8); }

    /* Grid'ler */
    .izgara-2 { grid-template-columns: 1fr; }
    .izgara-3 { grid-template-columns: 1fr; }
    .izgara-4 { grid-template-columns: repeat(2, 1fr); }
    .izgara-5 { grid-template-columns: repeat(2, 1fr); }

    /* Bölüm başlık */
    .bolum-baslik h2 { font-size: var(--yazi-baz); }
    .bolum-baslik .tumu-link { font-size: var(--yazi-xs); }

    /* Sekmeler */
    .sekmeli-blok .sekme-basliklar { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .sekmeli-blok .sekme-btn { white-space: nowrap; padding: var(--bosluk-6) var(--bosluk-12); font-size: var(--yazi-xs); }

    /* Sayfalama */
    .sayfalama li a { min-width: 32px; height: 32px; font-size: var(--yazi-xs); }

    /* Arama kutusu */
    .arama-kutusu { width: 120px; }
    .arama-kutusu input { padding: var(--bosluk-6) var(--bosluk-10); font-size: var(--yazi-xs); }

    /* Son dakika bant */
    .son-dakika-etiket { font-size: 9px; padding: 2px 6px; }

    /* Reklam */
    .reklam-728 { height: 60px; }
}

/* ============================================================
   480px ve altı - Küçük telefon
   ============================================================ */
@media (max-width: 480px) {
    .izgara-4 { grid-template-columns: 1fr; }
    .izgara-5 { grid-template-columns: 1fr; }

    .kart-orta .kart-resim-alani { aspect-ratio: 16/10; }

    .yazar-kart { padding: var(--bosluk-16); }
    .yazar-kart .yazar-avatar { width: 56px; height: 56px; }

    .tarih-bilgi span:not(:first-child) { display: none; }
}

/* ============================================================
   MOBİL ALT MENÜ (Sabit navigasyon)
   ============================================================ */
.mobil-alt-menu {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--renk-beyaz);
    box-shadow: 0 -2px 12px rgba(0,0,0,0.1);
    z-index: 1000;
    padding: var(--bosluk-6) 0;
    padding-bottom: env(safe-area-inset-bottom, 6px);
}

@media (max-width: 768px) {
    .mobil-alt-menu { display: flex; }
    body { padding-bottom: 64px; }
}

.mobil-alt-menu a {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: var(--bosluk-4) 0;
    color: var(--renk-meta);
    font-size: 9px;
    font-weight: 600;
    transition: color var(--gecis-hizli);
    text-decoration: none;
}

.mobil-alt-menu a i { font-size: 18px; }

.mobil-alt-menu a.aktif,
.mobil-alt-menu a:hover {
    color: var(--renk-vurgu);
}

/* ============================================================
   DOKUNMA OPTİMİZASYONU
   ============================================================ */
@media (hover: none) and (pointer: coarse) {
    .kart-buyuk:hover, .kart-orta:hover, .kart-yatay:hover { transform: none; }
    .manset-buyuk:hover .manset-resim,
    .manset-yan:hover .manset-resim,
    .kart-buyuk:hover .kart-resim,
    .kart-orta:hover .kart-resim { transform: none; }
}

/* ============================================================
   YAZDIRMA STİLLERİ
   ============================================================ */
@media print {
    .ust-bilgi, .ana-menu, .site-footer, .mobil-alt-menu,
    .yan-sutun, .reklam-alani, .bulten-alani, .sosyal-ikonlar-ust { display: none !important; }
    body { background: #fff; color: #000; font-size: 12pt; }
    .konteyner { max-width: 100%; }
    a { color: #000; text-decoration: underline; }
}