#ailc-wrapper { position: fixed; bottom: 20px; right: 20px; z-index: 999999; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; }

/* Toggle Button */
#ailc-toggle { display: flex; align-items: center; justify-content: flex-end; cursor: pointer; gap: 12px; }
#ailc-toggle-name { background: #fff; color: #333; padding: 8px 14px; border-radius: 20px; font-size: 15px; font-weight: 500; box-shadow: 0 4px 12px rgba(0,0,0,0.15); transition: transform 0.2s; }
#ailc-toggle-icon { width: 60px; height: 60px; background: #4a90e2; color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(0,0,0,0.15); transition: transform 0.2s; background-size: cover; background-position: center; }
#ailc-toggle:hover #ailc-toggle-icon { transform: scale(1.1); }

/* Chat Box */
#ailc-box { width: 350px; max-width: 90vw; position: absolute; bottom: 85px; right: 0; background: #fff; border-radius: 12px; box-shadow: 0 8px 30px rgba(0,0,0,0.12); overflow: hidden; border: 1px solid #e6e6e6; display: flex; flex-direction: column; }

/* Header */
#ailc-header { background: linear-gradient(90deg,#4a90e2,#6b8cff); color:#fff; padding:12px 15px; font-weight:600; font-size: 16px; display: flex; align-items: center; }
#ailc-logo { height: 24px; margin-right: 10px; border-radius: 3px; }

/* Chat Body */
#ailc-body { height: 350px; overflow-y: auto; padding:15px; background:#f9f9f9; }
.ailc-msg { margin-bottom:12px; padding:8px 12px; border-radius:12px; max-width:90%; line-height: 1.5; word-wrap: break-word; font-size: 14px; }
.ailc-msg strong { display: block; margin-bottom: 2px; font-size: 0.85em; color: #555; }
.ailc-msg.user { background:#eaf3ff; margin-left:auto; border-bottom-right-radius: 4px; }
.ailc-msg.ai { background:#ffffff; border:1px solid #eee; border-bottom-left-radius: 4px; }

/* Inline Language Buttons (Inside Welcome Message) */
.ailc-lang-inline-container {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}

.ailc-lang-inline-btn {
    background: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 4px 8px;
    font-size: 12px;
    color: #333;
    cursor: pointer;
    transition: all 0.2s;
    font-family: inherit;
}

.ailc-lang-inline-btn:hover {
    background: #e9e9e9;
    border-color: #ccc;
}

.ailc-lang-inline-btn.selected {
    background: #4a90e2;
    color: #fff;
    border-color: #4a90e2;
    font-weight: 500;
}

/* Footer */
#ailc-footer { display:flex; gap:8px; padding:10px; border-top:1px solid #eee; background:#fff; }
#ailc-input { flex:1; padding:10px; border:1px solid #ddd; border-radius:6px; outline:none; font-size: 14px; }
#ailc-send { padding:8px 15px; border:none; background:#4a90e2; color:#fff; border-radius:6px; cursor:pointer; font-size: 14px; }
#ailc-send:hover { background: #3a7bc8; }

/* Dots Animation */
.ailc-thinking::after { content: '.'; display: inline-block; animation: ailc-dots 1s steps(5, end) infinite; }
@keyframes ailc-dots { 0%, 20% { color: rgba(0,0,0,0); text-shadow: .25em 0 0 rgba(0,0,0,0), .5em 0 0 rgba(0,0,0,0); } 40% { color: #333; text-shadow: .25em 0 0 rgba(0,0,0,0), .5em 0 0 rgba(0,0,0,0); } 60% { text-shadow: .25em 0 0 #333, .5em 0 0 rgba(0,0,0,0); } 80%, 100% { text-shadow: .25em 0 0 #333, .5em 0 0 #333; } }

/* Mobile */
@media (max-width: 600px) {
    #ailc-wrapper { right: 10px; bottom: 10px; }
    #ailc-box { width: 300px; max-width: 95vw; height: auto; }
    #ailc-body { height: 300px; }
    .ailc-lang-inline-btn { padding: 6px 10px; font-size: 13px; } /* Larger touch targets */
}