@import url("https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&display=swap");
/* ============================================================
   LIVE CHAT — CLAYMORPHISM THEME (shared override layer)
   与主站 trading 项目的 clay-theme.css 同一套设计变量。
   在每个页面最后加载，覆盖内联的深色/霓虹样式与厂商 dark_mode 变量。
   规则：软黏土体块、超大圆角、双向柔光阴影、无硬边框、按压反馈。
   ============================================================ */

:root {
    /* 底色 */
    --c-bg:        #e9ecf7;
    --c-bg-2:      #eff1fa;
    --c-surface:   #f4f6fd;
    --c-surface-2: #eaedf8;
    --c-sunken:    #e4e7f4;

    /* 文字 */
    --c-ink:       #2e3252;
    --c-muted:     #6a7099;
    --c-faint:     #9198bd;

    /* 强调色 */
    --c-violet:    #7c67f5;
    --c-violet-d:  #5f47e6;
    --c-mint:      #2fc4a0;
    --c-mint-d:    #17a585;
    --c-coral:     #ff7a85;
    --c-coral-d:   #ec4a5c;
    --c-amber:     #ffc24b;
    --c-sky:       #63b3ff;
    --c-pink:      #ff8fc6;

    /* 圆角 */
    --c-r-xl: 34px;
    --c-r-lg: 26px;
    --c-r-md: 18px;
    --c-r-sm: 13px;

    /* 黏土阴影：外凸 */
    --c-clay:
        9px 9px 22px rgba(158,164,205,.48),
        -9px -9px 22px rgba(255,255,255,.92),
        inset 2px 2px 4px rgba(255,255,255,.75),
        inset -4px -4px 9px rgba(158,164,205,.24);
    --c-clay-sm:
        5px 5px 13px rgba(158,164,205,.42),
        -5px -5px 13px rgba(255,255,255,.9),
        inset 1px 1px 3px rgba(255,255,255,.7),
        inset -2px -2px 6px rgba(158,164,205,.2);
    --c-clay-lg:
        16px 16px 34px rgba(150,157,200,.5),
        -14px -14px 32px rgba(255,255,255,.95),
        inset 3px 3px 6px rgba(255,255,255,.8),
        inset -6px -6px 14px rgba(158,164,205,.26);

    /* 黏土阴影：内凹 */
    --c-clay-in:
        inset 5px 5px 11px rgba(158,164,205,.5),
        inset -5px -5px 11px rgba(255,255,255,.92);
    --c-clay-in-sm:
        inset 3px 3px 7px rgba(158,164,205,.45),
        inset -3px -3px 7px rgba(255,255,255,.9);

    /* 彩色黏土块的内部高光 */
    --c-lift:
        inset 2px 2px 5px rgba(255,255,255,.55),
        inset -4px -4px 9px rgba(0,0,0,.13);

    --c-font:    "Nunito", "Quicksand", "Inter", "Helvetica Neue", Arial, system-ui, sans-serif;
    --c-display: "Nunito", "Quicksand", "Inter", "Helvetica Neue", Arial, system-ui, sans-serif;
    --c-ease: cubic-bezier(.34, 1.4, .5, 1);

    /* ── 覆盖 chat.html / guest-entry.html 内联的赛博变量 ── */
    --bg-deep:      #e9ecf7;
    --sidebar-bg:   #eef1fa;
    --glass-border: rgba(255,255,255,.75);
    --neon-blue:    #7c67f5;
    --neon-purple:  #a06bf0;
    --neon-green:   #2fc4a0;

    /* ── 覆盖 dark_mode_css_variables.css（entry.html 用） ── */
    --landing-page-primary-bg-color: #e9ecf7;
    --landing-page-secondary-bg-color: #eff1fa;
    --landing-page-tertiary-bg-color: #e4e7f4;
    --landing-page-quaternary-bg-color: #7c67f5;
    --landing-page-quinary-bg-color: #ffc24b;
    --landing-page-senary-bg-color: #e9ecf7;
    --landing-page-septenary-bg-color: #7c67f5;
    --landing-page-primary-text-color: #2e3252;
    --landing-page-secondary-text-color: #6a7099;
    --landing-page-tertiary-text-color: #6a7099;
    --landing-page-quaternary-text-color: #ffffff;
    --landing-page-quinary-text-color: #7c67f5;
    --landing-page-senary-text-color: #7c67f5;
    --landing-page-septenary-text-color: #9198bd;
    --landing-page-octonary-text-color: #9198bd;
    --landing-page-primary-border-color: transparent;
    --landing-page-secondary-border-color: transparent;

    --chat-page-primary-bg-color: #e9ecf7;
    --chat-page-secondary-bg-color: #7c67f5;
    --chat-page-tertiary-bg-color: #eaedf8;
    --chat-page-quaternary-bg-color: #f4f6fd;
    --chat-page-quinary-bg-color: #7c67f5;
    --chat-page-primary-border-color: transparent;
    --chat-page-primary-text-color: #7c67f5;
    --chat-page-secondary-text-color: #2e3252;
    --chat-page-tertiary-text-color: #6a7099;

    --side-navigation-primary-bg-color: #eef1fa;
    --side-navigation-secondary-bg-color: #e9ecf7;
    --side-navigation-tertiary-bg-color: #e9ecf7;
    --side-navigation-quaternary-bg-color: #eaedf8;
    --side-navigation-primary-text-color: #6a7099;
    --side-navigation-secondary-text-color: #7c67f5;
    --side-navigation-tertiary-text-color: #7c67f5;
    --side-navigation-quaternary-text-color: #2e3252;
    --side-navigation-primary-border-color: transparent;

    --left-side-content-primary-bg-color: #f4f6fd;
    --left-side-content-secondary-bg-color: #e9ecf7;
    --left-side-content-tertiary-bg-color: #eaedf8;
    --left-side-content-quaternary-bg-color: #7c67f5;
    --left-side-content-quinary-bg-color: #7c67f5;
    --left-side-content-senary-bg-color: #ffe1e4;
    --left-side-content-septenary-bg-color: #ffc24b;
    --left-side-content-octonary-bg-color: #7c67f5;
    --left-side-content-nonary-bg-color: #7c67f5;
    --left-side-content-denary-bg-color: #7c67f5;
    --left-side-content-primary-text-color: #2e3252;
    --left-side-content-secondary-text-color: #ffffff;
    --left-side-content-tertiary-text-color: #7c67f5;
    --left-side-content-quaternary-text-color: #7c67f5;
    --left-side-content-quinary-text-color: #ec4a5c;
    --left-side-content-senary-text-color: #ffffff;
    --left-side-content-primary-border-color: transparent;
    --left-side-content-secondary-border-color: transparent;
    --left-side-content-tertiary-border-color: transparent;
    --left-side-content-quaternary-border-color: transparent;

    --audio-player-primary-bg-color: #eaedf8;
    --audio-player-secondary-bg-color: #f4f6fd;
    --audio-player-tertiary-bg-color: #7c67f5;
    --audio-player-quaternary-bg-color: #f4f6fd;
    --audio-player-quinary-bg-color: #e4e7f4;
    --audio-player-senary-bg-color: #7c67f5;
    --audio-player-primary-text-color: #2e3252;
    --audio-player-secondary-text-color: #6a7099;
    --audio-player-tertiary-text-color: #9198bd;
    --audio-player-quaternary-text-color: #2e3252;
    --audio-player-quinary-text-color: #6a7099;
    --audio-player-senary-text-color: #7c67f5;
    --audio-player-primary-border-color: transparent;

    --form-primary-bg-color: #f4f6fd;
    --form-secondary-bg-color: #e4e7f4;
    --form-tertiary-bg-color: #7c67f5;
    --form-quaternary-bg-color: #7c67f5;
    --form-quinary-bg-color: #e9ecf7;
    --form-senary-bg-color: #ffe1e4;
    --form-septenary-bg-color: #eaedf8;
    --form-octonary-bg-color: #7c67f5;
    --form-primary-text-color: #6a7099;
    --form-secondary-text-color: #2e3252;
    --form-tertiary-text-color: #7c67f5;
    --form-quaternary-text-color: #7c67f5;
    --form-quinary-text-color: #ec4a5c;
    --form-primary-border-color: transparent;
    --form-secondary-border-color: transparent;
    --form-tertiary-border-color: transparent;

    --info-panel-primary-bg-color: #eef1fa;
    --info-panel-secondary-bg-color: #e9ecf7;
    --info-panel-tertiary-bg-color: #f4f6fd;
    --info-panel-quaternary-bg-color: #eaedf8;
    --info-panel-quinary-bg-color: #e9ecf7;
    --info-panel-senary-bg-color: #e9ecf7;
    --info-panel-primary-text-color: #2e3252;
    --info-panel-secondary-text-color: #2e3252;
    --info-panel-tertiary-text-color: #7c67f5;
    --info-panel-quaternary-text-color: #7c67f5;
    --info-panel-quinary-text-color: #6a7099;
    --info-panel-primary-border-color: transparent;
    --info-panel-secondary-border-color: transparent;
    --info-panel-tertiary-border-color: transparent;

    --welcome-screen-primary-bg-color: #f4f6fd;
    --welcome-screen-primary-text-color: #6a7099;
    --welcome-screen-secondary-text-color: #9198bd;
    --welcome-screen-primary-border-color: transparent;

    --custom-page-primary-bg-color: #f4f6fd;
    --custom-page-secondary-bg-color: #e9ecf7;
    --custom-page-primary-text-color: #6a7099;
    --custom-page-secondary-text-color: #7c67f5;
    --custom-page-tertiary-text-color: #a06bf0;
    --custom-page-primary-border-color: transparent;

    --statistics-primary-bg-color: #f4f6fd;
    --statistics-secondary-bg-color: #e9ecf7;
    --statistics-tertiary-bg-color: #eaedf8;
    --statistics-quaternary-bg-color: #e4e7f4;
    --statistics-quinary-bg-color: #7c67f5;
    --statistics-senary-bg-color: #eff1fa;
    --statistics-septenary-bg-color: #ffc24b;
    --statistics-primary-text-color: #2e3252;
    --statistics-secondary-text-color: #6a7099;
    --statistics-tertiary-text-color: #2e3252;
    --statistics-quaternary-text-color: #6a7099;
    --statistics-quinary-text-color: #7c67f5;
    --statistics-senary-text-color: #a06bf0;
    --statistics-septenary-text-color: #2e3252;
    --statistics-primary-border-color: transparent;

    --membership_info-primary-bg-color: #f4f6fd;
    --membership_info-secondary-bg-color: #e9ecf7;
    --membership_info-tertiary-bg-color: #eaedf8;
    --membership_info-quaternary-bg-color: #e4e7f4;
    --membership_info-quinary-bg-color: #7c67f5;
    --membership_info-senary-bg-color: #eff1fa;
    --membership_info-septenary-bg-color: #f4f6fd;
    --membership_info-octonary-bg-color: #ffc24b;
    --membership_info-nonary-bg-color: #e9ecf7;
    --membership_info-denary-bg-color: #eff1fa;
    --membership_info-primary-text-color: #2e3252;
    --membership_info-secondary-text-color: #6a7099;
    --membership_info-tertiary-text-color: #2e3252;
    --membership_info-quaternary-text-color: #6a7099;
    --membership_info-quinary-text-color: #7c67f5;
    --membership_info-senary-text-color: #a06bf0;
    --membership_info-septenary-text-color: #2e3252;
    --membership_info-octonary-text-color: #c98a00;
    --membership_info-nonary-text-color: #2e3252;
    --membership_info-denary-text-color: #2e3252;
    --membership_info-primary-border-color: transparent;

    --chat-window-primary-bg-color: #e9ecf7;
    --chat-window-secondary-bg-color: #f4f6fd;
    --chat-window-tertiary-bg-color: #eff1fa;
    --chat-window-quaternary-bg-color: #7c67f5;
    --chat-window-quinary-bg-color: #eaedf8;
    --chat-window-senary-bg-color: #f4f6fd;
    --chat-window-septenary-bg-color: #eaedf8;
    --chat-window-octonary-bg-color: #7c67f5;
    --chat-window-nonary-bg-color: #7c67f5;
    --chat-window-denary-bg-color: #e4e7f4;
    --chat-window-primary-text-color: #6a7099;
    --chat-window-secondary-text-color: #2e3252;
    --chat-window-tertiary-text-color: #ffffff;
    --chat-window-quaternary-text-color: #6a7099;
    --chat-window-quinary-text-color: #7c67f5;
    --chat-window-senary-text-color: #a06bf0;
    --chat-window-septenary-text-color: #9198bd;
    --chat-window-octonary-text-color: #9198bd;
    --chat-window-nonary-text-color: #ff8fc6;
    --chat-window-denary-text-color: #6a7099;
    --chat-window-undenary-text-color: #ffc24b;
    --chat-window-duodenary-text-color: #ffc24b;
    --chat-window-primary-border-color: transparent;
    --chat-window-secondary-border-color: transparent;
    --chat-window-tertiary-border-color: transparent;
    --chat-window-quaternary-border-color: transparent;
    --chat-window-quinary-border-color: #ff8fc6;
    --chat-window-senary-border-color: #ffc24b;
    --chat-window-septenary-border-color: transparent;

    --entry-page-primary-bg-color: #e9ecf7;
    --entry-page-secondary-bg-color: #f4f6fd;
    --entry-page-tertiary-bg-color: #7c67f5;
    --entry-page-quaternary-bg-color: #7c67f5;
    --entry-page-quinary-bg-color: #e4e7f4;
    --entry-page-senary-bg-color: #7c67f5;
    --entry-page-primary-text-color: #2e3252;
    --entry-page-secondary-text-color: #2e3252;
    --entry-page-tertiary-text-color: #6a7099;
    --entry-page-quaternary-text-color: #ffffff;
    --entry-page-quinary-text-color: #7c67f5;
    --entry-page-senary-text-color: #9198bd;
    --entry-page-primary-border-color: transparent;
    --entry-page-secondary-border-color: transparent;
    --entry-page-tertiary-border-color: transparent;
    --entry-page-quaternary-border-color: transparent;
}

/* ============================================================
   1. 全局底
   ============================================================ */
html, body {
    background: var(--c-bg) !important;
    background-image: none !important;
    color: var(--c-ink) !important;
    font-family: var(--c-font) !important;
}
body * { border-color: transparent; }
a { color: var(--c-violet); }
a:hover { color: var(--c-violet-d); }

::-webkit-scrollbar { width: 10px !important; height: 10px !important; }
::-webkit-scrollbar-track { background: var(--c-bg) !important; }
::-webkit-scrollbar-thumb {
    background: #cfd5ea !important;
    border-radius: 999px !important;
    border: 2px solid var(--c-bg) !important;
}
::-webkit-scrollbar-thumb:hover { background: var(--c-violet) !important; }

/* ============================================================
   2. chat.html — 侧栏 / 顶栏
   ============================================================ */
.sidebar-wrapper-fixed {
    background: var(--c-bg) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-right: none !important;
    box-shadow: 14px 0 34px -22px rgba(158,164,205,.95) !important;
}
.sidebar-brand {
    border-bottom: none !important;
    background: transparent !important;
}
.sidebar-brand img { filter: none !important; }
.menu-label {
    color: var(--c-faint) !important;
    font-weight: 800;
    font-family: var(--c-display) !important;
}
.nav-item-modern {
    color: var(--c-muted) !important;
    border: none !important;
    border-radius: var(--c-r-md) !important;
    background: transparent !important;
    font-weight: 700;
    transition: all .25s var(--c-ease);
}
.nav-item-modern i { color: var(--c-faint) !important; filter: none !important; }
.nav-item-modern:hover {
    background: var(--c-surface) !important;
    color: var(--c-ink) !important;
    box-shadow: var(--c-clay-sm) !important;
    transform: none !important;
}
.nav-item-modern.active {
    background: var(--c-surface) !important;
    color: var(--c-violet-d) !important;
    box-shadow: var(--c-clay-sm) !important;
    border: none !important;
}
.nav-item-modern.active::before {
    background: var(--c-violet) !important;
    box-shadow: none !important;
    border-radius: 999px !important;
    left: 6px; top: 12px; bottom: 12px; width: 4px;
}
.nav-item-modern.active i { color: var(--c-violet) !important; filter: none !important; }
.nav-item-modern.text-danger { color: var(--c-coral-d) !important; }
.nav-item-modern.text-danger i { color: var(--c-coral-d) !important; }
.nav-item-modern.text-danger:hover { background: #ffe6e9 !important; border: none !important; }

.topbar-fixed-wrapper {
    background: var(--c-bg) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: none !important;
    box-shadow: 0 12px 26px -22px rgba(158,164,205,.95) !important;
}
.topbar-fixed-wrapper .las { color: var(--c-violet) !important; text-shadow: none !important; }
.topbar-fixed-wrapper .text-white,
.sidebar-menu__close.text-white { color: var(--c-ink) !important; }

.btn-outline-primary {
    color: var(--c-violet-d) !important;
    background: var(--c-surface) !important;
    border: none !important;
    border-radius: var(--c-r-sm) !important;
    box-shadow: var(--c-clay-sm) !important;
    font-weight: 800;
}
.btn-outline-primary:hover {
    background: var(--c-violet) !important;
    color: #fff !important;
    box-shadow: var(--c-lift) !important;
}
.dropdown-menu {
    background: var(--c-surface) !important;
    border: none !important;
    border-radius: var(--c-r-md) !important;
    box-shadow: var(--c-clay) !important;
}
.dropdown-item { color: var(--c-ink) !important; border-radius: var(--c-r-sm); font-weight: 700; }
.dropdown-item:hover { background: var(--c-sunken) !important; color: var(--c-violet-d) !important; }

/* ============================================================
   3. chat.html — 聊天壳 / 消息
   ============================================================ */
.chat-shell {
    background: var(--c-surface) !important;
    backdrop-filter: none !important;
    border: none !important;
    border-radius: var(--c-r-xl) !important;
    box-shadow: var(--c-clay-lg) !important;
}
.chat-agent-head {
    background: transparent !important;
    border-bottom: none !important;
    box-shadow: 0 14px 22px -22px rgba(158,164,205,.9) !important;
    padding: 16px 22px !important;
}
.agent-avatar {
    background: var(--c-violet) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: var(--c-clay-sm) !important;
}
/* 顶栏首字母头像：hover 变紫底白字 */
.dropdown a:hover > div {
    background: var(--c-violet) !important;
    box-shadow: var(--c-clay-sm), var(--c-lift) !important;
}
.dropdown a:hover #header-avatar-letter { color: #fff !important; }
#header-avatar-letter {
    color: var(--c-ink) !important;
    font-weight: 800 !important;
    font-family: var(--c-display) !important;
    font-size: 15px;
}
.agent-name { color: var(--c-ink) !important; font-weight: 800; }
.agent-status { color: var(--c-mint-d) !important; font-weight: 700; }
.agent-status::before { background: var(--c-mint) !important; box-shadow: none !important; }
.lang-btn {
    background: var(--c-surface) !important;
    border: none !important;
    color: var(--c-muted) !important;
    border-radius: 999px !important;
    box-shadow: var(--c-clay-sm) !important;
    font-weight: 700;
}
.lang-btn:hover { color: var(--c-violet-d) !important; box-shadow: var(--c-clay-in-sm) !important; }

.chat-messages::-webkit-scrollbar-thumb { background: #cfd5ea !important; }

.msg-avatar {
    background: var(--c-surface) !important;
    border: none !important;
    color: var(--c-muted) !important;
    box-shadow: var(--c-clay-sm) !important;
    font-weight: 800;
}
.msg-row.mine .msg-avatar {
    background: var(--c-violet) !important;
    color: #fff !important;
    box-shadow: var(--c-clay-sm) !important;
}
.msg-bubble {
    border-radius: var(--c-r-lg) !important;
    padding: 12px 16px !important;
    font-weight: 600;
}
.msg-row:not(.mine) .msg-bubble {
    background: var(--c-surface) !important;
    border: none !important;
    color: var(--c-ink) !important;
    box-shadow: var(--c-clay-sm) !important;
    border-bottom-left-radius: 8px !important;
}
.msg-row.mine .msg-bubble {
    background: var(--c-violet) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: var(--c-clay-sm), var(--c-lift) !important;
    border-bottom-right-radius: 8px !important;
}
.msg-time { color: var(--c-faint) !important; font-weight: 700; }
.empty-chat { color: var(--c-faint) !important; }
.empty-chat i { color: #cfd5ea !important; }

.msg-image, .msg-video, .quoted-thumb {
    border: none !important;
    border-radius: var(--c-r-sm) !important;
    box-shadow: var(--c-clay-sm) !important;
}
.msg-file-attach {
    background: var(--c-sunken) !important;
    border: none !important;
    border-radius: var(--c-r-sm) !important;
    box-shadow: var(--c-clay-in-sm) !important;
}
.msg-file-attach i { color: var(--c-violet) !important; }
.msg-file-attach span { color: var(--c-ink) !important; }
.msg-row.mine .msg-file-attach span,
.msg-row.mine .msg-file-attach i { color: var(--c-ink) !important; }

.msg-action-btn {
    background: var(--c-surface) !important;
    border: none !important;
    border-radius: 999px !important;
    color: var(--c-violet-d) !important;
    box-shadow: var(--c-clay-sm) !important;
    padding: 2px 9px !important;
    font-weight: 800;
}
.msg-action-btn:hover { box-shadow: var(--c-clay-in-sm) !important; }

.quoted-msg {
    border-left: 3px solid var(--c-violet) !important;
    background: var(--c-sunken) !important;
    border-radius: var(--c-r-sm) !important;
}
.quoted-msg:hover { background: #dfe3f2 !important; }
.msg-row.mine .quoted-msg {
    background: rgba(255,255,255,.22) !important;
    border-left-color: rgba(255,255,255,.75) !important;
}
.quoted-sender { color: var(--c-violet-d) !important; }
.msg-row.mine .quoted-sender { color: #fff !important; }
.quoted-body, .quoted-body span, .quoted-body i { color: var(--c-muted) !important; }
.msg-row.mine .quoted-body,
.msg-row.mine .quoted-body span,
.msg-row.mine .quoted-body i { color: rgba(255,255,255,.85) !important; }

/* ============================================================
   4. chat.html — 输入区 / 附件
   ============================================================ */
.chat-input-bar {
    background: transparent !important;
    border-top: none !important;
    box-shadow: 0 -14px 22px -22px rgba(158,164,205,.9) !important;
    padding: 16px 18px !important;
}
.chat-input {
    background: var(--c-sunken) !important;
    border: none !important;
    border-radius: var(--c-r-md) !important;
    color: var(--c-ink) !important;
    box-shadow: var(--c-clay-in-sm) !important;
    font-weight: 600;
    padding: 12px 16px !important;
}
.chat-input:focus { box-shadow: var(--c-clay-in) !important; }
.chat-input::placeholder { color: var(--c-faint) !important; }
.send-btn {
    background: var(--c-violet) !important;
    border: none !important;
    border-radius: var(--c-r-md) !important;
    color: #fff !important;
    box-shadow: var(--c-clay-sm), var(--c-lift) !important;
    transition: all .2s var(--c-ease);
}
.send-btn:hover { transform: translateY(-2px) !important; box-shadow: var(--c-clay), var(--c-lift) !important; }
.send-btn:active { transform: translateY(1px) !important; box-shadow: var(--c-clay-in-sm) !important; }
.send-btn:disabled { opacity: .45 !important; box-shadow: var(--c-clay-in-sm) !important; }

.btn-attach {
    background: var(--c-surface) !important;
    border: none !important;
    border-radius: var(--c-r-md) !important;
    color: var(--c-muted) !important;
    box-shadow: var(--c-clay-sm) !important;
}
.btn-attach:hover { color: var(--c-violet) !important; box-shadow: var(--c-clay-in-sm) !important; }
.attach-menu {
    background: var(--c-surface) !important;
    border: none !important;
    border-radius: var(--c-r-md) !important;
    box-shadow: var(--c-clay) !important;
    padding: 8px !important;
}
.attach-item { color: var(--c-ink) !important; border-radius: var(--c-r-sm) !important; font-weight: 700; }
.attach-item:hover { background: var(--c-sunken) !important; color: var(--c-violet-d) !important; }
.attach-item i { color: var(--c-violet) !important; }

.image-preview-wrapper {
    background: transparent !important;
    border-top: none !important;
}
.image-preview-box img {
    border: none !important;
    border-radius: var(--c-r-sm) !important;
    box-shadow: var(--c-clay-sm) !important;
}
.image-preview-box .remove-btn,
.file-preview-item .remove-btn {
    background: var(--c-coral) !important;
    box-shadow: var(--c-clay-sm) !important;
}
.file-preview-row {
    background: var(--c-sunken) !important;
    border: none !important;
    border-radius: var(--c-r-sm) !important;
    box-shadow: var(--c-clay-in-sm) !important;
}
.file-preview-row i { color: var(--c-violet) !important; }
.file-preview-row .fp-name { color: var(--c-ink) !important; }
.file-preview-row .fp-size { color: var(--c-faint) !important; }

.reply-mode-bar {
    background: var(--c-sunken) !important;
    border-top: none !important;
    border-radius: var(--c-r-md) !important;
    margin: 0 18px !important;
    box-shadow: var(--c-clay-in-sm) !important;
}
.reply-mode-bar .rbar-icon,
.reply-mode-bar .rbar-label { color: var(--c-violet-d) !important; }
.reply-mode-bar .rbar-preview { color: var(--c-muted) !important; }
.reply-mode-bar .rbar-close { color: var(--c-faint) !important; }
.reply-mode-bar .rbar-close:hover { color: var(--c-coral-d) !important; }

.drag-overlay {
    background: rgba(233,236,247,.85) !important;
    border: 2px dashed var(--c-violet) !important;
    border-radius: var(--c-r-xl) !important;
    color: var(--c-violet-d) !important;
}
.drag-overlay i { filter: none !important; }

/* ============================================================
   5. chat.html — 访客弹窗 / 语言弹窗 / 移动底栏
   ============================================================ */
.guest-overlay { background: rgba(233,236,247,.9) !important; backdrop-filter: blur(6px) !important; }
.guest-card, .lang-modal {
    background: var(--c-surface) !important;
    border: none !important;
    border-radius: var(--c-r-xl) !important;
    box-shadow: var(--c-clay-lg) !important;
}
.guest-icon {
    background: var(--c-violet) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: var(--c-clay-sm), var(--c-lift) !important;
}
.guest-card h3, .lang-modal h6 { color: var(--c-ink) !important; font-weight: 800; }
.guest-card p { color: var(--c-muted) !important; }
.guest-input {
    background: var(--c-sunken) !important;
    border: none !important;
    border-radius: var(--c-r-md) !important;
    color: var(--c-ink) !important;
    box-shadow: var(--c-clay-in-sm) !important;
    font-weight: 600;
}
.guest-input:focus { box-shadow: var(--c-clay-in) !important; }
.guest-input::placeholder { color: var(--c-faint) !important; }
.guest-err { color: var(--c-coral-d) !important; }
.guest-btn {
    background: var(--c-violet) !important;
    border: none !important;
    border-radius: var(--c-r-md) !important;
    color: #fff !important;
    box-shadow: var(--c-clay-sm), var(--c-lift) !important;
    font-weight: 800;
}
.guest-btn:hover { transform: translateY(-2px) !important; box-shadow: var(--c-clay), var(--c-lift) !important; }
.guest-btn:active { transform: translateY(1px) !important; box-shadow: var(--c-clay-in-sm) !important; }

.lang-backdrop { background: rgba(233,236,247,.85) !important; }
.lang-option {
    color: var(--c-muted) !important;
    border: none !important;
    border-radius: var(--c-r-sm) !important;
    font-weight: 700;
}
.lang-option:hover, .lang-option.active {
    background: var(--c-sunken) !important;
    color: var(--c-violet-d) !important;
    box-shadow: var(--c-clay-in-sm) !important;
}

.mobile-bottom-nav {
    background: var(--c-surface) !important;
    backdrop-filter: none !important;
    border: none !important;
    border-radius: 999px !important;
    box-shadow: var(--c-clay-lg) !important;
}
.mobile-bottom-nav a { color: var(--c-muted) !important; }
.mobile-bottom-nav a.active, .mobile-bottom-nav a:hover {
    color: var(--c-violet-d) !important;
    background: var(--c-sunken) !important;
    box-shadow: var(--c-clay-in-sm) !important;
}
.mobile-bottom-nav .mid-button {
    background: var(--c-violet) !important;
    color: #fff !important;
    border: none !important;
    box-shadow: var(--c-clay-sm), var(--c-lift) !important;
}

/* ============================================================
   6. guest-entry.html — 独立访客入口卡
   ============================================================ */
body .card {
    background: var(--c-surface) !important;
    backdrop-filter: none !important;
    border: none !important;
    border-radius: var(--c-r-xl) !important;
    box-shadow: var(--c-clay-lg) !important;
}
.logo-wrap img { filter: none !important; }
.icon-ring {
    background: var(--c-violet) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: var(--c-clay-sm), var(--c-lift) !important;
}
body h2 { color: var(--c-ink) !important; font-family: var(--c-display) !important; font-weight: 900; }
.subtitle { color: var(--c-muted) !important; }
body label { color: var(--c-muted) !important; }
body input[type="text"],
body input[type="password"],
body input[type="email"],
body textarea,
body select {
    background: var(--c-sunken) !important;
    border: none !important;
    border-radius: var(--c-r-md) !important;
    color: var(--c-ink) !important;
    box-shadow: var(--c-clay-in-sm) !important;
    font-weight: 600;
}
body input[type="text"]:focus,
body input[type="password"]:focus,
body input[type="email"]:focus,
body textarea:focus,
body select:focus { box-shadow: var(--c-clay-in) !important; }
body input::placeholder, body textarea::placeholder { color: var(--c-faint) !important; }
.err { color: var(--c-coral-d) !important; }
.btn-enter {
    background: var(--c-violet) !important;
    border: none !important;
    border-radius: var(--c-r-md) !important;
    color: #fff !important;
    box-shadow: var(--c-clay-sm), var(--c-lift) !important;
    font-weight: 800;
}
.btn-enter:hover { transform: translateY(-2px) !important; box-shadow: var(--c-clay), var(--c-lift) !important; }
.btn-enter:active { transform: translateY(1px) !important; box-shadow: var(--c-clay-in-sm) !important; }
.divider { color: var(--c-faint) !important; }
.divider::before, .divider::after { background: #d7dcef !important; }
.btn-login {
    background: var(--c-surface) !important;
    border: none !important;
    border-radius: var(--c-r-md) !important;
    color: var(--c-muted) !important;
    box-shadow: var(--c-clay-sm) !important;
    font-weight: 800;
}
.btn-login:hover { color: var(--c-violet-d) !important; box-shadow: var(--c-clay-in-sm) !important; }

/* ============================================================
   7. entry.html — 厂商登录页版面
   ============================================================ */
.entry_page .background,
.entry_page .background > .image,
.entry_page .background > .slideshow { filter: saturate(.45) brightness(1.25) opacity(.35); }
.entry_box {
    background: var(--c-bg) !important;
    box-shadow: 18px 0 40px -30px rgba(158,164,205,.95) !important;
}
.entry_box .heading > div > h3 {
    color: var(--c-ink) !important;
    font-family: var(--c-display) !important;
    font-weight: 900;
}
.entry_box .heading > div > span { color: var(--c-muted) !important; }
.entry_box .tabs > ul > li {
    color: var(--c-muted) !important;
    border: none !important;
    border-radius: var(--c-r-sm) !important;
    font-weight: 800;
}
.entry_box .tabs > ul > li.selected {
    background: var(--c-surface) !important;
    color: var(--c-violet-d) !important;
    box-shadow: var(--c-clay-sm) !important;
    border: none !important;
}
.entry_box .form_container > form > .field > label { color: var(--c-muted) !important; font-weight: 700; }
.entry_box .form_container > form > .field > input,
.entry_box .form_container > form > .field > select,
.entry_box .form_container > form > .field > textarea {
    background: var(--c-sunken) !important;
    border: none !important;
    border-radius: var(--c-r-md) !important;
    color: var(--c-ink) !important;
    box-shadow: var(--c-clay-in-sm) !important;
    font-weight: 600;
}
.entry_box .form_container > form > .field > input:focus,
.entry_box .form_container > form > .field > select:focus,
.entry_box .form_container > form > .field > textarea:focus { box-shadow: var(--c-clay-in) !important; }
.entry_box .form_container > form > .field.checkbox > label > .checkmark {
    background: var(--c-sunken) !important;
    border: none !important;
    border-radius: 7px !important;
    box-shadow: var(--c-clay-in-sm) !important;
}
.entry_box .form_container > form > .field.checkbox > label > input:checked ~ .checkmark {
    background: var(--c-violet) !important;
    box-shadow: var(--c-lift) !important;
}
.entry_box .form_container > .message {
    border: none !important;
    border-radius: var(--c-r-md) !important;
    box-shadow: var(--c-clay-in-sm) !important;
}
.entry_box .submit_form > span {
    background: var(--c-violet) !important;
    border: none !important;
    border-radius: var(--c-r-md) !important;
    color: #fff !important;
    box-shadow: var(--c-clay-sm), var(--c-lift) !important;
    font-weight: 800;
    transition: all .2s var(--c-ease);
}
.entry_box .submit_form > span:hover { transform: translateY(-2px); box-shadow: var(--c-clay), var(--c-lift) !important; }
.entry_box .submit_form > span:active { transform: translateY(1px); box-shadow: var(--c-clay-in-sm) !important; }
.entry_box .change_form span,
.entry_box .change_form a { color: var(--c-violet-d) !important; font-weight: 700; }
