/* ---------- 导航栏 ---------- */
.sa-nav-wrap { position: relative; z-index: 9999; font-family: 'Inter', 'Noto Sans SC', sans-serif; -webkit-tap-highlight-color: transparent; }
.sa-nav-wrap .nav-bar { position: fixed; top: 0; left: 0; width: 100%; z-index: 9998; background: rgba(252, 250, 247, 0.65); backdrop-filter: blur(18px) saturate(110%); -webkit-backdrop-filter: blur(18px) saturate(110%); transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1); border-bottom: 1px solid rgba(230, 222, 211, 0.4); }
.sa-nav-wrap .nav-bar.nav-scrolled { background: rgba(255, 255, 255, 0.96); box-shadow: 0 4px 24px -4px rgba(68, 62, 52, 0.05); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-bottom: 1px solid rgba(230, 222, 211, 0.3); }
.sa-nav-wrap.menu-open .nav-logo-area,
.sa-nav-wrap.menu-open .nav-btn-area { opacity: 0; pointer-events: none; transition: opacity 0.25s ease; }
.sa-nav-wrap .menu-overlay { position: fixed; inset: 0; background: rgba(44, 40, 35, 0.25); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); z-index: 9997; opacity: 0; visibility: hidden; transition: all 0.35s ease; }
.sa-nav-wrap.menu-open .menu-overlay { opacity: 1; visibility: visible; }
.sa-nav-wrap .sa-mobile-menu { position: fixed; top: 0; right: 0; width: 320px; max-width: 85%; height: 100vh; background: #fdfcfb; box-shadow: -8px 0 32px rgba(68, 62, 52, 0.04); z-index: 9999; transform: translateX(100%); transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1); overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 28px 24px; }
.sa-nav-wrap.menu-open .sa-mobile-menu { transform: translateX(0); }
@media (min-width: 1024px) {
.sa-nav-wrap .sa-mobile-menu { position: relative; width: auto; height: auto; background: transparent; box-shadow: none; transform: none !important; overflow: visible; padding: 0; }
.sa-nav-wrap .menu-overlay { display: none; }
}

/* ---------- Footer ---------- */
.sa-app .sa-footer { position: relative; overflow: hidden; background: linear-gradient(180deg, #f7f4f0 0%, #ede9e2 100%); padding-bottom: calc(6rem + env(safe-area-inset-bottom)); }
/* PC 端取消额外留白 */
@media (min-width: 1024px) {
.sa-app .sa-footer {
padding-bottom: 2rem;  /* 或根据设计需要微调 */
}
}
.sa-app .sa-footer .sa-footer-deco { position: absolute; inset: 0; pointer-events: none; z-index: 0; background: radial-gradient(circle at 90% 90%, rgba(217, 119, 6, 0.03) 0%, transparent 50%), radial-gradient(circle at 10% 10%, rgba(79, 70, 229, 0.03) 0%, transparent 40%); }

/* 遮罩 */
.sa-app .sa-overlay { position: fixed; inset: 0; background: rgba(44, 40, 35, 0.25); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); z-index: 49; opacity: 0; visibility: hidden; transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1); }
.sa-app .sa-overlay.sa-show { opacity: 1; visibility: visible; }

/* 面板 */
.sa-app .sa-panel { transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.35s ease; background: #ffffff; color: #44403c; }
.sa-app .sa-panel.sa-hidden { transform: translateY(100%); opacity: 0; pointer-events: none; }
.sa-app .sa-panel.sa-visible { transform: translateY(0); opacity: 1; pointer-events: auto; }
@media (min-width: 1024px) {
.sa-app .sa-panel { border-radius: 20px; border: 1px solid rgba(230, 222, 211, 0.6); box-shadow: 0 24px 48px -12px rgba(68, 62, 52, 0.08), 0 0 1px rgba(68, 62, 52, 0.05); }
.sa-app .sa-panel.sa-hidden { transform: translateY(20px) scale(0.97); }
}
@media (max-width: 1023px) {
.sa-app .sa-panel { bottom: calc(3.5rem + env(safe-area-inset-bottom)) !important; right: 0 !important; left: 0 !important; width: 100% !important; max-width: 100% !important; border-radius: 24px 24px 0 0 !important; border: none; box-shadow: 0 -8px 32px rgba(68, 62, 52, 0.04); }
}

/* 输入框 */
.sa-app .sa-input { width: 100%; border: 1px solid #e6dfd5; border-radius: 12px; padding: 12px 14px; font-size: 14px; outline: none; transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1); background: #f5f2eb; color: #44403c; }
.sa-app .sa-input:focus { background: #ffffff; border-color: #6366f1; box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.08); }
.sa-app .sa-input::placeholder { color: #a8a29e; }
.sa-app .sa-input.sa-err { background: #fff5f5; border-color: #fca5a5; box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.06); }

/* 运单结果 */
.sa-app .sa-track-result { background: #f2f9f4; border: 1px solid #e1f0e5; border-radius: 12px; padding: 14px 16px; margin-top: 16px; display: none; }
.sa-app .sa-track-result.sa-show { display: block; animation: saFadeIn 0.45s cubic-bezier(0.16, 1, 0.3, 1) both; }
.sa-app .sa-track-result .sa-tr-status { font-weight: 700; color: #16a34a; font-size: 15px; margin-bottom: 6px; }
.sa-app .sa-track-result .sa-tr-info { color: #166534; font-size: 13.5px; line-height: 1.6; word-break: break-all; white-space: pre-line; }
.sa-app .sa-track-result.sa-err { background: #fdf4f4; border-color: #fbe8e8; }
.sa-app .sa-track-result.sa-err .sa-tr-status { color: #dc2626; }
.sa-app .sa-track-result.sa-err .sa-tr-info { color: #991b1b; }

/* ---------- 侧边栏 (PC) ---------- */
.sa-app .sa-side-bar {
display: none; /* 默认隐藏，桌面显示 */
}
@media (min-width: 1024px) {
.sa-app .sa-side-bar {
display: flex;
}
}

.sa-app .sa-side-item {
width: 3.25rem;
height: 3.25rem;
display: flex;
align-items: center;
justify-content: center;
background: #ffffff;
color: #57534e;
border: 1px solid #ede9e2;
border-radius: 12px;
box-shadow: 0 4px 12px rgba(68, 62, 52, 0.03);
transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.sa-app .sa-side-item svg { width: 20px; height: 20px; fill: currentColor; stroke: currentColor; }
.sa-app .sa-side-item i { font-size: 18px; color: currentColor; }
.sa-app .sa-side-item:hover { transform: translateX(-6px); color: #6366f1; box-shadow: -6px 8px 20px rgba(68, 62, 52, 0.06); }

/* 侧边按钮独立颜色 */
.sa-app .sa-side-inquiry { background: #2563eb; color: #fff; border-color: #2563eb; }
.sa-app .sa-side-track { background: #06b6d4; color: #fff; border-color: #06b6d4; }
.sa-app .sa-side-chat { background: #07c160; color: #fff; border-color: #07c160; }
.sa-app .sa-side-top { background: #1e293b; color: #fff; border-color: #1e293b; }
.sa-app .sa-side-item.sa-side-top:hover { color: #fff; background: #334155; } /* 返回顶部悬停微调 */

/* ---------- 返回顶部按钮 ---------- */
.sa-app .sa-back-top {
transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
opacity: 0; visibility: hidden; transform: translateY(16px) scale(0.9);
}
.sa-app .sa-back-top.sa-show { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }

/* 移动端返回顶部 */
.sa-app .sa-back-top-m {
display: flex;
}
@media (min-width: 1024px) {
.sa-app .sa-back-top-m { display: none; }
}

/* 桌面端返回顶部 (在侧边栏内，通过 sa-show 控制可见) */
.sa-app .sa-back-top-d {
/* 初始由 sa-side-item 控制显示，但还需通过 sa-show 类控制透明度，脚本已有逻辑，此处确保过渡 */
transition: opacity 0.35s, visibility 0.35s;
}
.sa-app .sa-back-top-d.sa-show { opacity: 1; pointer-events: auto; }

/* ---------- 移动端底部导航 ---------- */
.sa-app .sa-mobile-nav {
display: block;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
@media (min-width: 1024px) {
.sa-app .sa-mobile-nav { display: none; }
}

/* 聊天滚动条 */
.sa-app .sa-chat-scroll::-webkit-scrollbar { width: 4px; }
.sa-app .sa-chat-scroll::-webkit-scrollbar-track { background: transparent; }
.sa-app .sa-chat-scroll::-webkit-scrollbar-thumb { background: #d6d3d1; border-radius: 10px; }
.sa-app .sa-chat-scroll::-webkit-scrollbar-thumb:hover { background: #a8a29e; }

/* 滚动锁定 */
html.sa-no-scroll, body.sa-no-scroll { overflow: hidden !important; }

@keyframes saFadeIn {
from { opacity: 0; transform: translateY(8px) scale(0.99); }
to { opacity: 1; transform: translateY(0) scale(1); }
}