/* ══ 1024px 平板横屏断点 ══ */
@media (max-width: 1024px) {
    .home-metrics-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .orders-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .auth-card {
        padding: var(--space-xl);
    }

    .product-detail-bottom-bar {
        padding: var(--space-md) var(--space-lg);
    }
}

/* ══ 768px 手机竖屏主断点 ══ */
@media (max-width: 768px) {
    .nav-container {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
        gap: 8px;
        padding: 10px 12px;
    }

    .nav-left,
    .nav-right {
        display: flex;
        align-items: center;
    }

    .search-form {
        min-width: 0;
    }

    .search-input {
        width: 100%;
        min-width: 0;
    }

    .mobile-expand-nav {
        display: none;
    }

    body.mobile-nav-open .mobile-expand-nav {
        display: flex !important;
    }

    .product-grid {
        grid-template-columns: 1fr;
    }

    .category-track {
        display: grid;
        grid-template-columns: 1fr;
        overflow: visible;
    }

    .product-card--compact {
        min-width: 0;
        flex-basis: auto;
    }

    .table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .table-wrap .table,
    .table-wrap table {
        min-width: 720px;
    }

    #checkoutForm {
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    #checkoutForm input:not([type='hidden']),
    #checkoutForm textarea,
    #checkoutForm select,
    #checkoutForm button,
    #checkoutForm .pay-method-btn {
        width: 100%;
    }
}

/* ══ 768px 静态页面适配 ══ */
@media (max-width: 768px) {
    .static-page-hero {
        padding: var(--space-lg) var(--space-md);
    }

    .static-page-body {
        padding: var(--space-lg) var(--space-md);
        border-left: 0;
        border-right: 0;
        border-radius: 0;
    }

    .static-page-nav {
        padding: 0 var(--space-md);
    }
}

/* ══ 480px 小屏手机断点 ══ */
@media (max-width: 480px) {
    .home-metrics-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--space-sm);
    }

    .home-quick-categories {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .orders-metrics {
        grid-template-columns: minmax(0, 1fr);
    }

    .auth-card,
    .auth-card--wide {
        padding: var(--space-lg);
    }

    .orders-shell,
    .orders-header {
        padding: var(--space-md);
    }

    .install-stepper {
        flex-wrap: wrap;
        justify-content: center;
    }

    .install-step-line {
        display: none;
    }

    .home-pharmacist-card {
        flex-direction: column;
        text-align: center;
    }
}

/* ══════════════════════════════════════════════════════════
 * v1.11/v1.12 新页面移动端覆写（v1.12.x+ 补齐）
 * ══════════════════════════════════════════════════════════ */

/* ── 商品详情页：评价区 + 规格表 + 服务标签 ── */
@media (max-width: 768px) {
    /* 服务承诺图标条：横向滚动而非折行 */
    .product-detail-service-badges {
        flex-wrap: nowrap !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 4px;
    }

    /* 规格表：列宽自适应，避免横向溢出 */
    .product-detail-specs-table td {
        word-break: break-all;
        font-size: 0.875rem;
    }

    /* 评价列表：紧凑布局 */
    .product-detail-reviews .card {
        padding: var(--space-sm);
    }

    /* 关联推荐：每行 2 个改成 3 个（小屏更密集）*/
    .product-detail-related-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--space-xs);
    }

    /* 多图轮播按钮：移动端缩小 */
    #galleryPrev, #galleryNext {
        width: 32px !important;
        height: 32px !important;
    }
}

/* ── 评价提交页 ── */
@media (max-width: 768px) {
    main[data-page="review_form"] main {
        padding: var(--space-md) !important;
    }
    .review-stars label {
        font-size: 2.5rem !important;
    }
}

/* ── 我的收藏页 ── */
@media (max-width: 768px) {
    main[data-page="favorites"] .card[style*="grid-template-columns"] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 480px) {
    main[data-page="favorites"] .card[style*="grid-template-columns"] {
        grid-template-columns: 1fr !important;
    }
}

/* ── Admin 商品编辑表单（specs 动态行 + service_badges 网格）── */
@media (max-width: 768px) {
    .admin-spec-row {
        flex-wrap: wrap;
    }
    .admin-spec-row input {
        min-width: 0 !important;
    }
}

/* ══════════════════════════════════════════════════════════
 * ARCH-5 移动端预防性加固（v1.14+）
 * 部署后真机测试前，先加常见痛点的预防性 CSS。
 * ══════════════════════════════════════════════════════════ */

/* ── 防 viewport 横向滚动 ── */
@media (max-width: 768px) {
    html, body {
        overflow-x: hidden;
        max-width: 100vw;
    }
    /* 表格类容器允许横向滚动而非破坏 viewport */
    table, .admin-table-wrap, pre, code {
        max-width: 100%;
    }
    /* 防 inline image 撑爆视口 */
    img {
        max-width: 100%;
        height: auto;
    }
}

/* ── iOS 输入框自动 zoom 防御 ── */
/* iOS Safari 在 input/textarea font-size < 16px 时触发自动放大 */
@media (max-width: 768px) {
    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="tel"],
    input[type="url"],
    input[type="search"],
    input[type="number"],
    textarea,
    select {
        font-size: 16px !important;
    }
}

/* ── 安全区适配（iPhone 刘海 / 底部 bar）── */
@supports (padding: max(0px)) {
    .product-detail-bottom-bar,
    .pd-bar,
    .sticky-bar,
    .botnav,
    footer.cart-bar {
        padding-bottom: max(var(--space-sm, 8px), env(safe-area-inset-bottom)) !important;
    }
    main, .page-shell {
        padding-left: max(var(--space-md, 16px), env(safe-area-inset-left));
        padding-right: max(var(--space-md, 16px), env(safe-area-inset-right));
    }
}

/* ── 横屏适配（landscape 防底部栏遮内容）── */
@media (max-width: 932px) and (orientation: landscape) {
    .product-detail-bottom-bar,
    .pd-bar,
    .sticky-bar {
        position: sticky; /* 横屏改 sticky 让内容能完全滚到 */
    }
}

/* ── 高 DPI 屏幕图片适配 ── */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    /* 让线条 / border 在视网膜屏更细致 */
    .card, .v2-card, .pd-card {
        border-width: 0.5px;
    }
}

/* ── 触摸目标可见反馈 ── */
@media (hover: none) and (pointer: coarse) {
    button:active,
    a.btn-primary:active,
    a.btn-secondary:active,
    a.btn-ghost:active,
    .btn:active {
        opacity: 0.7;
        transform: scale(0.98);
        transition: opacity 0.1s, transform 0.1s;
    }
}

/* ── 减少动画（系统偏好）── */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ── 暗黑模式占位（未来支持）── */
@media (prefers-color-scheme: dark) {
    /* 当前项目主体设计为浅色，暗黑模式留待 v2.0 收敛后做。
       这里仅声明媒体查询占位，浏览器不会报错。 */
}

/* ── 打印样式（用户偶尔会想打印订单详情）── */
@media print {
    .product-detail-bottom-bar,
    .pd-bar,
    .sticky-bar,
    .botnav,
    footer.cart-bar,
    .topbar,
    .ui-toggle-v2,
    nav,
    button {
        display: none !important;
    }
    body {
        background: #fff !important;
    }
    a {
        color: #000 !important;
        text-decoration: underline;
    }
}