/**
 * AI Warning Banner Component Styles
 * Displays a warning about importing AI-generated XML
 * Author: iDevOpsLLC
 */

.ai-warning-banner {
    background: linear-gradient(90deg, rgba(232, 179, 102, 0.15), rgba(232, 179, 102, 0.05));
    border: 1px solid var(--accent-orange, #E8B366);
    border-left: 4px solid var(--accent-orange, #E8B366);
    border-radius: 4px;
    padding: 12px 16px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    color: var(--accent-orange, #E8B366);
}

.ai-warning-banner i {
    font-size: 18px;
    flex-shrink: 0;
}

.ai-warning-banner span {
    color: var(--text-primary, #F4F4F5);
    line-height: 1.4;
}

/* Ensure visibility in dark and light contexts */
.ai-warning-banner strong {
    color: var(--accent-orange, #E8B366);
    font-weight: 600;
}

/* Animation for banner appearance */
@keyframes warningSlideIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.ai-warning-banner {
    animation: warningSlideIn 0.3s ease;
}

/* Respect reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    .ai-warning-banner {
        animation: none;
    }
}