/* ============================================
   移动端专用样式优化
   ============================================ */

/* 全局移动端优化 */
@media (max-width: 767px) {
    /* 禁用文本选择（除了输入框） */
    * {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
    
    input, textarea {
        -webkit-user-select: text;
        -moz-user-select: text;
        -ms-user-select: text;
        user-select: text;
    }
    
    /* 优化滚动 */
    body {
        -webkit-overflow-scrolling: touch;
    }
    
    /* 页面标题优化 */
    .page-title {
        font-size: 20px !important;
        font-weight: 600;
    }
    
    /* 卡片间距优化 */
    .word-card, .module-card, .test-card {
        margin-bottom: 12px;
    }
    
    /* 按钮组优化 */
    .action-buttons {
        -webkit-box-orient: vertical; /* iOS Safari 兼容 */
        -webkit-box-direction: normal; /* iOS Safari 兼容 */
        -webkit-flex-direction: column; /* iOS Safari 兼容 */
        flex-direction: column;
        gap: 12px;
    }
    
    /* iOS 14.5以下兼容：gap fallback */
    @supports not (gap: 12px) {
        .action-buttons > * + * {
            margin-top: 12px;
        }
    }
    
    .action-buttons button,
    .action-buttons .btn {
        width: 100%;
        min-height: 48px;
    }
    
    /* 表单优化 */
    .form-group {
        margin-bottom: 20px;
    }
    
    .form-group input,
    .form-group textarea,
    .form-group select {
        font-size: 16px; /* 防止iOS自动缩放 */
        min-height: 48px;
    }
    
    /* 模态框优化 */
    .modal-content {
        width: 90% !important;
        max-width: 90% !important;
        margin: 20px auto !important;
        max-height: 90vh;
        overflow-y: auto;
    }
    
    /* 抽屉优化 */
    .drawer-content {
        max-height: 85vh;
    }
    
    /* 底部固定栏安全区域适配 */
    .bottom-fixed-bar,
    .bottom-nav {
        padding-bottom: env(safe-area-inset-bottom);
        padding-bottom: -webkit-env(safe-area-inset-bottom); /* iOS Safari 兼容 */
    }
    
    /* 顶部安全区域适配 */
    .page-header {
        padding-top: calc(16px + env(safe-area-inset-top));
        padding-top: calc(16px + -webkit-env(safe-area-inset-top)); /* iOS Safari 兼容 */
    }
}

/* 超小屏幕优化 */
@media (max-width: 360px) {
    .container {
        padding: 12px;
    }
    
    .word-text {
        font-size: 14px;
    }
    
    .word-phonetic {
        font-size: 12px;
    }
    
    .module-card {
        padding: 20px 16px;
    }
    
    .module-icon {
        font-size: 36px;
    }
}

/* 横屏优化 */
@media (max-width: 767px) and (orientation: landscape) {
    .home-header {
        padding: 12px 0;
        margin-bottom: 16px;
    }
    
    .module-card {
        padding: 20px;
        min-height: 100px;
    }
    
    .bottom-nav {
        padding: 8px 16px;
    }
}

/* 触摸优化 */
@media (hover: none) and (pointer: coarse) {
    /* 移除所有hover效果，使用active替代 */
    *:hover {
        transform: none !important;
    }
    
    /* 按钮点击反馈 */
    button:active,
    .btn:active,
    .action-btn:active,
    .module-card:active {
        opacity: 0.8;
        transform: scale(0.98);
    }
}

/* 高DPI屏幕优化 */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .word-card,
    .module-card {
        border: 0.5px solid rgba(0, 0, 0, 0.1);
    }

    /* 确保词汇量检测卡片在高DPI屏幕上保持3px边框 */
    .module-card-vocabulary-test {
        border-width: 3px !important;
        border-style: solid !important;
        border-color: var(--card-border-blue-color) !important;
    }

    /* 确保单词速记卡片在高DPI屏幕上保持5px边框 */
    .module-card-word-memory {
        border-width: 3px !important;
        border-style: solid !important;
        border-color: var(--card-border-purple-color) !important;
    }

}