/* Dark Mode Enhancements for DocumentVault
 * 
 * This file contains focused style enhancements for dark mode
 * to ensure proper contrast and visibility across all components.
 * 
 * Colors follow the established dark theme palette:
 * - Dark backgrounds (#121212, #1e1e1e, #2d2d2d)
 * - Light text (#ffffff, #e0e0e0) 
 * - Medium gray secondary text (#bdbdbd)
 * - Blue accents (#1976d2, #4f9bff)
 */

/* Force dark background on Recent Activity card */
.dark-theme .list-group-item,
.dark-theme .list-group-flush .list-group-item {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
    border-color: #333333 !important;
}

/* Fix tooltips in charts - comprehensive approach */
.tooltip,
.tooltip-inner,
.chartjs-tooltip,
#chartjs-tooltip,
[id^="chartjs-tooltip"],
.chart-tooltip,
div[data-tooltip],
canvas + div {
    --bs-tooltip-bg: #333333 !important;
    --bs-tooltip-color: #ffffff !important;
    background-color: #333333 !important;
    color: #ffffff !important;
    border-color: #555555 !important;
    opacity: 1 !important;
}

/* Force all text inside tooltips to be white */
.tooltip *,
.tooltip-inner *,
.chartjs-tooltip *,
#chartjs-tooltip *,
[id^="chartjs-tooltip"] *,
.chart-tooltip *,
div[data-tooltip] *,
canvas + div *,
.chartjs-tooltip-key,
.chartjs-tooltip-body,
.chartjs-tooltip-title,
.chartjs-tooltip-body-item {
    color: #ffffff !important;
    text-shadow: none !important;
    background-color: transparent !important;
}

/* Direct style for tooltips */
#tokenUsageChart + div,
#tokenUsageChart + div *,
#projectStatusChart + div,
#projectStatusChart + div *,
.rz-tooltip,
div[class*="rz-chart-tooltip"],
div[class*="rz-series-tooltip"],
div[class*="rz-chart"] + div,
.rz-tooltip-content,
.rz-tooltip-text,
.rz-chart-tooltip-content,
div[role="tooltip"],
div[data-tooltip],
.rz-chart-tooltip {
    background-color: #333333 !important;
    color: #ffffff !important;
    border-color: #555555 !important;
}

/* Specific styles for Radzen charting tooltips */
.rz-chart-tooltip,
.rz-chart-tooltip-content,
.rz-series-tooltip,
.rz-column-tooltip,
.rz-line-tooltip,
.rz-tooltip,
.rz-chart-container + div {
    background-color: #333333 !important;
    color: #ffffff !important;
    border-color: #555555 !important;
    font-weight: normal !important;
}

/* Force all text elements inside Radzen tooltips to be white */
.rz-chart-tooltip *,
.rz-chart-tooltip-content *,
.rz-series-tooltip *,
.rz-column-tooltip *,
.rz-line-tooltip *,
.rz-tooltip *,
.rz-chart-container + div * {
    color: #ffffff !important;
    text-shadow: none !important;
}

/* Dashboard cards */
.dark-theme .card {
    background-color: #1e1e1e !important;
}

.dark-theme .card-body {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
}

/* Fix Recent Activity */
.dark-theme .list-group-item * {
    color: #e0e0e0 !important;
}

.dark-theme .list-group-item small {
    color: #bdbdbd !important;
}

.dark-theme .list-group-item .text-primary {
    color: #4f9bff !important;
}

/* Fix Register/Login screens */
.dark-theme .register-form-container,
.dark-theme .login-form-container {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
}

.dark-theme .register-card,
.dark-theme .login-card {
    background-color: #1e1e1e !important;
}

.dark-theme .form-control {
    background-color: #2d2d2d !important;
    border-color: #333333 !important;
    color: #e0e0e0 !important;
}

.dark-theme .form-label,
.dark-theme label {
    color: #e0e0e0 !important;
}

.dark-theme h3, 
.dark-theme h4,
.dark-theme p:not(.text-danger):not(.text-success):not(.text-info):not(.text-warning) {
    color: #e0e0e0 !important;
}

/* Registration success message */
.dark-theme .register-form-container .alert,
.dark-theme .register-card .alert {
    background-color: #1e3a29 !important;
    color: #b3ffcc !important;
    border-color: #2a5a40 !important;
}

/* Make success text more visible on registration completion page */
.dark-theme .register-form-container p,
.dark-theme .register-form-container div p,
.dark-theme .register-form-container a + p,
.dark-theme .register-form-container > div > p {
    color: #e0e0e0 !important; 
    font-weight: 500 !important;
}

/* Ensure registration success page has dark background */
.dark-theme .register-container .register-form-container {
    background-color: #1e1e1e !important;
}

/* Target the light mint/green success message panel */
.dark-theme .register-container .register-card .register-row > div:last-child,
.dark-theme .register-card div > div:nth-child(2) {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
}

/* Style the verification email text */
.dark-theme .register-card .verification-message,
.dark-theme .register-card .register-form-container > div > p {
    color: #e0e0e0 !important;
    font-weight: 500 !important;
    background-color: transparent !important;
}

/* Make the success message more visible */
.dark-theme .register-card .register-row > div:nth-child(2) {
    background-color: #1e1e1e !important;
    border-left: 1px solid #333333 !important;
}

/* Style any alerts or info boxes in the success panel */
.dark-theme .register-card .register-row > div:nth-child(2) > div {
    color: #e0e0e0 !important;
    background-color: #1e1e1e !important;
}

/* Fix VerifyEmail page in dark mode */
.dark-theme body:has([href*="/VerifyEmail"]) {
    background-color: #121212 !important;
}

.dark-theme [href*="/VerifyEmail"] + h1,
.dark-theme h1:has(+ [href*="/VerifyEmail"]),
.dark-theme h1:has(+ .row),
.dark-theme .col-md-6 p,
.dark-theme form label {
    color: #e0e0e0 !important;
}

.dark-theme .row .col-md-6 {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
    padding: 20px !important;
    border-radius: 8px !important;
}

/* Override bootstrap alert styling in dark mode */
.dark-theme .alert-info {
    background-color: #0d3c61 !important;
    color: #e0e0e0 !important;
    border-color: #1976d2 !important;
}

.dark-theme .alert-success {
    background-color: #1e3a29 !important;
    color: #e0e0e0 !important;
    border-color: #2a5a40 !important;
}

.dark-theme .alert-danger {
    background-color: #541e1e !important;
    color: #e0e0e0 !important;
    border-color: #842029 !important;
}

.dark-theme .alert-warning {
    background-color: rgba(255, 193, 7, 0.15) !important;
    color: #f8f8f8 !important;
    border-color: #ffc107 !important;
}

/* Specific fix for organization creation warning message */
.dark-theme .alert-warning strong,
.dark-theme .alert-warning i,
.dark-theme .alert-warning * {
    color: #ffffff !important;
}

/* Fix links in alerts */
.dark-theme .alert a {
    color: #4f9bff !important;
    text-decoration: underline !important;
}

.dark-theme .alert a:hover {
    color: #90c2ff !important;
}

/* Fix modals in dark mode */
.dark-theme .modal-content {
    background-color: #1e1e1e !important;
    border-color: #333333 !important;
}

.dark-theme .modal-header {
    background-color: #2d2d2d !important;
    border-color: #333333 !important;
}

.dark-theme .modal-footer {
    background-color: #1e1e1e !important;
    border-color: #333333 !important;
}

.dark-theme .modal-title,
.dark-theme .modal-body label,
.dark-theme .modal-body h5,
.dark-theme .modal-body .form-label {
    color: #e0e0e0 !important;
}

/* Fix form controls in modals */
.dark-theme .modal-body .form-control {
    background-color: #2d2d2d !important;
    border-color: #333333 !important;
    color: #e0e0e0 !important;
}

.dark-theme .modal-body .form-control:focus {
    border-color: #1976d2 !important;
    box-shadow: 0 0 0 0.25rem rgba(25, 118, 210, 0.25) !important;
}

/* Fix validation messages */
.dark-theme .modal-body .validation-message {
    color: #ff6b6b !important;
}

/* Fix modal close button */
.dark-theme .modal-header .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%) !important;
}

/* Enhance button contrast in modal footer */
.dark-theme .modal-footer .btn-secondary {
    background-color: #4d4d4d !important;
    border-color: #555555 !important;
    color: #e0e0e0 !important;
}

.dark-theme .modal-footer .btn-primary {
    background-color: #1976d2 !important;
    border-color: #1565c0 !important;
    color: #ffffff !important;
}

/* Fix role-display buttons in organization page */
.dark-theme .role-display {
    background-color: #2d2d2d !important;
    color: #e0e0e0 !important;
    border-color: #333333 !important;
}

/* Fix role buttons */
.dark-theme .btn-outline-primary {
    color: #4f9bff !important;
    border-color: #4f9bff !important;
}

.dark-theme .btn-outline-primary:hover {
    background-color: #1976d2 !important;
    color: #ffffff !important;
}

/* Fix API Keys page elements */
.dark-theme .api-key-container {
    background-color: #1e1e1e !important;
    border: 1px solid #333333 !important;
}

.dark-theme .key-list {
    border-color: #333333 !important;
}

.dark-theme .key-item {
    border-bottom-color: #333333 !important;
}

.dark-theme .key-prefix {
    background-color: #2d2d2d !important;
    color: #e0e0e0 !important;
}

.dark-theme .endpoint-box {
    background-color: #2d2d2d !important;
    color: #e0e0e0 !important;
    border: 1px solid #333333 !important;
}

.dark-theme .key-display {
    background-color: #2d2d2d !important;
    color: #e0e0e0 !important;
    border-color: #333333 !important;
}

.dark-theme .api-key-warning {
    background-color: rgba(255, 193, 7, 0.2) !important;
    color: #e0e0e0 !important;
    border-left-color: #ffc107 !important;
}

.dark-theme .copy-btn {
    color: #bdbdbd !important;
}

.dark-theme .copy-btn:hover {
    color: #ffffff !important;
}

/* Fix API Keys modal dialog */
.dark-theme .modal-overlay .modal-content {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
    border: 1px solid #333333 !important;
}

/* Fix alerts drawer */
.dark-theme .alert-drawer-container {
    background-color: #1e1e1e !important;
    border-color: #333333 !important;
    box-shadow: -4px 0 10px rgba(0, 0, 0, 0.5) !important;
}

.dark-theme .alert-drawer-header {
    background-color: #2d2d2d !important;
    border-bottom-color: #333333 !important;
}

.dark-theme .alert-drawer-header h5 {
    color: #e0e0e0 !important;
}

.dark-theme .custom-alert-item {
    border-bottom-color: #333333 !important;
}

.dark-theme .alert-drawer-body .text-muted {
    color: #bdbdbd !important;
}

/* Fix document processing status rows */
.dark-theme .progress-row,
.dark-theme tr.processing,
.dark-theme tr.active,
.dark-theme .document-row.processing,
.dark-theme .document-item.processing {
    background-color: #1e3a29 !important;
    color: #e0e0e0 !important;
}

/* Fix alert items in drawer */
.dark-theme .alert-success {
    background-color: rgba(46, 125, 50, 0.2) !important;
    border-left-color: #2e7d32 !important;
}

.dark-theme .alert-error {
    background-color: rgba(211, 47, 47, 0.2) !important;
    border-left-color: #d32f2f !important;
}

.dark-theme .alert-warning {
    background-color: rgba(237, 108, 2, 0.2) !important;
    border-left-color: #ed6c02 !important;
}

.dark-theme .alert-info {
    background-color: rgba(2, 136, 209, 0.2) !important;
    border-left-color: #0288d1 !important;
}

/* Ensure all rows in tables have proper dark background */
.dark-theme tbody tr,
.dark-theme .table-striped > tbody > tr:nth-of-type(odd),
.dark-theme .table-striped > tbody > tr:nth-of-type(even) {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
}

.dark-theme .table-hover > tbody > tr:hover {
    background-color: #2d2d2d !important;
}

.dark-theme .chat-popup-header {
    background-color: #2d2d2d !important;
    border-bottom: 1px solid #333333 !important;
    color: #e0e0e0 !important;
}

.dark-theme .chat-popup-title {
    color: #e0e0e0 !important;
}

.dark-theme .chat-popup-close {
    color: #aaaaaa !important;
}

.dark-theme .chat-popup-body {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
}