/* ==========================================================================
   宝明杂货铺 H5 自定义样式补丁
   --------------------------------------------------------------------------
   用途：在不重新编译 uni-app 的前提下，覆盖编译产物里的一些视觉细节。
   说明：本文件由 index.html 在最后引入，优先级最高，用 !important 兜底。
   ========================================================================== */

/* 1) 首页「限时秒杀」无商品时，整块不显示（避免空白条） */
.seckill-box:has(.seckill-list:empty),
.component-item:has(.seckill-list:empty) {
    display: none !important;
}

/* 2) 顶部不再显示店铺 logo，搜索栏整行铺满（原 logo 是近乎白色的透明图，
      放浅底上本来也看不清，去掉后搜索框更大更好点） */
.page-index .header uni-image {
    display: none !important;
}

.page-index .header .search-box {
    flex: 1 1 auto !important;
    width: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* 3) 商品卡片：统一圆角 + 轻投影，图片区裁切更干净 */
.product-card {
    border-radius: 12px !important;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .045) !important;
}

.product-card .product-image,
.product-card .product-image uni-image,
.product-card .product-image img {
    border-radius: 10px 10px 0 0 !important;
    overflow: hidden;
}

/* 4) 详情页轮播：单张图时不显示页码圆点 */
.product-swiper .uni-swiper-dots:only-child,
.swiper .uni-swiper-dots-horizontal {
    /* 由 JS 兜底处理，这里只做兜底隐藏 */
}

/* 5) 底部 tabBar 增加一条极浅分割线，与内容区区分 */
.uni-tabbar-bottom,
.uni-tabbar {
    box-shadow: 0 -1px 0 rgba(0, 0, 0, .05);
}

/* 6) 空状态插画不要再淡淡地看不清 */
.empty-state uni-image img,
.no-data uni-image img {
    opacity: 1 !important;
    filter: saturate(1.05);
}

/* 7) 主按钮圆角统一（登录、提交、去结算等） */
.submit-btn,
.login-btn,
.btn-primary {
    border-radius: 10px !important;
}

/* ==========================================================================
   8) 分类页：右侧内容区只有少量二级分类，原来 3 列小卡片留白极大。
      改为浅灰底 + 2 列大卡片，视觉上更完整。
   ========================================================================== */
.right-aside {
    background: #f5f6f8 !important;
}

.category-content {
    padding: 12px 10px 24px !important;
}

.category-content::before {
    content: "商品分类";
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #333;
    letter-spacing: .3px;
    margin: 0 0 10px 2px;
}

.category-grid {
    margin: 0 !important;
}

.category-grid .category-card {
    flex: 0 0 calc(50% - 10px) !important;
    width: calc(50% - 10px) !important;
    margin: 0 5px 10px !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .04) !important;
    background: #fff !important;
    overflow: hidden;
    transition: transform .15s ease;
}

.category-grid .category-card:active {
    transform: scale(.97);
}

.category-grid .card-image-wrapper {
    height: 96px !important;
    padding: 12px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.category-grid .card-image {
    width: 68px !important;
    height: 68px !important;
}

.category-grid .card-info {
    padding: 0 8px 10px !important;
    background: #fff !important;
    justify-content: center;
}

.category-grid .card-title {
    font-size: 13px !important;
    font-weight: 500;
    color: #2b2f36;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ==========================================================================
   9) 登录页
      a. 只有一个 tab 时（短信登录被关闭、注册未激活），把 tab 条整体隐藏，
         避免一个「大红色按钮」冒充主操作；
      b. 多个 tab 时按 iOS 分段控件样式显示（白底红字），不再像 CTA 按钮。
   ========================================================================== */
.login-card .tab-container:has(> .tab-item:nth-child(2)[style*="display: none"]):has(> .tab-item:nth-child(3)[style*="display: none"]) {
    display: none !important;
}

.login-card .tab-container {
    background: #f4f5f7 !important;
    padding: 4px !important;
    border-radius: 10px !important;
    gap: 4px;
}

.login-card .tab-container .tab-item {
    border-radius: 8px !important;
    font-size: 14px !important;
    padding: 9px 8px !important;
    color: #666 !important;
}

.login-card .tab-container .tab-item.active {
    background: #fff !important;
    color: #e93939 !important;
    font-weight: 600 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .12) !important;
}

/* ==========================================================================
   10) 秒杀页：列表容器白底只有内容高度，商品少时下方突然转灰，出现硬切边。
       让白底至少铺满一屏。
   ========================================================================== */
.flash-sale .list {
    min-height: calc(100vh - 120px);
    box-sizing: border-box;
}

/* ==========================================================================
   11) 登录页补充：密码可见开关（小眼睛）、忘记密码入口
   ========================================================================== */
.login-card .pwd-eye {
    display: block;
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin-left: 8px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 20px 20px;
    /* 闭眼（带斜线）：密码当前为隐藏状态 */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239aa0a6' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20C5 20 1 12 1 12a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E");
}

/* 睁眼：密码明文显示中 */
.login-card .pwd-eye.eye-on {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e93939' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

.login-card .pwd-eye:active {
    opacity: .6;
}

.login-card .forgot-row {
    display: flex;
    justify-content: flex-end;
    padding: 0 8px;
    margin-top: -8px;
    margin-bottom: 8px;
}

.login-card .forgot-link {
    font-size: 13px;
    color: #e93939;
}

/* ==========================================================================
   12) 到店自提：确认订单页配送方式切换 + 自提门店选择
   ========================================================================== */
.delivery-switch {
    display: flex;
    margin: 10px 10px 0;
    padding: 4px;
    background: #f2f3f5;
    border-radius: 10px;
}

.delivery-switch .ds-item {
    flex: 1;
    padding: 9px 0;
    font-size: 14px;
    color: #666;
    text-align: center;
    border-radius: 8px;
    transition: all .2s;
}

.delivery-switch .ds-item.active {
    color: #e93939;
    font-weight: 600;
    background: #fff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .08);
}

.pickup-store {
    margin: 10px;
    padding: 12px 14px;
    background: #fff;
    border-radius: 10px;
}

.pickup-store .ps-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.pickup-store .ps-tit {
    font-size: 14px;
    font-weight: 600;
    color: #2b2f36;
}

.pickup-store .ps-tip {
    font-size: 12px;
    color: #a0a4ab;
}

.pickup-store .ps-item {
    display: flex;
    align-items: flex-start;
    margin-bottom: 8px;
    padding: 10px;
    border: 1px solid #eceef1;
    border-radius: 8px;
    transition: all .2s;
}

.pickup-store .ps-item:last-child {
    margin-bottom: 0;
}

.pickup-store .ps-item.active {
    border-color: #e93939;
    background: #fff9f9;
}

.pickup-store .ps-radio {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin-top: 2px;
    margin-right: 10px;
    border: 1px solid #c8ccd2;
    border-radius: 50%;
    box-sizing: border-box;
}

.pickup-store .ps-item.active .ps-radio {
    border-color: #e93939;
}

.pickup-store .ps-item.active .ps-radio .dot {
    width: 8px;
    height: 8px;
    background: #e93939;
    border-radius: 50%;
}

.pickup-store .ps-info {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
}

.pickup-store .ps-name {
    font-size: 14px;
    font-weight: 500;
    color: #2b2f36;
}

.pickup-store .ps-addr {
    margin-top: 3px;
    font-size: 12px;
    line-height: 1.4;
    color: #8b9099;
}

.pickup-store .ps-time {
    margin-top: 2px;
    font-size: 12px;
    color: #b0b4bb;
}

.pickup-store .ps-empty {
    padding: 14px 0;
    font-size: 13px;
    color: #999;
    text-align: center;
}

/* ==========================================================================
   13) 订单详情：到店自提核销卡片
   ========================================================================== */
.pickup-card {
    margin: 10px;
    padding: 14px;
    background: #fff;
    border-radius: 10px;
}

.pickup-card .pc-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.pickup-card .pc-tit {
    font-size: 15px;
    font-weight: 600;
    color: #2b2f36;
}

.pickup-card .pc-status {
    padding: 2px 8px;
    font-size: 12px;
    border-radius: 10px;
}

.pickup-card .pc-status.wait {
    color: #e93939;
    background: #fdeaea;
}

.pickup-card .pc-status.done {
    color: #39b54a;
    background: #e9f8ec;
}

.pickup-card .pc-store {
    display: flex;
    flex-direction: column;
    padding-bottom: 10px;
    border-bottom: 1px dashed #eef0f3;
}

.pickup-card .pc-name {
    font-size: 14px;
    font-weight: 500;
    color: #2b2f36;
}

.pickup-card .pc-addr {
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.4;
    color: #8b9099;
}

.pickup-card .pc-time {
    margin-top: 2px;
    font-size: 12px;
    color: #b0b4bb;
}

.pickup-card .pc-code {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 12px;
}

.pickup-card .pc-code-main {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.pickup-card .pc-code-label {
    font-size: 12px;
    color: #999;
}

.pickup-card .pc-code-num {
    margin: 6px 0;
    font-size: 30px;
    font-weight: 700;
    letter-spacing: 6px;
    color: #e93939;
}

.pickup-card .pc-code-tip {
    font-size: 12px;
    color: #bbb;
}

.pickup-card .pc-code-done {
    margin-top: 6px;
    font-size: 14px;
    color: #39b54a;
}

/* ==========================================================================
   14) 个人中心：核销台入口图标
   ========================================================================== */
.user-item .menu-icon-wrapper.verify-bg {
    background-color: transparent;
    background-image: url("/h5/static/img/verify-logo.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    border-radius: 8px;
}

/* ==========================================================================
   15) 商品详情：仅支持到店自提标识
   ========================================================================== */
.ship-row .ship-con {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: 10px 0;
}

.ship-row .ship-tag {
    display: inline-block;
    font-size: 11px;
    line-height: 18px;
    padding: 0 7px;
    margin-right: 8px;
    color: #ff6a00;
    background: #fff2e8;
    border: 1px solid #ffd6b3;
    border-radius: 9px;
    flex: none;
}

.ship-row .ship-note {
    font-size: 11px;
    color: #9a9a9a;
    line-height: 18px;
}

/* ==========================================================================
   16) 购物车「自提」标记 / 结算页仅自提提示
   ========================================================================== */
.item-ship-tag {
    flex: none;
    display: inline-block;
    align-self: flex-start;
    font-size: 10px;
    line-height: 16px;
    padding: 0 5px;
    margin-right: 6px;
    margin-top: 1px;
    color: #ff6a00;
    background: #fff2e8;
    border: 1px solid #ffd6b3;
    border-radius: 8px;
}

.ship-only-tip {
    display: block;
    margin: 0 12px 8px;
    padding: 6px 10px;
    font-size: 11px;
    line-height: 17px;
    color: #b26a00;
    background: #fff7e8;
    border: 1px solid #ffe0b2;
    border-radius: 6px;
}

/* ==========================================================================
   17) 订单详情：多包裹发货信息
   ========================================================================== */
.pkg-card {
    padding: 12px 14px;
    margin-top: 10px;
}

.pkg-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.pkg-tit {
    font-size: 14px;
    font-weight: 600;
    color: #2b2f36;
}

.pkg-count {
    font-size: 11px;
    color: #9a9a9a;
}

.pkg-item {
    padding: 8px 10px;
    margin-bottom: 8px;
    background: #fafbfc;
    border: 1px solid #f0f1f4;
    border-radius: 8px;
}

.pkg-item:last-child {
    margin-bottom: 0;
}

.pkg-row {
    display: flex;
    align-items: center;
    margin-bottom: 4px;
}

.pkg-idx {
    flex: none;
    font-size: 10px;
    line-height: 16px;
    padding: 0 6px;
    margin-right: 8px;
    color: #ff6a00;
    background: #fff2e8;
    border-radius: 8px;
}

.pkg-no {
    flex: 1;
    min-width: 0;
    font-size: 12px;
    color: #2b2f36;
    word-break: break-all;
}

.pkg-goods {
    display: block;
    font-size: 11px;
    line-height: 17px;
    color: #8a8f99;
}

/* 2026-11-03 首页热销商品图：手机竖图不再被拉伸压扁（等同 mode="aspectFill"） */
.product-card .product-image{overflow:hidden}
.product-card .product-image img{object-fit:cover!important;object-position:center!important}
.product-card .product-image>div{background-size:cover!important;background-position:center!important}
