/**
 * Targeted CSS fixes for Agrin Email
 * Only affects main content areas, preserves sidebar white text
 */

/* Main content areas only */
.main-content {
    color: #333333;
}

.main-content h1,
.main-content h2,
.main-content h3,
.main-content h4,
.main-content h5,
.main-content h6 {
    color: #333333 !important;
}

.main-content p,
.main-content div,
.main-content span {
    color: #333333 !important;
}

.main-content .text-muted {
    color: #6c757d !important;
}

/* Email content areas */
.email-header,
.email-content,
.email-list {
    color: #333333;
}

.email-header h2,
.email-header p {
    color: #333333 !important;
}

.email-subject {
    color: #2c3e50 !important;
}

.email-sender,
.email-date,
.email-preview {
    color: #6c757d !important;
}

/* Form container (login/register forms) */
.form-container {
    color: #333333;
}

.form-container label,
.form-container .form-label {
    color: #333333 !important;
}

.form-container .form-text,
.form-container small {
    color: #666666 !important;
}

.form-container input,
.form-container textarea,
.form-container select {
    color: #333333 !important;
    background-color: #ffffff !important;
}

/* Compose page */
.compose-container {
    color: #333333;
}

.compose-form label,
.compose-form .form-label {
    color: #333333 !important;
}

.compose-form input,
.compose-form textarea {
    color: #333333 !important;
    background-color: #ffffff !important;
}

/* Email viewer */
.email-container {
    color: #333333;
}

.email-body {
    color: #333333 !important;
}

.meta-label {
    color: #495057 !important;
}

.meta-value {
    color: #6c757d !important;
}

/* Bootstrap overrides for white backgrounds */
.bg-white,
.card,
.modal-content,
.dropdown-menu {
    color: #333333 !important;
}

/* Table elements */
table {
    color: #333333 !important;
}

th, td {
    color: #333333 !important;
}

/* List elements */
ul, ol, li {
    color: #333333 !important;
}

/* Navigation elements */
.navbar-nav .nav-link {
    color: #333333 !important;
}

.breadcrumb-item {
    color: #6c757d !important;
}

/* Button text visibility */
.btn {
    text-shadow: none !important;
}

.btn-outline-primary,
.btn-outline-secondary {
    color: #333333 !important;
}

.btn-outline-primary:hover,
.btn-outline-secondary:hover {
    color: #ffffff !important;
}

/* Alert messages */
.alert {
    color: #333333 !important;
}

.alert-success {
    color: #155724 !important;
}

.alert-danger {
    color: #721c24 !important;
}

.alert-warning {
    color: #856404 !important;
}

.alert-info {
    color: #0c5460 !important;
}

/* Card elements */
.card-body,
.card-header,
.card-footer {
    color: #333333 !important;
}

/* Modal elements */
.modal-body,
.modal-header,
.modal-footer {
    color: #333333 !important;
}

/* Specific fixes for email body content */
.email-body {
    color: #333333 !important;
    line-height: 1.6;
}

.email-body p,
.email-body div,
.email-body span {
    color: #333333 !important;
}

/* CKEditor content area */
.cke_editable {
    color: #333333 !important;
    background-color: #ffffff !important;
}

/* Debug and error messages */
.debug-info,
.error-message {
    color: #333333 !important;
    background-color: #f8f9fa !important;
    padding: 10px;
    border-radius: 4px;
    margin: 10px 0;
}

/* Print styles */
@media print {
    body, * {
        color: #000000 !important;
        background: #ffffff !important;
    }
}

/* Dark mode compatibility */
@media (prefers-color-scheme: dark) {
    body {
        background-color: #ffffff !important;
        color: #333333 !important;
    }
    
    .form-control,
    input,
    textarea,
    select {
        background-color: #ffffff !important;
        color: #333333 !important;
        border-color: #dee2e6 !important;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    body {
        color: #000000 !important;
        background-color: #ffffff !important;
    }
    
    .form-control,
    input,
    textarea {
        color: #000000 !important;
        background-color: #ffffff !important;
        border: 2px solid #000000 !important;
    }
}

/* Focus states for accessibility */
input:focus,
textarea:focus,
select:focus,
.form-control:focus {
    color: #333333 !important;
    background-color: #ffffff !important;
    border-color: #667eea !important;
    box-shadow: 0 0 0 0.2rem rgba(102, 126, 234, 0.25) !important;
}

/* Ensure visibility in all containers */
.container,
.container-fluid,
.row,
.col,
[class*="col-"] {
    color: inherit;
}

/* Override any potential Bootstrap dark theme */
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] input,
[data-bs-theme="dark"] textarea {
    color: #333333 !important;
    background-color: #ffffff !important;
}

/* Dropdown menu text visibility */
.dropdown-menu .dropdown-item {
    color: #333333 !important;
}

.dropdown-menu .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #667eea !important;
}

/* Tab navigation */
.nav-tabs .nav-link {
    color: #6c757d !important;
}

.nav-tabs .nav-link.active {
    color: #ffffff !important;
}

/* Ensure links are visible */
a {
    color: #667eea !important;
}

a:hover {
    color: #5a67d8 !important;
}

/* White background containers */
.bg-white *,
.card-body *,
.modal-content *,
.form-container *,
.email-header *,
.email-content *,
.compose-form * {
    color: inherit !important;
}

/* Force dark text on white backgrounds */
.bg-white,
.card,
.modal-content,
.form-container,
.email-header,
.email-content,
.compose-form {
    background-color: #ffffff !important;
}

.bg-white *:not(.btn):not(.badge):not(.alert),
.card *:not(.btn):not(.badge):not(.alert),
.modal-content *:not(.btn):not(.badge):not(.alert),
.form-container *:not(.btn):not(.badge):not(.alert),
.email-header *:not(.btn):not(.badge):not(.alert),
.email-content *:not(.btn):not(.badge):not(.alert),
.compose-form *:not(.btn):not(.badge):not(.alert) {
    color: #333333 !important;
}
