/* Enhanced Light Mode Mobile Fixes - May 17, 2025 */

/* Fix mobile panels in light mode */
html[data-theme="light"] .mobile-panel {
    background-color: #f5f5f7 !important;
    color: #333 !important;
}

html[data-theme="light"] .panel-content {
    background-color: #f5f5f7 !important;
    color: #333 !important;
}

/* Fix tabs in light mode */
html[data-theme="light"] .panel-tab {
    background-color: #e0e0e5 !important;
    color: #333 !important;
}

html[data-theme="light"] .panel-tab.active {
    background-color: #f5f5f7 !important;
    color: #0066cc !important;
    border-bottom: 2px solid #0066cc !important;
}

/* Fix chat messages in light mode */
html[data-theme="light"] .chat-message {
    background-color: #e8e8e8 !important;
    color: #333 !important;
    border: 1px solid #ddd !important;
}

html[data-theme="light"] .user-message {
    background-color: #e0f0ff !important;
    color: #333 !important;
    border: 1px solid #c0e0ff !important;
}

/* Fix model cards in light mode */
html[data-theme="light"] .model-card {
    background-color: #fff !important;
    color: #333 !important;
    border: 1px solid #ddd !important;
}

html[data-theme="light"] .model-card-content {
    color: #333 !important;
}

html[data-theme="light"] .model-name {
    color: #0066cc !important;
}

/* Fix chat input in light mode */
html[data-theme="light"] .chat-input-container,
html[data-theme="light"] .chat-input {
    background-color: #fff !important;
    color: #333 !important;
    border: 1px solid #ddd !important;
}

html[data-theme="light"] .chat-input::placeholder {
    color: #888 !important;
}

/* Fix empty panel messages in light mode */
html[data-theme="light"] .empty-panel-message {
    color: #333 !important;
}

/* Fix navigation items in light mode */
html[data-theme="light"] .mobile-nav-item {
    background-color: #e8e8e8 !important;
    color: #333 !important;
}

html[data-theme="light"] .mobile-nav-item.active {
    background-color: #d0d0d5 !important;
    color: #0066cc !important;
}

/* Fix chat history items in light mode */
html[data-theme="light"] .chat-item {
    background-color: #fff !important;
    color: #333 !important;
    border: 1px solid #ddd !important;
}

html[data-theme="light"] .chat-item.active {
    background-color: #e0f0ff !important;
    border-color: #0066cc !important;
}

html[data-theme="light"] .chat-item-title {
    color: #0066cc !important;
}

/* Fix buttons in light mode */
html[data-theme="light"] .primary-button {
    background-color: #0066cc !important;
    color: white !important;
}

html[data-theme="light"] .secondary-button {
    background-color: #e0e0e5 !important;
    color: #333 !important;
    border: 1px solid #ccc !important;
}

html[data-theme="light"] .danger-button {
    background-color: #ff3a3a !important;
    color: white !important;
}

/* Fix settings modal in light mode */
html[data-theme="light"] .settings-modal-content {
    background-color: #f5f5f7 !important;
    color: #333 !important;
    border: 1px solid #ddd !important;
}

html[data-theme="light"] .settings-modal-header {
    border-bottom-color: #ddd !important;
}

html[data-theme="light"] .settings-section {
    border-bottom-color: #ddd !important;
}

html[data-theme="light"] input.cyber-input {
    background-color: #fff !important;
    border-color: #ddd !important;
    color: #333 !important;
}

/* Fix compact connection indicator in light mode */
html[data-theme="light"] .compact-connection-indicator {
    background-color: rgba(255, 255, 255, 0.8) !important;
    color: #333 !important;
    border: 1px solid #ddd !important;
}