/* ============================================================
 * corp.css —— 产品购买页 / 接口文档页 视觉层
 * 购买页：现代企业 SaaS；文档页：阿里云式三栏（深蓝 Banner + 目录树 + 正文 + 购买卡）
 * 依赖：home.css 的设计 token（--admin-* 变量）与 site-nav / site-foot
 * ============================================================ */

:root { --ali-blue: #006aff; }

/* ============================================================
 * 〇、全站企业化（首页 / 购买页 / 文档页共用）
 * ============================================================ */

/* 顶部导航：精致毛玻璃 + hairline */
.site-nav {
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: saturate(1.4) blur(14px);
    -webkit-backdrop-filter: saturate(1.4) blur(14px);
    border-bottom: 1px solid rgba(16, 24, 40, 0.07);
}
.nav-inner { height: 62px; max-width: 1280px; }
.brand b { font-size: 15.5px; font-weight: 800; letter-spacing: -.01em; color: #101418; }
.nav-link {
    font-size: 13.5px; font-weight: 500; color: var(--admin-text-body, #3d4757);
    padding: 6px 2px; border-bottom: 2px solid transparent;
    transition: color .2s, border-color .2s;
}
.nav-link:hover { color: var(--admin-primary); }
.nav-link.on { color: var(--admin-primary); font-weight: 700; border-bottom-color: var(--admin-primary); }

/* 页脚：深藏青企业页脚（横排三区） */
.site-foot {
    background: linear-gradient(180deg, #0e1524, #0a101b);
    color: rgba(255,255,255,.55);
    padding: 40px 24px 30px;
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) auto minmax(0, 1fr);
    gap: 24px; align-items: center;
    text-align: left;
}
.site-foot b { font-size: 15px; color: #fff; letter-spacing: .01em; }
.site-foot .foot-desc { display: block; margin-top: 6px; font-size: 12px; color: rgba(255,255,255,.4); line-height: 1.8; }
.site-foot em { font-style: normal; font-size: 11.5px; color: rgba(255,255,255,.3); text-align: right; }
@media (max-width: 768px) {
    .site-foot { grid-template-columns: 1fr; text-align: center; gap: 14px; padding: 30px 16px 24px; }
    .site-foot em { text-align: center; }
}

/* 区块标题（首页） */
.sec-title { font-size: 24px; font-weight: 900; color: #101418; letter-spacing: -.02em; }
.sec-sub { margin-top: 8px; font-size: 13.5px; color: var(--admin-text-muted, #8a93a6); }
.section-alt { background: #f7f9fc; }

/* 特性卡：素色化（去重卡片感） */
.feat-card { background: #fff; border: 1px solid var(--admin-border-light, #eef0f4); box-shadow: none; }
.feat-card:hover { border-color: var(--admin-primary); box-shadow: 0 8px 24px rgba(22,119,255,.08); }

/* ---------- 通用 ---------- */
.x1-hero-eyebrow {
    display: inline-flex; align-items: center;
    padding: 5px 14px; border-radius: 999px;
    background: #101418; color: #fff;
    font-size: 11.5px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
}
.mono { font-family: "JetBrains Mono", Consolas, monospace; }

/* ============================================================
 * 一、产品购买页
 * ============================================================ */

/* --- Hero：留白优先的极简版 --- */
.x1-hero { background: #fff; border-bottom: 1px solid var(--admin-border-light, #eef0f4); }
.x1-hero-inner {
    max-width: 1120px; margin: 0 auto; padding: 72px 20px 60px;
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 56px; align-items: center;
}
.x1-hero h1 {
    margin-top: 18px; font-size: clamp(28px, 4.2vw, 42px); font-weight: 900;
    color: #101418; letter-spacing: -.03em; line-height: 1.18;
}
.x1-hero h1 em { font-style: normal; color: var(--admin-primary); }
.x1-hero-desc { margin-top: 18px; font-size: 14.5px; color: var(--admin-text-body, #3d4757); line-height: 2; max-width: 540px; }
.x1-hero-desc b { color: #101418; font-weight: 700; }

/* 指标：纯文字排版（无底色块，细线分隔） */
.x1-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px 40px; }
.x1-stat { border-left: 2px solid var(--admin-border-light, #eef0f4); padding-left: 16px; }
.x1-stat b { display: block; font-size: 21px; font-weight: 900; color: #101418; letter-spacing: -.01em; }
.x1-stat span { display: block; margin-top: 4px; font-size: 11px; color: var(--admin-text-muted, #8a93a6); letter-spacing: .1em; }
@media (max-width: 900px) {
    .x1-hero-inner { grid-template-columns: 1fr; padding: 48px 16px 40px; gap: 36px; }
    .x1-stats { grid-template-columns: repeat(4, 1fr); gap: 20px; }
    .x1-stat b { font-size: 16px; }
}
@media (max-width: 560px) {
    .x1-stats { grid-template-columns: repeat(2, 1fr); }
}

/* --- 主体：侧栏 + 内容（留白加大） --- */
.x1-body { max-width: 1120px; margin: 0 auto; padding: 44px 20px 72px; }
.x1-layout { display: grid; grid-template-columns: 228px minmax(0, 1fr); gap: 40px; align-items: start; }

/* 分类导航（重绘） */
.x1-side {
    position: sticky; top: 74px;
    background: #fff; border: 1px solid var(--admin-border-light, #eef0f4);
    border-radius: 14px; overflow: hidden;
    max-height: calc(100dvh - 96px); display: flex; flex-direction: column;
}
.x1-side-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 16px 12px;
}
.x1-side-title { font-size: 12px; font-weight: 700; letter-spacing: .14em; color: var(--admin-text-muted, #8a93a6); }
.x1-side-collapse {
    display: grid; place-items: center; width: 24px; height: 24px;
    border: none; border-radius: 6px; background: none;
    color: var(--admin-text-muted, #8a93a6); cursor: pointer; transition: all .15s;
}
.x1-side-collapse:hover { background: var(--admin-bg, #f5f6f8); color: var(--admin-primary); }
.x1-side-body { padding: 0 8px 10px; overflow-y: auto; flex: 1; }
.x1-nav-item {
    display: flex; align-items: center; gap: 8px;
    height: 38px; padding: 0 12px; margin: 2px 0;
    border-radius: 8px; cursor: pointer; text-decoration: none;
    font-size: 13px; color: var(--admin-text-body, #3d4757);
    transition: background .15s, color .15s;
}
.x1-nav-item .ni-icon { width: 24px; height: 24px; border-radius: 6px; display: grid; place-items: center; flex: none;
    background: var(--admin-bg, #f5f6f8); color: var(--admin-text-muted, #8a93a6); font-size: 12px; transition: all .15s; }
.x1-nav-item .ni-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.x1-nav-item .ni-count {
    flex: none; min-width: 20px; text-align: center; padding: 0 5px;
    font-size: 10.5px; font-weight: 700; line-height: 17px; border-radius: 8px;
    background: var(--admin-bg, #f5f6f8); color: var(--admin-text-muted, #8a93a6);
}
.x1-nav-item:hover { background: var(--admin-bg, #f5f6f8); }
.x1-nav-item:hover .ni-icon { background: rgba(22,119,255,.1); color: var(--admin-primary); }
.x1-nav-item.on { background: var(--admin-primary); color: #fff; font-weight: 600; }
.x1-nav-item.on .ni-icon { background: rgba(255,255,255,.16); color: #fff; }
.x1-nav-item.on .ni-count { background: rgba(255,255,255,.18); color: #fff; }
.x1-side-foot {
    padding: 10px 16px; border-top: 1px solid var(--admin-border-light, #eef0f4);
    font-size: 11px; color: var(--admin-text-muted, #8a93a6);
}

/* 折叠态 */
.x1-side.collapsed { display: none; }
.x1-layout.side-collapsed { grid-template-columns: 44px minmax(0, 1fr); }
.x1-expand {
    position: sticky; top: 74px; align-self: start;
    display: grid; place-items: center; width: 36px; height: 36px;
    border-radius: 10px; border: 1px solid var(--admin-border-light, #eef0f4);
    background: #fff; color: var(--admin-primary); cursor: pointer;
    box-shadow: 0 4px 14px rgba(16,24,40,.08); transition: all .2s;
}
.x1-layout:not(.side-collapsed) .x1-expand { display: none; }
.x1-expand:hover { background: var(--admin-primary); color: #fff; }

/* --- 分区（目录式，留白加大） --- */
.x1-sec { margin-bottom: 52px; scroll-margin-top: 86px; }
.x1-sec:last-child { margin-bottom: 0; }
.x1-sec-head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 24px; }
.x1-sec-index {
    font-family: "JetBrains Mono", Consolas, monospace;
    font-size: 12px; font-weight: 700; color: var(--admin-text-muted, #8a93a6);
    letter-spacing: .08em;
}
.x1-sec-name { font-size: 18px; font-weight: 800; color: var(--admin-text-title, #1c2333); letter-spacing: -.01em; }
.x1-sec-line { flex: 1; height: 1px; background: var(--admin-border-light, #eef0f4); }
.x1-sec-meta { font-size: 12px; color: var(--admin-text-muted, #8a93a6); flex: none; }

/* --- 产品卡（素色版：去灰底价格条/彩色条，靠留白分层） --- */
.x1-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
@media (max-width: 992px) { .x1-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .x1-grid { grid-template-columns: 1fr; } }

.x1-card {
    position: relative; display: flex; flex-direction: column;
    background: #fff; border: 1px solid var(--admin-border-light, #eef0f4);
    border-radius: 12px; overflow: hidden;
    transition: border-color .22s var(--ease), box-shadow .22s var(--ease);
    animation: rise-in .5s var(--ease) both;
    animation-delay: calc(var(--i, 0) * 60ms);
}
.x1-card:hover { border-color: var(--admin-text-title, #1c2333); box-shadow: 0 10px 30px rgba(16, 24, 40, .07); }

.x1-card-body { padding: 22px 22px 18px; flex: 1; }
.x1-card-tags { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.x1-tag { font-size: 11px; font-weight: 600; line-height: 18px; letter-spacing: .04em; }
.x1-tag-cat { color: var(--admin-text-muted, #8a93a6); }
.x1-tag-cat::after { content: '·'; margin-left: 8px; color: var(--admin-border); }
.x1-tag-mode { color: var(--admin-primary); }
.x1-tag-doc { color: var(--admin-text-muted, #8a93a6); margin-left: auto; }
.x1-tag-doc::before { content: '— '; }
/* 购买认证门槛徽章（需实名 / 需绑手机） */
.x1-tag-gate {
    color: var(--admin-warning, #e8830c);
    background: rgba(232, 131, 12, 0.09);
    border-radius: 3px;
    padding: 1px 7px;
    display: inline-flex; align-items: center; gap: 4px;
}
.x1-tag-gate .layui-icon { font-size: 11px; }

.x1-card-name { font-size: 16px; font-weight: 700; color: var(--admin-text-title, #1c2333); line-height: 1.45; }
.x1-card-desc {
    margin-top: 6px; font-size: 12px; color: var(--admin-text-muted, #8a93a6); line-height: 1.75;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    min-height: 0;
}

/* 规格行（表式两列） */
.x1-specs { margin-top: 16px; border-top: 1px solid var(--admin-border-light, #eef0f4); }
.x1-spec-row { display: flex; align-items: center; height: 34px; font-size: 12px; border-bottom: 1px solid var(--admin-border-light, #eef0f4); }
.x1-spec-row:last-child { border-bottom: none; }
.x1-spec-row .k { width: 62px; flex: none; color: var(--admin-text-muted, #8a93a6); }
.x1-spec-row .v { flex: 1; color: var(--admin-text-title, #1c2333); display: flex; align-items: center; gap: 6px; }
.x1-dot.off { background: var(--admin-danger, #e3403f); }

/* 底部价格区（白底细线，仅价格用一处红色强调） */
.x1-card-foot {
    display: flex; align-items: center; gap: 10px;
    padding: 14px 22px 20px;
    border-top: 1px solid var(--admin-border-light, #eef0f4);
}
.x1-price { flex: 1; min-width: 0; color: var(--admin-text-title, #1c2333); }
.x1-price .cur { font-size: 13px; font-weight: 700; color: var(--admin-text-title, #1c2333); }
.x1-price .num { font-size: 23px; font-weight: 800; color: var(--admin-text-title, #1c2333); letter-spacing: -.02em; }
.x1-price .cycle { font-size: 11px; color: var(--admin-text-muted, #8a93a6); margin-left: 3px; }
.x1-card-foot .layui-btn { display: none; }   /* 按钮已独立至 actions 区 */
/* 底部独立操作区（价格行之下）：默认收起，悬停弹性展开 */
.x1-card-actions {
    display: grid; grid-template-rows: 0fr;
    transition: grid-template-rows .35s var(--ease);
}
.x1-actions-inner {
    overflow: hidden; min-height: 0;
    display: flex; gap: 8px; padding: 0 18px;
    border-top: 1px solid transparent;
    opacity: 0; transform: translateY(6px);
    transition: opacity .3s var(--ease) .05s, transform .3s var(--ease) .05s, padding .35s var(--ease), border-color .35s var(--ease);
}
.x1-actions-inner .layui-btn { flex: 1; margin: 0; border-radius: 0 0 0 0; height: 40px; }
.x1-actions-inner .layui-btn + .layui-btn { margin-left: 0; }
.x1-card:hover .x1-card-actions,
.x1-card:focus-within .x1-card-actions { grid-template-rows: 1fr; }
.x1-card:hover .x1-actions-inner,
.x1-card:focus-within .x1-actions-inner {
    opacity: 1; transform: translateY(0); padding-bottom: 16px;
    border-top-color: var(--admin-border-light, #eef0f4);
}
.x1-actions-inner .layui-btn-primary { background: #fff; }
/* 触屏设备（无悬停）常显 */
@media (hover: none) {
    .x1-card-actions { grid-template-rows: 1fr; }
    .x1-actions-inner { opacity: 1; transform: none; padding-bottom: 16px; }
}

/* 空态 */
.x1-empty {
    padding: 60px 0; text-align: center; color: var(--admin-text-muted, #8a93a6);
}
.x1-empty .layui-icon { font-size: 34px; display: block; margin-bottom: 10px; }

/* 移动端分类横滚 */
.x1-chips { display: none; gap: 8px; overflow-x: auto; padding-bottom: 6px; margin-bottom: 16px; scrollbar-width: none; }
.x1-chips::-webkit-scrollbar { display: none; }
.x1-chip {
    flex: none; height: 30px; padding: 0 13px;
    display: inline-flex; align-items: center; gap: 5px;
    border: 1px solid var(--admin-border-light, #eef0f4); border-radius: 999px;
    background: #fff; font-size: 12.5px; color: var(--admin-text-body, #3d4757); cursor: pointer;
    transition: all .2s;
}
.x1-chip b { font-size: 10.5px; font-weight: 700; color: var(--admin-text-muted, #8a93a6); }
.x1-chip.on { background: var(--admin-primary); border-color: var(--admin-primary); color: #fff; }
.x1-chip.on b { color: rgba(255,255,255,.75); }

@media (max-width: 992px) {
    .x1-layout { grid-template-columns: 1fr; }
    .x1-side, .x1-expand { display: none; }
    .x1-chips { display: flex; }
    .x1-body { padding: 20px 14px 36px; }
}

/* 购物车底条（白底细线版） */
.buy-cartbar { background: #fff; border-top: 1px solid var(--admin-border-light, #eef0f4); box-shadow: 0 -6px 24px rgba(16,24,40,.06); }
.buy-cartbar-inner { max-width: 1120px; }

/* ============================================================
 * 二、接口文档页（阿里云式：深蓝 Banner + 三栏）
 * ============================================================ */

.al-body { background: #fff; }
.al-price .cur { font-size: 13px; font-weight: 700; }
.al-price .cycle { display: block; font-size: 11px; color: rgba(255,255,255,.5); margin-top: 2px; }
.al-buy.disabled { background: rgba(255,255,255,.12); color: rgba(255,255,255,.35); pointer-events: none; box-shadow: none; }

/* --- 三栏骨架（宽屏铺满） --- */
.al-shell {
    display: grid; grid-template-columns: 220px minmax(0, 1fr) 280px;
    gap: 40px;
    max-width: 1600px; margin: 0 auto; padding: 32px 32px 72px;
    align-items: start;
}

/* --- 左：本页目录树（白底，阿里云文档树） --- */
.al-tree { position: sticky; top: 74px; }
.al-tree-head {
    font-size: 13px; font-weight: 700; color: var(--admin-text-title, #1c2333);
    padding: 0 0 12px 12px;
    border-bottom: 1px solid var(--admin-border-light, #eef0f4);
    margin-bottom: 8px;
}
.al-tree #docToc { display: block; }
/* TOC 项（阿里云目录树式） */
.al-tree .toc-item {
    display: block; padding: 0 12px 0 14px;
    height: 36px; line-height: 36px; margin: 1px 0;
    font-size: 13px; color: var(--admin-text-body, #3d4757);
    text-decoration: none; border-left: 3px solid transparent;
    border-radius: 0 6px 6px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    transition: all .15s;
}
.al-tree .toc-item:hover { color: var(--ali-blue, #006aff); background: #f5f8ff; }
.al-tree .toc-item.on {
    color: var(--ali-blue, #006aff); font-weight: 600;
    border-left-color: var(--ali-blue, #006aff); background: #f0f6ff;
}
.al-tree-foot {
    padding: 12px 2px 4px; margin-top: 14px;
    border-top: 1px solid var(--admin-border-light, #eef0f4);
    font-size: 11px; color: var(--admin-text-muted, #8a93a6);
}

/* --- 中：正文（白底，文档排版） --- */
.al-content { min-width: 0; max-width: 940px; }
.al-state { padding: 70px 0; text-align: center; color: var(--admin-text-muted, #8a93a6); }
.al-state .layui-icon { font-size: 34px; display: block; margin-bottom: 12px; }
.al-state b { display: block; margin-top: 4px; font-size: 16px; color: var(--admin-text-title, #1c2333); }
.al-state p { margin: 8px 0 20px; font-size: 13px; }
.al-link-btn {
    display: inline-flex; align-items: center; height: 36px; padding: 0 22px;
    border-radius: 6px; background: var(--ali-blue, #006aff); color: #fff;
    font-size: 13px; font-weight: 600; text-decoration: none; transition: background .2s;
}
.al-link-btn:hover { background: #1a78ff; color: #fff; }

/* 正文排版（阿里云风：细边框表格、蓝链接、章节分隔） */
.al-article { font-size: 14px; line-height: 1.95; }
.al-article .api-sec { margin-bottom: 40px; scroll-margin-top: 86px; }
.al-article .api-sec:last-child { margin-bottom: 0; }
.al-article .api-sec > .md-h {
    font-size: 18px; font-weight: 700; color: var(--admin-text-title, #1c2333);
    padding: 0 0 10px 0; margin: 0 0 16px;
    border-bottom: 1px solid var(--admin-border-light, #eef0f4);
}
.al-article .api-sec:not(:first-child) { padding-top: 8px; }
.al-article .md-code { color: var(--ali-blue, #006aff); }
.al-article .md-table-wrap { border: 1px solid #e8ecf2; border-radius: 6px; overflow: hidden; }
.al-article table.md-table { box-shadow: none; border-radius: 0; }
.al-article .md-table th { background: #f7f9fc; border-bottom: 1px solid #e8ecf2; }
.al-article .md-table td { border-top: 1px solid #f0f3f8; }
.al-article a { color: var(--ali-blue, #006aff); }
.al-article .md-codebox { border-radius: 6px; margin: 14px 0; }

/* --- 右：购买卡（白底细边，粘性） --- */
.al-buycard {
    position: sticky; top: 74px;
    background: #fff; border: 1px solid var(--admin-border-light, #eef0f4);
    border-radius: 8px; padding: 20px;
}
.al-card-title {
    font-size: 14px; font-weight: 700; color: var(--admin-text-title, #1c2333);
    padding-bottom: 12px; margin-bottom: 6px;
    border-bottom: 1px solid var(--admin-border-light, #eef0f4);
}
.al-product-name {
    display: block; font-size: 17px; font-weight: 800; color: #101418;
    letter-spacing: -.01em; line-height: 1.4; word-break: break-all;
}
.al-kv { display: flex; align-items: center; justify-content: space-between; height: 36px; font-size: 12.5px; }
.al-kv span { color: var(--admin-text-muted, #8a93a6); }
.al-kv b { color: var(--admin-text-title, #1c2333); font-weight: 600; }
.al-card-price {
    margin-top: 10px; padding: 14px 16px; border-radius: 6px;
    background: #f7f9fc; color: var(--admin-text-title, #1c2333);
}
.al-card-price .cur { font-size: 13px; font-weight: 700; }
.al-card-price b { font-size: 26px; font-weight: 800; letter-spacing: -.02em; }
.al-card-price .cycle { font-size: 11px; color: var(--admin-text-muted, #8a93a6); margin-left: 4px; }
/* 购买按钮（形态参考腾讯云：全宽主行动按钮；配色沿用全站主色） */
.al-card-btn {
    display: flex; align-items: center; justify-content: center;
    height: 44px; margin-top: 14px; border-radius: 8px;
    background: var(--admin-primary, #1677ff);
    color: #fff; font-size: 15px; font-weight: 700; letter-spacing: .06em;
    text-decoration: none; transition: all .2s var(--ease);
    box-shadow: 0 4px 14px rgba(22, 119, 255, 0.28);
}
.al-card-btn:hover {
    background: #4090ff;
    color: #fff; box-shadow: 0 6px 20px rgba(22, 119, 255, 0.4);
    transform: translateY(-1px);
}
.al-card-btn:active { transform: translateY(0); box-shadow: 0 2px 8px rgba(22,119,255,.3); }
.al-card-btn.disabled {
    background: var(--admin-bg, #f5f6f8); color: var(--admin-text-muted, #8a93a6);
    pointer-events: none; box-shadow: none;
}
.al-card-tip { margin-top: 12px; font-size: 11.5px; color: var(--admin-text-muted, #8a93a6); line-height: 1.7; text-align: center; }

/* 右卡：用户信息板块 */
.al-user {
    margin-top: 18px; padding: 14px;
    border: 1px solid var(--admin-border-light, #eef0f4); border-radius: 8px;
    background: #fbfcfd;
}
.al-user-head { display: flex; align-items: center; gap: 10px; }
.al-user-head .avatar { width: 34px; height: 34px; border-radius: 50%; font-size: 13px; }
.al-user-head .avatar.ghost { background: var(--admin-bg, #f5f6f8); color: var(--admin-text-muted, #8a93a6); }
.al-user-info { min-width: 0; }
.al-user-info b { display: block; font-size: 13px; color: var(--admin-text-title, #1c2333); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.al-user-info span { font-size: 11px; color: var(--admin-text-muted, #8a93a6); }
.al-user-link {
    display: flex; align-items: center; justify-content: center; gap: 6px;
    height: 32px; margin-top: 12px; border-radius: 6px;
    border: 1px solid var(--admin-border-light, #eef0f4); background: #fff;
    font-size: 12px; color: var(--admin-text-title, #1c2333); text-decoration: none; transition: all .2s;
}
.al-user-link:hover { border-color: var(--ali-blue, #006aff); color: var(--ali-blue, #006aff); }
.al-user-link .layui-icon { font-size: 12px; }
.al-user-btns { display: flex; gap: 8px; margin-top: 12px; }
.al-user-btn {
    flex: 1; display: flex; align-items: center; justify-content: center;
    height: 32px; border-radius: 6px; font-size: 12px; text-decoration: none;
    border: 1px solid var(--admin-border-light, #eef0f4); background: #fff; color: var(--admin-text-title, #1c2333);
    transition: all .2s;
}
.al-user-btn:hover { border-color: var(--ali-blue, #006aff); color: var(--ali-blue, #006aff); }
.al-user-btn.primary { background: var(--ali-blue, #006aff); border-color: var(--ali-blue, #006aff); color: #fff; }
.al-user-btn.primary:hover { background: #1a78ff; color: #fff; }

/* 右卡：推荐产品 */
.al-rec { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--admin-border-light, #eef0f4); }
.al-rec-title {
    font-size: 11px; font-weight: 700; letter-spacing: .14em;
    color: var(--admin-text-muted, #8a93a6); margin-bottom: 8px;
}
.al-rec-item {
    display: flex; align-items: center; gap: 10px;
    padding: 9px 10px; margin: 2px -10px; border-radius: 8px;
    text-decoration: none; transition: background .15s;
}
.al-rec-item:hover { background: #f5f8ff; }
.al-rec-name {
    flex: 1; min-width: 0; font-size: 12.5px; font-weight: 500; color: var(--admin-text-title, #1c2333);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.al-rec-item:hover .al-rec-name { color: var(--ali-blue, #006aff); }
.al-rec-price { flex: none; font-size: 12px; font-weight: 700; color: var(--admin-text-title, #1c2333); font-family: "JetBrains Mono", Consolas, monospace; }
.al-rec-empty { padding: 10px 0; font-size: 12px; color: var(--admin-text-muted, #8a93a6); text-align: center; }

/* --- 响应式 --- */
@media (max-width: 1200px) {
    .al-shell { grid-template-columns: 200px minmax(0, 1fr); }
    .al-buycard { display: none; }
}
@media (max-width: 860px) {
    .al-shell { grid-template-columns: 1fr; padding: 18px 14px 40px; }
    .al-tree { display: none; }
}
@media (max-width: 860px) {
    .al-shell { grid-template-columns: 1fr; padding: 18px 14px 40px; }
    .al-tree { display: none; }
}