/* ============================================================
   云舟卡网 · 手机端原生适配（只在 ≤768px 生效，电脑版一个字都不动）
   原则：不缩放电脑版，手机上用小屏原生布局 ——
        顶部固定条只留「logo + 店名 + 图标」，搜索与导航另起一行跟着页面滚
   ============================================================ */

/* 大屏：手机专用的那一行永远不出现 */
@media (min-width: 769px) {
    .shop-mobile { display: none !important; }
}

@media (max-width: 768px) {

    /* ---------- 1. 顶部固定条：避开刘海/状态栏 + 单行 ---------- */
    .uc-topbar {
        /* 顶部安全区（iPhone 刘海 / 安卓状态栏），没有则退化为 8px */
        padding: calc(8px + env(safe-area-inset-top, 0px)) 10px 6px;
    }
    .uc-topbar__inner { max-width: none; }

    .shop-nav {
        height: 50px;
        padding: 0 6px 0 12px;
        gap: 6px;
        border-radius: 16px;
    }
    .shop-brand { gap: 8px; font-size: 15px; padding-right: 0; }
    .shop-brand img { width: 28px; height: 28px; border-radius: 8px; }
    .shop-brand__name { max-width: 42vw; font-size: 15px; }

    .shop-icon-btn { width: 38px; height: 38px; }
    .shop-icon-btn .material-icons-outlined { font-size: 20px; }
    .shop-burger {
        display: inline-flex !important;
        width: 38px; height: 38px; border-radius: 12px;
    }

    /* 电脑版那一套（横向导航 / 内联搜索 / 登录按钮）在手机上全部收起 */
    .shop-nav .shop-nav__list,
    .shop-nav .shop-search,
    .shop-auth { display: none !important; }
    .shop-nav__right { margin-left: auto; gap: 4px; }

    /* 抽屉在手机上始终可用（原本要靠 shop-compact 类，这里不依赖 JS） */
    .shop-drawer, .shop-drawer__shade { display: block; }

    /* ---------- 2. 手机专用行：整行搜索 + 横向导航胶囊 ---------- */
    .shop-mobile { display: block; }
    .shop-mobile__inner {
        max-width: 1180px;
        margin: 0 auto;
        padding: 8px 10px 0;
    }
    .shop-mobile__search {
        display: flex;
        align-items: center;
        gap: 9px;
        height: 42px;
        margin: 0;
        padding: 0 14px;
        border-radius: 14px;
        background: var(--uc-field-bg);
        border: 1px solid var(--glass-border-soft);
        color: var(--uc-ink-med);
    }
    .shop-mobile__search:focus-within { border-color: var(--uc-focus); }
    .shop-mobile__search i { font-size: 16px; flex: 0 0 auto; }
    .shop-mobile__search input {
        flex: 1 1 auto;
        min-width: 0;
        border: 0; outline: 0; background: 0 0;
        color: var(--uc-ink);
        font-size: 16px;          /* 16px 起，iOS 聚焦时不会自动放大页面 */
    }
    .shop-mobile__search input::placeholder { color: var(--uc-ink-dis); }

    .shop-mobile__nav {
        display: flex;
        gap: 8px;
        margin-top: 8px;
        padding-bottom: 2px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .shop-mobile__nav::-webkit-scrollbar { display: none; }
    .shop-mobile__nav a {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        height: 38px;
        padding: 0 16px;
        border-radius: 999px;
        font-size: 14px;
        font-weight: 500;
        color: var(--uc-ink-med);
        background: var(--uc-field-bg);
        border: 1px solid var(--glass-border-soft);
    }
    .shop-mobile__nav a .nav-icon,
    .shop-mobile__nav a i { font-size: 15px; }
    .shop-mobile__nav a.active {
        color: var(--md-on-primary);
        background: var(--md-primary);
        border-color: transparent;
        box-shadow: 0 4px 14px rgba(var(--md-primary-rgb), .26);
    }

    /* ---------- 3. 内容区：手机留白收紧、不横向溢出 ---------- */
    body.uc-body { overflow-x: hidden; }
    main.container { padding-top: 14px; padding-bottom: 32px; }
    .panel { border-radius: 16px; }
    .panel-header { padding: 14px 15px 0; }
    .panel-body { padding: 14px 15px 16px; font-size: 13.5px; }

    /* 商品卡：仍是 2 列（手机原生那种），封面 4:3 少裁切、看得清 */
    .item-list { gap: 10px; }
    .acg-thumb { aspect-ratio: 4 / 3; }
    .acg-card { border-radius: 14px; }
    .acg-card > .acg-body { padding: 7px 10px 9px; gap: 5px; }
    .goods-title { font-size: 13px; }
    .price { font-size: 16px; }
    .price .unit { font-size: 11px; }
    .stat-bottom, .meta { font-size: 10.5px; }
    .acg-tag, .badge-soft { font-size: 10px; }

    /* 商品详情 / 下单 */
    .item-cover { max-height: 260px; }
    .item-buy > h4 { font-size: 17px; }
    .item-buy .abacus .price { font-size: 20px; }
    .qty-group .form-control { width: 58px; }
    .pay-list { grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); }
    .form-control { height: 42px; font-size: 16px; }

    /* 订单 / 卡密展示 */
    .order-item { padding: 14px 15px; }
    .card-display { font-size: 12.5px; padding: 11px 12px; }
    .order-right { text-align: left; }
    .order-amount { align-items: flex-start; }

    /* 底部安全区（全面屏手势条） */
    footer { padding: 20px 14px calc(26px + env(safe-area-inset-bottom, 0px)); }
}

/* ---------- 超窄屏（≤360px，小屏安卓）再收一点 ---------- */
@media (max-width: 380px) {
    .shop-brand__name { max-width: 34vw; font-size: 14px; }
    .shop-icon-btn { width: 36px; height: 36px; }
    .item-list { gap: 8px; }
    .goods-title { font-size: 12.5px; }
    .price { font-size: 15px; }
}