/* Trezo Dark Mode Enhanced Styles */

/* Enhanced dark mode support for all Trezo components */
.dark {
    /* Base text and background colors */
    --text-primary: #ffffff;
    --text-secondary: #e5e7eb;
    --text-muted: #9ca3af;
    --bg-primary: #0a0e19;
    --bg-secondary: #0c1427;
    --bg-tertiary: #172036;
    --border-color: #172036;
}

/* Override any inline styles or conflicting CSS */
.dark * {
    border-color: var(--border-color) !important;
}

.dark .text-black,
.dark [class*="text-black"] {
    color: var(--text-primary) !important;
}

.dark .bg-white,
.dark [class*="bg-white"] {
    background-color: var(--bg-secondary) !important;
}

.dark .border-gray-200,
.dark .border-gray-300,
.dark [class*="border-gray"] {
    border-color: var(--border-color) !important;
}

/* Form elements */
.dark input,
.dark textarea,
.dark select {
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

.dark input::placeholder,
.dark textarea::placeholder {
    color: var(--text-muted) !important;
}

/* Buttons and interactive elements */
.dark button,
.dark .btn {
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

/* Cards and containers */
.dark .card,
.dark .panel,
.dark .container,
.dark [class*="bg-white"] {
    background-color: var(--bg-secondary) !important;
}

/* Links */
.dark a {
    color: var(--text-primary) !important;
}

/* Specific overrides for Trezo components */
.dark .trezo-card {
    background-color: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
}

.dark .trezo-form-control {
    background-color: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

/* Ensure main containers have proper dark background */
.dark body,
.dark .main,
.dark .wrapper,
.dark .page {
    background-color: var(--bg-primary) !important;
    color: var(--text-primary) !important;
}