/* 移动端响应式优化 - 全局适配 */

/* 基础响应式断点 */
@media (max-width: 1024px) {
    .container {
        padding: 0 16px;
    }
}

/* 平板适配 (768px - 1024px) */
@media (max-width: 1024px) and (min-width: 769px) {
    .detail-wrapper {
        grid-template-columns: 1fr 300px;
        gap: 24px;
    }
    
    .resource-grid {
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
        gap: 20px;
    }
}

/* 移动端适配 (最大768px) */
@media (max-width: 768px) {
    /* 全局字体调整 */
    body {
        font-size: 14px;
    }
    
    .container {
        padding: 0 12px;
    }
    
    /* 详情页布局 */
    .detail-wrapper {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .detail-main {
        padding: 20px 16px;
    }
    
    .detail-header h1 {
        font-size: 20px;
        line-height: 1.4;
    }
    
    .detail-content-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .detail-cover {
        margin-bottom: 20px;
    }
    
    /* 网盘链接卡片 */
    .download-link {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        padding: 16px;
    }
    
    .link-info {
        width: 100%;
    }
    
    .link-actions {
        width: 100%;
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
    }
    
    .copy-btn,
    .edit-btn,
    .delete-btn {
        flex: 1;
        min-width: 80px;
        text-align: center;
        padding: 8px 12px;
        font-size: 13px;
    }
    
    /* 模态框适配 */
    .modal-content {
        width: 95%;
        max-width: none;
        padding: 20px 16px;
        border-radius: 16px;
        max-height: 85vh;
    }
    
    .modal-header {
        margin-bottom: 16px;
        padding-bottom: 12px;
    }
    
    .modal-header h3 {
        font-size: 18px;
    }
    
    .modal-body {
        margin-bottom: 16px;
    }
    
    .form-group {
        margin-bottom: 16px;
    }
    
    .form-group label {
        font-size: 13px;
        margin-bottom: 6px;
    }
    
    .form-group input,
    .form-group textarea,
    .form-group select {
        padding: 10px 12px;
        font-size: 14px;
    }
    
    .form-group textarea {
        min-height: 80px;
    }
    
    .modal-footer {
        display: flex;
        gap: 8px;
        flex-direction: column-reverse;
    }
    
    .modal-footer .btn {
        width: 100%;
        padding: 12px;
        font-size: 14px;
    }
    
    /* 签到弹窗适配 */
    .checkin-modal-content {
        width: 95%;
        max-width: none;
        border-radius: 16px;
    }
    
    .checkin-modal-body {
        padding: 16px;
    }
    
    .checkin-stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    
    .stat-item {
        padding: 12px 8px;
    }
    
    .stat-icon {
        font-size: 20px;
        margin-bottom: 6px;
    }
    
    .stat-value {
        font-size: 20px;
    }
    
    .stat-label {
        font-size: 11px;
    }
    
    .calendar-days {
        gap: 4px;
    }
    
    .calendar-day {
        font-size: 12px;
    }
    
    .reward-tabs {
        flex-direction: column;
        gap: 8px;
    }
    
    .reward-tab {
        width: 100%;
    }
    
    .reward-item {
        padding: 12px;
    }
    
    .reward-icon {
        width: 36px;
        height: 36px;
        font-size: 18px;
    }
    
    .reward-title {
        font-size: 13px;
    }
    
    .reward-desc {
        font-size: 11px;
    }
    
    .reward-value {
        font-size: 14px;
    }
    
    /* 侧边栏 */
    .detail-sidebar {
        order: -1;
    }
    
    .sidebar-section {
        padding: 16px;
    }
    
    .sidebar-item {
        padding: 8px;
    }
    
    .sidebar-item img {
        width: 60px;
        height: 90px;
    }
    
    .sidebar-item-title {
        font-size: 12px;
    }
    
    /* 资源网格 */
    .resource-grid {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
        gap: 12px;
    }
    
    .resource-card .card-image {
        height: 140px;
    }
    
    .resource-card .card-content {
        padding: 12px;
    }
    
    .resource-card .card-title {
        font-size: 14px;
        margin-bottom: 8px;
    }
    
    .resource-card .card-meta {
        margin-top: 8px;
        padding-top: 8px;
    }
    
    .category-badge {
        font-size: 11px;
        padding: 3px 8px;
    }
    
    .view-count {
        font-size: 11px;
    }
    
    /* 分类标签 */
    .category-tabs {
        gap: 8px;
        margin-bottom: 20px;
    }
    
    .tab-btn {
        padding: 8px 14px;
        font-size: 13px;
    }
    
    /* 分页 */
    .pagination {
        gap: 8px;
        margin-top: 32px;
        flex-wrap: wrap;
    }
    
    .page-btn {
        padding: 8px 14px;
        font-size: 13px;
    }
    
    .page-number {
        min-width: 32px;
        height: 32px;
        font-size: 13px;
    }
    
    /* 表格适配 */
    .data-table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    .data-table table {
        min-width: 600px;
    }
    
    .data-table th,
    .data-table td {
        padding: 8px;
        font-size: 12px;
    }
    
    /* 管理后台适配 */
    .admin-layout {
        flex-direction: column;
    }
    
    .admin-sidebar {
        width: 100%;
        position: static;
        height: auto;
    }
    
    .admin-main {
        margin-left: 0;
        padding: 16px;
    }
    
    .admin-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        padding: 16px;
    }
    
    .admin-card {
        padding: 16px;
    }
    
    .card-header h3 {
        font-size: 16px;
    }
    
    /* 表单适配 */
    .form-row {
        flex-direction: column;
        gap: 16px;
    }
    
    .form-col {
        width: 100%;
    }
    
    /* 按钮组适配 */
    .btn-group {
        flex-direction: column;
        gap: 8px;
    }
    
    .btn-group .btn {
        width: 100%;
    }
    
    /* 统计卡片 */
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    
    .stat-card {
        padding: 16px;
    }
    
    .stat-card .stat-value {
        font-size: 24px;
    }
    
    .stat-card .stat-label {
        font-size: 12px;
    }
}

/* 小屏手机适配 (最大480px) */
@media (max-width: 480px) {
    body {
        font-size: 13px;
    }
    
    .container {
        padding: 0 10px;
    }
    
    /* 详情页 */
    .detail-main {
        padding: 16px 12px;
    }
    
    .detail-header h1 {
        font-size: 18px;
    }
    
    .meta-item {
        font-size: 12px !important;
        padding: 4px 8px;
    }
    
    /* 网盘链接 */
    .download-link {
        padding: 12px;
    }
    
    .link-name {
        font-size: 13px;
    }
    
    .link-url {
        font-size: 12px;
    }
    
    .copy-btn {
        padding: 8px 10px;
        font-size: 12px;
    }
    
    /* 模态框 */
    .modal-content {
        width: 98%;
        padding: 16px 12px;
    }
    
    .modal-header h3 {
        font-size: 16px;
    }
    
    .form-group input,
    .form-group textarea,
    .form-group select {
        padding: 8px 10px;
        font-size: 13px;
    }
    
    /* 签到弹窗 */
    .checkin-modal-body {
        padding: 12px;
    }
    
    .checkin-stats {
        gap: 8px;
    }
    
    .stat-item {
        padding: 10px 6px;
    }
    
    .stat-value {
        font-size: 18px;
    }
    
    .stat-label {
        font-size: 10px;
    }
    
    .calendar-days {
        gap: 2px;
    }
    
    .calendar-day {
        font-size: 11px;
    }
    
    .weekday {
        font-size: 11px;
        padding: 6px 0;
    }
    
    /* 资源网格 */
    .resource-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    
    .resource-card .card-image {
        height: 180px;
    }
    
    /* 分类标签 */
    .category-tabs {
        gap: 6px;
    }
    
    .tab-btn {
        padding: 6px 12px;
        font-size: 12px;
    }
    
    /* 统计卡片 */
    .stats-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    
    /* 侧边栏 */
    .sidebar-section {
        padding: 12px;
    }
    
    .sidebar-item img {
        width: 50px;
        height: 75px;
    }
    
    .sidebar-item-title {
        font-size: 11px;
    }
    
    .sidebar-item-meta {
        font-size: 10px;
    }
}

/* 横屏适配 */
@media (max-height: 600px) and (orientation: landscape) {
    .modal-content,
    .checkin-modal-content {
        max-height: 95vh;
        overflow-y: auto;
    }
    
    .checkin-stats {
        grid-template-columns: repeat(4, 1fr);
    }
    
    .calendar-days {
        gap: 4px;
    }
}

/* 触摸优化 */
@media (hover: none) and (pointer: coarse) {
    /* 增大可点击区域 */
    .btn,
    .tab-btn,
    .page-btn,
    .copy-btn,
    .edit-btn,
    .delete-btn {
        min-height: 44px;
        padding: 10px 16px;
    }
    
    .calendar-day {
        min-height: 40px;
    }
    
    .sidebar-item,
    .resource-card {
        min-height: 44px;
    }
    
    /* 移除hover效果 */
    .resource-card:hover,
    .download-link:hover,
    .sidebar-item:hover {
        transform: none;
    }
}

/* 防止文本选择（移动端） */
@media (max-width: 768px) {
    .btn,
    .tab-btn,
    .page-btn,
    .calendar-day {
        -webkit-user-select: none;
        user-select: none;
        -webkit-tap-highlight-color: transparent;
    }
}

/* 滚动条优化（移动端） */
@media (max-width: 768px) {
    ::-webkit-scrollbar {
        width: 4px;
        height: 4px;
    }
    
    ::-webkit-scrollbar-track {
        background: transparent;
    }
    
    ::-webkit-scrollbar-thumb {
        background: rgba(255, 255, 255, 0.2);
        border-radius: 2px;
    }
    
    :root[data-theme="light"] ::-webkit-scrollbar-thumb {
        background: rgba(0, 0, 0, 0.2);
    }
}
