/* ============================================================
   TV Guide Ad System — Responsive Ad Placements
   ============================================================ */

/* Responsive Ad Container */
.ad-responsive {
    width: 100%;
    text-align: center;
}
.ad-responsive .ad-desktop { display: block; }
.ad-responsive .ad-mobile { display: none; }

/* Native Banner */
.ad-native-banner {
    margin: 20px 0;
    padding: 15px;
    background: var(--bg-subtle, #f8f9fa);
    border: 1px solid var(--border-default, #dee2e6);
    text-align: center;
    border-radius: 4px;
    width: 100%;
    box-sizing: border-box;
    display: block;
    flex-shrink: 0;
}

/* Banner Containers */
.ad-banner-728-90,
.ad-banner-468-60 {
    margin: 20px auto;
    text-align: center;
    width: 100%;
    max-width: 728px;
}
.ad-banner-320-50 {
    margin: 15px auto;
    text-align: center;
    width: 100%;
    max-width: 320px;
}
.ad-banner-300-250 {
    margin: 20px 0;
    text-align: center;
    width: 100%;
    max-width: 300px;
}
.ad-banner-160-300,
.ad-banner-160-600 {
    margin: 20px 0;
    text-align: center;
    width: 100%;
    max-width: 160px;
}

/* Sidebar Ads */
.c-channelSidebar .ad-banner-300-250,
.c-channelSidebar .ad-banner-160-300,
.c-channelSidebar .ad-banner-160-600 {
    margin: 20px auto;
    display: block;
}

/* Content Ads — MUST BE VISIBLE */
.c-channelMain .ad-native-banner {
    margin: 25px 0;
    clear: both;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100%;
    min-height: 50px;
}

/* Social Bar Fixed Position */
.ad-social-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--bg-card, #fff);
    border-top: 1px solid var(--border-strong, #dee2e6);
    padding: 10px;
    text-align: center;
    z-index: 1000;
    box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
    color: var(--text-primary, #111827);
}

/* Ad Label */
.ad-label {
    display: block;
    font-size: 10px;
    color: var(--text-secondary, #6c757d);
    margin-bottom: 5px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* In-Content Ad Spacing */
.c-epgRow + .ad-native-banner,
.c-scheduleProgram + .ad-native-banner {
    margin-top: 30px;
    margin-bottom: 30px;
}

/* EPG Inline Ad Slot (responsive banner between program rows) */
.epg-ad-slot {
    margin: 24px 0;
    padding: 16px 0;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
    clear: both;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}
.c-epgRow + .epg-ad-slot {
    margin-top: 28px;
}

/* Responsive Breakpoints */
@media (min-width: 992px) {
    .ad-responsive .ad-desktop { display: block; }
    .ad-responsive .ad-mobile { display: none; }
}
@media (max-width: 991px) {
    .ad-responsive .ad-desktop { display: none; }
    .ad-responsive .ad-mobile { display: block; }
}
@media (max-width: 767px) {
    .ad-banner-728-90 { display: none; }
    .ad-banner-320-50 { display: block; max-width: 100%; }
    .ad-banner-300-250 { max-width: 100%; }
    .ad-banner-160-300,
    .ad-banner-160-600 { max-width: 100%; }
    .ad-social-bar { display: none !important; }
}

/* Print — Hide all ads */
@media print {
    .ad-native-banner,
    .ad-social-bar,
    .ad-banner-728-90,
    .ad-banner-320-50,
    .ad-banner-160-300,
    .ad-banner-160-600,
    .ad-banner-468-60,
    .ad-banner-300-250,
    .ad-responsive { display: none !important; }
}
