/**
 * LOFI SWAP MODAL - TEXT COLOR OVERRIDES
 * Agent 2: Comprehensive text color updates to match LOFI brand
 * ===============================================
 * Based on modal.PNG reference:
 * - Headers: White (#ffffff)
 * - Body text: Light gray (#e0e0e0)
 * - Accent text: Light blue/purple (#a8b8ed)
 * - Success: Keep existing green
 * - Errors: Keep existing red
 * - Warnings: Keep existing yellow
 */

/* ===============================================================================================
 * HEADERS AND TITLES - WHITE
 * ===============================================================================================
 */

/* Main modal headers */
.lofi-modal-header h2,
.simple-swap-header h2,
.swap-title,
.section-title,
#lofi-swap-modal h2,
#lofi-swap-modal h3,
.lofi-swap-container h2,
.lofi-swap-container h3,
.lofi-recent-header h3 {
  color: #ffffff !important;
}

/* ===============================================================================================
 * PRIMARY TEXT - WHITE
 * ===============================================================================================
 */

/* Input values and amounts */
.lofi-swap-input,
.swap-amount-input,
.swap-output-amount,
#sui-amount,
#lofi-amount,
input[type="text"],
input[type="number"],
.lofi-slippage-input,
.custom-slippage-input input {
  color: #ffffff !important;
}

/* Token symbols and names */
.lofi-token-selector span,
.swap-input-symbol,
.swap-output-symbol,
.token-symbol,
.token-info span,
.swap-input-token,
.swap-output-token,
.lofi-transaction-pair {
  color: #ffffff !important;
}

/* Detail values */
.lofi-swap-detail-row span:last-child,
.swap-detail-row span:last-child,
.lofi-price-text,
.swap-output-amount {
  color: #ffffff !important;
}

/* Button text (when not disabled) */
.lofi-swap-button:not(:disabled),
.swap-execute-btn:not(:disabled),
.simple-swap-btn:not(:disabled) {
  color: #ffffff !important;
}

/* ===============================================================================================
 * SECONDARY TEXT - LIGHT GRAY (#e0e0e0)
 * ===============================================================================================
 */

/* Labels and descriptions */
.lofi-swap-token-header label,
.swap-label,
.section-header,
.lofi-swap-detail-row span:first-child,
.swap-detail-row span:first-child,
.status-message {
  color: #e0e0e0 !important;
}

/* Secondary buttons and controls */
.lofi-modal-close,
.simple-close-btn,
.lofi-clear-recent,
.lofi-transaction-link,
.lofi-slippage-preset:not(.active),
.slippage-option:not(.active),
.custom-slippage-input span,
.lofi-slippage-input-group span {
  color: #e0e0e0 !important;
}

/* Quick actions */
.lofi-quick-action {
  color: #e0e0e0 !important;
}

/* Balance labels */
.lofi-balance-display,
.swap-balance {
  color: #e0e0e0 !important;
}

/* ===============================================================================================
 * ACCENT TEXT - LIGHT BLUE/PURPLE (#a8b8ed)
 * ===============================================================================================
 */

/* Balance values and rates */
.lofi-balance-value,
.swap-balance span,
.swap-rate,
.lofi-price-value,
#simple-lofi-rate,
.simple-price-banner,
.lofi-input-value-usd,
.lofi-transaction-time,
.lofi-no-transactions {
  color: #a8b8ed !important;
}

/* Muted text */
.lofi-balance-display,
.swap-balance,
.lofi-transaction-time {
  color: #a8b8ed !important;
}

/* ===============================================================================================
 * INTERACTIVE STATES
 * ===============================================================================================
 */

/* Hover states - make things white */
.lofi-modal-close:hover,
.lofi-slippage-preset:hover,
.slippage-option:hover,
.lofi-quick-action:hover,
.lofi-transaction-link:hover {
  color: #ffffff !important;
}

/* Active/selected states */
.lofi-slippage-preset.active,
.slippage-option.active {
  color: #ffffff !important;
}

/* ===============================================================================================
 * PLACEHOLDER TEXT
 * ===============================================================================================
 */

.lofi-swap-input::placeholder,
.swap-amount-input::placeholder,
input::placeholder {
  color: #5568a0 !important; /* Darker gray for placeholders */
  opacity: 1 !important;
}

/* ===============================================================================================
 * DISABLED STATES
 * ===============================================================================================
 */

.lofi-swap-button:disabled,
.swap-execute-btn:disabled,
button:disabled {
  color: #5568a0 !important; /* Keep existing disabled color */
}

/* ===============================================================================================
 * STATUS COLORS - MAINTAIN EXISTING
 * ===============================================================================================
 */

/* Success states */
.price-impact-low,
.lofi-transaction-item.success .lofi-transaction-icon,
.lofi-swap-button.success {
  color: #10b981 !important; /* Keep green */
}

/* Warning states */
.price-impact-medium,
.lofi-transaction-item.pending .lofi-transaction-icon,
.lofi-swap-message-warning {
  color: #ffaa00 !important; /* Keep yellow */
}

/* Error states */
.price-impact-high,
.lofi-transaction-item.failed .lofi-transaction-icon,
.lofi-swap-message-error,
.lofi-swap-button.error {
  color: #ff4444 !important; /* Keep red */
}

/* Info states */
.lofi-swap-message-info {
  color: #4F76FF !important; /* Keep blue */
}

/* ===============================================================================================
 * SPECIAL ELEMENTS
 * ===============================================================================================
 */

/* Reverse button */
.lofi-swap-reverse-button {
  color: #e0e0e0 !important;
}

.lofi-swap-reverse-button:hover {
  color: #ffffff !important;
}

/* Max button */
.lofi-max-button {
  color: #ffffff !important; /* White text on blue background */
}

/* Direction toggle */
.swap-direction-toggle {
  color: #ffffff !important;
}

/* Swap arrow */
.swap-arrow {
  color: #a8b8ed !important; /* Light blue/purple for arrow */
}

/* ===============================================================================================
 * DARK THEME SPECIFIC OVERRIDES
 * ===============================================================================================
 */

/* Ensure text is visible on dark backgrounds */
.lofi-swap-token-section,
.swap-input-container,
.swap-output-container {
  color: #ffffff !important;
}

/* Fix any remaining dark text on dark backgrounds */
#lofi-swap-modal .lofi-swap-container *:not(button):not(input) {
  color: inherit;
}

/* ===============================================================================================
 * ENHANCED MODAL SPECIFIC
 * ===============================================================================================
 */

/* Fix text colors in enhanced-swap-modal.css */
.lofi-balance-display {
  color: #a8b8ed !important;
}

.lofi-balance-value {
  color: #e0e0e0 !important;
}

.lofi-transaction-pair {
  color: #ffffff !important;
}

.lofi-transaction-time {
  color: #a8b8ed !important;
}

.lofi-transaction-link {
  color: #e0e0e0 !important;
}

.lofi-no-transactions {
  color: #a8b8ed !important;
}

/* ===============================================================================================
 * SWAP BALANCE MODAL SPECIFIC
 * ===============================================================================================
 */

/* Override green theme text in swap-modal-balance.css */
#lofi-swap-modal .lofi-modal-header h2 {
  color: #ffffff !important; /* White instead of green */
}

#lofi-swap-modal .lofi-balance-value {
  color: #e0e0e0 !important; /* Light gray instead of green */
}

#lofi-swap-modal .lofi-token-selector span {
  color: #ffffff !important; /* White instead of green */
}

/* ===============================================================================================
 * ENSURE READABILITY
 * ===============================================================================================
 */

/* High contrast for important elements */
.lofi-swap-button:not(:disabled),
.swap-execute-btn:not(:disabled) {
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

/* Ensure focus states are visible */
*:focus-visible {
  outline-color: #a8b8ed !important;
}

/* ===============================================================================================
 * RESPONSIVE TEXT COLOR FIXES
 * ===============================================================================================
 */

@media (max-width: 767px) {
  /* Ensure text remains visible on mobile */
  .lofi-modal-header h2,
  .lofi-swap-input,
  .swap-amount-input,
  .token-symbol {
    color: #ffffff !important;
  }
  
  .swap-label,
  .lofi-balance-display {
    color: #e0e0e0 !important;
  }
}