/* Bağış Asistanı — stil (Tailwind'e bağımlı değil). Renkler .ayebot üzerindeki --bot* değişkenleriyle değiştirilebilir.
   Gerekli: Font Awesome 6 (solid) — ikonlar için. Yazı tipi: Inter/Poppins yoksa sistem yazı tipi kullanılır.
   AUSTRIA YETIM ELI: renkler site yeşili; başlatıcı eski kırmızı "BAĞIŞ YAP" yüzen düğmesinin yerinde ve görünümünde
   (--bot-cta). ≤992px'te başlatıcı gizli — mobil alt çubuktaki "Bağış Asistanı" düğmesi ([data-bot-open]) açar.
   z-index: site başlığı 2000, mobil alt çubuk 9998, kurban penceresi 10000, hızlı bağış penceresi 10050. */
.ayebot { --bot:#0b7c41; --bot-dark:#166534; --bot-accent:#c2410c; --bot-ink:#14241c; --bot-cta:#dc2626; --bot-cta-dark:#b91c1c; font-family:"Inter",system-ui,sans-serif; }
.ayebot-launcher { position:fixed; right:30px; bottom:30px; z-index:9990; display:inline-flex; align-items:center; gap:.75rem; padding:5px; border:0; border-radius:9999px; background:var(--bot-cta); color:#fff; font-family:"Outfit","Inter",system-ui,sans-serif; box-shadow:0 10px 30px rgba(220,38,38,.4); cursor:pointer; transition:transform .2s, background .2s, box-shadow .2s; }
.ayebot-launcher:hover { transform:translateY(-3px); background:var(--bot-cta-dark); box-shadow:0 15px 40px rgba(220,38,38,.5); }
.ayebot-launcher:focus-visible { outline:3px solid #fecaca; outline-offset:3px; }
.ayebot-launcher-ic { width:45px; height:45px; display:grid; place-items:center; border-radius:9999px; background:#fff; color:var(--bot-cta); font-size:1.2rem; }
.ayebot-launcher-lbl { font-weight:800; font-size:.9rem; letter-spacing:.02em; padding-right:1.1rem; white-space:nowrap; }
.ayebot-launcher.is-open .ayebot-launcher-lbl { display:none; }
.ayebot-launcher.is-open .ayebot-launcher-ic::before { content:"\2715"; font-family:sans-serif; font-weight:700; }
.ayebot-launcher.is-open .ayebot-launcher-ic i { display:none; }
.ayebot-pulse { position:absolute; inset:0; border-radius:9999px; box-shadow:0 0 0 0 rgba(220,38,38,.5); animation:ayebotPulse 2.4s infinite; pointer-events:none; }
.ayebot-launcher.is-open .ayebot-pulse { display:none; }
@keyframes ayebotPulse { 0%{box-shadow:0 0 0 0 rgba(220,38,38,.45)} 70%{box-shadow:0 0 0 16px rgba(220,38,38,0)} 100%{box-shadow:0 0 0 0 rgba(220,38,38,0)} }
@media (prefers-reduced-motion:reduce) { .ayebot-pulse { animation:none; } .ayebot-panel { animation:none; } }
/* Mobil / tablet: sitenin alt aksiyon çubuğu var → yüzen başlatıcı gizli, çubuktaki düğme açar */
@media (max-width:992px) { .ayebot-launcher { display:none; } }

.ayebot-toast[hidden], .ayebot-panel[hidden] { display:none !important; }
.ayebot-toast { position:fixed; right:1.25rem; bottom:6.25rem; z-index:10030; background:var(--bot-ink); color:#fff; font-size:.85rem; font-weight:600; padding:.6rem .9rem; border-radius:.75rem; box-shadow:0 10px 30px -10px rgba(0,0,0,.4); max-width:260px; }

.ayebot-panel { position:fixed; right:30px; bottom:96px; z-index:10020; width:min(390px, calc(100vw - 2rem)); height:min(640px, calc(100vh - 7.5rem)); display:flex; flex-direction:column; background:#f5f0e6; border-radius:1.25rem; box-shadow:0 30px 70px -20px rgba(14,42,71,.45); border:1px solid rgba(20,36,28,.08); overflow:hidden; animation:ayebotIn .25s ease; }
@keyframes ayebotIn { from{opacity:0; transform:translateY(12px) scale(.98)} to{opacity:1; transform:none} }
@media (max-width:992px) { .ayebot-panel { right:1rem; bottom:5rem; height:min(640px, calc(100vh - 7rem)); } .ayebot-toast { bottom:4.5rem; } }
@media (max-width:639px) { .ayebot-panel { right:0; bottom:0; width:100vw; height:100dvh; border-radius:0; border:0; } .ayebot-lock, .ayebot-lock body { overflow:hidden; } }

.ayebot-head { display:flex; align-items:center; gap:.7rem; padding:.85rem 1rem; background:linear-gradient(135deg,#0f2d1e,#0b7c41); color:#fff; }
.ayebot-avatar { width:40px; height:40px; flex:none; display:grid; place-items:center; border-radius:9999px; background:rgba(255,255,255,.15); font-size:1.1rem; }
.ayebot-head-txt { flex:1; min-width:0; line-height:1.2; }
.ayebot-head-txt strong { display:block; font-family:"Poppins",sans-serif; font-size:1rem; }
.ayebot-head-txt small { display:block; font-size:.72rem; opacity:.85; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ayebot-dot { display:inline-block; width:8px; height:8px; border-radius:9999px; background:#4ade80; margin-right:.3rem; box-shadow:0 0 0 3px rgba(74,222,128,.25); }
.ayebot-iconbtn { width:36px; height:36px; flex:none; display:grid; place-items:center; border:0; border-radius:9999px; background:rgba(255,255,255,.12); color:#fff; cursor:pointer; }
.ayebot-iconbtn:hover { background:rgba(255,255,255,.25); }

.ayebot-steps { display:flex; gap:.15rem; margin:0; padding:.55rem .75rem; list-style:none; background:#fff; border-bottom:1px solid rgba(20,36,28,.08); overflow-x:auto; scrollbar-width:none; }
.ayebot-steps::-webkit-scrollbar { display:none; }
.ayebot-steps li { flex:1 0 auto; display:flex; align-items:center; gap:.3rem; font-size:.66rem; font-weight:700; letter-spacing:.02em; text-transform:uppercase; color:#94a3b8; white-space:nowrap; }
.ayebot-steps li span { width:18px; height:18px; display:grid; place-items:center; border-radius:9999px; background:#e2e8f0; color:#64748b; font-size:.62rem; }
.ayebot-steps li.active { color:var(--bot); } .ayebot-steps li.active span { background:var(--bot); color:#fff; }
.ayebot-steps li.done { color:#0e6236; } .ayebot-steps li.done span { background:#bbf7d0; color:#0e6236; }

.ayebot-list { flex:1; overflow-y:auto; padding:1rem .9rem; display:flex; flex-direction:column; gap:.6rem; scroll-behavior:smooth; }
.ayebot-msg { display:flex; align-items:flex-end; gap:.45rem; max-width:92%; }
.ayebot-msg.from-user { align-self:flex-end; flex-direction:row-reverse; }
.ayebot-msg-av { width:28px; height:28px; flex:none; display:grid; place-items:center; border-radius:9999px; background:var(--bot); color:#fff; font-size:.75rem; }
.ayebot-bubble { padding:.7rem .9rem; border-radius:1rem; font-size:.92rem; line-height:1.5; color:var(--bot-ink); background:#fff; border-bottom-left-radius:.3rem; box-shadow:0 6px 18px -12px rgba(14,58,42,.35); word-break:break-word; }
.ayebot-bubble code { font-family:ui-monospace,"Courier New",monospace; font-size:.8rem; }
.from-user .ayebot-bubble { background:var(--bot); color:#fff; border-bottom-left-radius:1rem; border-bottom-right-radius:.3rem; }
.ayebot-bubble small { display:block; margin-top:.35rem; font-size:.78rem; color:#64748b; }
.ayebot-link { color:var(--bot); font-weight:600; text-decoration:underline; text-underline-offset:3px; }
.ayebot-table { width:100%; margin:.5rem 0; border-collapse:collapse; font-size:.85rem; }
.ayebot-table th { text-align:left; font-weight:600; color:#64748b; padding:.2rem .5rem .2rem 0; white-space:nowrap; vertical-align:top; }
.ayebot-table td { padding:.2rem 0; font-weight:600; color:var(--bot-ink); }

.ayebot-opts { display:flex; flex-wrap:wrap; gap:.4rem; padding-left:2.1rem; }
.ayebot-chip { display:inline-flex; align-items:center; gap:.4rem; padding:.5rem .8rem; border-radius:9999px; border:1.5px solid var(--bot); background:#fff; color:var(--bot); font-size:.85rem; font-weight:600; cursor:pointer; transition:background .15s, color .15s, transform .15s; text-align:left; }
.ayebot-chip:hover { background:var(--bot); color:#fff; transform:translateY(-1px); }
.ayebot-chip.is-primary { background:var(--bot-accent); border-color:var(--bot-accent); color:#fff; }
.ayebot-chip.is-primary:hover { background:#9a3412; border-color:#9a3412; }
.ayebot-chip.is-ghost { border-color:#cbd5e1; color:#475569; background:transparent; }
.ayebot-chip.is-ghost:hover { background:#e2e8f0; color:#0f172a; }
.ayebot-chip em { font-style:normal; font-size:.75rem; padding:.1rem .45rem; border-radius:9999px; background:rgba(11,124,65,.12); color:var(--bot-dark); }
.ayebot-chip.is-primary em, .ayebot-chip:hover em { background:rgba(255,255,255,.25); color:#fff; }

.ayebot-form { display:flex; gap:.5rem; padding:.7rem .8rem; background:#fff; border-top:1px solid rgba(20,36,28,.08); }
.ayebot-input { flex:1; min-width:0; border:1.5px solid #e2e8f0; border-radius:9999px; padding:.65rem 1rem; font-size:16px; outline:none; background:#f8fafc; }
.ayebot-input:focus { border-color:var(--bot); background:#fff; }
.ayebot-send { width:44px; height:44px; flex:none; border:0; border-radius:9999px; background:var(--bot); color:#fff; cursor:pointer; font-size:1rem; }
.ayebot-send:hover { background:var(--bot-dark); }
