/* OCF AI assistant — the small floating icon and its chat window (public website and staff dashboard). */
.ai-fab { position: fixed; right: 20px; bottom: 84px; z-index: 95; width: 56px; height: 56px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 50%; background: linear-gradient(135deg, #302a78, #5a4fc4); color: #f5c842; font-size: 1.5rem; cursor: pointer; box-shadow: 0 12px 28px -8px rgba(48, 42, 120, 0.75); transition: transform 0.25s ease; }
.ai-fab:hover { transform: translateY(-3px); }
.ai-fab:focus-visible { outline: 3px solid #f5c842; outline-offset: 3px; }
.ai-fab::before { content: ""; position: absolute; inset: 0; border-radius: inherit; border: 2px solid #5a4fc4; animation: aiPulse 2.6s ease-out infinite; pointer-events: none; }
.ai-fab--dash { bottom: 20px; }
@keyframes aiPulse { 0% { transform: scale(1); opacity: 0.7; } 100% { transform: scale(1.5); opacity: 0; } }
.ai-open .ai-fab { display: none; }

.ai-widget { position: fixed; right: 20px; bottom: 20px; z-index: 250; width: min(390px, calc(100vw - 24px)); height: min(600px, calc(100vh - 40px)); display: flex; flex-direction: column; border-radius: 22px; background: #fff; box-shadow: 0 30px 80px -20px rgba(20, 16, 58, 0.55); overflow: hidden; border: 1px solid rgba(48, 42, 120, 0.12); font-size: 16px; }
.ai-widget[hidden] { display: none; }
.ai-widget .ai-widget-head { display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: #14103a; color: #fff; }
.ai-widget .ai-widget-head strong { display: block; font-weight: 700; }
.ai-widget .ai-widget-head small { display: block; font-size: 0.74rem; opacity: 0.75; }
.ai-widget .ai-widget-head a { margin-left: auto; color: #fff; opacity: 0.8; font-size: 1rem; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; }
.ai-widget .ai-widget-head a:hover { background: rgba(255, 255, 255, 0.12); opacity: 1; }
.ai-widget .ai-widget-close { flex: none; margin-left: auto; width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, 0.22); color: #fff; font-size: 1.05rem; cursor: pointer; display: grid; place-items: center; }
.ai-widget .ai-widget-close:hover { background: #f06f5f; }
.ai-widget .ai-widget-head > div { min-width: 0; }
.ai-widget .ai-widget-head a + .ai-widget-close { margin-left: 0; }
.ai-widget .ai-log { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; background: #faf7f1; }
.ai-widget .ai-msg { display: flex; gap: 8px; align-items: flex-start; max-width: none; width: auto; margin: 0; }
.ai-widget .ai-msg--me { justify-content: flex-end; }
.ai-widget .ai-avatar { flex: none; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, #302a78, #6a5fd1); color: #f5c842; font-size: 0.95rem; }
.ai-widget .ai-bubble { min-width: 0; padding: 10px 14px; border-radius: 16px; border-top-left-radius: 4px; background: #fff; color: #2c2a3a; font-size: 0.92rem; line-height: 1.55; overflow-wrap: anywhere; box-shadow: 0 1px 2px rgba(20, 16, 58, 0.08); }
.ai-widget .ai-msg--me .ai-bubble { background: #302a78; color: #fff; border-radius: 16px; border-bottom-right-radius: 4px; max-width: 85%; white-space: pre-wrap; }
.ai-widget .ai-msg--error .ai-bubble { background: #fdecea; color: #a3301f; }
.ai-widget .ai-bubble p { margin: 0 0 0.6em; }
.ai-widget .ai-bubble > :last-child { margin-bottom: 0; }
.ai-widget .ai-bubble ul, .ai-widget .ai-bubble ol { margin: 0 0 0.6em; padding-left: 20px; }
.ai-widget .ai-bubble h4 { margin: 0.6em 0 0.3em; font-size: 0.95rem; }
.ai-widget .ai-bubble a { color: #302a78; text-decoration: underline; }
.ai-widget .ai-bubble code { background: #eeedf8; padding: 1px 5px; border-radius: 4px; font-size: 0.86em; }
.ai-widget .ai-bubble pre { overflow-x: auto; margin: 0 0 0.6em; padding: 10px; border-radius: 8px; background: #1b1649; color: #f1f0fa; font-size: 0.8rem; }
.ai-widget .ai-bubble pre code { background: none; padding: 0; }
.ai-widget .ai-copy { display: none; }
.ai-widget .ai-ideas { display: flex; flex-wrap: wrap; gap: 8px; padding-left: 40px; margin: 0; grid-template-columns: none; }
.ai-widget .ai-idea { display: inline-block; padding: 7px 12px; border-radius: 999px; border: 1px solid rgba(48, 42, 120, 0.25); background: #fff; color: #302a78; font: 600 0.8rem inherit; font-family: inherit; cursor: pointer; text-align: left; }
.ai-widget .ai-idea:hover { background: #302a78; color: #fff; }
.ai-dots { display: inline-flex; gap: 5px; padding: 4px 2px; }
.ai-dots i { width: 7px; height: 7px; border-radius: 50%; background: #302a78; opacity: 0.35; animation: aiDot 1.2s infinite ease-in-out; }
.ai-dots i:nth-child(2) { animation-delay: 0.15s; }
.ai-dots i:nth-child(3) { animation-delay: 0.3s; }
@keyframes aiDot { 0%, 80%, 100% { transform: translateY(0); opacity: 0.35; } 40% { transform: translateY(-5px); opacity: 1; } }
.ai-widget .ai-form { display: flex; gap: 8px; align-items: flex-end; padding: 12px; border-top: 1px solid rgba(48, 42, 120, 0.12); background: #fff; }
.ai-widget .ai-form textarea { flex: 1; resize: none; max-height: 120px; padding: 11px 14px; border-radius: 14px; border: 1px solid rgba(48, 42, 120, 0.2); font: inherit; font-size: 0.92rem; line-height: 1.4; background: #fff; width: auto; }
.ai-widget .ai-form textarea:focus { outline: 2px solid #302a78; outline-offset: 1px; }
.ai-widget .ai-form button { flex: none; width: 44px; height: 44px; padding: 0; border-radius: 50%; border: 0; background: #302a78; color: #fff; cursor: pointer; }
.ai-widget .ai-form button:disabled { opacity: 0.5; cursor: default; }
.ai-widget .ai-foot { margin: 0; padding: 0 12px 10px; font-size: 0.7rem; color: #625f74; text-align: center; background: #fff; }
.ai-widget .ai-foot a { color: #302a78; text-decoration: underline; }
@media (max-width: 720px) {
  .ai-fab { right: 16px; bottom: 80px; }
  .ai-fab--dash { bottom: 16px; }
  .ai-widget { right: 0; bottom: 0; width: 100vw; height: 100dvh; border-radius: 0; border: 0; }
}
@media print { .ai-fab, .ai-widget { display: none !important; } }