/* 1) Renk değişkenleri */
:root {
  --bg-color:      #121212;
  --navbar-bg:     #1f1f23;
  --card-bg:       #1f1f23;
  --text-color:    #e4e4e7;
  --muted-color:   #a1a1aa;
  --accent-color:  #f43f5e;
  --accent-dark:   #d63355;
}

/* 2) Genel */
body {
  background-color: var(--bg-color);
  color: var(--text-color);
  font-family: 'Poppins', sans-serif;
}
a {
  color: var(--accent-color);
}
a:hover {
  color: var(--accent-dark);
  text-decoration: none;
}

/* 3) Navbar */
.navbar {
  background-color: var(--navbar-bg) !important;
}
.navbar .navbar-brand,
.navbar .nav-link {
  color: var(--text-color) !important;
}
.navbar .navbar-brand:hover,
.navbar .nav-link:hover {
  color: var(--accent-color) !important;
}

/* 4) Kartlar (cards) */
.card {
  background-color: var(--card-bg);
  color: var(--text-color);
  border: none;
}
.card .card-title,
.card .card-text {
  color: var(--text-color);
}

/* 5) Butonlar */
.btn-primary {
  background-color: var(--accent-color);
  border-color: var(--accent-color);
  color: #fff;
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--accent-dark);
  border-color: var(--accent-dark);
}

/* 6) Listeler, form elemanları */
.list-group-item {
  background-color: var(--card-bg);
  color: var(--text-color);
  border-color: #2a2a2e;
}
.form-control,
.form-select {
  background-color: var(--card-bg);
  color: var(--text-color);
  border: 1px solid #2a2a2e;
  transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}
.form-control:focus,
.form-select:focus {
  background-color: var(--card-bg) !important;
  color: var(--text-color) !important;
  border-color: var(--accent-color) !important;
  box-shadow: 0 0 0 .2rem rgba(244,63,94,.25);
  outline: none;
}

/* 7) Başlık ve metin renkleri */
h1, h2, h3, h4, h5, h6 {
  color: #fff;
}
small, .text-muted {
  color: var(--muted-color) !important;
}

/* 8) Footer, container vb */
footer {
  background: var(--navbar-bg);
  color: var(--muted-color);
  padding: 2rem 0;
}

/* 9) Bookmark/Favori Toggle Buton */
.fav-toggle-btn {
  font-size: 1.8rem;
  background: none;
  border: none;
  padding: 0;
  color: var(--accent-color);
  transition: color .2s;
  outline: none;
  vertical-align: middle;
  line-height: 1;
}
.fav-toggle-btn:disabled {
  opacity: .7;
  pointer-events: none;
}
.fav-toggle-btn .bi-bookmark-fill,
.fav-toggle-btn .bi-bookmark {
  color: var(--accent-color);
  transition: color .2s;
}

/* 10) Breadcrumb */
.breadcrumb {
  background: transparent;
  color: var(--accent-color);
}
.breadcrumb a {
  color: var(--accent-color);
}
.breadcrumb a:hover {
  color: var(--accent-dark);
}

/* 11) Pagination */
.pagination {
  display: flex;
  justify-content: center;
  padding-left: 0;
  list-style: none;
}
.pagination .page-item {
  margin: 0 .25rem;
}
.pagination .page-link {
  color: var(--accent-color);
  background-color: var(--card-bg);
  border: 1px solid #2a2a2e;
  transition: background-color .2s, color .2s, border-color .2s;
}
.pagination .page-link:hover {
  color: var(--accent-dark);
  background-color: var(--card-bg);
  border-color: var(--accent-color);
}
.pagination .page-item.active .page-link {
  background-color: var(--accent-color) !important;
  border-color: var(--accent-color) !important;
  color: #fff !important;
}

/* Placeholder metinleri için tüm tarayıcılarda görünür, muted-color ile renk ata */
input::placeholder,
textarea::placeholder,
.form-control::placeholder,
.form-select::placeholder {
  color: var(--muted-color) !important;
  opacity: 1 !important;
}
/* Firefox 18- */
input:-moz-placeholder,
textarea:-moz-placeholder,
.form-control:-moz-placeholder,
.form-select:-moz-placeholder {
  color: var(--muted-color) !important;
  opacity: 1 !important;
}
/* Firefox 19+ */
input::-moz-placeholder,
textarea::-moz-placeholder,
.form-control::-moz-placeholder,
.form-select::-moz-placeholder {
  color: var(--muted-color) !important;
  opacity: 1 !important;
}
/* Internet Explorer 10-11 */
input:-ms-input-placeholder,
textarea:-ms-input-placeholder,
.form-control:-ms-input-placeholder,
.form-select:-ms-input-placeholder {
  color: var(--muted-color) !important;
  opacity: 1 !important;
}
/* Microsoft Edge */
input::-ms-input-placeholder,
textarea::-ms-input-placeholder,
.form-control::-ms-input-placeholder,
.form-select::-ms-input-placeholder {
  color: var(--muted-color) !important;
  opacity: 1 !important;
}

/* Arama kutusunu odaklandığında beyaz bırakmak için */
.navbar .form-control.bg-white:focus,
.navbar .form-control.bg-white:focus-visible,
.navbar .form-control.bg-white:active {
  background-color: #fff !important;
  color: #000 !important;
  box-shadow: none !important;
}
