/* Genel Ayarlar ve Temel Stiller */
body {
  font-family: 'Inter', sans-serif;
  margin: 0;
  padding: 0;
  background-color: #f8f9fa; /* Hafif bir arka plan rengi */
  color: #333; /* Genel metin rengi */
  line-height: 1.6;
}

a {
  text-decoration: none;
  color: inherit; /* Linklerin varsayılan rengi kendi bulunduğu bloğun rengini alsın */
}

/* Başlık (Header) Stilleri */
.dashboard-header {
  background-color: #2C3E50; /* Koyu lacivert veya markanın ana rengi */
  color: white;
  padding: 1rem 2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* Hafif gölge */
}

.dashboard-header .logo {
  font-size: 1.8rem;
  font-weight: 700;
  color: white;
}

.dashboard-header .logout-btn {
  background-color: #e74c3c; /* Kırmızımsı bir çıkış butonu */
  color: white;
  border: none;
  padding: 0.7rem 1.5rem;
  border-radius: 5px;
  cursor: pointer;
  font-weight: 600;
  transition: background-color 0.3s ease; /* Hover efekti için */
  display: flex; /* İkon ve metni yanyana hizalamak için */
  align-items: center;
  gap: 0.5rem; /* İkon ile metin arası boşluk */
}

.logout-btn:hover {
  background-color: #c0392b;
}

/* Ana Konteyner ve Düzen */
.dashboard-container {
  display: flex;
  min-height: calc(100vh - 120px); /* Header ve footer yüksekliğini düşerek ekran yüksekliğini kapla */
}

/* Yan Menü (Sidebar) Stilleri */
.sidebar {
  width: 250px;
  background-color: #34495e; /* Koyu gri/mavi tonları */
  color: white;
  padding: 1.5rem 0;
  box-shadow: 2px 0 5px rgba(0,0,0,0.05);
}

.sidebar ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sidebar ul li {
  padding: 1rem 2rem;
  cursor: pointer;
  transition: background-color 0.3s ease, padding-left 0.3s ease;
  border-left: 5px solid transparent; /* Aktif öğe için */
  display: flex; /* İkon ve metni yanyana hizalamak için */
  align-items: center;
  gap: 0.8rem; /* İkon ile metin arası boşluk */
}

.sidebar ul li:hover {
  background-color: #4a627a; /* Hafif koyu hover rengi */
  padding-left: 2.2rem; /* Hafif kaydırma efekti */
}

.sidebar ul li.active {
  background-color: #2980b9; /* Aktif menü öğesi için ana renk */
  border-left: 5px solid #3498db; /* Belirgin bir sol kenarlık */
  font-weight: 600;
}

/* Ana İçerik (Main Content) Stilleri */
.dashboard-main {
  flex-grow: 1; /* Kalan alanı kapla */
  padding: 2rem;
  background-color: #ffffff; /* Beyaz içerik alanı */
  margin: 1.5rem; /* Yanlardan boşluk bırak */
  border-radius: 8px; /* Hafif yuvarlatılmış köşeler */
  box-shadow: 0 4px 10px rgba(0,0,0,0.05); /* Daha belirgin gölge */
}

.dashboard-main h2 {
  color: #2C3E50; /* Koyu başlık rengi */
  margin-bottom: 0.5rem;
  font-size: 1.8rem;
}

.dashboard-main p {
  color: #7f8c8d; /* Alt başlık/bilgi metni rengi */
  margin-bottom: 1.5rem;
}

/* Yeni Ürün Ekle Butonu */
.add-product-btn {
  padding: 0.8rem 1.8rem;
  background-color: #28a745; /* Yeşil ekleme butonu */
  color: white;
  border: none;
  border-radius: 8px; /* Daha fazla yuvarlaklık */
  cursor: pointer;
  font-size: 1rem;
  font-weight: 600;
  transition: background-color 0.3s ease;
  display: flex; /* İkon ve metni yanyana hizalamak için */
  align-items: center;
  gap: 0.5rem; /* İkon ile metin arası boşluk */
}

.add-product-btn:hover {
  background-color: #218838;
}

/* Ürün Listesi ve Ürün Öğesi Stilleri */
.product-list {
  display: grid; /* Grid düzeni kullanabiliriz */
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); /* Esnek kolonlar */
  gap: 1.5rem; /* Ürünler arası boşluk */
  margin-top: 2rem;
}

.product-item {
  background-color: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  padding: 1.5rem;
  box-shadow: 0 2px 5px rgba(0,0,0,0.03); /* Hafif gölge */
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  display: flex;
  flex-direction: column; /* İçeriği dikey sırala */
  justify-content: space-between;
}

.product-item:hover {
  transform: translateY(-5px); /* Hafif yukarı kalkma efekti */
  box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.product-item strong {
  font-size: 1.2rem;
  color: #333;
  margin-bottom: 0.5rem;
}

.product-item span {
  display: block; /* Her bilgiyi yeni satıra al */
  color: #555;
  font-size: 0.95rem;
  margin-top: 0.3rem;
}

/* Ürün Durumu Stilleri */
.product-item .status-published {
  color: #28a745; /* Yeşil onay işareti */
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 0.3rem;
  margin-top: 0.8rem; /* Fiyat/stoktan biraz boşluk */
}

.product-item .status-draft {
  color: #ffc107; /* Turuncu taslak/stok yok işareti */
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 0.3rem;
  margin-top: 0.8rem;
}

/* Ürün Eylem Butonları (Düzenle, Sil) */
.product-actions {
  margin-top: 1rem;
  display: flex;
  gap: 0.5rem;
}

.product-actions button {
  padding: 0.5rem 1rem;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  font-size: 0.9rem;
  transition: background-color 0.3s ease;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.product-actions .edit-btn {
  background-color: #007bff; /* Mavi düzenle butonu */
  color: white;
}

.product-actions .edit-btn:hover {
  background-color: #0056b3;
}

.product-actions .delete-btn {
  background-color: #dc3545; /* Kırmızı sil butonu */
  color: white;
}

.product-actions .delete-btn:hover {
  background-color: #bd2130;
}

/* Alt Bilgi (Footer) Stilleri */
footer {
  text-align: center;
  padding: 1.5rem;
  background-color: #ecf0f1; /* Açık gri */
  color: #7f8c8d;
  font-size: 0.9rem;
  border-top: 1px solid #e0e0e0;
}