/* 主内容区域 - 55寸触摸屏适配 */
/* 适配分辨率: 1080x1920 (竖屏) */

/* ========================================
   适配说明:
   - 屏幕分辨率: 1080 x 1920
   - 可用屏幕: 1080 x 1880
   - 视口大小: 1080 x 1810
   - DPR: 1
   - 屏幕方向: portrait (竖屏)
   - 设备类型: desktop 触摸屏
   ======================================== */

@media (min-width: 1080px) and (orientation: portrait) {
    /* ====================================== */
    /* 主内容区域基础布局 */
    /* ====================================== */
    .main-content {
        padding: 0 80px 200px; /* 增大内边距,适配大屏触摸操作 */
        height: calc(100vh - 80px - 100px); /* 调整顶部导航和输入栏高度 */
    }

    /* ====================================== */
    /* 欢迎区域 (greeting-section) */
    /* ====================================== */
    .greeting-section {
        margin-top: 40px; /* 增加顶部间距 */
        margin-bottom: 50px; /* 增加底部间距 */
        padding: 0 20px; /* 添加左右内边距 */
        gap: 30px; /* 增加元素间距 */
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .greeting-text {
        flex: 1;
        min-width: 0; /* 允许收缩 */
        padding-left: 40px; /* 55寸屏幕增加左侧内边距 */
    }

    .greeting-text h1 {
        font-size: 56px; /* 放大标题 - 从28px到56px (2倍) */
        margin-bottom: 15px; /* 增加底部间距 */
        letter-spacing: -0.8px; /* 调整字间距 */
        font-weight: 500; /* 加粗字体 */
        white-space: normal; /* 大屏允许换行 */
        overflow: visible;
    }

    .greeting-message {
        font-size: 32px; /* 放大问候语 - 从16px到32px (2倍) */
        letter-spacing: 0.4px;
        font-weight: 600; /* 加粗渐变文字 */
        line-height: 1.4;
        white-space: normal; /* 大屏允许换行 */
        overflow: visible;
    }

    .character-image {
        width: 250px; /* 放大图片区域 - 从125px到250px (2倍) */
        height: 184px; /* 从92px到184px (2倍) */
        flex-shrink: 0; /* 防止图片被压缩 */
    }

    .character-image img {
        width: 100%;
        height: 100%;
        object-fit: contain; /* 确保图片完整显示 */
        filter: drop-shadow(0 4px 16px rgba(123, 107, 214, 0.2)); /* 增强阴影 */
    }

    /* ====================================== */
    /* 我的健康卡片 */
    /* ====================================== */
    .health-card {
        border-radius: 28px; /* 增大圆角 - 从16px到28px */
        padding: 26px 30px; /* 增大内边距 - 从13px到26px */
        margin-bottom: 28px; /* 增加卡片间距 */
        box-shadow: 0 4px 24px rgba(123, 107, 214, 0.12), 
                    0 0 2px rgba(0, 0, 0, 0.1);
        border: 1px solid rgba(255, 255, 255, 0.9); /* 增强边框 */
    }

    .health-card:active {
        box-shadow: 0 6px 32px rgba(123, 107, 214, 0.18), 
                    0 0 2px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

    .health-header {
        min-height: 64px; /* 增大高度 - 从32px到64px */
    }

    .health-icon {
        width: 7px; /* 放大图标 - 从3.5px到7px */
        height: 32px; /* 从16px到32px */
        border-radius: 4px;
        box-shadow: 0 2px 6px rgba(123, 107, 214, 0.4);
    }

    .health-text {
        font-size: 31px; /* 放大标题 - 从15.5px到31px (2倍) */
        font-weight: 700; /* 加粗 */
        letter-spacing: 0.4px;
    }

    .health-data-btn {
        border-radius: 28px; /* 增大圆角 - 从14px到28px */
        padding: 14px 28px; /* 放大按钮 - 从6px 12px到14px 28px */
        font-size: 26px; /* 放大字体 - 从12.5px到26px (2倍+) */
        font-weight: 600;
        gap: 10px; /* 增加间距 */
        min-height: 56px; /* 触摸屏友好的最小高度 */
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
    }

    .health-data-btn:active {
        background: rgba(215, 215, 225, 0.98);
        transform: scale(0.95);
        box-shadow: 0 3px 12px rgba(0, 0, 0, 0.12);
    }

    .arrow-down {
        font-size: 20px; /* 放大箭头 - 从9px到20px */
        color: #888;
    }

    /* ====================================== */
    /* 问题卡片列表 */
    /* ====================================== */
    .question-cards {
        gap: 24px; /* 增大卡片间距 - 从11px到24px */
        margin-top: 28px; /* 增加顶部间距 */
    }

    .question-card {
        border-radius: 28px; /* 增大圆角 - 从15px到28px */
        padding: 28px 32px; /* 放大内边距 - 从14px 16px到28px 32px */
        gap: 26px; /* 增大元素间距 - 从13px到26px */
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08), 
                    0 2px 6px rgba(0, 0, 0, 0.05);
        border: 1px solid rgba(240, 240, 245, 0.9);
        min-height: 100px; /* 触摸屏友好的最小高度 */
    }

    .question-card:active {
        box-shadow: 0 8px 40px rgba(123, 107, 214, 0.18);
        transform: scale(0.98) translateY(-2px);
    }

    .question-icon {
        width: 72px; /* 放大图标 - 从36px到72px (2倍) */
        height: 72px;
        border-radius: 22px; /* 增大圆角 */
        font-size: 44px; /* 放大字体 - 从22px到44px (2倍) */
        font-weight: 800;
        box-shadow: 0 2px 8px rgba(123, 107, 214, 0.25);
    }

    .question-text {
        font-size: 30px; /* 放大字体 - 从15px到30px (2倍) */
        font-weight: 600;
        letter-spacing: 0.4px;
        line-height: 1.5;
    }

    .question-arrow {
        font-size: 40px; /* 放大箭头 - 从20px到40px (2倍) */
        color: #C0C0C0;
        font-weight: 400;
    }
}

/* ========================================
   横屏大屏幕适配 (1920px+)
   ======================================== */
@media screen and (min-width: 1920px) and (orientation: landscape) {
    .main-content {
        padding: 0 120px 220px;
        max-width: 100%; /* 改为100%自适应 */
        margin: 0 auto;
    }

    .greeting-section {
        margin-top: 60px;
        margin-bottom: 70px;
        gap: 40px; /* 增加横屏间距 */
    }

    .greeting-text {
        flex: 1;
        min-width: 0;
        padding-left: 50px; /* 横屏大屏增加左侧内边距 */
    }

    .greeting-text h1 {
        font-size: 64px;
        white-space: normal;
        overflow: visible;
    }

    .greeting-message {
        font-size: 36px;
        white-space: normal;
        overflow: visible;
    }

    .character-image {
        width: 280px;
        height: 206px;
        flex-shrink: 0;
    }

    .character-image img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
}