/* Customer assistant: opaque conversation surfaces inside a glass shell. */
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget {
    --chat-panel: #fff;
    --chat-tile: #f4f5f7;
    --chat-hover: #eceef1;
    --chat-user: #fff6c2;
    --chat-user-text: #171717;
}
html:is([data-theme-scope="customer"], [data-theme-scope="admin"])[data-color-mode="dark"] #chatbot-widget {
    --chat-panel: #090909;
    --chat-tile: #161616;
    --chat-hover: #232323;
    --chat-user: #26220d;
    --chat-user-text: #fff3af;
}
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-window {
    width: min(400px, calc(100vw - 32px));
    height: min(640px, calc(100dvh - 120px));
    background: var(--chat-panel);
    border: 1px solid var(--glass-edge);
    border-radius: 24px;
    box-shadow: 0 24px 80px rgba(0,0,0,.3), inset 0 1px 0 var(--site-edge-highlight);
}
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-header {
    flex-shrink: 0;
    min-height: 76px;
    background: linear-gradient(135deg, var(--glass-sheen), transparent), var(--chat-panel);
    border-bottom: 1px solid var(--site-border);
    padding: 14px 16px;
}
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-header h5 { color: var(--site-text); font-size: .95rem; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-header-icon { background: #ffd700; color: #171717; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-status { color: var(--site-muted); }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-icon-btn { color: var(--site-muted); width: 40px; height: 40px; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-icon-btn:hover { color: var(--site-text); background: var(--chat-hover); }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-messages {
    min-height: 0;
    padding: 20px 16px 12px;
    background: var(--chat-panel);
    scrollbar-color: var(--site-control-border) transparent;
    overscroll-behavior: contain;
    scroll-padding-bottom: 16px;
}
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #faq-welcome { padding: 0 0 18px; border-bottom: 1px solid var(--site-border); margin-bottom: 18px; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .faq-welcome-card { text-align: left; padding: 0; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .faq-welcome-icon { display: none; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .faq-welcome-title { color: var(--site-text); font-size: 1.25rem; margin-bottom: 6px; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .faq-welcome-sub { color: var(--site-muted); font-size: .85rem; line-height: 1.6; margin-bottom: 16px; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .faq-grid { gap: 8px; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .faq-btn {
    min-height: 48px;
    padding: 10px 12px;
    background: var(--chat-tile);
    border: 1px solid var(--site-border);
    box-shadow: none;
    transform: none;
    border-radius: 12px;
}
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .faq-btn span { color: var(--site-text); font-size: .78rem; line-height: 1.35; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .faq-btn-icon { color: var(--site-accent-text); font-size: .85rem; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .faq-btn:hover { background: var(--chat-hover); border-color: var(--site-control-border); transform: none; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .faq-btn:hover span, html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .faq-btn:hover .faq-btn-icon { color: var(--site-text); }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-bubble { font-size: .875rem; line-height: 1.6; padding: 12px 14px; max-width: 92%; overflow-wrap: anywhere; text-align: left; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-bubble.bot { background: var(--chat-tile); border-color: var(--site-border); color: var(--site-text); }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-bubble.user { background: var(--chat-user); color: var(--chat-user-text); border: 1px solid rgba(190,157,0,.22); }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-bubble.error { background: var(--chat-tile); border-color: var(--site-danger); color: var(--site-danger); }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-bubble.bot a { color: var(--site-accent-text); text-decoration: underline; text-underline-offset: 3px; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-suggestion { background: var(--chat-tile); border-color: var(--site-border); color: var(--site-text); min-height: 40px; font-size: .78rem; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-suggestion:hover { background: var(--chat-hover); border-color: var(--site-control-border); }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-input-area { flex-shrink: 0; background: var(--chat-panel); padding: 12px 12px 10px; align-items: center; border-color: var(--site-border); }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-input { height: 46px; border: 1px solid var(--site-control-border); border-radius: 14px; background: var(--chat-tile); color: var(--site-text); padding: 10px 12px; font-size: .85rem; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-input::placeholder { color: var(--site-muted); opacity: 1; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-send { width: 44px; height: 44px; flex: 0 0 44px; background: #ffd700; color: #171717; border-radius: 14px; transform: none; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-send:hover:not(:disabled) { background: #e5c100; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-attribution { flex-shrink: 0; background: var(--chat-panel); color: var(--site-muted); padding: 0 16px 12px; font-size: .65rem; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-attribution a { color: var(--site-muted); }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget :is(button, a, input):focus-visible { outline: 2px solid var(--site-accent-text); outline-offset: 3px; }
@supports ((backdrop-filter: blur(16px)) or (-webkit-backdrop-filter: blur(16px))) {
    html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-window { background: var(--glass-fill); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
}
@media (max-width: 575.98px) {
    html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-window { width: auto; height: min(72dvh, 600px); max-height: calc(100dvh - 100px); bottom: 78px; border-radius: 20px; }
    html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-input { font-size: 16px; }
    html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget .chat-header { min-height: 72px; padding: 12px; }
}
@media (prefers-reduced-transparency: reduce), (forced-colors: active) {
    html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-window { backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--chat-panel); }
}

/* Launcher matches the assistant shell without an implied live-agent status. */
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-window {
    position: fixed;
    right: 24px;
    bottom: var(--chat-panel-bottom, 94px);
    height: min(640px, var(--chat-available-height, calc(100dvh - 190px)));
    max-height: var(--chat-available-height, calc(100dvh - 190px));
    min-height: 0;
}
@media (max-width: 1199.98px) {
    html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-input { font-size: 16px; }
}
@media (max-width: 575.98px) {
    html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-window {
        left: 12px;
        right: 12px;
        bottom: var(--chat-panel-bottom, 78px);
        height: min(600px, 72dvh, var(--chat-available-height, calc(100dvh - 162px)));
    }
}
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-toggle {
    width: 56px;
    height: 56px;
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(255,255,255,.08), transparent 65%), #111;
    border: 1px solid rgba(255,255,255,.2);
    color: #ffd700;
    font-size: 23px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 8px 24px rgba(0,0,0,.22);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-toggle::after { display: none; }
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-toggle:hover {
    transform: translateY(-2px);
    border-color: rgba(255,215,0,.6);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 10px 28px rgba(0,0,0,.28);
}
html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-toggle[aria-expanded="true"] {
    background: #ffd700;
    border-color: #ffd700;
    color: #171717;
}
@media (prefers-reduced-motion: reduce) {
    html:is([data-theme-scope="customer"], [data-theme-scope="admin"]) #chatbot-widget #chatbot-toggle { transition: none; transform: none; }
}