#wmd-chat-toggle{position:fixed;right:20px;bottom:20px;z-index:9999;border:0;border-radius:30px;padding:14px 20px;background:#2563eb;color:white;font:600 15px Arial,sans-serif;cursor:pointer;box-shadow:0 4px 18px #0003}
#wmd-chat-panel{position:fixed;right:20px;bottom:78px;width:min(380px,calc(100vw - 32px));height:min(520px,calc(100vh - 110px));background:white;border:1px solid #ddd;z-index:9999;border-radius:14px;box-shadow:0 8px 36px #0003;display:flex;flex-direction:column;overflow:hidden;font:14px Arial,sans-serif;color:#111}
#wmd-chat-panel[hidden]{display:none}
#wmd-chat-heading{padding:14px 16px;background:#2563eb;color:white;font-weight:bold}
#wmd-chat-messages{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.wmd-msg{padding:10px 12px;border-radius:10px;max-width:91%;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.45}
.wmd-user{align-self:end;background:#dbeafe}
.wmd-assistant{align-self:start;background:#f3f4f6}
.wmd-sources{display:flex;flex-direction:column;gap:4px;margin-top:6px;font-size:12px}
.wmd-sources a{color:#1d4ed8;text-decoration:underline;overflow-wrap:anywhere}
#wmd-chat-form{display:flex;gap:8px;padding:10px;border-top:1px solid #ddd}
#wmd-chat-input{flex:1;min-width:0;border:1px solid #ccc;border-radius:8px;padding:10px;font:14px Arial,sans-serif}
#wmd-chat-send{border:0;border-radius:8px;background:#2563eb;color:#fff;padding:10px 14px;cursor:pointer}
#wmd-chat-send:disabled{opacity:.5;cursor:not-allowed}
#wmd-chat-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 22px;
    min-height: 52px;

    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;

    background: linear-gradient(
        135deg,
        #3478f6 0%,
        #2354d8 100%
    );

    box-shadow:
        0 8px 22px rgba(31, 85, 208, 0.24),
        0 2px 6px rgba(14, 48, 139, 0.10);

    color: #fff;
    font-family: inherit;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}

/* White chat icon before the text */
#wmd-chat-toggle::before {
    content: "";
    display: block;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;

    background: center / contain no-repeat url(
        "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M20.5 11.5a8.5 8.5 0 0 1-8.5 8.5c-1.4 0-2.8-.35-4-1L3 21l2-5a8.5 8.5 0 1 1 15.5-4.5Z' stroke='white' stroke-width='2' stroke-linejoin='round'/%3E%3Ccircle cx='8.5' cy='11.5' r='1' fill='white'/%3E%3Ccircle cx='12' cy='11.5' r='1' fill='white'/%3E%3Ccircle cx='15.5' cy='11.5' r='1' fill='white'/%3E%3C/svg%3E"
    );
}

/* Hover effect */
#wmd-chat-toggle:hover {
    background: linear-gradient(
        135deg,
        #286beb,
        #1b47c4
    );

    box-shadow: 0 12px 28px rgba(31, 85, 208, 0.32);
    transform: translateY(-2px);
}

/* Click effect */
#wmd-chat-toggle:active {
    transform: translateY(0);
}

/* Keyboard accessibility */
#wmd-chat-toggle:focus-visible {
    outline: 3px solid #93c5fd;
    outline-offset: 3px;
}

/* Mobile */
@media (max-width: 480px) {
    #wmd-chat-toggle {
        min-height: 48px;
        padding: 12px 17px;
        gap: 8px;
        font-size: 14px;
    }

    #wmd-chat-toggle::before {
        width: 20px;
        height: 20px;
        flex-basis: 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    #wmd-chat-toggle {
        transition: none;
    }
}