/*
 * My Chat — ai-ordr.css
 * آیکون دستیار هوشمند بالای دکمه شناور + پنل گفتگو.
 *
 * فلسفه مثل fab-ordr.css: همه‌چیز داخل wrapper والد ‎.co-chat اسکوپ می‌شود،
 * بدون !important پراکنده. مقادیر سایز/فاصله متغیر CSS هستند و از PHP تزریق
 * می‌شوند (chtai_css_vars).
 *
 * نکته: دسکتاپ و موبایل دو متغیر جدا دارند (‎-d و ‎-m) نه یک متغیر مشترک؛
 * متغیر مشترکِ ست‌شده روی المان را media query نمی‌تواند بازنویسی کند.
 *
 * آفست پنل عمداً از همان متغیرهای FAB (‎--co-fab-x/y) خوانده می‌شود تا پنل
 * همیشه با دکمه هم‌راستا بماند و دو منبع حقیقت ایجاد نشود.
 */

/* ═══ آیکون شناور دستیار ═══ */
/* لنگر: ‎.co-chat-widget که خودش position:fixed است و ارتفاعش = ارتفاع تریگر */
.co-chat-widget .co-ai-fab{position:absolute;bottom:calc(100% + var(--co-ai-gap-d,12px));left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;transition:opacity .35s,transform .35s,visibility .35s;z-index:1098}

/* هنگام باز شدن لیست پیام‌رسان‌ها محو می‌شود — فقط CSS، بدون وابستگی به JS */
.co-chat-widget.co-chat-open .co-ai-fab{opacity:0;visibility:hidden;pointer-events:none;transform:translateX(-50%) scale(.6)}

.co-chat-widget .co-ai-fab-btn{position:relative;display:flex;align-items:center;justify-content:center;width:var(--co-ai-size-d,44px);height:var(--co-ai-size-d,44px);border-radius:50%;cursor:pointer;background:#fff;border:1px solid #e5e7eb;box-shadow:0 10px 20px 0 rgba(73,104,126,.18);color:#334155;transition:transform .25s,box-shadow .25s}
.co-chat-widget .co-ai-fab-btn:hover{transform:translateY(-2px);box-shadow:0 14px 26px 0 rgba(73,104,126,.24)}
.co-chat-widget .co-ai-fab-btn:focus-visible{outline:2px solid #6366f1;outline-offset:2px}
.co-chat-widget .co-ai-fab-img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}

/* کادر نام کنار آیکون — سمت مخالف جهت دکمه */
.co-chat-widget .co-ai-fab-name{position:absolute;top:50%;transform:translateY(-50%);background:#fff;color:#111;font-size:12px;font-weight:600;line-height:1;white-space:nowrap;padding:7px 11px;border-radius:8px;pointer-events:none;box-shadow:0 4px 10px rgba(73,104,126,.14)}
.co-chat-widget .co-ai-fab.co-ai-label-left  .co-ai-fab-name{right:calc(100% + 8px);left:auto}
.co-chat-widget .co-ai-fab.co-ai-label-right .co-ai-fab-name{left:calc(100% + 8px);right:auto}

/* حالت فعال وقتی پنل باز است */
.co-chat-widget .co-ai-fab.is-active .co-ai-fab-btn{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.18)}

/* ═══ پوشش پس‌زمینه (فقط موبایل) ═══ */
.co-chat .co-ai-mask{display:none;position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:2147483641;opacity:0;transition:opacity .3s}
.co-chat .co-ai-mask.is-open{opacity:1}
.co-chat .co-ai-mask[hidden]{display:none}

/* ═══ پنل گفتگو ═══ */
.co-chat .co-ai-panel{position:fixed;z-index:2147483642;display:flex;flex-direction:column;width:360px;max-width:calc(100vw - 32px);height:520px;max-height:calc(100vh - 150px);background:#fff;border:1px solid #e5e7eb;border-radius:16px;box-shadow:0 24px 48px rgba(15,23,42,.22);overflow:hidden;direction:rtl;opacity:0;transform:translateY(14px) scale(.97);transition:opacity .28s cubic-bezier(.34,1.3,.64,1),transform .28s cubic-bezier(.34,1.3,.64,1)}
.co-chat .co-ai-panel[hidden]{display:none}
.co-chat .co-ai-panel.is-open{opacity:1;transform:translateY(0) scale(1)}

/* هم‌راستا با دکمه شناور — همان متغیرهای آفست FAB */
.co-chat .co-ai-panel.co-ai-pos-right{right:var(--co-fab-x-d,25px);left:auto;bottom:calc(var(--co-fab-y-d, 25px) + var(--co-sticky-h,0px) + var(--co-fab-size-d,51px) + 18px)}
.co-chat .co-ai-panel.co-ai-pos-left{left:var(--co-fab-x-d,25px);right:auto;bottom:calc(var(--co-fab-y-d, 25px) + var(--co-sticky-h,0px) + var(--co-fab-size-d,51px) + 18px)}

/* ── سربرگ ── */
.co-chat .co-ai-head{display:flex;align-items:center;gap:9px;padding:12px 14px;border-bottom:1px solid #eef2f7;background:#fafbfc;flex:0 0 auto}
.co-chat .co-ai-head-icon{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;overflow:hidden;background:#eef2ff;color:#4f46e5;flex:0 0 auto}
.co-chat .co-ai-head-icon img{width:100%;height:100%;object-fit:cover;display:block}
.co-chat .co-ai-head-title{flex:1 1 auto;font-size:14px;font-weight:700;color:#0f172a;line-height:1.4}
.co-chat .co-ai-close{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;background:transparent;color:#64748b;cursor:pointer;flex:0 0 auto;transition:background .2s,color .2s}
.co-chat .co-ai-close:hover{background:#eef2f7;color:#0f172a}

/* ── بدنه پیام‌ها ── */
.co-chat .co-ai-body{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:14px;background:#fff}
.co-chat .co-ai-msg{margin-bottom:12px;display:flex}
.co-chat .co-ai-msg.is-user{justify-content:flex-start}
.co-chat .co-ai-msg.is-bot{justify-content:flex-end}
.co-chat .co-ai-bubble{max-width:88%;padding:10px 13px;border-radius:13px;font-size:13px;line-height:1.85;white-space:pre-wrap;word-break:break-word;text-align:right}
.co-chat .co-ai-msg.is-bot  .co-ai-bubble{background:#f1f5f9;color:#0f172a;border-top-right-radius:4px}
.co-chat .co-ai-msg.is-user .co-ai-bubble{background:#6366f1;color:#fff;border-top-left-radius:4px}

/* ── دکمه‌های تمام‌عرض لینک ── */
.co-chat .co-ai-links{width:100%;margin-top:2px}
.co-chat .co-ai-link{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;box-sizing:border-box;padding:12px 14px;margin-top:8px;border-radius:11px;font-size:13px;font-weight:700;line-height:1.6;text-align:center;text-decoration:none;transition:filter .2s,transform .15s}
.co-chat .co-ai-link:hover{filter:brightness(1.08);transform:translateY(-1px)}
.co-chat .co-ai-link.is-p{background:#16a34a;color:#fff}   /* محصول */
.co-chat .co-ai-link.is-a{background:#0f172a;color:#fff}   /* مقاله */
.co-chat .co-ai-link svg{flex:0 0 auto}
.co-chat .co-ai-link-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}

/* ── نشانگر در حال تایپ ── */
.co-chat .co-ai-typing{display:flex;gap:4px;align-items:center;padding:12px 14px}
.co-chat .co-ai-typing i{width:6px;height:6px;border-radius:50%;background:#94a3b8;display:block;animation:coAiDot 1.2s infinite ease-in-out}
.co-chat .co-ai-typing i:nth-child(2){animation-delay:.18s}
.co-chat .co-ai-typing i:nth-child(3){animation-delay:.36s}
@keyframes coAiDot{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

/* ── فرم ورودی ── */
.co-chat .co-ai-form{display:flex;align-items:center;gap:8px;padding:10px 12px;border-top:1px solid #eef2f7;background:#fafbfc;flex:0 0 auto}
.co-chat .co-ai-input{flex:1 1 auto;min-width:0;height:40px;padding:0 13px;border:1px solid #e2e8f0;border-radius:10px;background:#fff;color:#0f172a;font-size:13px;line-height:1.6;font-family:inherit;outline:0;box-shadow:none;transition:border-color .2s}
.co-chat .co-ai-input:focus{border-color:#6366f1}
.co-chat .co-ai-input::placeholder{color:#94a3b8}
.co-chat .co-ai-send{display:flex;align-items:center;justify-content:center;width:40px;height:40px;flex:0 0 auto;border-radius:10px;background:#6366f1;color:#fff;cursor:pointer;transition:filter .2s}
.co-chat .co-ai-send:hover{filter:brightness(1.08)}
.co-chat .co-ai-send[disabled]{opacity:.5;cursor:default}
.co-chat .co-ai-send svg{transform:scaleX(-1)}

/* ═══ موبایل — باتم‌شیت ═══ */
@media(max-width:767px){
    .co-chat-widget .co-ai-fab{bottom:calc(100% + var(--co-ai-gap-m,10px))}
    .co-chat-widget .co-ai-fab-btn{width:var(--co-ai-size-m,40px);height:var(--co-ai-size-m,40px)}
    .co-chat-widget .co-ai-fab-name{font-size:11px;padding:6px 9px}

    .co-chat .co-ai-mask{display:block}

    .co-chat .co-ai-panel,
    .co-chat .co-ai-panel.co-ai-pos-right,
    .co-chat .co-ai-panel.co-ai-pos-left{left:0;right:0;bottom:0;top:auto;width:auto;max-width:none;height:84vh;height:84dvh;max-height:none;border-radius:18px 18px 0 0;border-width:1px 0 0;transform:translateY(100%);transition:transform .3s cubic-bezier(.32,.72,0,1),opacity .2s}
    .co-chat .co-ai-panel.is-open{transform:translateY(0)}

    .co-chat .co-ai-bubble{max-width:92%;font-size:13px}
    .co-chat .co-ai-form{padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
}

/* دستگاه‌هایی که کاربر انیمیشن کمتر خواسته */
@media(prefers-reduced-motion:reduce){
    .co-chat .co-ai-panel,.co-chat .co-ai-mask,.co-chat-widget .co-ai-fab,.co-chat .co-ai-link{transition:none}
    .co-chat .co-ai-typing i{animation:none}
}

@font-face{font-family:Fonito;src:url('../fonts/fonito.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
.co-chat .co-ai-panel,.co-chat .co-ai-panel *,.co-chat .co-ai-fab-name{font-family:Fonito,Tahoma,sans-serif}
.co-chat .co-ai-rich{white-space:normal}
.co-chat .co-ai-rich p,.co-chat .co-ai-rich div{margin:0 0 10px;line-height:1.85}
.co-chat .co-ai-rich h1,.co-chat .co-ai-rich h2,.co-chat .co-ai-rich h3,.co-chat .co-ai-rich h4,.co-chat .co-ai-rich h5,.co-chat .co-ai-rich h6{margin:12px 0 8px;font-size:1.05em;font-weight:700;line-height:1.7;color:inherit}
.co-chat .co-ai-rich ul,.co-chat .co-ai-rich ol{margin:8px 0;padding-inline-start:22px;line-height:1.85}
.co-chat .co-ai-rich ul{list-style:disc}
.co-chat .co-ai-rich ol{list-style:decimal}
.co-chat .co-ai-rich li{display:list-item;margin:4px 0;line-height:1.85}
.co-chat .co-ai-rich ul>li{list-style-type:disc}
.co-chat .co-ai-rich ol>li{list-style-type:decimal}
.co-chat .co-ai-rich strong,.co-chat .co-ai-rich b{font-weight:700;line-height:inherit}
.co-chat .co-ai-rich em,.co-chat .co-ai-rich i{font-style:italic;line-height:inherit}
