/* ZikBot floating chat widget */
#zikbot-root { --zb-accent: #0ea5e9; --zb-bg: #0a1628; font-family: Inter, system-ui, sans-serif; }
#zikbot-toggle {
    position: fixed; bottom: 24px; right: 24px; z-index: 99990;
    width: 58px; height: 58px; border-radius: 50%; border: none; cursor: pointer;
    background: linear-gradient(135deg, #0ea5e9, #6366f1);
    color: #fff; font-size: 26px; font-weight: 800;
    box-shadow: 0 8px 28px rgba(14,165,233,.45);
    transition: transform .2s, box-shadow .2s;
}
#zikbot-toggle:hover { transform: scale(1.06); box-shadow: 0 12px 36px rgba(14,165,233,.55); }
#zikbot-toggle .zb-label {
    position: absolute; right: 68px; top: 50%; transform: translateY(-50%);
    white-space: nowrap; background: #fff; color: #0f172a;
    padding: 8px 14px; border-radius: 10px; font-size: 13px; font-weight: 700;
    box-shadow: 0 4px 16px rgba(0,0,0,.15); pointer-events: none;
    opacity: 0; transition: opacity .2s;
}
#zikbot-toggle:hover .zb-label { opacity: 1; }
#zikbot-panel {
    position: fixed; bottom: 94px; right: 24px; z-index: 99991;
    width: min(380px, calc(100vw - 32px)); height: min(520px, calc(100vh - 120px));
    background: #fff; border-radius: 18px; overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,.35);
    display: none; flex-direction: column;
    border: 1px solid rgba(255,255,255,.1);
}
#zikbot-panel.is-open { display: flex; animation: zbSlide .25s ease; }
@keyframes zbSlide { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:none} }
.zb-head {
    background: linear-gradient(135deg, #0ea5e9, #6366f1);
    color: #fff; padding: 16px 18px; display: flex; align-items: center; gap: 12px;
}
.zb-head-av {
    width: 42px; height: 42px; border-radius: 12px; background: rgba(255,255,255,.2);
    display: flex; align-items: center; justify-content: center; font-size: 20px;
}
.zb-head-title { font-weight: 800; font-size: 16px; }
.zb-head-sub { font-size: 11.5px; opacity: .9; margin-top: 2px; }
.zb-close { margin-left: auto; background: rgba(255,255,255,.15); border: 0; color: #fff;
    width: 32px; height: 32px; border-radius: 8px; cursor: pointer; font-size: 16px; }
.zb-msgs { flex: 1; overflow-y: auto; padding: 14px; background: #f8fafc; display: flex; flex-direction: column; gap: 10px; }
.zb-msg { max-width: 88%; padding: 10px 14px; border-radius: 14px; font-size: 13.5px; line-height: 1.5; }
.zb-msg.bot { align-self: flex-start; background: #fff; color: #0f172a; border: 1px solid #e2e8f0; border-bottom-left-radius: 4px; }
.zb-msg.user { align-self: flex-end; background: linear-gradient(135deg,#0ea5e9,#6366f1); color: #fff; border-bottom-right-radius: 4px; }
.zb-form { display: flex; gap: 8px; padding: 12px; border-top: 1px solid #e2e8f0; background: #fff; }
.zb-form input {
    flex: 1; padding: 11px 14px; border: 1.5px solid #e2e8f0; border-radius: 11px; font-size: 14px;
}
.zb-form input:focus { outline: none; border-color: #0ea5e9; }
.zb-form button {
    padding: 0 16px; border: 0; border-radius: 11px; background: #0ea5e9; color: #fff;
    font-weight: 700; cursor: pointer;
}
.zb-sms-hint {
    padding: 8px 14px; font-size: 11px; color: #64748b; text-align: center; background: #f1f5f9;
    border-top: 1px solid #e2e8f0;
}
.zb-sms-hint a { color: #0ea5e9; font-weight: 700; text-decoration: none; }
@media (max-width:480px) {
    #zikbot-toggle { bottom: 16px; right: 16px; }
    #zikbot-panel { right: 16px; bottom: 82px; width: calc(100vw - 32px); }
    #zikbot-toggle .zb-label { display: none; }
}
