/**
 * 移动端优化样式 - 增强版
 * 针对手机端访问的全面优化
 */

/* ========== 顶部栏响应式 ========== */
.header-bar-short {
    display: none;
}

@media (max-width: 640px) {
    .header-bar-text {
        display: none;
    }
    .header-bar-short {
        display: inline;
    }
}

/* ========== 基础移动端优化 ========== */
@media (max-width: 768px) {
    /* 防止横向滚动 */
    body {
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
    }

    /* 顶部bar优化 - 小屏幕隐藏部分文字 */
    .header-bar {
        font-size: 11px;
        padding: 3px 8px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* Logo优化 */
    .logo-emblem img {
        height: 32px;
        max-width: 140px;
    }

    /* 主内容区顶部间距调整 */
    .main {
        margin-top: 88px;
    }

    /* Hero区域优化 */
    .hero-banner {
        padding: 28px 16px 40px;
    }

    .hero-title {
        font-size: 24px;
        line-height: 1.3;
    }

    .hero-subtitle {
        font-size: 13px;
        margin-bottom: 20px;
    }

    /* 搜索框优化 */
    .hero-search {
        margin-bottom: 20px;
    }

    .hero-search-box {
        flex-direction: column;
        padding: 10px;
        gap: 8px;
    }

    .hero-search-input {
        width: 100%;
        padding: 12px 14px;
        font-size: 16px;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
    }

    .hero-search-btn {
        width: 100%;
        padding: 12px 20px;
        font-size: 15px;
    }

    /* 统计栏优化 */
    .stats-bar {
        gap: 8px;
    }

    .stat-item {
        min-width: calc(50% - 4px);
        padding: 12px 8px;
        border-radius: 10px;
    }

    .stat-num {
        font-size: 22px;
    }

    .stat-label {
        font-size: 11px;
    }

    /* 分类网格 - 4列 */
    .category-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
    }

    .category-card {
        padding: 12px 4px 10px;
    }

    .category-icon {
        width: 36px;
        height: 36px;
        font-size: 16px;
        border-radius: 10px;
    }

    .category-name {
        font-size: 11px;
    }

    .category-count {
        display: none;
    }

    /* 社团/企业网格 - 2列 */
    .assoc-grid,
    .company-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    /* 供需/新闻网格 - 单列 */
    .board-grid,
    .news-grid,
    .job-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    /* 卡片内边距优化 */
    .assoc-card,
    .company-card,
    .board-card,
    .job-card,
    .news-card {
        border-radius: 10px;
    }

    .assoc-card,
    .company-card {
        padding: 14px;
    }

    /* 首页地图区域优化 */
    .home-map-container {
        flex-direction: column !important;
        gap: 16px;
    }

    .home-map-container > div {
        width: 100% !important;
        min-width: unset !important;
    }

    .home-map-panel {
        padding: 14px !important;
    }

    #home-map-world,
    #home-map-china {
        height: 260px !important;
    }

    #home-assoc-list-container {
        max-height: 280px !important;
    }

    /* 按钮触摸区域优化 */
    .btn {
        min-height: 44px;
        padding: 10px 18px;
    }

    .btn-blue,
    .btn-primary {
        min-height: 48px;
    }

    /* 表单元素优化 */
    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="tel"],
    input[type="number"],
    input[type="search"],
    textarea,
    select {
        font-size: 16px !important;
        padding: 12px 14px;
    }

    /* Tab导航优化 */
    .assoc-tab-nav {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .assoc-tab-nav::-webkit-scrollbar {
        display: none;
    }

    .assoc-tab-item {
        padding: 12px 16px;
        font-size: 13px;
        white-space: nowrap;
    }

    /* 详情页优化 */
    .assoc-detail-header,
    .detail-card {
        padding: 16px;
        border-radius: 12px;
    }

    .assoc-title-row {
        flex-direction: column;
        gap: 12px;
    }

    .assoc-logo-box {
        width: 56px;
        height: 56px;
        font-size: 22px;
    }

    /* 分页优化 */
    .jobs-pagination,
    .pagination-nav {
        gap: 4px;
    }

    .page-num,
    .page-btn {
        min-width: 36px;
        height: 36px;
        font-size: 13px;
    }

    /* 模态框优化 */
    .modal {
        max-width: calc(100% - 24px);
        border-radius: 14px;
    }

    .modal-header {
        padding: 14px 16px;
    }

    .modal-body {
        padding: 16px;
    }

    /* Toast优化 */
    .toast-container {
        top: 80px;
        right: 12px;
        left: 12px;
    }

    /* 触摸反馈优化 */
    a, button {
        -webkit-tap-highlight-color: transparent;
    }

    a:active, button:active {
        opacity: 0.8;
    }

    /* 文字换行优化 */
    .category-name,
    .assoc-info h4,
    .company-info h4,
    .board-card-title,
    .job-title,
    .news-title {
        word-break: break-word;
        overflow-wrap: break-word;
    }
}

/* ========== 小屏手机优化 (<480px) ========== */
@media (max-width: 480px) {
    :root {
        --container-padding: 12px;
    }

    /* 顶部bar更紧凑 */
    .header-bar {
        font-size: 10px;
        padding: 2px 6px;
    }

    .main {
        margin-top: 84px;
    }

    /* Hero更紧凑 */
    .hero-banner {
        padding: 24px 12px 32px;
    }

    .hero-title {
        font-size: 20px;
    }

    .hero-subtitle {
        font-size: 12px;
    }

    /* 统计栏2x2布局 */
    .stat-item {
        min-width: calc(50% - 4px);
        padding: 10px 6px;
    }

    .stat-num {
        font-size: 18px;
    }

    /* 分类网格更紧凑 */
    .category-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 6px;
    }

    .category-card {
        padding: 10px 2px 8px;
    }

    .category-icon {
        width: 32px;
        height: 32px;
        font-size: 14px;
        border-radius: 8px;
    }

    .category-name {
        font-size: 10px;
    }

    /* 社团/企业单列 */
    .assoc-grid,
    .company-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    /* 卡片更紧凑 */
    .assoc-card,
    .company-card,
    .board-card,
    .job-card {
        padding: 12px;
        border-radius: 8px;
    }

    /* 地图更小 */
    #home-map-world,
    #home-map-china {
        height: 220px !important;
    }

    /* 模态框全屏 */
    .modal {
        max-width: 100%;
        border-radius: 0;
        max-height: 100vh;
    }

    /* 分页更紧凑 */
    .page-num,
    .page-btn {
        min-width: 32px;
        height: 32px;
        font-size: 12px;
        padding: 0 8px;
    }

    /* 底部安全区域 */
    .footer {
        padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px));
    }
}

/* ========== 平板优化 (768px-1024px) ========== */
@media (min-width: 769px) and (max-width: 1024px) {
    .category-grid {
        grid-template-columns: repeat(4, 1fr);
    }

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

    .home-map-container {
        flex-direction: column !important;
    }

    .home-map-container > div {
        width: 100% !important;
    }
}

/* ========== 横屏手机优化 ========== */
@media screen and (max-width: 768px) and (orientation: landscape) {
    .hero-banner {
        padding: 20px 16px 28px;
    }

    .hero-title {
        font-size: 22px;
    }

    .stats-bar {
        flex-wrap: nowrap;
    }

    .stat-item {
        flex: 1;
        min-width: auto;
    }

    #home-map-world,
    #home-map-china {
        height: 180px !important;
    }
}

/* ========== 辅助类 ========== */
.hidden-mobile {
    display: block;
}

.visible-mobile {
    display: none;
}

@media (max-width: 768px) {
    .hidden-mobile {
        display: none !important;
    }

    .visible-mobile {
        display: block !important;
    }

    .visible-mobile-flex {
        display: flex !important;
    }
}
