/* ============================================================
 * ManyExpo 统一站点导航 site-nav.css
 * 单一来源：前台 mega header + 移动抽屉 + 五语语言下拉 + 明暗主题
 *           + 登录/注册/头像下拉 + 后台 slim topbar + SEO 页脚
 * 命名空间 .mx-，避免与各页旧分叉 navbar 样式冲突。
 * 明暗主题跟随 <html data-theme="light|dark">。
 * ============================================================ */

:root{
  --mx-brand:#C8102E; --mx-brand-dk:#9c0b22; --mx-brand-soft:rgba(200,16,46,.10);
  --mx-bg:#ffffff; --mx-bg-2:#f6f7f9; --mx-line:#e7e8ee;
  --mx-tx:#1d1d1f; --mx-tx-2:#5b616e; --mx-tx-3:#8a90a0;
  --mx-radius:12px; --mx-shadow:0 8px 28px rgba(20,10,16,.10);
  --mx-max:1240px;
}
html[data-theme="dark"]{
  --mx-bg:#16181d; --mx-bg-2:#1e2128; --mx-line:#2a2e37;
  --mx-tx:#f2f3f5; --mx-tx-2:#b7bcc7; --mx-tx-3:#8b91a0;
  --mx-brand-soft:rgba(200,16,46,.22);
}

/* ---------- 前台 mega header ---------- */
.mx-header{position:sticky;top:0;z-index:1000;background:var(--mx-bg);border-bottom:1px solid var(--mx-line);}
.mx-header-in{max-width:var(--mx-max);margin:0 auto;padding:0 20px;height:60px;display:flex;align-items:center;gap:18px;}
.mx-logo{display:flex;align-items:center;gap:9px;text-decoration:none;flex-shrink:0;}
.mx-logo-ic{width:32px;height:32px;border-radius:9px;background:var(--mx-brand);color:#fff;display:inline-flex;align-items:center;justify-content:center;}
.mx-logo-ic svg{width:18px;height:18px;}
.mx-logo-tx{font-size:19px;font-weight:800;color:var(--mx-tx);letter-spacing:-.3px;line-height:1;}
.mx-logo-tx b{color:var(--mx-brand);}
.mx-logo-en{display:block;font-size:10.5px;font-weight:600;color:var(--mx-tx-3);letter-spacing:.04em;margin-top:2px;}
/* 非中文站：隐藏中文品牌名“多展网”，ManyExpo 升为主名 */
html[lang]:not([lang="zh-CN"]) .mx-logo-zh{display:none;}
html[lang]:not([lang="zh-CN"]) .mx-logo-en{font-size:1em;font-weight:800;color:inherit;letter-spacing:-.3px;margin-top:0;}

.mx-menu{display:flex;align-items:center;gap:2px;list-style:none;margin:0;padding:0;flex:1 1 auto;min-width:0;overflow-x:auto;scrollbar-width:none;}
.mx-menu::-webkit-scrollbar{display:none;}
.mx-menu>li{position:relative;white-space:nowrap;}
.mx-menu>li>a{display:flex;align-items:center;gap:4px;padding:8px 11px;font-size:14px;font-weight:500;color:var(--mx-tx-2);text-decoration:none;border-radius:8px;transition:.15s;}
.mx-menu>li>a:hover{color:var(--mx-tx);background:var(--mx-bg-2);}
.mx-menu>li>a.mx-on{color:var(--mx-brand);background:var(--mx-brand-soft);font-weight:600;}
.mx-caret{font-size:9px;opacity:.6;}

.mx-drop{position:absolute;top:calc(100% + 8px);left:0;min-width:190px;background:var(--mx-bg);border:1px solid var(--mx-line);border-radius:var(--mx-radius);box-shadow:var(--mx-shadow);padding:6px;opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s;}
.mx-menu>li:hover>.mx-drop,.mx-menu>li.mx-open>.mx-drop{opacity:1;visibility:visible;transform:translateY(0);}
.mx-drop a{display:block;padding:9px 12px;font-size:13.5px;color:var(--mx-tx-2);text-decoration:none;border-radius:8px;}
.mx-drop a:hover{background:var(--mx-bg-2);color:var(--mx-tx);}

/* 右侧操作区 */
.mx-acts{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.mx-search{display:flex;align-items:center;gap:7px;background:var(--mx-bg-2);border:1px solid var(--mx-line);border-radius:999px;padding:6px 12px;}
.mx-search svg{width:15px;height:15px;color:var(--mx-tx-3);}
.mx-search input{border:0;background:transparent;outline:0;font-size:13px;width:96px;color:var(--mx-tx);}
.mx-search input::placeholder{color:var(--mx-tx-3);}

.mx-icbtn{width:38px;height:38px;border-radius:10px;border:1px solid var(--mx-line);background:var(--mx-bg);color:var(--mx-tx-2);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:15px;}
.mx-icbtn:hover{background:var(--mx-bg-2);color:var(--mx-tx);}
.mx-icbtn svg{width:18px;height:18px;}

/* 语言下拉 */
.mx-lang{position:relative;}
.mx-lang-btn{display:flex;align-items:center;gap:6px;height:38px;padding:0 12px;border-radius:10px;border:1px solid var(--mx-line);background:var(--mx-bg);color:var(--mx-tx-2);font-size:13px;font-weight:600;cursor:pointer;}
.mx-lang-btn:hover{background:var(--mx-bg-2);}
.mx-lang-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:150px;background:var(--mx-bg);border:1px solid var(--mx-line);border-radius:var(--mx-radius);box-shadow:var(--mx-shadow);padding:6px;opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s;}
.mx-lang.mx-open .mx-lang-menu{opacity:1;visibility:visible;transform:translateY(0);}
.mx-lang-menu a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 12px;font-size:13.5px;color:var(--mx-tx-2);text-decoration:none;border-radius:8px;}
.mx-lang-menu a:hover{background:var(--mx-bg-2);}
.mx-lang-menu a.mx-on{color:var(--mx-brand);font-weight:700;}
.mx-lang-menu a small{color:var(--mx-tx-3);}

/* 按钮 */
.mx-btn{display:inline-flex;align-items:center;justify-content:center;height:38px;padding:0 16px;border-radius:10px;font-size:13.5px;font-weight:600;text-decoration:none;cursor:pointer;border:1px solid transparent;white-space:nowrap;}
.mx-btn-ghost{background:transparent;color:var(--mx-tx-2);border-color:var(--mx-line);}
.mx-btn-ghost:hover{background:var(--mx-bg-2);color:var(--mx-tx);}
.mx-btn-primary{background:var(--mx-brand);color:#fff;}
.mx-btn-primary:hover{background:var(--mx-brand-dk);}

/* 头像下拉 */
.mx-user{position:relative;}
.mx-avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--mx-brand),#E04555);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;cursor:pointer;border:2px solid var(--mx-line);}
.mx-user-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:220px;background:var(--mx-bg);border:1px solid var(--mx-line);border-radius:var(--mx-radius);box-shadow:var(--mx-shadow);padding:6px;opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s;}
.mx-user.mx-open .mx-user-menu{opacity:1;visibility:visible;transform:translateY(0);}
.mx-user-info{padding:10px 12px;border-bottom:1px solid var(--mx-line);margin-bottom:4px;}
.mx-user-info b{display:block;font-size:14px;color:var(--mx-tx);}
.mx-user-info span{font-size:12px;color:var(--mx-tx-3);}
.mx-user-menu a{display:flex;align-items:center;gap:8px;padding:9px 12px;font-size:13.5px;color:var(--mx-tx-2);text-decoration:none;border-radius:8px;}
.mx-user-menu a:hover{background:var(--mx-bg-2);color:var(--mx-tx);}
.mx-user-menu a.mx-logout{color:#d64545;}

/* 汉堡（桌面隐藏） */
.mx-burger{display:none;}

/* ---------- 移动抽屉 ---------- */
.mx-ov{position:fixed;inset:0;background:rgba(30,8,14,.5);z-index:1100;opacity:0;visibility:hidden;transition:.25s;}
.mx-ov.mx-open{opacity:1;visibility:visible;}
.mx-drawer{position:fixed;top:0;right:0;bottom:0;width:340px;max-width:88vw;background:var(--mx-bg);z-index:1200;transform:translateX(100%);transition:.28s;display:flex;flex-direction:column;box-shadow:var(--mx-shadow);}
.mx-drawer.mx-open{transform:translateX(0);}
.mx-drawer-h{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--mx-line);}
.mx-drawer-x{width:36px;height:36px;border-radius:9px;border:1px solid var(--mx-line);background:transparent;color:var(--mx-tx-2);font-size:20px;cursor:pointer;}
.mx-drawer-b{flex:1;overflow-y:auto;padding:10px 12px;}
.mx-drawer-b a{display:flex;align-items:center;justify-content:space-between;padding:13px 12px;font-size:15px;color:var(--mx-tx-2);text-decoration:none;border-radius:10px;}
.mx-drawer-b a:hover{background:var(--mx-bg-2);}
.mx-drawer-b a.mx-on{color:var(--mx-brand);font-weight:600;}
.mx-drawer-sub{padding-left:14px;}
.mx-drawer-sub a{font-size:13.5px;padding:10px 12px;color:var(--mx-tx-3);}
.mx-drawer-f{padding:14px 18px;border-top:1px solid var(--mx-line);display:flex;flex-direction:column;gap:10px;}
.mx-drawer-lang{display:flex;flex-wrap:wrap;gap:6px;}
.mx-drawer-lang button{padding:6px 10px;border-radius:8px;border:1px solid var(--mx-line);background:var(--mx-bg);color:var(--mx-tx-2);font-size:12.5px;cursor:pointer;}
.mx-drawer-lang button.mx-on{background:var(--mx-brand);color:#fff;border-color:var(--mx-brand);}

/* ---------- 后台 slim topbar ---------- */
.mx-admintop{display:flex;align-items:center;gap:14px;padding:10px 20px;background:var(--mx-bg);border-bottom:1px solid var(--mx-line);position:sticky;top:0;z-index:900;}
.mx-admintop .mx-logo-tx{font-size:16px;}
.mx-back{font-size:12.5px;color:var(--mx-tx-3);text-decoration:none;padding:5px 10px;border-radius:8px;border:1px solid var(--mx-line);}
.mx-back:hover{background:var(--mx-bg-2);color:var(--mx-tx);}
.mx-admintop .mx-sp{flex:1;}

/* ---------- SEO 页脚（与旧 .footer 兼容的深色底） ---------- */
.mx-footer{background:#15181f;color:rgba(255,255,255,.72);padding:56px 0 22px;margin-top:0;}
.mx-footer-in{max-width:var(--mx-max);margin:0 auto;padding:0 20px;}
.mx-footer-grid{display:grid;grid-template-columns:1.7fr repeat(5,minmax(120px,1fr));gap:28px;margin-bottom:34px;}
.mx-footer-brand .mx-logo-tx{color:#fff;font-size:20px;}
.mx-footer-brand p{font-size:13px;line-height:1.75;opacity:.72;margin:14px 0 16px;max-width:320px;}
.mx-fsoc{display:flex;gap:10px;}
.mx-fsoc a{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;background:rgba(255,255,255,.1);color:#fff;}
.mx-fsoc a:hover{background:var(--mx-brand);}
.mx-fsoc svg{width:15px;height:15px;}
.mx-fcol h4{color:#fff;font-size:14px;font-weight:600;margin:0 0 14px;}
.mx-fcol a{display:block;color:rgba(255,255,255,.66);font-size:13px;text-decoration:none;padding:5px 0;}
.mx-fcol a:hover{color:#fff;}
.mx-fbot{border-top:1px solid rgba(255,255,255,.12);padding-top:18px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12.5px;opacity:.72;}

/* ---------- 响应式 ---------- */
@media(max-width:1180px){
  .mx-search{display:none;}
  .mx-menu>li>a{padding:8px 8px;font-size:13.5px;}
}
@media(max-width:900px){
  .mx-menu,.mx-search,.mx-header .mx-btn-ghost,.mx-header .mx-btn-primary{display:none;}
  .mx-burger{display:inline-flex;}
  .mx-header-in{gap:10px;}
  .mx-footer-grid{grid-template-columns:1fr 1fr;gap:22px;}
  .mx-footer-brand{grid-column:1/-1;}
}
@media(max-width:520px){
  .mx-lang-btn span.mx-lang-label{display:none;}
  .mx-lang-btn{padding:0 10px;}
}