/* ==========================================================================
   红色旅游 · 移动端适配层（手机 / 平板）
   --------------------------------------------------------------------------
   1) 全部规则都写在媒体查询或 hover:none 里，桌面端样式完全不受影响；
   2) 页面自带的 <style> 在文档里位于本文件之后，因此这里用「提高选择器
      权重」的方式覆盖（如 body .rt-hero h1），尽量少用 !important；
   3) 断点：991.98px 平板 / 767.98px 大屏手机 / 575.98px 手机。
   ========================================================================== */

/* ---------- 触摸设备：去掉「粘住」的悬停效果，按下给反馈 ---------- */
@media (hover: none) {
    .rt-card:hover,
    .rt-entry:hover,
    .rt-spot-card:hover,
    .rt-gcard:hover,
    .rt-thumb:hover {
        transform: none !important;
        box-shadow: inherit;
    }
    .rt-spot-card:active,
    .rt-gcard:active,
    .rt-entry:active,
    .rt-card:active { transform: scale(.985); }
    .btn:active { transform: scale(.97); }
}

/* ============================ 平板及以下 ============================ */
@media (max-width: 991.98px) {

    /* ---------- 基础排版与容器 ---------- */
    body { -webkit-text-size-adjust: 100%; }
    body .container,
    body .container-fluid { padding-left: 14px; padding-right: 14px; }
    body .row > [class*="col-"] { min-width: 0; }          /* 防止长内容把栅格撑破 */
    body img { max-width: 100%; }
    body h1, body .h1 { font-size: 1.65rem; }
    body h2, body .h2 { font-size: 1.4rem; }
    body h3, body .h3 { font-size: 1.22rem; }
    body h4, body .h4 { font-size: 1.1rem; }
    body .lead { font-size: 1rem; }
    body .display-4, body .display-5 { font-size: 2rem; }

    /* 长文件名 / 长地址 / 长 URL 不撑破屏幕 */
    body .rt-kv .v, body .rt-meta, body td, body .card-body { overflow-wrap: anywhere; }

    /* ---------- 区块留白收紧 ---------- */
    body .rt-section { padding: 30px 0; }
    body .rt-hero { padding: 40px 0 34px; }
    body .rt-hero::after { font-size: 120px; }
    body .rt-page-head { padding: 20px 0 18px; }
    body .rt-panel-body { padding: 13px; }
    body .rt-panel-head { padding: 10px 13px; font-size: .95rem; flex-wrap: wrap; }
    body .mt-5 { margin-top: 1.6rem !important; }
    body .mb-5 { margin-bottom: 1.6rem !important; }
    body .rt-footer { padding: 20px 0; }
    body .rt-footer .container { flex-direction: column; gap: 6px; text-align: center; }

    /* ---------- 导航栏：抽屉化后更好点 ---------- */
    .rt-navbar .navbar-collapse { max-height: calc(100vh - 66px); overflow-y: auto; }
    .rt-navbar .nav-link {
        padding: 11px 14px !important;
        min-height: 46px; display: flex; align-items: center;
        font-size: 16px; border-radius: 10px;
    }
    .rt-navbar .nav-item + .nav-item .nav-link { border-top: 1px solid rgba(255, 255, 255, .10); }
    .rt-navbar .navbar-nav .nav-link.rt-active { background: #fff; color: #991b1b !important; }
    .rt-navbar .navbar-brand { padding: 6px 0; }
    .rt-navbar .rt-brand-txt .t1 { font-size: 18px; }
    .rt-navbar .navbar-toggler { padding: 8px 11px; }         /* 更大的点击区 */
    .rt-navbar .navbar-collapse .btn { min-height: 44px; font-size: 15px; }
    .rt-navbar .dropdown-menu { font-size: 15px; }

    /* 修复：手机版右上角用户下拉菜单被折叠面板裁剪/遮挡。
       上面的 .navbar-collapse 有 overflow-y:auto + max-height，
       绝对定位的下拉一打开就被这个滚动容器裁掉；移动端改为在面板内
       静态展开（整行按钮式），随面板滚动完全可见、不再被遮挡。 */
    .rt-navbar .navbar-collapse .dropdown-menu {
        position: static !important;
        float: none !important;
        width: 100% !important;
        margin: 6px 0 4px !important;
        box-shadow: 0 6px 18px rgba(0, 0, 0, .25) !important;
    }
    .rt-navbar .navbar-collapse .dropdown-menu .dropdown-item { white-space: normal; }

    /* ---------- 按钮：达到可点按尺寸 ---------- */
    body .btn { min-height: 42px; padding-top: 8px; padding-bottom: 8px; }
    body .btn-sm { min-height: 38px; }
    body .btn-lg { min-height: 50px; font-size: 1.02rem; }
    body .btn-group { flex-wrap: wrap; }
    body .btn-group > .btn { flex: 1 1 auto; }

    /* ---------- 表单：16px 可避免 iOS 聚焦时自动放大 ---------- */
    body .form-control, body .form-select, body .form-check-label { font-size: 16px; }
    body .form-control, body .form-select { min-height: 46px; }
    body .input-group > .form-control { min-width: 0; }
    body textarea.form-control { min-height: 90px; }
    body .form-label { font-size: .92rem; }
    body .card-body { padding: 15px; }

    /* ---------- 面包屑：单行横向滚动，不占两行 ---------- */
    body .breadcrumb {
        flex-wrap: nowrap; overflow-x: auto; white-space: nowrap;
        padding: 6px 2px; margin-bottom: 12px; font-size: .88rem;
        -webkit-overflow-scrolling: touch; scrollbar-width: none;
    }
    body .breadcrumb::-webkit-scrollbar { display: none; }
    body .breadcrumb-item { flex: 0 0 auto; }

    /* ---------- 表格：小屏一律横向滚动 ---------- */
    body .table { font-size: .9rem; }
    body .table th, body .table td { padding: .5rem .55rem; white-space: nowrap; }
    body .table-responsive, body .rt-table-scroll {
        overflow-x: auto; -webkit-overflow-scrolling: touch;
        border-radius: 10px; border: 1px solid #eceff3;
    }
    body .table-responsive > .table { margin-bottom: 0; border: 0; }

    /* 需要时可以给任何块加到「可横滑」——用于筛选条、标签条、分页 */
    body .rt-scroll-x {
        display: flex; gap: 8px; overflow-x: auto; -webkit-overflow-scrolling: touch;
        padding-bottom: 4px; scrollbar-width: none;
    }
    body .rt-scroll-x::-webkit-scrollbar { display: none; }
    body .rt-scroll-x > * { flex: 0 0 auto; }

    /* ---------- 分页：横滑 + 缩小 ---------- */
    body .pagination { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    body .pagination .page-link { padding: .35rem .6rem; font-size: .9rem; white-space: nowrap; }

    /* ---------- 景点 / 路线卡片 ---------- */
    body .rt-cover { height: 104px; font-size: 40px; }
    body .rt-card-body { padding: 13px 14px 15px; }
    body .rt-card-title { font-size: 1rem; }
    body .rt-entry { padding: 18px 16px; }
    body .rt-entry .icon { font-size: 26px; }
    body .rt-stat { padding: 14px 12px; }
    body .rt-stat .num { font-size: 1.6rem; }

    /* ---------- 景点详情 / 相册 ---------- */
    body .rt-thumbs { gap: 8px; scroll-snap-type: x mandatory; }
    body .rt-thumb { flex: 0 0 96px; scroll-snap-align: start; }
    body .rt-thumb img { height: 64px; }
    body .rt-album-tag, body .rt-album-hint { font-size: 11px; padding: 2px 9px; }
    body .rt-album-tag { left: 10px; top: 10px; }
    body .rt-album-hint { right: 10px; bottom: 10px; }
    body .rt-gallery { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
    body .rt-gcard .b { padding: 8px 10px 10px; }
    body .rt-gcard .c { font-size: 11px; }
    body .rt-info-card .card-body { padding: 15px; }
    body .rt-kv { font-size: .92rem; }
    body .rt-kv .k { flex: 0 0 74px; }
    body .rt-lightbox { padding: 12px; }
    body .rt-lightbox img { max-width: 100%; max-height: 70vh; }
    body .rt-lb-bar { bottom: 66px; padding: 0 16px; font-size: 13px; }
    body .rt-lb-close { right: 14px; top: 6px; font-size: 38px; }   /* 更好点按 */

    /* ---------- 路线规划页：地图与面板 ---------- */
    body #mapWrap { height: 340px; }
    body .map-tools { right: 8px; top: 8px; gap: 8px; }
    body .map-tools button { width: 42px; height: 42px; font-size: 18px; border-radius: 10px; }
    body .map-layers { right: 8px; top: 220px; font-size: 12px; max-height: 45%; overflow-y: auto; }
    body .map-legend { left: 8px; bottom: 8px; font-size: .72rem; padding: 6px 8px; }
    body .map-scale { right: 8px; bottom: 8px; }
    body .map-hint { display: none; }                      /* 手机上提示语会挡住地图 */
    body .rt-route-card { padding: 11px 12px; }
    body .tl { padding-left: 26px; }
    body .sug-box { max-height: 45vh; }
    body .sug-item { padding: 11px 12px; }
    body .poi-chip { font-size: .78rem; padding: 5px 12px; min-height: 32px; display: inline-flex; align-items: center; }
    body .rt-page-head h1 { font-size: 1.35rem; }

    /* ---------- 后台：侧栏卡片与统计 ---------- */
    body .rt-admin-nav { display: flex; gap: 8px; overflow-x: auto; }
    body .rt-admin-nav > * { flex: 0 0 auto; }
    body pre { white-space: pre-wrap; overflow-wrap: anywhere; }
}

/* ============================ 大屏手机 ============================ */
@media (max-width: 767.98px) {
    body .container, body .container-fluid { padding-left: 12px; padding-right: 12px; }

    /* 表单按钮 / 操作区：小屏竖排更好点 */
    body .rt-actions, body .rt-actions .btn { width: 100%; }
    body .rt-actions { display: grid; gap: 8px; }

    /* 卡片横向布局（左图右文）改为上图下文 */
    body .rt-media { flex-direction: column; }
    body .rt-media > img, body .rt-media > .rt-media-img { width: 100%; }

    /* 弹窗 / 下拉在大屏手机上占满宽度 */
    body .modal-dialog { margin: .6rem; }
    body .dropdown-menu { font-size: 15px; }

    body .alert { padding: .75rem .9rem; font-size: .9rem; }
    body .badge { font-size: .72rem; }

    /* 景点列表页：标题与筛选行 */
    body .rt-spot-card .t { font-size: 15px; }
    body .rt-spot-card .meta { font-size: 11px; }
}

/* ============================== 手机 ============================== */
@media (max-width: 575.98px) {
    body .rt-hero { padding: 32px 0 28px; }
    body .rt-hero h1 { font-size: 1.5rem; letter-spacing: .5px; }
    body .rt-hero p.lead { font-size: .95rem; }
    body .rt-hero-tags span { font-size: .78rem; padding: 3px 11px; margin-right: 6px; }
    body section .d-flex.flex-wrap.justify-content-between { flex-direction: column; align-items: stretch !important; gap: 10px; }
    body .rt-section-title { font-size: 1.25rem; }
    body .rt-section-title small { font-size: .82rem; }

    /* 首页/列表：一行两张（宽高比更瘦，避免第一屏只看到一张图） */
    body .rt-cover { height: 88px; font-size: 34px; }
    body .rt-card-body { padding: 11px 12px 13px; }
    body .rt-card-title { font-size: .95rem; }
    body .rt-meta { font-size: .78rem; }
    body .rt-price { font-size: 1.05rem; }
    body .rt-stat .num { font-size: 1.45rem; }
    body .rt-stat .lb { font-size: .78rem; }

    /* 景点信息表：标签与内容上下排，长地址不再被压成一列 */
    body .rt-kv { flex-direction: column; gap: 2px; padding: 8px 0; }
    body .rt-kv .k { flex: none; font-size: .8rem; color: #9aa1ab; }

    /* 相册 / 图片墙：两列 */
    body .rt-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    body .rt-gcard .c { display: none; }                    /* 小屏只留标题，避免卡片高度失控 */
    body .rt-thumb { flex: 0 0 82px; }
    body .rt-thumb img { height: 56px; }

    /* 路线规划：地图再矮一点，先看到表单 */
    body #mapWrap { height: 300px; }
    body .map-tools button { width: 40px; height: 40px; font-size: 17px; }
    body .map-layers { top: 200px; }

    /* 页脚 */
    body .rt-footer { font-size: .8rem; }

    /* 登录 / 注册卡片：贴边但保留内边距 */
    body .rt-auth-card { margin: 0 -2px; }
}

/* ---------- 底部固定操作条（预留 iPhone 安全区） ---------- */
.rt-sticky-cta { display: none; }
@media (max-width: 767.98px) {
    body.rt-has-cta { padding-bottom: 78px; }
    body .rt-sticky-cta {
        display: flex; gap: 8px; align-items: center;
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 1040;
        background: rgba(255, 255, 255, .97);
        border-top: 1px solid #eceff3;
        box-shadow: 0 -6px 20px rgba(15, 20, 30, .12);
        padding: 9px 12px calc(9px + env(safe-area-inset-bottom, 0px));
        backdrop-filter: blur(6px);
    }
    body .rt-sticky-cta .btn { flex: 1 1 0; min-height: 46px; }
    body .rt-sticky-cta .rt-cta-price { font-weight: 800; color: #c1121f; white-space: nowrap; }
}

/* ---------- 只在手机显示 / 只在桌面显示 ---------- */
.rt-only-mobile { display: none !important; }
@media (max-width: 991.98px) {
    .rt-only-mobile { display: block !important; }
    .rt-only-desktop { display: none !important; }
}

/* ---------- 表格卡片化：手机上一行一条，标签在左、内容在右 ---------- */
@media (max-width: 767.98px) {
    body .rt-table-cards { border: 0; }
    body .rt-table-cards thead { display: none; }
    body .rt-table-cards,
    body .rt-table-cards tbody,
    body .rt-table-cards tr,
    body .rt-table-cards td { display: block; width: 100%; }
    body .rt-table-cards tr {
        border: 1px solid #e9edf2; border-radius: 12px; background: #fff;
        padding: 6px 12px; margin-bottom: 10px; box-shadow: 0 3px 10px rgba(15, 20, 30, .05);
    }
    body .rt-table-cards tr:hover { background: #fff; }
    body .rt-table-cards td {
        border: 0; padding: 7px 0; white-space: normal;
        display: flex; align-items: center; justify-content: space-between; gap: 12px;
        text-align: right;
    }
    body .rt-table-cards td + td { border-top: 1px dashed #f0f2f5; }
    body .rt-table-cards td::before {
        content: attr(data-label);
        flex: 0 0 auto; color: #8a8f98; font-size: .82rem; font-weight: 600; text-align: left;
    }
    body .rt-table-cards td:empty { display: none; }
    body .rt-table-cards td > .btn, body .rt-table-cards td > button { width: 100%; }
}

/* ---------- 首页按钮组：手机上撑满一行 ---------- */
@media (max-width: 575.98px) {
    body .rt-cta-group { display: grid !important; gap: 10px !important; }
    body .rt-cta-group > .btn { width: 100%; }
}

/* ---------- 路线规划：手机上取消侧栏吸顶 ---------- */
@media (max-width: 991.98px) {
    body .rt-sticky-panel { position: static !important; top: auto !important; }
}

/* ---------- 路线详情：头部与景点行更紧凑 ---------- */
@media (max-width: 991.98px) {
    body .route-header { padding: 26px 0 22px; }
    body .route-header h1 { font-size: 1.35rem; }
    body .route-header .price-tag { font-size: 22px; }
    body .day-card { margin-bottom: 12px; }
    body .day-card:hover { transform: none; }
}
@media (max-width: 575.98px) {
    body .spot-thumb, body .spot-thumb-fallback { width: 100%; height: 132px; }
    body .day-card .rounded-circle { width: 36px !important; height: 36px !important; font-size: .95rem; }
}

/* ---------- 管理后台：统计卡与操作按钮 ---------- */
@media (max-width: 767.98px) {
    body .stat-card .card-body { padding: 12px; }
    body .preview-img { width: 64px; height: 48px; }
    body .table img { width: 48px; height: 40px; }
    body .btn-action { margin: 2px 0; }

    /* 后台侧栏：竖排菜单改成一条可横滑的标签栏，别把内容挤到屏幕外 */
    body .sidebar { margin-bottom: 12px; }
    body .sidebar .list-group,
    body .col-md-2 > .list-group,
    body .col-lg-2 > .list-group {
        flex-direction: row; flex-wrap: nowrap; overflow-x: auto;
        -webkit-overflow-scrolling: touch; border-radius: 10px;
        scrollbar-width: none;
    }
    body .sidebar .list-group::-webkit-scrollbar,
    body .col-md-2 > .list-group::-webkit-scrollbar { display: none; }
    body .sidebar .list-group-item,
    body .col-md-2 > .list-group > .list-group-item,
    body .col-lg-2 > .list-group > .list-group-item {
        flex: 0 0 auto; white-space: nowrap; border: 0;
        border-right: 1px solid #eef0f3; border-radius: 0;
        padding: .6rem .85rem; font-size: .92rem;
    }
    body .sidebar .list-group-item:last-child { border-right: 0; }
}

/* ---------- 列表页标题行：手机上按钮另起一行并撑满 ---------- */
@media (max-width: 575.98px) {
    body .d-flex.justify-content-between.align-items-center.mb-3 {
        flex-direction: column; align-items: stretch !important; gap: 8px;
    }
    body .d-flex.justify-content-between.align-items-center.mb-3 > .btn,
    body .d-flex.justify-content-between.align-items-center.mb-3 > a.btn { width: 100%; }
    body .d-flex.justify-content-between.align-items-center.mb-3 .btn-group { width: 100%; }
}

/* ---------- 手机上把「小按钮」也做到 40px 以上，方便手指点 ---------- */
@media (max-width: 767.98px) {
    body .btn-sm { min-height: 40px; padding-top: 7px; padding-bottom: 7px; }
    body .pagination .page-link { min-height: 40px; display: flex; align-items: center; justify-content: center; }
    body .btn-group-sm > .btn { min-height: 40px; }
}

/* ---------- 横屏手机：地图别太高，避免只剩地图 ---------- */
@media (max-height: 480px) and (orientation: landscape) {
    body #mapWrap { height: 240px; }
    body .rt-hero { padding: 20px 0 18px; }
    body .rt-hero h1 { font-size: 1.25rem; }
}