/* assets/header.css
 * 头部相关样式全部放这里，其他页面只要引入这个文件就能复用 header
 */

a {
    text-decoration: none;
}

/* 顶部两层 Header 外壳 */
#site_header {
    background: #ffffff;
    border-bottom: 1px solid #e5e7eb;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}

/* 顶部细导航条 */
#global_nav {
    position: relative;
    z-index: 1;
    background: #f9fafb;
    border-bottom: 1px solid rgba(148, 163, 184, 0.18);
    font-size: 12px;
    color: #6b7280;
}

#global_nav .inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 36px;
}

.global-left {
    display: flex;
    align-items: center;
    gap: 20px;
}

.global-left .link {
    color: #6b7280;
    text-decoration: none;
    white-space: nowrap;
}

.global-left .link:hover {
    color: #111827;
}

.global-right {
    display: flex;
    align-items: center;
    gap: 16px;
}

.download_app {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    color: #4b5563;
    font-size: 12px;
}

.download_app:hover {
    color: #111827;
}

.language_currency {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 10px;
    border-radius: 999px;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    font-size: 12px;
    color: #4b5563;
}

.language_currency .flag {
    font-size: 15px;
}

.language_currency .divider {
    color: #d1d5db;
}

/* 主导航行 */
#main_nav {
    position: relative;
    z-index: 20;
    background: #ffffff;
    transition: box-shadow 160ms ease, border-color 160ms ease, background-color 160ms ease;
}

#main_nav .inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 72px;
}

.main-left {
    display: flex;
    align-items: center;
    gap: 32px;
}

/* Logo */
#nav_logo a {
    display: inline-flex;
    align-items: center;
    font-weight: 800;
    letter-spacing: 0.16em;
    font-size: 22px;
    color: #111827;
    text-decoration: none;
}

/* 一级分类导航 */
#nav_zone {
    display: flex;
    align-items: center;
    gap: 24px;
    font-size: 13px;
}

#nav_zone .type {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    cursor: pointer;
    position: relative;
    color: #4b5563;
}

#nav_zone .bt {
    color: #4b5563;
    text-decoration: none;
    padding: 4px 0;
    position: relative;
}

#nav_zone .bt span {
    letter-spacing: 0.04em;
}

#nav_zone .bt::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -6px;
    width: 0;
    height: 2px;
    border-radius: 999px;
    background: #111827;
    transition: width 180ms ease;
}

#nav_zone .type:hover .bt {
    color: #111827;
}

#nav_zone .type:hover .bt::after {
    width: 100%;
}

.drop-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #9ca3af;
    line-height: 1;
    transform: translateY(1px);
}

.has-drop:hover .drop-icon {
    color: #6b7280;
}

/* 右侧：搜索 + 购物车 + 用户 */
.menu {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 0 1 auto;   /* ✅ 允许缩小 */
    justify-content: flex-end;
}

/* 搜索条 */
.cpt-search {
    position: relative;
    display: flex;
    align-items: center;
    height: 40px;
    padding: 0 4px 0 16px;
    border-radius: 999px;
    background: #f3f4f6;
    border: 1px solid transparent;
    flex: 0 1 clamp(240px, 28vw, 360px);  /* ✅ 最小240，中间随屏幕变，最大360 */
}

.cpt-search:hover {
    border-color: #e5e7eb;
}

.cpt-search input[type="search"] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 14px;
    color: #111827;
}

.cpt-search input[type="search"]::placeholder {
    color: #9ca3af;
}

.cpt-search .btw {
    border: none;
    background: transparent;
    border-radius: 999px;
    padding: 0 12px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #6b7280;
}

.cpt-search .btw:hover {
    color: #111827;
}

/* 让“搜索”按钮只显示图标（可选） */
.cpt-search .btw span[icon-only] {
    font-size: 0;
}
.cpt-search .btw span[icon-only]::before {
    content: "search";
    font-family: "Material Icons";
    font-size: 18px;
    font-weight: normal;
}

/* 登录按钮（未登录时） */
.user .login-btn {
    height: 40px;
    padding: 0 24px;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    color: #111827;
}

.user .login-btn:hover {
    border-color: #d1d5db;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

/* ============ 购物车 + 头像区域 ============ */
.menu-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* 小圆形图标按钮（购物车） */
.icon-btn {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #4b5563;
}

.icon-btn:hover {
    border-color: #d1d5db;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.icon-btn .material-icons {
    font-size: 20px;
}

/* 头像按钮本身不再加背景，只包住圆形头像 */
.avatar-btn {
    border: none;
    background: none;
    padding: 0;
    cursor: pointer;
}

/* 小圆头像（深色圆 + 首字母 / 头像图） */
.avatar-circle {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    background: #111827;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 16px;
    overflow: hidden;
}

.avatar-circle img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 大号头像（下拉卡片里） */
.avatar-circle-lg {
    width: 48px;
    height: 48px;
    font-size: 20px;
}

/* ============ 用户下拉菜单 ============ */

.user-logged {
    position: relative;
}

.user-dropdown {
    position: absolute;
    top: 52px;
    right: 0;
    width: 360px;
    max-width: 90vw;
    background: #ffffff;
    border-radius: 24px;
    box-shadow:
        0 22px 55px rgba(15, 23, 42, 0.24),
        0 0 0 1px rgba(148, 163, 184, 0.35);
    padding: 18px 20px 14px;
    display: none;
    color: #111827;
}

.user-dropdown.is-open {
    display: block;
}

/* 顶部：头像 + 基本信息 */
.user-dropdown-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e5e7eb;
    margin-bottom: 12px;
}

.user-basic {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.user-id {
    font-weight: 800;
    font-size: 15px;
}

.user-email {
    font-size: 12px;
    color: #6b7280;
}

/* 中间菜单：两列栅格 */
.user-dropdown-body {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 30px;
    padding: 4px 0 10px;
}

.user-menu-item {
    text-decoration: none;
    border: none;
    background: none;
    padding: 4px 0;
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #374151;
    cursor: pointer;
    text-align: left;
}

.user-menu-item:hover {
    color: #111827;
}

.user-menu-icon {
    font-family: "Material Icons";
    font-size: 18px;
    line-height: 1;
    color: #9ca3af;
}

/* 底部：退出 */
.user-dropdown-footer {
    padding-top: 10px;
    margin-top: 4px;
    border-top: 1px solid #e5e7eb;
}

.user-menu-logout {
    color: #f97316;
    font-weight: 600;
}

.user-menu-logout .user-menu-icon {
    color: #f97316;
}

/* 吸顶状态 */
#main_nav.is-fixed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: #ffffff;
    border-bottom: 1px solid rgba(148, 163, 184, 0.25);
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
}

body.has-fixed-mainnav main {
    padding-top: 72px;
}

/* 响应式：Header */
@media (max-width: 1024px) {
    #main_nav .inner {
        gap: 16px;
    }

    #nav_zone {
        display: none;
    }

    .menu {
        flex: 1;
    }

    .user-dropdown {
        right: 4px;
    }
}



/* =========================
   全局顶部 Toast 提示条（方案 B：卡片气泡）
   如果使用本方案，请把上面方案 A 整段删掉，只保留这一段
   ========================= */
.fm-toast-root {
    position: fixed;
    top: 96px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    pointer-events: none;
    z-index: 2000;
}

.fm-toast {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    border-radius: 18px;        /* 圆角卡片，依然比较圆润 */
    font-size: 13px;
    line-height: 1.5;
    pointer-events: auto;

    max-width: min(460px, calc(100vw - 40px));
    text-align: center;
    word-break: break-all;

    background: rgba(255, 255, 255, 0.96);             /* 近白色底，亮色系 */
    border: 1px solid rgba(209, 213, 219, 0.9);        /* 淡灰边 */
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.10);
}

/* 进入 / 离场动画 */
.fm-toast-enter {
    opacity: 0;
    transform: translateY(-8px);
}
.fm-toast-enter-active {
    opacity: 1;
    transform: translateY(0);
    transition: opacity .22s ease, transform .22s ease;
}
.fm-toast-leave {
    opacity: 1;
    transform: translateY(0);
}
.fm-toast-leave-active {
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity .18s ease, transform .18s ease;
}

.fm-toast__icon {
    font-family: "Material Icons";
    font-size: 18px;
    line-height: 1;
}

/* 蓝色 info：用左边色条 + 文字色来表现，色块非常浅 */
.fm-toast--info {
    border-color: rgba(59, 130, 246, 0.30);
    box-shadow:
        0 18px 45px rgba(15, 23, 42, 0.08),
        0 0 0 1px rgba(59, 130, 246, 0.08);
    color: #1d4ed8;
    background-image: linear-gradient(
        to right,
        rgba(59, 130, 246, 0.04),
        rgba(59, 130, 246, 0.00)
    );
}

/* 红色 error：一样思路，浅红渐变 */
.fm-toast--error {
    border-color: rgba(248, 113, 113, 0.35);
    box-shadow:
        0 18px 45px rgba(15, 23, 42, 0.08),
        0 0 0 1px rgba(248, 113, 113, 0.08);
    color: #b91c1c;
    background-image: linear-gradient(
        to right,
        rgba(248, 113, 113, 0.05),
        rgba(248, 113, 113, 0.00)
    );
}

/* 购物车按钮：作为数量角标的定位容器 */
.cart-btn {
  position: relative;
}

/* 右上角数量角标 */
.cart-count-badge {
  position: absolute;
  top: -4px;
  right: -6px;

  min-width: 18px;
  height: 18px;
  padding: 0 5px;

  border-radius: 999px;
  background: #ef4444;
  color: #ffffff;

  font-size: 11px;
  font-weight: 600;
  line-height: 18px;

  display: flex;
  align-items: center;
  justify-content: center;

  box-shadow: 0 8px 18px rgba(239, 68, 68, 0.55);
}

/* 数量为 0 时隐藏 */
.cart-count-badge.is-empty {
  display: none;
}





/* =========================
   Header 搜索框「正经版」最终覆盖（放 header.css 最底部）
   目标：menu 占满剩余空间，但搜索框有上限，不会撑爆
   ========================= */

/* 1) 右侧 menu 要吃满剩余空间（不然会出现你截图那种大空白） */
#site_header #main_nav .menu{
  flex: 1 1 auto !important;
  min-width: 0 !important;
  justify-content: flex-end;
}

/* 2) 搜索容器：可伸缩 + 有最大宽度（关键） */
#site_header #main_nav .menu > .search{
  flex: 1 1 auto !important;
  min-width: 220px !important;
  max-width: 420px !important;      /* ✅ 想更窄：改 360 / 380 */
}

/* 3) 搜索条本体：别用你之前的 clamp 固死，直接跟随 .search 宽度 */
#site_header #main_nav .menu > .search .cpt-search{
  width: 100% !important;
  flex: 1 1 auto !important;        /* 覆盖你原来的 flex: 0 1 clamp(...) */
}

#site_header #main_nav .menu > .search .cpt-search input[type="search"]{
  min-width: 0 !important;
}

/* 4) 右侧按钮永远不被挤变形 */
#site_header #main_nav .menu-actions,
#site_header #main_nav .user{
  flex: 0 0 auto !important;
}

/* 5) 1024 断点：保留原布局（只是让搜索更稳一点） */
@media (max-width: 1024px){
  #site_header #main_nav .menu > .search{
    max-width: 360px !important;
    min-width: 200px !important;
  }
}

/* 手机端国家/语言入口（放 main_nav 的 menu-actions） */
.lc-mini{
  display: none;                 /* 默认隐藏：桌面用 global_nav 的 language_currency */
  width: auto;
  padding: 0 10px;
  gap: 6px;
  border-radius: 999px;
}
.lc-mini-flag{ font-size: 15px; line-height: 1; }
.lc-mini-currency{ font-size: 12px; font-weight: 700; color: #374151; }






/* =========================
   Header — Mobile Clean (ONE version only)
   - Left: Logo
   - Right: Search btn + Avatar + Lang/Currency pill
   - Hide user-dropdown on mobile always
   - No Material Icons
   ========================= */

:root{
  --fm-text:#111827;
  --fm-muted:#6b7280;
  --fm-border:#e5e7eb;
  --fm-soft:#f3f4f6;
  --fm-accent:#2563eb;
  --fm-shadow: 0 10px 22px rgba(15,23,42,0.06);
}

/* SVG icon base */
#site_header .fm-ico{
  width: 20px;
  height: 20px;
  display: block;
  color: currentColor;
}

/* 桌面搜索按钮里如果放 svg，让它居中 */
#site_header .cpt-search .btw{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* drop-icon 如果你用 svg */
#site_header .drop-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#9ca3af;
}

/* ====== Mobile layout (ONLY this one) ====== */
@media (max-width: 768px){

  /* 顶部细条：手机隐藏 */
  #global_nav{ display:none !important; }

  /* ✅ 手机端：永远隐藏用户下拉（包含 is-open） */
  #site_header .user-dropdown,
  #site_header .user-dropdown.is-open{
    display:none !important;
  }

  /* ✅ 你不需要 hamburger：即使 DOM 里还有，也强制隐藏 */
  #site_header .m-hamburger{
    display:none !important;
  }

  /* 主导航白色条 */
  #site_header #main_nav{
    background:#fff;
    border-bottom: 1px solid rgba(229,231,235,0.9);
    box-shadow: var(--fm-shadow);
  }

  /* 关键：恢复“一行布局”，不换行、不 absolute 居中 */
  #site_header #main_nav .inner{
    position: relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    flex-wrap:nowrap !important;

    height:56px !important;
    padding: 0 14px !important;
    gap: 12px !important;
  }

  /* 左侧只留 Logo，靠左 */
  #site_header #main_nav .main-left{
    width:auto !important;
    flex: 0 0 auto !important;
    margin-left:0 !important;
    gap:0 !important;
  }

  #site_header #main_nav #nav_logo{
    position: static !important;
    transform:none !important;
  }

  #site_header #main_nav #nav_logo a{
    font-size: 18px;
    font-weight: 900;
    letter-spacing: .10em;
    color: var(--fm-text);
    white-space: nowrap;
  }

  /* 手机不显示分类 */
  #site_header #main_nav #nav_zone{
    display:none !important;
  }

  /* 右侧 menu：只放 actions，不要被你桌面的 flex:1 影响 */
  #site_header #main_nav .menu{
    width:auto !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
    justify-content:flex-end !important;
    gap: 10px !important;
  }

  /* 手机隐藏桌面搜索条 */
  #site_header #main_nav .menu > .search{
    display:none !important;
  }

  /* actions：全部垂直居中同高对齐 */
  #site_header #main_nav .menu-actions{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:10px !important;
    margin-left:0 !important;
  }

  /* （可选）如果你手机不想显示购物车：打开这一行 */
  /* #site_header #main_nav .cart-btn{ display:none !important; } */

  /* 搜索按钮：灰底圆角方块 */
  #site_header .icon-btn.m-search-btn{
    width:40px !important;
    height:40px !important;
    border:none !important;
    background: var(--fm-soft) !important;
    color: var(--fm-text) !important;
    border-radius: 14px !important;
    box-shadow:none !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:0 !important;
  }

  /* 头像：圆形 */
  #site_header #main_nav .avatar-circle{
    width:40px !important;
    height:40px !important;
    border-radius:999px !important;
    background: var(--fm-text) !important;
    color:#fff !important;
  }

  /* 语言胶囊：ZH / CNY */
  #site_header .lc-mini{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    height:40px !important;
    padding: 0 12px !important;
    border-radius: 14px !important;
    border: 1px solid rgba(229,231,235,0.95) !important;
    background:#fff !important;
    color: var(--fm-text) !important;
    box-shadow: 0 6px 18px rgba(15,23,42,0.06) !important;
    white-space:nowrap !important;
  }
  #site_header .lc-mini .lc-mini-text{
    font-size:12px !important;
    font-weight:900 !important;
    letter-spacing:.02em !important;
  }

  /* ===== Mobile Search Panel (可选：点🔍展开) ===== */
  #site_header #main_nav .m-search-panel{
    position:absolute;
    left:14px;
    right:14px;
    top:56px;
    display:none;
    padding: 10px 0 12px;
    z-index:50;
  }
  #site_header #main_nav .m-search-panel.is-open{ display:block; }

  #site_header #main_nav .m-search-panel .m-search-bar{
    width:100%;
    height:40px;
    padding:0 10px 0 14px;
    border-radius: 14px;
    background:#fff;
    border:1px solid rgba(229,231,235,0.95);
    box-shadow: 0 16px 30px rgba(15,23,42,0.10);
    display:flex;
    align-items:center;
    gap:8px;
  }
  #site_header #main_nav .m-search-panel input[type="search"]{
    flex:1;
    min-width:0;
    border:none;
    outline:none;
    background:transparent;
    font-size:13px;
    color:var(--fm-text);
  }
  #site_header #main_nav .m-search-panel input[type="search"]::placeholder{
    color:#9ca3af;
  }
  #site_header #main_nav .m-search-panel .btw{
    border:none;
    background:transparent;
    padding:0;
    color:var(--fm-accent);
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
}
/* =========================
   HEADER PATCH (fix double search + align mobile edges)
   把这段放到 header.css 最底部
   ========================= */

/* ---- 1) 默认：移动端专用控件先隐藏（避免桌面出现第二套搜索） ---- */
#site_header .m-search-btn,
#site_header #m_search_panel,
#site_header .lc-mini{
  display: none;
}

/* ---- 2) 桌面端：彻底隐藏移动搜索面板（避免成为 flex 第三列）---- */
@media (min-width: 769px){
  #site_header #m_search_panel{ display:none !important; }
  #site_header .m-search-btn{ display:none !important; }
  #site_header .lc-mini{ display:none !important; }
}

/* ---- 3) 手机端：一行布局，Logo 左贴，右侧 actions 贴右 ---- */
@media (max-width: 768px){

  /* 关键：你的 inner 带 container，会有 max-width/margin/padding，手机强制拉满并收紧左右 */
  #site_header #main_nav .inner.container{
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-left: 10px !important;   /* 想更贴边：改 8；想更安全：改 12 */
    padding-right: 10px !important;
  }

  /* 一行：不换行，左右两端对齐 */
  #site_header #main_nav .inner{
    flex-wrap: nowrap !important;
    height: 56px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  /* 左侧只保留 logo：不要 100% 宽，不要负 margin */
  #site_header #main_nav .main-left{
    width: auto !important;
    margin-left: 0 !important;
    gap: 0 !important;
    flex: 0 0 auto !important;
  }

  /* 防止你旧代码把 logo absolute 居中 */
  #site_header #main_nav #nav_logo{
    position: static !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
  }

  /* 右侧 menu 不要变 100% */
  #site_header #main_nav .menu{
    width: auto !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
    justify-content: flex-end !important;
    align-items: center !important;
  }

  /* 手机隐藏 PC 搜索条 */
  #site_header #main_nav .menu > .search{
    display: none !important;
  }

  /* actions 贴右，去掉 margin-left 推开 */
  #site_header #main_nav .menu-actions{
    margin-left: 0 !important;
    padding-right: 0 !important;
    gap: 10px !important;
    justify-content: flex-end !important;
    align-items: center !important;
  }

  /* 手机显示：搜索按钮 + 语言胶囊 */
  #site_header .m-search-btn{ display:inline-flex !important; }
  #site_header .lc-mini{ display:inline-flex !important; }

  /* 搜索按钮：圆角方块（不要圆形） */
  #site_header .icon-btn.m-search-btn{
    width: 40px !important;
    height: 40px !important;
    border: none !important;
    background: #f3f4f6 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    color: #111827 !important;
  }
  #site_header .icon-btn.m-search-btn svg{
    width: 20px;
    height: 20px;
  }

  /* 语言胶囊：更像你截图那种 pill */
  #site_header .lc-mini{
    height: 40px !important;
    padding: 0 12px !important;
    border-radius: 14px !important;
    border: 1px solid rgba(229,231,235,0.95) !important;
    background: #ffffff !important;
    color: #111827 !important;
    box-shadow: 0 6px 18px rgba(15,23,42,0.06) !important;
  }

  /* m_search_panel：必须绝对定位 + 默认不显示，否则就变“第二个搜索框” */
  #site_header #m_search_panel{
    position: absolute !important;
    left: 10px !important;
    right: 10px !important;
    top: 56px !important;
    display: none !important;
    z-index: 80 !important;
  }
  #site_header #m_search_panel.is-open{
    display: block !important;
  }
}



/* =========================
   LOGO IMAGE — HARD FORCE (put at VERY bottom)
   ========================= */

/* 先把 nav_logo 的可用高度撑满（不然你加高 img 也会被压缩观感） */
#site_header #main_nav #nav_logo a{
  display: inline-flex !important;
  align-items: center !important;
  height: 100% !important;
  padding: 0 !important;
  line-height: 1 !important;
}

/* ✅ 强制所有 nav_logo 里的 img 按高度显示（干掉 26/32 之类限制） */
#site_header #main_nav #nav_logo img,
#site_header #main_nav #nav_logo img.fm-logo-img{
  height: 52px !important;        /* 桌面：52（你想更大：56） */
  width: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  display: block !important;

  /* 防止太长挤到右侧按钮 */
  max-width: 320px !important;
  object-fit: contain !important;
}

/* 手机：你现在截图是手机视图，直接给你更饱满 */
@media (max-width: 768px){
  #site_header #main_nav #nav_logo img,
  #site_header #main_nav #nav_logo img.fm-logo-img{
    height: 44px !important;      /* 手机：44（建议 42~46） */
    max-width: 220px !important;
  }
}

/* ====== 可选：如果 PNG 上下留白太大，打开这段“裁空白 + 放大一点” ====== */
/*
#site_header #main_nav #nav_logo img,
#site_header #main_nav #nav_logo img.fm-logo-img{
  clip-path: inset(18% 0 22% 0);   // 裁上下留白（按需要改 12~26%）
  transform: scale(1.10);          // 再放大一点
  transform-origin: left center;
}
*/
/* 桌面 */
#site_header #main_nav #nav_logo img.fm-logo-img{
  height: 56px !important;   /* 原来 52，改大一点就会更“长” */
  max-width: 420px !important; /* 原来 320，放宽上限 */
}

/* 手机 */
@media (max-width: 768px){
  #site_header #main_nav #nav_logo img.fm-logo-img{
    height: 48px !important;   /* 原来 44 */
    max-width: 260px !important; /* 原来 220 */
  }
}