const features = [
  "جستجوی آب و هوای شهرها",
  "نمایش دمای فعلی، حداقل و حداکثر",
  "نمایش شرایط جوی (آفتابی، ابری، بارانی و ...)",
  "ذخیره تاریخچه جستجوها",
  "نمایش اطلاعات اضافی مانند رطوبت و سرعت باد"
];

<!-- ساختار اصلی برنامه -->
<div class="weather-container">
  <h1>اپلیکیشن آب و هوا</h1>
  <div class="search-section">
    <input type="text" id="city-input" placeholder="نام شهر را وارد کنید...">
    <button id="search-btn">جستجو</button>
  </div>
  <div class="weather-card">
    <div class="city-name">تهران</div>
    <div class="weather-icon">☀️</div>
    <div class="temp">25°C</div>
    <div class="description">آفتابی</div>
    <div class="details">
      <div>حداقل: 18°C</div>
      <div>حداکثر: 30°C</div>
      <div>رطوبت: 45%</div>
      <div>سرعت باد: 10 km/h</div>
    </div>
  </div>
  <div class="history-section">
    <h3>تاریخچه جستجو</h3>
    <ul id="history-list"></ul>
  </div>
</div>

.weather-container {
  max-width: 600px;
  margin: 0 auto;
  padding: 20px;
  font-family: 'Segoe UI', Tahoma, sans-serif;
}
.weather-card {
  background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
  border-radius: 10px;
  padding: 20px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  text-align: center;
  margin-bottom: 20px;
}
.weather-icon {
  font-size: 4rem;
  margin: 10px 0;
}

// متغیرهای اصلی برنامه
const API_KEY = 'your_api_key_here'; // کلید API از OpenWeatherMap
const cityInput = document.getElementById('city-input');
const searchBtn = document.getElementById('search-btn');
const weatherCard = document.querySelector('.weather-card');
const historyList = document.getElementById('history-list');
// آرایه‌ای برای ذخیره تاریخچه جستجوها
let searchHistory = JSON.parse(localStorage.getItem('weatherHistory')) || [];
// تابع برای دریافت اطلاعات آب و هوا از API
async function getWeatherData(city) {
  try {
    const response = await fetch(
      `https://api.openweathermap.org/data/2.5/weather?q=${city}&units=metric&appid=${API_KEY}`
    );
    if (!response.ok) {
      throw new Error('شهر مورد نظر یافت نشد');
    }
    const data = await response.json();
    displayWeather(data);
    addToHistory(city);
  } catch (error) {
    alert(error.message);
  }
}

// تابع برای نمایش اطلاعات آب و هوا
function displayWeather(data) {
  const cityName = data.name;
  const temp = Math.round(data.main.temp);
  const minTemp = Math.round(data.main.temp_min);
  const maxTemp = Math.round(data.main.temp_max);
  const humidity = data.main.humidity;
  const windSpeed = data.wind.speed;
  const description = data.weather[0].description;
  const icon = getWeatherIcon(data.weather[0].main);
  document.querySelector('.city-name').textContent = cityName;
  document.querySelector('.weather-icon').textContent = icon;
  document.querySelector('.temp').textContent = `${temp}°C`;
  document.querySelector('.description').textContent = description;
  document.querySelector('.details div:nth-child(1)').textContent = `حداقل: ${minTemp}°C`;
  document.querySelector('.details div:nth-child(2)').textContent = `حداکثر: ${maxTemp}°C`;
  document.querySelector('.details div:nth-child(3)').textContent = `رطوبت: ${humidity}%`;
  document.querySelector('.details div:nth-child(4)').textContent = `سرعت باد: ${windSpeed} km/h`;
}

// رویداد کلیک برای دکمه جستجو
searchBtn.addEventListener('click', () => {
  const city = cityInput.value.trim();
  if (city === '') return;
  getWeatherData(city);
});
// رویداد کلیک برای تاریخچه جستجو
historyList.addEventListener('click', (e) => {
  if (e.target.tagName === 'LI') {
    const city = e.target.textContent;
    getWeatherData(city);
  }
});

// بارگذاری اولیه تاریخچه جستجوها
document.addEventListener('DOMContentLoaded', () => {
  renderHistory();
});