/* ESCUDO NUCLEAR: Nuevos IDs para evitar cruces con caché viejo */
#qm-organic-window, #qm-organic-window *, #qm-organic-launcher, #qm-organic-launcher * {
    box-sizing: border-box !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

/* EL LAUNCHER (Burbuja Flotante) */
#qm-organic-launcher { 
    position: fixed !important; bottom: 20px !important; right: 20px !important; 
    width: 60px !important; height: 60px !important; 
    background: #8B7E74 !important; border-radius: 50% !important; 
    color: rgba(245, 245, 245, 0.7) !important; 
    display: flex !important; align-items: center !important; justify-content: center !important; 
    box-shadow: 0 4px 20px rgba(0,0,0,0.3) !important; z-index: 999998 !important; 
    cursor: pointer !important; transition: all 0.4s ease-in-out !important; 
}
#qm-organic-launcher:hover { transform: scale(1.05) !important; background: #7A6D64 !important; color: #F5F5F5 !important; }

/* EL CHAT PRINCIPAL (Twilight Organic) */
#qm-organic-window { 
    position: fixed !important; bottom: 90px !important; right: 20px !important; 
    width: 360px !important; height: 65vh !important; min-height: 500px !important; max-height: calc(100vh - 110px) !important;
    background: linear-gradient(135deg, #2C2C34 0%, #4A3B32 100%) !important; 
    border-radius: 18px !important; box-shadow: 0 15px 40px rgba(0,0,0,0.4) !important; 
    display: flex !important; flex-direction: column !important; z-index: 999999 !important; 
    overflow: hidden !important; 
    
    /* Animación sedosa Apple-Style */
    opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; 
    transform: translateY(20px) scale(0.95) !important; 
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important; 
}
#qm-organic-window.qm-organic-open { 
    opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; 
    transform: translateY(0) scale(1) !important; 
}

/* CABECERA (Header Glassmorphism) */
.qm-o-header { 
    background: rgba(44, 44, 52, 0.4) !important; 
    backdrop-filter: blur(12px) !important; -webkit-backdrop-filter: blur(12px) !important; 
    color: rgba(245,245,245,0.9) !important; border-bottom: 1px solid rgba(217, 197, 178, 0.1) !important; 
    padding: 16px 20px !important; font-weight: 400 !important; 
    display: flex !important; justify-content: space-between !important; align-items: center !important; 
}
.qm-o-close { cursor: pointer !important; font-size: 28px !important; line-height: 1 !important; color: rgba(245,245,245,0.5) !important; transition: color 0.2s !important; }
.qm-o-close:hover { color: #F5F5F5 !important; }

/* BARRA DE LOGIN */
.qm-o-login-bar { background: rgba(139, 126, 116, 0.15) !important; color: #D9C5B2 !important; padding: 10px 20px !important; font-size: 12px !important; border-bottom: 1px solid rgba(217, 197, 178, 0.1) !important; display: flex !important; justify-content: space-between !important; align-items: center !important; font-weight: 300 !important; }
.qm-o-login-btn { background: #8B7E74 !important; color: #F5F5F5 !important; border: none !important; padding: 6px 12px !important; border-radius: 8px !important; cursor: pointer !important; font-weight: 400 !important; font-size: 11px !important; transition: background 0.2s !important; }
.qm-o-login-btn:hover { background: #7A6D64 !important; }

/* CUERPO DEL CHAT */
.qm-o-body { flex-grow: 1 !important; padding: 20px !important; overflow-y: auto !important; display: flex !important; flex-direction: column !important; gap: 16px !important; scroll-behavior: smooth !important; }
.qm-o-body::-webkit-scrollbar { width: 6px !important; }
.qm-o-body::-webkit-scrollbar-thumb { background: rgba(217, 197, 178, 0.2) !important; border-radius: 10px !important; }

/* BURBUJAS DE MENSAJE */
.qm-w-bubble { max-width: 85% !important; padding: 14px 18px !important; font-size: 14px !important; line-height: 1.5 !important; word-wrap: break-word !important; font-weight: 300 !important; letter-spacing: 0.2px !important; animation: qm-pop-in 0.3s ease-out forwards !important; }
@keyframes qm-pop-in { 0% { opacity: 0; transform: translateY(10px); } 100% { opacity: 1; transform: translateY(0); } }
.qm-w-bubble img { max-width: 100% !important; border-radius: 12px !important; margin-top: 8px !important; filter: saturate(0.6) brightness(0.9) !important; }

.qm-w-user { background: #D9C5B2 !important; color: #2C2C34 !important; border-radius: 18px 18px 4px 18px !important; align-self: flex-end !important; box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important; }
.qm-w-user strong { font-weight: 500 !important; color: #2C2C34 !important; }

.qm-w-bot { background: rgba(255, 255, 255, 0.05) !important; border: 1px solid rgba(217, 197, 178, 0.2) !important; backdrop-filter: blur(12px) saturate(80%) !important; -webkit-backdrop-filter: blur(12px) saturate(80%) !important; color: #F5F5F5 !important; border-radius: 18px 18px 18px 4px !important; align-self: flex-start !important; }
.qm-w-bot strong { font-weight: 400 !important; color: #D9C5B2 !important; }

/* BOTONES INTERACTIVOS */
.qm-w-btn { display: block !important; width: 100% !important; background: rgba(255,255,255,0.03) !important; color: #D9C5B2 !important; border: 1px solid rgba(139, 126, 116, 0.4) !important; padding: 12px !important; margin-top: 10px !important; border-radius: 14px !important; cursor: pointer !important; text-align: center !important; font-weight: 300 !important; text-decoration: none !important; font-size: 13px !important; transition: all 0.3s !important; }
.qm-w-btn:hover { background: rgba(139, 126, 116, 0.8) !important; color: #F5F5F5 !important; border-color: transparent !important; }

/* ÁREA DE TEXTO */
.qm-o-input-area { display: flex !important; padding: 14px 20px !important; background: rgba(44, 44, 52, 0.6) !important; backdrop-filter: blur(12px) !important; -webkit-backdrop-filter: blur(12px) !important; border-top: 1px solid rgba(217, 197, 178, 0.1) !important; align-items: center !important; gap: 10px !important; }
.qm-o-input { flex-grow: 1 !important; background: rgba(255,255,255,0.05) !important; color: #F5F5F5 !important; border: 1px solid rgba(217,197,178,0.2) !important; padding: 12px 16px !important; border-radius: 24px !important; outline: none !important; font-size: 16px !important; font-weight: 300 !important; transition: border-color 0.3s !important; }
.qm-o-input::placeholder { color: #A99985 !important; opacity: 0.8 !important; }
.qm-o-input:focus { border-color: #8B7E74 !important; background: rgba(255,255,255,0.08) !important; }

/* BOTONES DE ACCIÓN */
.qm-w-gps-btn, .qm-o-send { background: transparent !important; color: #A99985 !important; border: none !important; font-size: 22px !important; cursor: pointer !important; transition: transform 0.2s, color 0.2s !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; }
.qm-w-gps-btn:hover, .qm-o-send:hover { transform: scale(1.1) !important; color: #D9C5B2 !important; }

/* MODAL (Login) */
.qm-o-modal { position: absolute !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; background: rgba(44, 44, 52, 0.85) !important; backdrop-filter: blur(8px) !important; -webkit-backdrop-filter: blur(8px) !important; display: none; flex-direction: column !important; justify-content: center !important; align-items: center !important; z-index: 1000 !important; padding: 24px !important; }
.qm-o-modal-box { background: #2C2C34 !important; padding: 32px 24px !important; border-radius: 18px !important; width: 100% !important; border: 1px solid rgba(217, 197, 178, 0.2) !important; box-shadow: 0 15px 40px rgba(0,0,0,0.5) !important; text-align: center !important; }
.qm-o-modal-box h3 { color: #F5F5F5 !important; font-weight: 400 !important; margin: 0 0 12px 0 !important; font-size: 20px !important; }
.qm-o-modal-box p { color: #A99985 !important; font-size: 14px !important; font-weight: 300 !important; line-height: 1.5 !important; margin: 0 0 24px 0 !important; }
.qm-o-modal-box input { background: rgba(255,255,255,0.05) !important; color: #F5F5F5 !important; border: 1px solid rgba(217, 197, 178, 0.2) !important; width: 100% !important; padding: 12px !important; border-radius: 12px !important; margin-bottom: 15px !important; box-sizing: border-box !important; outline: none !important; transition: border-color 0.3s !important; font-size: 16px !important; }
.qm-o-modal-box input:focus { border-color: #8B7E74 !important; }

.qm-o-typing { color: #A99985 !important; font-style: italic !important; font-size: 13px !important; font-weight: 300 !important; margin-left: 10px !important; }

/* ADAPTACIÓN MÓVIL TOTAL */
@media (max-width: 480px) {
     #qm-organic-window { top: auto !important; bottom: 95px !important; left: 15px !important; right: 15px !important; width: auto !important; height: 75vh !important; max-height: 600px !important; border-radius: 18px !important; transform: translateY(20px) scale(0.95) !important; box-shadow: 0 15px 40px rgba(0,0,0,0.5) !important; }
    #qm-organic-window.qm-organic-open { transform: translateY(0) scale(1) !important; }
    #qm-organic-launcher { bottom: 20px !important; right: 20px !important; }
    .qm-o-modal-box { border-radius: 20px !important; }
    .qm-o-header { padding-top: 16px !important; }
}