.otfh,.otfh *{box-sizing:border-box}
.otfh{font-family:inherit;direction:rtl;text-align:right;-webkit-text-size-adjust:100%}

/* دکمه شناور: همیشه پایین گوشه، ثابت */
.otfh-fab{position:fixed;z-index:100001;bottom:calc(var(--otfh-bottom,20px) + env(safe-area-inset-bottom,0px));width:var(--otfh-size,58px);height:var(--otfh-size,58px);margin:0;padding:0;border:0;border-radius:50%;background:var(--otfh-color,#0d1b38);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:calc(var(--otfh-size,58px)*.42);line-height:1;box-shadow:0 8px 24px rgba(0,0,0,.28);transition:box-shadow .2s,transform .15s}
.otfh-side-right .otfh-fab{right:18px;left:auto}
.otfh-side-left .otfh-fab{left:18px;right:auto}
.otfh-fab:hover{box-shadow:0 10px 28px rgba(0,0,0,.36)}
.otfh-fab:active{transform:scale(.95)}
.otfh-fab:focus-visible{outline:3px solid rgba(59,111,212,.6);outline-offset:3px}
.otfh-pulse .otfh-fab:not(.is-open):after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--otfh-color,#0d1b38);animation:otfhpulse 2.2s infinite;pointer-events:none}
@keyframes otfhpulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.55);opacity:0}}

/* پنجره */
.otfh-panel{position:fixed;z-index:100000;width:380px;max-width:calc(100vw - 20px);bottom:calc(var(--otfh-bottom,20px) + var(--otfh-size,58px) + 14px + env(safe-area-inset-bottom,0px));max-height:calc(100vh - var(--otfh-bottom,20px) - var(--otfh-size,58px) - 40px);display:flex;flex-direction:column;background:var(--otf-card-bg,#fff);color:var(--otf-card-text,#1f2937);border-radius:22px;box-shadow:0 18px 50px rgba(0,0,0,.28);border:1px solid rgba(128,128,128,.18);overflow:hidden;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(14px) scale(.97);transform-origin:bottom right;transition:opacity .22s,transform .22s,visibility .22s}
.otfh-side-right .otfh-panel{right:18px;left:auto}
.otfh-side-left .otfh-panel{left:18px;right:auto;transform-origin:bottom left}
@supports (height:100dvh){.otfh-panel{max-height:calc(100dvh - var(--otfh-bottom,20px) - var(--otfh-size,58px) - 40px)}}
.otfh-panel.otfh-open{opacity:1;visibility:visible;pointer-events:auto;transform:none}

.otfh-head{display:flex;align-items:center;gap:8px;padding:14px 16px;background:var(--otfh-color,#0d1b38);color:#fff;flex:0 0 auto}
.otfh-head-text{flex:1;min-width:0}
.otfh-title{font-weight:800;font-size:16px;line-height:1.5}
.otfh-sub{font-size:12px;opacity:.8;line-height:1.5}
.otfh-back,.otfh-x{flex:0 0 auto;width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.18);color:#fff;cursor:pointer;font-size:15px;line-height:1;padding:0}
.otfh-back:hover,.otfh-x:hover{background:rgba(255,255,255,.3)}
.otfh-body{padding:16px;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.otfh-view[hidden]{display:none!important}

/* کاشی‌های مربعی */
.otfh-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.otfh-tile{aspect-ratio:4/3;margin:0;padding:8px 4px;border:0;border-radius:20px;background:var(--c,#0d1b38);color:#fff;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font-family:inherit;box-shadow:0 4px 12px rgba(0,0,0,.14);transition:transform .15s,box-shadow .15s}
.otfh-tile:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(0,0,0,.22)}
.otfh-tile:active{transform:scale(.97)}
.otfh-tile-ico{font-size:34px;line-height:1}
.otfh-tile-label{font-size:13.5px;font-weight:700;line-height:1.4;text-align:center;overflow-wrap:anywhere}

/* داخل ماژول‌ها */
.otfh-intro{margin:0 0 12px;font-size:13px;line-height:1.9;opacity:.85}
.otfh-form{display:flex;flex-direction:column;gap:10px;margin:0}
.otfh-field{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:600}
.otfh-field input,.otfh-field textarea{width:100%;margin:0;padding:10px 12px;border-radius:var(--otf-radius,12px);border:1.5px solid rgba(128,128,128,.35);background:var(--otf-input-bg,#f9fafb);color:var(--otf-input-text,#111);font-size:16px;font-family:inherit;outline:0;box-shadow:none}
.otfh-field input{height:var(--otf-field-h,44px)}
.otfh-field input[type=tel]{direction:ltr;text-align:right}
.otfh-field textarea{resize:vertical;min-height:80px}
.otfh-field input:focus,.otfh-field textarea:focus{border-color:var(--otfh-vc,#0d1b38)}
.otfh-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}
.otfh-submit{height:var(--otf-field-h,44px);margin:0;border:0;border-radius:var(--otf-radius,12px);background:var(--otfh-vc,#0d1b38);color:#fff;font-weight:700;font-size:14px;cursor:pointer;font-family:inherit}
.otfh-submit:disabled{opacity:.6;cursor:wait}
.otfh-msg{padding:10px 12px;border-radius:10px;font-size:13px;line-height:1.8}
.otfh-msg.ok{background:rgba(34,197,94,.14);color:#15803d;border:1px solid rgba(34,197,94,.4)}
.otfh-msg.bad{background:var(--otf-err-bg,#fff1f2);color:var(--otf-err-text,#be123c);border:1px solid var(--otf-err-text,#be123c)}

.otfh-links{display:flex;flex-direction:column;gap:8px}
.otfh-link{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:rgba(128,128,128,.1);color:inherit;text-decoration:none;font-weight:700;font-size:14px;border:1px solid transparent;transition:border-color .15s,background .15s}
.otfh-link:hover{border-color:var(--otfh-vc,#16a34a);background:rgba(128,128,128,.16);color:inherit}
.otfh-link-ico{width:38px;height:38px;border-radius:50%;background:var(--otfh-vc,#16a34a);display:flex;align-items:center;justify-content:center;font-size:18px;flex:0 0 auto}

.otfh-faq{border:1px solid rgba(128,128,128,.25);border-radius:12px;margin-bottom:8px;overflow:hidden}
.otfh-faq summary{padding:11px 14px;font-weight:700;font-size:13.5px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:8px}
.otfh-faq summary::-webkit-details-marker{display:none}
.otfh-faq summary:after{content:"+";font-size:18px;line-height:1;color:var(--otfh-vc,#7c3aed)}
.otfh-faq[open] summary:after{content:"−"}
.otfh-faq p{margin:0;padding:0 14px 12px;font-size:13px;line-height:1.9;opacity:.85}

/* رهگیری داخل پنجره */
.otfh-track.otf-box{max-width:none;--ico:calc(var(--otf-ico,46px)*.8)}
.otfh-track .otf-label{display:none}
.otfh-track .otf-form{flex-direction:column;align-items:stretch;gap:10px}
.otfh-track .otf-input{flex:none;width:100%}
.otfh-track .otf-btn{width:100%}
.otfh-track .otf-btn{background:var(--otfh-vc,#0d1b38)!important;color:#fff!important}
.otfh-track .otf-result{box-shadow:none;margin:0 0 12px;padding:14px 12px}
.otfh-track .otf-step{font-size:10.5px}

/* نمایش بر اساس دستگاه */
.otfh-dev-desktop{display:none}
@media(min-width:601px){.otfh-dev-desktop{display:block}.otfh-dev-mobile{display:none}}

@media(max-width:600px){
.otfh-side-right .otfh-panel,.otfh-side-left .otfh-panel{left:10px;right:10px;width:auto;max-width:none;border-radius:20px}
.otfh-tile-ico{font-size:30px}
}
@media(max-width:340px){.otfh-grid{gap:8px}.otfh-tile-label{font-size:11.5px}}
@media(prefers-reduced-motion:reduce){.otfh-fab,.otfh-panel,.otfh-tile{transition:none}.otfh-pulse .otfh-fab:after{animation:none}}

/* ---------- گفتگوی زنده ---------- */
.otfh-fab{overflow:visible}
.otfh-badge{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#e11d48;color:#fff;font-size:11px;font-weight:800;line-height:20px;text-align:center;box-shadow:0 2px 6px rgba(0,0,0,.3)}
.otfh-badge[hidden]{display:none}
.otfh-av{flex:0 0 auto;width:42px;height:42px;border-radius:50%;object-fit:cover;background:rgba(255,255,255,.25);border:2px solid rgba(255,255,255,.55)}
.otfh-av[hidden]{display:none}

.otfh-chat .otfh-pre[hidden],.otfh-chat .otfh-conv[hidden]{display:none!important}
.otfh-pre{display:flex;flex-direction:column;gap:10px;margin:0}
.otfh-conv{display:flex;flex-direction:column;gap:8px;margin:-4px -4px 0}
.otfh-msgs{display:flex;flex-direction:column;gap:8px;height:min(340px,50vh);overflow-y:auto;padding:10px 8px;border-radius:14px;background:rgba(128,128,128,.08);overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.otfh-b{max-width:82%;padding:8px 12px 5px;border-radius:16px;font-size:14px;line-height:1.8;overflow-wrap:anywhere;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.otfh-b-t{white-space:pre-wrap}
.otfh-b-time{margin-top:1px;font-size:10.5px;opacity:.6;text-align:left}
.otfh-b-agent{align-self:flex-start;background:#fff;color:#1f2937;border-top-right-radius:4px}
.otfh-b-me{align-self:flex-end;background:var(--otfh-vc,#0891b2);color:#fff;border-top-left-radius:4px}
.otfh-send{display:flex;align-items:flex-end;gap:8px;margin:0}
.otfh-send textarea{flex:1;min-width:0;margin:0;padding:10px 12px;max-height:96px;resize:none;border-radius:var(--otf-radius,12px);border:1.5px solid rgba(128,128,128,.35);background:var(--otf-input-bg,#f9fafb);color:var(--otf-input-text,#111);font-size:16px;line-height:1.6;font-family:inherit;outline:0;box-shadow:none}
.otfh-send textarea:focus{border-color:var(--otfh-vc,#0891b2)}
.otfh-send-btn{flex:0 0 auto;width:44px;height:44px;margin:0;padding:0;border:0;border-radius:50%;background:var(--otfh-vc,#0891b2);color:#fff;font-size:16px;cursor:pointer;transform:scaleX(-1)}
.otfh-send-btn:disabled{opacity:.55;cursor:wait}
@media(max-width:600px){.otfh-msgs{height:min(320px,46vh)}}

/* ---------- فوتر سیپکو ---------- */
.otfh-credit{margin-top:14px;text-align:center;font-size:12px;line-height:1.8;opacity:.75}
.otfh-credit a{color:inherit;font-weight:700;text-decoration:none;border-bottom:1px dashed currentColor}
.otfh-credit a:hover{opacity:.8}

/* ---------- پیوست‌ها و آواتار در گفتگو ---------- */
.otfh-r{display:flex;align-items:flex-end;gap:6px;align-self:flex-start;max-width:92%}
.otfh-r .otfh-b{align-self:auto;max-width:none;min-width:0}
.otfh-r-av{flex:0 0 auto;width:28px;height:28px;border-radius:50%;object-fit:cover;background:rgba(128,128,128,.2)}
.otfh-b-img{display:block;margin:0 -4px 4px;border-radius:10px;overflow:hidden;line-height:0}
.otfh-b-img img{display:block;max-width:100%;width:220px;max-height:240px;object-fit:cover;border-radius:10px}
.otfh-b-file{display:block;margin-bottom:4px;padding:8px 10px;border-radius:10px;background:rgba(128,128,128,.16);color:inherit;text-decoration:none;font-size:13px;line-height:1.6;overflow-wrap:anywhere}
.otfh-b-me .otfh-b-file{background:rgba(255,255,255,.22)}
.otfh-attach{flex:0 0 auto;width:44px;height:44px;margin:0;padding:0;border:0;border-radius:50%;background:rgba(128,128,128,.14);color:inherit;font-size:19px;line-height:1;cursor:pointer}
.otfh-attach:hover{background:rgba(128,128,128,.24)}
.otfh-file{display:none!important}
.otfh-up{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 10px;border-radius:10px;background:rgba(128,128,128,.12);font-size:12.5px}
.otfh-up[hidden]{display:none}
.otfh-up-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.otfh-up-x{flex:0 0 auto;width:24px;height:24px;margin:0;padding:0;border:0;border-radius:50%;background:rgba(128,128,128,.25);color:inherit;cursor:pointer;font-size:11px;line-height:1}

/* ---------- موبایل: گفتگو تمام‌صفحه و سازگار با کیبورد ---------- */
html.otfh-lock,html.otfh-lock body{overflow:hidden!important}
.otfh-panel.otfh-full{top:0;bottom:auto!important;left:0!important;right:0!important;width:100%!important;max-width:none!important;height:100vh;max-height:none!important;border-radius:0;border:0;transform:none!important}
@supports (height:100dvh){.otfh-panel.otfh-full{height:100dvh}}
.otfh-full .otfh-head{padding-top:calc(14px + env(safe-area-inset-top,0px))}
.otfh-full .otfh-body{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;padding:12px 12px calc(12px + env(safe-area-inset-bottom,0px))}
.otfh-full .otfh-chat{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
.otfh-full .otfh-conv{flex:1 1 auto;min-height:0;margin:0}
.otfh-full .otfh-msgs{flex:1 1 auto;height:auto;min-height:0}
.otfh-full .otfh-pre{overflow-y:auto}
.otfh-fullmode .otfh-fab{display:none}

@media(max-width:600px){
.otfh-side-right .otfh-fab{right:max(14px,env(safe-area-inset-right,0px))}
.otfh-side-left .otfh-fab{left:max(14px,env(safe-area-inset-left,0px))}
.otfh-side-right .otfh-panel,.otfh-side-left .otfh-panel{left:max(8px,env(safe-area-inset-left,0px));right:max(8px,env(safe-area-inset-right,0px))}
.otfh-body{padding:14px}
.otfh-b{max-width:88%}
.otfh-b-img img{width:min(220px,60vw)}
.otfh-head{padding:12px 14px}
.otfh-title{font-size:15px}
}
@media(max-width:380px){
.otfh-grid{gap:10px}
.otfh-tile{border-radius:18px;padding:6px 2px}
.otfh-tile-ico{font-size:28px}
.otfh-tile-label{font-size:12.5px}
.otfh-credit{font-size:11.5px}
.otfh-attach,.otfh-send-btn{width:40px;height:40px}
}
@media(max-height:480px) and (orientation:landscape){
.otfh-tile{aspect-ratio:auto;min-height:72px}
}

/* ---------- یکسان‌سازی ظاهر در همه سیستم‌ها و قالب‌ها ---------- */
.otfh .otfh-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.otfh .otfh-tile,.otfh .otfh-tile:hover,.otfh .otfh-tile:focus,.otfh .otfh-tile:active{background:var(--c,#0d1b38)!important;color:#fff!important}
.otfh .otfh-tile{aspect-ratio:auto;height:108px;min-height:108px;width:100%;min-width:0;max-width:none;margin:0;padding:10px 6px;border:0;-webkit-appearance:none;appearance:none;text-transform:none;letter-spacing:normal;text-shadow:none;font-family:inherit;font-size:14px;line-height:1.3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
.otfh .otfh-tile-ico{display:flex;align-items:center;justify-content:center;width:40px;height:40px;flex:0 0 40px;font-size:34px;line-height:1}
.otfh .otfh-tile-ico .otf-svg{width:36px;height:36px;vertical-align:baseline}
.otfh .otfh-tile-ico .otf-emoji{font-size:32px}
.otfh .otfh-tile-label{display:block;max-width:100%;font-size:13.5px;font-weight:700;line-height:1.4}

.otfh .otfh-fab,.otfh .otfh-fab:hover,.otfh .otfh-fab:focus,.otfh .otfh-fab:active{background:var(--otfh-color,#0d1b38)!important;color:#fff!important}
.otfh .otfh-fab-open{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.otfh .otfh-fab .otf-svg{width:46%;height:46%;vertical-align:baseline}
.otfh .otfh-fab .otf-emoji{font-size:calc(var(--otfh-size,58px)*.42)}

.otfh .otfh-link-ico{color:#fff;font-size:18px;line-height:1}
.otfh .otfh-link-ico .otf-svg{width:20px;height:20px;vertical-align:baseline}

.otfh .otfh-back,.otfh .otfh-x,.otfh .otfh-attach,.otfh .otfh-send-btn,.otfh .otfh-up-x{display:flex;align-items:center;justify-content:center}
.otfh .otfh-back .otf-svg,.otfh .otfh-x .otf-svg{width:18px;height:18px;vertical-align:baseline}
.otfh .otfh-attach .otf-svg,.otfh .otfh-send-btn .otf-svg{width:20px;height:20px;vertical-align:baseline}
.otfh .otfh-up-x .otf-svg{width:12px;height:12px;vertical-align:baseline}
.otfh .otfh-b-file .otf-svg{width:1.1em;height:1.1em;margin-left:3px}

@media(max-width:600px){
.otfh .otfh-tile{height:96px;min-height:96px}
.otfh .otfh-tile-ico .otf-svg{width:32px;height:32px}
}
@media(max-width:340px){.otfh .otfh-tile{height:88px;min-height:88px}}
