/* ========================================
   CimaLive - Responsive Styles
   ======================================== */

@media (max-width: 1100px) {
    .page-wrapper { grid-template-columns: 1fr; }
    .sp-container { grid-template-columns: 1fr; }
    .sidebar { position: static; flex-direction: row; flex-wrap: wrap; }
    .widget { flex: 1; min-width: 280px; }
    .single-hero-grid { grid-template-columns: 200px 1fr; }
}

@media (max-width: 992px) {
    .preview-content { grid-template-columns: 1fr; max-width: 500px; }
    .preview-poster { min-height: 300px; }
    .preview-info { padding: 1.5rem; }
    .footer-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 768px) {
    .header-top { padding: 0.7rem 0; }
    .search-box { order: 3; max-width: 100%; margin-top: 0.8rem; flex-basis: 100%; }
    .mobile-toggle { display: block; }

    /* Centered header mobile */
    .header--centered .header-top { flex-direction: column; }
    .header--centered .search-box { order: 3; margin-top: 0; }

    /* Minimal header mobile */
    .header--minimal .search-box input { background: var(--bg-tertiary); border-color: var(--border); }

    /* Transparent header mobile */
    .header--transparent .search-box input { background: rgba(255,255,255,0.1); }
    .header--transparent.header--scrolled .search-box input { background: var(--bg-tertiary); }

    /* Video header mobile */
    .header--video .header-top { padding: 0.7rem 0; }
    .header-video-bg video { filter: brightness(0.25) saturate(1.2); }

    .nav-bar {
        position: fixed; top: 0; right: 0; left: 0; bottom: 0;
        background: var(--bg-card); max-height: 0; overflow: hidden;
        transition: max-height 0.35s ease; z-index: 999; backdrop-filter: blur(20px);
    }
    .nav-bar.active { max-height: 100vh; overflow-y: auto; top: 70px; }
    .nav-list { flex-direction: column; align-items: stretch; padding: 0.6rem; }
    .nav-link { padding: 0.9rem 1.2rem; }

    .dropdown {
        position: static; opacity: 1; visibility: visible; transform: none;
        box-shadow: none; border: none; background: var(--bg-tertiary);
        margin-right: 0.8rem; margin-top: 0.4rem; border-radius: var(--radius-md);
        display: none;
    }
    .nav-item:hover .dropdown { display: block; }

    .hero { height: auto; min-height: 420px; padding: 2rem 1rem; }
    .hero-content { max-width: 100%; padding: 0; text-align: center; }
    .hero::after { display: none; }
    .hero-actions { justify-content: center; }
    .hero-meta { justify-content: center; }
    .hero-nav { display: none; }

    .single-hero-grid { grid-template-columns: 1fr; text-align: center; }
    .single-poster { max-width: 200px; margin: 0 auto; }
    .single-badges { justify-content: center; }
    .single-meta { justify-content: center; }
    .single-genres { justify-content: center; }
    .single-actions { justify-content: center; }
    .single-title { font-size: 1.6rem; }

    /* Single Post TopCiema responsive */
    .sp-flex { flex-direction: column; align-items: center; text-align: center; }
    .sp-col-poster { width: 220px; }
    .sp-media-list { text-align: right; }
    .sp-media-item { flex-direction: column; gap: 0.3rem; }
    .sp-media-label { width: auto; }
    .sp-action-buttons { flex-direction: row !important; }
    .sp-btn-action { width: auto; flex: 1; padding: 0.7rem 1rem; font-size: 0.85rem; }
    .sp-title { font-size: 1.4rem; text-align: center; }

    .cards-grid { grid-template-columns: repeat(auto-fill, minmax(145px, 1fr)); gap: 1.1rem; }

    .filters-form { flex-direction: column; }
    .filter-group { min-width: 100%; }

    /* Range filters */
    .filters-range-row { flex-direction: column; gap: 1rem; }
    .filter-range-group { min-width: 100%; }
    .filter-reset-btn { width: 100%; }

    /* Schedule */
    .schedule-tabs { gap: 0.3rem; }
    .schedule-tab { min-width: 70px; padding: 0.6rem 0.8rem; }
    .schedule-tab-day { font-size: 0.78rem; }
    .schedule-item { flex-wrap: wrap; gap: 0.7rem; padding: 0.8rem; }
    .schedule-time { flex-direction: row; min-width: auto; gap: 0.3rem; font-size: 0.85rem; }
    .schedule-poster { width: 45px; height: 62px; }
    .schedule-action { width: 100%; text-align: center; }
    .schedule-action .btn-sm { width: 100%; justify-content: center; }

    .footer-grid { grid-template-columns: 1fr; text-align: center; }
    .social-links { justify-content: center; }
    .footer-links { align-items: center; }
    .footer-bottom { flex-direction: column; text-align: center; }
}

@media (max-width: 480px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); gap: 0.8rem; }
    .card-poster-ultra { aspect-ratio: 2/3; }
    .hero-title { font-size: 1.7rem; }
    .section-title { font-size: 1.3rem; }
    .preview-title { font-size: 1.5rem; }
    .btn { padding: 0.6rem 1.2rem; font-size: 0.85rem; }
    .archive-title { font-size: 1.5rem; }
    .error-404-number { font-size: 5rem; }
    .single-title { font-size: 1.4rem; }
    .episode-card { flex-direction: column; align-items: flex-start; }
    .episode-servers { width: 100%; }
}

/* Print styles */
@media print {
    .header, .footer, .sidebar, .hero-nav, .hero-dots,
    .preview-modal, .loading, .skip-link, .filters-bar { display: none !important; }
    body { background: #fff; color: #000; }
    .page-wrapper { grid-template-columns: 1fr; }
}