/* EmlakBot Widget Styles */
#eb-chat-wrapper { position:fixed; bottom: 24px; right: 24px; z-index:999999; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; }
#eb-toggle-btn { display: none !important; }
#eb-chat-window { 
    display:none; position:absolute; bottom: 80px; right: 0;
    width:380px; height:580px; background:#fff; border-radius:16px; 
    box-shadow:0 8px 40px rgba(0,0,0,0.18); flex-direction:column; 
    overflow:hidden; border:none;
}

/* WhatsApp Header */
#eb-chat-header { 
    padding:12px 16px; 
    background: linear-gradient(135deg, #075E54 0%, #128C7E 100%);
    color:#fff; display:flex; justify-content:space-between; align-items:center; 
    flex-shrink:0; min-height:56px;
}
.eb-header-left { display:flex; align-items:center; gap:12px; }
.eb-header-avatar { width:40px; height:40px; border-radius:50%; background:#25D366; display:flex; align-items:center; justify-content:center; font-size:18px; flex-shrink:0; border:2px solid rgba(255,255,255,0.3); }
.eb-header-avatar img { width:100%; height:100%; border-radius:50%; object-fit:cover; }
.eb-header-info .eb-h-name { font-weight:600; font-size:15px; line-height:1.2; }
.eb-header-info .eb-h-status { font-size:11px; opacity:0.85; display:flex; align-items:center; gap:4px; }
.eb-header-info .eb-h-status::before { content:''; width:7px; height:7px; border-radius:50%; background:#25D366; display:inline-block; }
.eb-header-actions { display:flex; gap:6px; }
.eb-header-actions button { background:none; border:none; color:#fff; cursor:pointer; padding:6px; border-radius:50%; transition:background 0.2s; }
.eb-header-actions button:hover { background:rgba(255,255,255,0.15); }

/* WhatsApp Chat Area */
#eb-chat-history { 
    flex:1; padding:16px 12px; overflow-y:auto; 
    background-color:#ECE5DD;
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23d4cfc6' fill-opacity='0.25'%3E%3Ccircle cx='8' cy='8' r='1.5'/%3E%3Ccircle cx='38' cy='22' r='1'/%3E%3Ccircle cx='18' cy='42' r='1.2'/%3E%3Ccircle cx='52' cy='48' r='1'/%3E%3C/g%3E%3C/svg%3E");
    display:flex; flex-direction:column; gap:6px; 
    -webkit-overflow-scrolling:touch; overscroll-behavior:contain; min-height:0;
}

/* Message Bubbles */
.eb-msg { max-width:82%; padding:8px 12px; border-radius:8px; font-size:14px; line-height:1.45; word-wrap:break-word; overflow-wrap:break-word; position:relative; box-shadow:0 1px 1px rgba(0,0,0,0.08); }
.eb-msg-bot { background:#fff; color:#111B21; align-self:flex-start; border-top-left-radius:0; margin-left:2px; }
.eb-msg-user { background:#DCF8C6; color:#111B21; align-self:flex-end; border-top-right-radius:0; margin-right:2px; }
.eb-msg-time { font-size:10px; color:#667781; text-align:right; margin-top:3px; }

/* Input Area */
#eb-chat-input-area { 
    padding:8px 10px; background:#F0F0F0; border-top:none; 
    display:flex; gap:8px; flex-shrink:0; align-items:center;
}
#eb-chat-input { 
    flex:1; border:none; border-radius:24px; padding:10px 16px; 
    outline:none; font-size:15px; -webkit-appearance:none; appearance:none;
    background:#fff; color:#111B21; box-shadow:0 1px 2px rgba(0,0,0,0.06);
}
#eb-chat-input:focus { box-shadow:0 1px 4px rgba(0,168,132,0.2); }
#eb-chat-input::placeholder { color:#8696A0; }
#eb-chat-send { 
    background:#00A884; color:#fff; border:none; width:44px; height:44px;
    border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center;
    flex-shrink:0; -webkit-tap-highlight-color:transparent; transition:all 0.2s;
    box-shadow:0 2px 6px rgba(0,168,132,0.3);
}
#eb-chat-send:hover { background:#008F72; transform:scale(1.05); }
#eb-chat-send:active { transform:scale(0.92); }

/* Quick Replies */
.eb-quick-reply { 
    background:#fff; border:1px solid #25D366; color:#075E54; 
    padding:8px 14px; border-radius:20px; font-size:13px; cursor:pointer; 
    margin:0 5px 6px 0; display:inline-block; transition:all 0.2s; 
    -webkit-tap-highlight-color:transparent; user-select:none; line-height:1.3;
    font-weight:500; box-shadow:0 1px 2px rgba(0,0,0,0.05);
}
.eb-quick-reply:hover { background:#25D366; color:#fff; transform:translateY(-1px); box-shadow:0 3px 10px rgba(37,211,102,0.3); }

/* Gallery / Carousel */
.eb-gallery-container { 
    display:flex; gap:10px; overflow-x:auto; padding-bottom:12px; margin-bottom:10px; 
    -webkit-overflow-scrolling:touch; scroll-snap-type: x mandatory;
    scrollbar-width: none; -ms-overflow-style: none;
}
.eb-gallery-container::-webkit-scrollbar { display: none; }
.eb-gallery-item { 
    flex:0 0 140px; cursor:pointer; background:#fff; border-radius:10px; 
    overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,0.1); border:1px solid #eee;
    scroll-snap-align: start; transition:transform 0.2s;
}
.eb-gallery-item:active { transform:scale(0.95); }
.eb-gallery-item img { width:100%; height:90px; object-fit:cover; display:block; }
.eb-gallery-item-label { 
    padding:6px 8px; font-size:11px; font-weight:600; color:#075E54;
    text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* Powered By */
.eb-powered { text-align:center; padding:4px; background:#F0F0F0; font-size:10px; color:#8696A0; flex-shrink:0; }
.eb-powered a { color:#075E54; text-decoration:none; font-weight:600; }

/* Animations */
@keyframes ebFloat {
    0%,100% { transform:translateY(0); box-shadow:0 4px 20px rgba(37,211,102,0.45); }
    50% { transform:translateY(-5px); box-shadow:0 8px 30px rgba(37,211,102,0.5); }
}
@keyframes ebFloatMid {
    0%,100% { transform:translateY(-50%); box-shadow:-4px 0 20px rgba(7,94,84,0.3); }
    50% { transform:translateY(calc(-50% - 4px)); box-shadow:-4px 0 30px rgba(37,211,102,0.4); }
}
@keyframes ebBounce { 0%,80%,100% { transform:scale(0) } 40% { transform:scale(1) } }

/* Mobile View */
@media (max-width:600px) {
    #eb-chat-wrapper.eb-open { position:fixed!important; top:0!important; left:0!important; right:0!important; bottom:0!important; width:100%!important; height:100%!important; transform:none!important; z-index:9999999!important; }
    #eb-chat-wrapper.eb-open #eb-toggle-btn { display:none!important; }
    #eb-chat-window { position:fixed!important; top:0!important; left:0!important; right:0!important; bottom:0!important; width:100%!important; height:100%!important; max-height:100%!important; border-radius:0!important; border:none!important; margin:0!important; }
    #eb-chat-header { padding:10px 14px; padding-top:max(10px,env(safe-area-inset-top)); }
    #eb-chat-history { padding:10px 8px; gap:5px; }
    .eb-msg { font-size:15px; padding:8px 12px; max-width:88%; }
    .eb-quick-reply { padding:10px 16px; font-size:14px; }
    #eb-chat-input-area { padding:6px 8px; padding-bottom:max(6px,env(safe-area-inset-bottom)); }
    #eb-chat-input { padding:11px 16px; font-size:16px; }
    #eb-chat-send { width:46px; height:46px; }
}