/* =====================================
   Mr.AI Creative Assistant
   Premium Glass UI
===================================== */


.ai-assistant{

    position:fixed;
    
    right:35px;
    
    bottom:35px;
    
    z-index:99999;
    
    font-family:"Vazirmatn",sans-serif;
    
    }
    
    
    
    /* =====================
       Floating AI Orb
    ===================== */
    
    
    .ai-button{
    
    position:relative;
    
    width:75px;
    
    height:75px;
    
    border-radius:50%;
    
    border:none;
    
    cursor:pointer;
    
    
    background:
    
    linear-gradient(
    135deg,
    #00eaff,
    #2563eb
    );
    
    
    color:white;
    
    font-size:34px;
    
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    
    box-shadow:
    
    0 0 30px rgba(0,212,255,.6);
    
    
    transition:.5s;
    
    
    }
    
    
    
    .ai-button::before{
    
    content:"";
    
    
    position:absolute;
    
    
    inset:-8px;
    
    
    border-radius:50%;
    
    
    border:
    
    2px solid rgba(0,212,255,.5);
    
    
    animation:ring 2s infinite;
    
    
    }
    
    
    
    @keyframes ring{
    
    
    0%{
    
    transform:scale(.8);
    
    opacity:1;
    
    }
    
    
    100%{
    
    transform:scale(1.4);
    
    opacity:0;
    
    }
    
    
    }
    
    
    
    .ai-button:hover{
    
    transform:
    
    scale(1.15)
    rotate(10deg);
    
    }
    
    
    
    
    
    
    /* =====================
     Chat Window
    ===================== */
    
    
    .ai-chat{
    
    
    position:absolute;
    
    
    right:0;
    
    
    bottom:95px;
    
    
    width:390px;
    
    
    background:
    
    
    linear-gradient(
    145deg,
    rgba(15,23,42,.96),
    rgba(2,8,23,.92)
    );
    
    
    border-radius:32px;
    
    
    overflow:hidden;
    
    
    border:
    
    1px solid rgba(255,255,255,.15);
    
    
    
    box-shadow:
    
    
    0 40px 100px rgba(0,0,0,.7);
    
    
    
    backdrop-filter:
    
    blur(30px);
    
    
    display:none;
    
    
    }
    
    
    
    
    .ai-chat::before{
    
    
    content:"";
    
    
    position:absolute;
    
    
    top:-100px;
    
    right:-100px;
    
    
    width:220px;
    
    height:220px;
    
    
    background:
    
    rgba(0,212,255,.18);
    
    
    filter:blur(70px);
    
    
    }
    
    
    
    
    
    
    /* =====================
     Header
    ===================== */
    
    
    .ai-header{
    
    
    position:relative;
    
    
    padding:25px;
    
    
    display:flex;
    
    
    align-items:center;
    
    
    justify-content:space-between;
    
    
    background:
    
    
    linear-gradient(
    135deg,
    rgba(0,212,255,.25),
    rgba(37,99,235,.25)
    );
    
    
    
    color:white;
    
    }
    
    
    
    
    .ai-header strong{
    
    
    font-size:20px;
    
    
    letter-spacing:.5px;
    
    
    }
    
    
    
    .ai-header span{
    
    
    display:block;
    
    
    margin-top:5px;
    
    
    font-size:12px;
    
    
    color:#cbd5e1;
    
    
    }
    
    
    
    
    .ai-header span::before{
    
    
    content:"●";
    
    
    color:#22c55e;
    
    
    margin-left:5px;
    
    
    }
    
    
    
    
    
    
    .close-ai{
    
    
    width:35px;
    
    
    height:35px;
    
    
    border-radius:50%;
    
    
    border:none;
    
    
    background:
    
    rgba(255,255,255,.1);
    
    
    color:white;
    
    
    font-size:22px;
    
    
    cursor:pointer;
    
    
    }
    
    
    
    
    
    
    /* =====================
     Messages
    ===================== */
    
    
    .ai-messages{
    
    
    height:310px;
    
    
    overflow-y:auto;
    
    
    padding:25px;
    
    
    }
    
    
    
    
    
    .ai-message.bot{
    
    
    background:
    
    
    rgba(255,255,255,.07);
    
    
    border:
    
    
    1px solid rgba(255,255,255,.1);
    
    
    border-radius:25px;
    
    
    padding:20px;
    
    
    color:#fff;
    
    
    line-height:2;
    
    
    font-size:14px;
    
    
    animation:messageIn .5s;
    
    
    }
    
    
    
    
    
    @keyframes messageIn{
    
    
    from{
    
    opacity:0;
    
    transform:translateY(20px);
    
    }
    
    
    to{
    
    opacity:1;
    
    transform:translateY(0);
    
    }
    
    
    }
    
    
    
    
    
    
    /* =====================
     Buttons
    ===================== */
    
    
    .ai-options{
    
    
    padding:20px;
    
    
    display:flex;
    
    
    flex-direction:column;
    
    
    gap:12px;
    
    
    }
    
    
    
    
    
    .ai-options button{
    
    
    position:relative;
    
    
    padding:16px;
    
    
    border-radius:22px;
    
    
    border:
    
    1px solid rgba(255,255,255,.15);
    
    
    background:
    
    
    rgba(255,255,255,.06);
    
    
    color:white;
    
    
    font-family:inherit;
    
    
    font-weight:600;
    
    
    cursor:pointer;
    
    
    transition:.4s;
    
    
    overflow:hidden;
    
    
    }
    
    
    
    
    .ai-options button:hover{
    
    
    background:
    
    linear-gradient(
    135deg,
    #00d4ff,
    #2563eb
    );
    
    
    transform:
    
    translateX(-8px);
    
    
    box-shadow:
    
    0 10px 30px rgba(0,212,255,.25);
    
    
    }
    
    
    
    
    
    
    @media(max-width:600px){
    
    
    .ai-assistant{
    
    right:15px;
    
    bottom:20px;
    
    }
    
    
    
    .ai-chat{
    
    
    width:calc(100vw - 30px);
    
    
    }
    
    
    
    }
    .ai-assistant{

        left:35px;
        right:auto;
    
    }
    
    
    .ai-chat{
    
        left:0;
        right:auto;
    
    }
    
    
    @media(max-width:600px){
    
    .ai-assistant{
    
        left:15px;
        right:auto;
    
    }
    
    
    }
    /* =========================
   MR.AI ASSISTANT SIZE FIX
========================= */


.ai-chat{

    width:360px !important;
    max-width:90vw;

    height:520px !important;
    max-height:75vh;

    position:fixed;

    bottom:90px;
    left:25px;

    border-radius:22px;

    overflow:hidden;

    z-index:9999;

}



/* موبایل */

@media(max-width:600px){

.ai-chat{

    width:calc(100vw - 30px) !important;

    height:70vh !important;

    left:15px;

    bottom:80px;

}

}



/* دکمه حباب */

.ai-button{

    cursor:pointer;

    z-index:10000;

}
/* AI OPTIONS FIX */

.ai-options{

    display:flex !important;
    
    flex-direction:column;
    
    gap:10px;
    
    padding:12px;
    
    width:100%;
    
    box-sizing:border-box;
    
    }
    
    
    
    .ai-options button{
    
    display:block !important;
    
    width:100%;
    
    padding:12px 15px;
    
    border-radius:14px;
    
    border:none;
    
    cursor:pointer;
    
    background:linear-gradient(135deg,#111827,#1e40af);
    
    color:white;
    
    font-size:14px;
    
    font-family:inherit;
    
    text-align:center;
    
    transition:.3s;
    
    }
    
    
    
    .ai-options button:hover{
    
    transform:translateY(-2px);
    
    opacity:.9;
    
    }
    
    
    
    
    
    .ai-messages{
    
    overflow-y:auto;
    
    height:320px;
    
    padding:15px;
    
    }
    
    
    
    .ai-chat{
    
    display:flex;
    
    flex-direction:column;
    
    }
    
    
    /* ===============================
   AI ASSISTANT RESPONSIVE FIX
   Desktop + Mobile
================================ */

.ai-chat{

    max-height:80vh !important;

    overflow:hidden !important;

    display:flex;

    flex-direction:column;

}



.ai-messages{

    flex:1;

    overflow-y:auto !important;

    max-height:45vh;

    padding-right:5px;

}



.ai-options{

    max-height:25vh;

    overflow-y:auto !important;

    padding-right:5px;

}



.ai-options button{

    width:100%;

    margin-bottom:10px;

    white-space:normal;

    line-height:1.8;

}



/* موبایل */

@media(max-width:600px){


.ai-chat{

    width:92vw !important;

    max-width:92vw !important;

    max-height:75vh !important;

    bottom:90px !important;

}


.ai-messages{

    max-height:35vh;

}



.ai-options{

    max-height:20vh;

}



.ai-options button{

    font-size:14px;

    padding:12px;

}



}
/* ===== FINAL AI CHAT FIX ===== */

.ai-assistant{
    position: fixed;
    z-index:9999;
}


.ai-chat{

    display:flex !important;

    flex-direction:column !important;

    width:360px;

    max-height:70vh !important;

    overflow:hidden !important;

}



.ai-messages{

    overflow-y:auto !important;

    flex:none !important;

    max-height:250px !important;

}



.ai-options{

    display:flex !important;

    flex-direction:column !important;

    gap:8px;

    overflow-y:auto !important;

    max-height:180px !important;

    padding-bottom:10px;

}



.ai-options button{

    flex-shrink:0 !important;

    width:100% !important;

    min-height:45px;

    height:auto !important;

}



/* موبایل */

@media(max-width:600px){

.ai-chat{

    width:90vw !important;

    max-height:75vh !important;

}



.ai-messages{

    max-height:220px !important;

}



.ai-options{

    max-height:160px !important;

}

}
/* FORCE AI CHAT CLOSED ON START */

.ai-chat{
    display:none;
}
/* Hide AI chat on first load */
.ai-chat{
    display:none !important;
}

.ai-chat.show{
    display:flex !important;
}