Kodax

موقع حساب عملات بسيط

الياس سفيان الياس

مو دقيق ١٠٠ ب١٠٠ لان ما عندي فلوس حتى احصل api المصارف

<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>المحول الشامل الذكي | العملات التقليدية والرقمية</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
  <style>
    /* ===== CSS SECTION - ENHANCED WITH AI ===== */
    @import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800;900&display=swap');
    
    :root {
      --primary: #3b82f6;
      --primary-dark: #2563eb;
      --primary-light: #60a5fa;
      --secondary: #06b6d4;
      --secondary-dark: #0891b2;
      --ai-color: #8b5cf6;
      --ai-dark: #7c3aed;
      --ai-light: #a78bfa;
      --crypto: #f59e0b;
      --crypto-dark: #d97706;
      --crypto-light: #fbbf24;
      --fiat: #10b981;
      --fiat-dark: #059669;
      --fiat-light: #34d399;
      --warning: #ef4444;
      --warning-dark: #dc2626;
      --dark: #0f172a;
      --darker: #020617;
      --light: #f8fafc;
      --lighter: #ffffff;
      --success: #10b981;
      --success-dark: #059669;
      --glass: rgba(255, 255, 255, 0.08);
      --glass-dark: rgba(255, 255, 255, 0.05);
      --glass-light: rgba(255, 255, 255, 0.12);
      --glass-border: rgba(255, 255, 255, 0.15);
      --glass-border-light: rgba(255, 255, 255, 0.25);
      --card-bg: rgba(30, 41, 59, 0.7);
      --card-bg-light: rgba(30, 41, 59, 0.8);
      --text-primary: #f1f5f9;
      --text-secondary: #cbd5e1;
      --text-muted: #94a3b8;
      --shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
      --shadow-lg: 0 15px 50px rgba(0, 0, 0, 0.2);
      --radius: 20px;
      --radius-sm: 12px;
      --radius-lg: 24px;
      --glow: 0 0 20px rgba(59, 130, 246, 0.5);
      --glow-ai: 0 0 25px rgba(139, 92, 246, 0.3);
      --glow-crypto: 0 0 25px rgba(245, 158, 11, 0.3);
      --glow-fiat: 0 0 25px rgba(16, 185, 129, 0.25);
      --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      --transition-slow: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    }

    [data-theme="dark"] {
      --bg-primary: var(--darker);
      --bg-secondary: var(--dark);
      --text-primary: #f1f5f9;
      --text-secondary: #e2e8f0;
      --card-bg: rgba(30, 41, 59, 0.7);
      --glass: rgba(255, 255, 255, 0.08);
      --glass-border: rgba(255, 255, 255, 0.15);
    }

    [data-theme="light"] {
      --bg-primary: #f8fafc;
      --bg-secondary: #f1f5f9;
      --text-primary: #1e293b;
      --text-secondary: #334155;
      --text-muted: #64748b;
      --card-bg: rgba(255, 255, 255, 0.92);
      --glass: rgba(255, 255, 255, 0.7);
      --glass-border: rgba(255, 255, 255, 0.4);
      --shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
      --shadow-lg: 0 15px 50px rgba(0, 0, 0, 0.12);
      --glow: 0 0 25px rgba(59, 130, 246, 0.15);
      --glow-ai: 0 0 25px rgba(139, 92, 246, 0.2);
    }

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      font-family: "Cairo", sans-serif;
      background: linear-gradient(-45deg, #0f172a, #1e293b, #334155, #475569);
      background-size: 400% 400%;
      animation: gradientShift 20s ease infinite;
      color: var(--text-primary);
      min-height: 100vh;
      padding: 0;
      transition: var(--transition-slow);
      position: relative;
      overflow-x: hidden;
      line-height: 1.6;
    }

    body::before {
      content: '';
      position: fixed;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background: 
        radial-gradient(circle at 20% 80%, rgba(59, 130, 246, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(245, 158, 11, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 40% 40%, rgba(139, 92, 246, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 60% 60%, rgba(6, 182, 212, 0.05) 0%, transparent 50%);
      pointer-events: none;
      z-index: -1;
    }

    #particles-js {
      position: fixed;
      width: 100%;
      height: 100%;
      top: 0;
      right: 0;
      z-index: -1;
      opacity: 0.6;
    }

    @keyframes gradientShift {
      0% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
      100% { background-position: 0% 50%; }
    }

    @keyframes pulse-glow {
      0%, 100% { box-shadow: var(--glow-ai); }
      50% { box-shadow: 0 0 35px rgba(139, 92, 246, 0.5); }
    }

    @keyframes ai-thinking {
      0%, 100% { opacity: 0.7; transform: scale(1); }
      50% { opacity: 1; transform: scale(1.05); }
    }

    .container {
      max-width: 500px;
      margin: 0 auto;
      position: relative;
      z-index: 1;
      padding: 20px;
    }

    /* ===== شريط التحكم العلوي المحسن ===== */
    .top-controls {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 20px;
      position: relative;
    }

    .theme-toggle {
      display: flex;
      gap: 8px;
      background: var(--glass);
      backdrop-filter: blur(20px);
      border: 1px solid var(--glass-border);
      border-radius: 25px;
      padding: 6px;
      transition: var(--transition);
    }

    .theme-btn {
      background: transparent;
      border: none;
      border-radius: 50%;
      width: 44px;
      height: 44px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: var(--transition);
      color: var(--text-primary);
      position: relative;
      font-size: 1.2rem;
    }

    .theme-btn.active {
      background: var(--primary);
      color: white;
      box-shadow: var(--glow);
    }

    .settings-btn {
      background: var(--glass);
      backdrop-filter: blur(20px);
      border: 1px solid var(--glass-border);
      border-radius: 50%;
      width: 44px;
      height: 44px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: var(--transition);
      color: var(--text-primary);
    }

    .settings-btn:hover {
      transform: rotate(90deg);
      background: var(--primary);
      box-shadow: var(--glow);
    }

    /* ===== الهيدر المحسن ===== */
    .app-header {
      background: #000;
      width: 100%;
      padding: 15px 0;
      margin-bottom: 25px;
      text-align: center;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    .logo {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 15px;
    }

    .logo h1 {
      font-weight: 700;
      font-size: 1.4rem;
      color: white;
      text-shadow: 0 2px 10px rgba(255, 255, 255, 0.2);
    }

    .header-controls {
      display: flex;
      align-items: center;
      justify-content: space-between;
      max-width: 500px;
      margin: 0 auto;
      padding: 0 20px;
    }

    .converter-card {
      background: var(--card-bg);
      backdrop-filter: blur(25px);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-lg);
      padding: 2.2rem;
      box-shadow: var(--shadow-lg), inset 0 1px 0 var(--glass-light);
      transition: var(--transition);
      margin-bottom: 25px;
      position: relative;
      overflow: hidden;
    }

    .converter-card::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 4px;
      background: linear-gradient(90deg, var(--fiat), var(--crypto), var(--ai-color));
      border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    }

    .converter-card::after {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(135deg, rgba(59, 130, 246, 0.03), rgba(245, 158, 11, 0.03), rgba(139, 92, 246, 0.03));
      opacity: 0;
      transition: var(--transition);
      pointer-events: none;
    }

    .converter-card:hover {
      transform: translateY(-5px);
      box-shadow: var(--shadow-lg), 
                  inset 0 1px 0 var(--glass-light),
                  var(--glow);
    }

    .converter-card:hover::after {
      opacity: 1;
    }

    .card-header {
      text-align: center;
      margin-bottom: 30px;
    }

    .card-header h2 {
      font-weight: 800;
      margin-bottom: 10px;
      font-size: 1.5rem;
      background: linear-gradient(135deg, var(--text-primary), var(--text-secondary));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }

    .card-header p {
      opacity: 0.9;
      font-size: 0.95rem;
      color: var(--text-secondary);
      font-weight: 500;
    }

    .input-group {
      margin-bottom: 1.8rem;
      position: relative;
    }

    .input-group label {
      display: block;
      margin-bottom: 10px;
      font-weight: 600;
      font-size: 0.95rem;
      color: var(--text-secondary);
      transition: var(--transition);
    }

    .input-with-icon {
      position: relative;
    }

    .input-with-icon input {
      width: 100%;
      padding: 16px 50px 16px 16px;
      border-radius: var(--radius-sm);
      border: 2px solid transparent;
      background: var(--glass-dark);
      color: var(--text-primary);
      font-size: 16px;
      font-weight: 500;
      transition: var(--transition);
      outline: none;
      backdrop-filter: blur(10px);
    }

    .input-with-icon input::placeholder {
      color: var(--text-muted);
      font-weight: 400;
    }

    .input-with-icon input:focus {
      border-color: var(--primary);
      background: var(--glass-light);
      transform: translateY(-2px);
      box-shadow: 0 5px 20px rgba(59, 130, 246, 0.15);
    }

    .input-icon {
      position: absolute;
      left: 16px;
      top: 50%;
      transform: translateY(-50%);
      font-size: 18px;
      color: var(--text-muted);
      transition: var(--transition);
    }

    .input-with-icon input:focus + .input-icon {
      color: var(--primary);
      transform: translateY(-50%) scale(1.1);
    }

    .currency-selectors {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 18px;
      margin-bottom: 25px;
    }

    .currency-selectors .input-group {
      margin-bottom: 0;
    }

    .currency-select-wrapper {
      position: relative;
    }

    .currency-select {
      width: 100%;
      padding: 16px;
      border-radius: var(--radius-sm);
      border: 2px solid transparent;
      background: var(--glass-dark);
      color: var(--text-primary);
      font-size: 14px;
      font-weight: 500;
      transition: var(--transition);
      outline: none;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: space-between;
      backdrop-filter: blur(10px);
    }

    .currency-select:hover, .currency-select.active {
      border-color: var(--primary);
      background: var(--glass-light);
      transform: translateY(-2px);
      box-shadow: 0 5px 20px rgba(59, 130, 246, 0.15);
    }

    .currency-badge {
      font-size: 0.75rem;
      padding: 4px 8px;
      border-radius: 10px;
      font-weight: 700;
      letter-spacing: 0.5px;
    }

    .fiat-badge {
      background: linear-gradient(135deg, var(--fiat), var(--fiat-dark));
      color: white;
      box-shadow: 0 2px 8px rgba(16, 185, 129, 0.3);
    }

    .crypto-badge {
      background: linear-gradient(135deg, var(--crypto), var(--crypto-dark));
      color: white;
      box-shadow: 0 2px 8px rgba(245, 158, 11, 0.3);
    }

    .ai-badge {
      background: linear-gradient(135deg, var(--ai-color), var(--ai-dark));
      color: white;
      box-shadow: 0 2px 8px rgba(139, 92, 246, 0.3);
    }

    .search-currency {
      position: absolute;
      top: 100%;
      right: 0;
      left: 0;
      background: var(--card-bg-light);
      backdrop-filter: blur(25px);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-sm);
      padding: 12px;
      margin-top: 8px;
      z-index: 100;
      box-shadow: var(--shadow-lg), var(--glow);
      display: none;
    }

    .search-currency.active {
      display: block;
      animation: slideDown 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

    @keyframes slideDown {
      from {
        opacity: 0;
        transform: translateY(-15px) scale(0.95);
      }
      to {
        opacity: 1;
        transform: translateY(0) scale(1);
      }
    }

    .search-input {
      width: 100%;
      padding: 12px;
      border-radius: 10px;
      border: 1px solid var(--glass-border);
      background: var(--glass-dark);
      color: var(--text-primary);
      margin-bottom: 12px;
      outline: none;
      transition: var(--transition);
      font-weight: 500;
    }

    .search-input:focus {
      border-color: var(--primary);
      background: var(--glass-light);
      box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
    }

    .currency-options {
      max-height: 220px;
      overflow-y: auto;
      scrollbar-width: thin;
      scrollbar-color: var(--primary) var(--glass-dark);
    }

    .currency-options::-webkit-scrollbar {
      width: 6px;
    }

    .currency-options::-webkit-scrollbar-track {
      background: var(--glass-dark);
      border-radius: 3px;
    }

    .currency-options::-webkit-scrollbar-thumb {
      background: var(--primary);
      border-radius: 3px;
    }

    .currency-option {
      padding: 10px 14px;
      border-radius: 8px;
      cursor: pointer;
      transition: var(--transition);
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 4px;
    }

    .currency-option:last-child {
      margin-bottom: 0;
    }

    .currency-option:hover {
      background: var(--glass-light);
      transform: translateX(-5px);
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }

    .option-badge {
      font-size: 0.7rem;
      padding: 3px 7px;
      border-radius: 8px;
      font-weight: 700;
    }

    .convert-btn {
      background: linear-gradient(135deg, var(--fiat), var(--crypto), var(--ai-color));
      border: none;
      border-radius: var(--radius-sm);
      padding: 18px 24px;
      color: white;
      font-size: 17px;
      font-weight: 700;
      cursor: pointer;
      transition: var(--transition);
      width: 100%;
      box-shadow: 0 6px 20px rgba(245, 158, 11, 0.3);
      position: relative;
      overflow: hidden;
      letter-spacing: 0.5px;
    }

    .convert-btn::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
      transform: translateX(-100%);
    }

    .convert-btn:hover {
      transform: translateY(-3px);
      box-shadow: 0 8px 25px rgba(245, 158, 11, 0.4), var(--glow);
    }

    .convert-btn:hover::before {
      transform: translateX(100%);
      transition: transform 0.8s ease;
    }

    .convert-btn:active {
      transform: translateY(-1px);
    }

    .convert-btn:disabled {
      opacity: 0.7;
      cursor: not-allowed;
      transform: none;
    }

    .ai-prediction-btn {
      background: linear-gradient(135deg, var(--ai-color), var(--ai-dark));
      border: none;
      border-radius: var(--radius-sm);
      padding: 14px 20px;
      color: white;
      font-size: 15px;
      font-weight: 700;
      cursor: pointer;
      transition: var(--transition);
      width: 100%;
      margin-top: 12px;
      box-shadow: 0 4px 15px rgba(139, 92, 246, 0.3);
      position: relative;
      overflow: hidden;
    }

    .ai-prediction-btn:hover {
      transform: translateY(-3px);
      box-shadow: 0 6px 20px rgba(139, 92, 246, 0.4);
      animation: pulse-glow 2s infinite;
    }

    .ai-prediction-btn:disabled {
      opacity: 0.7;
      cursor: not-allowed;
      transform: none;
    }

    .ai-thinking {
      animation: ai-thinking 1.5s infinite;
    }

    /* ===== شريط التحميل المحسن ===== */
    .progress-bar {
      height: 6px;
      background: var(--glass-dark);
      border-radius: 3px;
      overflow: hidden;
      margin: 20px 0;
      position: relative;
    }

    .progress-fill {
      height: 100%;
      background: linear-gradient(90deg, #3b82f6, #60a5fa, #93c5fd);
      border-radius: 3px;
      width: 0%;
      transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1);
      position: relative;
      box-shadow: 0 0 10px rgba(59, 130, 246, 0.7);
    }

    .progress-fill::after {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 20px;
      height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.6), transparent);
      animation: progressShine 1.5s ease-in-out infinite;
    }

    @keyframes progressShine {
      0% { transform: translateX(-20px); }
      100% { transform: translateX(100px); }
    }

    .result-card {
      background: var(--card-bg);
      backdrop-filter: blur(25px);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-lg);
      padding: 1.8rem;
      box-shadow: var(--shadow-lg);
      margin-top: 25px;
      animation: slideIn 0.6s cubic-bezier(0.4, 0, 0.2, 1);
      transition: var(--transition);
      position: relative;
      overflow: hidden;
    }

    .result-card::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 4px;
      background: linear-gradient(90deg, var(--fiat), var(--crypto), var(--ai-color));
      border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    }

    @keyframes slideIn {
      from {
        opacity: 0;
        transform: translateY(30px) scale(0.95);
      }
      to {
        opacity: 1;
        transform: translateY(0) scale(1);
      }
    }

    .result-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 18px;
    }

    .result-header h3 {
      font-weight: 700;
      font-size: 1.15rem;
      color: var(--text-secondary);
    }

    .result-badge {
      background: var(--success);
      color: white;
      padding: 6px 12px;
      border-radius: 20px;
      font-size: 0.75rem;
      font-weight: 800;
      letter-spacing: 0.5px;
      box-shadow: 0 2px 8px rgba(16, 185, 129, 0.3);
    }

    .ai-badge {
      background: var(--ai-color);
      box-shadow: 0 2px 8px rgba(139, 92, 246, 0.3);
    }

    .result-content {
      text-align: center;
    }

    .conversion-result {
      margin-bottom: 15px;
    }

    .amount {
      font-size: 2.2rem;
      font-weight: 800;
      color: var(--crypto);
      text-shadow: 0 2px 10px rgba(245, 158, 11, 0.2);
    }

    .currency {
      font-size: 1.3rem;
      margin-right: 8px;
      font-weight: 700;
      color: var(--text-secondary);
    }

    .conversion-rate {
      opacity: 0.9;
      font-size: 0.95rem;
      color: var(--text-secondary);
      font-weight: 500;
      line-height: 1.5;
    }

    .ai-prediction-card {
      background: var(--card-bg);
      backdrop-filter: blur(25px);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-lg);
      padding: 1.8rem;
      box-shadow: var(--shadow-lg);
      margin-top: 25px;
      animation: slideIn 0.6s cubic-bezier(0.4, 0, 0.2, 1);
      transition: var(--transition);
      position: relative;
      overflow: hidden;
      display: none;
    }

    .ai-prediction-card::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 4px;
      background: var(--ai-color);
      border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    }

    .ai-prediction-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 18px;
    }

    .ai-prediction-header h3 {
      font-weight: 700;
      font-size: 1.15rem;
      color: var(--text-secondary);
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .ai-prediction-content {
      text-align: center;
    }

    .prediction-result {
      margin-bottom: 15px;
    }

    .prediction-amount {
      font-size: 2rem;
      font-weight: 800;
      color: var(--ai-color);
      text-shadow: 0 2px 10px rgba(139, 92, 246, 0.2);
    }

    .prediction-currency {
      font-size: 1.2rem;
      margin-right: 8px;
      font-weight: 700;
      color: var(--text-secondary);
    }

    .prediction-details {
      opacity: 0.9;
      font-size: 0.9rem;
      color: var(--text-secondary);
      font-weight: 500;
      line-height: 1.5;
      margin-bottom: 15px;
    }

    .prediction-confidence {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      margin-top: 15px;
    }

    .confidence-bar {
      flex: 1;
      height: 8px;
      background: var(--glass-dark);
      border-radius: 4px;
      overflow: hidden;
    }

    .confidence-fill {
      height: 100%;
      background: linear-gradient(90deg, var(--warning), var(--crypto), var(--success));
      border-radius: 4px;
      width: 0%;
      transition: width 1s ease;
    }

    .confidence-value {
      font-size: 0.85rem;
      font-weight: 700;
      min-width: 40px;
    }

    .prediction-timeframe {
      display: flex;
      gap: 10px;
      margin-top: 15px;
    }

    .timeframe-btn {
      flex: 1;
      background: var(--glass);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-sm);
      padding: 10px;
      text-align: center;
      cursor: pointer;
      transition: var(--transition);
      font-size: 0.85rem;
      font-weight: 600;
    }

    .timeframe-btn.active {
      background: var(--ai-color);
      color: white;
      border-color: var(--ai-color);
    }

    .timeframe-btn:hover:not(.active) {
      background: var(--glass-light);
      transform: translateY(-2px);
    }

    .stats-container {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 18px;
      margin-top: 25px;
    }

    .stat-card {
      background: var(--glass);
      backdrop-filter: blur(15px);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-sm);
      padding: 18px;
      text-align: center;
      transition: var(--transition);
      position: relative;
      overflow: hidden;
    }

    .stat-card::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 3px;
      background: linear-gradient(90deg, var(--primary), var(--secondary));
      border-radius: var(--radius-sm) var(--radius-sm) 0 0;
    }

    .stat-card:hover {
      transform: translateY(-5px);
      box-shadow: var(--glow);
    }

    .stat-value {
      font-size: 1.3rem;
      font-weight: 800;
      margin-bottom: 6px;
      color: var(--crypto);
    }

    .stat-label {
      font-size: 0.85rem;
      opacity: 0.8;
      font-weight: 600;
      color: var(--text-secondary);
    }

    .quick-actions {
      display: flex;
      gap: 12px;
      margin-top: 20px;
    }

    .quick-action {
      flex: 1;
      background: var(--glass);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-sm);
      padding: 12px;
      text-align: center;
      cursor: pointer;
      transition: var(--transition);
      font-size: 0.9rem;
      font-weight: 600;
      position: relative;
      overflow: hidden;
    }

    .quick-action::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(245, 158, 11, 0.1));
      opacity: 0;
      transition: var(--transition);
    }

    .quick-action:hover {
      background: var(--glass-light);
      transform: translateY(-3px);
      box-shadow: var(--glow);
    }

    .quick-action:hover::before {
      opacity: 1;
    }

    .ai-action {
      background: linear-gradient(135deg, rgba(139, 92, 246, 0.1), rgba(59, 130, 246, 0.1));
      border-color: var(--ai-color);
    }

    .ai-action:hover {
      box-shadow: var(--glow-ai);
    }

    /* ===== شريط التبويبات المحسن ===== */
    .tabs-container {
      display: flex;
      background: var(--glass-dark);
      border-radius: var(--radius);
      padding: 8px;
      margin-bottom: 25px;
      backdrop-filter: blur(10px);
      border: 1px solid var(--glass-border);
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
      position: relative;
      overflow: hidden;
    }

    .tabs-container::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(135deg, rgba(59, 130, 246, 0.05), rgba(139, 92, 246, 0.05));
      opacity: 0;
      transition: var(--transition);
    }

    .tabs-container:hover::before {
      opacity: 1;
    }

    .tab {
      flex: 1;
      text-align: center;
      padding: 14px 12px;
      cursor: pointer;
      border-radius: 12px;
      transition: var(--transition);
      font-weight: 700;
      font-size: 0.9rem;
      color: var(--text-secondary);
      position: relative;
      overflow: hidden;
      z-index: 1;
    }

    .tab::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(135deg, var(--primary), var(--secondary));
      opacity: 0;
      transition: var(--transition);
    }

    .tab.active {
      background: var(--primary);
      color: white;
      box-shadow: 0 4px 15px rgba(59, 130, 246, 0.4);
      transform: translateY(-2px);
    }

    .tab.active::before {
      opacity: 1;
    }

    .tab span {
      position: relative;
      z-index: 1;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
    }

    .tab-content {
      display: none;
      animation: fadeIn 0.5s ease;
    }

    .tab-content.active {
      display: block;
    }

    @keyframes fadeIn {
      from { opacity: 0; transform: translateY(10px); }
      to { opacity: 1; transform: translateY(0); }
    }

    .crypto-rates-card, .local-rates-card, .sources-card, .news-card, .ai-insights-card {
      background: var(--card-bg);
      backdrop-filter: blur(25px);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-lg);
      padding: 1.8rem;
      box-shadow: var(--shadow-lg);
      margin-top: 25px;
      transition: var(--transition);
      position: relative;
      overflow: hidden;
    }

    .crypto-rates-card::before {
      background: var(--crypto);
    }

    .local-rates-card::before {
      background: var(--fiat);
    }

    .sources-card::before {
      background: var(--secondary);
    }

    .news-card::before {
      background: var(--primary);
    }

    .ai-insights-card::before {
      background: var(--ai-color);
    }

    .crypto-rates-card::before, .local-rates-card::before, 
    .sources-card::before, .news-card::before, .ai-insights-card::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 4px;
      border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    }

    .crypto-rates-card:hover, .local-rates-card:hover, 
    .sources-card:hover, .news-card:hover, .ai-insights-card:hover {
      transform: translateY(-5px);
      box-shadow: var(--shadow-lg), var(--glow);
    }

    .ai-insights-card:hover {
      box-shadow: var(--shadow-lg), var(--glow-ai);
    }

    .crypto-rates-header, .local-rates-header, 
    .sources-header, .news-header, .ai-insights-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 18px;
    }

    .crypto-rates-header h3, .local-rates-header h3, 
    .sources-header h3, .news-header h3, .ai-insights-header h3 {
      font-weight: 700;
      font-size: 1.15rem;
      display: flex;
      align-items: center;
      gap: 12px;
      color: var(--text-secondary);
    }

    .crypto-rates-icon {
      color: var(--crypto);
    }

    .local-rates-icon {
      color: var(--fiat);
    }

    .sources-icon {
      color: var(--secondary);
    }

    .news-icon {
      color: var(--primary);
    }

    .ai-insights-icon {
      color: var(--ai-color);
    }

    .crypto-rates-icon, .local-rates-icon, 
    .sources-icon, .news-icon, .ai-insights-icon {
      font-size: 1.4rem;
    }

    .crypto-rates-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(145px, 1fr));
      gap: 12px;
    }

    .crypto-rate-item {
      background: var(--glass);
      border-radius: var(--radius-sm);
      padding: 16px;
      text-align: center;
      transition: var(--transition);
      cursor: pointer;
      border: 1px solid transparent;
      position: relative;
      overflow: hidden;
    }

    .crypto-rate-item::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(135deg, rgba(245, 158, 11, 0.05), rgba(59, 130, 246, 0.05));
      opacity: 0;
      transition: var(--transition);
    }

    .crypto-rate-item:hover {
      transform: translateY(-5px);
      background: var(--glass-light);
      border-color: var(--crypto);
      box-shadow: 0 6px 20px rgba(245, 158, 11, 0.2);
    }

    .crypto-rate-item:hover::before {
      opacity: 1;
    }

    .crypto-rate-icon {
      font-size: 1.6rem;
      margin-bottom: 8px;
      transition: var(--transition);
    }

    .crypto-rate-item:hover .crypto-rate-icon {
      transform: scale(1.1) rotate(5deg);
    }

    .crypto-rate-name {
      font-weight: 700;
      font-size: 0.95rem;
      margin-bottom: 4px;
    }

    .crypto-rate-symbol {
      font-size: 0.75rem;
      opacity: 0.7;
      margin-bottom: 6px;
      font-weight: 600;
    }

    .crypto-rate-value {
      font-size: 0.85rem;
      opacity: 0.9;
      font-weight: 700;
      color: var(--crypto);
    }

    .local-rates-table {
      width: 100%;
      border-collapse: collapse;
      font-size: 0.92rem;
    }

    .local-rates-table th {
      text-align: right;
      padding: 14px;
      background: var(--glass);
      border-bottom: 2px solid var(--glass-border);
      font-weight: 700;
      color: var(--text-secondary);
    }

    .local-rates-table td {
      padding: 14px;
      border-bottom: 1px solid var(--glass-border);
      transition: var(--transition);
    }

    .local-rates-table tr:last-child td {
      border-bottom: none;
    }

    .local-rates-table tr:hover td {
      background: var(--glass-light);
    }

    .rate-value {
      font-weight: 700;
      color: var(--fiat);
    }

    .country-selector {
      margin-bottom: 18px;
    }

    .country-select {
      width: 100%;
      padding: 14px;
      border-radius: var(--radius-sm);
      border: 2px solid transparent;
      background: var(--glass-dark);
      color: var(--text-primary);
      font-size: 14px;
      font-weight: 500;
      transition: var(--transition);
      outline: none;
      cursor: pointer;
      backdrop-filter: blur(10px);
    }

    .country-select:focus {
      border-color: var(--primary);
      background: var(--glass-light);
      box-shadow: 0 5px 20px rgba(59, 130, 246, 0.15);
    }

    .ai-insights-content {
      margin-top: 18px;
    }

    .ai-insight-item {
      background: var(--glass);
      border-radius: var(--radius-sm);
      padding: 18px;
      margin-bottom: 15px;
      transition: var(--transition);
      border-left: 4px solid var(--ai-color);
      position: relative;
      overflow: hidden;
    }

    .ai-insight-item::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(135deg, rgba(139, 92, 246, 0.05), rgba(59, 130, 246, 0.05));
      opacity: 0;
      transition: var(--transition);
    }

    .ai-insight-item:hover {
      transform: translateX(-5px);
      background: var(--glass-light);
    }

    .ai-insight-item:hover::before {
      opacity: 1;
    }

    .ai-insight-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 10px;
      position: relative;
      z-index: 1;
    }

    .ai-insight-title {
      font-weight: 700;
      font-size: 1rem;
      color: var(--text-secondary);
    }

    .ai-insight-confidence {
      font-size: 0.8rem;
      padding: 4px 8px;
      border-radius: 12px;
      background: var(--ai-color);
      color: white;
      font-weight: 700;
    }

    .ai-insight-content {
      font-size: 0.9rem;
      opacity: 0.9;
      line-height: 1.6;
      position: relative;
      z-index: 1;
    }

    .ai-insight-meta {
      display: flex;
      justify-content: space-between;
      margin-top: 12px;
      font-size: 0.8rem;
      opacity: 0.7;
      position: relative;
      z-index: 1;
    }

    .sources-list {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 12px;
      margin: 18px 0;
    }

    .source-item {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 14px;
      background: var(--glass);
      border-radius: var(--radius-sm);
      font-size: 0.92rem;
      transition: var(--transition);
      border: 1px solid transparent;
      position: relative;
      overflow: hidden;
    }

    .source-item::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 4px;
      height: 100%;
      background: var(--success);
      transition: var(--transition);
    }

    .source-item:hover {
      transform: translateY(-3px);
      border-color: var(--secondary);
      box-shadow: 0 4px 15px rgba(6, 182, 212, 0.2);
    }

    .source-item.active::before {
      background: var(--success);
    }

    .source-item.inactive::before {
      background: var(--warning);
    }

    .source-item i {
      color: var(--success);
      font-size: 1.1rem;
    }

    .source-item.inactive i {
      color: var(--warning);
    }

    .source-item small {
      margin-right: auto;
      opacity: 0.7;
      font-weight: 600;
    }

    .performance-stats {
      background: var(--glass);
      border-radius: var(--radius-sm);
      padding: 18px;
      font-size: 0.88rem;
      opacity: 0.9;
      margin-bottom: 18px;
      border: 1px solid var(--glass-border);
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }

    .performance-stats div {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 6px 0;
    }

    .performance-stats strong {
      color: var(--text-secondary);
      font-weight: 700;
    }

    .settings-section {
      background: var(--glass);
      border-radius: var(--radius-sm);
      padding: 18px;
      margin-top: 18px;
      border: 1px solid var(--glass-border);
    }

    .setting-item {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 14px;
      padding: 10px 0;
      border-bottom: 1px solid var(--glass-border);
    }

    .setting-item:last-child {
      margin-bottom: 0;
      border-bottom: none;
    }

    .setting-label {
      font-size: 0.92rem;
      font-weight: 600;
      color: var(--text-secondary);
    }

    .toggle-switch {
      position: relative;
      display: inline-block;
      width: 52px;
      height: 26px;
    }

    .toggle-switch input {
      opacity: 0;
      width: 0;
      height: 0;
    }

    .toggle-slider {
      position: absolute;
      cursor: pointer;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: var(--glass-dark);
      transition: var(--transition);
      border-radius: 26px;
      border: 1px solid var(--glass-border);
    }

    .toggle-slider:before {
      position: absolute;
      content: "";
      height: 18px;
      width: 18px;
      left: 4px;
      bottom: 3px;
      background-color: white;
      transition: var(--transition);
      border-radius: 50%;
      box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    }

    input:checked + .toggle-slider {
      background-color: var(--success);
      border-color: var(--success);
    }

    input:checked + .toggle-slider:before {
      transform: translateX(26px);
    }

    .ai-toggle input:checked + .toggle-slider {
      background-color: var(--ai-color);
      border-color: var(--ai-color);
    }

    .news-list {
      display: flex;
      flex-direction: column;
      gap: 15px;
    }

    .news-item {
      background: var(--glass);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-sm);
      padding: 18px;
      transition: var(--transition);
      cursor: pointer;
      position: relative;
      overflow: hidden;
    }

    .news-item::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(135deg, rgba(59, 130, 246, 0.05), rgba(6, 182, 212, 0.05));
      opacity: 0;
      transition: var(--transition);
    }

    .news-item:hover {
      background: var(--glass-light);
      transform: translateX(-5px);
      box-shadow: 0 6px 20px rgba(59, 130, 246, 0.15);
    }

    .news-item:hover::before {
      opacity: 1;
    }

    .news-title {
      font-weight: 700;
      margin-bottom: 10px;
      display: flex;
      align-items: center;
      gap: 10px;
      color: var(--text-secondary);
    }

    .news-badge {
      background: var(--primary);
      color: white;
      padding: 3px 10px;
      border-radius: 12px;
      font-size: 0.75rem;
      font-weight: 800;
    }

    .news-content {
      font-size: 0.92rem;
      opacity: 0.9;
      margin-bottom: 10px;
      line-height: 1.6;
      color: var(--text-primary);
    }

    .news-meta {
      display: flex;
      justify-content: space-between;
      font-size: 0.8rem;
      opacity: 0.7;
      font-weight: 600;
    }

    .news-date {
      display: flex;
      align-items: center;
      gap: 6px;
    }

    footer {
      text-align: center;
      margin-top: 35px;
      font-size: 0.85rem;
      opacity: 0.7;
      padding: 20px 0;
      color: var(--text-secondary);
      font-weight: 600;
    }

    .favorites-section {
      background: var(--glass);
      border-radius: var(--radius-sm);
      padding: 18px;
      margin-top: 18px;
      border: 1px solid var(--glass-border);
    }

    .favorites-list {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 12px;
    }

    .favorite-item {
      background: var(--card-bg);
      border: 1px solid var(--glass-border);
      border-radius: 10px;
      padding: 10px 14px;
      font-size: 0.82rem;
      cursor: pointer;
      transition: var(--transition);
      display: flex;
      align-items: center;
      gap: 6px;
      font-weight: 600;
      position: relative;
      overflow: hidden;
    }

    .favorite-item::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(135deg, rgba(245, 158, 11, 0.1), rgba(59, 130, 246, 0.1));
      opacity: 0;
      transition: var(--transition);
    }

    .favorite-item:hover {
      background: var(--glass-light);
      transform: translateY(-3px);
      border-color: var(--crypto);
    }

    .favorite-item:hover::before {
      opacity: 1;
    }

    .favorite-item.active {
      border-color: var(--crypto);
      background: rgba(245, 158, 11, 0.1);
    }

    .remove-favorite {
      color: var(--warning);
      cursor: pointer;
      margin-right: 5px;
      transition: var(--transition);
      position: relative;
      z-index: 1;
    }

    .remove-favorite:hover {
      color: var(--warning-dark);
      transform: scale(1.1);
    }

    .history-section {
      background: var(--glass);
      border-radius: var(--radius-sm);
      padding: 18px;
      margin-top: 18px;
      border: 1px solid var(--glass-border);
    }

    .history-list {
      max-height: 160px;
      overflow-y: auto;
      margin-top: 12px;
      scrollbar-width: thin;
      scrollbar-color: var(--primary) var(--glass-dark);
    }

    .history-list::-webkit-scrollbar {
      width: 6px;
    }

    .history-list::-webkit-scrollbar-track {
      background: var(--glass-dark);
      border-radius: 3px;
    }

    .history-list::-webkit-scrollbar-thumb {
      background: var(--primary);
      border-radius: 3px;
    }

    .history-item {
      padding: 10px 12px;
      border-bottom: 1px solid var(--glass-border);
      font-size: 0.82rem;
      display: flex;
      justify-content: space-between;
      align-items: center;
      transition: var(--transition);
    }

    .history-item:last-child {
      border-bottom: none;
    }

    .history-item:hover {
      background: var(--glass-light);
      border-radius: 8px;
    }

    .history-amount {
      font-weight: 700;
      color: var(--crypto);
    }

    .quick-convert-buttons {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 10px;
      margin-top: 18px;
    }

    .quick-convert-btn {
      background: var(--glass);
      border: 1px solid var(--glass-border);
      border-radius: 10px;
      padding: 10px;
      text-align: center;
      cursor: pointer;
      transition: var(--transition);
      font-size: 0.82rem;
      font-weight: 600;
      position: relative;
      overflow: hidden;
    }

    .quick-convert-btn::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(245, 158, 11, 0.1));
      opacity: 0;
      transition: var(--transition);
    }

    .quick-convert-btn:hover {
      background: var(--glass-light);
      transform: translateY(-3px);
      border-color: var(--primary);
    }

    .quick-convert-btn:hover::before {
      opacity: 1;
    }

    .quick-convert-btn.active {
      background: var(--primary);
      color: white;
      border-color: var(--primary);
    }

    .ai-quick-convert-btn {
      background: linear-gradient(135deg, rgba(139, 92, 246, 0.1), rgba(59, 130, 246, 0.1));
      border-color: var(--ai-color);
    }

    .ai-quick-convert-btn:hover {
      border-color: var(--ai-dark);
      box-shadow: 0 4px 12px rgba(139, 92, 246, 0.2);
    }

    .loading-spinner {
      display: inline-block;
      width: 22px;
      height: 22px;
      border: 3px solid rgba(255,255,255,.3);
      border-radius: 50%;
      border-top-color: var(--primary);
      animation: spin 1s ease-in-out infinite;
    }

    .ai-loading-spinner {
      border-top-color: var(--ai-color);
    }

    @keyframes spin {
      to { transform: rotate(360deg); }
    }

    .offline-indicator {
      position: fixed;
      top: 15px;
      right: 15px;
      background: var(--warning);
      color: white;
      padding: 8px 16px;
      border-radius: 25px;
      font-size: 0.82rem;
      z-index: 1000;
      display: none;
      font-weight: 700;
      box-shadow: 0 4px 15px rgba(239, 68, 68, 0.3);
      animation: pulse-glow 2s ease-in-out infinite;
    }

    .notification {
      position: fixed;
      top: 25px;
      left: 25px;
      right: 25px;
      background: var(--card-bg-light);
      backdrop-filter: blur(25px);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius);
      padding: 18px;
      box-shadow: var(--shadow-lg), var(--glow);
      z-index: 1100;
      transform: translateY(-120px);
      opacity: 0;
      transition: var(--transition-slow);
    }

    .notification.show {
      transform: translateY(0);
      opacity: 1;
    }

    .notification.success {
      border-right: 4px solid var(--success);
    }

    .notification.error {
      border-right: 4px solid var(--warning);
    }

    .notification.warning {
      border-right: 4px solid var(--crypto);
    }

    .notification.ai {
      border-right: 4px solid var(--ai-color);
    }

    .notification-content {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .notification-icon {
      font-size: 22px;
    }

    .notification.success .notification-icon {
      color: var(--success);
    }

    .notification.error .notification-icon {
      color: var(--warning);
    }

    .notification.warning .notification-icon {
      color: var(--crypto);
    }

    .notification.ai .notification-icon {
      color: var(--ai-color);
    }

    .notification-message {
      font-weight: 600;
      font-size: 0.95rem;
    }

    @keyframes shake {
      0%, 100% { transform: translateX(0); }
      10%, 30%, 50%, 70%, 90% { transform: translateX(-5px); }
      20%, 40%, 60%, 80% { transform: translateX(5px); }
    }

    .shake {
      animation: shake 0.5s ease-in-out;
    }

    /* ===== صفحة الإعدادات المحسنة ===== */
    .settings-page {
      position: fixed;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background: var(--bg-primary);
      z-index: 2000;
      overflow-y: auto;
      padding: 20px;
      transform: translateX(100%);
      transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .settings-page.active {
      transform: translateX(0);
    }

    .settings-header {
      background: #000;
      width: 100%;
      padding: 15px 0;
      margin-bottom: 25px;
      text-align: center;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      position: relative;
    }

    .settings-header-content {
      display: flex;
      align-items: center;
      justify-content: space-between;
      max-width: 500px;
      margin: 0 auto;
      padding: 0 20px;
    }

    .settings-title {
      font-weight: 700;
      font-size: 1.4rem;
      color: white;
      text-shadow: 0 2px 10px rgba(255, 255, 255, 0.2);
    }

    .close-settings {
      background: transparent;
      border: none;
      color: white;
      font-size: 1.5rem;
      cursor: pointer;
      transition: var(--transition);
      width: 44px;
      height: 44px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
    }

    .close-settings:hover {
      background: rgba(255, 255, 255, 0.1);
      transform: rotate(90deg);
    }

    .contact-info {
      background: var(--glass);
      border-radius: var(--radius);
      padding: 25px;
      margin-bottom: 25px;
      text-align: center;
      border: 1px solid var(--glass-border);
    }

    .contact-info h3 {
      color: var(--text-secondary);
      margin-bottom: 15px;
      font-size: 1.2rem;
    }

    .contact-email {
      background: var(--primary);
      color: white;
      padding: 12px 20px;
      border-radius: var(--radius-sm);
      font-weight: 700;
      display: inline-block;
      transition: var(--transition);
      text-decoration: none;
    }

    .contact-email:hover {
      background: var(--primary-dark);
      transform: translateY(-2px);
      box-shadow: var(--glow);
    }

    /* تحسينات للجوال */
    @media (max-width: 768px) {
      .container {
        padding: 0 15px;
      }
      
      .converter-card {
        padding: 1.8rem;
        border-radius: 18px;
      }
      
      .currency-selectors {
        grid-template-columns: 1fr;
        gap: 18px;
      }
      
      .app-header {
        padding: 12px 0;
      }
      
      .logo h1 {
        font-size: 1.2rem;
      }
      
      .stats-container {
        grid-template-columns: 1fr;
      }
      
      .quick-actions {
        flex-direction: column;
      }
      
      .crypto-rates-grid {
        grid-template-columns: repeat(2, 1fr);
      }
      
      .sources-list {
        grid-template-columns: 1fr;
      }
      
      .quick-convert-buttons {
        grid-template-columns: repeat(2, 1fr);
      }
      
      .performance-stats {
        grid-template-columns: 1fr;
      }
      
      .notification {
        left: 15px;
        right: 15px;
        top: 15px;
      }
      
      .top-controls {
        margin-bottom: 25px;
      }
      
      .prediction-timeframe {
        flex-direction: column;
      }
      
      .tabs-container {
        padding: 6px;
      }
      
      .tab {
        padding: 12px 8px;
        font-size: 0.8rem;
      }
    }

    @media (max-width: 480px) {
      body {
        padding: 0;
      }
      
      .container {
        padding: 0 15px;
      }
      
      .converter-card {
        padding: 1.5rem;
      }
      
      .crypto-rates-grid {
        grid-template-columns: 1fr;
      }
      
      .quick-convert-buttons {
        grid-template-columns: 1fr;
      }
      
      .logo h1 {
        font-size: 1.1rem;
      }
      
      .tabs-container {
        flex-wrap: wrap;
      }
      
      .tab {
        flex: 1 0 45%;
        margin-bottom: 5px;
      }
    }

    /* تحسينات للأجهزة الكبيرة */
    @media (min-width: 1200px) {
      .container {
        max-width: 550px;
      }
    }

    /* تحسينات خاصة بالطباعة */
    @media print {
      .top-controls,
      .tabs-container,
      .quick-actions,
      .favorites-section,
      .history-section,
      .offline-indicator,
      .notification {
        display: none !important;
      }
      
      body {
        background: white !important;
        color: black !important;
      }
      
      .converter-card,
      .result-card {
        box-shadow: none !important;
        border: 1px solid #ddd !important;
      }
    }
  </style>
</head>
<body data-theme="dark">
  <!-- ===== HTML SECTION - ENHANCED WITH AI ===== -->
  <div id="particles-js"></div>

  <div class="offline-indicator" id="offlineIndicator">
    <i class="fas fa-wifi"></i> غير متصل
  </div>

  <div class="notification" id="notification">
    <div class="notification-content">
      <span class="notification-icon"></span>
      <span class="notification-message"></span>
    </div>
  </div>

  <!-- ===== صفحة الإعدادات المحسنة ===== -->
  <div class="settings-page" id="settingsPage">
    <div class="settings-header">
      <div class="settings-header-content">
        <div class="settings-title">الإعدادات</div>
        <button class="close-settings" id="closeSettings">
          <i class="fas fa-times"></i>
        </button>
      </div>
    </div>

    <div class="container">
      <div class="contact-info">
        <h3><i class="fas fa-envelope"></i> بريد التواصل</h3>
        <a href="mailto:alias.soufian@gmail.com" class="contact-email">
          alias.soufian@gmail.com
        </a>
      </div>

      <div class="sources-card">
        <div class="sources-header">
          <h3><i class="fas fa-cog sources-icon"></i> المصادر والإعدادات</h3>
          <span class="result-badge">متقدم</span>
        </div>
        
        <div class="performance-stats" id="performanceStats">
          <div><strong>معدل النجاح:</strong> <span id="successRate">0%</span></div>
          <div><strong>الطلبات الناجحة:</strong> <span id="successfulRequests">0</span></div>
          <div><strong>الطلبات الفاشلة:</strong> <span id="failedRequests">0</span></div>
          <div><strong>آخر تحديث:</strong> <span id="statsLastUpdate">--:--</span></div>
        </div>
        
        <div class="sources-list" id="sourcesList"></div>
        
        <div class="settings-section">
          <h4 style="margin-bottom: 18px; color: var(--text-secondary);">
            <i class="fas fa-sliders-h"></i> إعدادات التحويل
          </h4>
          <div class="setting-item">
            <span class="setting-label">تفعيل التحديث التلقائي</span>
            <label class="toggle-switch">
              <input type="checkbox" id="autoUpdateToggle" checked>
              <span class="toggle-slider"></span>
            </label>
          </div>
          <div class="setting-item">
            <span class="setting-label">تفعيل الذكاء الاصطناعي</span>
            <label class="toggle-switch ai-toggle">
              <input type="checkbox" id="aiToggle" checked>
              <span class="toggle-slider"></span>
            </label>
          </div>
          <div class="setting-item">
            <span class="setting-label">تقليل استخدام البيانات</span>
            <label class="toggle-switch">
              <input type="checkbox" id="dataSavingToggle">
              <span class="toggle-slider"></span>
            </label>
          </div>
          <div class="setting-item">
            <span class="setting-label">حفظ سجل التحويلات</span>
            <label class="toggle-switch">
              <input type="checkbox" id="saveHistoryToggle" checked>
              <span class="toggle-slider"></span>
            </label>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- ===== الواجهة الرئيسية ===== -->
  <header class="app-header">
    <div class="header-controls">
      <div class="logo">
        <h1>المحول الشامل</h1>
      </div>
      <div class="top-controls">
        <div class="theme-toggle">
          <button class="theme-btn active" id="themeToggle" title="تبديل الوضع">
            <i class="fas fa-moon"></i>
          </button>
        </div>
        <button class="settings-btn" id="settingsBtn" title="الإعدادات">
          <i class="fas fa-cog"></i>
        </button>
      </div>
    </div>
  </header>

  <div class="container">
    <div class="tabs-container">
      <div class="tab active" data-tab="converter">
        <span><i class="fas fa-exchange-alt"></i> المحول</span>
      </div>
      <div class="tab" data-tab="crypto">
        <span><i class="fas fa-coins"></i> الرقمية</span>
      </div>
      <div class="tab" data-tab="local">
        <span><i class="fas fa-map-marker-alt"></i> المحلية</span>
      </div>
      <div class="tab" data-tab="news">
        <span><i class="fas fa-newspaper"></i> الأخبار</span>
      </div>
      <div class="tab" data-tab="ai">
        <span><i class="fas fa-robot"></i> الذكاء</span>
      </div>
    </div>

    <!-- تبويب المحول -->
    <div class="tab-content active" id="converter-tab">
      <div class="converter-card">
        <div class="card-header">
          <h2>تحويل العملات الذكي</h2>
          <p>تحويل سريع ودقيق مع تنبؤات الذكاء الاصطناعي</p>
        </div>
        
        <div class="input-group">
          <label><i class="fas fa-money-bill-wave"></i> المبلغ المطلوب تحويله</label>
          <div class="input-with-icon">
            <input type="number" id="amount" placeholder="0.00" min="0" step="0.01">
            <span class="input-icon">💵</span>
          </div>
        </div>

        <div class="currency-selectors">
          <div class="input-group">
            <label><i class="fas fa-arrow-down"></i> من عملة</label>
            <div class="currency-select-wrapper">
              <div class="currency-select" id="fromCurrencySelect">
                <span>الدولار الأمريكي (USD)</span>
                <span class="currency-badge fiat-badge">تقليدية</span>
              </div>
              <div class="search-currency" id="fromSearch">
                <input type="text" class="search-input" placeholder="ابحث عن عملة...">
                <div class="currency-options" id="fromOptions"></div>
              </div>
            </div>
          </div>
          <div class="input-group">
            <label><i class="fas fa-arrow-up"></i> إلى عملة</label>
            <div class="currency-select-wrapper">
              <div class="currency-select" id="toCurrencySelect">
                <span>الدينار العراقي (IQD)</span>
                <span class="currency-badge fiat-badge">تقليدية</span>
              </div>
              <div class="search-currency" id="toSearch">
                <input type="text" class="search-input" placeholder="ابحث عن عملة...">
                <div class="currency-options" id="toOptions"></div>
              </div>
            </div>
          </div>
        </div>

        <div class="progress-bar">
          <div class="progress-fill" id="progressFill"></div>
        </div>

        <button class="convert-btn" id="convertBtn">
          <i class="fas fa-sync-alt"></i> تحويل العملة
        </button>

        <button class="ai-prediction-btn" id="aiPredictionBtn">
          <i class="fas fa-robot"></i> تنبؤ الذكاء الاصطناعي
        </button>

        <div class="quick-actions">
          <div class="quick-action" id="reverseAction">
            <i class="fas fa-retweet"></i> عكس العملات
          </div>
          <div class="quick-action" id="favoriteAction">
            <i class="fas fa-star"></i> إضافة للمفضلة
          </div>
          <div class="quick-action ai-action" id="aiInsightAction">
            <i class="fas fa-brain"></i> رؤى الذكاء
          </div>
          <div class="quick-action" id="clearAction">
            <i class="fas fa-broom"></i> مسح الكل
          </div>
        </div>

        <div class="favorites-section" id="favoritesSection" style="display: none;">
          <h4><i class="fas fa-star" style="color: var(--crypto);"></i> العملات المفضلة</h4>
          <div class="favorites-list" id="favoritesList"></div>
        </div>

        <div class="stats-container">
          <div class="stat-card">
            <div class="stat-value" id="marketRate">0.00</div>
            <div class="stat-label">سعر السوق الحالي</div>
          </div>
          <div class="stat-card">
            <div class="stat-value" id="lastUpdate">--:--</div>
            <div class="stat-label">آخر تحديث</div>
          </div>
        </div>
      </div>

      <div class="result-card" id="resultCard" style="display: none;">
        <div class="result-header">
          <h3>نتيجة التحويل</h3>
          <span class="result-badge" id="resultBadge">محدث</span>
        </div>
        <div class="result-content">
          <div class="conversion-result">
            <span class="amount" id="convertedAmount">0.00</span>
            <span class="currency" id="convertedCurrency">IQD</span>
          </div>
          <div class="conversion-rate" id="conversionRate">
            1 USD = 0.00 IQD
          </div>
        </div>
      </div>

      <div class="ai-prediction-card" id="aiPredictionCard">
        <div class="ai-prediction-header">
          <h3><i class="fas fa-robot"></i> تنبؤ الذكاء الاصطناعي</h3>
          <span class="result-badge ai-badge">AI</span>
        </div>
        <div class="ai-prediction-content">
          <div class="prediction-result">
            <span class="prediction-amount" id="predictedAmount">0.00</span>
            <span class="prediction-currency" id="predictedCurrency">IQD</span>
          </div>
          <div class="prediction-details" id="predictionDetails">
            تنبؤ بسعر الصرف المستقبلي بناءً على تحليل الذكاء الاصطناعي
          </div>
          <div class="prediction-confidence">
            <span>ثقة التنبؤ:</span>
            <div class="confidence-bar">
              <div class="confidence-fill" id="confidenceFill"></div>
            </div>
            <span class="confidence-value" id="confidenceValue">0%</span>
          </div>
          <div class="prediction-timeframe">
            <div class="timeframe-btn active" data-timeframe="1d">يوم</div>
            <div class="timeframe-btn" data-timeframe="1w">أسبوع</div>
            <div class="timeframe-btn" data-timeframe="1m">شهر</div>
            <div class="timeframe-btn" data-timeframe="3m">3 أشهر</div>
          </div>
        </div>
      </div>

      <div class="history-section" id="historySection" style="display: none;">
        <h4><i class="fas fa-history"></i> آخر التحويلات</h4>
        <div class="history-list" id="historyList"></div>
      </div>
    </div>

    <!-- تبويب العملات الرقمية -->
    <div class="tab-content" id="crypto-tab">
      <div class="crypto-rates-card">
        <div class="crypto-rates-header">
          <h3><i class="fas fa-coins crypto-rates-icon"></i> أسعار العملات الرقمية</h3>
          <span class="result-badge">مباشر</span>
        </div>
        <div class="crypto-rates-grid" id="cryptoRatesGrid"></div>
      </div>
    </div>

    <!-- تبويب الأسعار المحلية -->
    <div class="tab-content" id="local-tab">
      <div class="local-rates-card">
        <div class="local-rates-header">
          <h3><i class="fas fa-map-marker-alt local-rates-icon"></i> الأسعار المحلية</h3>
          <span class="result-badge" id="localRatesUpdate">تحديث: اليوم</span>
        </div>
        
        <div class="country-selector">
          <select class="country-select" id="countrySelect">
            <option value="iraq">العراق - الدينار العراقي</option>
            <option value="saudi">السعودية - الريال السعودي</option>
            <option value="uae">الإمارات - الدرهم الإماراتي</option>
            <option value="egypt">مصر - الجنيه المصري</option>
            <option value="jordan">الأردن - الدينار الأردني</option>
          </select>
        </div>
        
        <table class="local-rates-table">
          <thead>
            <tr>
              <th>المدينة/المنطقة</th>
              <th>سعر 100 دولار</th>
              <th>سعر 1 دولار</th>
            </tr>
          </thead>
          <tbody id="localRatesBody"></tbody>
        </table>
      </div>
    </div>

    <!-- تبويب الأخبار -->
    <div class="tab-content" id="news-tab">
      <div class="news-card">
        <div class="news-header">
          <h3><i class="fas fa-newspaper news-icon"></i> آخر أخبار العملات</h3>
          <button class="theme-btn" id="refreshNews">
            <i class="fas fa-sync-alt"></i>
          </button>
        </div>
        <div class="news-list" id="newsList"></div>
      </div>
    </div>

    <!-- تبويب الذكاء الاصطناعي -->
    <div class="tab-content" id="ai-tab">
      <div class="ai-insights-card">
        <div class="ai-insights-header">
          <h3><i class="fas fa-robot ai-insights-icon"></i> رؤى الذكاء الاصطناعي</h3>
          <span class="result-badge ai-badge">محدث</span>
        </div>
        <div class="ai-insights-content" id="aiInsightsContent">
          <!-- سيتم ملؤها ديناميكياً -->
        </div>
      </div>

      <div class="crypto-rates-card">
        <div class="crypto-rates-header">
          <h3><i class="fas fa-chart-line crypto-rates-icon"></i> تنبؤات العملات الرقمية</h3>
          <button class="theme-btn" id="refreshAiPredictions">
            <i class="fas fa-sync-alt"></i>
          </button>
        </div>
        <div class="crypto-rates-grid" id="aiCryptoPredictions"></div>
      </div>
    </div>

    <footer>
      © 2025 | المحول الشامل - جميع الحقوق محفوظة
      <div style="margin-top: 8px; font-size: 0.8rem; opacity: 0.6;">
        مدعوم بالذكاء الاصطناعي - تم التطوير بأحدث تقنيات الويب
      </div>
    </footer>
  </div>

  <!-- ===== JAVASCRIPT SECTION - ENHANCED WITH AI ===== -->
  <script src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>
  <script>
    // API Key للذكاء الاصطناعي
    const AI_API_KEY = "AIzaSyAveQgII51g-BYRx7zwPDQI-h8gPmj1obQ";
    
    // تهيئة نظام الجسيمات المتحركة المحسن
    document.addEventListener('DOMContentLoaded', function() {
      if (typeof particlesJS !== 'undefined') {
        particlesJS('particles-js', {
          particles: {
            number: { 
              value: 80, 
              density: { 
                enable: true, 
                value_area: 1000 
              } 
            },
            color: { 
              value: ["#3b82f6", "#06b6d4", "#f59e0b", "#8b5cf6"] 
            },
            shape: { 
              type: "circle",
              stroke: {
                width: 0,
                color: "#000000"
              }
            },
            opacity: { 
              value: 0.3, 
              random: true,
              anim: {
                enable: true,
                speed: 1,
                opacity_min: 0.1,
                sync: false
              }
            },
            size: { 
              value: 2.5, 
              random: true,
              anim: {
                enable: true,
                speed: 2,
                size_min: 0.1,
                sync: false
              }
            },
            line_linked: {
              enable: true,
              distance: 120,
              color: "#ffffff",
              opacity: 0.1,
              width: 1
            },
            move: {
              enable: true,
              speed: 1.2,
              direction: "none",
              random: true,
              straight: false,
              out_mode: "out",
              bounce: false,
              attract: {
                enable: false,
                rotateX: 600,
                rotateY: 1200
              }
            }
          },
          interactivity: {
            detect_on: "canvas",
            events: {
              onhover: { 
                enable: true, 
                mode: "grab" 
              },
              onclick: { 
                enable: true, 
                mode: "push" 
              },
              resize: true
            },
            modes: {
              grab: {
                distance: 140,
                line_linked: {
                  opacity: 0.3
                }
              },
              push: {
                particles_nb: 4
              }
            }
          },
          retina_detect: true
        });
      }
    });

    // العناصر DOM المحسنة مع الذكاء الاصطناعي
    const elements = {
      // العناصر الأساسية
      fromCurrencySelect: document.getElementById("fromCurrencySelect"),
      toCurrencySelect: document.getElementById("toCurrencySelect"),
      amountInput: document.getElementById("amount"),
      convertBtn: document.getElementById("convertBtn"),
      resultCard: document.getElementById("resultCard"),
      convertedAmount: document.getElementById("convertedAmount"),
      convertedCurrency: document.getElementById("convertedCurrency"),
      conversionRate: document.getElementById("conversionRate"),
      resultBadge: document.getElementById("resultBadge"),
      progressFill: document.getElementById("progressFill"),
      marketRate: document.getElementById("marketRate"),
      notification: document.getElementById("notification"),
      lastUpdate: document.getElementById("lastUpdate"),
      
      // الذكاء الاصطناعي
      aiPredictionBtn: document.getElementById("aiPredictionBtn"),
      aiPredictionCard: document.getElementById("aiPredictionCard"),
      predictedAmount: document.getElementById("predictedAmount"),
      predictedCurrency: document.getElementById("predictedCurrency"),
      predictionDetails: document.getElementById("predictionDetails"),
      confidenceFill: document.getElementById("confidenceFill"),
      confidenceValue: document.getElementById("confidenceValue"),
      aiInsightsContent: document.getElementById("aiInsightsContent"),
      aiCryptoPredictions: document.getElementById("aiCryptoPredictions"),
      refreshAiPredictions: document.getElementById("refreshAiPredictions"),
      aiInsightAction: document.getElementById("aiInsightAction"),
      aiToggle: document.getElementById("aiToggle"),
      
      // البحث والعملات
      fromSearch: document.getElementById("fromSearch"),
      toSearch: document.getElementById("toSearch"),
      fromOptions: document.getElementById("fromOptions"),
      toOptions: document.getElementById("toOptions"),
      
      // التبويبات والمحتوى
      tabs: document.querySelectorAll('.tab'),
      tabContents: document.querySelectorAll('.tab-content'),
      settingsBtn: document.getElementById("settingsBtn"),
      settingsPage: document.getElementById("settingsPage"),
      closeSettings: document.getElementById("closeSettings"),
      themeToggle: document.getElementById("themeToggle"),
      
      // الأخبار
      newsList: document.getElementById("newsList"),
      refreshNews: document.getElementById("refreshNews"),
      
      // الإجراءات
      reverseAction: document.getElementById("reverseAction"),
      favoriteAction: document.getElementById("favoriteAction"),
      clearAction: document.getElementById("clearAction"),
      
      // العملات الرقمية
      cryptoRatesGrid: document.getElementById("cryptoRatesGrid"),
      
      // المصادر والإعدادات
      sourcesList: document.getElementById("sourcesList"),
      successRate: document.getElementById("successRate"),
      successfulRequests: document.getElementById("successfulRequests"),
      failedRequests: document.getElementById("failedRequests"),
      statsLastUpdate: document.getElementById("statsLastUpdate"),
      autoUpdateToggle: document.getElementById("autoUpdateToggle"),
      dataSavingToggle: document.getElementById("dataSavingToggle"),
      saveHistoryToggle: document.getElementById("saveHistoryToggle"),
      
      // المفضلة والتاريخ
      favoritesSection: document.getElementById("favoritesSection"),
      favoritesList: document.getElementById("favoritesList"),
      historySection: document.getElementById("historySection"),
      historyList: document.getElementById("historyList"),
      
      // الأسعار المحلية
      localRatesBody: document.getElementById("localRatesBody"),
      countrySelect: document.getElementById("countrySelect"),
      localRatesUpdate: document.getElementById("localRatesUpdate"),
      
      // مؤشر الاتصال
      offlineIndicator: document.getElementById("offlineIndicator"),
      
      // أزرار الوقت للتنبؤات
      timeframeButtons: document.querySelectorAll('.timeframe-btn')
    };

    // المتغيرات العامة المحسنة مع الذكاء الاصطناعي
    let currentFromCurrency = "USD";
    let currentToCurrency = "IQD";
    let favorites = JSON.parse(localStorage.getItem('currencyFavorites')) || [];
    let conversionHistory = JSON.parse(localStorage.getItem('conversionHistory')) || [];
    let currentTab = "converter";
    let isOnline = navigator.onLine;
    let currentTimeframe = "1d";
    let aiInsights = [];
    let currentCountry = "iraq";
    let isDarkMode = true;

    // نظام إدارة الذكاء الاصطناعي المحسن
    const AIManager = {
      isEnabled: true,
      
      async getAIPrediction(fromCurrency, toCurrency, amount, timeframe = "1d") {
        if (!this.isEnabled) {
          throw new Error("الذكاء الاصطناعي غير مفعل");
        }
        
        try {
          // محاكاة اتصال بالذكاء الاصطناعي (في الواقع سيكون اتصالاً حقيقياً)
          const prediction = await this.simulateAIPrediction(fromCurrency, toCurrency, amount, timeframe);
          return prediction;
        } catch (error) {
          console.error('❌ خطأ في الذكاء الاصطناعي:', error);
          throw new Error("تعذر الحصول على تنبؤات الذكاء الاصطناعي");
        }
      },
      
      async simulateAIPrediction(fromCurrency, toCurrency, amount, timeframe) {
        // محاكاة تأخير الشبكة
        await new Promise(resolve => setTimeout(resolve, 1500 + Math.random() * 1000));
        
        const baseRate = await ExchangeRateManager.getExchangeRate(fromCurrency, toCurrency);
        let predictedRate = baseRate.rate;
        let confidence = 0;
        let trend = "مستقر";
        
        // محاكاة تحليل الذكاء الاصطناعي بناءً على العملة والفترة
        if (timeframe === "1d") {
          // تغيير طفيف لليوم الواحد
          const change = (Math.random() * 0.04) - 0.02; // ±2%
          predictedRate = baseRate.rate * (1 + change);
          confidence = 75 + Math.random() * 20; // 75-95%
          trend = change > 0.01 ? "صاعد" : change < -0.01 ? "هابط" : "مستقر";
        } else if (timeframe === "1w") {
          // تغيير أكبر لأسبوع
          const change = (Math.random() * 0.08) - 0.04; // ±4%
          predictedRate = baseRate.rate * (1 + change);
          confidence = 65 + Math.random() * 25; // 65-90%
          trend = change > 0.02 ? "صاعد" : change < -0.02 ? "هابط" : "مستقر";
        } else if (timeframe === "1m") {
          // تغيير أكبر لشهر
          const change = (Math.random() * 0.15) - 0.075; // ±7.5%
          predictedRate = baseRate.rate * (1 + change);
          confidence = 55 + Math.random() * 30; // 55-85%
          trend = change > 0.04 ? "صاعد" : change < -0.04 ? "هابط" : "مستقر";
        } else if (timeframe === "3m") {
          // تغيير أكبر لـ 3 أشهر
          const change = (Math.random() * 0.25) - 0.125; // ±12.5%
          predictedRate = baseRate.rate * (1 + change);
          confidence = 45 + Math.random() * 35; // 45-80%
          trend = change > 0.06 ? "صاعد" : change < -0.06 ? "هابط" : "مستقر";
        }
        
        const predictedValue = amount * predictedRate;
        const changePercent = ((predictedRate - baseRate.rate) / baseRate.rate) * 100;
        
        return {
          success: true,
          fromCurrency,
          toCurrency,
          amount,
          predictedValue: ExchangeRateManager.isCrypto(toCurrency) ? 
            predictedValue.toFixed(8) : predictedValue.toFixed(2),
          currentRate: baseRate.rate,
          predictedRate,
          changePercent,
          confidence: Math.round(confidence),
          trend,
          timeframe,
          timestamp: new Date().toISOString()
        };
      },
      
      async generateAIInsights() {
        if (!this.isEnabled) return [];
        
        const insights = [
          {
            title: "توقعات البيتكوين",
            content: "يتوقع الذكاء الاصطناعي استقراراً في سعر البيتكوين حول 40,000 دولار مع احتمالية صعود إلى 42,000 دولار في الأسبوع القادم بناءً على تحليل أنماط التداول وحجم التداول.",
            confidence: 78,
            category: "عملات رقمية",
            impact: "مرتفع",
            timestamp: new Date().toISOString()
          },
          {
            title: "الدينار العراقي",
            content: "من المتوقع استقرار سعر الدينار العراقي مقابل الدولار حول 1320 دينار مع تحسن في السيولة النقدية واستقرار السوق المحلي.",
            confidence: 85,
            category: "عملات تقليدية",
            impact: "متوسط",
            timestamp: new Date().toISOString()
          },
          {
            title: "الإيثيريوم وتطبيقات DeFi",
            content: "يشير التحليل إلى نمو في استخدام الإيثيريوم في تطبيقات التمويل اللامركزي (DeFi) مما قد يدعم سعره على المدى المتوسط.",
            confidence: 72,
            category: "عملات رقمية",
            impact: "متوسط",
            timestamp: new Date().toISOString()
          }
        ];
        
        // محاكاة تأخير الشبكة
        await new Promise(resolve => setTimeout(resolve, 1000));
        
        return insights;
      },
      
      async getCryptoPredictions() {
        if (!this.isEnabled) return [];
        
        const predictions = [
          {
            symbol: "BTC",
            name: "البيتكوين",
            currentPrice: "40,125",
            predictedPrice: "41,200",
            change: "+2.7%",
            confidence: 78,
            trend: "صاعد"
          },
          {
            symbol: "ETH",
            name: "الإيثيريوم",
            currentPrice: "2,240",
            predictedPrice: "2,350",
            change: "+4.9%",
            confidence: 72,
            trend: "صاعد"
          },
          {
            symbol: "BNB",
            name: "البينانس",
            currentPrice: "315",
            predictedPrice: "330",
            change: "+4.8%",
            confidence: 68,
            trend: "صاعد"
          },
          {
            symbol: "SOL",
            name: "سولانا",
            currentPrice: "98.50",
            predictedPrice: "105",
            change: "+6.6%",
            confidence: 65,
            trend: "صاعد"
          }
        ];
        
        // محاكاة تأخير الشبكة
        await new Promise(resolve => setTimeout(resolve, 800));
        
        return predictions;
      },
      
      async generateAINews() {
        if (!this.isEnabled) return [];
        
        const news = [
          {
            title: "البيتكوين يتجاوز حاجز 40,000 دولار مع تدفق استثمارات مؤسسية جديدة",
            content: "ارتفع سعر البيتكوين اليوم متجاوزاً حاجز 40,000 دولار للمرة الأولى منذ أشهر، مدعوماً بتدفق استثمارات مؤسسية جديدة وتحسن معنويات السوق.",
            category: "عملات رقمية",
            date: "منذ 15 دقيقة",
            trending: true,
            impact: "كبير"
          },
          {
            title: "البنك المركزي الأوروبي يعلن عن سياسات نقدية جديدة تؤثر على اليورو",
            content: "أعلن البنك المركزي الأوروبي عن حزمة سياسات نقدية جديدة تهدف إلى مكافحة التضخم، مما أثر على سعر اليورو مقابل العملات الرئيسية.",
            category: "عملات تقليدية",
            date: "منذ ساعة",
            trending: true,
            impact: "متوسط"
          },
          {
            title: "نمو سوق العملات الرقمية في الشرق الأوسط بنسبة 35% خلال الربع الأخير",
            content: "شهد سوق العملات الرقمية في منطقة الشرق الأوسط نمواً ملحوظاً بنسبة 35% خلال الربع الأخير، مدعوماً بتبني متزايد من قبل المؤسسات المالية.",
            category: "تحليلات",
            date: "منذ 3 ساعات",
            trending: false,
            impact: "متوسط"
          },
          {
            title: "توقعات بتحسن سعر الدينار العراقي مع تحسن الوضع الاقتصادي",
            content: "تشير التوقعات إلى تحسن محتمل في سعر الدينار العراقي مقابل الدولار خلال الأسابيع القادمة مع تحسن الوضع الاقتصادي وزيادة الاحتياطي النقدي.",
            category: "عملات محلية",
            date: "منذ 5 ساعات",
            trending: true,
            impact: "كبير"
          }
        ];
        
        // محاكاة تأخير الشبكة
        await new Promise(resolve => setTimeout(resolve, 1200));
        
        return news;
      },
      
      toggleEnabled(state) {
        this.isEnabled = state;
        if (!state) {
          showEnhancedNotification("❌ تم إيقاف الذكاء الاصطناعي", 'warning');
        } else {
          showEnhancedNotification("✅ تم تفعيل الذكاء الاصطناعي", 'success');
        }
      }
    };

    // نظام إدارة مصادر أسعار الصرف المحسن
    const ExchangeRateManager = {
      apis: [
        {
          name: "Exchangerate-host",
          url: "https://api.exchangerate.host/latest",
          priority: 1,
          active: true,
          format: "standard",
          description: "مصدر مجاني للعملات التقليدية - يدعم CORS",
          reliability: 95
        },
        {
          name: "المصادر المحلية الذكية",
          url: "local",
          priority: 2,
          active: true,
          format: "local",
          description: "قاعدة بيانات محلية مع أسعار واقعية ومحدثة",
          reliability: 100
        }
      ],

      stats: {
        totalRequests: 0,
        successfulRequests: 0,
        failedRequests: 0,
        lastSuccessfulSource: null,
        averageResponseTime: 0,
        lastUpdate: null
      },

      init() {
        this.loadStats();
        this.cleanOldCache();
        this.updateStatsDisplay();
        this.setupOnlineStatusListener();
        this.setupAutoUpdate();
        console.log("✅ نظام أسعار الصرف المحسن جاهز للعمل");
      },

      setupOnlineStatusListener() {
        window.addEventListener('online', () => {
          isOnline = true;
          elements.offlineIndicator.style.display = 'none';
          this.showEnhancedNotification("✅ تم استعادة الاتصال بالإنترنت", 'success');
          this.updateAllRates();
        });

        window.addEventListener('offline', () => {
          isOnline = false;
          elements.offlineIndicator.style.display = 'block';
          this.showEnhancedNotification("⚠️ فقدان الاتصال بالإنترنت - استخدام البيانات المخزنة", 'warning');
        });

        // فحص الاتصال بشكل دوري
        setInterval(() => {
          const previousStatus = isOnline;
          isOnline = navigator.onLine;
          
          if (previousStatus !== isOnline) {
            if (isOnline) {
              elements.offlineIndicator.style.display = 'none';
              this.showEnhancedNotification("✅ اتصال الإنترنت نشط", 'success');
            } else {
              elements.offlineIndicator.style.display = 'block';
              this.showEnhancedNotification("⚠️ فقدان الاتصال بالإنترنت", 'warning');
            }
          }
        }, 5000);
      },

      setupAutoUpdate() {
        setInterval(() => {
          if (elements.autoUpdateToggle.checked && isOnline) {
            this.updateAllRates();
          }
        }, 120000); // تحديث كل دقيقتين
      },

      updateAllRates() {
        if (currentFromCurrency && currentToCurrency) {
          const startTime = performance.now();
          
          this.getExchangeRate(currentFromCurrency, currentToCurrency)
            .then(rateData => {
              const endTime = performance.now();
              this.stats.averageResponseTime = (this.stats.averageResponseTime + (endTime - startTime)) / 2;
              
              elements.marketRate.textContent = this.isCrypto(currentToCurrency) ? 
                rateData.rate.toFixed(8) : rateData.rate.toFixed(4);
              elements.lastUpdate.textContent = new Date().toLocaleTimeString('ar-EG');
              
              this.stats.lastUpdate = new Date().toISOString();
              this.updateStatsDisplay();
            })
            .catch(error => {
              console.warn('❌ فشل التحديث التلقائي:', error);
            });
        }
      },

      async getExchangeRate(fromCurrency, toCurrency) {
        this.stats.totalRequests++;
        this.updateStatsDisplay();

        // التحقق من التخزين المؤقت أولاً
        const cachedRate = this.getCachedRate(fromCurrency, toCurrency);
        if (cachedRate && this.isCacheValid(cachedRate)) {
          return {
            rate: cachedRate.rate,
            source: `CACHE (${cachedRate.source})`,
            timestamp: cachedRate.timestamp,
            cached: true
          };
        }

        // إذا لم يكن هناك اتصال، استخدم الأسعار الافتراضية
        if (!isOnline) {
          const defaultRate = this.getDefaultRate(fromCurrency, toCurrency);
          if (defaultRate) {
            return {
              rate: defaultRate,
              source: "أسعار افتراضية (غير متصل)",
              timestamp: new Date().toISOString(),
              cached: false
            };
          }
          throw new Error("لا يوجد اتصال بالإنترنت ولا توجد أسعار افتراضية متاحة");
        }

        // ترتيب المصادر حسب الأولوية والموثوقية
        const sortedApis = [...this.apis]
          .filter(api => api.active)
          .sort((a, b) => {
            const priorityDiff = a.priority - b.priority;
            if (priorityDiff !== 0) return priorityDiff;
            return b.reliability - a.reliability;
          });
        
        // محاولة المصادر بالتتابع
        for (const api of sortedApis) {
          try {
            const startTime = performance.now();
            const rate = await this.fetchFromAPI(api, fromCurrency, toCurrency);
            const endTime = performance.now();
            
            if (rate && rate > 0) {
              // تحديث موثوقية المصدر
              api.reliability = Math.min(100, api.reliability + 1);
              
              // تخزين النتيجة
              this.cacheRate(fromCurrency, toCurrency, rate, api.name);
              this.stats.successfulRequests++;
              this.stats.lastSuccessfulSource = api.name;
              this.stats.averageResponseTime = (this.stats.averageResponseTime + (endTime - startTime)) / 2;
              this.updateStatsDisplay();
              
              return {
                rate: rate,
                source: api.name,
                timestamp: new Date().toISOString(),
                cached: false,
                responseTime: endTime - startTime
              };
            }
          } catch (error) {
            console.warn(`❌ فشل المصدر ${api.name}:`, error.message);
            // تقليل موثوقية المصدر
            api.reliability = Math.max(50, api.reliability - 2);
            
            this.stats.failedRequests++;
            this.updateStatsDisplay();
            continue;
          }
        }

        // إذا فشلت جميع المصادر، استخدم الأسعار الافتراضية
        const defaultRate = this.getDefaultRate(fromCurrency, toCurrency);
        if (defaultRate) {
          return {
            rate: defaultRate,
            source: "أسعار افتراضية (الطوارئ)",
            timestamp: new Date().toISOString(),
            cached: false
          };
        }

        throw new Error("تعذر الاتصال بجميع مصادر أسعار الصرف");
      },

      async fetchFromAPI(api, from, to) {
        if (api.name === "المصادر المحلية الذكية") {
          return this.getSmartLocalRate(from, to);
        }

        const controller = new AbortController();
        const timeoutId = setTimeout(() => controller.abort(), 8000);

        try {
          let url = `${api.url}?base=${from}&symbols=${to}`;

          const response = await fetch(url, { 
            signal: controller.signal,
            mode: 'cors',
            headers: {
              'Accept': 'application/json',
            }
          });

          clearTimeout(timeoutId);

          if (!response.ok) {
            throw new Error(`خطأ HTTP: ${response.status}`);
          }

          const data = await response.json();
          return this.extractRateFromResponse(data, api.format, from, to);
          
        } catch (error) {
          clearTimeout(timeoutId);
          throw error;
        }
      },

      extractRateFromResponse(data, format, from, to) {
        try {
          let rate;
          
          if (data.rates && data.rates[to]) {
            rate = data.rates[to];
          } else if (data.result && data.result[to]) {
            rate = data.result[to];
          }

          if (!rate || typeof rate !== 'number' || rate <= 0 || !isFinite(rate)) {
            throw new Error('سعر صرف غير صالح');
          }

          return rate;
        } catch (error) {
          throw new Error(`فشل في معالجة البيانات: ${error.message}`);
        }
      },

      getSmartLocalRate(from, to) {
        // أسعار واقعية بناءً على بيانات السوق الحالية (محدثة)
        const baseRates = {
          "USD": 1,
          "EUR": 0.92,
          "GBP": 0.79,
          "IQD": 1320,
          "SAR": 3.75,
          "AED": 3.67,
          "KWD": 0.31,
          "QAR": 3.64,
          "TRY": 32.15,
          "JPY": 147.50,
          "CNY": 7.18,
          "BTC": 0.000025,
          "ETH": 0.00058,
          "BNB": 0.0038,
          "ADA": 2.85,
          "DOGE": 15.2,
          "XRP": 2.1,
          "SOL": 0.042,
          "DOT": 0.15
        };

        if (baseRates[from] && baseRates[to]) {
          const rate = baseRates[to] / baseRates[from];
          // إضافة تباين طفيف لمحاكاة تقلبات السوق الحقيقية
          const variation = 1 + (Math.random() * 0.02 - 0.01); // ±1%
          return rate * variation;
        }
        
        return null;
      },

      getDefaultRate(from, to) {
        const defaultRates = {
          "USD_BTC": 0.000025,
          "USD_ETH": 0.00058,
          "USD_BNB": 0.0038,
          "USD_ADA": 2.85,
          "USD_DOGE": 15.2,
          "USD_XRP": 2.1,
          "USD_SOL": 0.042,
          "USD_DOT": 0.15,
          "EUR_BTC": 0.000027,
          "GBP_BTC": 0.000032,
          "IQD_BTC": 0.000000019,
          "BTC_USD": 40000,
          "ETH_USD": 1724,
          "BNB_USD": 263,
          "ADA_USD": 0.35,
          "DOGE_USD": 0.066,
          "XRP_USD": 0.48,
          "SOL_USD": 102,
          "DOT_USD": 6.67,
          "USD_IQD": 1320,
          "IQD_USD": 0.000758,
          "USD_SAR": 3.75,
          "SAR_USD": 0.267,
          "USD_AED": 3.67,
          "AED_USD": 0.272,
          "USD_EGP": 30.9,
          "EGP_USD": 0.032,
          "USD_JPY": 147.5,
          "JPY_USD": 0.00678
        };
        
        const key = `${from}_${to}`;
        return defaultRates[key] || null;
      },

      isCrypto(currency) {
        const cryptoCurrencies = ["BTC", "ETH", "BNB", "ADA", "DOGE", "XRP", "SOL", "DOT"];
        return cryptoCurrencies.includes(currency);
      },

      cacheRate(from, to, rate, source) {
        const key = `exc_${from}_${to}`;
        const cacheData = {
          rate: rate,
          source: source,
          timestamp: new Date().getTime(),
          expiresAt: new Date().getTime() + (2 * 60 * 60 * 1000), // ساعتين
          version: "2.0"
        };
        
        try {
          localStorage.setItem(key, JSON.stringify(cacheData));
        } catch (error) {
          console.warn('❌ فشل في تخزين البيانات مؤقتاً:', error);
          this.cleanOldCache(); // تنظيف الذاكرة إذا كانت ممتلئة
        }
      },

      getCachedRate(from, to) {
        const key = `exc_${from}_${to}`;
        try {
          const cached = localStorage.getItem(key);
          if (!cached) return null;
          
          const data = JSON.parse(cached);
          // التحقق من توافق الإصدار
          if (data.version !== "2.0") return null;
          
          return data;
        } catch (error) {
          return null;
        }
      },

      isCacheValid(cachedData) {
        if (!cachedData || !cachedData.timestamp) return false;
        
        const now = new Date().getTime();
        const cacheAge = now - cachedData.timestamp;
        const maxAge = 4 * 60 * 60 * 1000; // 4 ساعات
        
        return cacheAge < maxAge && (!cachedData.expiresAt || now < cachedData.expiresAt);
      },

      cleanOldCache() {
        const now = new Date().getTime();
        const maxAge = 24 * 60 * 60 * 1000; // 24 ساعة
        
        try {
          for (let i = 0; i < localStorage.length; i++) {
            const key = localStorage.key(i);
            if (key && key.startsWith('exc_')) {
              try {
                const item = localStorage.getItem(key);
                const data = JSON.parse(item);
                
                if (data && data.timestamp && (now - data.timestamp) > maxAge) {
                  localStorage.removeItem(key);
                }
              } catch (e) {
                localStorage.removeItem(key);
              }
            }
          }
        } catch (error) {
          console.warn('❌ فشل في تنظيف التخزين المؤقت:', error);
        }
      },

      updateStatsDisplay() {
        const successRateValue = this.stats.totalRequests > 0 
          ? ((this.stats.successfulRequests / this.stats.totalRequests) * 100).toFixed(1)
          : 0;
        
        elements.successRate.textContent = `${successRateValue}%`;
        elements.successfulRequests.textContent = this.stats.successfulRequests;
        elements.failedRequests.textContent = this.stats.failedRequests;
        elements.statsLastUpdate.textContent = this.stats.lastUpdate ? 
          new Date(this.stats.lastUpdate).toLocaleTimeString('ar-EG') : '--:--';
        
        this.saveStats();
      },

      saveStats() {
        try {
          localStorage.setItem('exchange_rate_stats_v2', JSON.stringify(this.stats));
        } catch (error) {
          console.warn('❌ فشل في حفظ الإحصائيات:', error);
        }
      },

      loadStats() {
        try {
          const saved = localStorage.getItem('exchange_rate_stats_v2');
          if (saved) {
            this.stats = { ...this.stats, ...JSON.parse(saved) };
          }
        } catch (error) {
          console.warn('❌ فشل في تحميل الإحصائيات:', error);
        }
      },

      showEnhancedNotification(message, type = 'success') {
        showNotification(message, type);
      }
    };

    // البيانات المحسنة مع رموز أفضل للعملات الرقمية
    const fiatCurrencies = {
      "USD": "الدولار الأمريكي",
      "EUR": "اليورو الأوروبي", 
      "GBP": "الجنيه الإسترليني",
      "IQD": "الدينار العراقي",
      "SAR": "الريال السعودي",
      "AED": "الدرهم الإماراتي",
      "KWD": "الدينار الكويتي",
      "QAR": "الريال القطري",
      "OMR": "الريال العماني",
      "BHD": "الدينار البحريني",
      "TRY": "الليرة التركية",
      "JPY": "الين الياباني",
      "CNY": "اليوان الصيني",
      "RUB": "الروبل الروسي",
      "AUD": "الدولار الأسترالي",
      "CAD": "الدولار الكندي",
      "CHF": "الفرنك السويسري",
      "EGP": "الجنيه المصري",
      "INR": "الروبية الهندية",
      "PKR": "الروبية الباكستانية"
    };

    const cryptoCurrencies = {
      "BTC": { name: "البيتكوين", category: "رائدة", icon: "🪙", volatility: "عالي" },
      "ETH": { name: "الإيثيريوم", category: "رائدة", icon: "🧿", volatility: "عالي" },
      "BNB": { name: "البينانس كوين", category: "منصات", icon: "🪅", volatility: "متوسط" },
      "ADA": { name: "كاردانو", category: "عقود ذكية", icon: "🃏", volatility: "عالي" },
      "DOGE": { name: "دوج كوين", category: "ميم", icon: "🐶", volatility: "عالي جداً" },
      "XRP": { name: "ريبل", category: "دفع", icon: "ⓧ", volatility: "متوسط" },
      "SOL": { name: "سولانا", category: "عقود ذكية", icon: "☀️", volatility: "عالي" },
      "DOT": { name: "بولكادوت", category: "شبكات", icon: "⏺️", volatility: "متوسط" }
    };

    // بيانات الأسعار المحلية المحدثة
    const localRatesData = {
      iraq: {
        name: "العراق - الدينار العراقي",
        rates: [
          { city: "بغداد", rate100: "132,000", rate1: "1,320" },
          { city: "البصرة", rate100: "132,000", rate1: "1,320" },
          { city: "أربيل", rate100: "131,800", rate1: "1,318" },
          { city: "كركوك", rate100: "132,000", rate1: "1,320" },
          { city: "السليمانية", rate100: "131,800", rate1: "1,318" },
          { city: "دهوك", rate100: "131,800", rate1: "1,318" },
          { city: "النجف", rate100: "132,000", rate1: "1,320" },
          { city: "كربلاء", rate100: "132,000", rate1: "1,320" }
        ]
      },
      saudi: {
        name: "السعودية - الريال السعودي",
        rates: [
          { city: "الرياض", rate100: "375", rate1: "3.75" },
          { city: "جدة", rate100: "375", rate1: "3.75" },
          { city: "الدمام", rate100: "375", rate1: "3.75" },
          { city: "مكة", rate100: "375", rate1: "3.75" },
          { city: "المدينة", rate100: "375", rate1: "3.75" }
        ]
      },
      uae: {
        name: "الإمارات - الدرهم الإماراتي",
        rates: [
          { city: "دبي", rate100: "367", rate1: "3.67" },
          { city: "أبوظبي", rate100: "367", rate1: "3.67" },
          { city: "الشارقة", rate100: "367", rate1: "3.67" },
          { city: "عجمان", rate100: "367", rate1: "3.67" }
        ]
      },
      egypt: {
        name: "مصر - الجنيه المصري",
        rates: [
          { city: "القاهرة", rate100: "3,090", rate1: "30.9" },
          { city: "الإسكندرية", rate100: "3,090", rate1: "30.9" },
          { city: "الجيزة", rate100: "3,090", rate1: "30.9" },
          { city: "بورسعيد", rate100: "3,090", rate1: "30.9" }
        ]
      },
      jordan: {
        name: "الأردن - الدينار الأردني",
        rates: [
          { city: "عمان", rate100: "70.9", rate1: "0.709" },
          { city: "الزرقاء", rate100: "70.9", rate1: "0.709" },
          { city: "إربد", rate100: "70.9", rate1: "0.709" },
          { city: "العقبة", rate100: "70.9", rate1: "0.709" }
        ]
      }
    };

    // الدوال الأساسية المحسنة مع الذكاء الاصطناعي
    function loadCurrencies() {
      elements.fromOptions.innerHTML = '';
      elements.toOptions.innerHTML = '';
      
      // إضافة العملات التقليدية والرقمية للقائمة اليسرى (من)
      Object.entries(fiatCurrencies).forEach(([code, name]) => {
        addCurrencyOption(code, name, "fiat", elements.fromOptions, "from");
      });
      
      Object.entries(cryptoCurrencies).forEach(([code, data]) => {
        addCurrencyOption(code, data.name, "crypto", elements.fromOptions, "from");
      });
      
      // إضافة العملات التقليدية والرقمية للقائمة اليمنى (إلى)
      Object.entries(fiatCurrencies).forEach(([code, name]) => {
        addCurrencyOption(code, name, "fiat", elements.toOptions, "to");
      });
      
      Object.entries(cryptoCurrencies).forEach(([code, data]) => {
        addCurrencyOption(code, data.name, "crypto", elements.toOptions, "to");
      });
    }

    function addCurrencyOption(code, name, type, container, direction) {
      const option = document.createElement("div");
      option.className = "currency-option";
      
      const badgeClass = type === "fiat" ? "fiat-badge" : "crypto-badge";
      const badgeText = type === "fiat" ? "تقليدية" : "رقمية";
      
      option.innerHTML = `
        <div>
          <div style="font-weight: 700;">${name}</div>
          <div style="font-size: 0.8rem; opacity: 0.8;">${code}</div>
        </div>
        <span class="option-badge ${badgeClass}">${badgeText}</span>
      `;
      option.setAttribute("data-value", code);
      option.setAttribute("data-name", name);
      option.setAttribute("data-type", type);
      
      option.addEventListener("click", () => {
        if (direction === "from") {
          currentFromCurrency = code;
          updateCurrencyDisplay(elements.fromCurrencySelect, code, name, type);
          elements.fromSearch.classList.remove("active");
          elements.fromCurrencySelect.classList.remove("active");
        } else {
          currentToCurrency = code;
          updateCurrencyDisplay(elements.toCurrencySelect, code, name, type);
          elements.toSearch.classList.remove("active");
          elements.toCurrencySelect.classList.remove("active");
        }
        
        showEnhancedNotification(`✅ تم اختيار ${name} (${code})`, 'success');
        
        // تحديث سعر السوق تلقائياً
        updateMarketRate();
      });
      
      container.appendChild(option);
    }

    function updateCurrencyDisplay(element, code, name, type) {
      const badgeClass = type === "fiat" ? "fiat-badge" : "crypto-badge";
      const badgeText = type === "fiat" ? "تقليدية" : "رقمية";
      
      element.innerHTML = `
        <div>
          <div style="font-weight: 600;">${name}</div>
          <div style="font-size: 0.85rem; opacity: 0.8;">${code}</div>
        </div>
        <span class="currency-badge ${badgeClass}">${badgeText}</span>
      `;
    }

    function showEnhancedNotification(message, type = 'success') {
      showNotification(message, type);
    }

    function showNotification(message, type = 'success') {
      const icon = elements.notification.querySelector('.notification-icon');
      const messageEl = elements.notification.querySelector('.notification-message');
      
      elements.notification.className = `notification ${type}`;
      icon.className = `notification-icon ${type === 'success' ? 'fas fa-check-circle' : type === 'error' ? 'fas fa-exclamation-circle' : type === 'ai' ? 'fas fa-robot' : 'fas fa-exclamation-triangle'}`;
      messageEl.textContent = message;
      
      elements.notification.classList.add('show');
      
      setTimeout(() => {
        elements.notification.classList.remove('show');
      }, 4000);
    }

    // نظام التحويل المحسن مع الذكاء الاصطناعي
    async function convertCurrency() {
      const amount = parseFloat(elements.amountInput.value);
      const from = currentFromCurrency;
      const to = currentToCurrency;

      if (!validateInputs(amount, from, to)) {
        return;
      }

      prepareUIForConversion();

      try {
        const result = await performConversion(amount, from, to);
        displayConversionResult(result);
        showEnhancedNotification(`✅ تم التحويل بنجاح - ${amount} ${from} = ${result.convertedValue} ${to}`, 'success');
        
        if (elements.saveHistoryToggle.checked) {
          saveToHistory(result);
        }
        
      } catch (error) {
        handleConversionError(error, amount, from, to);
      }
    }

    // دالة تنبؤ الذكاء الاصطناعي
    async function getAIPrediction() {
      const amount = parseFloat(elements.amountInput.value);
      const from = currentFromCurrency;
      const to = currentToCurrency;

      if (!validateInputs(amount, from, to)) {
        return;
      }

      if (!elements.aiToggle.checked) {
        showEnhancedNotification("❌ الذكاء الاصطناعي غير مفعل. الرجاء تفعيله من الإعدادات", 'error');
        return;
      }

      prepareUIForAIPrediction();

      try {
        const prediction = await AIManager.getAIPrediction(from, to, amount, currentTimeframe);
        displayAIPrediction(prediction);
        showEnhancedNotification("🧠 تم الحصول على تنبؤات الذكاء الاصطناعي", 'ai');
      } catch (error) {
        handleAIPredictionError(error);
      }
    }

    function prepareUIForAIPrediction() {
      elements.aiPredictionBtn.disabled = true;
      elements.aiPredictionBtn.innerHTML = '<i class="fas fa-robot ai-thinking"></i> جاري التحليل...';
      elements.aiPredictionCard.style.display = "none";
    }

    function displayAIPrediction(prediction) {
      elements.predictedAmount.textContent = prediction.predictedValue;
      elements.predictedCurrency.textContent = prediction.toCurrency;
      
      const changeText = prediction.changePercent >= 0 ? 
        `+${prediction.changePercent.toFixed(2)}%` : 
        `${prediction.changePercent.toFixed(2)}%`;
      
      const trendIcon = prediction.trend === "صاعد" ? "📈" : 
                       prediction.trend === "هابط" ? "📉" : "➡️";
      
      elements.predictionDetails.innerHTML = `
        تنبؤ بسعر الصرف خلال ${getTimeframeText(prediction.timeframe)}<br>
        <small style="color: ${prediction.changePercent >= 0 ? 'var(--success)' : 'var(--warning)'};">
          ${trendIcon} ${changeText} | ${prediction.trend}
        </small>
      `;
      
      elements.confidenceValue.textContent = `${prediction.confidence}%`;
      elements.confidenceFill.style.width = `${prediction.confidence}%`;
      elements.confidenceFill.style.background = prediction.confidence >= 80 ? 'var(--success)' : 
                                                prediction.confidence >= 60 ? 'var(--crypto)' : 'var(--warning)';
      
      elements.aiPredictionCard.style.display = "block";
      elements.aiPredictionBtn.disabled = false;
      elements.aiPredictionBtn.innerHTML = '<i class="fas fa-robot"></i> تنبؤ الذكاء الاصطناعي';
    }

    function getTimeframeText(timeframe) {
      const timeframes = {
        "1d": "24 ساعة",
        "1w": "أسبوع",
        "1m": "شهر",
        "3m": "3 أشهر"
      };
      return timeframes[timeframe] || timeframe;
    }

    function handleAIPredictionError(error) {
      console.error('❌ خطأ في تنبؤ الذكاء الاصطناعي:', error);
      
      elements.aiPredictionBtn.disabled = false;
      elements.aiPredictionBtn.innerHTML = '<i class="fas fa-robot"></i> تنبؤ الذكاء الاصطناعي';
      
      showEnhancedNotification(`❌ ${error.message}`, 'error');
    }

    function validateInputs(amount, from, to) {
      if (!amount || amount <= 0 || isNaN(amount)) {
        elements.amountInput.classList.add("shake");
        showEnhancedNotification("❌ الرجاء إدخال مبلغ صالح أكبر من الصفر", 'error');
        setTimeout(() => elements.amountInput.classList.remove("shake"), 500);
        return false;
      }

      if (amount > 1000000000) {
        elements.amountInput.classList.add("shake");
        showEnhancedNotification("❌ المبلغ كبير جداً، الرجاء إدخال مبلغ أصغر", 'error');
        setTimeout(() => elements.amountInput.classList.remove("shake"), 500);
        return false;
      }

      if (from === to) {
        showEnhancedNotification("❌ العملتان متماثلتان، الرجاء اختيار عملتين مختلفتين", 'error');
        return false;
      }

      return true;
    }

    function prepareUIForConversion() {
      simulateProgress();
      elements.resultCard.style.display = "none";
      elements.convertBtn.disabled = true;
      elements.convertBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> جاري التحويل...';
    }

    async function performConversion(amount, from, to) {
      try {
        const startTime = performance.now();
        const exchangeData = await ExchangeRateManager.getExchangeRate(from, to);
        const endTime = performance.now();
        
        const responseTime = endTime - startTime;
        const convertedValue = ExchangeRateManager.isCrypto(to) ? 
          (amount * exchangeData.rate).toFixed(8) : 
          (amount * exchangeData.rate).toFixed(2);
        
        return {
          success: true,
          amount: amount,
          from: from,
          to: to,
          convertedValue: convertedValue,
          rate: exchangeData.rate,
          source: exchangeData.source,
          timestamp: exchangeData.timestamp,
          responseTime: responseTime,
          cached: exchangeData.cached
        };
        
      } catch (error) {
        throw error;
      }
    }

    function displayConversionResult(result) {
      elements.marketRate.textContent = ExchangeRateManager.isCrypto(result.to) ? 
        result.rate.toFixed(8) : result.rate.toFixed(4);
      elements.lastUpdate.textContent = new Date().toLocaleTimeString('ar-EG');
      
      elements.convertedAmount.textContent = result.convertedValue;
      elements.convertedCurrency.textContent = result.to;
      
      let rateText = `1 ${result.from} = ${ExchangeRateManager.isCrypto(result.to) ? 
        result.rate.toFixed(8) : result.rate.toFixed(4)} ${result.to}`;
      
      if (result.source) {
        rateText += `<br><small style="opacity: 0.8;">المصدر: ${result.source}</small>`;
      }
      
      if (result.cached) {
        rateText += `<br><small style="color: var(--crypto);">🔄 بيانات مخزنة</small>`;
      }
      
      if (result.responseTime) {
        rateText += `<br><small style="opacity: 0.7;">الوقت: ${result.responseTime.toFixed(0)}ms</small>`;
      }
      
      elements.conversionRate.innerHTML = rateText;
      elements.resultBadge.textContent = result.cached ? "مخزن" : "مباشر";
      elements.resultBadge.style.background = result.cached ? "var(--crypto)" : "var(--success)";
      
      elements.resultCard.style.display = "block";
      elements.convertBtn.disabled = false;
      elements.convertBtn.innerHTML = '<i class="fas fa-sync-alt"></i> تحويل العملة';
    }

    function handleConversionError(error, amount, from, to) {
      console.error('❌ خطأ في التحويل:', error);
      
      elements.convertBtn.disabled = false;
      elements.convertBtn.innerHTML = '<i class="fas fa-sync-alt"></i> تحويل العملة';
      
      elements.resultBadge.textContent = "فشل";
      elements.resultBadge.style.background = "var(--warning)";
      
      elements.convertedAmount.textContent = "0.00";
      elements.convertedCurrency.textContent = to;
      elements.conversionRate.textContent = "❌ " + getErrorMessage(error);
      
      elements.resultCard.style.display = "block";
      showEnhancedNotification(`❌ ${getErrorMessage(error)}`, 'error');
    }

    function getErrorMessage(error) {
      const message = error.message || error.toString();
      
      if (message.includes('الاتصال') || message.includes('انتهت مهلة') || message.includes('غير متصل')) {
        return "تعذر الاتصال بالإنترنت. الرجاء التحقق من الاتصال أو استخدام الأسعار المخزنة";
      } else if (message.includes('مصادر')) {
        return "جميع مصادر أسعار الصرف غير متاحة حالياً. جاري استخدام البيانات المخزنة";
      } else if (message.includes('غير صالح')) {
        return "سعر الصرف غير صالح. الرجاء المحاولة لاحقاً أو استخدام عملات أخرى";
      } else {
        return "حدث خطأ غير متوقع. الرجاء المحاولة مرة أخرى";
      }
    }

    function simulateProgress() {
      let width = 0;
      elements.progressFill.style.width = width + "%";
      elements.progressFill.style.transition = "width 0.8s cubic-bezier(0.4, 0, 0.2, 1)";
      
      const interval = setInterval(() => {
        if (width >= 85) {
          clearInterval(interval);
        } else {
          width += Math.random() * 8 + 4;
          if (width > 85) width = 85;
          elements.progressFill.style.width = width + "%";
        }
      }, 150);
      
      setTimeout(() => {
        elements.progressFill.style.width = "100%";
        setTimeout(() => {
          elements.progressFill.style.width = "0%";
        }, 600);
      }, 1200);
    }

    // الدوال المساعدة المحسنة مع الذكاء الاصطناعي
    function reverseCurrencies() {
      const temp = currentFromCurrency;
      currentFromCurrency = currentToCurrency;
      currentToCurrency = temp;
      
      updateCurrencyDisplayAfterReverse();
      showEnhancedNotification("✅ تم عكس العملات بنجاح", 'success');
      updateMarketRate();
    }

    function updateCurrencyDisplayAfterReverse() {
      const fromType = ExchangeRateManager.isCrypto(currentFromCurrency) ? "crypto" : "fiat";
      const toType = ExchangeRateManager.isCrypto(currentToCurrency) ? "crypto" : "fiat";
      
      const fromName = fromType === "fiat" ? fiatCurrencies[currentFromCurrency] : cryptoCurrencies[currentFromCurrency].name;
      const toName = toType === "fiat" ? fiatCurrencies[currentToCurrency] : cryptoCurrencies[currentToCurrency].name;
      
      updateCurrencyDisplay(elements.fromCurrencySelect, currentFromCurrency, fromName, fromType);
      updateCurrencyDisplay(elements.toCurrencySelect, currentToCurrency, toName, toType);
    }

    async function updateMarketRate() {
      try {
        const rateData = await ExchangeRateManager.getExchangeRate(currentFromCurrency, currentToCurrency);
        elements.marketRate.textContent = ExchangeRateManager.isCrypto(currentToCurrency) ? 
          rateData.rate.toFixed(8) : rateData.rate.toFixed(4);
        elements.lastUpdate.textContent = new Date().toLocaleTimeString('ar-EG');
      } catch (error) {
        console.warn('فشل تحديث سعر السوق:', error);
      }
    }

    // دوال الذكاء الاصطناعي الإضافية
    async function loadAIInsights() {
      try {
        elements.aiInsightsContent.innerHTML = '<div class="loading-spinner ai-loading-spinner"></div> جاري تحميل الرؤى...';
        
        const insights = await AIManager.generateAIInsights();
        aiInsights = insights;
        
        displayAIInsights(insights);
      } catch (error) {
        elements.aiInsightsContent.innerHTML = `
          <div style="text-align: center; padding: 20px; opacity: 0.7;">
            <i class="fas fa-exclamation-triangle" style="font-size: 2rem; margin-bottom: 10px; color: var(--warning);"></i>
            <div>تعذر تحميل رؤى الذكاء الاصطناعي</div>
          </div>
        `;
        console.error('❌ خطأ في تحميل رؤى الذكاء الاصطناعي:', error);
      }
    }

    function displayAIInsights(insights) {
      elements.aiInsightsContent.innerHTML = '';
      
      insights.forEach(insight => {
        const insightItem = document.createElement('div');
        insightItem.className = 'ai-insight-item';
        
        const confidenceColor = insight.confidence >= 80 ? 'var(--success)' : 
                              insight.confidence >= 60 ? 'var(--crypto)' : 'var(--warning)';
        
        insightItem.innerHTML = `
          <div class="ai-insight-header">
            <div class="ai-insight-title">${insight.title}</div>
            <div class="ai-insight-confidence" style="background: ${confidenceColor}">
              ${insight.confidence}%
            </div>
          </div>
          <div class="ai-insight-content">${insight.content}</div>
          <div class="ai-insight-meta">
            <span>${insight.category}</span>
            <span>تأثير: ${insight.impact}</span>
          </div>
        `;
        
        elements.aiInsightsContent.appendChild(insightItem);
      });
    }

    async function loadAICryptoPredictions() {
      try {
        elements.aiCryptoPredictions.innerHTML = '<div class="loading-spinner ai-loading-spinner"></div>';
        
        const predictions = await AIManager.getCryptoPredictions();
        displayAICryptoPredictions(predictions);
      } catch (error) {
        elements.aiCryptoPredictions.innerHTML = `
          <div style="text-align: center; padding: 20px; opacity: 0.7;">
            <i class="fas fa-exclamation-triangle" style="font-size: 1.5rem; margin-bottom: 10px; color: var(--warning);"></i>
            <div>تعذر تحميل التنبؤات</div>
          </div>
        `;
        console.error('❌ خطأ في تحميل تنبؤات العملات الرقمية:', error);
      }
    }

    function displayAICryptoPredictions(predictions) {
      elements.aiCryptoPredictions.innerHTML = '';
      
      predictions.forEach(prediction => {
        const predictionItem = document.createElement('div');
        predictionItem.className = 'crypto-rate-item';
        
        const trendIcon = prediction.trend === "صاعد" ? "📈" : "📉";
        const changeColor = prediction.change.includes('+') ? 'var(--success)' : 'var(--warning)';
        
        predictionItem.innerHTML = `
          <div class="crypto-rate-icon">${cryptoCurrencies[prediction.symbol]?.icon || '💰'}</div>
          <div class="crypto-rate-name">${prediction.name}</div>
          <div class="crypto-rate-symbol">${prediction.symbol}</div>
          <div class="crypto-rate-value">${prediction.predictedPrice} $</div>
          <div style="font-size: 0.7rem; margin-top: 4px;">
            <span style="color: ${changeColor}">${trendIcon} ${prediction.change}</span>
          </div>
          <div style="font-size: 0.65rem; opacity: 0.7; margin-top: 2px;">
            ثقة: ${prediction.confidence}%
          </div>
        `;
        
        elements.aiCryptoPredictions.appendChild(predictionItem);
      });
    }

    async function loadAINews() {
      try {
        elements.newsList.innerHTML = '<div class="loading-spinner"></div> جاري تحميل الأخبار...';
        
        const news = await AIManager.generateAINews();
        displayAINews(news);
      } catch (error) {
        elements.newsList.innerHTML = `
          <div style="text-align: center; padding: 20px; opacity: 0.7;">
            <i class="fas fa-exclamation-triangle" style="font-size: 1.5rem; margin-bottom: 10px; color: var(--warning);"></i>
            <div>تعذر تحميل الأخبار</div>
          </div>
        `;
        console.error('❌ خطأ في تحميل أخبار الذكاء الاصطناعي:', error);
      }
    }

    function displayAINews(news) {
      elements.newsList.innerHTML = '';
      
      news.forEach(item => {
        const newsItem = document.createElement('div');
        newsItem.className = 'news-item';
        
        newsItem.innerHTML = `
          <div class="news-title">
            ${item.trending ? '<span class="news-badge">شائع</span>' : ''}
            ${item.title}
          </div>
          <div class="news-content">${item.content}</div>
          <div class="news-meta">
            <span>${item.category} | تأثير: ${item.impact}</span>
            <span class="news-date"><i class="far fa-clock"></i> ${item.date}</span>
          </div>
        `;
        
        newsItem.addEventListener('click', () => {
          showEnhancedNotification(`📰 ${item.title}`, 'success');
        });
        
        elements.newsList.appendChild(newsItem);
      });
    }

    function showAIInsights() {
      // التبديل إلى تبويب الذكاء الاصطناعي
      elements.tabs.forEach(t => t.classList.remove('active'));
      elements.tabContents.forEach(tc => tc.classList.remove('active'));
      
      document.querySelector('.tab[data-tab="ai"]').classList.add('active');
      document.getElementById('ai-tab').classList.add('active');
      
      showEnhancedNotification("🧠 جاري تحميل رؤى الذكاء الاصطناعي...", 'ai');
      
      // تحميل الرؤى إذا لم تكن محملة
      if (aiInsights.length === 0) {
        loadAIInsights();
      }
    }

    // دوال الأسعار المحلية
    function loadLocalRates() {
      const countryData = localRatesData[currentCountry];
      if (!countryData) return;
      
      elements.localRatesBody.innerHTML = '';
      
      countryData.rates.forEach(rate => {
        const row = document.createElement('tr');
        row.innerHTML = `
          <td>${rate.city}</td>
          <td><span class="rate-value">${rate.rate100}</span></td>
          <td><span class="rate-value">${rate.rate1}</span></td>
        `;
        elements.localRatesBody.appendChild(row);
      });
      
      // تحديث تاريخ التحديث
      const now = new Date();
      elements.localRatesUpdate.textContent = `تحديث: ${now.toLocaleDateString('ar-EG')}`;
    }

    function addToFavorites() {
      const from = currentFromCurrency;
      const to = currentToCurrency;
      const pair = `${from}-${to}`;
      
      if (favorites.includes(pair)) {
        showEnhancedNotification("⚠️ هذا الزوج موجود بالفعل في المفضلة", 'warning');
        return;
      }
      
      if (favorites.length >= 10) {
        showEnhancedNotification("❌ وصلت للحد الأقصى للمفضلة (10 أزواج)", 'error');
        return;
      }
      
      favorites.push(pair);
      
      try {
        localStorage.setItem('currencyFavorites_v2', JSON.stringify(favorites));
        showEnhancedNotification("✅ تمت الإضافة إلى المفضلة", 'success');
        loadFavorites();
      } catch (error) {
        showEnhancedNotification("❌ فشل في حفظ المفضلة", 'error');
      }
    }

    function loadFavorites() {
      elements.favoritesList.innerHTML = '';
      
      if (favorites.length === 0) {
        elements.favoritesSection.style.display = 'none';
        return;
      }
      
      elements.favoritesSection.style.display = 'block';
      
      favorites.forEach(pair => {
        const [from, to] = pair.split('-');
        const fromType = ExchangeRateManager.isCrypto(from) ? "crypto" : "fiat";
        const toType = ExchangeRateManager.isCrypto(to) ? "crypto" : "fiat";
        
        const fromName = fromType === "fiat" ? fiatCurrencies[from] : cryptoCurrencies[from].name;
        const toName = toType === "fiat" ? fiatCurrencies[to] : cryptoCurrencies[to].name;
        
        const favoriteItem = document.createElement('div');
        favoriteItem.className = 'favorite-item';
        favoriteItem.innerHTML = `
          <span class="remove-favorite" data-pair="${pair}">
            <i class="fas fa-times"></i>
          </span>
          ${from} → ${to}
          <small style="opacity: 0.7; margin-right: auto;">${fromName} → ${toName}</small>
        `;
        
        favoriteItem.addEventListener('click', (e) => {
          if (!e.target.closest('.remove-favorite')) {
            currentFromCurrency = from;
            currentToCurrency = to;
            updateCurrencyDisplayAfterReverse();
            showEnhancedNotification(`✅ تم تحميل الزوج ${from}-${to} من المفضلة`, 'success');
            updateMarketRate();
          }
        });
        
        const removeBtn = favoriteItem.querySelector('.remove-favorite');
        removeBtn.addEventListener('click', (e) => {
          e.stopPropagation();
          removeFromFavorites(pair);
        });
        
        elements.favoritesList.appendChild(favoriteItem);
      });
    }

    function removeFromFavorites(pair) {
      favorites = favorites.filter(fav => fav !== pair);
      localStorage.setItem('currencyFavorites_v2', JSON.stringify(favorites));
      loadFavorites();
      showEnhancedNotification("🗑️ تمت الإزالة من المفضلة", 'success');
    }

    function clearAll() {
      elements.amountInput.value = '';
      elements.resultCard.style.display = 'none';
      elements.aiPredictionCard.style.display = 'none';
      showEnhancedNotification("🧹 تم مسح جميع الحقول", 'success');
    }

    function saveToHistory(result) {
      const historyItem = {
        from: result.from,
        to: result.to,
        amount: result.amount,
        converted: result.convertedValue,
        rate: result.rate,
        source: result.source,
        timestamp: new Date().toISOString(),
        cached: result.cached
      };
      
      conversionHistory.unshift(historyItem);
      
      if (conversionHistory.length > 15) {
        conversionHistory = conversionHistory.slice(0, 15);
      }
      
      localStorage.setItem('conversionHistory_v2', JSON.stringify(conversionHistory));
      loadHistory();
    }

    function loadHistory() {
      elements.historyList.innerHTML = '';
      
      if (conversionHistory.length === 0) {
        elements.historySection.style.display = 'none';
        return;
      }
      
      elements.historySection.style.display = 'block';
      
      conversionHistory.forEach((item, index) => {
        const historyItem = document.createElement('div');
        historyItem.className = 'history-item';
        
        const fromType = ExchangeRateManager.isCrypto(item.from) ? "crypto" : "fiat";
        const toType = ExchangeRateManager.isCrypto(item.to) ? "crypto" : "fiat";
        
        const fromName = fromType === "fiat" ? fiatCurrencies[item.from] : cryptoCurrencies[item.from].name;
        const toName = toType === "fiat" ? fiatCurrencies[item.to] : cryptoCurrencies[item.to].name;
        
        const time = new Date(item.timestamp).toLocaleTimeString('ar-EG', {
          hour: '2-digit',
          minute: '2-digit'
        });
        
        historyItem.innerHTML = `
          <div>
            <div style="font-weight: 700;">${item.from} → ${item.to}</div>
            <div style="font-size: 0.75rem; opacity: 0.7;">${time}</div>
          </div>
          <div style="text-align: left;">
            <div class="history-amount">${item.converted} ${item.to}</div>
            <div style="font-size: 0.75rem; opacity: 0.7;">${item.amount} ${item.from}</div>
          </div>
        `;
        
        historyItem.addEventListener('click', () => {
          currentFromCurrency = item.from;
          currentToCurrency = item.to;
          elements.amountInput.value = item.amount;
          updateCurrencyDisplayAfterReverse();
          showEnhancedNotification(`↩️ تم استعادة التحويل السابق`, 'success');
          updateMarketRate();
        });
        
        elements.historyList.appendChild(historyItem);
      });
    }

    function loadCryptoRates() {
      elements.cryptoRatesGrid.innerHTML = '';
      
      Object.entries(cryptoCurrencies).forEach(([code, data]) => {
        const rateItem = document.createElement('div');
        rateItem.className = 'crypto-rate-item';
        
        rateItem.innerHTML = `
          <div class="crypto-rate-icon">${data.icon}</div>
          <div class="crypto-rate-name">${data.name}</div>
          <div class="crypto-rate-symbol">${code}</div>
          <div class="crypto-rate-value">${getCryptoRate(code)} $</div>
          <div style="font-size: 0.7rem; opacity: 0.7; margin-top: 4px;">${data.volatility}</div>
        `;
        
        rateItem.addEventListener('click', () => {
          currentToCurrency = code;
          const toType = "crypto";
          const toName = cryptoCurrencies[code].name;
          updateCurrencyDisplay(elements.toCurrencySelect, code, toName, toType);
          showEnhancedNotification(`✅ تم تحميل سعر ${data.name}`, 'success');
          updateMarketRate();
        });
        
        elements.cryptoRatesGrid.appendChild(rateItem);
      });
    }

    function getCryptoRate(code) {
      const rates = {
        "BTC": "40,125",
        "ETH": "2,240",
        "BNB": "315",
        "ADA": "0.48",
        "DOGE": "0.12",
        "XRP": "0.62",
        "SOL": "98.50",
        "DOT": "7.85"
      };
      return rates[code] || "0.00";
    }

    function loadSourcesList() {
      elements.sourcesList.innerHTML = '';
      
      ExchangeRateManager.apis.forEach(api => {
        const sourceItem = document.createElement('div');
        sourceItem.className = `source-item ${api.active ? 'active' : 'inactive'}`;
        
        sourceItem.innerHTML = `
          <i class="fas fa-${api.active ? 'check-circle' : 'times-circle'}"></i>
          <div style="flex: 1;">
            <div style="font-weight: 700;">${api.name}</div>
            <div style="font-size: 0.75rem; opacity: 0.8; margin-top: 2px;">${api.description}</div>
            <div style="font-size: 0.7rem; opacity: 0.6; margin-top: 2px;">
              موثوقية: ${api.reliability}% | أولوية: ${api.priority}
            </div>
          </div>
          <small>${api.priority}★</small>
        `;
        
        elements.sourcesList.appendChild(sourceItem);
      });
    }

    function setupCurrencySearch() {
      const fromSearchInput = elements.fromSearch.querySelector('.search-input');
      const toSearchInput = elements.toSearch.querySelector('.search-input');
      
      elements.fromCurrencySelect.addEventListener('click', () => {
        elements.fromSearch.classList.add('active');
        fromSearchInput.focus();
        elements.fromCurrencySelect.classList.add('active');
      });
      
      elements.toCurrencySelect.addEventListener('click', () => {
        elements.toSearch.classList.add('active');
        toSearchInput.focus();
        elements.toCurrencySelect.classList.add('active');
      });
      
      document.addEventListener('click', (e) => {
        if (!elements.fromSearch.contains(e.target) && e.target !== elements.fromCurrencySelect) {
          elements.fromSearch.classList.remove('active');
          elements.fromCurrencySelect.classList.remove('active');
        }
        if (!elements.toSearch.contains(e.target) && e.target !== elements.toCurrencySelect) {
          elements.toSearch.classList.remove('active');
          elements.toCurrencySelect.classList.remove('active');
        }
      });
      
      function filterCurrencyOptions(input, optionsContainer) {
        const filter = input.value.toUpperCase();
        const options = optionsContainer.querySelectorAll('.currency-option');
        let hasResults = false;
        
        options.forEach(option => {
          const text = option.textContent.toUpperCase();
          const value = option.getAttribute('data-value');
          const name = option.getAttribute('data-name');
          
          if (text.indexOf(filter) > -1 || value.indexOf(filter) > -1 || name.toUpperCase().indexOf(filter) > -1) {
            option.style.display = 'flex';
            hasResults = true;
          } else {
            option.style.display = 'none';
          }
        });
        
        // إظهار رسالة إذا لم توجد نتائج
        const noResults = optionsContainer.querySelector('.no-results');
        if (!hasResults) {
          if (!noResults) {
            const noResultsMsg = document.createElement('div');
            noResultsMsg.className = 'no-results';
            noResultsMsg.style.padding = '10px';
            noResultsMsg.style.textAlign = 'center';
            noResultsMsg.style.opacity = '0.7';
            noResultsMsg.style.fontSize = '0.85rem';
            noResultsMsg.textContent = 'لم يتم العثور على عملات مطابقة';
            optionsContainer.appendChild(noResultsMsg);
          }
        } else if (noResults) {
          noResults.remove();
        }
      }
      
      fromSearchInput.addEventListener('input', () => {
        filterCurrencyOptions(fromSearchInput, elements.fromOptions);
      });
      
      toSearchInput.addEventListener('input', () => {
        filterCurrencyOptions(toSearchInput, elements.toOptions);
      });
    }

    function setupToggleSwitches() {
      elements.autoUpdateToggle.addEventListener('change', function() {
        if (this.checked) {
          showEnhancedNotification("✅ تم تفعيل التحديث التلقائي (كل دقيقتين)", 'success');
        } else {
          showEnhancedNotification("❌ تم إيقاف التحديث التلقائي", 'warning');
        }
      });
      
      elements.aiToggle.addEventListener('change', function() {
        AIManager.toggleEnabled(this.checked);
      });
      
      elements.dataSavingToggle.addEventListener('change', function() {
        if (this.checked) {
          showEnhancedNotification("✅ تم تفعيل وضع توفير البيانات", 'success');
          ExchangeRateManager.apis.forEach(api => {
            if (api.priority > 1) api.active = false;
          });
          loadSourcesList();
        } else {
          showEnhancedNotification("❌ تم إيقاف وضع توفير البيانات", 'warning');
          ExchangeRateManager.apis.forEach(api => api.active = true);
          loadSourcesList();
        }
      });
      
      elements.saveHistoryToggle.addEventListener('change', function() {
        if (this.checked) {
          showEnhancedNotification("✅ تم تفعيل حفظ سجل التحويلات", 'success');
          loadHistory();
        } else {
          showEnhancedNotification("❌ تم إيقاف حفظ سجل التحويلات", 'warning');
          elements.historySection.style.display = 'none';
        }
      });
    }

    function setupTabs() {
      elements.tabs.forEach(tab => {
        tab.addEventListener('click', () => {
          const tabId = tab.getAttribute('data-tab');
          
          // إزالة النشاط من جميع التبويبات
          elements.tabs.forEach(t => t.classList.remove('active'));
          elements.tabContents.forEach(tc => tc.classList.remove('active'));
          
          // إضافة النشاط للتبويب المحدد
          tab.classList.add('active');
          document.getElementById(`${tabId}-tab`).classList.add('active');
          
          currentTab = tabId;
          
          // تحميل محتوى خاص بالتبويب إذا لزم الأمر
          if (tabId === 'ai') {
            loadAIInsights();
            loadAICryptoPredictions();
          } else if (tabId === 'local') {
            loadLocalRates();
          } else if (tabId === 'news') {
            loadAINews();
          }
          
          showEnhancedNotification(`✅ تم التبديل إلى ${getTabName(tabId)}`, 'success');
        });
      });
    }

    function getTabName(tabId) {
      const tabNames = {
        'converter': 'المحول الرئيسي',
        'ai': 'الذكاء الاصطناعي',
        'crypto': 'العملات الرقمية',
        'local': 'الأسعار المحلية',
        'news': 'أخبار العملات'
      };
      return tabNames[tabId] || tabId;
    }

    function setupTimeframeButtons() {
      elements.timeframeButtons.forEach(btn => {
        btn.addEventListener('click', function() {
          elements.timeframeButtons.forEach(b => b.classList.remove('active'));
          this.classList.add('active');
          currentTimeframe = this.getAttribute('data-timeframe');
          
          // إذا كان هناك تنبؤ معروض، قم بتحديثه
          if (elements.aiPredictionCard.style.display === 'block') {
            getAIPrediction();
          }
        });
      });
    }

    function setupCountrySelector() {
      elements.countrySelect.addEventListener('change', function() {
        currentCountry = this.value;
        loadLocalRates();
        showEnhancedNotification(`✅ تم تحميل أسعار ${localRatesData[currentCountry].name}`, 'success');
      });
    }

    function setupSettingsPage() {
      elements.settingsBtn.addEventListener('click', function() {
        elements.settingsPage.classList.add('active');
        document.body.style.overflow = 'hidden';
      });
      
      elements.closeSettings.addEventListener('click', function() {
        elements.settingsPage.classList.remove('active');
        document.body.style.overflow = 'auto';
      });
      
      // إغلاق الإعدادات عند النقر خارجها
      elements.settingsPage.addEventListener('click', function(e) {
        if (e.target === elements.settingsPage) {
          elements.settingsPage.classList.remove('active');
          document.body.style.overflow = 'auto';
        }
      });
    }

    function setupThemeToggle() {
      elements.themeToggle.addEventListener('click', function() {
        isDarkMode = !isDarkMode;
        const theme = isDarkMode ? 'dark' : 'light';
        
        document.body.setAttribute('data-theme', theme);
        
        // تحديث الأيقونة
        const icon = elements.themeToggle.querySelector('i');
        icon.className = isDarkMode ? 'fas fa-moon' : 'fas fa-sun';
        
        // حفظ السمة المفضلة
        localStorage.setItem('preferred-theme', theme);
        
        showEnhancedNotification(`🎨 تم التبديل إلى ${isDarkMode ? 'الوضع الليلي' : 'الوضع النهاري'}`, 'success');
      });
    }

    // إعداد الأحداث المحسن مع الذكاء الاصطناعي
    function setupEventListeners() {
      elements.convertBtn.addEventListener("click", convertCurrency);
      elements.aiPredictionBtn.addEventListener("click", getAIPrediction);
      elements.reverseAction.addEventListener("click", reverseCurrencies);
      elements.favoriteAction.addEventListener("click", addToFavorites);
      elements.aiInsightAction.addEventListener("click", showAIInsights);
      elements.clearAction.addEventListener("click", clearAll);

      elements.refreshNews.addEventListener('click', () => {
        elements.refreshNews.style.transform = 'rotate(360deg)';
        elements.refreshNews.style.transition = 'transform 0.6s ease';
        
        setTimeout(() => {
          elements.refreshNews.style.transform = 'rotate(0deg)';
          loadAINews();
          showEnhancedNotification("🔄 تم تحديث الأخبار", 'success');
        }, 600);
      });

      elements.refreshAiPredictions.addEventListener('click', () => {
        elements.refreshAiPredictions.style.transform = 'rotate(360deg)';
        elements.refreshAiPredictions.style.transition = 'transform 0.6s ease';
        
        setTimeout(() => {
          elements.refreshAiPredictions.style.transform = 'rotate(0deg)';
          loadAICryptoPredictions();
          showEnhancedNotification("🔄 تم تحديث تنبؤات الذكاء الاصطناعي", 'ai');
        }, 600);
      });

      // إضافة إمكانية استخدام Enter للتحويل
      elements.amountInput.addEventListener('keypress', (e) => {
        if (e.key === 'Enter') {
          convertCurrency();
        }
      });

      // تحديث سعر السوق عند تغيير العملات
      elements.fromCurrencySelect.addEventListener('click', updateMarketRate);
      elements.toCurrencySelect.addEventListener('click', updateMarketRate);
    }

    // التهيئة المحسنة عند تحميل الصفحة مع الذكاء الاصطناعي
    window.addEventListener('load', function() {
      // تحميل السمة المفضلة
      const preferredTheme = localStorage.getItem('preferred-theme') || 'dark';
      isDarkMode = preferredTheme === 'dark';
      document.body.setAttribute('data-theme', preferredTheme);
      
      // تحديث أيقونة الوضع
      const icon = elements.themeToggle.querySelector('i');
      icon.className = isDarkMode ? 'fas fa-moon' : 'fas fa-sun';

      // تهيئة المكونات
      ExchangeRateManager.init();
      loadCurrencies();
      setupCurrencySearch();
      loadAINews();
      loadCryptoRates();
      loadLocalRates();
      loadSourcesList();
      loadFavorites();
      loadHistory();
      setupToggleSwitches();
      setupTabs();
      setupTimeframeButtons();
      setupCountrySelector();
      setupSettingsPage();
      setupThemeToggle();
      setupEventListeners();
      
      // تأثيرات الظهور
      const converterCard = document.querySelector('.converter-card');
      converterCard.style.opacity = '0';
      converterCard.style.transform = 'translateY(30px) scale(0.95)';
      
      setTimeout(() => {
        converterCard.style.transition = 'all 0.6s cubic-bezier(0.4, 0, 0.2, 1)';
        converterCard.style.opacity = '1';
        converterCard.style.transform = 'translateY(0) scale(1)';
      }, 300);
      
      // تحديث سعر السوق الأولي
      setTimeout(updateMarketRate, 1000);
      
      showEnhancedNotification("🧠🚀 مرحباً بك في المحول الشامل الذكي للعملات!", 'ai');
      
      console.log("✅ التطبيق المحسن مع الذكاء الاصطناعي جاهز للاستخدام");
    });

    // تحسينات إضافية للأداء
    window.addEventListener('beforeunload', () => {
      // حفظ الحالة الحالية
      const currentState = {
        fromCurrency: currentFromCurrency,
        toCurrency: currentToCurrency,
        amount: elements.amountInput.value,
        tab: currentTab,
        aiEnabled: elements.aiToggle.checked,
        country: currentCountry,
        theme: isDarkMode ? 'dark' : 'light'
      };
      localStorage.setItem('app-state', JSON.stringify(currentState));
    });

    // تحميل الحالة المحفوظة
    try {
      const savedState = localStorage.getItem('app-state');
      if (savedState) {
        const state = JSON.parse(savedState);
        currentFromCurrency = state.fromCurrency || currentFromCurrency;
        currentToCurrency = state.toCurrency || currentToCurrency;
        elements.amountInput.value = state.amount || '';
        currentTab = state.tab || currentTab;
        elements.aiToggle.checked = state.aiEnabled !== undefined ? state.aiEnabled : true;
        AIManager.isEnabled = elements.aiToggle.checked;
        currentCountry = state.country || currentCountry;
        elements.countrySelect.value = currentCountry;
        
        if (state.theme) {
          isDarkMode = state.theme === 'dark';
          document.body.setAttribute('data-theme', state.theme);
          const icon = elements.themeToggle.querySelector('i');
          icon.className = isDarkMode ? 'fas fa-moon' : 'fas fa-sun';
        }
      }
    } catch (error) {
      console.warn('❌ فشل في تحميل الحالة المحفوظة:', error);
    }
  </script>
</body>
</html>