/* ============================================
   移动端边距优化
   ============================================ */

/* 小屏幕（手机） - 减小容器边距 */
@media (max-width: 640px) {
    /* 主容器边距优化 */
    .container {
        padding-left: 0.75rem !important;  /* 从 1rem 减到 0.75rem (12px) */
        padding-right: 0.75rem !important;
    }

    /* 进一步优化内容区域 */
    main.container {
        padding-left: 0.5rem !important;   /* 8px */
        padding-right: 0.5rem !important;
    }

    /* 卡片内边距优化 */
    .card,
    .video-card,
    .movie-card,
    .article-card {
        margin-left: 0;
        margin-right: 0;
    }

    /* 网格间距优化 */
    .grid {
        gap: 0.75rem !important;  /* 从默认的 1.5rem 减到 0.75rem */
    }

    /* Section 内边距优化 */
    .space-y-6 > * + * {
        margin-top: 1rem !important;  /* 减小垂直间距 */
    }

    /* 分类卡片边距优化 */
    .category-card {
        padding: 0.75rem !important;
        margin-bottom: 0.75rem !important;
    }

    /* 视频/电影卡片边距优化 */
    .video-card .p-4,
    .movie-card .p-4,
    .article-card .p-4 {
        padding: 0.75rem !important;
    }

    /* 搜索框区域优化 */
    .search-container {
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }

    /* 导航栏边距优化 */
    .navbar .container {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }

    /* 标签云区域优化 */
    .tags-container {
        padding: 0.75rem !important;
    }

    /* 统计卡片优化 */
    .stats-card {
        padding: 0.75rem !important;
        margin-bottom: 0.75rem !important;
    }

    /* Hero区域优化 */
    .hero-section {
        padding: 1.5rem 0.75rem !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border-radius: 0.5rem !important;
    }

    /* 播放页面优化 */
    .player-container {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* 评论区域优化 */
    .comment-section {
        padding: 0.75rem !important;
    }

    /* 侧边栏优化 */
    .sidebar {
        padding: 0.75rem !important;
    }

    /* 演员列表优化 */
    .actor-grid {
        padding: 0.5rem !important;
        gap: 0.5rem !important;
    }

    /* 标签列表优化 */
    .tag-item {
        padding: 0.5rem 0.75rem !important;
        margin: 0.25rem !important;
    }

    /* 文章内容区域优化 */
    .article-content {
        padding: 0.75rem !important;
    }

    /* 分页区域优化 */
    .pagination {
        padding: 0.75rem !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* 筛选器区域优化 */
    .filter-section {
        padding: 0.75rem !important;
        margin-bottom: 0.75rem !important;
    }

    /* 面包屑导航优化 */
    .breadcrumb {
        padding: 0.5rem 0.75rem !important;
        margin-bottom: 0.75rem !important;
    }

    /* Modal/弹窗内边距优化 */
    .modal-content {
        padding: 1rem !important;
        margin: 0.5rem !important;
    }

    /* Footer 优化 */
    footer.container {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }
}

/* 超小屏幕（小手机）- 进一步减小边距 */
@media (max-width: 375px) {
    .container,
    main.container {
        padding-left: 0.5rem !important;  /* 8px */
        padding-right: 0.5rem !important;
    }

    .grid {
        gap: 0.5rem !important;
    }

    .card,
    .video-card,
    .movie-card,
    .article-card {
        padding: 0.5rem !important;
    }

    /* 视频卡片标题字体优化 */
    .movie-title,
    .video-title,
    .article-title {
        font-size: 0.875rem !important;
        line-height: 1.25rem !important;
    }

    /* 按钮尺寸优化 */
    .btn {
        padding: 0.5rem 1rem !important;
        font-size: 0.875rem !important;
    }
}

/* 中等屏幕（平板）- 适度优化 */
@media (min-width: 641px) and (max-width: 768px) {
    .container {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    main.container {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }

    .grid {
        gap: 1rem !important;
    }
}

/* 修复可能的布局问题 */
@media (max-width: 640px) {
    /* 确保图片不溢出 */
    img {
        max-width: 100%;
        height: auto;
    }

    /* 视频播放器响应式 */
    video,
    iframe {
        max-width: 100%;
        height: auto;
    }

    /* 表格横向滚动 */
    .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* 防止长文本溢出 */
    .text-overflow {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* Flex布局优化 */
    .flex-wrap-mobile {
        flex-wrap: wrap !important;
    }

    /* 隐藏移动端不必要的元素 */
    .hide-mobile {
        display: none !important;
    }
}

/* ============================================
   卡片网格优化（提高空间利用率）
   ============================================ */
@media (max-width: 640px) {
    /* 2列网格布局 */
    .grid-cols-2,
    .grid-cols-3,
    .grid-cols-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    /* 单列布局（某些特殊情况） */
    .grid-cols-1-mobile {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    }
}

/* ============================================
   性能优化
   ============================================ */
@media (max-width: 640px) {
    /* 减少动画和过渡效果以提高性能 */
    * {
        animation-duration: 0.2s !important;
        transition-duration: 0.2s !important;
    }

    /* 禁用不必要的阴影效果 */
    .disable-shadow-mobile {
        box-shadow: none !important;
    }
}