#chat-fab{position:fixed;inset-inline-end:24px;inset-block-end:24px;width:56px;height:56px;border-radius:999px;background:#2563eb;color:#fff;border:0;display:flex;align-items:center;justify-content:center;box-shadow:0 18px 40px rgba(37,99,235,.32);cursor:pointer;font-size:24px;z-index:9999;transition:transform .2s ease,box-shadow .2s ease}
#chat-fab:hover{transform:translateY(-2px);box-shadow:0 26px 50px rgba(37,99,235,.45)}
#chat-modal{position:fixed;inset-inline-end:24px;inset-block-end:92px;width:min(360px,90vw);height:480px;background:#fff;border-radius:22px;box-shadow:0 24px 60px rgba(15,23,42,.22);border:1px solid rgba(148,163,184,.22);display:none;flex-direction:column;overflow:hidden;z-index:9999;font-family:"Vazirmatn","IRANSans","Segoe UI",sans-serif}
#chat-modal.open{display:flex}
#chat-header{background:linear-gradient(135deg,rgba(37,99,235,.92),rgba(14,165,233,.92));color:#fff;padding:18px 20px;display:flex;flex-direction:column;gap:4px}
#chat-header .top-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
#chat-header h2{margin:0;font-size:18px}
#chat-status{font-size:12px;opacity:.9}
#chat-status.ok{color:#bbf7d0}
#chat-status.error{color:#fecaca}
#chat-close{background:rgba(15,23,42,.18);color:#fff;border:0;border-radius:12px;width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s ease}
#chat-close:hover{background:rgba(15,23,42,.3)}
#chat-log{flex:1;padding:18px 20px;background:linear-gradient(180deg,#f8fafc 0%,#eef2ff 100%);overflow-y:auto;display:flex;flex-direction:column;gap:10px}
.chat-bubble{max-width:78%;padding:10px 14px;border-radius:18px;background:#fff;box-shadow:0 16px 32px rgba(15,23,42,.12);font-size:13px;line-height:1.6;color:#1f2937}
.chat-bubble.agent{margin-inline-start:auto;background:rgba(37,99,235,.14);color:#1d4ed8;border-bottom-left-radius:6px}
.chat-bubble.customer{margin-inline-end:auto;border-bottom-right-radius:6px}
.chat-bubble .meta{display:block;font-size:10px;opacity:.55;margin-top:6px}
#chat-input{padding:16px 18px 18px;background:#fff;border-top:1px solid #e2e8f0;display:flex;flex-direction:column;gap:10px}
#chat-msg{width:100%;min-height:70px;max-height:160px;border-radius:18px;border:1px solid #e2e8f0;padding:12px 14px;resize:vertical;font-family:inherit;font-size:13px;line-height:1.6;transition:border .2s ease,box-shadow .2s ease}
#chat-msg:focus{outline:none;border-color:rgba(37,99,235,.5);box-shadow:0 0 0 3px rgba(37,99,235,.18)}
#chat-send{border:0;background:#2563eb;color:#fff;padding:10px;border-radius:14px;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,opacity .2s ease}
#chat-send:disabled{opacity:.6;cursor:not-allowed;box-shadow:none}
#chat-send:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 16px 30px rgba(37,99,235,.28)}
#chat-hint{font-size:11px;color:#64748b;text-align:center}
@media (max-width:600px){#chat-modal{inset-inline-end:12px;inset-block-end:88px;width:min(92vw,360px);height:440px}#chat-fab{inset-inline-end:16px;inset-block-end:16px}}