/* FG Bot AI — Frontend Styles v1.1.12 */

/* ── Shell ─────────────────────────────────────── */
#nb-chat-ui{position:fixed;z-index:9999;direction:rtl;font-family:'Tajawal','Segoe UI','Cairo',sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
#nb-win{width:360px;height:540px;background:#fff;border-radius:18px;box-shadow:0 20px 50px rgba(0,0,0,.15),0 5px 15px rgba(0,0,0,.08);display:none;flex-direction:column;overflow:hidden;margin-bottom:12px}
.nb-header{color:#fff;padding:14px 14px 12px;font-weight:700;display:flex;justify-content:space-between;align-items:center;font-size:13.5px;letter-spacing:.2px}
.nb-controls{display:flex;align-items:center;gap:12px}
#nb-text-clear{font-size:12.5px;cursor:pointer;opacity:.85;font-weight:500;display:none;padding:4px 10px;background:rgba(255,255,255,.15);border-radius:12px;transition:background .2s}
#nb-text-clear:hover{background:rgba(255,255,255,.28);opacity:1}
.nb-close-btn{cursor:pointer;line-height:1;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;transition:background .2s}
.nb-close-btn:hover{background:rgba(255,255,255,.2)}

/* ── Log ───────────────────────────────────────── */
#nb-log{flex:1;padding:16px 14px;overflow-y:auto;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
#nb-log::-webkit-scrollbar{width:6px}
#nb-log::-webkit-scrollbar-thumb{background:rgba(0,0,0,.12);border-radius:3px}
#nb-log::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.22)}

/* ── Messages ──────────────────────────────────── */
.nb-msg{padding:10px 14px;border-radius:14px;font-size:14px;line-height:1.7;max-width:86%;word-wrap:break-word;overflow-wrap:anywhere}
.nb-msg.bot{background:#fff;align-self:flex-start;color:#2c3e50;box-shadow:0 1px 3px rgba(0,0,0,.06);border:1px solid #eef2f5;border-top-right-radius:4px}
.nb-msg.user{color:#fff;align-self:flex-end;box-shadow:0 2px 6px rgba(0,0,0,.08);border-top-left-radius:4px}

/* ── Message body structure ─────────────────────── */
.nb-msg-body{display:flex;flex-direction:column;gap:8px}
.nb-msg-body>*:first-child{margin-top:0}
.nb-msg-body>*:last-child{margin-bottom:0}
.nb-msg-p{margin:0;line-height:1.7}
.nb-msg-h{margin:4px 0 2px;font-size:14.5px;font-weight:800;padding-right:10px;border-right:3px solid currentColor}
.nb-msg-hr{border:none;border-top:1px dashed #d8dfe5;margin:4px 0}
.nb-msg-list{margin:2px 0;padding:0 20px 0 0;display:flex;flex-direction:column;gap:5px}
.nb-msg-list li{line-height:1.65}
.nb-msg-list li::marker{font-weight:700}

.nb-msg strong,.nb-msg b{font-weight:800}
.nb-msg code{background:#f5f7fa;padding:2px 7px;border-radius:5px;font-family:'SFMono-Regular',Menlo,Consolas,monospace;font-size:12.5px;color:#c0392b;border:1px solid #e7ebef}

/* ── Images ────────────────────────────────────── */
.nb-chat-img{display:block;max-width:220px;max-height:200px;border-radius:12px;margin-bottom:6px;object-fit:cover;background:#f0f0f0;box-shadow:0 2px 8px rgba(0,0,0,.08)}

/* ── Bot inline link pill ──────────────────────── */
.nb-bot-link-btn{display:inline-block;padding:4px 12px;border-radius:999px;text-decoration:none!important;font-size:13px;font-weight:600;line-height:1.55;margin:1px 2px;transition:transform .15s ease,box-shadow .15s ease,filter .15s;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}
.nb-bot-link-btn:hover{transform:translateY(-1px);box-shadow:0 4px 10px rgba(0,0,0,.12);filter:brightness(1.05)}
.nb-bot-link-btn:active{transform:translateY(0)}

/* ── Contact row (WhatsApp/Call) ──────────────── */
.nb-contact-row{display:flex;gap:8px;padding:10px 12px;background:#fafbfc;border-top:1px solid #eef2f5}
.nb-contact-btn{flex:1;color:#fff!important;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px;border-radius:999px;text-decoration:none;font-weight:700;font-size:12.5px;transition:transform .15s,box-shadow .15s,filter .15s}
.nb-contact-btn:hover{transform:translateY(-1px);box-shadow:0 6px 14px rgba(0,0,0,.12);filter:brightness(1.05)}
.nb-contact-btn svg{width:16px;height:16px}

/* ── Footer (input) ────────────────────────────── */
.nb-footer{padding:8px 10px;display:flex;gap:6px;border-top:1px solid #eef2f5;align-items:center;background:#fff}
#nb-input{flex:1;border:1px solid #e0e6ec;border-radius:999px;padding:9px 14px;outline:none;font-size:14px;font-family:inherit;transition:border-color .15s,box-shadow .15s;background:#fafbfc}
#nb-input:focus{border-color:currentColor;background:#fff;box-shadow:0 0 0 3px rgba(0,0,0,.04)}
#nb-image-btn{background:none;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;width:36px;height:36px;border-radius:50%;transition:background .15s,color .15s;color:#8a95a0;flex-shrink:0}
#nb-image-btn:hover{background:#f1f4f7}
#nb-image-btn svg{width:20px;height:20px;display:block}
#nb-send{color:#fff;border:none;padding:0 16px;border-radius:999px;cursor:pointer;height:38px;font-family:inherit;font-weight:700;font-size:13px;flex-shrink:0;transition:transform .15s,box-shadow .15s,filter .15s}
#nb-send:hover{transform:translateY(-1px);box-shadow:0 4px 10px rgba(0,0,0,.12);filter:brightness(1.05)}
#nb-send:active{transform:translateY(0)}

/* ── FAB ───────────────────────────────────────── */
#nb-fab{width:55px;height:55px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;box-shadow:0 6px 22px rgba(0,0,0,.22);transition:transform .2s ease,box-shadow .2s ease}
#nb-fab:hover{transform:scale(1.06);box-shadow:0 10px 28px rgba(0,0,0,.28)}
#nb-fab svg{width:30px;height:30px}

/* ── Typing indicator ──────────────────────────── */
.nb-typing{display:flex;gap:5px;padding:12px 14px;align-items:center;min-height:34px}
.nb-typing span{width:8px;height:8px;border-radius:50%;animation:nb-bounce 1.3s infinite ease-in-out}
.nb-typing span:nth-child(2){animation-delay:.18s}
.nb-typing span:nth-child(3){animation-delay:.36s}
@keyframes nb-bounce{0%,80%,100%{transform:scale(.65);opacity:.45}40%{transform:scale(1);opacity:1}}
@keyframes nb-spin{to{transform:rotate(360deg)}}

/* ── Error/Retry ───────────────────────────────── */
.nb-error-msg{background:#fff5f5!important;border:1px solid #fbd5d5!important;border-right:4px solid #e74c3c!important;color:#b93a3a!important;box-shadow:none!important}
.nb-retry-btn{background:#e74c3c;color:#fff;border:none;padding:7px 16px;border-radius:999px;cursor:pointer;font-size:12.5px;margin-top:8px;font-family:inherit;font-weight:700;transition:background .15s,transform .15s}
.nb-retry-btn:hover{background:#c0392b;transform:translateY(-1px)}

/* ── Mobile ────────────────────────────────────── */
@media(max-width:480px){
    #nb-win{width:calc(100vw - 20px);height:calc(100dvh - 90px);max-height:600px;border-radius:16px;margin-bottom:8px}
    .nb-msg{font-size:13.5px;padding:9px 12px;max-width:92%;line-height:1.65}
    .nb-chat-img{max-width:170px;max-height:150px}
    #nb-input{font-size:16px;padding:9px 12px}
    #nb-fab{width:50px;height:50px}
    .nb-bot-link-btn{font-size:12.5px;padding:4px 10px}
}
