/* =====================================================================
   mobile-v7.css — 手机端第八轮（仅样式层，仅 html.is-mobile 生效）
   1 管理页面  2 微信客服悬浮按钮与二维码面板  3 手机端页脚（联系我们/社交媒体）
   ===================================================================== */

/* ---------- 1. 管理页面（用户管理 / 设置 / 线路管理 / 添加、修改线路） ---------- */
html.is-mobile .my-admin-page {
    font-size: 13px;
}
html.is-mobile .my-admin-page .m-2 {
    margin: 8px !important;
}
html.is-mobile .my-admin-page .flex:not(.ant-table-wrapper *):not(.my-tour-preview *) {
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 6px;
}
html.is-mobile .my-admin-page div[style*="font-size: 18px"]:not(.my-tour-preview *) {
    font-size: 15px !important;
}
html.is-mobile .my-admin-page div[style*="font-size: 16px"]:not(.my-tour-preview *),
html.is-mobile .my-admin-page span[style*="font-size: 16px"]:not(.my-tour-preview *),
html.is-mobile .my-admin-page div[style*="font-size: 15px"]:not(.my-tour-preview *) {
    font-size: 13px !important;
}
html.is-mobile .my-admin-page .ml-3:not(.my-tour-preview *),
html.is-mobile .my-admin-page .ml-5:not(.my-tour-preview *),
html.is-mobile .my-admin-page .ml-10:not(.my-tour-preview *),
html.is-mobile .my-admin-page .mx-3:not(.my-tour-preview *) {
    margin-left: 0 !important;
}
html.is-mobile .my-admin-page div[style*="dashed"] {
    padding: 8px !important;
}
/* 固定宽度控件全部改为整行自适应 */
html.is-mobile .my-admin-page .ant-input-affix-wrapper[style*="width"],
html.is-mobile .my-admin-page .ant-input[style*="width"],
html.is-mobile .my-admin-page input[style*="width"],
html.is-mobile .my-admin-page textarea[style*="width"],
html.is-mobile .my-admin-page .ant-select[style*="width"],
html.is-mobile .my-admin-page .ant-select[style*="min-width"],
html.is-mobile .my-admin-page .ant-input-number-group-wrapper[style*="width"],
html.is-mobile .my-admin-page .ant-picker[style*="width"] {
    width: 100% !important;
    max-width: 100%;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box;
}
html.is-mobile .my-admin-page .ant-input-number[style*="width: 70px"],
html.is-mobile .my-admin-page .ant-input-number-sm[style*="width"] {
    width: 80px !important;
}
html.is-mobile .my-admin-page .ant-select-sm[style*="width: 50px"],
html.is-mobile .my-admin-page .ant-select-sm[style*="width: 120px"] {
    width: 140px !important;
}
html.is-mobile .my-admin-page input,
html.is-mobile .my-admin-page .ant-input {
    font-size: 13px;
}
html.is-mobile .my-admin-page input[type="text"]:not(.ant-input),
html.is-mobile .my-admin-page input[type="number"]:not(.ant-input) {
    height: 28px;
    padding: 0 6px !important;
}
html.is-mobile .my-admin-page .ant-btn {
    height: 28px;
    min-height: 28px;
    font-size: 12px;
    padding: 0 8px;
    line-height: 26px;
    margin-left: 0 !important;
    white-space: nowrap;
}
html.is-mobile .my-admin-page .ant-btn-lg {
    height: 32px;
    min-height: 32px;
    font-size: 13px;
}
html.is-mobile .my-admin-page .ant-radio-wrapper,
html.is-mobile .my-admin-page .ant-checkbox-wrapper,
html.is-mobile .my-admin-page .ant-radio-button-wrapper {
    font-size: 12px;
}
html.is-mobile .my-admin-page .ant-radio-group[style*="display: block"] {
    display: flex !important;
    flex-wrap: wrap;
    gap: 2px 0;
}
html.is-mobile .my-admin-page .ant-radio-button-wrapper {
    height: 26px;
    line-height: 24px;
    padding: 0 8px;
}
html.is-mobile .my-admin-page .ant-upload-wrapper .ant-btn,
html.is-mobile .my-admin-page .ant-upload.ant-upload-select .ant-btn {
    height: auto;
    line-height: 1.4;
    padding: 4px 8px;
    white-space: normal;
}
html.is-mobile .my-admin-page img:not(.my-tour-preview *) {
    max-width: 100%;
    height: auto;
}
html.is-mobile .my-admin-page .ant-table-wrapper {
    margin: 0 -8px;
    padding: 0 8px;
    overflow-x: auto;
}
html.is-mobile .my-admin-page .ant-table-wrapper .ant-table {
    min-width: 760px;
    font-size: 12px;
}
html.is-mobile .my-admin-page .ant-table-wrapper .ant-table-cell {
    white-space: nowrap;
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
}
html.is-mobile .my-admin-page .ant-table-wrapper .ant-table-cell .ant-btn {
    margin: 1px 2px !important;
}
html.is-mobile .my-admin-page .ant-pagination {
    flex-wrap: wrap;
    row-gap: 6px;
}
html.is-mobile .my-admin-page .ant-pagination .ant-pagination-options {
    display: inline-block !important;
}
/* 顶部搜索行：搜索框整行，按钮左对齐 */
html.is-mobile .my-admin-page .ant-input-search {
    flex: 1 1 100%;
    width: 100% !important;
}
html.is-mobile .my-admin-page .ant-input-search .ant-input-affix-wrapper,
html.is-mobile .my-admin-page .ant-input-search .ant-input {
    height: 30px;
    font-size: 13px;
}
html.is-mobile .my-admin-page .ant-input-search .ant-input-search-button {
    height: 30px !important;
    min-height: 30px;
}
/* 富文本编辑器 / 编辑区域 */
html.is-mobile .my-admin-page .ql-container,
html.is-mobile .my-admin-page .ql-toolbar,
html.is-mobile .my-admin-page iframe {
    max-width: 100%;
}
html.is-mobile .my-admin-page .ant-modal .ant-btn {
    margin: 0 4px 0 0 !important;
}

/* ---------- 2. 微信客服悬浮按钮 + 二维码面板 ---------- */
html.is-mobile .my-m-wechat-fab {
    position: fixed;
    left: 12px;
    bottom: calc(122px + env(safe-area-inset-bottom));
    z-index: 960;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 0;
    background: #07c160;
    color: #fff;
    font-size: 22px;
    line-height: 40px;
    text-align: center;
    padding: 0;
    opacity: 1;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    -webkit-tap-highlight-color: transparent;
    transition: opacity 0.2s;
}
html.is-mobile .my-m-wechat-fab.open,
html.is-mobile .my-m-wechat-fab:active {
    opacity: 1;
}
html.is-mobile .my-m-wechat-panel {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(170px + env(safe-area-inset-bottom));
    max-height: calc(100vh - 260px);
    overflow-y: auto;
    z-index: 961;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.22);
    padding: 0 12px 12px 12px;
}
html.is-mobile .my-m-wechat-panel-head {
    position: sticky;
    top: 0;
    background: #fff;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 0 8px 0;
    font-size: 15px;
    font-weight: 600;
    color: #333;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 8px;
}
html.is-mobile .my-m-wechat-panel-head > i {
    color: #07c160;
    font-size: 20px;
}
html.is-mobile .my-m-wechat-close {
    margin-left: auto;
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 50%;
    background: #f5f5f5;
    color: #666;
    font-size: 18px;
    line-height: 28px;
    padding: 0;
}
html.is-mobile .my-m-wechat-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}
html.is-mobile .my-m-wechat-item {
    text-align: center;
    font-size: 12px;
    color: #333;
    border: 1px solid #f0f0f0;
    border-radius: 8px;
    padding: 8px 4px;
}
html.is-mobile .my-m-wechat-item img {
    width: 100%;
    max-width: 140px;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    display: block;
    margin: 0 auto 4px auto;
    background: #fafafa;
}

/* ---------- 3. 手机端页脚：联系我们 / 社交媒体 ---------- */
html.is-mobile .my-m-footer {
    background: #fff;
    margin-top: 10px;
    padding: 12px 14px 4px 14px;
    border-top: 1px solid #eee;
}
html.is-mobile .my-m-footer-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin: 6px 0 8px 0;
}
html.is-mobile .my-m-footer-title > i {
    color: #2577e3;
    margin-right: 6px;
}
html.is-mobile .my-m-footer-contact {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 8px;
}
html.is-mobile .my-m-footer-contact a {
    color: #333;
    font-size: 14px;
    text-decoration: none;
}
html.is-mobile .my-m-footer-contact a > i,
html.is-mobile .my-m-footer-stores a > i {
    width: 18px;
    color: #888;
}
html.is-mobile .my-m-footer-stores {
    display: flex;
    flex-direction: column;
    border-top: 1px solid #f5f5f5;
    margin-bottom: 12px;
}
html.is-mobile .my-m-footer-stores a {
    display: flex;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid #f5f5f5;
    color: #333;
    font-size: 14px;
    text-decoration: none;
}
html.is-mobile .my-m-footer-stores a > span {
    margin-left: auto;
    color: #2577e3;
    font-size: 12px;
}
html.is-mobile .my-m-footer-stores a > span::after {
    content: "\203A";
    margin-left: 4px;
    font-size: 16px;
}
html.is-mobile .my-m-footer-social {
    display: flex;
    justify-content: space-around;
    padding: 4px 0 10px 0;
}
html.is-mobile .my-m-footer-social > a,
html.is-mobile .my-m-footer-social > button {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    background: none;
    border: 0;
    color: #555;
    font-size: 11px;
    text-decoration: none;
    padding: 0;
}
html.is-mobile .my-m-footer-social > a > i,
html.is-mobile .my-m-footer-social > button > i {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: #fff;
    font-size: 20px;
    line-height: 40px;
    text-align: center;
}
html.is-mobile .my-m-footer-social-wechat > i { background: #07c160; }
html.is-mobile .my-m-footer-social-twitter > i { background: #1da1f2; }
html.is-mobile .my-m-footer-social-instagram > i { background: linear-gradient(45deg, #f09433, #dc2743, #bc1888); }
html.is-mobile .my-m-footer-social-facebook > i { background: #1877f2; }

/* ---------- 4. 第九轮 ---------- */
/* 4.1 详情页 admin 预订面板：v6 的 150px 右内边距（为绝对定位的佣金按钮留位）
   原本用 content-box 计算，使"酒店房间"标题行宽度 = 100% + 150px，造成面板出现横向滑块；
   同一选择器还误命中了"一般团/成人团/大小同价/一日游"单选组，使其被挤成两行。 */
html.is-mobile .my-order-left > div:first-child .flex.flex-wrap > div:first-child {
    box-sizing: border-box;
}
html.is-mobile .my-order-left > div:first-child .flex.flex-wrap > .ant-radio-group:first-child {
    padding-right: 0 !important;
}
html.is-mobile .my-order-left > div:first-child .flex.flex-wrap > .ant-radio-group[style*="display: block"] {
    display: flex !important;
    flex-wrap: nowrap;
    align-items: center;
    white-space: nowrap;
}
html.is-mobile .my-order-left > div:first-child .flex.flex-wrap > .ant-radio-group[style*="display: block"] .ant-radio-wrapper {
    margin-right: 4px;
    flex: none;
}
html.is-mobile .my-order-left > div:first-child .flex.flex-wrap > .ant-radio-group[style*="display: block"] .ant-radio-wrapper > span:not(.ant-radio) {
    padding-inline: 4px 2px;
}
/* 兜底：预订面板内容不再产生横向滑块 */
html.is-mobile .my-order-left {
    overflow-x: hidden;
}

/* 4.2 添加订单弹窗 / 订单页："清除重填"按钮与"男士/女士"上下居中对齐（标题行高 20px，性别行高 30px） */
html.is-mobile .ant-modal-body > .flex > .grow > .flex:first-child > .flex-none,
html.is-mobile .my-orderpage div[style*="dashed"] > .flex > .grow > .flex:first-child > .flex-none {
    top: 20px;
    height: 30px;
    display: flex;
    align-items: center;
}

/* 4.3 返回顶部 + 微信按钮：不透明；仅在页面滚动时显示，停止滚动约 1 秒后隐藏（不可点击） */
html.is-mobile .my-m-wechat-fab {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s;
}
html.is-mobile .ant-float-btn {
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 0.25s !important;
}
html.is-mobile.my-scrolling .my-m-wechat-fab,
html.is-mobile .my-m-wechat-fab.open {
    opacity: 1;
    pointer-events: auto;
}
html.is-mobile.my-scrolling .ant-float-btn {
    opacity: 1 !important;
    pointer-events: auto !important;
}
/* 4.4 详情页锚点栏（线路特色/行程介绍/…）：admin 多出"用户协议与条款细则"时超出一屏，
   改为可左右滑动但不显示滑块 */
html.is-mobile .my-tour-anchor > div[style*="height: 60px"] {
    scrollbar-width: none;
}
html.is-mobile .my-tour-anchor > div[style*="height: 60px"]::-webkit-scrollbar {
    display: none;
}

/* ---------- 5. 第十轮：线路添加/修改页 + 线路管理列表 ---------- */
/* 5.1 推荐类型 / 语言：标签与选项同一行、上下居中 */
html.is-mobile .my-admin-page div.ml-3.my-1[style*="font-size: 16px"] {
    flex: 0 0 auto;
    margin: 4px 6px 4px 0 !important;
}
html.is-mobile .my-admin-page div.ml-3.my-1[style*="font-size: 16px"] + .ant-radio-group[style*="display: block"] {
    display: inline-flex !important;
    flex: 1 1 auto;
    flex-wrap: wrap;
    align-items: center;
    margin: 4px 0 !important;
}
/* 5.2 线路内容整体预览：与手机端线路详情页布局一致（复用详情页规则，去掉管理页通用规则的干扰） */
html.is-mobile .my-tour-preview {
    display: block;
    width: 100%;
    margin: 6px -8px 0 -8px;
    padding: 0;
    width: calc(100% + 16px);
    background: #fff;
    font-size: 14px;
}
html.is-mobile .my-tour-preview > .flex:first-child {
    flex-direction: column;
}
html.is-mobile .my-tour-preview .ant-affix {
    position: static !important;
    width: auto !important;
    height: auto !important;
}
html.is-mobile .my-tour-preview .my-content-travel-interval {
    height: 8px;
    background: #f5f5f5;
}
html.is-mobile .my-tour-preview .my-tour-des-right > div {
    font-size: 13px;
}
html.is-mobile .my-tour-preview .my-small_list img,
html.is-mobile .my-tour-preview .my-small_list .ant-image-img {
    height: 50px !important;
    width: auto !important;
}
/* 5.3 线路管理列表 */
/* 历史更新记录：最后一列（历史记录）允许换行、完整显示 */
html.is-mobile .my-admin-page .my-history-table .ant-table {
    min-width: 900px;
}
html.is-mobile .my-admin-page .my-history-table .ant-table-cell:last-child {
    white-space: normal;
    max-width: none;
    min-width: 260px;
    overflow: visible;
    text-overflow: clip;
    line-height: 1.4;
}
/* 线路列表：按钮缩小 */
html.is-mobile .my-admin-page .my-tourlist-table .ant-btn {
    height: 22px;
    min-height: 22px;
    line-height: 20px;
    font-size: 11px;
    padding: 0 5px;
}
/* 搜索行：左右边距相同；线路列表的搜索框与"添加线路"同一行 */
html.is-mobile .my-admin-page .flex[style*="margin-left: 10px"] {
    margin-right: 10px !important;
}
html.is-mobile .my-admin-page .flex[style*="margin-left: 10px"] .ant-input-search {
    flex: 1 1 140px;
    width: auto !important;
    min-width: 0;
}
html.is-mobile .my-admin-page .flex[style*="margin-left: 10px"] > a {
    flex: none;
}
html.is-mobile .my-admin-page .flex[style*="margin-left: 10px"] > a > .ant-btn {
    height: 30px;
    min-height: 30px;
    font-size: 12px;
}
/* 5.4 修正：推荐类型 / 语言 各占一行（选项组占满本行剩余宽度，迫使下一个标签换行） */
html.is-mobile .my-admin-page div.ml-3.my-1[style*="font-size: 16px"] + .ant-radio-group[style*="display: block"] {
    flex: 1 1 calc(100% - 90px);
}
/* 历史更新记录：搜索框单独一行、左右边距相同；只有含"添加线路"按钮的行才把搜索框与按钮并排 */
html.is-mobile .my-admin-page .flex[style*="margin-left: 10px"]:not(:has(> a)) .ant-input-search {
    flex: 1 1 100%;
    width: 100% !important;
}
/* 预览与详情页：缩略图条内边距计入宽度，避免超出 */
html.is-mobile .my-small_box {
    box-sizing: border-box;
}

/* ---------- 6. 第十一轮 ---------- */
/* 6.1 返回顶部 / 微信按钮：层级提到最上（高于详情页底部"立即预定/生成表单"栏 940 与底部导航 950）；
   有底部操作栏的页面把两个按钮再抬高一档，避免被遮挡 */
html.is-mobile .ant-float-btn {
    z-index: 962 !important;
}
html.is-mobile .my-m-wechat-fab {
    z-index: 963;
}
html.is-mobile .my-m-wechat-panel {
    z-index: 964;
}
html.is-mobile body:has(.my-order-actions) .ant-float-btn {
    bottom: calc(126px + env(safe-area-inset-bottom)) !important;
}
html.is-mobile body:has(.my-order-actions) .my-m-wechat-fab {
    bottom: calc(176px + env(safe-area-inset-bottom));
}
html.is-mobile body:has(.my-order-actions) .my-m-wechat-panel {
    bottom: calc(224px + env(safe-area-inset-bottom));
    max-height: calc(100vh - 300px);
}
/* 6.2 首页导航：图标改为小图片（保留原 FontAwesome 图标方案，切换见 MobileHomeNav.jsx 顶部开关） */
html.is-mobile .my-m-homenav-icon.my-m-homenav-img {
    background: #f0f0f0;
    overflow: hidden;
    padding: 0;
}
html.is-mobile .my-m-homenav-icon.my-m-homenav-img > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 50%;
}
/* 6.3 页脚"社交媒体"：微信点击显示公众号二维码（与桌面端相同），图标行与下方分割线间距减半 */
html.is-mobile .my-m-footer-social {
    padding: 4px 0 5px 0;
}
html.is-mobile .my-m-footer {
    padding-bottom: 0;
}
html.is-mobile .my-m-footer-social-wechat-wrap {
    position: relative;
    display: flex;
}
html.is-mobile .my-m-footer-social-wechat-wrap > button {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    background: none;
    border: 0;
    color: #555;
    font-size: 11px;
    padding: 0;
}
html.is-mobile .my-m-footer-social-wechat-wrap > button > i {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: #fff;
    font-size: 20px;
    line-height: 40px;
    text-align: center;
    background: #07c160;
}
html.is-mobile .my-m-footer-qr {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 8px);
    transform: translateX(-30%);
    z-index: 20;
    background: rgba(0, 0, 0, 0.85);
    color: #fff;
    border-radius: 8px;
    padding: 8px 10px;
    font-size: 13px;
    text-align: center;
    white-space: nowrap;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
html.is-mobile .my-m-footer-qr::after {
    content: "";
    position: absolute;
    left: 30%;
    top: 100%;
    border: 6px solid transparent;
    border-top-color: rgba(0, 0, 0, 0.85);
}
html.is-mobile .my-m-footer-qr > img {
    display: block;
    width: 135px;
    height: 123px;
    margin: 6px auto 0 auto;
    background: #fff;
}
html.is-mobile .my-m-footer + .my-footer {
    padding-top: 0 !important;
}

/* ---------- 7. 第十二轮 ---------- */
/* 7.1 首页各线路组卡片：缩小到一屏可见 2 个多 */
html.is-mobile .my-home-group > div > div > div {
    gap: 8px;
}
html.is-mobile .my-home-card-slot {
    flex: 0 0 44vw;
    width: 44vw !important;
    max-width: 180px;
}
html.is-mobile .my-home-card .figure-frontpage,
html.is-mobile .my-home-card .figure-frontpage img,
html.is-mobile .my-home-card-slot .figure-frontpage img {
    height: 110px !important;
}
html.is-mobile .my-home-card .pic-title {
    font-size: 13px !important;
    margin: 5px 7px 0 7px !important;
    min-height: 2.7em;
}
html.is-mobile .my-home-card .pic-content {
    font-size: 11px !important;
    margin: 3px 7px 7px 7px !important;
}
html.is-mobile .my-home-card .pic-content > div,
html.is-mobile .my-home-card .pic-content span {
    font-size: 11px !important;
}
html.is-mobile .my-home-card .pic-content [style*="font-size: 20px"],
html.is-mobile .my-home-card .pic-content [style*="font-size: 18px"],
html.is-mobile .my-home-card .pic-content [style*="font-size: 17px"],
html.is-mobile .my-home-card .pic-content [style*="font-size: 16px"] {
    font-size: 15px !important;
}
/* 7.2 列表页卡片：标题/价格/按钮缩小，价格行放到图片右侧文字栏下方，使卡片高度接近图片高度 */
html.is-mobile .my-tourcard-img .hover14,
html.is-mobile .my-tourcard-img .figure-searchpage,
html.is-mobile .my-tourcard-img .figure-searchpage img {
    height: 104px !important;
}
html.is-mobile .my-tourcard-title {
    font-size: 13.5px !important;
    line-height: 1.3;
}
html.is-mobile .my-tourcard-info {
    padding-top: 3px !important;
    font-size: 11px !important;
}
html.is-mobile .my-tourcard .my-filter-content-bottom-row {
    padding-top: 3px !important;
    font-size: 11px;
}
html.is-mobile .my-tourcard .my-filter-content-top-special {
    font-size: 10px;
    line-height: 16px;
    margin-top: 3px !important;
}
html.is-mobile .my-tourcard-price {
    width: calc(100% - 128px) !important;
    margin: 2px 0 0 128px;
    padding-top: 0;
    border-top: 0;
}
html.is-mobile .my-tourcard-price > div:first-child > div {
    font-size: 16px !important;
}
html.is-mobile .my-tourcard-price > div:last-child a {
    height: 24px;
    padding: 0 11px !important;
    font-size: 12px !important;
}

/* ---------- 8. 第十三轮 ---------- */
/* 8.1 微信客服面板：每行 3 个、可一屏看完；点击放大，便于微信内长按识别 */
html.is-mobile .my-m-wechat-panel {
    padding: 0 10px 10px 10px;
}
html.is-mobile .my-m-wechat-tip {
    font-size: 11px;
    color: #888;
    margin: -4px 0 8px 0;
}
html.is-mobile .my-m-wechat-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}
html.is-mobile .my-m-wechat-item {
    padding: 6px 2px;
    font-size: 11px;
    -webkit-tap-highlight-color: transparent;
}
html.is-mobile .my-m-wechat-item img,
html.is-mobile .my-m-wechat-zoom-card img {
    -webkit-touch-callout: default;
    -webkit-user-select: auto;
    user-select: auto;
    pointer-events: auto;
}
html.is-mobile .my-m-wechat-item img {
    max-width: 96px;
    margin-bottom: 3px;
}
html.is-mobile .my-m-wechat-zoom {
    position: fixed;
    inset: 0;
    z-index: 970;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
html.is-mobile .my-m-wechat-zoom-card {
    background: #fff;
    border-radius: 12px;
    padding: 14px 14px 12px 14px;
    width: 300px;
    max-width: 100%;
    text-align: center;
}
html.is-mobile .my-m-wechat-zoom-name {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
}
html.is-mobile .my-m-wechat-zoom-card img {
    display: block;
    width: 240px;
    height: 240px;
    max-width: 100%;
    object-fit: contain;
    margin: 0 auto;
    background: #fafafa;
}
html.is-mobile .my-m-wechat-zoom-tip {
    font-size: 12px;
    color: #07c160;
    margin: 10px 0 8px 0;
    line-height: 1.5;
}
html.is-mobile .my-m-wechat-zoom-close {
    border: 0;
    background: #f5f5f5;
    color: #333;
    border-radius: 16px;
    height: 32px;
    padding: 0 22px;
    font-size: 13px;
}
/* 8.2 顶部 Logo 行加高（参照 m.tianbaotravel.com：Logo 行约 65px） */
html.is-mobile .my-m-header-row {
    min-height: 54px;
}
html.is-mobile .my-m-logo img {
    height: 46px;
}
/* 8.3 首页卡片"热门/优惠/推荐"心形角标随卡片缩小 */
html.is-mobile .my-home-card div[style*="banner1.png"] {
    transform: scale(0.68);
    transform-origin: top left;
    margin: 6px 0 0 6px !important;
}
/* 8.4 列表页价格 / "价格:详询客服" 再调小 */
html.is-mobile .my-tourcard-price > div:first-child > div {
    font-size: 14px !important;
}
html.is-mobile .my-tourcard-price > div:first-child > div span[style*="13px"] {
    font-size: 11px !important;
}

/* ---------- 9. 第十四轮：详情页 ---------- */
/* 9.1 行程选择按钮：每个方案一行、超长文字单行省略，点击/长按气泡显示完整描述 */
html.is-mobile .my-order-topbar .ant-radio-group[style*="display: inline"] {
    display: block !important;
    width: 100%;
    margin: 4px 0 0 0 !important;
}
html.is-mobile .my-order-topbar .ant-radio-group .ant-radio-button-wrapper {
    display: block;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    margin: 0 0 4px 0;
    padding: 0 10px;
    height: 30px !important;
    line-height: 28px !important;
    font-size: 12px !important;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border-radius: 6px !important;
    border-inline-start-width: 1px !important;
}
html.is-mobile .my-order-topbar .ant-radio-group .ant-radio-button-wrapper::before {
    display: none;
}
html.is-mobile .my-order-topbar .my-1 > span[style*="margin: 0 0 0 10px"] {
    margin: 0 !important;
}
/* 9.2 必付项目 / 增值服务 为空时的"无"：与有内容时同样的字号 */
html.is-mobile .my-order-left div[style*="rgb(215, 215, 215)"] > div > div:only-child:not([class]):not([style]) {
    font-size: 12px !important;
    color: #666;
    line-height: 1.5;
}
/* 9.3 锚点栏：占满整行，超出自动换行并居中 */
html.is-mobile .my-tour-anchor > div[style*="height: 60px"] {
    height: auto !important;
    overflow: visible !important;
    white-space: normal !important;
    padding: 4px 0 !important;
}
html.is-mobile .my-tour-anchor ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100% !important;
    height: auto !important;
    padding: 0 6px !important;
    row-gap: 0;
}
html.is-mobile .my-tour-anchor li {
    flex: none;
    padding: 0 8px !important;
    height: 34px !important;
    line-height: 34px !important;
}
/* 9.4 线路特色 / 行程介绍 等分区标题：图标与文字离顶部再远一点 */
html.is-mobile .my-travel-detail > .flex-none > div {
    margin-top: 16px !important;
}
/* 9.1b 行程选择所在的块占满整行（否则单行省略的按钮会把它撑到屏幕外） */
html.is-mobile .my-order-topbar > .my-1:has(.ant-radio-group) {
    flex: 1 1 100%;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

/* ---------- 10. 第十五轮：订单页金额区（线路/非线路订单同一结构） ----------
   总价 | 应付金额+修改 | 实付金额+修改 | 成本+修改 | 盈利+删除订单 各占一行、居左。
   原基准宽度 calc(100% - 150px) 在总价行后还剩 78px，会把"应付金额"标签挤到同一行。 */
html.is-mobile .my-orderpage .flex.flex-wrap > .ant-input-number-group-wrapper[style*="width: 150px"],
html.is-mobile .my-orderpage .flex.my-1 > .ant-input-number-group-wrapper[style*="width: 150px"] {
    flex: 1 1 calc(100% - 134px) !important;
    max-width: calc(100% - 120px) !important;
}
html.is-mobile .my-orderpage .flex.flex-wrap > .ant-btn + div[style*="font-size: 16px"],
html.is-mobile .my-orderpage .flex.flex-wrap > .ant-input-number-group-wrapper + div[style*="font-size: 16px"] {
    margin-left: 0 !important;
}
/* 盈利：输入框不再撑满，给右侧绝对定位的"删除订单"留出间距 */
html.is-mobile .my-orderpage .flex.my-1 > .flex > .ant-input-number-group-wrapper[style*="width: 150px"] {
    flex: 0 1 auto !important;
    width: calc(100% - 158px) !important;
    max-width: calc(100% - 158px) !important;
}

/* ---------- 11. 页脚署名行（手机端字号/间距） ---------- */
html.is-mobile .my-footer-credit {
    font-size: 11px !important;
    margin: 4px 0 0 0 !important;
}
html.is-mobile .my-footer-credit a {
    color: #2577e3 !important;
    font-weight: 600;
}

/* ---------- 12. 行程方案很短时：与"行程:"同一行、按钮按文字宽度显示 ---------- */
html.is-mobile .my-order-topbar .ant-radio-group.my-days-inline[style*="display: inline"] {
    display: inline-flex !important;
    flex-wrap: wrap;
    gap: 4px 6px;
    width: auto;
    max-width: calc(100% - 44px);
    vertical-align: middle;
    margin: 0 0 0 6px !important;
}
html.is-mobile .my-order-topbar .ant-radio-group.my-days-inline .ant-radio-button-wrapper {
    display: inline-block;
    width: auto;
    margin: 0;
    white-space: nowrap;
}

/* ---------- 13. 第十八轮：订单页（普通用户/销售/经理/管理员通用） ---------- */
/* 13.1 "(其它方式付款)/在线付款(信用卡)" 放到实付金额一行的最后 */
html.is-mobile .my-orderpage .flex.flex-wrap > div[class="mt-1"][style*="color: red"][style*="font-size: 16px"] {
    flex: 0 0 auto !important;
    font-size: 12px !important;
    margin: 0 0 0 6px !important;
    white-space: nowrap;
}
html.is-mobile .my-orderpage .flex.flex-wrap > .ant-input-number-group-wrapper[style*="width: 150px"]:has(+ div[class="mt-1"][style*="color: red"]) {
    flex: 1 1 calc(100% - 200px) !important;
    max-width: calc(100% - 176px) !important;
}
html.is-mobile .my-orderpage .flex.flex-wrap > .ant-input-number-group-wrapper[style*="width: 150px"]:has(+ .ant-btn + div[class="mt-1"][style*="color: red"]) {
    flex: 1 1 calc(100% - 250px) !important;
    max-width: calc(100% - 226px) !important;
}
/* 13.2 出行人证件 等虚线框：标题与按钮同一行上下居中；上传按钮与格式说明同一行 */
html.is-mobile .my-orderpage div[style*="dashed"] > .mb-1.flex:has(> div[style*="font-size: 15px"][style*="color: red"]) {
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 6px;
}
html.is-mobile .my-orderpage div[style*="dashed"] > .mb-1.flex > div[style*="font-size: 15px"][style*="color: red"] {
    font-size: 13px !important;
    font-weight: bold;
    white-space: nowrap;
    margin-right: 2px;
}
html.is-mobile .my-orderpage div[style*="dashed"] > .mb-1.flex > .ant-btn {
    margin: 0 !important;
    font-size: 12px;
    padding: 0 8px;
}
html.is-mobile .my-orderpage div[style*="dashed"] > .mb-1.flex + div:has(> .ant-btn) {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 6px;
    font-size: 12px;
    color: #666;
}
html.is-mobile .my-orderpage div[style*="dashed"] > .mb-1.flex + div:has(> .ant-btn) > .ant-btn {
    margin: 0 !important;
    font-size: 12px;
}

/* ---------- 14. 订单页金额区（所有角色）：输入框统一 156px 宽，行距一致，付款方式文字跟在实付金额行末，
   盈利输入框避开"删除订单"。金额行容器 .flex.flex-wrap 有 4px 列间距；线路订单里成本/盈利容器是 .flex，
   非线路订单是 .flex.my-1，输入框内联宽度有 150px 与 120px 两种，一并覆盖 ---------- */
html.is-mobile .my-orderpage .flex.flex-wrap > div[style*="font-size: 16px"][style*="color: red"],
html.is-mobile .my-orderpage .flex.flex-wrap + .flex > div[style*="font-size: 16px"][style*="color: red"],
html.is-mobile .my-orderpage .flex.flex-wrap + .flex > .flex > div[style*="font-size: 16px"][style*="color: red"] {
    margin: 0 !important;
    min-width: 68px;
    width: 68px;
}
html.is-mobile .my-orderpage .flex.flex-wrap > .ant-input-number-group-wrapper[style*="width: 150px"],
html.is-mobile .my-orderpage .flex.flex-wrap > .ant-input-number-group-wrapper[style*="width: 120px"],
html.is-mobile .my-orderpage .flex.flex-wrap + .flex > .ant-input-number-group-wrapper[style*="width: 150px"],
html.is-mobile .my-orderpage .flex.flex-wrap + .flex > .ant-input-number-group-wrapper[style*="width: 120px"],
html.is-mobile .my-orderpage .flex.flex-wrap + .flex > .flex > .ant-input-number-group-wrapper[style*="width: 150px"],
html.is-mobile .my-orderpage .flex.flex-wrap + .flex > .flex > .ant-input-number-group-wrapper[style*="width: 120px"] {
    flex: 0 0 156px !important;
    width: 156px !important;
    max-width: 156px !important;
    margin: 0 !important;
}
/* 让下一项标签换行（容器列间距 4px）：输入框后无按钮/文字（总价行）用右外边距占满本行；
   输入框后有"修改"但无付款文字时，按钮占满本行 */
html.is-mobile .my-orderpage .flex.flex-wrap > .ant-input-number-group-wrapper:is([style*="width: 150px"], [style*="width: 120px"]):not(:has(+ .ant-btn)):not(:has(+ div[class="mt-1"])) {
    margin-right: calc(100% - 232px) !important;
}
html.is-mobile .my-orderpage .flex.flex-wrap > .ant-input-number-group-wrapper:is([style*="width: 150px"], [style*="width: 120px"]) + .ant-btn:not(:has(+ div[class="mt-1"])) {
    margin: 0 calc(100% - 281px) 0 0 !important;
}
html.is-mobile .my-orderpage .flex.flex-wrap > .ant-input-number-group-wrapper:is([style*="width: 150px"], [style*="width: 120px"]) + .ant-btn:has(+ div[class="mt-1"]) {
    margin: 0 !important;
}
/* 付款方式文字：所有角色都放在实付金额行末（含有"修改"按钮的经理/管理员：68+4+156+4+45+4+80 = 361 ≤ 366） */
html.is-mobile .my-orderpage .flex.flex-wrap > div[class="mt-1"][style*="color: red"][style*="font-size: 16px"],
html.is-mobile .my-orderpage .flex.flex-wrap > .ant-btn + div[class="mt-1"][style*="color: red"] {
    flex: 0 0 auto !important;
    margin: 0 !important;
    font-size: 12px !important;
    white-space: nowrap;
}
/* 成本/盈利容器：与上方行距一致 */
html.is-mobile .my-orderpage .flex.flex-wrap + .flex:has(> .ant-input-number-group-wrapper) {
    margin-top: 6px !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 4px;
}
html.is-mobile .my-orderpage .flex.flex-wrap + .flex:has(> .ant-input-number-group-wrapper) > .grow {
    display: none;
}
html.is-mobile .my-orderpage .flex.flex-wrap + .flex:has(> .ant-input-number-group-wrapper) > .ant-btn {
    margin: 0 !important;
}
html.is-mobile .my-orderpage .flex.flex-wrap + .flex > .flex:has(> .ant-input-number-group-wrapper) {
    flex: 1 1 100%;
    align-items: center;
    gap: 0 4px;
}
/* 代理：(旅行社)佣金 块与上方实付金额行之间留出行距 */
html.is-mobile .my-orderpage .flex:has(> .flex[style*="dashed"]) {
    margin-top: 8px !important;
}
/* 覆盖第 13.1 节里两条按 :has() 加宽实付金额输入框的旧规则（同选择器、写在后面生效） */
html.is-mobile .my-orderpage .flex.flex-wrap > .ant-input-number-group-wrapper[style*="width: 150px"]:has(+ div[class="mt-1"][style*="color: red"]),
html.is-mobile .my-orderpage .flex.flex-wrap > .ant-input-number-group-wrapper[style*="width: 150px"]:has(+ .ant-btn + div[class="mt-1"][style*="color: red"]) {
    flex: 0 0 156px !important;
    width: 156px !important;
    max-width: 156px !important;
}
/* (旅行社)佣金 虚线框（在成本容器内）：不套用上面的统一宽度，基本/增值服务输入框保持 96px，
   标签按文字宽度，"修改"靠右边框（留 6px），使一行不再拥挤 */
html.is-mobile .my-orderpage .flex.flex-wrap + .flex > .flex[style*="dashed"] {
    padding: 4px 6px !important;
    gap: 4px;
}
html.is-mobile .my-orderpage .flex.flex-wrap + .flex > .flex[style*="dashed"] > div[style*="font-size: 16px"][style*="color: red"] {
    min-width: 0;
    width: auto;
}
html.is-mobile .my-orderpage .flex.flex-wrap + .flex > .flex[style*="dashed"] > .ant-input-number-group-wrapper:is([style*="width: 150px"], [style*="width: 120px"]) {
    flex: 0 0 96px !important;
    width: 96px !important;
    max-width: 96px !important;
}
html.is-mobile .my-orderpage .flex.flex-wrap + .flex > .flex[style*="dashed"] > .ant-btn {
    margin: 0 0 0 auto !important;
}

/* ---------- 15. iPhone：底部导航栏高度被安全区计算了两次（height 与 padding-bottom 都加了 env()，
   而本项目 box-sizing 默认是 content-box），iOS Chrome 工具栏收起时 env 变为 34px，导航栏就向上长高 34px 挡住内容。
   改为 border-box 后总高度固定为 56px + 安全区。 ---------- */
html.is-mobile .my-m-tabbar {
    box-sizing: border-box;
    height: calc(56px + env(safe-area-inset-bottom));
    min-height: 0;
    padding-top: 0;
    padding-bottom: env(safe-area-inset-bottom);
}

/* ---------- 16. 订单页"查看当前文件"等气泡：不超过手机屏宽 ----------
   （出团协议 / 出行人证件 / 备注文件 的气泡内容有 min-width:320px + 长文件名，手机上会撑出屏幕） */
html.is-mobile .ant-popover {
    max-width: calc(100vw - 12px);
}
html.is-mobile .ant-popover .ant-popover-inner {
    max-width: calc(100vw - 12px);
    overflow: hidden;
}
html.is-mobile .ant-popover .ant-popover-inner-content > div[style*="min-width: 320px"] {
    min-width: 0 !important;
    width: calc(100vw - 44px);
    max-width: 100%;
    padding: 0 !important;
    max-height: 60vh !important;
    overflow-x: hidden !important;
}
html.is-mobile .ant-popover .ant-popover-inner-content > div[style*="min-width: 320px"] .flex {
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
}
html.is-mobile .ant-popover .ant-popover-inner-content > div[style*="min-width: 320px"] .flex > *:not(.ant-btn):not(.flex-grow) {
    flex: 1 1 100%;
    min-width: 0;
    overflow-wrap: anywhere;
    font-size: 13px;
}
html.is-mobile .ant-popover .ant-popover-inner-content > div[style*="min-width: 320px"] .flex > .flex-grow {
    display: none;
}
html.is-mobile .ant-popover .ant-popover-inner-content > div[style*="min-width: 320px"] .ant-btn {
    margin: 0 !important;
    font-size: 12px;
    padding: 0 8px;
    height: 26px;
}

/* ---------- 17. iPhone：登录/注册/密码类输入框字号 16px，避免 iOS 聚焦时自动放大页面 ---------- */
html.is-mobile input[type="email"],
html.is-mobile input[type="password"],
html.is-mobile .ant-input-password input {
    font-size: 16px !important;
}

/* ---------- 18. 自由行 / 私人订制 等静态页：图片块左右边距一致 ----------
   （外层 div 与 .hover01/.hover14 的内联 width 相同，第 4 轮的 margin 规则同时命中了两层，内层多出 10px 左边距） */
html.is-mobile .my-layout-body div[style*="width: 980px"] > .hover01,
html.is-mobile .my-layout-body div[style*="width: 980px"] > .hover14,
html.is-mobile .my-layout-body div[style*="width: 268px"] > .hover01,
html.is-mobile .my-layout-body div[style*="width: 551px"] > .hover01,
html.is-mobile .my-layout-body div[style*="width: 435px"] > .hover01 {
    margin: 0 !important;
    max-width: 100%;
    overflow: hidden;
}

/* ---------- 19. 签证页"热门签证"卡片轮播：手机端一屏一张（slidesToShow 由 Visa.jsx 的 responsive 设置），
   左右箭头留在容器两侧不压住卡片 ---------- */
html.is-mobile .carousel-container {
    width: calc(100% - 72px) !important;
    max-width: none !important;
    margin: 0 auto !important;
    padding: 0 !important;
}
html.is-mobile .carousel-container .carousel-arrow.left {
    left: -34px !important;
}
html.is-mobile .carousel-container .carousel-arrow.right {
    right: -34px !important;
}
html.is-mobile .carousel-container .card-slide {
    padding: 0 4px;
    box-sizing: border-box;
}
html.is-mobile .carousel-container .card-slide .my-card {
    width: 100% !important;
    max-width: 100%;
    margin: 0 auto !important;
}
html.is-mobile .carousel-container .card-slide .my-card img {
    width: 100% !important;
    height: 200px !important;
    object-fit: cover;
}
html.is-mobile .carousel-container .card-slide .my-card > div[style*="padding: 20px"] {
    padding: 10px 12px !important;
}
