/* Import Roboto font */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');

/* Multiple selectors to ensure positioning */
#zed-realtor-chat,
.zed-realtor-widget,
div[id="zed-realtor-chat"] { 
    position: fixed !important; 
    bottom: 13px !important; 
    left: 8px !important; 
    right: auto !important; 
    top: auto !important; 
    z-index: 99999999 !important; 
    font-family: 'Roboto', Arial, sans-serif; 
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    float: none !important;
    clear: none !important;
    width: auto !important;
    height: auto !important;
    box-sizing: border-box !important;
}
#zed-chat-button { 
    width:60px; 
    height:60px; 
    border-radius:50%; 
    background:#e02121; 
    display:flex; 
    align-items:center; 
    justify-content:center; 
    box-shadow:0 2px 6px rgba(0,0,0,0.3); 
    cursor:pointer; 
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    animation: pulse-glow 2s ease-in-out infinite;
}

/* Radiating animation for closed button */
@keyframes pulse-glow {
    0% {
        box-shadow: 0 2px 6px rgba(0,0,0,0.3), 0 0 0 0 rgba(224, 33, 33, 0.7);
    }
    50% {
        box-shadow: 0 2px 6px rgba(0,0,0,0.3), 0 0 0 10px rgba(224, 33, 33, 0.3);
    }
    100% {
        box-shadow: 0 2px 6px rgba(0,0,0,0.3), 0 0 0 0 rgba(224, 33, 33, 0.7);
    }
}

/* Stop animation when panel is open */
#zed-chat-panel.open ~ #zed-chat-button,
#zed-chat-panel:not(.closed) ~ #zed-chat-button,
#zed-chat-panel.open + #zed-chat-button {
    animation: none !important;
}
#zed-chat-button:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}
#zed-chat-button img { width:44px; height:44px; border-radius:50%; object-fit:cover; }
#zed-chat-panel { 
    width:320px; 
    max-width:90vw; 
    box-shadow:0 10px 30px rgba(0,0,0,0.25); 
    border-radius:12px; 
    overflow:hidden; 
    transform-origin:bottom left; 
    transition:all .28s ease; 
    margin-bottom:10px; 
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(10px) scale(.96) !important;
}
#zed-chat-panel.closed { 
    opacity:0 !important; 
    visibility:hidden !important; 
    transform:translateY(10px) scale(.96) !important; 
}
#zed-chat-panel.open { 
    opacity:1 !important; 
    visibility:visible !important; 
    transform:translateY(0) scale(1) !important; 
}
#zed-chat-header { display:flex; align-items:center; gap:10px; padding:10px; background:#b60f0f; color:#fff; }
#zed-chat-header img { width:36px; height:36px; border-radius:6px; object-fit:cover; }
#zed-chat-log { background:#fff; max-height:300px; overflow:auto; padding:12px; }
.zed-msg { margin-bottom:8px; display:flex; }
.zed-msg.user { justify-content:flex-end; }
.zed-msg .zed-msg-text { display:inline-block; padding:8px 10px; border-radius:8px; max-width:80%; }
.zed-msg.user .zed-msg-text { background:#e6e6e6; }
.zed-msg.bot .zed-msg-text { background:#fff3f3; border:1px solid #f1caca; }
#zed-chat-input { display:flex; gap:8px; padding:10px; background:#fff; border-top:1px solid #eee; }
#zed-chat-input input { flex:1; padding:8px; border-radius:6px; border:1px solid #ddd; }
#zed-chat-input button { background:#e02121; color:#fff; border:none; padding:8px 12px; border-radius:6px; cursor:pointer; }
.bot-greeting { color:#333; margin-bottom:8px; }

/* Ultra-aggressive mobile button visibility */
@media (max-width: 768px) {
    /* Force button to be visible on mobile */
    #zed-chat-button {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: fixed !important;
        bottom: 13px !important;
        left: 8px !important;
        z-index: 99999999 !important;
        width: 50px !important;
        height: 50px !important;
        background: #e02121 !important;
        border-radius: 50% !important;
        box-shadow: 0 2px 6px rgba(0,0,0,0.3) !important;
        animation: pulse-glow-mobile 2s ease-in-out infinite !important;
    }
}

/* Mobile-specific positioning */
@media (max-width: 768px) {
    #zed-realtor-chat,
    .zed-realtor-widget,
    div[id="zed-realtor-chat"] {
        position: fixed !important;
        bottom: 13px !important;
        left: 8px !important;
        right: auto !important;
        top: auto !important;
        z-index: 99999999 !important;
        display: flex !important;
        align-items: flex-end !important;
        justify-content: flex-start !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        height: auto !important;
        box-sizing: border-box !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    #zed-chat-button {
        width: 50px !important;
        height: 50px !important;
        margin: 0 !important;
        padding: 0 !important;
        visibility: visible !important;
        opacity: 1 !important;
        display: flex !important;
        position: fixed !important;
        bottom: 13px !important;
        left: 8px !important;
        z-index: 99999999 !important;
        animation: pulse-glow-mobile 2s ease-in-out infinite !important;
    }
    
    /* Mobile-specific animation */
    @keyframes pulse-glow-mobile {
        0% {
            box-shadow: 0 2px 6px rgba(0,0,0,0.3), 0 0 0 0 rgba(224, 33, 33, 0.8);
        }
        50% {
            box-shadow: 0 2px 6px rgba(0,0,0,0.3), 0 0 0 8px rgba(224, 33, 33, 0.4);
        }
        100% {
            box-shadow: 0 2px 6px rgba(0,0,0,0.3), 0 0 0 0 rgba(224, 33, 33, 0.8);
        }
    }
    #zed-chat-panel { 
        width: calc(100vw - 16px) !important; 
        left: 8px !important; 
        right: 8px !important;
        bottom: 70px !important;
        top: auto !important;
        position: fixed !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}
