/**
 * Responsive Styles
 */

/* Large screens */
@media (min-width: 1200px) {
    :root {
        --container-max: 1800px;
    }
}

/* Desktop */
@media (min-width: 992px) {
    .mobile-only {
        display: none !important;
    }

    .navbar__search {
        margin-left: var(--space-lg);
    }
}

/* Tablet */
@media (max-width: 991px) {
    .desktop-only {
        display: none !important;
    }

    .layout-two-col {
        grid-template-columns: 1fr;
    }

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

    .filter-form__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .footer-widgets {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Mobile landscape */
@media (max-width: 767px) {
    :root {
        --space-xl: 1.5rem;
        --space-2xl: 2rem;
    }

    .navbar__inner {
        gap: var(--space-sm);
    }

    .navbar__search {
        margin-left: auto;
    }

    .video-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .sidebar-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .filter-form__grid {
        grid-template-columns: 1fr 1fr;
    }

    .footer-widgets {
        grid-template-columns: 1fr;
    }

    .preference-panel__inner {
        flex-direction: column;
        align-items: flex-start;
    }

    .single-video__title {
        font-size: var(--font-size-xl);
    }
}

/* Mobile portrait */
@media (max-width: 479px) {
    :root {
        --grid-gap: 10px;
    }

    .container {
        padding-inline: var(--space-sm);
    }

    .navbar__brand {
        max-width: 120px;
        overflow: hidden;
    }

    .navbar__logo-text {
        font-size: var(--font-size-sm);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .video-card__title {
        font-size: var(--font-size-xs);
    }

    .video-card__meta {
        font-size: 10px;
    }

    .filter-form__grid {
        grid-template-columns: 1fr;
    }

    .btn:not(.navbar__menu):not(.navbar__hamburger):not(.sidebar__close):not(.sort-dropdown__toggle):not(.search-form__toggle):not(.js-reset-filters):not(.mobile-nav__close) {
        width: 100%;
    }

    .single-video__meta a.tag-group {
        width: 100%;
        justify-content: center;
    }

    /* Sidebar full-height panel on mobile */
    .sidebar__container {
        top: 0;
        left: 0;
        bottom: 0;
        width: calc(100vw - 60px);
        max-width: 350px;
        border-radius: 0;
        background: hsl(0 0% 6%);
        box-shadow: 0 8px 32px hsl(0 0% 0% / 0.6);
        border: none;
        border-right: 1px solid hsl(220 10% 20% / 0.4);
    }

    .sidebar__header {
        border-radius: 0;
    }

    /* Section header stacks on mobile */
    .section-header {
        flex-wrap: wrap;
    }

    .section-title {
        font-size: var(--font-size-lg);
    }

    /* Sort dropdown adjustments */
    .sort-dropdown__toggle {
        padding: 0 var(--space-sm);
        font-size: var(--font-size-xs);
    }

    .sort-dropdown__label {
        max-width: 70px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

/* Touch device optimizations */
@media (hover: none) and (pointer: coarse) {
    /* Larger touch targets */
    .btn {
        min-height: 44px;
        min-width: 44px;
    }

    .form-input,
    .form-select {
        min-height: 44px;
    }

    .pagination__item {
        min-height: 44px;
        min-width: 44px;
    }

    /* Preview is handled via JS touch events, not CSS hover */
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .video-card__preview {
        display: none !important;
    }
}

/* High contrast mode */
@media (prefers-contrast: high) {
    :root {
        --color-border: hsl(0, 0%, 50%);
        --color-text-muted: hsl(0, 0%, 80%);
    }

    .btn,
    .form-input,
    .form-select {
        border-width: 2px;
    }
}

/* Print styles */
@media print {
    .navbar,
    .site-footer,
    .preference-panel,
    .filter-form,
    .pagination,
    .video-card__preview,
    .admin-tools,
    .sidebar {
        display: none !important;
    }

    body {
        background: white;
        color: black;
    }

    .video-card {
        break-inside: avoid;
    }
}