/**
 * Pargas Platform — Chatbot widget
 * Floating assistant (FAB + panel), teaser bubble, canned Q&A,
 * quick replies and typing indicator. Preview-safe (no backend).
 */

/* ===== FAB ===== */
.pg-cbot__fab {
        position: fixed;
        bottom: 22px;
        inset-inline-start: 22px;
        z-index: calc(var(--pg-z-modal) - 1);
        width: 58px;
        height: 58px;
        border-radius: 50%;
        border: 0;
        cursor: pointer;
        background: var(--pg-grad-warm);
        color: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-shadow: var(--pg-shadow-btn-accent), 0 0 0 0 rgba(234, 88, 12, 0.4);
        animation: pg-cbot-ring 2.6s ease-out infinite;
        transition: transform var(--pg-dur) var(--pg-ease);
}
.pg-cbot__fab:hover { transform: scale(1.07); }
.pg-cbot__fab .pg-cbot__fab-wave { transform-box: fill-box; transform-origin: center; animation: pg-cbot-wave 2.4s ease-in-out infinite; }
@keyframes pg-cbot-wave { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-1.5px); } }
@keyframes pg-cbot-ring {
        0% { box-shadow: var(--pg-shadow-btn-accent), 0 0 0 0 rgba(234, 88, 12, 0.35); }
        70% { box-shadow: var(--pg-shadow-btn-accent), 0 0 0 16px rgba(234, 88, 12, 0); }
        100% { box-shadow: var(--pg-shadow-btn-accent), 0 0 0 0 rgba(234, 88, 12, 0); }
}
.pg-cbot__dot {
        position: absolute;
        top: -2px;
        inset-inline-end: -2px;
        min-width: 19px;
        height: 19px;
        border-radius: var(--pg-round);
        background: var(--pg-primary);
        color: #fff;
        font-size: 0.625rem;
        font-weight: 900;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 2px solid #fff;
}
.pg-cbot.is-open .pg-cbot__dot { display: none; }

/* ===== teaser bubble ===== */
.pg-cbot__teaser {
        position: fixed;
        bottom: 92px;
        inset-inline-start: 22px;
        z-index: calc(var(--pg-z-modal) - 1);
        max-width: 250px;
        background: var(--pg-surface);
        border: 1px solid var(--pg-border);
        border-radius: 14px 14px 4px 14px;
        padding: 12px 16px;
        font-size: 0.75rem;
        font-weight: 600;
        line-height: 1.9;
        color: var(--pg-fg);
        box-shadow: var(--pg-shadow-pop);
        animation: pg-cbot-in 0.4s var(--pg-ease);
}

/* ===== panel ===== */
.pg-cbot__panel {
        position: fixed;
        bottom: 92px;
        inset-inline-start: 22px;
        z-index: var(--pg-z-modal);
        width: min(370px, calc(100vw - 32px));
        height: min(540px, calc(100vh - 140px));
        background: var(--pg-surface);
        border: 1px solid var(--pg-border);
        border-radius: var(--pg-radius-xl);
        box-shadow: var(--pg-shadow-pop);
        display: flex;
        flex-direction: column;
        overflow: hidden;
        opacity: 0;
        translate: 0 14px;
        scale: 0.98;
        pointer-events: none;
        transition: all 0.28s var(--pg-ease);
}
.pg-cbot.is-open .pg-cbot__panel { opacity: 1; translate: 0 0; scale: 1; pointer-events: auto; }
.pg-cbot.is-open .pg-cbot__teaser { display: none; }

.pg-cbot__head {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 14px 16px;
        background: var(--pg-grad-cool);
        color: #fff;
}
.pg-cbot__avatar {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.16);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: none;
}
.pg-cbot__avatar svg { width: 22px; height: 22px; }
.pg-cbot__meta { flex: 1; min-width: 0; }
.pg-cbot__meta b { display: block; font-size: 0.8125rem; font-weight: 900; }
.pg-cbot__meta span { font-size: 0.6875rem; color: rgba(255, 255, 255, 0.75); display: inline-flex; align-items: center; gap: 5px; }
.pg-cbot__meta i { width: 7px; height: 7px; border-radius: 50%; background: #4ADE80; display: inline-block; animation: pg-ci-blink 2.4s ease-in-out infinite; }
.pg-cbot__close { background: rgba(255, 255, 255, 0.14); border: 0; color: #fff; width: 30px; height: 30px; border-radius: var(--pg-round); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.pg-cbot__close .pg-ico { width: 15px; height: 15px; }

.pg-cbot__msgs { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; background: var(--pg-bg); }
.pg-cbot__msg {
        max-width: 84%;
        padding: 10px 14px;
        font-size: 0.8125rem;
        line-height: 1.9;
        border-radius: 14px;
        animation: pg-cbot-in 0.3s var(--pg-ease);
}
.pg-cbot__msg--bot { background: var(--pg-surface); border: 1px solid var(--pg-border); color: var(--pg-fg); border-start-end-radius: 4px; align-self: flex-start; }
.pg-cbot__msg--user { background: var(--pg-primary); color: #fff; border-start-start-radius: 4px; align-self: flex-end; }
.pg-cbot__msg a { color: var(--pg-primary); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.pg-cbot__msg--bot a { color: var(--pg-primary-strong); }
.pg-cbot__msg--user a { color: #fff; }

.pg-cbot__typing { display: inline-flex; gap: 4px; padding: 12px 14px; align-self: flex-start; background: var(--pg-surface); border: 1px solid var(--pg-border); border-radius: 14px 14px 4px 14px; }
.pg-cbot__typing i { width: 6px; height: 6px; border-radius: 50%; background: var(--pg-fg-soft); animation: pg-cbot-typing 1s ease-in-out infinite; }
.pg-cbot__typing i:nth-child(2) { animation-delay: 0.18s; }
.pg-cbot__typing i:nth-child(3) { animation-delay: 0.36s; }
@keyframes pg-cbot-typing { 0%, 100% { opacity: 0.25; translate: 0 0; } 50% { opacity: 1; translate: 0 -3px; } }

.pg-cbot__chips { display: flex; gap: 6px; overflow-x: auto; padding: 10px 14px 4px; background: var(--pg-bg); scrollbar-width: none; }
.pg-cbot__chips::-webkit-scrollbar { display: none; }
.pg-cbot__chip {
        flex: none;
        background: var(--pg-surface);
        border: 1px solid var(--pg-border);
        color: var(--pg-primary-strong);
        font-size: 0.71875rem;
        font-weight: 700;
        border-radius: var(--pg-round);
        padding: 6px 13px;
        cursor: pointer;
        transition: all var(--pg-dur) var(--pg-ease);
}
.pg-cbot__chip:hover { background: var(--pg-primary); border-color: var(--pg-primary); color: #fff; }

.pg-cbot__form { display: flex; gap: 8px; padding: 12px 14px 14px; background: var(--pg-bg); border-top: 1px solid var(--pg-border); }
.pg-cbot__input {
        flex: 1;
        height: 44px;
        border-radius: var(--pg-round);
        border: 1px solid var(--pg-input);
        background: var(--pg-surface);
        padding: 0 16px;
        font-size: 0.8125rem;
        font-family: var(--pg-font);
}
.pg-cbot__input:focus { outline: none; border-color: var(--pg-ring); box-shadow: 0 0 0 3px rgba(8, 145, 178, 0.14); }
.pg-cbot__send {
        width: 44px;
        height: 44px;
        border-radius: 50%;
        border: 0;
        background: var(--pg-accent);
        color: var(--pg-accent-ink);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        flex: none;
        transition: background var(--pg-dur) var(--pg-ease);
}
.pg-cbot__send:hover { background: var(--pg-accent-strong); color: #fff; }
.pg-cbot__send .pg-ico { width: 18px; height: 18px; }

@keyframes pg-cbot-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ===== v1.2.0 — جهت ویجت (پنل هسته: chatbot.position) ===== */
/* راست = پیش‌فرض کیت (inset-inline-start در RTL)؛ چپ = آینه همان مقادیر. */
.pg-cbot--left .pg-cbot__fab,
.pg-cbot--left .pg-cbot__teaser,
.pg-cbot--left .pg-cbot__panel { inset-inline-start: auto; inset-inline-end: 22px; }
.pg-cbot--left .pg-cbot__dot { inset-inline-end: auto; inset-inline-start: -2px; }

/* mobile: keep above bottom nav */
@media (max-width: 1023px) {
        .pg-cbot__fab { bottom: calc(74px + env(safe-area-inset-bottom, 0px)); inset-inline-start: 14px; width: 52px; height: 52px; }
        .pg-cbot__panel, .pg-cbot__teaser { bottom: calc(134px + env(safe-area-inset-bottom, 0px)); inset-inline-start: 12px; }
        .pg-cbot--left .pg-cbot__fab,
        .pg-cbot--left .pg-cbot__teaser,
        .pg-cbot--left .pg-cbot__panel { inset-inline-start: auto; inset-inline-end: 14px; }
        .pg-cbot--left .pg-cbot__panel { inset-inline-end: 12px; }
}
@media (prefers-reduced-motion: reduce) {
        .pg-cbot__fab, .pg-cbot__fab .pg-cbot__fab-wave, .pg-cbot__meta i { animation: none !important; }
        .pg-cbot__msg, .pg-cbot__teaser { animation: none !important; }
}
