/* Police Help Assistant - colourful launcher + guided chat window */
/* ---- launcher ---- */
.cb-fab{position:fixed;right:18px;bottom:90px;z-index:62;display:flex;align-items:center;gap:10px;padding:7px 18px 7px 8px;border:0;border-radius:999px;cursor:pointer;color:#fff;font:inherit;
  background:linear-gradient(120deg,#ff5f6d,#ffb347 28%,#34d399 55%,#2f80ed 80%,#a855f7);background-size:260% 100%;animation:cbflow 6s linear infinite,cbbob 3.2s ease-in-out infinite;
  box-shadow:0 12px 30px rgba(10,77,162,.4),0 0 0 4px rgba(255,255,255,.85)}
.cb-fab:hover{transform:scale(1.05);animation-play-state:running,paused}
.cb-fab::before{content:"";position:absolute;inset:-4px;border-radius:inherit;border:3px solid rgba(255,255,255,.9);animation:cbring 2.4s ease-out infinite;pointer-events:none}
.cb-face{position:relative;width:52px;height:52px;border-radius:50%;background:#fff;display:grid;place-items:center;flex:none;box-shadow:0 3px 10px rgba(0,0,0,.2);animation:cbwave 5s ease-in-out infinite}
.cb-dot{position:absolute;right:1px;bottom:3px;width:13px;height:13px;border-radius:50%;background:#22c55e;border:2.5px solid #fff}
.cb-lbl{display:flex;flex-direction:column;line-height:1.15;text-align:left;text-shadow:0 1px 6px rgba(0,0,0,.35)}
.cb-lbl b{font-size:1rem}.cb-lbl small{font-size:.72rem;opacity:.95}
.cb-fab .i-x{display:none}.cb-fab.open .cb-face,.cb-fab.open .cb-lbl{display:none}.cb-fab.open .i-x{display:block}
.cb-fab.open{padding:15px;background:linear-gradient(135deg,#0a4da2,#14b8d4);animation:none}.cb-fab.open::before{display:none}
@keyframes cbflow{to{background-position:260% 0}}
@keyframes cbbob{0%,100%{translate:0 0}50%{translate:0 -6px}}
@keyframes cbring{0%{transform:scale(1);opacity:.9}100%{transform:scale(1.22,1.45);opacity:0}}
@keyframes cbwave{0%,88%,100%{rotate:0deg}92%{rotate:-12deg}96%{rotate:10deg}}
/* greeting bubble */
.cb-bubble{position:fixed;right:24px;bottom:158px;z-index:62;max-width:230px;background:#fff;color:#10233f;padding:12px 30px 12px 14px;border-radius:18px 18px 4px 18px;box-shadow:0 12px 30px rgba(10,77,162,.3);font-weight:600;font-size:.92rem;cursor:pointer;border:2px solid #2f80ed;animation:cbpop .5s cubic-bezier(.3,1.6,.5,1)}
.cb-bubble[hidden]{display:none}
.cb-bx{position:absolute;top:4px;right:6px;border:0;background:none;font-size:1.2rem;line-height:1;color:#5a6b82;cursor:pointer}
@keyframes cbpop{from{transform:scale(.6) translateY(14px);opacity:0}}
/* ---- window ---- */
.chat.cb{right:18px;bottom:168px;width:min(400px,calc(100vw - 24px));height:min(640px,calc(100dvh - 190px));border-radius:24px;z-index:63;box-shadow:0 28px 70px rgba(7,58,125,.4);border:1px solid rgba(10,77,162,.15)}
.chat.cb header{background:linear-gradient(120deg,#0a4da2,#2f80ed 55%,#14b8d4);padding:14px 14px}
.chat.cb header .bot{background:rgba(255,255,255,.28);font-size:1.5rem;width:46px;height:46px}
.chat.cb header button{margin-left:0}.chat.cb header #chatRestart{margin-left:auto}
.chat.cb .msgs{background:linear-gradient(180deg,#eef5ff,#f8fbff);padding:14px 12px;gap:10px;scroll-behavior:smooth}
.chat.cb .m{max-width:90%;font-size:.95rem;box-shadow:0 2px 8px rgba(10,77,162,.08)}
.chat.cb .m.me{background:linear-gradient(135deg,#0a4da2,#2f80ed)}
.chat.cb .m.typing{padding:12px 16px;display:flex;gap:5px}
.td{width:8px;height:8px;border-radius:50%;background:#2f80ed;animation:cbtd 1s infinite}.td:nth-child(2){animation-delay:.15s;background:#14b8d4}.td:nth-child(3){animation-delay:.3s;background:#a855f7}
@keyframes cbtd{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-6px);opacity:1}}
/* category tiles */
.cb-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;animation:cbpop .35s ease-out}
.cb-grid .cbt{border:0;border-radius:16px;padding:12px 10px;color:#fff;font:inherit;font-weight:700;font-size:.88rem;line-height:1.2;text-align:left;cursor:pointer;display:flex;align-items:center;gap:9px;box-shadow:0 6px 14px rgba(0,0,0,.18);transition:transform .2s,box-shadow .2s;min-height:58px}
.cb-grid .cbt:hover,.cb-grid .cbt:focus-visible{transform:translateY(-3px) scale(1.03);box-shadow:0 12px 22px rgba(0,0,0,.25)}
.cb-grid .cbt i{font-style:normal;font-size:1.5rem;width:38px;height:38px;border-radius:12px;background:rgba(255,255,255,.25);display:grid;place-items:center;flex:none}
.cb-grid .cbt:last-child:nth-child(odd){grid-column:1/-1}
.k1{background:linear-gradient(135deg,#0a4da2,#2f80ed)}.k2{background:linear-gradient(135deg,#7c3aed,#a855f7)}.k3{background:linear-gradient(135deg,#db2777,#f472b6)}
.k4{background:linear-gradient(135deg,#ea580c,#fbbf24)}.k5{background:linear-gradient(135deg,#059669,#34d399)}.k6{background:linear-gradient(135deg,#0891b2,#22d3ee)}.k7{background:linear-gradient(135deg,#475569,#94a3b8)}
/* question chips */
.chiprow{display:flex;flex-wrap:wrap;gap:7px;animation:cbpop .3s ease-out}
.chiprow.qlist{flex-direction:column;align-items:stretch}
.qc{border:0;border-radius:14px;padding:10px 14px;color:#fff;font:inherit;font-size:.9rem;font-weight:600;cursor:pointer;text-align:left;line-height:1.3;box-shadow:0 4px 10px rgba(0,0,0,.14);transition:.2s}
.qc:hover:not(:disabled){transform:translateX(4px);filter:brightness(1.07)}
.qc.ghost{background:#fff;color:#0a4da2;border:2px solid #2f80ed;box-shadow:none;text-align:center}
.chiprow:not(.qlist) .qc{border-radius:999px;padding:7px 14px}
/* action buttons inside answers */
.acts{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.ab{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:8px 14px;font-size:.86rem;font-weight:700;color:#fff;box-shadow:0 4px 10px rgba(0,0,0,.18);transition:.2s}
.ab:hover{transform:translateY(-2px);text-decoration:none;filter:brightness(1.08)}
.ab-call{background:linear-gradient(135deg,#16a34a,#4ade80)}.ab-link{background:linear-gradient(135deg,#0a4da2,#2f80ed)}.ab-ext{background:linear-gradient(135deg,#7c3aed,#a855f7)}
/* quick bar */
.cb-bar{display:flex;gap:8px;padding:8px 10px;background:#fff;border-top:1px solid var(--line)}
.cb-bar>*{flex:1;text-align:center;border:0;border-radius:12px;padding:8px 6px;font:inherit;font-size:.82rem;font-weight:700;color:#fff;cursor:pointer;transition:.2s;white-space:nowrap}
.cb-bar>*:hover{transform:translateY(-2px);text-decoration:none;filter:brightness(1.08)}
.b-menu{background:linear-gradient(135deg,#0a4da2,#2f80ed)}.b-call{background:linear-gradient(135deg,#e53935,#ff7043)}.b-wa{background:linear-gradient(135deg,#128c7e,#25d366)}
.chat.cb form{padding:8px 10px 6px;border-top:0}
.chat.cb form input{border:2px solid #c9d7ea;font-size:16px}.chat.cb form input:focus{outline:0;border-color:#2f80ed}
.chat.cb form button{background:linear-gradient(135deg,#ff5f6d,#ffb347)}
/* page-specific: engage page has a bottom tab bar on mobile */
body:has(.eg-tabbar) .cb-fab{bottom:150px!important}
body:has(.eg-tabbar) .cb-bubble{bottom:218px}
/* mobile: bottom sheet */
@media(max-width:640px){
  .cb-fab{right:12px;bottom:84px;padding:6px 14px 6px 6px}.cb-face{width:46px;height:46px}.cb-lbl b{font-size:.9rem}
  .cb-bubble{right:14px;bottom:148px}
  .chat.cb{right:0;left:0;bottom:0;width:100%;height:88dvh;border-radius:24px 24px 0 0}
  .cb-grid .cbt{font-size:.82rem;padding:10px 8px}
  body:has(.cb:not([hidden])){overflow:hidden}
  .cb-fab.open{bottom:auto;top:12px;right:12px;padding:10px;z-index:70;position:fixed}
}
@media(prefers-reduced-motion:reduce){.cb-fab,.cb-face,.cb-fab::before{animation:none!important}}

/* header logo */
.chat.cb header .bot img{width:34px;height:auto}

/* ================= design v4 "Aurora" - AI assistant ================= */

/* ---- launcher: pill with the police emblem ---- */
.chat-fab.cb-fab{
  width:auto!important;height:auto!important;border-radius:999px!important;
  padding:7px 20px 7px 7px;gap:11px;border:1px solid rgba(255,255,255,.35);
  background:linear-gradient(120deg,#6d28d9,#4338ca 45%,#0e7490 80%,#6d28d9);background-size:240% 100%;
  box-shadow:0 16px 36px rgba(60,40,180,.42),0 0 0 5px rgba(255,255,255,.5);
  animation:cbflow 7s linear infinite,cbbob 4.2s ease-in-out infinite}
.chat-fab.cb-fab:hover{transform:translateY(-3px) scale(1.03);animation-play-state:running,paused}
.chat-fab.cb-fab::before{display:block;border:2px solid rgba(255,255,255,.7);animation:cbpulse 2.8s ease-out infinite}
@keyframes cbpulse{0%{transform:scale(1);opacity:.85}100%{transform:scale(1.18,1.35);opacity:0}}
.cb-face{width:48px;height:48px;border-radius:50%;background:#fff url("../img/logo.png") center/30px no-repeat;box-shadow:0 4px 12px rgba(20,10,70,.25);animation:none}
.cb-face svg{display:none}
.cb-dot{right:2px;bottom:4px;width:12px;height:12px;background:#34d399;border:2.5px solid #fff;animation:cbdot 2.2s infinite}
@keyframes cbdot{0%,100%{box-shadow:0 0 0 0 rgba(52,211,153,.6)}50%{box-shadow:0 0 0 5px rgba(52,211,153,0)}}
.cb-lbl b{font-size:.97rem;letter-spacing:.01em}.cb-lbl small{font-size:.71rem;opacity:.9}
.chat-fab.cb-fab.open{width:52px!important;height:52px!important;padding:0;border-radius:50%!important;background:linear-gradient(135deg,#4c1d95,#0e7490);animation:none;display:grid;place-items:center}
.chat-fab.cb-fab.open::before{display:none}
.chat-fab.cb-fab.open .i-x{display:block}

/* ---- greeting bubble ---- */
.cb-bubble{border:1.5px solid transparent;border-radius:20px 20px 6px 20px;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(120deg,#7c3aed,#0e7490) border-box;color:#1c1740;box-shadow:0 18px 40px rgba(60,40,180,.26);padding:12px 30px 12px 15px}
.cb-bubble::after{content:"";position:absolute;right:16px;bottom:-7px;width:14px;height:14px;background:#fff;border-right:1.5px solid #7c3aed;border-bottom:1.5px solid #7c3aed;transform:rotate(45deg);border-radius:0 0 3px 0}
.cb-bx{color:#6b6a90}

/* ---- window ---- */
.chat.cb{width:min(408px,calc(100vw - 24px));height:min(660px,calc(100dvh - 178px));border-radius:26px;border:1px solid rgba(90,70,220,.18);box-shadow:0 34px 80px rgba(30,20,90,.42);overflow:hidden}
.chat.cb header{position:relative;overflow:hidden;background:linear-gradient(125deg,#2a1a6b,#4326b8 50%,#0b7f95);padding:14px 16px;gap:12px}
.chat.cb header::before{content:"";position:absolute;right:-40px;top:-90px;width:230px;height:230px;border-radius:50%;background:radial-gradient(circle,rgba(34,211,238,.55),transparent 65%);filter:blur(4px);pointer-events:none}
.chat.cb header .bot{width:44px;height:44px;flex:none;border-radius:50%;background:#fff url("../img/logo.png") center/30px no-repeat;box-shadow:0 6px 16px rgba(15,8,60,.3);position:relative;z-index:1}
.chat.cb header .bot img{display:none}
.chat.cb header div{position:relative;z-index:1}
.chat.cb header strong{font-size:.98rem;font-weight:700;color:#fff}
.chat.cb header strong::after{content:"AI";margin-left:8px;font-size:.58rem;font-weight:800;letter-spacing:.14em;padding:2px 7px;border-radius:999px;background:linear-gradient(120deg,#22d3ee,#a78bfa);color:#12103a;vertical-align:2px}
.chat.cb header small{color:#cfd7ff;font-size:.73rem}
.chat.cb header .dot{background:#4ade80;box-shadow:0 0 0 3px rgba(74,222,128,.25)}
.chat.cb header button{background:rgba(255,255,255,.16);border-radius:50%;width:30px;height:30px;transition:.2s}
.chat.cb header button:hover{background:rgba(255,255,255,.32);transform:rotate(-8deg)}

/* ---- messages ---- */
.chat.cb .msgs{background:radial-gradient(120% 60% at 8% 0%,#f2f0ff,#f8f9ff 55%,#eef8ff);padding:16px 13px;gap:11px;scroll-behavior:smooth}
.chat.cb .m{max-width:87%;font-size:.93rem;line-height:1.55;padding:10px 14px;border-radius:4px 16px 16px 16px;background:#fff;color:#1d1a3c;border:1px solid #e7e6f9;box-shadow:0 6px 18px rgba(40,30,120,.08)}
.chat.cb .m p{margin:0}
.chat.cb .m.bot{position:relative;padding-left:44px}
.chat.cb .m.bot::before{content:"";position:absolute;left:10px;top:11px;width:24px;height:24px;border-radius:50%;background:#fff url("../img/logo.png") center/17px no-repeat;border:1px solid #eceafd;box-shadow:0 2px 6px rgba(40,25,110,.16)}
.chat.cb .m.me{border-radius:16px 16px 4px 16px;border:0;color:#fff;background:linear-gradient(120deg,#7c3aed,#4f46e5 60%,#0891b2);box-shadow:0 10px 24px rgba(79,70,229,.3)}
.chat.cb .m.typing{padding:14px 16px 14px 44px;display:flex;align-items:center;gap:5px}
.chat.cb .m.typing .td{width:7px;height:7px}
.td{background:#7c3aed}.td:nth-child(2){background:#22d3ee}.td:nth-child(3){background:#f472b6}

/* ---- category tiles ---- */
.cb-grid{gap:9px}
.cb-grid .cbt{border:0;border-radius:16px;padding:11px 12px;color:#fff;font-size:.86rem;font-weight:700;min-height:60px;box-shadow:0 10px 20px rgba(40,28,120,.16);transition:transform .18s,box-shadow .18s,filter .18s}
.cb-grid .cbt:hover,.cb-grid .cbt:focus-visible{transform:translateY(-3px) scale(1.02);box-shadow:0 16px 28px rgba(40,28,120,.26);filter:saturate(1.12)}
.cb-grid .cbt i{background:rgba(255,255,255,.22);font-size:1.35rem;border-radius:12px}
.k1{background:linear-gradient(135deg,#7c3aed,#4f46e5)}
.k2{background:linear-gradient(135deg,#db2777,#f472b6)}
.k3{background:linear-gradient(135deg,#0891b2,#22d3ee)}
.k4{background:linear-gradient(135deg,#ea580c,#fbbf24)}
.k5{background:linear-gradient(135deg,#059669,#34d399)}
.k6{background:linear-gradient(135deg,#4338ca,#818cf8)}
.k7{background:linear-gradient(135deg,#475569,#94a3b8)}
.k8{background:linear-gradient(135deg,#b45309,#f59e0b)}
.k9{background:linear-gradient(135deg,#be123c,#fb7185)}
.cb-pop-h{margin:4px 2px 0;font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#6b6a90}

/* ---- question chips ---- */
.chiprow{gap:8px}
.qc{border-radius:999px;padding:9px 14px;font-size:.87rem;font-weight:600;color:#241c52;background:#fff;border:1px solid #e2e3f7;box-shadow:0 3px 10px rgba(40,30,120,.06);transition:.2s}
.qc:hover:not(:disabled){color:#fff;background:linear-gradient(120deg,#7c3aed,#4f46e5);border-color:transparent;transform:translateX(3px);filter:none}
.chiprow.qlist .qc{border-radius:14px}
.qc.ghost{color:#4338ca;font-weight:700;border:1.5px solid transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(120deg,#a78bfa,#22d3ee) border-box}
.qc.ghost:hover:not(:disabled){color:#fff;background:linear-gradient(120deg,#6d28d9,#0891b2);border-color:transparent}

/* ---- action buttons in answers ---- */
.acts{gap:8px;margin-top:11px}
.ab{border-radius:999px;padding:8px 15px;font-size:.84rem;box-shadow:0 8px 18px rgba(50,35,150,.2)}
.ab-call{background:linear-gradient(120deg,#059669,#34d399)}
.ab-link{background:linear-gradient(120deg,#6d28d9,#4f46e5)}
.ab-ext{background:linear-gradient(120deg,#0e7490,#22d3ee);color:#062a33}

/* ---- bottom bar + input ---- */
.cb-bar{gap:7px;padding:9px 11px;background:#fff;border-top:1px solid #eceafd}
.cb-bar>*{border-radius:11px;padding:9px 6px;font-size:.8rem;box-shadow:0 4px 10px rgba(40,30,120,.14)}
.cb-bar>*:hover{transform:translateY(-2px);filter:none}
.b-menu{background:linear-gradient(120deg,#4338ca,#6d28d9)}
.b-call{background:linear-gradient(120deg,#e11d48,#fb7185)}
.b-wa{background:linear-gradient(120deg,#0f766e,#25d366)}
.chat.cb form{padding:10px 11px 8px;gap:8px;background:#fff;border-top:0}
.chat.cb form input{border:1.5px solid #ddd9f6;border-radius:999px;padding:10px 16px;background:#fbfaff;font-size:16px}
.chat.cb form input:focus{border-color:#7c3aed;box-shadow:0 0 0 4px rgba(124,58,237,.14);background:#fff;outline:0}
.chat.cb form button{width:42px;height:42px;flex:none;border-radius:50%;background:linear-gradient(120deg,#7c3aed,#0891b2);box-shadow:0 8px 18px rgba(80,50,220,.35);transition:.2s}
.chat.cb form button:hover{filter:brightness(1.1);transform:scale(1.06)}
.chat-note{margin:0;padding:0 12px 9px;font-size:.7rem;color:#7a7899;background:#fff}

/* ---- mobile: bottom sheet ---- */
@media(max-width:640px){
  .chat-fab.cb-fab{padding:6px 14px 6px 6px;bottom:84px}
  .cb-face{width:44px;height:44px;background-size:26px}
  .cb-lbl b{font-size:.9rem}
  .cb-bubble{bottom:148px}
  .chat.cb{width:100%;height:90dvh;border-radius:24px 24px 0 0}
  .chat.cb header{padding:16px 14px 12px}
  .chat.cb header::after{content:"";position:absolute;top:7px;left:50%;translate:-50% 0;width:44px;height:4px;border-radius:99px;background:rgba(255,255,255,.45)}
  .chat.cb .m{font-size:.92rem}
  .chat-fab.cb-fab.open{bottom:auto;top:12px;right:12px;z-index:70}
}
/* ---- mobile polish ---- */
@media(max-width:640px){
  .chat.cb header{padding:16px 12px 12px;gap:10px}
  .chat.cb header .bot{width:40px;height:40px;background-size:26px}
  .chat.cb header button{width:34px;height:34px;font-size:1.1rem}
  .chat.cb header strong::after{display:none}
  .chat.cb .msgs{padding:14px 11px 10px}
  .chat.cb .m{max-width:92%;font-size:.92rem}
  .chat.cb .m.bot{padding-left:42px}
  .chat.cb .m.bot::before{left:8px;top:10px;width:22px;height:22px;background-size:15px}
  .cb-grid .cbt{min-height:56px;font-size:.8rem;padding:9px 8px}
  .cb-grid .cbt i{width:32px;height:32px;font-size:1.15rem}
  .qc{font-size:.85rem;padding:10px 13px}
  .cb-bar>*{font-size:.78rem;padding:10px 4px}
  .chat.cb form{padding:9px 10px 6px}
  .chat-note{font-size:.66rem;padding-bottom:10px}
}
@media(prefers-reduced-motion:reduce){
  .chat-fab.cb-fab,.cb-face,.cb-fab::before,.cb-dot,.td{animation:none!important}
}
