/* Theme Fixes for Accordion AI Responses and Other Components */

/* Ensure all text in accordion uses theme colors */
.ai-responses-accordion,
.ai-responses-accordion * {
    color: var(--color-text-primary) !important;
}

.ai-responses-accordion h1,
.ai-responses-accordion h2,
.ai-responses-accordion h3,
.ai-responses-accordion h4,
.ai-responses-accordion h5,
.ai-responses-accordion h6 {
    color: var(--color-text-primary) !important;
}

.ai-responses-accordion p,
.ai-responses-accordion span,
.ai-responses-accordion div {
    color: inherit;
}

/* Fix for response content text */
.accordion-content .message-content,
.accordion-content .message-content * {
    color: var(--color-text-primary);
}

/* Fix for code blocks in accordion */
.accordion-content pre,
.accordion-content code {
    background-color: var(--color-surface-secondary) !important;
    color: var(--color-text-primary) !important;
}

/* Fix for "Other responses available" section */
.other-responses,
.other-responses * {
    color: inherit;
}

.other-responses .responses-header {
    color: var(--color-text-secondary) !important;
}

.other-responses .response-preview {
    background: var(--color-surface) !important;
    color: var(--color-text-primary) !important;
}

.other-responses .preview-model,
.other-responses .preview-model * {
    color: var(--color-text-primary) !important;
}

/* Fix icons in preview model */
.preview-model i {
    opacity: 0.9;
}

/* Dark theme specific fixes */
[data-theme="dark"] .other-responses {
    background: var(--color-surface) !important;
}

[data-theme="dark"] .response-preview {
    background: var(--color-surface-secondary) !important;
}

[data-theme="dark"] .response-preview:hover {
    background: var(--color-background) !important;
}

/* Fix for modal content */
.modal-content,
.modal-content * {
    color: var(--color-text-primary);
}

.modal-header,
.modal-title {
    color: var(--color-text-primary) !important;
}

.modal-body {
    color: var(--color-text-primary) !important;
}

/* Fix for badges and meta items */
.badge {
    color: inherit;
}

.meta-item,
.meta-item * {
    color: var(--color-text-secondary);
}

/* Ensure proper contrast for all interactive elements */
button:not(.btn-primary):not(.btn-secondary) {
    color: var(--color-text-primary);
}

/* Fix for summary cards */
.summary-card p strong {
    color: var(--color-text-primary) !important;
}

/* Fix for any remaining text color issues */
.text-primary {
    color: var(--color-primary) !important;
}

.text-secondary {
    color: var(--color-text-secondary) !important;
}

.text-muted {
    color: var(--color-text-tertiary) !important;
}

/* Ensure AI content respects theme */
.aicontent,
.aicontent * {
    color: inherit;
}

/* Fix for markdown content */
.markdown-content,
.markdown-content * {
    color: var(--color-text-primary) !important;
}

.markdown-content h1,
.markdown-content h2,
.markdown-content h3,
.markdown-content h4,
.markdown-content h5,
.markdown-content h6 {
    color: var(--color-text-primary) !important;
}

/* Fix for inline code */
.markdown-content code:not([class*="language-"]) {
    background-color: var(--color-surface-secondary) !important;
    color: var(--color-text-primary) !important;
    padding: 0.125rem 0.25rem;
    border-radius: 0.25rem;
}

/* Ensure proper inheritance for nested components */
.message-bubble,
.message-bubble * {
    color: inherit;
}

.message-header,
.message-header * {
    color: inherit;
}

/* Override any hardcoded colors */
.ai-responses-accordion [style*="color: black"],
.ai-responses-accordion [style*="color:#000"],
.ai-responses-accordion [style*="color:black"],
.ai-responses-accordion [style*="color:#000000"] {
    color: var(--color-text-primary) !important;
}

.ai-responses-accordion [style*="background-color: white"],
.ai-responses-accordion [style*="background-color:#fff"],
.ai-responses-accordion [style*="background-color:white"],
.ai-responses-accordion [style*="background-color:#ffffff"] {
    background-color: var(--color-surface) !important;
}