/* Dark Mode Fixes for Journal Table */

/* Table Container Border */
html[data-theme="dark"] .table-container,
html[data-theme="dark"] #journalTableContainer {
    border-color: #334155 !important;
    background: #1e293b !important;
}

/* Table Header Background */
html[data-theme="dark"] .journal-table thead {
    background: linear-gradient(135deg, #1e293b 0%, #334155 50%, #1e293b 100%) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

/* Table Header Cells */
html[data-theme="dark"] .journal-table th {
    color: #cbd5e1 !important;
    border-right-color: rgba(255, 255, 255, 0.05) !important;
}

/* Header Icons - Softer Colors */
html[data-theme="dark"] .journal-table th i {
    opacity: 0.7;
    filter: brightness(0.9);
}

/* Table Body Rows */
html[data-theme="dark"] .journal-table tbody tr {
    background: #1e293b !important;
}

html[data-theme="dark"] .journal-table tbody tr:nth-child(even) {
    background: #1a2332 !important;
}

html[data-theme="dark"] .journal-table tbody tr:hover {
    background: linear-gradient(90deg, #334155 0%, #3b4a5f 50%, #334155 100%) !important;
}

/* Table Cells */
html[data-theme="dark"] .journal-table td {
    border-right-color: #334155 !important;
    border-bottom-color: #334155 !important;
    color: #cbd5e1 !important;
}

/* Symbol Column */
html[data-theme="dark"] .journal-table td:nth-child(3) {
    color: #60a5fa !important;
    opacity: 0.9;
}

/* Number Column */
html[data-theme="dark"] .journal-table td:nth-child(2) {
    color: #60a5fa !important;
    opacity: 0.85;
}

/* Chart Link Button - ONLY in dark mode */
html[data-theme="dark"] .journal-table a[href*="http"] {
    background: linear-gradient(135deg, #1e3a8a, #1e40af) !important;
    border-color: #3b82f6 !important;
    color: #93c5fd !important;
    opacity: 0.9;
}

html[data-theme="dark"] .journal-table a[href*="http"]:hover {
    background: linear-gradient(135deg, #1e40af, #2563eb) !important;
    border-color: #60a5fa !important;
    opacity: 1;
}

/* Image Button - ONLY in dark mode */
html[data-theme="dark"] .journal-table button[onclick*="viewImage"],
html[data-theme="dark"] .journal-table button[onclick*="viewFullImage"] {
    background: linear-gradient(135deg, #581c87, #6b21a8) !important;
    border-color: #7c3aed !important;
    color: #e9d5ff !important;
    opacity: 1;
}

html[data-theme="dark"] .journal-table button[onclick*="viewImage"]:hover,
html[data-theme="dark"] .journal-table button[onclick*="viewFullImage"]:hover {
    background: linear-gradient(135deg, #6b21a8, #7c3aed) !important;
    border-color: #8b5cf6 !important;
    color: #f3e8ff !important;
    opacity: 1;
}

/* Action Buttons (Edit/Delete) - ONLY in dark mode */
html[data-theme="dark"] .journal-table button[onclick*="editJournal"] {
    background: linear-gradient(135deg, #0e7490, #0891b2) !important;
    border-color: #06b6d4 !important;
    opacity: 0.9;
}

html[data-theme="dark"] .journal-table button[onclick*="editJournal"]:hover {
    opacity: 1;
}

html[data-theme="dark"] .journal-table button[onclick*="deleteJournal"] {
    background: linear-gradient(135deg, #7f1d1d, #991b1b) !important;
    border-color: #b91c1c !important;
    opacity: 0.75;
}

html[data-theme="dark"] .journal-table button[onclick*="deleteJournal"]:hover {
    opacity: 0.9;
}

/* Details Button (View) - ONLY in dark mode */
html[data-theme="dark"] .journal-table button[onclick*="viewJournalDetails"] {
    background: rgba(59, 130, 246, 0.2) !important;
    border-color: rgba(59, 130, 246, 0.4) !important;
    color: #93c5fd !important;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.15) !important;
}

html[data-theme="dark"] .journal-table button[onclick*="viewJournalDetails"]:hover {
    background: rgba(59, 130, 246, 0.3) !important;
    border-color: rgba(59, 130, 246, 0.6) !important;
    color: #bfdbfe !important;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.25) !important;
    transform: translateY(-1px);
}

/* Filter Dropdowns and Search - ONLY in dark mode */
html[data-theme="dark"] select,
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="search"] {
    background: #1e293b !important;
    border-color: #475569 !important;
    color: #f1f5f9 !important;
}

html[data-theme="dark"] select option {
    background: #1e293b;
    color: #f1f5f9;
}

/* Buttons - Exclude profile dropdown items - ONLY in dark mode */
html[data-theme="dark"] button:not(.profile-dropdown-item) {
    color: white !important;
}

/* Profile dropdown items - Force visible text in dark mode */
html[data-theme="dark"] .profile-dropdown-item {
    color: #cbd5e1 !important;
    background: transparent !important;
}

html[data-theme="dark"] .profile-dropdown-item span,
html[data-theme="dark"] .profile-dropdown-item div {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .profile-dropdown-item:hover {
    color: #a78bfa !important;
}

html[data-theme="dark"] .profile-dropdown-item:hover span,
html[data-theme="dark"] .profile-dropdown-item:hover div {
    color: #a78bfa !important;
}

html[data-theme="dark"] .profile-dropdown-item.active {
    color: #a78bfa !important;
}

html[data-theme="dark"] .profile-dropdown-item.active span,
html[data-theme="dark"] .profile-dropdown-item.active div {
    color: #a78bfa !important;
}

/* Profile dropdown background in dark mode - DON'T override visibility */
html[data-theme="dark"] .profile-dropdown:not(.active) {
    background: linear-gradient(135deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.98)) !important;
    border: 2px solid rgba(139, 92, 246, 0.3) !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(139, 92, 246, 0.2) !important;
}

html[data-theme="dark"] #profileDropdown:not(.active) {
    background: linear-gradient(135deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.98)) !important;
    border: 2px solid rgba(139, 92, 246, 0.3) !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(139, 92, 246, 0.2) !important;
}

/* Ensure active class works in both light and dark mode */
.profile-dropdown.active,
#profileDropdown.active {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) scale(1) !important;
    pointer-events: auto !important;
}

html[data-theme="dark"] .profile-dropdown.active,
html[data-theme="dark"] #profileDropdown.active {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) scale(1) !important;
    pointer-events: auto !important;
    background: linear-gradient(135deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.98)) !important;
    border: 2px solid rgba(139, 92, 246, 0.3) !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(139, 92, 246, 0.2) !important;
}

/* Checkboxes */
html[data-theme="dark"] input[type="checkbox"] {
    filter: brightness(0.8) contrast(1.2);
}

/* Tags */
html[data-theme="dark"] .tag {
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);
}

/* Empty State Text */
html[data-theme="dark"] .journal-table td span[style*="color: #cbd5e1"] {
    color: #64748b !important;
}

/* Sort Indicator Button */
html[data-theme="dark"] #sortIndicator {
    background: #334155 !important;
    color: #94a3b8 !important;
}

/* Dashboard Stats Boxes - Dark Mode */
html[data-theme="dark"] #tradeTypeStats .bg-green-50,
html[data-theme="dark"] #tradeTypeStats .bg-red-50 {
    background: rgba(0, 0, 0, 0.2) !important;
}

html[data-theme="dark"] #symbolStats .bg-gray-50,
html[data-theme="dark"] #sessionStats .bg-gray-50,
html[data-theme="dark"] #timeframeStats .bg-gray-50,
html[data-theme="dark"] #setupStats .bg-gray-50 {
    background: rgba(55, 65, 81, 0.5) !important;
}

html[data-theme="dark"] #symbolStats .hover\:bg-gray-100:hover,
html[data-theme="dark"] #sessionStats .hover\:bg-gray-100:hover,
html[data-theme="dark"] #timeframeStats .hover\:bg-gray-100:hover,
html[data-theme="dark"] #setupStats .hover\:bg-gray-100:hover {
    background: rgba(55, 65, 81, 1) !important;
}

html[data-theme="dark"] #planStats .bg-green-50 {
    background: rgba(6, 78, 59, 0.2) !important;
}

html[data-theme="dark"] #planStats .bg-red-50 {
    background: rgba(127, 29, 29, 0.2) !important;
}

html[data-theme="dark"] #planStats .bg-blue-50 {
    background: rgba(30, 58, 138, 0.2) !important;
}

html[data-theme="dark"] #resultDistribution .bg-gray-200 {
    background: #374151 !important;
}

/* Dashboard Text Colors - Dark Mode */
html[data-theme="dark"] #symbolStats p,
html[data-theme="dark"] #sessionStats p,
html[data-theme="dark"] #timeframeStats p,
html[data-theme="dark"] #setupStats p {
    color: #e5e7eb !important;
}

html[data-theme="dark"] #symbolStats .text-gray-800,
html[data-theme="dark"] #sessionStats .text-gray-800,
html[data-theme="dark"] #timeframeStats .text-gray-800,
html[data-theme="dark"] #setupStats .text-gray-800 {
    color: #f3f4f6 !important;
}

html[data-theme="dark"] #symbolStats .text-gray-500,
html[data-theme="dark"] #sessionStats .text-gray-500,
html[data-theme="dark"] #timeframeStats .text-gray-500,
html[data-theme="dark"] #setupStats .text-gray-500 {
    color: #d1d5db !important;
}

html[data-theme="dark"] #planStats .text-gray-600 {
    color: #d1d5db !important;
}

html[data-theme="dark"] #planStats .text-green-800 {
    color: #86efac !important;
}

html[data-theme="dark"] #planStats .text-red-800 {
    color: #fca5a5 !important;
}

html[data-theme="dark"] #planStats .text-blue-800 {
    color: #93c5fd !important;
}

html[data-theme="dark"] #planStats .border-green-200 {
    border-color: rgba(34, 197, 94, 0.3) !important;
}

html[data-theme="dark"] #planStats .border-red-200 {
    border-color: rgba(239, 68, 68, 0.3) !important;
}

html[data-theme="dark"] #planStats .border-blue-200 {
    border-color: rgba(59, 130, 246, 0.3) !important;
}
