html { overscroll-behavior: none; }
button, a, input, select, textarea, .btn, .toggle, [role="button"], .agent-fab { touch-action: manipulation; }
.overflow-x-auto { -webkit-overflow-scrolling: touch; max-width: 100%; }
::selection { background-color: color-mix(in oklab, var(--color-primary) 30%, transparent); color: var(--color-base-content); }
::-moz-selection { background-color: color-mix(in oklab, var(--color-primary) 30%, transparent); color: var(--color-base-content); }
/* Typography: Plus Jakarta Sans */
[data-theme="halloween"] body { font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "SF Pro Display", sans-serif; }
[data-theme="halloween"] h1, [data-theme="halloween"] h2, [data-theme="halloween"] h3, [data-theme="halloween"] h4, [data-theme="halloween"] h5, [data-theme="halloween"] h6 { font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "SF Pro Display", sans-serif; }
/* CodeMirror Dark Theme Override */
[data-theme="halloween"] .cm-editor,
[data-theme="halloween"] .cm-editor .cm-scroller { background-color: #0f0f14 !important; color: #e5e7eb !important; border-radius: 12px; }
[data-theme="halloween"] .cm-editor { border: 1px solid rgba(167, 139, 250, 0.15) !important; border-radius: 12px !important; overflow: hidden; box-shadow: inset 0 2px 8px rgba(0,0,0,0.3); }
[data-theme="halloween"] .cm-editor .cm-gutters { background-color: #1a1a20 !important; color: rgba(167,139,250,0.4) !important; border-right: 1px solid rgba(167,139,250,0.1) !important; }
[data-theme="halloween"] .cm-editor .cm-activeLineGutter { background-color: rgba(167,139,250,0.08) !important; }
[data-theme="halloween"] .cm-editor .cm-activeLine { background-color: rgba(167,139,250,0.04) !important; }
[data-theme="halloween"] .cm-editor .cm-cursor, [data-theme="halloween"] .cm-editor .cm-dropCursor { border-left-color: #a78bfa !important; }
[data-theme="halloween"] .cm-editor .cm-content { caret-color: #a78bfa; font-family: 'JetBrains Mono', 'Fira Code', monospace; }
[data-theme="halloween"] .cm-editor .cm-selectionBackground { background: rgba(167,139,250,0.2) !important; }
[data-theme="halloween"] .cm-editor ::selection { background: rgba(167,139,250,0.2) !important; }
[data-theme="halloween"] .cm-editor .cm-meta { color: #a78bfa; }
[data-theme="halloween"] .cm-editor .cm-keyword { color: #c4b5fd; }
[data-theme="halloween"] .cm-editor .cm-atom { color: #f472b6; }
[data-theme="halloween"] .cm-editor .cm-number { color: #34d399; }
[data-theme="halloween"] .cm-editor .cm-string { color: #fbbf24; }
[data-theme="halloween"] .cm-editor .cm-def { color: #93c5fd; }
[data-theme="halloween"] .cm-editor .cm-comment { color: #6b7280; }
[data-theme="halloween"] .cm-editor .cm-tag { color: #a78bfa; }
[data-theme="halloween"] .cm-editor .cm-property { color: #c4b5fd; }
/* Heading typography */
[data-theme="halloween"] h1, [data-theme="halloween"] h2, [data-theme="halloween"] h3, [data-theme="halloween"] h4 { letter-spacing: -0.5px; font-weight: 700; }
[data-theme="halloween"] h1 { font-size: 1.75rem; letter-spacing: -1px; font-weight: 800; }
/* Links: Violet accent */
[data-theme="halloween"] a:not(.btn):not(.no-accent):not(.menu a) { color: #a78bfa; transition: color 0.2s ease; }
[data-theme="halloween"] a:not(.btn):not(.no-accent):not(.menu a):hover { color: #c4b5fd; }
/* Collapse: Violet borders */
[data-theme="halloween"] .collapse { background: rgba(255,255,255,0.03); border: 1px solid rgba(167,139,250,0.12); border-radius: 12px; }
[data-theme="halloween"] .collapse:focus-within { border-color: rgba(167,139,250,0.25); }
/* Code blocks */
[data-theme="halloween"] code:not(.cm-content code) { background: transparent; color: #c4b5fd; padding: 0; border-radius: 0; font-size: inherit; }
[data-theme="halloween"] pre { background: #0f0f14 !important; border: 1px solid rgba(167,139,250,0.12); border-radius: 12px; padding: 1rem; }
/* Animated Fibe Logo */
.animated-fibe-logo { position: relative; cursor: pointer; }
.fibe-glow-ring { position: absolute; inset: -0.5rem; border-radius: 9999px; will-change: transform; animation: fibe-spin 10s linear infinite; }
.fibe-glow-ring-inner { width: 100%; height: 100%; border-radius: 9999px; background: linear-gradient(to right, #ec4899, #8b5cf6, #06b6d4); opacity: 0.35; filter: blur(10px); }
.fibe-sparkle-container { position: absolute; inset: -1rem; pointer-events: none; }
.fibe-sparkle { position: absolute; width: 3px; height: 3px; background: #fde047; border-radius: 9999px; box-shadow: 0 0 6px 1px rgba(253,224,71,0.6); will-change: transform, opacity; animation: fibe-sparkle 3s ease-in-out infinite; }
.fibe-ping-ring { position: absolute; inset: -0.25rem; }
.fibe-ping-ring-inner { width: 100%; height: 100%; border-radius: 9999px; border: 1.5px solid; will-change: transform, opacity; }
.fibe-ping-slow { border-color: rgba(167,139,250,0.25); animation: fibe-ping 4s ease-in-out infinite; }
.fibe-ping-slower { border-color: rgba(244,114,182,0.2); animation: fibe-ping 5.5s ease-in-out infinite 1s; }
.fibe-logo-image { position: relative; z-index: 10; }
.fibe-logo-img { width: 100%; height: 100%; object-fit: contain; transition: transform 0.5s ease-out, filter 0.5s ease-out; filter: brightness(1.1) saturate(1.2) drop-shadow(0 0 10px rgba(168,85,247,0.6)); }
.animated-fibe-logo:hover .fibe-logo-img { transform: scale(1.2) rotate(12deg); filter: brightness(1.15) saturate(1.3) drop-shadow(0 0 20px rgba(236,72,153,0.9)); }
.fibe-radial-glow { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; z-index: -1; pointer-events: none; }
.fibe-radial-glow::after { content: ''; width: 70%; height: 70%; border-radius: 9999px; filter: blur(12px); background: radial-gradient(circle, rgba(139,92,246,0.4) 0%, rgba(236,72,153,0.2) 50%, transparent 75%); will-change: opacity, transform; animation: fibe-pulse 3s ease-in-out infinite; }
.fibe-energy-container { position: absolute; inset: 0; overflow: hidden; border-radius: 9999px; pointer-events: none; }
.fibe-energy-line { position: absolute; width: 3px; height: 40px; filter: blur(3px); will-change: transform, opacity; }
.fibe-energy-1 { left: 20%; background: linear-gradient(to bottom, #22d3ee, transparent); animation: fibe-energy 3.5s linear infinite; }
.fibe-energy-2 { left: 50%; background: linear-gradient(to bottom, #f472b6, transparent); animation: fibe-energy 3s linear infinite 0.7s; }
.fibe-energy-3 { left: 80%; background: linear-gradient(to bottom, #facc15, transparent); animation: fibe-energy 4s linear infinite 1.4s; }
.fibe-orbit { position: absolute; inset: 0; pointer-events: none; will-change: transform; }
.fibe-orbit-forward { animation: fibe-spin 10s linear infinite; }
.fibe-orbit-reverse { animation: fibe-spin-ccw 8s linear infinite; }
.fibe-orbit-dot { position: absolute; width: 5px; height: 5px; border-radius: 9999px; will-change: opacity, transform; animation: fibe-pulse 3s ease-in-out infinite; }
.fibe-orbit-dot-cyan { top: 0; left: 50%; margin-left: -2.5px; background: #22d3ee; box-shadow: 0 0 8px 1px rgba(34,211,238,0.6); }
.fibe-orbit-dot-pink { bottom: 0; left: 50%; margin-left: -2.5px; background: #f472b6; box-shadow: 0 0 8px 1px rgba(236,72,153,0.6); animation-delay: 0.5s; }
.fibe-explode-particle { position: absolute; top: 50%; left: 50%; width: 3px; height: 3px; background: white; border-radius: 9999px; box-shadow: 0 0 8px 2px rgba(255,255,255,0.7); pointer-events: none; will-change: transform, opacity; animation: fibe-explode 0.7s ease-out forwards; }
@keyframes fibe-spin { to { transform: rotate(360deg); } }
@keyframes fibe-spin-ccw { to { transform: rotate(-360deg); } }
@keyframes fibe-sparkle { 0%, 100% { opacity: 0; transform: scale(0) rotate(0deg); } 50% { opacity: 1; transform: scale(1.5) rotate(180deg); } }
@keyframes fibe-ping { 0%, 100% { transform: scale(1); opacity: 0.6; } 50% { transform: scale(1.25); opacity: 0.15; } }
@keyframes fibe-pulse { 0%, 100% { opacity: 0.4; transform: scale(1); } 50% { opacity: 0.7; transform: scale(1.08); } }
@keyframes fibe-energy { 0% { transform: translateY(-100%); opacity: 0; } 50% { opacity: 0.8; } 100% { transform: translateY(300%); opacity: 0; } }
@keyframes fibe-explode { 0% { opacity: 1; transform: translate(-50%,-50%) scale(1); } 100% { opacity: 0; transform: translate(-50%,-50%) scale(3.5); } }
@media (prefers-reduced-motion: reduce) { .fibe-glow-ring, .fibe-sparkle, .fibe-ping-ring-inner, .fibe-radial-glow::after, .fibe-energy-line, .fibe-orbit, .fibe-orbit-dot, .fibe-explode-particle { animation: none !important; } .fibe-logo-img { transition: none !important; } }

/* badge-ghost on light theme almost disappears against base-100 page bg.
   Bump it to base-300 so audit-log fallback badges remain visible.
   :where() drops specificity to 0; we need higher specificity to override DaisyUI's layer. */
html:not([data-theme="halloween"]) .badge.badge-ghost,
html:not([data-theme="halloween"]) span.badge-ghost,
html:not([data-theme="halloween"]) .badge-ghost {
  background-color: var(--color-base-300) !important;
  border-color: color-mix(in oklab, var(--color-base-content) 15%, transparent) !important;
  color: var(--color-base-content) !important;
}

/* Sidebar active nav item — force readable solid tint on light theme.
   Without this, themes whose body has a decorative gradient or whose --color-primary
   is too dark/light render the active pill with a noisy cream/peach/blue gradient.
   Exclude wizard-sidebar-glow children — those intentionally paint a shimmer gradient. */
html:not([data-theme="halloween"]) aside li:not(.wizard-sidebar-glow) > a.bg-primary\/10 {
  background-color: color-mix(in oklab, var(--color-primary) 12%, var(--color-base-100)) !important;
  background-image: none !important;
  color: var(--color-base-content) !important;
}
[data-theme="halloween"] aside li:not(.wizard-sidebar-glow) > a.bg-primary\/10 {
  background-image: none !important;
}

/* Theme-aware DaisyUI tooltip colors (default uses neutral; flip to neutral-content text) */
.tooltip { --tooltip-color: var(--color-neutral); --tooltip-text-color: var(--color-neutral-content); }
/* Bump tooltip z-index so it never sinks behind sticky headers / sidebar */
.tooltip:before, .tooltip:after { z-index: 999; }

/* Breadcrumb separator: dark theme renders the arrow with currentColor at 40% opacity,
   which on a light text base reads almost as bright as the page title. Tone it down. */
[data-theme="halloween"] .breadcrumbs li:before,
[data-theme="halloween"] .breadcrumbs li::before,
[data-theme="halloween"] .breadcrumbs *:where(li):before,
[data-theme="halloween"] .breadcrumbs > ul > li + *:before,
[data-theme="halloween"] .breadcrumbs > ol > li + *:before,
[data-theme="halloween"] .breadcrumbs > menu > li + *:before {
  opacity: 0.22 !important;
  color: oklch(60% 0.02 270) !important;
  border-color: oklch(60% 0.02 270) !important;
}

/* Fibe Dropdown Keyboard Hint Gradients (gradient bg always reads white text) */
.agent-action-kbd-hint {
  background: linear-gradient(135deg, #00A3AD, #00E5F2) !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
  box-shadow: 0 1px 3px rgba(0, 163, 173, 0.4) !important;
}

[data-theme="halloween"] .agent-action-kbd-hint {
  background: linear-gradient(135deg, #FF1A0D, #FF6A00) !important;
  color: white !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
  box-shadow: 0 1px 3px rgba(255, 26, 13, 0.4) !important;
}