/* Merdan chat – clean theme with good contrast */
:root {
    --mc-bg: #111827; /* dark panel */
    --mc-text: #e5e7eb; /* light text */
    --mc-accent: #2563eb; /* primary blue */
    --mc-bubble: #10b981; /* FAB green */
    --mc-border: #374151; /* borders */
    --mc-user: #1f2937; /* user bubble */
    --mc-bot: #0b1220; /* bot bubble */
}

@media (prefers-color-scheme:light) {
    :root {
        --mc-bg: #fff;
        --mc-text: #111827;
        --mc-accent: #2563eb;
        --mc-bubble: #10b981;
        --mc-border: #e5e7eb;
        --mc-user: #f3f4f6;
        --mc-bot: #fff;
    }
}

/* ---------- FAB（右下角按钮） ---------- */
#merdan-chat-bubble {
    position: fixed;
    right: 12px;
    bottom: calc(env(safe-area-inset-bottom,0px) + 12px);
    z-index: 2147483647;
    width: clamp(48px,12vw,60px);
    height: clamp(48px,12vw,60px);
    border-radius: 50%;
    border: 0;
    cursor: pointer;
    background: var(--mc-bubble);
    color: #fff;
    font-size: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 24px rgba(0,0,0,.25);
}

/* ---------- 主面板 ---------- */
#merdan-chat-panel {
    position: fixed;
    right: 12px;
    bottom: calc(env(safe-area-inset-bottom,0px) + 12px + clamp(56px,13vw,68px)); /* 给 FAB 腾出空间 */
    z-index: 2147483646;
    width: min(92vw,420px);
    max-height: min(72vh,640px);
    display: none; /* 打开时你的 JS 依然设置为 block（或 flex） */
    overflow: hidden;
    background: var(--mc-bg);
    color: var(--mc-text);
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0,0,0,.35);
    border: 1px solid var(--mc-border);
    font-family: system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Noto Sans","sans-serif";
}

/* 头部 */
#mc-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px;
    background: linear-gradient(135deg,#0ea5e9,var(--mc-accent));
    color: #fff;
}

#mc-title {
    font-weight: 700;
    font-size: 14px
}

#mc-actions .mc-btn {
    background: transparent;
    color: #fff;
    border: 1px solid rgba(255,255,255,.4);
    padding: 6px 8px;
    border-radius: 8px;
    cursor: pointer;
    margin-left: 6px
}

    #mc-actions .mc-btn:hover {
        background: rgba(255,255,255,.1)
    }

/* 消息区：用弹性高度，替代固定 280px */
#mc-messages {
    padding: 12px;
    height: clamp(220px,45vh,420px); /* 关键：随屏幕而变 */
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    display: flex;
    flex-direction: column;
    gap: 8px;
    background: var(--mc-bg);
}

/* 气泡 */
.mc-msg {
    max-width: 80%;
    padding: 10px 12px;
    border-radius: 12px;
    font-size: 14px;
    line-height: 1.35;
    border: 1px solid var(--mc-border)
}

    .mc-msg.user {
        align-self: flex-end;
        background: var(--mc-user);
        color: var(--mc-text)
    }

    .mc-msg.bot {
        align-self: flex-start;
        background: var(--mc-bot);
        color: var(--mc-text)
    }

/* 快捷按钮区 */
#mc-quick {
    display: none;
    padding: 0 12px 8px;
    gap: 8px;
    flex-wrap: wrap
}

    #mc-quick .mc-btn {
        border: 1px solid var(--mc-border);
        background: transparent;
        color: var(--mc-text);
        border-radius: 999px;
        padding: 6px 10px;
        cursor: pointer
    }

/* 输入区 */
#mc-input {
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 12px;
    border-top: 1px solid var(--mc-border);
    background: var(--mc-bg)
}

#mc-text {
    flex: 1;
    height: 42px;
    border-radius: 10px;
    border: 1px solid var(--mc-border);
    padding: 8px 10px;
    background: #0b1220;
    color: #e5e7eb
}

@media (prefers-color-scheme:light) {
    #mc-text {
        background: #fff;
        color: #111827
    }
}

#mc-send {
    border: 0;
    border-radius: 10px;
    padding: 10px 14px;
    background: var(--mc-accent);
    color: #fff;
    cursor: pointer
}

    #mc-send:disabled {
        opacity: .6;
        cursor: not-allowed
    }

/* ---------- 线索采集弹窗 ---------- */
#mc-lead-modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 2147483647;
    background: rgba(0,0,0,.45);
    backdrop-filter: blur(4px)
}

#mc-lead-card {
    width: min(520px,94vw);
    background: var(--mc-bg);
    color: var(--mc-text);
    border: 1px solid var(--mc-border);
    border-radius: 16px;
    box-shadow: 0 30px 80px rgba(0,0,0,.4);
    padding: 16px
}

    #mc-lead-card h3 {
        margin: 0 0 10px
    }

    #mc-lead-card input, #mc-lead-card textarea {
        width: 100%;
        border: 1px solid var(--mc-border);
        background: #0b1220;
        color: #e5e7eb;
        border-radius: 10px;
        padding: 8px 10px
    }

@media (prefers-color-scheme:light) {
    #mc-lead-card input, #mc-lead-card textarea {
        background: #fff;
        color: #111827
    }
}

#mc-lead-card .row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap
}

#mc-lead-card .mc-btn {
    border: 1px solid var(--mc-border);
    border-radius: 10px;
    padding: 8px 12px;
    background: transparent;
    color: var(--mc-text)
}

    #mc-lead-card .mc-btn.primary {
        background: var(--mc-accent);
        color: #fff;
        border: 0
    }

/* ---------- 额外的小屏细化 ---------- */
@media (max-width:480px) {
    #mc-title {
        font-size: 13px
    }

    #mc-messages {
        height: clamp(220px,50vh,420px)
    }
}