/* =====================================================================
   BOT.css — نافذة وأيقونة بوت مَدى Web
   - ثابتة أسفل اليسار فيزيائياً (left) في الجوال والكمبيوتر واللغتين
   - نفس هوية الموقع الزجاجية + دعم الوضع الليلي تلقائياً عبر متغيرات الموقع
   ===================================================================== */

/* زر الأيقونة العائم — دائري زجاجي: روبوت SVG احترافي */
#madaBotFab{
  position:fixed;
  left:16px; bottom:16px;           /* أسفل اليسار دائماً */
  z-index:90;
  width:64px; height:64px;
  padding:0;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.65);
  background:linear-gradient(135deg, rgba(196,169,147,.85) 0%, rgba(158,127,103,.85) 100%);
  backdrop-filter:blur(16px) saturate(180%);
  -webkit-backdrop-filter:blur(16px) saturate(180%);
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  box-shadow:0 14px 30px rgba(158,127,103,.45), inset 0 1px 2px rgba(255,255,255,.7), inset 0 -2px 6px rgba(66,60,62,.18);
  transition:transform .25s ease, box-shadow .25s ease;
}
#madaBotFab:hover{ transform:translateY(-3px) scale(1.06); box-shadow:0 18px 36px rgba(158,127,103,.55), inset 0 1px 2px rgba(255,255,255,.7); }
/* الأيقونة تملأ الدائرة تماماً — دائرة واحدة فقط */
.mada-bot-ico{
  width:100%; height:100%; border-radius:50%;
  background:transparent; border:none; box-shadow:none;
  display:flex; align-items:center; justify-content:center;
}
.mada-bot-ico svg{ width:33px; height:33px; display:block; }
#madaBotFab .fa-xmark{ font-size:26px; }
/* وجه الزر: روبوت مغلقاً / ✕ مفتوحاً — تبديل بالكلاس فقط */
#madaBotFab .mada-x{ display:none; }
#madaBotFab.is-open .mada-x{ display:block; }
#madaBotFab.is-open .mada-bot-ico{ display:none; }
/* نبض لفت الانتباه أول مرة */
@keyframes madaBotPulse{0%{box-shadow:0 0 0 0 rgba(186,158,135,.55);}70%{box-shadow:0 0 0 16px rgba(186,158,135,0);}100%{box-shadow:0 0 0 0 rgba(186,158,135,0);}}
#madaBotFab.mada-attn{ animation:madaBotPulse 1.8s ease-out 3; }

/* نافذة المحادثة */
#madaBotWin{
  position:fixed;
  left:16px; bottom:88px;           /* فوق الزر مباشرة يساراً */
  z-index:91;
  width:370px; max-width:calc(100vw - 32px);
  height:520px; max-height:calc(100vh - 120px);
  display:flex; flex-direction:column; overflow:hidden;
  background:var(--glass-bg);
  backdrop-filter:blur(26px) saturate(180%);
  -webkit-backdrop-filter:blur(26px) saturate(180%);
  border:1px solid var(--glass-border);
  border-radius:24px;
  box-shadow:var(--glass-shadow);
  opacity:0; transform:translateY(24px) scale(.97);
  pointer-events:none;
  transition:opacity .3s ease, transform .3s cubic-bezier(.2,.8,.2,1);
}
#madaBotWin.mada-open{ opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }
#madaBotWin, #madaBotMsgs{ overscroll-behavior:contain; }

/* رأس النافذة */
.mada-bot-head{
  display:flex; align-items:center; gap:10px;
  padding:14px 16px;
  background:linear-gradient(135deg, rgba(237,226,212,.85), rgba(186,158,135,.55));
  border-bottom:1px solid var(--glass-border);
}
html.dark .mada-bot-head{ background:linear-gradient(135deg, rgba(60,48,38,.85), rgba(30,24,19,.85)); }
.mada-bot-avatar{
  width:50px; height:50px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(196,169,147,.85) 0%, rgba(158,127,103,.85) 100%);
  border:1px solid rgba(255,255,255,.65);
  box-shadow:0 6px 16px rgba(158,127,103,.4), inset 0 1px 2px rgba(255,255,255,.7), inset 0 -2px 6px rgba(66,60,62,.18);
}
.mada-bot-avatar svg{ width:32px; height:32px; display:block; }
.mada-bot-head b{ display:block; font-size:15px; color:var(--text-primary); line-height:1.4; }
.mada-bot-head small{ display:flex; align-items:center; gap:5px; font-size:11px; color:var(--text-secondary); font-weight:700; }
.mada-bot-head small i{ width:8px; height:8px; border-radius:50%; background:#10b981; display:inline-block; animation:blink 1.4s infinite; }
@keyframes blink{50%{opacity:.3;}}
.mada-bot-x{
  margin-inline-start:auto;
  width:34px; height:34px; border-radius:10px; flex-shrink:0;
  border:1px solid var(--glass-border); background:var(--input-bg);
  color:var(--text-secondary); cursor:pointer; font-size:15px;
}
.mada-bot-x:hover{ color:var(--text-primary); border-color:var(--accent-main); }

/* منطقة الرسائل */
#madaBotMsgs{
  flex:1; overflow-y:auto;
  padding:14px 12px; display:flex; flex-direction:column; gap:10px;
  background:transparent;
}
#madaBotMsgs::-webkit-scrollbar{ width:6px; }
#madaBotMsgs::-webkit-scrollbar-thumb{ background:var(--accent-main); border-radius:4px; }
.mada-msg{
  max-width:85%; padding:10px 13px; border-radius:16px;
  font-size:13.5px; line-height:1.8; word-break:break-word;
}
.mada-msg.bot{
  align-self:flex-start;
  background:var(--input-bg);
  border:1px solid var(--glass-border);
  border-start-start-radius:6px;
  color:var(--text-primary);
}
.mada-msg.user{
  align-self:flex-end;
  background:linear-gradient(135deg,#C4A993,#9E7F67);
  color:#fff; border-end-end-radius:6px;
  box-shadow:0 6px 16px rgba(158,127,103,.3);
}
.mada-msg.typing{ display:flex; gap:5px; align-items:center; padding:14px 16px; }
.mada-msg.typing span{ width:7px; height:7px; border-radius:50%; background:var(--accent-main); animation:madaTp 1s infinite; }
.mada-msg.typing span:nth-child(2){ animation-delay:.15s; } .mada-msg.typing span:nth-child(3){ animation-delay:.3s; }
@keyframes madaTp{ 0%,100%{opacity:.3; transform:translateY(0);} 50%{opacity:1; transform:translateY(-4px);} }

/* مؤشر الكتابة الوامض أثناء كتابة رد البوت */
.mada-caret{
  display:inline-block; width:7px; height:14px; margin-inline-start:3px;
  vertical-align:-2px; border-radius:2px; background:var(--accent-main);
  animation:madaCaret .8s steps(1) infinite;
}
@keyframes madaCaret{ 50%{ opacity:0; } }

/* بطاقات المواقع في إجابات الأعمال — اسم الموقع + زر فتح احترافي */
.mada-msg.bot .mada-site-card{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:10px 12px; border-radius:16px; margin:6px 0;
  background:var(--glass-bg);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1px solid var(--glass-border);
  box-shadow:0 8px 20px -6px rgba(143,114,93,.25), inset 0 1px 0 rgba(255,255,255,.6);
}
.mada-msg.bot .mada-site-card b{
  flex:1; min-width:0;
  font-size:13px; font-weight:800; line-height:1.7; color:var(--text-primary);
}
.mada-msg.bot .mada-site-card a{
  flex-shrink:0; text-decoration:none; white-space:nowrap;
  font-size:12px; font-weight:800; color:#fff;
  background:linear-gradient(135deg,#C4A993 0%,#9E7F67 100%);
  padding:8px 16px; border-radius:9999px;
  box-shadow:0 6px 14px rgba(158,127,103,.4);
  transition:transform .2s ease, box-shadow .2s ease;
}
.mada-msg.bot .mada-site-card a:hover{ transform:translateY(-1px) scale(1.04); box-shadow:0 10px 20px rgba(158,127,103,.5); }
.mada-inline-link{ color:var(--accent-main); font-weight:800; word-break:break-all; }

/* ملخص تأكيد بيانات الطلب قبل التعبئة */
.mada-msg.bot .mada-order-summary{
  background:var(--input-bg);
  border:1px solid var(--glass-border);
  border-radius:14px; padding:4px 12px; margin:6px 0;
}
.mada-msg.bot .mada-order-summary div{
  display:flex; justify-content:space-between; align-items:baseline; gap:10px;
  font-size:12.5px; padding:6px 0;
  border-bottom:1px dashed var(--glass-border);
}
.mada-msg.bot .mada-order-summary div:last-child{ border-bottom:none; }
.mada-msg.bot .mada-order-summary span{ color:var(--text-muted); font-weight:700; flex-shrink:0; }
.mada-msg.bot .mada-order-summary b{ color:var(--text-primary); text-align:end; word-break:break-word; }
.mada-suggest button.mada-order-go{ border-color:var(--accent-main); color:var(--text-primary); font-weight:900; }
.mada-suggest button.mada-confirm-ok{ background:linear-gradient(135deg,#C4A993,#9E7F67); color:#fff; border:none; }
.mada-suggest button.mada-confirm-no{ color:#e11d48; }

/* أزرار الاقتراحات */
.mada-suggest{ display:flex; flex-wrap:wrap; gap:6px; align-self:flex-start; max-width:95%; }
.mada-suggest button{
  font-size:11.5px; font-weight:800; cursor:pointer;
  padding:7px 12px; border-radius:9999px;
  border:1px solid var(--glass-border); background:var(--badge-bg); color:var(--text-secondary);
  transition:all .2s;
}
.mada-suggest button:hover{ border-color:var(--accent-main); color:var(--text-primary); transform:translateY(-1px); }

/* حقل الإدخال */
.mada-bot-input{
  display:flex; gap:8px; padding:12px;
  border-top:1px solid var(--glass-border);
  background:rgba(255,255,255,.4);
}
html.dark .mada-bot-input{ background:rgba(0,0,0,.2); }
#madaBotText{
  flex:1; min-width:0; resize:none;
  padding:11px 13px; border-radius:13px; font-size:13.5px; font-family:inherit;
  border:1px solid var(--glass-border); background:var(--input-bg); color:var(--text-primary);
  outline:none; max-height:90px;
}
#madaBotText:focus{ border-color:var(--accent-main); box-shadow:0 0 0 3px var(--accent-glow); }
#madaBotSend{
  width:46px; height:46px; border-radius:13px; flex-shrink:0;
  border:none; cursor:pointer; font-size:16px; color:#fff;
  background:linear-gradient(135deg,#C4A993,#9E7F67);
  box-shadow:0 8px 18px rgba(158,127,103,.35);
  transition:transform .2s;
}
#madaBotSend:hover{ transform:scale(1.06); }
#madaBotSend:disabled{ opacity:.5; cursor:wait; transform:none; }
/* في الإنجليزية (LTR) اقلب اتجاه زر الإرسال */
html[dir="ltr"] #madaBotSend i{ transform:scaleX(-1); }

/* تذييل صغير */
.mada-bot-foot{
  text-align:center; font-size:10.5px; font-weight:700;
  color:var(--text-muted); padding:7px; border-top:1px solid var(--glass-border);
}
.mada-bot-foot a{ color:var(--accent-main); text-decoration:none; font-weight:800; }

/* ===== الجوال فقط: شاشة المحادثة شاشة رئيسية كاملة (وليست منبثقة) — الكمبيوتر لا يتغير نهائياً ===== */
body.mada-bot-lock{ overflow:hidden; }
@media (max-width:768px){
  #madaBotFab{ left:14px; bottom:14px; width:60px; height:60px; }
  .mada-bot-ico svg{ width:31px; height:31px; }
  /* زر الأيقونة يختفي أثناء فتح شاشة المحادثة الرئيسية — الرجوع بزر الإغلاق داخل الشاشة فقط */
  #madaBotFab.is-open{ display:none; }
  #madaBotWin{
    position:fixed; inset:0;
    left:0; right:0; top:0; bottom:0;
    width:100vw; max-width:100vw;
    height:100vh; height:100dvh;
    min-height:100vh; min-height:100dvh;
    max-height:none;
    margin:0;
    border:none; border-radius:0;
    z-index:200;
    opacity:0; transform:translateY(28px);
    pointer-events:none;
    padding-top:env(safe-area-inset-top);
    padding-bottom:env(safe-area-inset-bottom);
  }
  #madaBotWin.mada-open{
    opacity:1; transform:translateY(0);
    pointer-events:auto;
  }
  .mada-bot-head{ padding-top:calc(14px + env(safe-area-inset-top)); border-radius:0; }
  .mada-bot-input{ padding-bottom:calc(12px + env(safe-area-inset-bottom)); }
  /* الجوال فقط: الشريط العلوي وحقل الإدخال لا ينضغطان أبداً عند فتح الكيبورد — الكيبورد لا يغطيهما */
  .mada-bot-head, .mada-bot-input, .mada-bot-foot{ flex-shrink:0; }
  #madaBotMsgs{ min-height:0; }
}