.nexus-callout-box { padding: 1rem 1.25rem; margin: 1.5rem 0 1.5rem 0; border-radius: 0 8px 8px 0; font-family: var(--nexus-font-sans, sans-serif); font-size: 0.95rem; line-height: 1.5; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); transition: all 0.2s ease; border: 1px solid transparent; border-left-width: 4px; } /* Light / Dark default support via variables or custom colors */ .nexus-callout-box { background-color: rgba(255, 255, 255, 0.02); color: #e2e8f0; } /* Info style */ .nexus-callout-info { border-left-color: var(--nexus-neon, #00ff99); } /* Warning style */ .nexus-callout-warning { border-left-color: #eab308; /* warning yellow */ background-color: rgba(234, 179, 8, 0.03); } /* Success style */ .nexus-callout-success { border-left-color: #10b981; /* success green */ background-color: rgba(16, 185, 129, 0.03); } /* Error style */ .nexus-callout-error { border-left-color: #f43f5e; /* error red */ background-color: rgba(244, 63, 94, 0.03); } .nexus-callout-header { display: flex; align-items: center; gap: 0.5rem; font-weight: 600; margin-bottom: 0.5rem; text-transform: uppercase; font-size: 0.8rem; letter-spacing: 0.05em; } .nexus-callout-info .nexus-callout-header { color: var(--nexus-neon, #00ff99); } .nexus-callout-warning .nexus-callout-header { color: #eab308; } .nexus-callout-success .nexus-callout-header { color: #10b981; } .nexus-callout-error .nexus-callout-header { color: #f43f5e; } .nexus-callout-icon { flex-shrink: 0; } .nexus-callout-body { opacity: 0.9; } /* Light theme support */ .theme-light .nexus-callout-box { background-color: #fcfcfb; border: 1px solid rgba(0, 0, 0, 0.03); border-left-width: 4px; color: #44403c; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.015); } .theme-light .nexus-callout-info { border-left-color: #10b981; background-color: rgba(16, 185, 129, 0.04); } .theme-light .nexus-callout-info .nexus-callout-header { color: #059669; } .theme-light .nexus-callout-warning { border-left-color: #d97706; background-color: rgba(217, 119, 6, 0.04); } .theme-light .nexus-callout-warning .nexus-callout-header { color: #d97706; } .theme-light .nexus-callout-success { border-left-color: #10b981; background-color: rgba(16, 185, 129, 0.04); } .theme-light .nexus-callout-success .nexus-callout-header { color: #059669; } .theme-light .nexus-callout-error { border-left-color: #e11d48; background-color: rgba(225, 29, 72, 0.04); } .theme-light .nexus-callout-error .nexus-callout-header { color: #e11d48; }