/* Vigilex AI widget — adaptive, premium and compatible with legacy Chromium browsers.
   The widget intentionally avoids the newer CSS colour-mixing syntax so custom colours never make
   text disappear in browsers that do not support that newer CSS function. */
.vigilex-ai-root {
  --vigilex-ai-surface: var(--ai-light-panel-color, #ffffff);
  --vigilex-ai-surface-raised: #f8fafd;
  --vigilex-ai-surface-soft: #eff5fb;
  --vigilex-ai-text: #10213a;
  --vigilex-ai-muted: #60718a;
  --vigilex-ai-border: #d9e2ee;
  --vigilex-ai-border-strong: #b8c7d8;
  --vigilex-ai-header: var(--ai-light-header-color, #0f172a);
  --vigilex-ai-header-accent: var(--ai-light-header-accent, #2563eb);
  --vigilex-ai-header-text: var(--ai-light-header-text, #ffffff);
  --vigilex-ai-header-muted: rgba(255,255,255,.82);
  --vigilex-ai-header-control: rgba(255,255,255,.13);
  --vigilex-ai-header-control-border: rgba(255,255,255,.24);
  --vigilex-ai-widget: var(--ai-light-widget-color, #2563eb);
  --vigilex-ai-widget-text: var(--ai-light-widget-text, #ffffff);
  --vigilex-ai-user-bubble: var(--ai-light-user-bubble, #2563eb);
  --vigilex-ai-user-text: var(--ai-light-user-text, #ffffff);
  --vigilex-ai-agent-bubble: var(--ai-light-agent-bubble, #ffffff);
  --vigilex-ai-agent-text: var(--ai-light-agent-text, #142033);
  position: fixed;
  z-index: var(--ui-layer-ai, 900);
  right: 16px;
  right: max(16px, env(safe-area-inset-right));
  bottom: 16px;
  bottom: max(16px, env(safe-area-inset-bottom));
  width: 420px;
  max-width: calc(100vw - 24px);
  color: var(--vigilex-ai-text);
  font-family: var(--ui-font, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  isolation: isolate;
}
.vigilex-ai-root[data-ai-theme="dark"] {
  --vigilex-ai-surface: var(--ai-dark-panel-color, #0d1b2d);
  --vigilex-ai-surface-raised: #12243a;
  --vigilex-ai-surface-soft: #162b43;
  --vigilex-ai-text: #edf5ff;
  --vigilex-ai-muted: #aab9cb;
  --vigilex-ai-border: #28405b;
  --vigilex-ai-border-strong: #3d5a78;
  --vigilex-ai-header: var(--ai-dark-header-color, #122640);
  --vigilex-ai-header-accent: var(--ai-dark-header-accent, #235a9e);
  --vigilex-ai-header-text: var(--ai-dark-header-text, #edf5ff);
  --vigilex-ai-header-muted: #c0d0e2;
  --vigilex-ai-header-control: rgba(237,245,255,.10);
  --vigilex-ai-header-control-border: rgba(237,245,255,.22);
  --vigilex-ai-widget: var(--ai-dark-widget-color, #4c98ff);
  --vigilex-ai-widget-text: var(--ai-dark-widget-text, #07111f);
  --vigilex-ai-user-bubble: var(--ai-dark-user-bubble, #285c9e);
  --vigilex-ai-user-text: var(--ai-dark-user-text, #ffffff);
  --vigilex-ai-agent-bubble: var(--ai-dark-agent-bubble, #1e2f44);
  --vigilex-ai-agent-text: var(--ai-dark-agent-text, #edf5ff);
}
.vigilex-ai-root.ai-position-bottom-left { right: auto; left: 16px; left: max(16px, env(safe-area-inset-left)); }
.vigilex-ai-root.ai-position-top-right { top: 16px; top: max(16px, env(safe-area-inset-top)); bottom: auto; }
.vigilex-ai-root.ai-position-top-left { top: 16px; top: max(16px, env(safe-area-inset-top)); right: auto; bottom: auto; left: 16px; left: max(16px, env(safe-area-inset-left)); }

.vigilex-ai-launcher {
  position: relative;
  display: inline-flex;
  float: right;
  min-height: 52px;
  align-items: center;
  gap: 9px;
  padding: 8px 14px 8px 9px;
  border: 1px solid rgba(255,255,255,.32);
  border-radius: 16px;
  background: var(--vigilex-ai-widget);
  box-shadow: 0 16px 36px rgba(7,26,52,.28);
  color: var(--vigilex-ai-widget-text);
  font: inherit;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .01em;
  transition: transform 180ms ease, box-shadow 180ms ease, filter 180ms ease;
}
.ai-position-bottom-left .vigilex-ai-launcher,
.ai-position-top-left .vigilex-ai-launcher { float: left; }
.vigilex-ai-launcher:hover { box-shadow: 0 20px 44px rgba(7,26,52,.34); color: var(--vigilex-ai-widget-text); filter: brightness(1.05); transform: translateY(-2px); }
.vigilex-ai-launcher:focus-visible,
.vigilex-ai-icon:focus-visible,
.vigilex-ai-suggestions button:focus-visible,
.vigilex-ai-composer button:focus-visible,
.vigilex-ai-feedback button:focus-visible,
.vigilex-ai-work-item:focus-visible,
.vigilex-ai-confirm-button:focus-visible,
.vigilex-ai-cancel-button:focus-visible { outline: 3px solid #36cfd5; outline-offset: 3px; }
.vigilex-ai-launcher-icon { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 11px; background: rgba(255,255,255,.16); color: inherit; }
.vigilex-ai-launcher-icon .ui-icon { width: 18px; height: 18px; }
.vigilex-ai-launcher-label { max-width: 252px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vigilex-ai-active-dot { display: inline-block; width: 8px; height: 8px; flex: 0 0 8px; border-radius: 999px; background: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,.16); }
.vigilex-ai-active-dot.is-offline { background: #f97316; box-shadow: 0 0 0 3px rgba(249,115,22,.17); }

/* The closed state has one launcher. The open state has only one connected panel. */
.vigilex-ai-root.is-open .vigilex-ai-launcher { display: none; }
.vigilex-ai-panel[hidden] { display: none; }
.vigilex-ai-panel {
  display: flex;
  width: 100%;
  max-height: 760px;
  max-height: min(760px, calc(100dvh - 32px));
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--vigilex-ai-border-strong);
  border-radius: 20px;
  background: var(--vigilex-ai-surface);
  box-shadow: 0 24px 56px rgba(4,19,40,.30), 0 2px 8px rgba(4,19,40,.10);
  color: var(--vigilex-ai-text);
  animation: vigilex-ai-panel-in 180ms ease both;
}
@keyframes vigilex-ai-panel-in { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }

.vigilex-ai-head {
  display: flex;
  min-height: 68px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 15px;
  border-bottom: 1px solid var(--vigilex-ai-header-control-border);
  background: linear-gradient(135deg, var(--vigilex-ai-header), var(--vigilex-ai-header-accent));
  color: var(--vigilex-ai-header-text);
}
.vigilex-ai-brand { display: flex; min-width: 0; align-items: center; gap: 10px; }
.vigilex-ai-brand > span:last-child { display: grid; min-width: 0; gap: 3px; }
.vigilex-ai-brand strong { overflow: hidden; color: var(--vigilex-ai-header-text); font-size: .92rem; font-weight: 850; text-overflow: ellipsis; white-space: nowrap; }
.vigilex-ai-brand small { display: inline-flex; min-width: 0; align-items: center; gap: 6px; color: var(--vigilex-ai-header-text); font-size: .72rem; font-weight: 650; opacity: .78; }
.vigilex-ai-brand small span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vigilex-ai-avatar { display: grid; width: 36px; height: 36px; flex: 0 0 36px; place-items: center; overflow: hidden; border: 1px solid var(--vigilex-ai-header-text); border-radius: 12px; background: var(--vigilex-ai-header-control); color: var(--vigilex-ai-header-text); font-size: .8rem; font-weight: 850; object-fit: cover; }
.vigilex-ai-head-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 6px; }
.vigilex-ai-icon { display: grid; width: 34px; height: 34px; place-items: center; padding: 0; border: 1px solid var(--vigilex-ai-header-text); border-radius: 10px; background: var(--vigilex-ai-header-control); color: var(--vigilex-ai-header-text); opacity: .86; transition: background 160ms ease, transform 160ms ease, opacity 160ms ease; }
.vigilex-ai-icon:hover { background: rgba(255,255,255,.24); color: var(--vigilex-ai-header-text); opacity: 1; transform: translateY(-1px); }
.vigilex-ai-icon .ui-icon { width: 17px; height: 17px; }

.vigilex-ai-impersonation,
.vigilex-ai-notice { margin: 0; padding: 10px 15px; font-size: .73rem; line-height: 1.5; }
.vigilex-ai-impersonation { border-bottom: 1px solid var(--vigilex-ai-border); background: var(--vigilex-ai-surface-soft); color: var(--vigilex-ai-text); }
.vigilex-ai-impersonation a { color: var(--vigilex-ai-widget); font-weight: 800; }
.vigilex-ai-notice { border-bottom: 1px solid #d4ac63; background: #fff3d6; color: #5a3f0a; }
.vigilex-ai-root[data-ai-theme="dark"] .vigilex-ai-notice { border-color: #ae843d; background: #4a3918; color: #ffe3a4; }
.vigilex-ai-notice[hidden] { display: none; }

.vigilex-ai-messages { display: grid; min-height: 136px; max-height: 340px; max-height: min(340px, 37dvh); gap: 10px; overflow: auto; padding: 14px 15px; background: var(--vigilex-ai-surface-raised); scrollbar-gutter: stable; }
.vigilex-ai-messages:empty { display: none; min-height: 0; padding: 0; }
.vigilex-ai-message { max-width: 88%; padding: 10px 12px; border: 1px solid var(--vigilex-ai-border); border-radius: 14px 14px 14px 5px; background: var(--vigilex-ai-agent-bubble); color: var(--vigilex-ai-agent-text); font-size: .84rem; line-height: 1.5; overflow-wrap: anywhere; box-shadow: 0 4px 10px rgba(9,25,47,.06); }
.vigilex-ai-message.user { justify-self: end; border-color: var(--vigilex-ai-user-bubble); border-radius: 14px 14px 5px 14px; background: var(--vigilex-ai-user-bubble); color: var(--vigilex-ai-user-text); }
.vigilex-ai-message p { margin: 0; }
.vigilex-ai-message a { color: inherit; font-weight: 800; }
.vigilex-ai-feedback { display: flex; flex-wrap: wrap; gap: 5px; padding-top: 8px; }
.vigilex-ai-feedback button { min-height: 26px; padding: 4px 7px; border: 1px solid currentColor; border-radius: 8px; background: transparent; color: inherit; font-size: .68rem; font-weight: 750; opacity: .86; }
.vigilex-ai-feedback button:hover { opacity: 1; }
.vigilex-ai-feedback.is-sent { opacity: .58; pointer-events: none; }
.vigilex-ai-typing { display: flex; width: fit-content; gap: 4px; padding: 10px 12px; border: 1px solid var(--vigilex-ai-border); border-radius: 14px 14px 14px 5px; background: var(--vigilex-ai-agent-bubble); }
.vigilex-ai-typing i { display: block; width: 5px; height: 5px; border-radius: 50%; background: var(--vigilex-ai-muted); animation: vigilex-ai-bounce 900ms infinite ease-in-out; }
.vigilex-ai-typing i:nth-child(2) { animation-delay: 120ms; }
.vigilex-ai-typing i:nth-child(3) { animation-delay: 240ms; }
@keyframes vigilex-ai-bounce { 0%, 60%, 100% { transform: translateY(0); } 30% { transform: translateY(-4px); } }

.vigilex-ai-work-panel,
.vigilex-ai-confirmation,
.vigilex-ai-document-card,
.vigilex-ai-secure-card { display: grid; gap: 9px; margin: 12px 15px; padding: 12px; border: 1px solid var(--vigilex-ai-border); border-radius: 13px; background: var(--vigilex-ai-surface-soft); color: var(--vigilex-ai-text); }
.vigilex-ai-work-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: .78rem; }
.vigilex-ai-work-head strong,
.vigilex-ai-confirmation > strong,
.vigilex-ai-document-card strong,
.vigilex-ai-secure-title strong { color: var(--vigilex-ai-text); }
.vigilex-ai-work-head a,
.vigilex-ai-document-link { color: var(--vigilex-ai-widget); font-size: .75rem; font-weight: 850; }
.vigilex-ai-work-panel > p,
.vigilex-ai-document-card p { margin: 0; color: var(--vigilex-ai-muted); font-size: .78rem; }
.vigilex-ai-work-item { display: grid; width: 100%; gap: 3px; padding: 9px 10px; border: 1px solid var(--vigilex-ai-border); border-radius: 10px; background: var(--vigilex-ai-surface); color: var(--vigilex-ai-text); font-size: .75rem; font-weight: 750; text-align: left; }
.vigilex-ai-work-item:hover { border-color: var(--vigilex-ai-widget); color: var(--vigilex-ai-widget); }
.vigilex-ai-work-item small { color: var(--vigilex-ai-muted); }
.vigilex-ai-suggestions { display: flex; flex-wrap: wrap; gap: 7px; padding: 0 15px 12px; }
.vigilex-ai-suggestions:empty { display: none; }
.vigilex-ai-suggestions button { min-height: 31px; padding: 6px 9px; border: 1px solid var(--vigilex-ai-border); border-radius: 999px; background: var(--vigilex-ai-surface-soft); color: var(--vigilex-ai-text); font-size: .71rem; font-weight: 750; text-align: left; }
.vigilex-ai-suggestions button:hover { border-color: var(--vigilex-ai-widget); color: var(--vigilex-ai-widget); }

.vigilex-ai-composer { display: grid; grid-template-columns: minmax(0, 1fr) 42px; gap: 8px; padding: 11px 15px; border-top: 1px solid var(--vigilex-ai-border); background: var(--vigilex-ai-surface); }
.vigilex-ai-composer textarea { min-height: 42px; max-height: 116px; padding: 10px 12px; resize: none; border: 1px solid var(--vigilex-ai-border); border-radius: 12px; background: var(--vigilex-ai-surface-raised); color: var(--vigilex-ai-text); font-size: .83rem; line-height: 1.4; }
.vigilex-ai-composer textarea::placeholder { color: var(--vigilex-ai-muted); opacity: .85; }
.vigilex-ai-composer textarea:focus { border-color: var(--vigilex-ai-widget); box-shadow: 0 0 0 3px rgba(54,207,213,.20); outline: 0; }
.vigilex-ai-composer button { display: grid; width: 42px; height: 42px; place-items: center; padding: 0; border: 1px solid var(--vigilex-ai-widget); border-radius: 12px; background: var(--vigilex-ai-widget); color: var(--vigilex-ai-widget-text); }
.vigilex-ai-composer button:hover { filter: brightness(1.06); }
.vigilex-ai-composer button:disabled { opacity: .52; cursor: not-allowed; filter: none; }
.vigilex-ai-composer button .ui-icon { width: 18px; height: 18px; }

.vigilex-ai-confirmation dl { display: grid; gap: 7px; margin: 0; }
.vigilex-ai-confirmation dl div { display: grid; grid-template-columns: minmax(88px,.72fr) minmax(0,1.28fr); gap: 9px; }
.vigilex-ai-confirmation dt { color: var(--vigilex-ai-muted); font-size: .72rem; }
.vigilex-ai-confirmation dd { margin: 0; color: var(--vigilex-ai-text); font-size: .78rem; font-weight: 700; overflow-wrap: anywhere; }
.vigilex-ai-risk { width: fit-content; padding: 4px 7px; border-radius: 999px; background: #fff3d6; color: #7b5315; font-size: .67rem; font-weight: 800; text-transform: uppercase; }
.vigilex-ai-root[data-ai-theme="dark"] .vigilex-ai-risk { background: #4a3918; color: #ffe3a4; }
.vigilex-ai-card-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.vigilex-ai-confirm-button,
.vigilex-ai-cancel-button { min-height: 34px; padding: 7px 10px; border-radius: 9px; font-size: .75rem; font-weight: 800; }
.vigilex-ai-confirm-button { border: 1px solid var(--vigilex-ai-widget); background: var(--vigilex-ai-widget); color: var(--vigilex-ai-widget-text); }
.vigilex-ai-cancel-button { border: 1px solid var(--vigilex-ai-border); background: var(--vigilex-ai-surface); color: var(--vigilex-ai-text); }
.vigilex-ai-confirmation.is-confirmed { border-color: #54d89a; }
.vigilex-ai-secure-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.vigilex-ai-secure-title span { padding: 4px 7px; border-radius: 999px; background: var(--vigilex-ai-surface-raised); color: var(--vigilex-ai-muted); font-size: .66rem; font-weight: 800; }
.vigilex-ai-secure-card p { margin: 0; color: var(--vigilex-ai-muted); font-size: .75rem; }
.vigilex-ai-secure-form { display: grid; gap: 9px; }
.vigilex-ai-secure-form label { color: var(--vigilex-ai-text); font-size: .76rem; }
.vigilex-ai-secure-form input { width: 100%; min-height: 38px; padding: 8px 10px; border: 1px solid var(--vigilex-ai-border); border-radius: 9px; background: var(--vigilex-ai-surface); color: var(--vigilex-ai-text); }
.vigilex-ai-secure-check { display: flex !important; align-items: flex-start; gap: 8px; }
.vigilex-ai-secure-check input { width: 16px; min-height: 16px; margin-top: 2px; padding: 0; accent-color: var(--vigilex-ai-widget); }
.vigilex-ai-secure-status { min-height: 18px; }
.vigilex-ai-guest-auth-card input { min-height: 38px; }

@media (max-width: 560px) {
  .vigilex-ai-root { right: 10px; right: max(10px, env(safe-area-inset-right)); bottom: 10px; bottom: max(10px, env(safe-area-inset-bottom)); width: calc(100vw - 20px); }
  .vigilex-ai-root.ai-position-bottom-left,
  .vigilex-ai-root.ai-position-top-left { left: 10px; left: max(10px, env(safe-area-inset-left)); }
  .vigilex-ai-root.ai-position-top-right,
  .vigilex-ai-root.ai-position-top-left { top: 10px; top: max(10px, env(safe-area-inset-top)); }
  .vigilex-ai-panel { max-height: calc(100dvh - 20px); border-radius: 18px; }
  .vigilex-ai-messages { min-height: 124px; max-height: 31dvh; padding: 12px; }
  .vigilex-ai-work-panel,
  .vigilex-ai-confirmation,
  .vigilex-ai-document-card,
  .vigilex-ai-secure-card { margin-inline: 12px; }
  .vigilex-ai-suggestions,
  .vigilex-ai-composer,
  .vigilex-ai-impersonation,
  .vigilex-ai-notice { padding-inline: 12px; }
  .vigilex-ai-message { max-width: 92%; }
}
@media (max-width: 430px) {
  .vigilex-ai-launcher { width: 52px; min-height: 52px; justify-content: center; padding: 8px; }
  .vigilex-ai-launcher-label { display: none; }
  .vigilex-ai-launcher > .vigilex-ai-active-dot { position: absolute; top: 6px; right: 6px; }
  .vigilex-ai-head { min-height: 64px; padding: 12px; }
  .vigilex-ai-brand small { max-width: 195px; }
  .vigilex-ai-composer { grid-template-columns: minmax(0,1fr) 40px; padding-block: 10px; }
  .vigilex-ai-composer button { width: 40px; height: 42px; }
  .vigilex-ai-confirmation dl div { grid-template-columns: 1fr; gap: 2px; }
}
@media (prefers-reduced-motion: reduce) {
  .vigilex-ai-panel, .vigilex-ai-launcher, .vigilex-ai-icon { animation: none; transition-duration: .01ms; }
  .vigilex-ai-typing i { animation: none; }
}
