/* Enhanced Dark Mode Styles for Specific Components */

/* Translation Details/Output */
[data-theme="dark"] .translation-output,
[data-theme="dark"] .translation-result,
[data-theme="dark"] #translation-result,
body.dark-mode .translation-output,
body.dark-mode .translation-result,
body.dark-mode #translation-result {
    background-color: var(--bg-secondary, #2d2d2d) !important;
    color: var(--text-primary, #e4e4e4) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

/* Translation meta information */
[data-theme="dark"] .translation-meta,
body.dark-mode .translation-meta {
    background-color: var(--bg-tertiary, #3a3a3a) !important;
    color: var(--text-primary, #e4e4e4) !important;
    border-bottom: 1px solid var(--border-color, #404040) !important;
}

/* Translated text display */
[data-theme="dark"] .translated-text,
body.dark-mode .translated-text {
    background-color: var(--bg-secondary, #2d2d2d) !important;
    color: var(--text-primary, #e4e4e4) !important;
    padding: 1rem !important;
}

/* Translation actions */
[data-theme="dark"] .translation-actions,
body.dark-mode .translation-actions {
    background-color: var(--bg-tertiary, #3a3a3a) !important;
    border-top: 1px solid var(--border-color, #404040) !important;
    padding: 1rem !important;
}

/* Tier badges */
[data-theme="dark"] .tier-badge,
body.dark-mode .tier-badge {
    background-color: var(--bg-primary, #1a1a1a) !important;
    color: var(--text-primary, #e4e4e4) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

/* Loading states */
[data-theme="dark"] .loading,
body.dark-mode .loading {
    color: var(--text-secondary, #b0b0b0) !important;
}

/* Alert boxes in translation */
[data-theme="dark"] .alert,
body.dark-mode .alert {
    background-color: var(--bg-tertiary, #3a3a3a) !important;
    color: var(--text-primary, #e4e4e4) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

[data-theme="dark"] .alert.alert-error,
body.dark-mode .alert.alert-error {
    background-color: rgba(220, 38, 38, 0.1) !important;
    color: #fca5a5 !important;
    border-color: #dc2626 !important;
}

/* GLCV Specific Tables */
[data-theme="dark"] #terms-list table,
[data-theme="dark"] #terms-table,
body.dark-mode #terms-list table,
body.dark-mode #terms-table {
    width: 100% !important;
    background-color: var(--bg-secondary, #2d2d2d) !important;
    color: var(--text-primary, #e4e4e4) !important;
}

[data-theme="dark"] #terms-list table th,
[data-theme="dark"] #terms-table th,
body.dark-mode #terms-list table th,
body.dark-mode #terms-table th {
    background-color: var(--bg-tertiary, #3a3a3a) !important;
    color: var(--text-primary, #e4e4e4) !important;
    border: 1px solid var(--border-color, #404040) !important;
    padding: 0.75rem !important;
}

[data-theme="dark"] #terms-list table td,
[data-theme="dark"] #terms-table td,
body.dark-mode #terms-list table td,
body.dark-mode #terms-table td {
    background-color: var(--bg-secondary, #2d2d2d) !important;
    color: var(--text-primary, #e4e4e4) !important;
    border: 1px solid var(--border-color, #404040) !important;
    padding: 0.75rem !important;
}

[data-theme="dark"] #terms-list table tr:hover,
[data-theme="dark"] #terms-table tr:hover,
body.dark-mode #terms-list table tr:hover,
body.dark-mode #terms-table tr:hover {
    background-color: var(--bg-tertiary, #3a3a3a) !important;
}

/* API Keys Table Specific */
[data-theme="dark"] #api-keys-list table,
body.dark-mode #api-keys-list table {
    width: 100% !important;
    background-color: var(--bg-secondary, #2d2d2d) !important;
    color: var(--text-primary, #e4e4e4) !important;
    border-collapse: collapse !important;
}

[data-theme="dark"] #api-keys-list table th,
body.dark-mode #api-keys-list table th {
    background-color: var(--bg-tertiary, #3a3a3a) !important;
    color: var(--text-primary, #e4e4e4) !important;
    border: 1px solid var(--border-color, #404040) !important;
    padding: 0.75rem !important;
    text-align: left !important;
}

[data-theme="dark"] #api-keys-list table td,
body.dark-mode #api-keys-list table td {
    background-color: var(--bg-secondary, #2d2d2d) !important;
    color: var(--text-primary, #e4e4e4) !important;
    border: 1px solid var(--border-color, #404040) !important;
    padding: 0.75rem !important;
}

[data-theme="dark"] #api-keys-list table tr:hover,
body.dark-mode #api-keys-list table tr:hover {
    background-color: var(--bg-tertiary, #3a3a3a) !important;
}

/* Code elements in API keys table */
[data-theme="dark"] #api-keys-list code,
body.dark-mode #api-keys-list code {
    background-color: var(--bg-primary, #1a1a1a) !important;
    color: #ff79c6 !important;
    padding: 0.25rem 0.5rem !important;
    border-radius: 0.25rem !important;
}

/* Icon buttons in tables */
[data-theme="dark"] .btn-icon,
body.dark-mode .btn-icon {
    background-color: transparent !important;
    color: var(--text-secondary, #b0b0b0) !important;
    border: none !important;
    padding: 0.25rem 0.5rem !important;
}

[data-theme="dark"] .btn-icon:hover,
body.dark-mode .btn-icon:hover {
    color: var(--text-primary, #e4e4e4) !important;
    background-color: var(--bg-tertiary, #3a3a3a) !important;
}

/* Edit and Delete buttons in tables */
[data-theme="dark"] table .btn-sm,
body.dark-mode table .btn-sm {
    padding: 0.25rem 0.5rem !important;
    font-size: 0.875rem !important;
}

[data-theme="dark"] table .btn-danger,
body.dark-mode table .btn-danger {
    background-color: #dc2626 !important;
    color: #ffffff !important;
    border-color: #dc2626 !important;
}

[data-theme="dark"] table .btn-danger:hover,
body.dark-mode table .btn-danger:hover {
    background-color: #b91c1c !important;
    border-color: #b91c1c !important;
}

/* Glossary set selector */
[data-theme="dark"] #glossary-set-select,
body.dark-mode #glossary-set-select {
    background-color: var(--bg-secondary, #2d2d2d) !important;
    color: var(--text-primary, #e4e4e4) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

/* Translation mode and strategy selectors */
[data-theme="dark"] #translation-mode,
[data-theme="dark"] #translation-strategy,
[data-theme="dark"] #source-language,
[data-theme="dark"] #target-language,
body.dark-mode #translation-mode,
body.dark-mode #translation-strategy,
body.dark-mode #source-language,
body.dark-mode #target-language {
    background-color: var(--bg-secondary, #2d2d2d) !important;
    color: var(--text-primary, #e4e4e4) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

/* Character counter */
[data-theme="dark"] #char-counter,
body.dark-mode #char-counter {
    color: var(--text-secondary, #b0b0b0) !important;
}

/* Meta items in translation output */
[data-theme="dark"] .meta-item,
body.dark-mode .meta-item {
    color: var(--text-secondary, #b0b0b0) !important;
}

/* DNT and Glossary badges in terms table */
[data-theme="dark"] .badge.dnt-badge,
body.dark-mode .badge.dnt-badge {
    background-color: #dc2626 !important;
    color: #ffffff !important;
}

[data-theme="dark"] .badge.glossary-badge,
body.dark-mode .badge.glossary-badge {
    background-color: #10b981 !important;
    color: #ffffff !important;
}

/* Empty state messages */
[data-theme="dark"] p[style*="text-align: center"],
body.dark-mode p[style*="text-align: center"] {
    color: var(--text-secondary, #b0b0b0) !important;
}

/* Force table styling even with inline styles */
[data-theme="dark"] table[class*="table"],
[data-theme="dark"] .data-table,
body.dark-mode table[class*="table"],
body.dark-mode .data-table {
    background-color: var(--bg-secondary, #2d2d2d) !important;
    color: var(--text-primary, #e4e4e4) !important;
}

/* Ensure all table cells inherit dark mode */
[data-theme="dark"] table *,
body.dark-mode table * {
    color: inherit !important;
}