/* Asistify Chatbot v3.0.0 — all styles scoped to #astfy-chatbot-root */

#astfy-chatbot-root {
    --astfy-primary: #6C3CE1;
    --astfy-primary-dark: #5A2DBD;
    --astfy-primary-light: #9B6DFF;
    --astfy-primary-glow: rgba(108, 60, 225, 0.35);
    --astfy-bg: #ffffff;
    --astfy-bg-alt: #F8F7FC;
    --astfy-text: #1A1A2E;
    --astfy-text-light: #6B7280;
    --astfy-border: #E5E7EB;
    --astfy-radius: 20px;

    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    position: fixed !important;
    bottom: 24px;
    z-index: 999999;
}

#astfy-chatbot-root *,
#astfy-chatbot-root *::before,
#astfy-chatbot-root *::after {
    box-sizing: border-box !important;
    margin: 0;
    padding: 0;
}

#astfy-chatbot-root.astfy-right { right: 24px; }
#astfy-chatbot-root.astfy-left { left: 24px; }

/* ═══ TOGGLE ═══ */
#astfy-chatbot-root .astfy-toggle {
    width: 64px; height: 64px;
    border-radius: 50% !important; border: none !important; cursor: pointer;
    background: linear-gradient(135deg, var(--astfy-primary), var(--astfy-primary-light)) !important;
    color: #fff !important;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 8px 32px var(--astfy-primary-glow);
    transition: all 0.4s cubic-bezier(0.22,1,0.36,1);
    position: relative; overflow: hidden;
    padding: 0 !important;
}
#astfy-chatbot-root .astfy-toggle::before {
    content: ''; position: absolute; inset: -2px; border-radius: 50%;
    background: linear-gradient(135deg, var(--astfy-primary-light), var(--astfy-primary));
    z-index: -1; animation: astfy-pulse 2s ease-in-out infinite;
    pointer-events: none;
}
@keyframes astfy-pulse { 0%,100%{transform:scale(1);opacity:.5} 50%{transform:scale(1.15);opacity:0} }
#astfy-chatbot-root .astfy-toggle:hover { transform: scale(1.1); }
#astfy-chatbot-root .astfy-toggle svg { width: 28px; height: 28px; transition: all .3s ease; }
#astfy-chatbot-root .astfy-toggle .astfy-icon-close { opacity:0; transform:rotate(-90deg) scale(0); position:absolute; }
#astfy-chatbot-root .astfy-toggle.astfy-open .astfy-icon-chat { opacity:0; transform:rotate(90deg) scale(0); position:absolute; }
#astfy-chatbot-root .astfy-toggle.astfy-open .astfy-icon-close { opacity:1; transform:rotate(0) scale(1); }

/* ═══ TOGGLE WRAP & LABEL ═══ */
#astfy-chatbot-root .astfy-toggle-wrap {
    display:flex !important; align-items:center !important; gap:12px !important;
    position:relative;
}
#astfy-chatbot-root.astfy-right .astfy-toggle-wrap { flex-direction:row; }
#astfy-chatbot-root.astfy-left .astfy-toggle-wrap { flex-direction:row-reverse; }

#astfy-chatbot-root .astfy-label {
    background:var(--astfy-bg) !important;
    color:var(--astfy-text) !important;
    padding:10px 16px !important;
    border-radius:12px !important;
    font-size:13px !important;
    line-height:1.4 !important;
    box-shadow:0 4px 20px rgba(0,0,0,0.12) !important;
    white-space:nowrap !important;
    animation: astfy-label-in .5s cubic-bezier(0.22,1,0.36,1);
    cursor:pointer;
    transition:transform .2s ease, box-shadow .2s ease;
    max-width:260px !important;
    white-space:normal !important;
    border:none !important;
    margin:0 !important;
    font-family:inherit !important;
    order:-1;
}
#astfy-chatbot-root .astfy-label strong {
    color:var(--astfy-primary) !important;
    font-weight:700 !important;
}
#astfy-chatbot-root .astfy-label:hover {
    transform:translateY(-2px);
    box-shadow:0 6px 24px rgba(0,0,0,0.16) !important;
}
#astfy-chatbot-root .astfy-label::after {
    content:''; position:absolute; top:50%; transform:translateY(-50%);
    width:0; height:0;
    border-top:6px solid transparent; border-bottom:6px solid transparent;
}
#astfy-chatbot-root.astfy-right .astfy-label::after {
    right:-6px; border-left:6px solid var(--astfy-bg);
}
#astfy-chatbot-root.astfy-left .astfy-label::after {
    left:-6px; border-right:6px solid var(--astfy-bg);
}
@keyframes astfy-label-in { 0%{opacity:0;transform:translateX(20px) scale(.9)} 100%{opacity:1;transform:none} }
#astfy-chatbot-root.astfy-left .astfy-label { animation-name:astfy-label-in-left; }
@keyframes astfy-label-in-left { 0%{opacity:0;transform:translateX(-20px) scale(.9)} 100%{opacity:1;transform:none} }

/* ═══ WINDOW ═══ */
#astfy-chatbot-root .astfy-window {
    position: absolute; bottom: 80px;
    width: 420px; max-height: 640px; height: 75vh;
    background: var(--astfy-bg) !important;
    border-radius: var(--astfy-radius) !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.15), 0 0 40px var(--astfy-primary-glow);
    display: flex; flex-direction: column; overflow: hidden;
    transform: scale(0.5) translateY(20px); opacity: 0; pointer-events: none;
    transition: all .4s cubic-bezier(0.22,1,0.36,1);
    transform-origin: bottom right;
}
#astfy-chatbot-root.astfy-left .astfy-window { transform-origin: bottom left; }
#astfy-chatbot-root .astfy-window.astfy-visible { transform: scale(1) translateY(0); opacity: 1; pointer-events: all; }
#astfy-chatbot-root.astfy-right .astfy-window { right: 0; }
#astfy-chatbot-root.astfy-left .astfy-window { left: 0; }

/* ═══ HEADER ═══ */
#astfy-chatbot-root .astfy-header {
    background: linear-gradient(135deg, var(--astfy-primary), var(--astfy-primary-dark)) !important;
    color: #fff !important; padding: 16px 20px !important;
    display: flex !important; align-items: center; gap: 12px;
    flex-shrink: 0; position: relative;
}
#astfy-chatbot-root .astfy-header::before {
    content:''; position:absolute; top:-50%; right:-30%;
    width:200px; height:200px;
    background:radial-gradient(circle, rgba(255,255,255,0.08) 0%, transparent 70%);
    border-radius:50%; pointer-events: none;
}
#astfy-chatbot-root .astfy-avatar {
    width:40px; height:40px; background:rgba(255,255,255,0.2) !important;
    border-radius:50% !important; display:flex; align-items:center; justify-content:center;
    flex-shrink:0; position:relative;
}
#astfy-chatbot-root .astfy-avatar svg { width:22px; height:22px; }
#astfy-chatbot-root .astfy-avatar-dot {
    position:absolute; bottom:0; right:0;
    width:11px; height:11px; background:#00E676 !important;
    border-radius:50% !important; border:2px solid var(--astfy-primary) !important;
}
#astfy-chatbot-root .astfy-header-info { flex:1; min-width:0; }
#astfy-chatbot-root .astfy-header-name { font-weight:700 !important; font-size:15px !important; color:#fff !important; }
#astfy-chatbot-root .astfy-header-status { font-size:11px !important; opacity:.8; display:flex; align-items:center; gap:4px; color:#fff !important; }

#astfy-chatbot-root .astfy-close-btn {
    background:rgba(255,255,255,0.15) !important; border:none !important; color:#fff !important;
    width:36px !important; height:36px !important; border-radius:50% !important; cursor:pointer !important;
    display:flex !important; align-items:center; justify-content:center;
    transition: all .2s ease;
    position: relative; z-index: 10; flex-shrink: 0;
    padding: 0 !important; margin: 0 !important;
}
#astfy-chatbot-root .astfy-close-btn svg { width: 18px; height: 18px; }
#astfy-chatbot-root .astfy-close-btn:hover { background:rgba(255,255,255,0.3) !important; }
#astfy-chatbot-root .astfy-close-btn:active { transform:scale(.9); }

/* ═══ MESSAGES ═══ */
#astfy-chatbot-root .astfy-messages {
    flex:1; overflow-y:auto !important; padding:20px !important;
    display:flex !important; flex-direction:column; gap:16px;
    scroll-behavior:smooth; background:var(--astfy-bg-alt) !important;
}
#astfy-chatbot-root .astfy-messages::-webkit-scrollbar { width:4px; }
#astfy-chatbot-root .astfy-messages::-webkit-scrollbar-track { background:transparent; }
#astfy-chatbot-root .astfy-messages::-webkit-scrollbar-thumb { background:var(--astfy-border); border-radius:10px; }

/* ═══ BUBBLES ═══ */
#astfy-chatbot-root .astfy-msg {
    display:flex !important; gap:8px; max-width:92%;
    animation: astfy-in .4s cubic-bezier(0.22,1,0.36,1);
}
@keyframes astfy-in { 0%{opacity:0;transform:translateY(10px) scale(.95)} 100%{opacity:1;transform:none} }

#astfy-chatbot-root .astfy-msg-user { align-self:flex-end; flex-direction:row-reverse; }
#astfy-chatbot-root .astfy-msg-avatar {
    width:30px !important; height:30px !important; border-radius:50% !important;
    background:linear-gradient(135deg, var(--astfy-primary), var(--astfy-primary-light)) !important;
    color:#fff !important; display:flex !important; align-items:center; justify-content:center;
    flex-shrink:0; margin-top:2px;
}
#astfy-chatbot-root .astfy-msg-avatar svg { width:14px; height:14px; }

#astfy-chatbot-root .astfy-bubble {
    padding:14px 18px !important; border-radius:16px !important;
    word-wrap:break-word; white-space:pre-wrap;
    font-size:14px !important; line-height:1.6 !important;
}
#astfy-chatbot-root .astfy-msg-bot .astfy-bubble {
    background:var(--astfy-bg) !important; color:var(--astfy-text) !important;
    border-bottom-left-radius:4px !important;
    box-shadow:0 1px 2px rgba(0,0,0,0.05);
}
#astfy-chatbot-root .astfy-msg-user .astfy-bubble {
    background:linear-gradient(135deg, var(--astfy-primary), var(--astfy-primary-dark)) !important;
    color:#fff !important; border-bottom-right-radius:4px !important;
    box-shadow:0 2px 8px var(--astfy-primary-glow);
}
#astfy-chatbot-root .astfy-msg-time {
    font-size:10px !important; color:var(--astfy-text-light) !important;
    margin-top:3px; padding:0 4px;
}
#astfy-chatbot-root .astfy-msg-user .astfy-msg-time { text-align:right; }

/* ═══ OPTIONS ═══ */
#astfy-chatbot-root .astfy-options {
    display:flex !important; flex-direction:column !important; gap:8px !important;
    padding:6px 0 !important; width:100% !important;
    animation: astfy-in .4s cubic-bezier(0.22,1,0.36,1);
}
#astfy-chatbot-root .astfy-option-btn {
    background:var(--astfy-bg) !important;
    border:1.5px solid var(--astfy-border) !important;
    color:var(--astfy-text) !important;
    padding:14px 20px !important;
    border-radius:12px !important;
    font-size:14px !important; font-weight:500 !important;
    cursor:pointer !important; font-family:inherit !important;
    transition:all .2s ease;
    text-align:left !important;
    line-height:1.4 !important;
    width:100% !important;
    display:block !important;
    margin:0 !important;
    outline:none !important;
    box-shadow:none !important;
    text-decoration:none !important;
    text-transform:none !important;
    letter-spacing:normal !important;
}
#astfy-chatbot-root .astfy-option-btn:hover {
    border-color:var(--astfy-primary) !important;
    background:var(--astfy-primary) !important;
    color:#fff !important;
    transform:translateY(-1px);
    box-shadow:0 4px 14px var(--astfy-primary-glow) !important;
}
#astfy-chatbot-root .astfy-option-btn:active { transform:scale(.98); }

/* ═══ CONTACT FORM ═══ */
#astfy-chatbot-root .astfy-contact-form {
    background:var(--astfy-bg) !important;
    border-radius:14px !important;
    padding:20px !important;
    box-shadow:0 1px 4px rgba(0,0,0,0.06) !important;
    display:flex !important; flex-direction:column !important; gap:16px !important;
    animation: astfy-in .4s cubic-bezier(0.22,1,0.36,1);
    width:100% !important;
    border:none !important;
    margin:0 !important;
}

#astfy-chatbot-root .astfy-form-group {
    display:flex !important; flex-direction:column !important; gap:6px !important;
    margin:0 !important; padding:0 !important;
}

#astfy-chatbot-root .astfy-form-group label {
    font-size:11px !important; font-weight:600 !important;
    color:var(--astfy-text-light) !important;
    text-transform:uppercase !important; letter-spacing:.5px !important;
    padding:0 0 0 2px !important;
    margin:0 !important;
    background:none !important; border:none !important;
    line-height:1.4 !important;
    display:block !important;
}

#astfy-chatbot-root .astfy-form-group input[type="text"],
#astfy-chatbot-root .astfy-form-group input[type="tel"],
#astfy-chatbot-root .astfy-form-group input[type="email"],
#astfy-chatbot-root .astfy-form-group input[type="url"],
#astfy-chatbot-root .astfy-form-group input {
    border:1.5px solid var(--astfy-border) !important;
    border-radius:10px !important;
    padding:12px 16px !important;
    font-size:14px !important;
    font-family:inherit !important;
    color:var(--astfy-text) !important;
    background:var(--astfy-bg-alt) !important;
    outline:none !important;
    transition:all .2s ease !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-width:100% !important;
    margin:0 !important;
    box-shadow:none !important;
    -webkit-appearance:none !important;
    -moz-appearance:none !important;
    appearance:none !important;
    line-height:1.5 !important;
    text-transform:none !important;
    letter-spacing:normal !important;
}

#astfy-chatbot-root .astfy-form-group input:focus {
    border-color:var(--astfy-primary) !important;
    box-shadow:0 0 0 3px rgba(108,60,225,0.08) !important;
    outline:none !important;
}

#astfy-chatbot-root .astfy-form-group input::placeholder {
    color:#bbb !important;
    opacity:1 !important;
}

#astfy-chatbot-root .astfy-form-submit {
    background:linear-gradient(135deg, var(--astfy-primary), var(--astfy-primary-light)) !important;
    color:#fff !important;
    border:none !important;
    border-radius:10px !important;
    padding:14px !important;
    font-size:15px !important;
    font-weight:600 !important;
    margin:4px 0 0 0 !important;
    cursor:pointer !important;
    font-family:inherit !important;
    transition:all .2s ease;
    width:100% !important;
    text-align:center !important;
    text-transform:none !important;
    letter-spacing:normal !important;
    line-height:1.4 !important;
    box-shadow:none !important;
    outline:none !important;
    -webkit-appearance:none !important;
    display:block !important;
}
#astfy-chatbot-root .astfy-form-submit:hover {
    transform:translateY(-1px);
    box-shadow:0 6px 20px var(--astfy-primary-glow) !important;
}
#astfy-chatbot-root .astfy-form-submit:active { transform:scale(.98); }

#astfy-chatbot-root .astfy-form-error {
    color:#FF4757 !important; font-size:13px !important; text-align:center !important;
    min-height:16px; margin:0 !important; padding:0 !important;
}

/* ═══ SUCCESS ═══ */
#astfy-chatbot-root .astfy-success { text-align:center; padding:8px 0; }
#astfy-chatbot-root .astfy-success-icon {
    width:52px; height:52px;
    background:linear-gradient(135deg,#00C853,#69F0AE) !important;
    border-radius:50% !important; display:flex; align-items:center; justify-content:center;
    margin:0 auto 10px; border:none !important;
    animation: astfy-celebrate .6s cubic-bezier(0.22,1,0.36,1);
}
@keyframes astfy-celebrate { 0%{transform:scale(0) rotate(-180deg)} 60%{transform:scale(1.2) rotate(10deg)} 100%{transform:scale(1) rotate(0)} }
#astfy-chatbot-root .astfy-success-icon svg { width:26px; height:26px; color:#fff; }
#astfy-chatbot-root .astfy-success-text { font-size:14px !important; color:var(--astfy-text) !important; line-height:1.6 !important; }

/* ═══ TYPING ═══ */
#astfy-chatbot-root .astfy-typing-dots { display:flex; align-items:center; gap:5px; padding:4px 0; }
#astfy-chatbot-root .astfy-typing-dot {
    width:7px; height:7px; background:var(--astfy-primary) !important;
    border-radius:50% !important; animation:astfy-bounce 1.4s ease-in-out infinite; opacity:.4;
    border:none !important;
}
#astfy-chatbot-root .astfy-typing-dot:nth-child(2) { animation-delay:.2s; }
#astfy-chatbot-root .astfy-typing-dot:nth-child(3) { animation-delay:.4s; }
@keyframes astfy-bounce { 0%,60%,100%{transform:translateY(0);opacity:.4} 30%{transform:translateY(-8px);opacity:1} }

/* ═══ INPUT ═══ */
#astfy-chatbot-root .astfy-input-area {
    padding:12px 16px !important; background:var(--astfy-bg) !important;
    border-top:1px solid var(--astfy-border) !important; flex-shrink:0;
}
#astfy-chatbot-root .astfy-input-wrap {
    display:flex !important; align-items:center; gap:8px;
    background:var(--astfy-bg-alt) !important; border:1.5px solid var(--astfy-border) !important;
    border-radius:24px !important; padding:4px 4px 4px 16px !important;
    transition:all .3s ease;
}
#astfy-chatbot-root .astfy-input-wrap:focus-within {
    border-color:var(--astfy-primary) !important;
    box-shadow:0 0 0 3px rgba(108,60,225,0.08) !important;
}
#astfy-chatbot-root .astfy-input {
    flex:1 !important; border:none !important; background:transparent !important;
    font-size:14px !important; color:var(--astfy-text) !important;
    outline:none !important; font-family:inherit !important; padding:6px 0 !important;
    margin:0 !important; box-shadow:none !important;
    height:auto !important; min-height:0 !important;
    -webkit-appearance:none !important;
    border-radius:0 !important;
}
#astfy-chatbot-root .astfy-input::placeholder { color:var(--astfy-text-light) !important; opacity:1 !important; }

#astfy-chatbot-root .astfy-send-btn {
    width:36px !important; height:36px !important; border-radius:50% !important; border:none !important;
    background:linear-gradient(135deg,var(--astfy-primary),var(--astfy-primary-light)) !important;
    color:#fff !important; cursor:pointer !important; display:flex !important; align-items:center; justify-content:center;
    flex-shrink:0; transition:all .3s ease; opacity:.5; transform:scale(.9);
    padding:0 !important; margin:0 !important;
}
#astfy-chatbot-root .astfy-send-btn.astfy-active { opacity:1; transform:scale(1); }
#astfy-chatbot-root .astfy-send-btn:hover.astfy-active { transform:scale(1.1); box-shadow:0 4px 12px var(--astfy-primary-glow) !important; }
#astfy-chatbot-root .astfy-send-btn svg { width:16px; height:16px; }

#astfy-chatbot-root .astfy-powered {
    text-align:center !important; padding:6px !important;
    font-size:10px !important; color:var(--astfy-text-light) !important;
    background:var(--astfy-bg) !important; border-top:1px solid var(--astfy-border) !important;
}
#astfy-chatbot-root .astfy-powered a {
    color:var(--astfy-primary) !important; text-decoration:none !important; font-weight:600 !important;
}

/* ═══ GREETING ═══ */
#astfy-chatbot-root .astfy-greeting {
    position:absolute; bottom:80px; background:var(--astfy-bg) !important;
    padding:14px 18px !important; border-radius:14px !important;
    box-shadow:0 8px 30px rgba(0,0,0,0.12); border:none !important;
    max-width:280px; font-size:14px !important; color:var(--astfy-text) !important;
    animation:astfy-greet-in .5s cubic-bezier(0.22,1,0.36,1);
    cursor:pointer; transition:transform .2s ease; line-height:1.5 !important;
}
#astfy-chatbot-root .astfy-greeting:hover { transform:translateY(-2px); }
#astfy-chatbot-root.astfy-right .astfy-greeting { right:0; }
#astfy-chatbot-root.astfy-left .astfy-greeting { left:0; }
#astfy-chatbot-root .astfy-greeting::after {
    content:''; position:absolute; bottom:-8px;
    width:16px; height:16px; background:var(--astfy-bg) !important;
    transform:rotate(45deg); box-shadow:4px 4px 8px rgba(0,0,0,0.05);
}
#astfy-chatbot-root.astfy-right .astfy-greeting::after { right:24px; }
#astfy-chatbot-root.astfy-left .astfy-greeting::after { left:24px; }
@keyframes astfy-greet-in { 0%{opacity:0;transform:translateY(10px) scale(.9)} 100%{opacity:1;transform:none} }

#astfy-chatbot-root .astfy-greeting-x {
    position:absolute; top:-8px; right:-8px;
    width:22px; height:22px; background:var(--astfy-text) !important; color:#fff !important;
    border:none !important; border-radius:50% !important; cursor:pointer;
    display:flex; align-items:center; justify-content:center; font-size:13px;
    line-height:1; padding:0 !important; margin:0 !important;
}

/* ═══ RESPONSIVE ═══ */
@media (max-width:480px) {
    #astfy-chatbot-root { bottom:12px; }
    #astfy-chatbot-root.astfy-right { right:12px; }
    #astfy-chatbot-root.astfy-left { left:12px; }

    #astfy-chatbot-root .astfy-window {
        width:calc(100vw - 24px); height:calc(100vh - 100px);
        max-height:calc(100vh - 100px); bottom:76px;
    }
    #astfy-chatbot-root.astfy-right .astfy-window { right:-4px; }
    #astfy-chatbot-root.astfy-left .astfy-window { left:-4px; }

    #astfy-chatbot-root .astfy-toggle { width:56px; height:56px; }
    #astfy-chatbot-root .astfy-toggle svg { width:24px; height:24px; }
    #astfy-chatbot-root .astfy-greeting { max-width:calc(100vw - 90px); }

    #astfy-chatbot-root .astfy-messages { padding:14px !important; gap:12px !important; }
    #astfy-chatbot-root .astfy-option-btn { padding:12px 16px !important; font-size:13px !important; }
    #astfy-chatbot-root .astfy-bubble { padding:12px 14px !important; font-size:13px !important; }
}