@tailwind base;
@tailwind components;
@tailwind utilities;

/* ==========================================================================
 *  Apple Estetiği için Güncellenmiş Değişkenler
 *  ========================================================================== */
:root {
  --background: #f5f5f7;            /* DEĞİŞİKLİK: Apple'ın standart açık gri arka planı. */
  --card-bg: #ffffff;               /* Kartlar saf beyaz kalacak. */
  --text-primary: #1d1d1f;          /* Apple'ın ana metin rengi (koyu gri). */
  --text-secondary: #6e6e73;        /* İkincil metinler için daha açık gri. */
  --border-color: #d2d2d7;          /* DEĞİŞİKLİK: Daha belirgin ve Apple tarzı bir kenarlık rengi. */
  --accent: #0071e3;                /* DEĞİŞİKLİK: Apple'ın meşhur mavi eylem rengi. */
  --accent-hover: #0068cf;          /* DEĞİŞİKLİK: Mavi rengin biraz daha koyu tonu. */
}

/* ==========================================================================
 *  Temel Gövde ve Font Ayarları
 *  ========================================================================== */
body {
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; /* Font ailesi güncellendi, 'Inter' harika bir seçim. */
  background-color: var(--background);
  color: var(--text-primary);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ==========================================================================
 *  Güncellenmiş Kart Yapısı
 *  ========================================================================== */
.card {
  /* DEĞİŞİKLİK: Gölge daha hafifletildi ('shadow'), köşe yuvarlaklığı artırıldı ('rounded-2xl'). */
  @apply bg-white rounded-2xl border border-[var(--border-color)] shadow transition-all duration-300;
}

.card-hover:hover {
  /* DEĞİŞİKLİK: Üzerine gelince gölge biraz daha belirginleşiyor ('shadow-lg'). */
  @apply shadow-lg transform -translate-y-1;
}

/* ==========================================================================
 *  Güncellenmiş Form Elemanları
 *  ========================================================================== */
.form-input {
  /* DEĞİŞİKLİK: Apple tarzı form elemanı: Daha sade arka plan, belirgin kenarlık ve odaklanma efekti. */
  @apply w-full p-3 bg-white border border-[var(--border-color)] rounded-xl text-base transition duration-200 ease-in-out focus:ring-2 focus:ring-[var(--accent)] focus:border-[var(--accent)] placeholder:text-gray-500;
}

/* ==========================================================================
 *  Güncellenmiş Buton Stilleri
 *  ========================================================================== */
.btn {
  /* DEĞİŞİKLİK: Butonlar daha dolgun (daha fazla padding), yuvarlak köşeli ve net. */
  @apply font-semibold py-3 px-5 rounded-xl transition duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-60 disabled:cursor-not-allowed;
}

.btn-primary {
  @apply bg-[var(--accent)] text-white hover:bg-[var(--accent-hover)] focus:ring-[var(--accent)];
}

.btn-danger {
  @apply bg-red-600 text-white hover:bg-red-700 focus:ring-red-500;
}

.btn-success {
  @apply bg-green-500 text-white hover:bg-green-600 focus:ring-green-500;
}

.btn-secondary {
  /* DEĞİŞİKLİK: İkincil buton stili de Apple estetiğine uyarlandı. */
  @apply bg-gray-100 text-gray-800 hover:bg-gray-200 focus:ring-gray-400 border border-transparent;
}

/* ==========================================================================
 *  Güncellenmiş Sekme (Tab) Stilleri
 *  ========================================================================== */
.tab-btn {
  /* DEĞİŞİKLİK: Sekme butonları daha sade ve modern bir görünüme kavuştu. */
  @apply px-4 py-2 text-base font-medium text-gray-600 border-b-2 border-transparent hover:text-gray-900;
}
.tab-btn.active {
  @apply text-[var(--accent)] border-[var(--accent)];
}

.tab-content {
  @apply hidden;
}

.tab-content.active {
  display: block;
  animation: fadeIn 0.5s ease-in-out;
}

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