@font-face{font-family:AppFont;src:local("Vazirmatn"),local("Vazir"),local("IRANSans"),local("Tahoma")}
:root{
--bg:#fbfdff;
--panel:#ffffff;
--text:#162033;
--muted:#6f7b8d;
--line:#e3ebf4;
--line-2:#cdd9e8;
--user-bg:linear-gradient(135deg,#d7ecff 0%,#c7e2ff 100%);
--user-text:#0d315a;
--ai-bg:linear-gradient(135deg,#fbf8ff 0%,#f2eefc 100%);
--ai-text:#1f2937;
--accent:#1f6fb2;
--accent-2:#31a9c9;
--accent-soft:#eef7ff;
--danger:#b42318;
--shadow:0 18px 50px rgba(31,111,178,.10);
--radius:18px;
--code-bg:#101828;
--code-head:#182230;
--code-text:#f9fafb;
--safe-bottom:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--bg);color:var(--text);font-family:AppFont,Tahoma,Arial,sans-serif;font-size:14px;overflow:hidden}
button,textarea,input,select{font:inherit}
button{cursor:pointer;-webkit-tap-highlight-color:transparent}
.app{height:100dvh;background:radial-gradient(circle at top,#f3f9ff 0,#fff 34%,#fff 100%);display:flex;justify-content:center}
.chat{width:min(1040px,100%);height:100dvh;display:grid;grid-template-rows:60px minmax(0,1fr) auto;background:transparent}
.chat-header{height:60px;border-bottom:1px solid rgba(213,225,238,.8);display:flex;align-items:center;justify-content:space-between;padding:0 28px;background:rgba(255,255,255,.88);backdrop-filter:blur(14px);z-index:5}
.brand{display:flex;align-items:center;gap:10px;min-width:0}
.brand-mark{width:30px;height:30px;border-radius:11px;background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 10px 22px rgba(31,111,178,.22);flex:0 0 auto}
.brand-text{min-width:0}
.brand-text h1{margin:0;font-size:14px;font-weight:900;color:#18324f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand-text p{margin:2px 0 0;font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.header-actions{display:flex;align-items:center;gap:7px;flex:0 0 auto}
.header-btn{height:32px;border:1px solid var(--line-2);background:#fff;color:#295073;border-radius:10px;padding:0 10px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;font-size:12px;transition:.15s}
.header-btn:hover{background:#f2f8ff;border-color:#b8d2ea}
.header-btn.danger{color:#a12323}
#themeToggle{display:none}

.chat-scroll{height:100%;overflow-y:auto;background:transparent;padding:28px 32px 18px;scroll-behavior:smooth}
.chat-scroll::-webkit-scrollbar{width:10px}
.chat-scroll::-webkit-scrollbar-track{background:transparent}
.chat-scroll::-webkit-scrollbar-thumb{background:#d5e0ec;border:3px solid #fff;border-radius:999px}

.msg{width:100%;display:flex;align-items:flex-start;margin:0 0 24px;gap:8px}
.msg.user{justify-content:flex-end;direction:rtl}
.msg.ai{justify-content:flex-start;direction:ltr}
.msg.user .msg-body{direction:rtl;align-items:flex-end}
.msg.ai .msg-body{direction:rtl;align-items:flex-start}
.msg-avatar{display:none}
.msg-body{max-width:min(660px,64%);display:flex;flex-direction:column}
.msg-bubble{position:relative;border:1px solid transparent;line-height:2.05;padding:13px 16px;white-space:normal;overflow-wrap:anywhere;word-break:break-word;box-shadow:0 8px 24px rgba(15,23,42,.035)}
.msg.user .msg-bubble{background:var(--user-bg);border-color:#b9dbfb;color:var(--user-text);border-radius:18px 6px 18px 18px;text-align:right}
.msg.ai .msg-bubble{background:var(--ai-bg);border-color:#eee8fb;color:var(--ai-text);border-radius:6px 18px 18px 18px;text-align:right}
.msg.error .msg-bubble{background:#fff5f5;border-color:#fecaca;color:var(--danger)}
.msg-bubble p{margin:0 0 10px}
.msg-bubble p:last-child{margin-bottom:0}
.msg-bubble ul,.msg-bubble ol{margin:7px 0;padding-right:22px}
.msg-bubble li{margin:3px 0}
.msg-bubble strong{font-weight:900;color:#14213a}
.msg-time{font-size:11px;color:#38618a;margin-top:5px;padding:0 4px}
.msg.ai .msg-time{color:#8a92a1}
.msg-actions{display:flex;gap:9px;margin-top:9px;color:#31527d;opacity:.9;direction:ltr}
.msg-actions button{border:0;background:transparent;color:inherit;padding:0;width:19px;height:19px;display:inline-flex;align-items:center;justify-content:center;border-radius:6px}
.msg-actions button:hover{background:#edf6ff}
.msg-actions svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8}

.sources{margin-top:12px;padding-top:9px;border-top:1px solid rgba(0,0,0,.08);font-size:12px;color:#6b7280}
.source-list{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.sources span{display:inline-flex;align-items:center;gap:6px;padding:3px 7px;border:1px solid #e2e8f0;border-radius:8px;background:#fff}
.sources small{font-size:11px;color:#6b7280}

.typing{display:inline-flex;align-items:center;gap:4px;height:18px}
.typing span{width:5px;height:5px;border-radius:50%;background:#6b8aad;animation:dot 1s infinite ease-in-out}
.typing span:nth-child(2){animation-delay:.12s}.typing span:nth-child(3){animation-delay:.24s}
@keyframes dot{0%,75%,100%{opacity:.3;transform:translateY(0)}35%{opacity:1;transform:translateY(-4px)}}

.code-card{margin:10px 0;border:1px solid #263241;background:var(--code-bg);color:var(--code-text);border-radius:11px;overflow:hidden;direction:ltr;text-align:left;max-width:100%}
.code-head{min-height:34px;padding:0 10px;background:var(--code-head);border-bottom:1px solid #263241;display:flex;align-items:center;justify-content:space-between}
.code-lang{color:#cbd5e1;font-family:Consolas,Monaco,"Courier New",monospace;font-size:12px}
.copy-code{height:25px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#e2e8f0;border-radius:6px;padding:0 8px;font-size:11px}
.code-card pre{margin:0;padding:13px 14px;overflow-x:auto;line-height:1.75}
.code-card code{font-family:Consolas,Monaco,"Courier New",monospace;font-size:13px;white-space:pre}
.inline-code{direction:ltr;display:inline-block;font-family:Consolas,Monaco,"Courier New",monospace;font-size:.92em;background:rgba(31,111,178,.10);border-radius:5px;padding:0 5px}

.composer-area{background:linear-gradient(180deg,rgba(255,255,255,0),#fff 22%);padding:10px 32px calc(18px + var(--safe-bottom));z-index:6}
.suggestions{display:none}
.composer{min-height:56px;border:1px solid #c9d7e7;background:rgba(255,255,255,.98);border-radius:19px;box-shadow:0 8px 26px rgba(31,111,178,.14);display:grid;grid-template-columns:46px minmax(0,1fr) 42px;align-items:end;direction:ltr;overflow:hidden}
#messageInput{grid-column:2;grid-row:1;direction:rtl;width:100%;height:54px;min-height:54px;max-height:132px;resize:none;border:0;outline:0;background:transparent;color:#111827;padding:13px 8px 11px;line-height:1.8;overflow-y:auto}
#messageInput::placeholder{color:#8a94a6}
.send{grid-column:1;grid-row:1;margin:10px 0 10px 8px;width:36px;height:36px;border:0;border-radius:13px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;display:flex;align-items:center;justify-content:center;padding:0;transition:.15s;box-shadow:0 8px 18px rgba(31,111,178,.22)}
.send:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(31,111,178,.28)}
.send span{display:none}
.send svg{display:block;width:19px;height:19px;fill:currentColor;transform:rotate(180deg)}
.send.sending svg{display:none}
.send.sending:before{content:"…";font-size:24px;line-height:1;transform:translateY(-2px)}
.send:disabled{opacity:.65;cursor:not-allowed;transform:none}
.composer:after{content:"";grid-column:3;grid-row:1;margin:0 7px 10px 0;width:34px;height:36px;background:no-repeat center/20px 20px url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 15.5C14.21 15.5 16 13.71 16 11.5V6C16 3.79 14.21 2 12 2C9.79 2 8 3.79 8 6V11.5C8 13.71 9.79 15.5 12 15.5Z' stroke='%231f6fb2' stroke-width='1.8'/%3E%3Cpath d='M5 10.5V11.5C5 15.37 8.13 18.5 12 18.5C15.87 18.5 19 15.37 19 11.5V10.5' stroke='%231f6fb2' stroke-width='1.8' stroke-linecap='round'/%3E%3Cpath d='M12 18.5V22' stroke='%231f6fb2' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");display:block}
.composer-note{display:flex;justify-content:center;margin-top:8px;color:#7d8793;font-size:11px;text-align:center}
#charCounter,.composer-note span:first-child{display:none}
.composer-note:after{content:"این چت‌بات مبتنی بر هوش مصنوعی طراحی شده است و ممکن است پاسخ دقیق نباشد."}

@media(max-width:760px){
body{font-size:13px}
.app{height:100dvh;align-items:stretch}
.chat{height:100dvh;width:100%;grid-template-rows:52px minmax(0,1fr) auto}
.chat-header{height:52px;padding:0 10px}
.brand{gap:8px;min-width:0;flex:1}
.brand-mark{width:25px;height:25px;border-radius:9px}
.brand-text h1{font-size:13px;max-width:145px}
.brand-text p{display:none}
.header-actions{gap:4px}
.header-actions .header-btn.link{display:none}
.header-btn{height:28px;font-size:11px;padding:0 7px;border-radius:8px}
.chat-scroll{padding:16px 10px 10px}
.msg{margin-bottom:18px}
.msg-body{max-width:86%}
.msg-bubble{padding:11px 13px;line-height:1.95;border-radius:16px}
.msg.user .msg-bubble{border-radius:16px 5px 16px 16px}
.msg.ai .msg-bubble{border-radius:5px 16px 16px 16px}
.msg-actions{gap:7px;margin-top:7px}
.composer-area{position:relative;padding:8px 8px calc(10px + var(--safe-bottom));background:#fff;border-top:1px solid rgba(213,225,238,.8)}
.composer{min-height:50px;border-radius:16px;grid-template-columns:42px minmax(0,1fr) 38px;align-items:end}
#messageInput{height:50px;min-height:50px;max-height:108px;padding:11px 6px 10px;font-size:13px;line-height:1.7}
.send{width:32px;height:32px;border-radius:11px;margin:9px 0 9px 7px}
.send svg{width:17px;height:17px}
.composer:after{width:30px;height:32px;margin:0 5px 9px 0;background-size:18px 18px}
.composer-note{font-size:10px;margin-top:6px;line-height:1.6;padding:0 5px}
.sources{font-size:11px}
.source-list{gap:4px}
.sources span{max-width:100%}
}

@media(max-width:380px){
.header-btn.danger{display:none}
.brand-text h1{max-width:125px}
.msg-body{max-width:90%}
.chat-scroll{padding-left:8px;padding-right:8px}
.composer-area{padding-left:6px;padding-right:6px}
}


/* v8 critical UI fixes: no shadows + guaranteed alignment */
:root{
  --shadow:none !important;
}

*{
  box-shadow:none !important;
}

/* صفحه و پنل بدون سایه */
.app,
.chat,
.chat-header,
.chat-scroll,
.composer-area,
.composer,
.brand-mark,
.header-btn,
.msg-bubble,
.send,
.code-card{
  box-shadow:none !important;
}

/* حذف افکت hover سایه/حرکت */
.send:hover{
  transform:none !important;
  box-shadow:none !important;
}

/* چیدمان قطعی پیام‌ها - مستقل از RTL/LTR صفحه */
.msg{
  display:flex !important;
  width:100% !important;
  direction:ltr !important;
}

/* پیام کاربر همیشه سمت راست */
.msg.user{
  justify-content:flex-end !important;
  flex-direction:row !important;
  direction:ltr !important;
  text-align:right !important;
}

.msg.user .msg-body{
  margin-left:auto !important;
  margin-right:0 !important;
  align-items:flex-end !important;
  direction:rtl !important;
  text-align:right !important;
}

.msg.user .msg-bubble{
  margin-left:0 !important;
  margin-right:0 !important;
  direction:rtl !important;
  text-align:right !important;
  border-radius:18px 6px 18px 18px !important;
}

/* پیام AI همیشه سمت چپ */
.msg.ai{
  justify-content:flex-start !important;
  flex-direction:row !important;
  direction:ltr !important;
  text-align:right !important;
}

.msg.ai .msg-body{
  margin-right:auto !important;
  margin-left:0 !important;
  align-items:flex-start !important;
  direction:rtl !important;
  text-align:right !important;
}

.msg.ai .msg-bubble{
  margin-right:0 !important;
  margin-left:0 !important;
  direction:rtl !important;
  text-align:right !important;
  border-radius:6px 18px 18px 18px !important;
}

/* رنگ‌ها بدون سایه، کمی تمیزتر */
.msg.user .msg-bubble{
  background:#d8ecff !important;
  border-color:#bfdcf8 !important;
  color:#10365f !important;
}

.msg.ai .msg-bubble{
  background:#f7f5fb !important;
  border-color:#eeeaf6 !important;
  color:#1f2937 !important;
}

.composer{
  border-color:#cfd9e6 !important;
  background:#fff !important;
}

.send{
  background:#1f6fb2 !important;
}

.brand-mark{
  background:#1f6fb2 !important;
}

/* موبایل */
@media(max-width:760px){
  .msg.user{
    justify-content:flex-end !important;
  }

  .msg.ai{
    justify-content:flex-start !important;
  }

  .msg-body{
    max-width:88% !important;
  }

  .msg.user .msg-body{
    margin-left:auto !important;
    margin-right:0 !important;
  }

  .msg.ai .msg-body{
    margin-right:auto !important;
    margin-left:0 !important;
  }

  .composer-area{
    box-shadow:none !important;
  }

  .composer{
    box-shadow:none !important;
  }
}

@media(max-width:380px){
  .msg-body{
    max-width:91% !important;
  }
}


/* v9 corporate UI refinement */
:root{
  --bg:#f6f8fb !important;
  --panel:#ffffff !important;
  --text:#1f2937 !important;
  --muted:#6b7280 !important;
  --line:#e5e9f0 !important;
  --line-2:#d6dde7 !important;
  --accent:#325273 !important;
  --accent-2:#48698b !important;
}

/* صفحه و هدر */
body{
  background:var(--bg) !important;
}

.app{
  background:#f6f8fb !important;
}

.chat{
  background:#f6f8fb !important;
}

.chat-header{
  height:56px !important;
  padding:0 22px !important;
  background:#ffffff !important;
  border-bottom:1px solid var(--line) !important;
}

.brand-mark{
  width:24px !important;
  height:24px !important;
  border-radius:6px !important;
  background:#325273 !important;
}

.brand-text h1{
  font-size:13px !important;
  color:#24364a !important;
}

.brand-text p{
  font-size:11px !important;
  color:#7b8594 !important;
}

.header-actions{
  gap:6px !important;
}

.header-btn{
  height:30px !important;
  border-radius:6px !important;
  border:1px solid var(--line-2) !important;
  background:#ffffff !important;
  color:#38516c !important;
  font-size:12px !important;
  padding:0 9px !important;
}

/* ناحیه پیام‌ها */
.chat-scroll{
  padding:22px 24px 14px !important;
  background:#f6f8fb !important;
}

.msg{
  margin:0 0 18px !important;
  gap:6px !important;
}

.msg-body{
  max-width:min(650px,64%) !important;
}

.msg-bubble{
  padding:11px 13px !important;
  line-height:1.95 !important;
  border-width:1px !important;
  border-style:solid !important;
}

.msg.user .msg-bubble{
  background:#dbe8f5 !important;
  border-color:#c8d8ea !important;
  color:#16324d !important;
  border-radius:12px 4px 12px 12px !important;
}

.msg.ai .msg-bubble{
  background:#f2f4f7 !important;
  border-color:#e3e7ed !important;
  color:#222b38 !important;
  border-radius:4px 12px 12px 12px !important;
}

.msg-time{
  font-size:10px !important;
  margin-top:4px !important;
  color:#6f8092 !important;
}

.msg.ai .msg-time{
  color:#8a93a0 !important;
}

.msg-actions{
  gap:8px !important;
  margin-top:7px !important;
  color:#4c6279 !important;
}

.msg-actions button{
  width:17px !important;
  height:17px !important;
  border-radius:4px !important;
}

.msg-actions button:hover{
  background:#edf1f5 !important;
}

.msg-actions svg{
  width:16px !important;
  height:16px !important;
}

/* منابع */
.sources{
  margin-top:10px !important;
  padding-top:8px !important;
  font-size:11px !important;
  color:#6d7682 !important;
}

.source-list{
  gap:4px !important;
  margin-top:5px !important;
}

.sources span{
  border-radius:5px !important;
  padding:2px 6px !important;
  background:#ffffff !important;
  border:1px solid #dde3ea !important;
}

/* کدبلاک */
.code-card{
  border-radius:8px !important;
  border:1px solid #243140 !important;
}

.code-head{
  min-height:30px !important;
  padding:0 8px !important;
}

.copy-code{
  height:23px !important;
  border-radius:5px !important;
}

/* کامپوزر */
.composer-area{
  padding:8px 24px 14px !important;
  background:#f6f8fb !important;
}

.composer{
  min-height:52px !important;
  border:1px solid #cfd6e0 !important;
  border-radius:12px !important;
  background:#ffffff !important;
  grid-template-columns:42px minmax(0,1fr) 36px !important;
}

#messageInput{
  min-height:50px !important;
  height:50px !important;
  max-height:120px !important;
  padding:11px 8px 10px !important;
  line-height:1.75 !important;
  color:#18212f !important;
}

#messageInput::placeholder{
  color:#8b94a3 !important;
}

.send{
  width:32px !important;
  height:32px !important;
  margin:9px 0 9px 7px !important;
  border-radius:8px !important;
  background:#325273 !important;
}

.send svg{
  width:16px !important;
  height:16px !important;
}

.composer:after{
  width:28px !important;
  height:32px !important;
  margin:0 5px 9px 0 !important;
  opacity:.9 !important;
}

.composer-note{
  margin-top:7px !important;
  color:#7a8391 !important;
  font-size:10px !important;
}

/* موبایل */
@media(max-width:760px){
  .chat-header{
    height:50px !important;
    padding:0 10px !important;
  }

  .brand-mark{
    width:22px !important;
    height:22px !important;
    border-radius:5px !important;
  }

  .brand-text h1{
    font-size:12px !important;
    max-width:150px !important;
  }

  .header-btn{
    height:27px !important;
    font-size:11px !important;
    border-radius:6px !important;
    padding:0 7px !important;
  }

  .chat-scroll{
    padding:14px 10px 10px !important;
  }

  .msg{
    margin-bottom:16px !important;
  }

  .msg-body{
    max-width:88% !important;
  }

  .msg-bubble{
    padding:10px 12px !important;
    line-height:1.9 !important;
  }

  .msg.user .msg-bubble{
    border-radius:11px 4px 11px 11px !important;
  }

  .msg.ai .msg-bubble{
    border-radius:4px 11px 11px 11px !important;
  }

  .composer-area{
    padding:7px 8px 10px !important;
    background:#ffffff !important;
    border-top:1px solid var(--line) !important;
  }

  .composer{
    min-height:50px !important;
    border-radius:11px !important;
    grid-template-columns:40px minmax(0,1fr) 34px !important;
  }

  #messageInput{
    min-height:48px !important;
    height:48px !important;
    max-height:104px !important;
    font-size:13px !important;
  }

  .send{
    width:31px !important;
    height:31px !important;
    border-radius:7px !important;
    margin:8px 0 8px 6px !important;
  }

  .send svg{
    width:15px !important;
    height:15px !important;
  }

  .composer:after{
    width:24px !important;
    height:30px !important;
    margin:0 4px 8px 0 !important;
    background-size:16px 16px !important;
  }
}

@media(max-width:380px){
  .msg-body{
    max-width:91% !important;
  }
}


/* v10 design system + dark mode */
html[data-theme="dark"]{
  --bg:#101418 !important;
  --panel:#171c22 !important;
  --text:#e8edf3 !important;
  --muted:#9aa4b2 !important;
  --line:#2a333e !important;
  --line-2:#3a4654 !important;
  --accent:#7fa7d1 !important;
  --accent-2:#9bb8d7 !important;
}

html[data-theme="dark"] body,
html[data-theme="dark"] .app,
html[data-theme="dark"] .chat,
html[data-theme="dark"] .chat-scroll{
  background:#101418 !important;
  color:#e8edf3 !important;
}

html[data-theme="dark"] .chat-header,
html[data-theme="dark"] .composer-area{
  background:#171c22 !important;
  border-color:#2a333e !important;
}

html[data-theme="dark"] .brand-text h1,
html[data-theme="dark"] .msg-bubble strong{
  color:#e8edf3 !important;
}

html[data-theme="dark"] .brand-text p,
html[data-theme="dark"] .composer-note,
html[data-theme="dark"] .msg-time{
  color:#9aa4b2 !important;
}

html[data-theme="dark"] .header-btn{
  background:#171c22 !important;
  color:#d8e2ee !important;
  border-color:#3a4654 !important;
}

html[data-theme="dark"] .msg.user .msg-bubble{
  background:#20364d !important;
  border-color:#2f4d6c !important;
  color:#e8f3ff !important;
}

html[data-theme="dark"] .msg.ai .msg-bubble{
  background:#1b2028 !important;
  border-color:#2c333d !important;
  color:#e8edf3 !important;
}

html[data-theme="dark"] .composer{
  background:#171c22 !important;
  border-color:#3a4654 !important;
}

html[data-theme="dark"] #messageInput{
  color:#e8edf3 !important;
}

html[data-theme="dark"] #messageInput::placeholder{
  color:#8f9baa !important;
}

html[data-theme="dark"] .sources span{
  background:#171c22 !important;
  border-color:#3a4654 !important;
}

html[data-theme="dark"] .source-list,
html[data-theme="dark"] .sources{
  color:#9aa4b2 !important;
}

#themeToggle{
  display:inline-flex !important;
}

.theme-light,.theme-dark{
  display:inline !important;
}

html[data-theme="light"] .theme-dark{
  display:none !important;
}

html[data-theme="dark"] .theme-light{
  display:none !important;
}


/* v10.2 clean UI: white background + hide sources */
:root{
  --bg:#ffffff !important;
}

body,
.app,
.chat,
.chat-scroll,
.composer-area{
  background:#ffffff !important;
}

html[data-theme="light"] body,
html[data-theme="light"] .app,
html[data-theme="light"] .chat,
html[data-theme="light"] .chat-scroll,
html[data-theme="light"] .composer-area{
  background:#ffffff !important;
}

/* منابع زیر پاسخ‌ها نمایش داده نشوند */
.sources,
.source-list{
  display:none !important;
}