/**
 * E-Manset Advert Styles
 *
 * Reklam container stilleri ve responsive davranislar
 */

/* ==========================================================================
   Base Advert Containers
   ========================================================================== */

.advert-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    overflow: hidden;
}

.advert-container img {
    max-width: 100%;
    height: auto;
    display: block;
}

.advert-container a {
    display: block;
    line-height: 0;
}

/* ==========================================================================
   Homepage Adverts (ANA-*)
   ========================================================================== */

/* ANA-1: Header Reklam Alti (970x600) */
.advert-home-header {
    max-width: 970px;
    margin: 20px auto;
    padding: 0 15px;
}

/* ANA-2: Surmanset Alti (970x600) */
.advert-home-breaking {
    max-width: 970px;
    margin: 24px auto;
    padding: 0 15px;
}

/* ANA-3: Manset Alti (970x600) */
.advert-home-manset {
    max-width: 970px;
    margin: 24px auto;
    padding: 0 15px;
}

/* ANA-4: Video Galeri Alti / Havadurumu Ustu (970x600) */
.advert-home-video {
    max-width: 970px;
    margin: 24px auto;
    padding: 0 15px;
}

/* ANA-5: Spor Section Alti */
.advert-home-spor {
    max-width: 970px;
    margin: 24px auto;
    padding: 0 15px;
}

/* ANA-6: Footer Ustu (970x600) */
.advert-home-footer {
    max-width: 970px;
    margin: 24px auto;
    padding: 0 15px;
}

/* ==========================================================================
   Sidebar Adverts (SIDE-*)
   ========================================================================== */

/* Yan reklamlar - normal akis (fixed degil) */
.advert-sidebar-left,
.advert-sidebar-right {
    width: 180px;
    min-height: 600px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 10px 0;
}

.advert-sidebar-left img,
.advert-sidebar-right img {
    max-width: 180px;
    height: auto;
}

/* Detay sayfa yan reklamlari */
.advert-detail-sidebar-left,
.advert-detail-sidebar-right {
    width: 180px;
    margin: 20px 0;
}

/* ==========================================================================
   Content Page Adverts (ALT-*)
   ========================================================================== */

/* ALT-1: Breadcrumb/Menu Alti (970x600) */
.advert-breadcrumb {
    max-width: 970px;
    margin: 20px auto;
    padding: 0 15px;
}

/* ALT-2: Icerik Alti (730x500) */
.advert-content-bottom {
    max-width: 730px;
    margin: 24px auto;
}

/* ALT-3: Yorum Alti (730x500) */
.advert-comments {
    max-width: 730px;
    margin: 24px auto;
}

/* ALT-S1: Sidebar Ust (350x350) */
.advert-sidebar-top {
    max-width: 350px;
    margin: 0 auto 20px;
}

/* ALT-S2: Sidebar Alt (350x470) */
.advert-sidebar-bottom {
    max-width: 350px;
    margin: 20px auto 0;
}

/* ==========================================================================
   Paragraph Adverts (PAR-*)
   ========================================================================== */

/* PAR-1: Paragraf Ustu / Icerik Basi (730x500) */
.advert-content-top {
    max-width: 730px;
    margin: 20px auto;
}

/* PAR-2: 3. Paragraf Sonrasi (730x500) */
.advert-paragraph {
    max-width: 730px;
    margin: 24px auto;
    clear: both;
}

/* ==========================================================================
   Section Adverts (ALAN-*)
   ========================================================================== */

/* ALAN-MAN: Manset Reklam (800x450) */
.advert-section-manset {
    max-width: 800px;
    margin: 20px auto;
}

/* ALAN-SUR: Surmanset Reklam (500x450) */
.advert-section-surmanset {
    max-width: 500px;
    margin: 20px auto;
}

/* ALAN-ONE: One Cikan (500x300) */
.advert-section-featured {
    max-width: 500px;
    margin: 20px auto;
}

/* ==========================================================================
   Responsive Styles
   ========================================================================== */

@media (max-width: 1400px) {
    /* Yan reklamlari gizle buyuk ekranlarda */
    .advert-sidebar-left,
    .advert-sidebar-right {
        display: none;
    }
}

@media (max-width: 1024px) {
    .advert-home-header,
    .advert-home-breaking,
    .advert-home-manset,
    .advert-home-video,
    .advert-home-spor,
    .advert-home-footer,
    .advert-breadcrumb {
        max-width: 100%;
        padding: 0 15px;
    }
}

@media (max-width: 768px) {
    .advert-home-header,
    .advert-home-breaking,
    .advert-home-manset,
    .advert-home-video,
    .advert-home-spor,
    .advert-home-footer {
        margin: 16px auto;
    }

    .advert-content-bottom,
    .advert-comments,
    .advert-content-top,
    .advert-paragraph {
        max-width: 100%;
        margin: 16px auto;
    }

    .advert-sidebar-top,
    .advert-sidebar-bottom {
        max-width: 100%;
    }

    /* Mobilde sidebar reklamlari gizlenmez ama boyutlari ayarlanir */
    .advert-detail-sidebar-left,
    .advert-detail-sidebar-right {
        display: none;
    }
}

@media (max-width: 480px) {
    .advert-home-header,
    .advert-home-breaking,
    .advert-home-manset,
    .advert-home-video,
    .advert-home-spor,
    .advert-home-footer {
        margin: 12px auto;
        padding: 0 10px;
    }

    .advert-content-bottom,
    .advert-comments,
    .advert-content-top,
    .advert-paragraph {
        margin: 12px auto;
    }
}

/* ==========================================================================
   Side Adverts - Sol ve Sag Dikey Reklamlar (SIDE-LEFT, SIDE-RIGHT)
   ========================================================================== */

/* Ana wrapper - fixed pozisyon */
.side-advert {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    z-index: 100;
    display: none; /* Varsayilan gizli, genis ekranlarda goster */
}

.side-advert-left {
    left: 10px;
}

.side-advert-right {
    right: 10px;
}

/* Reklam container */
.advert-side-left,
.advert-side-right {
    width: 160px;
    min-height: 600px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.advert-side-left img,
.advert-side-right img {
    max-width: 160px;
    height: auto;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* 1440px uzerinde goster */
@media (min-width: 1441px) {
    .side-advert {
        display: block;
    }
}

/* Daha genis ekranlar icin pozisyon ayari (1500px+) */
@media (min-width: 1500px) {
    .side-advert-left {
        left: 15px;
    }

    .side-advert-right {
        right: 15px;
    }
}

/* Cok genis ekranlar (1700px+) */
@media (min-width: 1700px) {
    .side-advert-left {
        left: calc((100vw - 1200px) / 2 - 270px);
    }

    .side-advert-right {
        right: calc((100vw - 1200px) / 2 - 270px);
    }
}

/* Reklam yoksa wrapper'i gizle */
.side-advert:has(.advert-container:empty) {
    display: none !important;
}

/* Scroll animasyonu - yavasca takip */
.side-advert {
    transition: top 0.3s ease-out;
}

/* ==========================================================================
   Footer Adverts (ALT-FOOTER)
   ========================================================================== */

/* Footer Ustu Reklam Wrapper */
.footer-advert-wrapper {
    background: #f5f5f5;
    padding: 30px 0;
    border-top: 1px solid #e0e0e0;
}

.advert-footer-top {
    max-width: 970px;
    margin: 0 auto;
}

/* ==========================================================================
   Category Inline Adverts (Haberler Arasi)
   ========================================================================== */

/* Kategori sayfalarda haberler arasi reklam */
.cat-inline-advert {
    margin: 24px 0;
    /* padding: 20px; */
    /* background: #fafafa; */
    /* border-radius: 10px; */
    /* border: 1px dashed #e0e0e0; */
}

.cat-inline-advert .advert-container {
    max-width: 730px;
}

/* ==========================================================================
   Utility Classes
   ========================================================================== */

/* Reklam yoksa gizle */
.advert-container:empty {
    display: none;
}

/* Loading state */
.advert-container.loading {
    min-height: 100px;
    background: #f8f9fa;
    animation: pulse 1.5s infinite;
}

@keyframes pulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}

/* Sponsored label */
.advert-label {
    font-size: 10px;
    color: #999;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-align: center;
    margin-bottom: 4px;
}