/* ===== AYARLAR SAYFASI ===== */

.ayarlar-page .module-head {
  margin-bottom: 20px;
}

.ayarlar-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

/* Geniş kartlar tam satır kaplar */
.ayar-kart--genis {
  grid-column: span 1;
}

/* KART */
.ayar-kart {
  background: linear-gradient(180deg, #fdf9f3 0%, #f6eedf 100%);
  border: 1px solid #ddd0bc;
  border-radius: 14px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ayar-kart-baslik {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
  color: #3c2f1f;
  padding-bottom: 10px;
  border-bottom: 1px solid #e8dcc8;
}

.ayar-kart-icerik {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* AÇIKLAMA */
.ayar-aciklama {
  font-size: 12px;
  color: #7a6d5c;
  line-height: 1.5;
  margin: 0;
}

.ayar-aciklama--uyari {
  color: #a05a20;
  background: rgba(200, 100, 30, 0.08);
  border-radius: 8px;
  padding: 8px 10px;
}

/* FORM ELEMANLARI */
.ayar-form-row {
  display: flex;
  gap: 8px;
  align-items: center;
}

.ayar-form-col {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ayar-input {
  flex: 1;
  height: 38px;
  border-radius: 10px;
  border: 1px solid #d2c3af;
  padding: 0 12px;
  font-size: 13px;
  background: #fbf7ef;
  color: #2c2010;
  outline: none;
  font-family: inherit;
}

.ayar-input:focus {
  border-color: #c8943c;
  box-shadow: 0 0 0 2px rgba(200, 148, 60, 0.15);
}

.ayar-select {
  flex: 1;
  height: 38px;
  border-radius: 10px;
  border: 1px solid #d2c3af;
  padding: 0 10px;
  font-size: 13px;
  background: #fbf7ef;
  color: #2c2010;
  outline: none;
  font-family: inherit;
  cursor: pointer;
}

.ayar-select:focus {
  border-color: #c8943c;
}

/* BUTON */
.ayar-btn {
  height: 38px;
  padding: 0 16px;
  border-radius: 10px;
  border: 1px solid #c8943c;
  background: linear-gradient(180deg, #f3d79e 0%, #e2c074 100%);
  font-size: 12px;
  font-weight: 700;
  color: #5a3f10;
  cursor: pointer;
  font-family: inherit;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: filter .12s;
}

.ayar-btn:hover {
  filter: brightness(1.04);
}

.ayar-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
  filter: none;
}

.ayar-btn--yedek {
  flex: 1;
  justify-content: center;
  background: linear-gradient(180deg, #e8f4e8 0%, #cce8cc 100%);
  border-color: #5a9a5a;
  color: #2a5a2a;
}

.ayar-btn--tehlike {
  background: linear-gradient(180deg, #fde8e8 0%, #f4cccc 100%);
  border-color: #c94e4e;
  color: #7a1a1a;
  white-space: nowrap;
}

/* YEDEK BUTONLAR */
.ayar-yedek-butonlar {
  display: flex;
  gap: 8px;
}

/* YEDEK YÜKLE */
.ayar-yukle-wrap {
  display: flex;
  gap: 8px;
  align-items: center;
}

.ayar-dosya-label {
  flex: 1;
  height: 38px;
  border-radius: 10px;
  border: 1px dashed #c8a87a;
  background: #fdf8f0;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 600;
  color: #7a6040;
  cursor: pointer;
  transition: background .12s, border-color .12s;
  overflow: hidden;
}

.ayar-dosya-label:hover {
  background: #fdf3e3;
  border-color: #c8943c;
}

.ayar-dosya-label span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* TEMA SEÇENEKLERİ */
.tema-secenekler {
  display: flex;
  gap: 10px;
}

.tema-btn {
  flex: 1;
  height: 72px;
  border-radius: 12px;
  border: 2px solid #d6c8b6;
  background: linear-gradient(180deg, #f7f1e7 0%, #ede5d6 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: #3c2f1f;
  cursor: pointer;
  font-family: inherit;
  transition: border-color .15s, box-shadow .15s;
}

.tema-btn:hover {
  border-color: #c8943c;
}

.tema-btn.aktif {
  border-color: #c8943c;
  box-shadow: 0 0 0 3px rgba(200, 148, 60, 0.2);
  background: linear-gradient(180deg, #fdf0d0 0%, #f5e0a8 100%);
}

/* KOYU TEMA */

/* RESPONSIVE */
@media (max-width: 700px) {
  .ayarlar-grid {
    grid-template-columns: 1fr;
  }
  .ayar-yukle-wrap {
    flex-direction: column;
  }
  .ayar-yukle-wrap .ayar-btn--tehlike {
    width: 100%;
    justify-content: center;
  }
}

/* KOYU TEMA - Ayarlar sayfasına özgü */
body.dark .ayar-kart {
  background: linear-gradient(180deg, #2a2218 0%, #221c14 100%);
  border-color: #3a3028;
}

body.dark .ayar-kart-baslik { color: #e0d4c0; border-color: #3a3028; }

body.dark .ayar-input,
body.dark .ayar-select {
  background: #1e1810;
  border-color: #3e3224;
  color: #e0d0b8;
}

body.dark .ayar-input:focus,
body.dark .ayar-select:focus {
  border-color: #c8943c;
}

body.dark .ayar-aciklama { color: #8a7a68; }

body.dark .ayar-dosya-label {
  background: #1e1810;
  border-color: #5a4a38;
  color: #9a8a78;
}

body.dark .tema-btn {
  background: linear-gradient(180deg, #2a2218 0%, #221c14 100%);
  border-color: #3e3224;
  color: #d8c8b0;
}
