/* style.css */

body {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji",
    "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.65;
}

/* Navigasyon ve Genel Bağlantılar için Temel Stil (HTML'deki Tailwind sınıfları ile desteklenir) */
nav a,
footer a {
  transition: color 0.2s ease-in-out;
}

/* İçerik Alanı Genel Ayarları */
.content-area {
  color: #cbd5e1; /* text-star-silver */
}

.content-area h1,
.content-area h2,
.content-area h3,
.content-area h4,
.content-area h5,
.content-area h6 {
  font-family: "Lora", serif;
  color: #3b82f6; /* text-nebula-blue */
  margin-bottom: 0.75em; /* Daha orantılı bir alt boşluk */
  line-height: 1.3;
}

.content-area h1 {
  /* Modül ana başlığı için (HTML'de zaten büyük) */
  margin-bottom: 1em;
}

.content-area h2 {
  /* Ana bölüm başlıkları (content-h2) */
  font-size: 1.875rem; /* text-3xl */
  font-weight: 700;
  margin-top: 2.5rem; /* mt-10 */
  margin-bottom: 1.5rem; /* mb-6 */
  padding-bottom: 0.25rem;
  border-bottom: 1px solid #374151; /* border-gray-700 */
}

.content-area h3 {
  /* Alt bölüm başlıkları (content-h3) */
  font-size: 1.5rem; /* text-2xl */
  font-weight: 600;
  margin-top: 2rem; /* mt-8 */
  margin-bottom: 1rem; /* mb-4 */
}

.content-area p {
  margin-bottom: 1.25rem; /* mb-5 */
  line-height: 1.75; /* leading-relaxed */
}

.content-area ul,
.content-area ol {
  margin-left: 1.25rem; /* ml-5 */
  margin-bottom: 1.25rem; /* mb-5 */
  padding-left: 1rem; /* Daha iyi girinti */
}

.content-area ul {
  list-style-type: disc;
}

.content-area ol {
  list-style-type: decimal;
}

.content-area li {
  margin-bottom: 0.625rem; /* mb-2.5 */
  padding-left: 0.25rem;
}

.content-area li > ul,
.content-area li > ol {
  margin-top: 0.625rem;
  margin-bottom: 0.625rem;
}

.content-area a {
  color: #60a5fa; /* text-blue-400 */
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
  transition: color 0.2s ease-in-out;
}

.content-area a:hover {
  color: #93c5fd; /* text-blue-300 */
  text-decoration-thickness: 2px;
}

.content-area strong,
.content-area b {
  color: #e5e7eb; /* text-gray-200 */
  font-weight: 700;
}

.content-area em,
.content-area i {
  font-style: italic;
  color: #d1d5db; /* text-gray-300 */
}

.content-area blockquote {
  border-left: 4px solid #6d28d9; /* border-cosmic-purple */
  padding-left: 1.5rem; /* pl-6 */
  margin: 1.5rem 0; /* my-6 */
  color: #9ca3af; /* text-gray-400 */
  font-style: italic;
}

.content-area hr {
  border-top-color: #374151; /* border-gray-700 */
  margin-top: 2.5rem; /* my-10 */
  margin-bottom: 2.5rem;
}

/* YZ Perspektifi Kutusu */
.yz-perspective {
  background-color: rgba(
    31,
    41,
    55,
    0.7
  ); /* bg-gray-800 with some transparency or a slightly different shade */
  border-left: 4px solid #6d28d9; /* border-cosmic-purple */
  padding: 1rem 1.5rem; /* p-4 md:p-6 */
  margin: 1.5rem 0; /* my-6 */
  border-radius: 0 0.375rem 0.375rem 0; /* rounded-r-md */
  font-size: 0.9rem; /* text-sm */
  line-height: 1.6;
}

.yz-perspective strong {
  color: #8b5cf6; /* A slightly lighter shade of cosmic-purple for better readability on dark bg */
  font-weight: 700;
}

/* Kod Blokları */
.content-area pre {
  background-color: #1f2937; /* bg-gray-800 (biraz daha koyu) */
  color: #d1d5db; /* text-gray-300 */
  padding: 1.25rem; /* p-5 */
  border-radius: 0.375rem; /* rounded-md */
  overflow-x: auto;
  margin-bottom: 1.5rem; /* mb-6 */
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
    0 2px 4px -1px rgba(0, 0, 0, 0.06);
  border: 1px solid #374151; /* border-gray-700 */
}

.content-area code {
  font-family: "Fira Code", Consolas, "Liberation Mono", Menlo, Courier,
    monospace;
  font-size: 0.875em; /* Biraz daha küçük */
  /* Inline code için (pre içindekiler hariç) */
}

.content-area p > code,
.content-area li > code,
.content-area dd > code {
  background-color: rgba(55, 65, 81, 0.7); /* bg-gray-700 with transparency */
  color: #f3f4f6; /* text-gray-100 */
  padding: 0.2em 0.4em;
  margin: 0 0.1em;
  font-size: 0.85em;
  border-radius: 0.25rem; /* rounded-sm */
}

/* Modül İçi Öğrenme Hedefleri Kutusu */
.learning-objectives-box {
  background-color: #1f2937; /* bg-gray-800 */
  padding: 1.5rem; /* p-6 */
  border-radius: 0.5rem; /* rounded-lg */
  margin-bottom: 2rem; /* mb-8 */
  border-left: 4px solid #3b82f6; /* border-nebula-blue */
}

.learning-objectives-box h2 {
  font-size: 1.25rem; /* text-xl */
  font-weight: 600; /* font-semibold */
  font-family: "Lora", serif;
  color: #3b82f6; /* text-nebula-blue */
  margin-top: 0;
  margin-bottom: 0.75rem; /* mb-3 */
  border-bottom: none;
}

.learning-objectives-box ul {
  list-style-type: disc;
  list-style-position: inside;
  color: #cbd5e1; /* text-star-silver */
  padding-left: 0;
  margin-left: 0;
  margin-bottom: 0;
}

.learning-objectives-box li {
  margin-bottom: 0.25rem; /* mb-1 */
  padding-left: 0;
}

/* Sayfa Sonu Butonları */
.module-navigation-button {
  display: inline-block;
  background-color: #6d28d9; /* bg-cosmic-purple */
  color: white;
  font-weight: 700; /* font-bold */
  padding: 0.75rem 2rem; /* py-3 px-8 */
  border-radius: 0.5rem; /* rounded-lg */
  font-size: 1.125rem; /* text-lg */
  transition: background-color 0.2s ease-in-out;
  text-decoration: none;
}

.module-navigation-button:hover {
  background-color: #3b82f6; /* hover-bg-nebula-blue */
}