/* Modal-specific overrides to fix white-on-white text issue */

/* Force light theme for ALL modals including dynamically created ones */
.modal,
.modal *,
#responseModal,
#responseModal *,
#mentionDetailModal,
#mentionDetailModal * {
    --text-primary: #212529 !important;
    --text-secondary: #495057 !important;
    --vz-body-color: #212529 !important;
    --bg-primary: #ffffff !important;
    --bg-secondary: #f8f9fa !important;
    --bg-card: #ffffff !important;
    color: #212529 !important;
}

/* Query Detail Modal specific overrides */
#queryDetailModal .modal-content,
#queryDetailModal .modal-content * {
    background-color: #ffffff !important;
    color: #212529 !important;
}

#queryDetailModal .modal-header {
    background-color: #f8f9fa !important;
    border-bottom: 1px solid #dee2e6 !important;
}

#queryDetailModal .modal-header h5,
#queryDetailModal .modal-header .modal-title,
#queryDetailModal .modal-header * {
    color: #212529 !important;
}

#queryDetailModal .modal-body {
    background-color: #ffffff !important;
    color: #212529 !important;
}

#queryDetailModal .modal-body h1,
#queryDetailModal .modal-body h2,
#queryDetailModal .modal-body h3,
#queryDetailModal .modal-body h4,
#queryDetailModal .modal-body h5,
#queryDetailModal .modal-body h6,
#queryDetailModal .modal-body p,
#queryDetailModal .modal-body li,
#queryDetailModal .modal-body span:not(.badge),
#queryDetailModal .modal-body div,
#queryDetailModal .modal-body strong,
#queryDetailModal .modal-body td,
#queryDetailModal .modal-body th,
#queryDetailModal .modal-body ol,
#queryDetailModal .modal-body ul {
    color: #212529 !important;
}

#queryDetailModal .table {
    color: #212529 !important;
    background-color: #ffffff !important;
}

#queryDetailModal .table td,
#queryDetailModal .table th {
    color: #212529 !important;
    background-color: #ffffff !important;
    border-color: #dee2e6 !important;
}

#queryDetailModal .fw-bold {
    color: #212529 !important;
    font-weight: 600 !important;
}

#queryDetailModal .alert {
    color: #212529 !important;
}

#queryDetailModal .alert-warning {
    background-color: #fff3cd !important;
    border-color: #ffeeba !important;
    color: #856404 !important;
}

#queryDetailModal .alert-warning *:not(.badge) {
    color: #856404 !important;
}

#queryDetailModal .alert-success {
    background-color: #d4edda !important;
    border-color: #c3e6cb !important;
    color: #155724 !important;
}

#queryDetailModal .alert-success *:not(.badge) {
    color: #155724 !important;
}

#queryDetailModal .progress {
    background-color: #e9ecef !important;
}

#queryDetailModal .progress-bar {
    color: #ffffff !important;
}

#queryDetailModal .modal-footer {
    background-color: #f8f9fa !important;
    border-top: 1px solid #dee2e6 !important;
}

/* Ensure badges maintain their colors */
#queryDetailModal .badge.bg-danger {
    background-color: #dc3545 !important;
    color: #ffffff !important;
}

#queryDetailModal .badge.bg-warning {
    background-color: #ffc107 !important;
    color: #212529 !important;
}

#queryDetailModal .badge.bg-info {
    background-color: #0dcaf0 !important;
    color: #ffffff !important;
}

#queryDetailModal .badge.bg-success {
    background-color: #198754 !important;
    color: #ffffff !important;
}

#queryDetailModal .badge.bg-secondary {
    background-color: #6c757d !important;
    color: #ffffff !important;
}

#queryDetailModal .badge.bg-primary {
    background-color: #0d6efd !important;
    color: #ffffff !important;
}

/* Override any Velzon dark theme variables for modals */
.modal-open .modal {
    --vz-body-bg: #ffffff !important;
    --vz-body-color: #212529 !important;
}

/* Specific overrides for responseModal (AI visibility responses) */
#responseModal .modal-content,
#responseModal .modal-content * {
    background-color: #ffffff !important;
    color: #212529 !important;
}

#responseModal .modal-header {
    background-color: #f8f9fa !important;
    border-bottom: 1px solid #dee2e6 !important;
}

#responseModal .modal-title {
    color: #212529 !important;
}

#responseModal .modal-body {
    background-color: #ffffff !important;
    color: #212529 !important;
}

#responseModal .modal-body h6,
#responseModal .modal-body .text-muted {
    color: #6c757d !important;
}

#responseModal .bg-light {
    background-color: #f8f9fa !important;
    color: #212529 !important;
}

#responseModal .modal-footer {
    background-color: #f8f9fa !important;
    border-top: 1px solid #dee2e6 !important;
}

/* Ensure all modal content is visible */
.modal-content,
.modal-content * {
    color: #212529 !important;
}

.modal-header {
    background-color: #f8f9fa !important;
    color: #212529 !important;
}

.modal-body {
    background-color: #ffffff !important;
    color: #212529 !important;
}

.modal-footer {
    background-color: #f8f9fa !important;
    color: #212529 !important;
}