/* ==========================================================================
   sxs.academy — Sayfa yerlesimleri
   tokens.css ve base.css'ten sonra yuklenir.
   ========================================================================== */

.atla {
  position: absolute;
  left: -9999px;
  top: 0;
  padding: 10px 16px;
  background: var(--renk-mor);
  color: #fff;
  z-index: var(--z-bildirim);
}
.atla:focus { left: 8px; top: 8px; }

.dar { max-width: 720px; }
.ortala { text-align: center; }
.kucuk { font-size: 13px; color: var(--renk-metin-2); }
.uyari { color: var(--renk-turuncu); font-weight: var(--agirlik-orta); }
.yukleniyor { color: var(--renk-metin-2); padding: 32px 0; }
.bos-durum { padding: 48px 0; text-align: center; color: var(--renk-metin-2); }
.sonuc-sayisi { color: var(--renk-metin-2); font-size: 14px; margin: 16px 0; }

/* ---------------------------------------------------------------- ust

   Ust baslik kurallari TEK dosyada: `ust-kahraman.css`.
   Burada da tanimliydilar ve ikisi catisiyordu (logo hem 275px hem
   max-height:44px, menu dolgusu hem 6px hem 25px, sepet sayaci iki farkli
   konumda) — bilesenler ust uste biniyordu.
   ------------------------------------------------------------------- */

/* ---------------------------------------------------------------- alt
   Altbilgi — orijinal Elementor sablonundan (element fcafe29 ve cocuklari).
   Onemli olculer oradan birebir alindi:

     kapsayici : zemin #211951, ust kenarlik 20px #7F27FF,
                 ust koseler 20px yuvarlatilmis
     gecis     : "arrow" shape divider — 18px yuksek, %150 genis
                 (mobilde %300), dolgu #7F27FF
     sutunlar  : %24.5 / %24.5 / %24.5, aralarinda space-between
                 (tablette %49.5, mobilde tam genislik)
     kutular   : 2. ve 3. sutun KART — zemin #372E6D, radius 10px,
                 ic bosluk 25px
     alt serit : ust kenarlik 1px #372E6D, ic bosluk 12px, metin 14px

   Onceki halimiz duz bir uc sutunlu izgaraydi: ne gecis, ne kart, ne de
   ikonlar vardi.
   ------------------------------------------------------------------- */

.alt {
  position: relative;
  background: var(--renk-ana);
  color: var(--renk-metin-1);
  margin-top: 64px;
  border-top: 20px solid var(--renk-mor);
  border-radius: 20px 20px 0 0;
}

/* Footer'a gecis: ortada asagi bakan centik. `overflow:hidden` yok —
   ok, ust kenarligin uzerine tasmali. */
.alt__gecis {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  line-height: 0;
  z-index: 2;
  pointer-events: none;
}
.alt__gecis svg {
  position: relative;
  display: block;
  width: calc(150% + 1.3px);
  height: 18px;
}
.alt__gecis path { fill: var(--renk-mor); }

.alt__ic {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0;
  padding-block: 56px 40px;
}
.alt__sutun { width: 24.5%; }

.alt__sutun--marka img {
  width: 100%;
  max-width: 439px;
  height: auto;
  margin-bottom: 14px;
}
.alt__hakkinda {
  font-size: 14px;
  color: var(--renk-metin-1);
  margin: 0;
}
/* Orijinalde "Devamını Oku..." ayri bir inline icon-list: ustunde -5px
   pay, 13px/500 metin, altinda ayirici cizgi yok (tek oge). */
.alt__devam {
  list-style: none;
  margin: -5px 0 0;
  padding: 0;
}
.alt__devam a {
  font-size: 13px;
  font-weight: 500;
  color: var(--renk-turkuaz);
}

/* Kart sutunlar (Merak Ettikleriniz / İletişim Bilgileri) */
.alt__kart {
  background: var(--renk-ana-acik);
  border-radius: 10px;
  padding: 25px;
}
.alt h3 {
  color: var(--renk-beyaz);
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 16px;
}

.alt__liste { list-style: none; margin: 0; padding: 0; }
.alt__liste li + li { margin-top: 12px; }
.alt__liste a,
.alt__satir {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--renk-metin-1);
}
.alt__liste a:hover { color: var(--renk-turkuaz); }
/* Ikon rengi turkuaz, metinden bagimsiz: orijinalde de ikon
   --e-global-color-text (#27D5FF), metin --e-global-color-6e283a5. */
.alt-ikon {
  flex: none;
  width: var(--alt-ikon-olcu, 14px);
  height: var(--alt-ikon-olcu, 14px);
  color: var(--renk-turkuaz);
}
/* Iletisim sutununda ikonlar 17px (orijinal: 3787a94) */
.alt__kart--iletisim { --alt-ikon-olcu: 17px; }
.alt__kart--iletisim .alt__liste li + li { margin-top: 13px; }

/* Sosyal ikonlar: 8px yuvarlatilmis kare, 7px ic bosluk, hover'da mor */
.alt__sosyal {
  display: flex;
  gap: 12px;
  margin-top: 18px;
  padding-right: 15px;
}
.alt__sosyal a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px;
  border-radius: 8px;
  background: var(--renk-ana-acik);
  color: var(--renk-beyaz);
  transition: background .3s;
}
.alt__sosyal a:hover { background: var(--renk-mor); color: var(--renk-beyaz); }
.sosyal-ikon { width: 16px; height: 16px; display: block; }

.alt__telif {
  border-top: 1px solid var(--renk-ana-acik);
  padding-block: 12px;
  font-size: 14px;
  color: var(--renk-metin-1);
}

@media (max-width: 1024px) {
  .alt__sutun { width: 49.5%; }
  .alt__kart { margin-top: 30px; }
}
@media (max-width: 767px) {
  .alt__gecis svg { width: calc(300% + 1.3px); }
  .alt__sutun { width: 100%; }
  .alt__sutun + .alt__sutun { margin-top: 30px; }
  .alt__telif { text-align: center; }
}

/* ---------------------------------------------------------------- kahraman */

.kahraman { background: var(--renk-beyaz); }
.kahraman__ic {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 48px;
  align-items: center;
}
.kahraman__ustbaslik {
  display: inline-block;
  position: relative;
  color: var(--renk-mor);
  font-weight: var(--agirlik-orta);
  margin-bottom: 18px;
}
.kahraman h1 { font-size: 40px; line-height: 1.15; margin-bottom: 14px; }
.kahraman__alt { font-size: 18px; color: var(--renk-metin-3); margin-bottom: 16px; }
.kahraman__rozetler {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  list-style: none;
  margin: 28px 0 0;
  padding: 0;
  font-size: 14px;
}
.kahraman__rozetler li::before { content: "✓ "; color: var(--renk-turuncu); font-weight: 600; }
.kahraman__gorsel { text-align: center; }
.kahraman__gorsel img { display: inline-block; max-width: 320px; }

@media (max-width: 1024px) {
  .kahraman__ic { grid-template-columns: 1fr; }
  .kahraman h1 { font-size: 30px; }
  .kahraman__gorsel { display: none; }
}

/* ---------------------------------------------------------------- bolum basliklari */

.bolum__ustbaslik {
  color: var(--renk-mor);
  font-weight: var(--agirlik-orta);
  font-size: 14px;
  margin-bottom: 6px;
}
.bolum__baslik {
  display: inline-block;
  position: relative;
  margin-bottom: 36px;
}
.bolum__daha { margin-top: 32px; text-align: center; }

/* ---------------------------------------------------------------- kartlar */

.kurs-karti, .urun-karti { display: flex; flex-direction: column; height: 100%; }
.kurs-karti__gorsel, .urun-karti__gorsel {
  position: relative;
  display: block;
  aspect-ratio: 16 / 10;
  background: var(--renk-bolum-zemin);
  overflow: hidden;
}
.kurs-karti__gorsel img, .urun-karti__gorsel img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform var(--gecis-yavas);
}
.kurs-karti:hover .kurs-karti__gorsel img,
.urun-karti:hover .urun-karti__gorsel img { transform: scale(1.04); }
.kurs-karti__gorsel .rozet, .urun-karti__gorsel .rozet {
  position: absolute; top: 10px; left: 10px;
}

.kurs-karti__govde, .urun-karti__govde {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
  flex: 1;
}
.kurs-karti h3, .urun-karti h3 { font-size: 15px; margin: 0; line-height: 1.35; }
.kurs-karti h3 a, .urun-karti h3 a { color: var(--renk-metin-3); }
.kurs-karti h3 a:hover, .urun-karti h3 a:hover { color: var(--renk-mor); }
.kurs-karti__kategori { font-size: 12px; margin: 0; }
.kurs-karti__puan { font-size: 13px; margin: 0; color: var(--renk-turuncu); }
.kurs-karti__bilgi {
  display: flex; gap: 14px;
  list-style: none; margin: 0; padding: 0;
  font-size: 12px; color: var(--renk-metin-2);
}
.kurs-karti__alt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  padding-top: 12px;
}
.fiyat--buyuk { font-size: 26px; margin: 18px 0; }

/* ---------------------------------------------------------------- filtreler */

.kirintilar { font-size: 13px; color: var(--renk-metin-2); margin-bottom: 14px; }
.kirintilar a { color: var(--renk-metin-2); }
.kirintilar a:hover { color: var(--renk-mor); }

.filtre { display: flex; gap: 10px; max-width: 460px; margin: 20px 0; }

.etiket-listesi {
  display: flex; flex-wrap: wrap; gap: 8px;
  list-style: none; margin: 18px 0; padding: 0;
}
.etiket {
  display: inline-block;
  padding: 7px 15px;
  font-size: 13px;
  background: var(--renk-beyaz);
  border: 1px solid var(--renk-kenar);
  border-radius: var(--yuvarlak-tam);
  color: var(--renk-metin-3);
}
.etiket:hover { border-color: var(--renk-mor); color: var(--renk-mor); }
.etiket--aktif {
  background: var(--renk-mor);
  border-color: var(--renk-mor);
  color: #fff;
}

.sayfalama { display: flex; gap: 6px; justify-content: center; margin-top: 36px; }
.sayfalama__oge {
  min-width: 38px;
  padding: 8px 12px;
  text-align: center;
  background: var(--renk-beyaz);
  border: 1px solid var(--renk-kenar);
  border-radius: var(--yuvarlak);
  color: var(--renk-metin-3);
}
.sayfalama__oge--aktif {
  background: var(--renk-mor);
  border-color: var(--renk-mor);
  color: #fff;
}

/* ---------------------------------------------------------------- kurs detay */

.kurs-detay { display: grid; grid-template-columns: 1fr 340px; gap: 32px; align-items: start; }
.kurs-detay h1 { font-size: 30px; }
.kurs-detay__ust-bilgi {
  display: flex; flex-wrap: wrap; gap: 8px 20px;
  font-size: 13px; color: var(--renk-metin-2);
  margin-bottom: 22px;
}
.kurs-detay__gorsel { border-radius: var(--yuvarlak); width: 100%; }

.video-kutu {
  position: relative;
  aspect-ratio: 16 / 9;
  border-radius: var(--yuvarlak);
  overflow: hidden;
  background: #000;
}
.video-kutu iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.kutu {
  background: var(--renk-beyaz);
  border-radius: var(--yuvarlak);
  padding: 26px;
  margin-top: 22px;
  box-shadow: var(--golge-kart);
}
.kutu h2 { font-size: 20px; }
.tik-listesi { list-style: none; padding: 0; display: grid; gap: 10px; }
.tik-listesi li::before { content: "✓ "; color: var(--renk-basari); font-weight: 600; }
.zengin-metin img { border-radius: var(--yuvarlak); }
.zengin-metin h2, .zengin-metin h3 { margin-top: 24px; }

.satin-al { padding: 22px; position: sticky; top: 92px; }
.satin-al__fiyat { font-size: 28px; margin: 0 0 16px; }
.satin-al .buton { margin-bottom: 10px; }
.satin-al__ozellikler {
  list-style: none; padding: 18px 0 0; margin: 10px 0 0;
  border-top: 1px solid var(--renk-kenar);
  font-size: 13px; display: grid; gap: 9px;
}
.satin-al__ozellikler li::before { content: "✓ "; color: var(--renk-basari); }

.ilerleme { margin: 14px 0; }
.ilerleme__cubuk {
  height: 8px;
  background: var(--renk-kenar);
  border-radius: var(--yuvarlak-tam);
  overflow: hidden;
}
.ilerleme__cubuk span {
  display: block; height: 100%;
  background: var(--renk-mor);
  border-radius: var(--yuvarlak-tam);
  transition: width var(--gecis);
}

@media (max-width: 1024px) {
  .kurs-detay { grid-template-columns: 1fr; }
  .satin-al { position: static; }
}

/* ---------------------------------------------------------------- mufredat */

.mufredat__konu {
  background: var(--renk-beyaz);
  border: 1px solid var(--renk-kenar);
  border-radius: var(--yuvarlak);
  margin-bottom: 10px;
  overflow: hidden;
}
.mufredat__konu summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  cursor: pointer;
  font-weight: var(--agirlik-orta);
  color: var(--renk-metin-3);
}
.mufredat__konu summary::-webkit-details-marker { display: none; }
.mufredat__konu summary small { color: var(--renk-metin-2); font-weight: 400; }
.mufredat__liste { list-style: none; margin: 0; padding: 0 18px 14px; }
.mufredat__oge {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 0;
  font-size: 14px;
  border-top: 1px solid var(--renk-bolum-zemin);
}
.mufredat__ikon { width: 18px; text-align: center; color: var(--renk-metin-2); }
.mufredat__oge--tamam .mufredat__ikon { color: var(--renk-basari); }
.mufredat__oge--aktif { background: var(--renk-bolum-zemin); border-radius: var(--yuvarlak-kucuk); padding-inline: 8px; }

/* ---------------------------------------------------------------- urun detay */

.urun-detay { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
.urun-detay__gorsel img { border-radius: var(--yuvarlak); width: 100%; }
.urun-detay__galeri { display: flex; gap: 10px; margin-top: 12px; }
.urun-detay__galeri img { width: 84px; height: 84px; object-fit: cover; cursor: pointer; }
.urun-detay__eylem { display: flex; gap: 10px; align-items: center; }
.adet-girdi { width: 84px; }

.sekmeler { margin-top: 44px; }
.sekmeler__basliklar { display: flex; gap: 4px; border-bottom: 1px solid var(--renk-kenar); }
.sekmeler__basliklar button {
  padding: 12px 20px;
  background: none;
  border: 0;
  border-bottom: 2px solid transparent;
  font: inherit;
  font-size: 14px;
  color: var(--renk-metin-2);
  cursor: pointer;
}
.sekmeler__basliklar button[aria-selected="true"] {
  color: var(--renk-mor);
  border-bottom-color: var(--renk-mor);
}
.sekmeler__govde { padding: 24px 0; }

@media (max-width: 1024px) {
  .urun-detay { grid-template-columns: 1fr; gap: 24px; }
}

/* ---------------------------------------------------------------- sss / sayaclar */

.sss-alan { display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: start; }
.akordiyon__oge {
  background: var(--renk-beyaz);
  border-radius: var(--yuvarlak);
  margin-bottom: 10px;
  overflow: hidden;
}
.akordiyon__oge summary {
  padding: 16px 20px;
  cursor: pointer;
  font-weight: var(--agirlik-orta);
  color: var(--renk-metin-3);
}
.akordiyon__oge summary::-webkit-details-marker { display: none; }
.akordiyon__oge p { padding: 0 20px 18px; margin: 0; }

.sayaclar { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.sayac {
  background: var(--renk-beyaz);
  border-radius: var(--yuvarlak);
  padding: 26px 18px;
  text-align: center;
  box-shadow: var(--golge-kart);
}
.sayac strong {
  display: block;
  font-size: 30px;
  color: var(--renk-mor);
  line-height: 1.1;
}
.sayac span { font-size: 13px; color: var(--renk-metin-2); }

.yorum { padding: 24px; }
.yorum p { font-style: italic; }
.yorum footer { margin-top: 14px; }
.yorum footer strong { display: block; color: var(--renk-metin-3); }
.yorum footer span { font-size: 12px; color: var(--renk-metin-2); }

@media (max-width: 1024px) {
  .sss-alan { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------- formlar */

.form-kart { padding: 34px; }
.form-kart h1 { font-size: 24px; margin-bottom: 22px; }
.alan { margin-bottom: 16px; }
.onay { display: flex; align-items: center; gap: 8px; font-size: 14px; margin-bottom: 16px; }
.onay input { width: auto; }
/* Odeme formu — WooCommerce isaretleri: zorunlu kirmizi *, istege bagli soluk */
abbr.zorunlu { color: #e2401c; text-decoration: none; border: 0; cursor: help; }
.istege-bagli { color: var(--renk-metin-2); font-weight: 400; font-size: .9em; }
.odeme-yontemi__aciklama { margin: -8px 0 16px 26px; padding: 10px 14px; font-size: 13px;
  background: var(--renk-bolum-zemin); border-radius: var(--yuvarlak-kucuk); }
.odeme-gizlilik { margin: 8px 0 16px; }
.form-hata {
  padding: 11px 14px;
  background: rgba(240, 68, 56, .08);
  border-left: 3px solid var(--renk-hata);
  border-radius: var(--yuvarlak-kucuk);
  font-size: 14px;
  color: var(--renk-hata);
  margin-bottom: 14px;
}
.form-alt { margin-top: 18px; text-align: center; font-size: 14px; }

/* ---------------------------------------------------------------- sepet */

.sepet-tablo { width: 100%; border-collapse: collapse; background: var(--renk-beyaz); border-radius: var(--yuvarlak); overflow: hidden; }
.sepet-tablo th, .sepet-tablo td { padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--renk-bolum-zemin); }
.sepet-tablo th { font-size: 13px; color: var(--renk-metin-2); font-weight: var(--agirlik-orta); }
.sepet-satir__urun { display: flex; align-items: center; gap: 14px; }
.sepet-satir__urun img { width: 64px; height: 64px; object-fit: cover; border-radius: var(--yuvarlak-kucuk); }
.sepet-duzen { display: grid; grid-template-columns: 1fr 340px; gap: 28px; align-items: start; margin-top: 20px; }
.sepet-ozet { padding: 24px; position: sticky; top: 92px; }
.sepet-ozet__satir { display: flex; justify-content: space-between; padding: 9px 0; font-size: 14px; }
.sepet-ozet__satir--toplam {
  border-top: 1px solid var(--renk-kenar);
  margin-top: 8px; padding-top: 14px;
  font-size: 18px; font-weight: var(--agirlik-kalin);
  color: var(--renk-metin-3);
}
.kupon-form { display: flex; gap: 8px; margin: 14px 0; }

@media (max-width: 1024px) { .sepet-duzen { grid-template-columns: 1fr; } .sepet-ozet { position: static; } }

/* ---------------------------------------------------------------- panel */

.panel { display: grid; grid-template-columns: 250px 1fr; gap: 20px; align-items: start; }
.panel__yan { background: var(--renk-beyaz); border-radius: var(--yuvarlak); padding: 22px; }
.panel__kullanici { padding-bottom: 16px; margin-bottom: 14px; border-bottom: 1px solid var(--renk-kenar); }
.panel__kullanici strong { display: block; color: var(--renk-metin-3); }
.panel__kullanici small { color: var(--renk-metin-2); font-size: 12px; word-break: break-all; }
.panel__menu { display: grid; gap: 3px; }
.panel__menu a {
  display: block;
  padding: 11px 14px;
  border-radius: var(--yuvarlak);
  color: var(--renk-metin-3);
  font-size: 14px;
}
.panel__menu a:hover { background: var(--renk-bolum-zemin); }
.panel__menu a.aktif { background: var(--renk-mor); color: #fff; }
.panel__ana { background: var(--renk-beyaz); border-radius: var(--yuvarlak); padding: 26px; min-height: 340px; }

@media (max-width: 1024px) { .panel { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------- bildirim */

.bildirim-alani {
  position: fixed;
  right: 16px; bottom: 16px;
  z-index: var(--z-bildirim);
  display: grid;
  gap: 8px;
  max-width: 340px;
}
.bildirim-balon {
  padding: 13px 17px;
  background: var(--renk-metin-3);
  color: #fff;
  border-radius: var(--yuvarlak);
  box-shadow: var(--golge-yuksek);
  font-size: 14px;
  animation: balon-gir .25s ease;
}
.bildirim-balon--hata { background: var(--renk-hata); }
.bildirim-balon--basari { background: var(--renk-basari); }

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

.sertifika-sonuc dl { display: grid; grid-template-columns: 130px 1fr; gap: 10px 16px; margin-top: 18px; }
.sertifika-sonuc dt { color: var(--renk-metin-2); font-size: 14px; }
.sertifika-sonuc dd { margin: 0; color: var(--renk-metin-3); font-weight: var(--agirlik-orta); }


/* ==========================================================================
   Orijinal siteden eklenen bolumler
   ========================================================================== */

/* ---------------------------------------------------------------- ust bar */

.alt__sosyal { display: flex; gap: 14px; margin-top: 14px; font-size: 13px; }

/* ---------------------------------------------------------------- duyuru bandi
   Kurallari `ust-kahraman.css` icinde (Elementor olculeriyle). Burada
   ikinci bir tanim daha vardi ve catisiyordu. */

}

/* ---------------------------------------------------------------- kurs karti ek */

.kurs-karti__ust {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
}
.kurs-karti__kategori {
  display: inline-block;
  padding: 3px 9px;
  background: var(--renk-bolum-zemin);
  color: var(--renk-mor);
  border-radius: var(--yuvarlak-tam);
  font-weight: var(--agirlik-orta);
}
.kurs-karti__egitmen { font-size: 12px; color: var(--renk-metin-2); margin: 0; }
.kurs-karti__egitmen strong { color: var(--renk-metin-3); font-weight: var(--agirlik-orta); }
.urun-karti__ozet { font-size: 13px; color: var(--renk-metin-2); margin: 0; }
.urun-karti__alt { margin-top: auto; padding-top: 12px; }

/* ---------------------------------------------------------------- tanitim */

.tanitim {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 40px;
  flex-wrap: wrap;
}
.tanitim__kutu {
  display: flex;
  flex-direction: column;
  padding: 26px 40px;
  text-align: center;
}
.tanitim__kutu strong { font-size: 34px; color: var(--renk-mor); line-height: 1.1; }
.tanitim__kutu span { color: var(--renk-metin-2); font-size: 14px; }

/* ---------------------------------------------------------------- kamp / yapay zeka */

.kamp {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
}
.kamp__maddeler { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.kamp__maddeler li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  font-weight: var(--agirlik-orta);
  color: var(--renk-metin-3);
}
.kamp__maddeler li span { color: var(--renk-turuncu); }

.tik-listesi--iki { grid-template-columns: 1fr 1fr; }

@media (max-width: 1024px) {
  .kamp { grid-template-columns: 1fr; }
  .tik-listesi--iki { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------- urun detay ek */

.urun-detay__puan { font-size: 14px; color: var(--renk-turuncu); margin: 0 0 10px; }
.urun-detay__ozet { margin-bottom: 8px; }
.urun-detay__rozetler {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  list-style: none;
  margin: 22px 0 0;
  padding: 18px 0 0;
  border-top: 1px solid var(--renk-kenar);
  font-size: 13px;
  color: var(--renk-metin-2);
}
.urun-detay__rozetler li::before { content: "✓ "; color: var(--renk-basari); font-weight: 600; }

.nitelik-tablo { width: 100%; border-collapse: collapse; }
.nitelik-tablo th,
.nitelik-tablo td {
  padding: 12px 16px;
  text-align: left;
  border-bottom: 1px solid var(--renk-bolum-zemin);
  vertical-align: top;
}
.nitelik-tablo th {
  width: 220px;
  font-weight: var(--agirlik-orta);
  color: var(--renk-metin-3);
  background: var(--renk-bolum-zemin);
}

.bilgi-listesi { margin: 18px 0 0; }
.bilgi-listesi dt {
  font-weight: var(--agirlik-kalin);
  color: var(--renk-metin-3);
  margin-top: 16px;
}
.bilgi-listesi dd { margin: 4px 0 0; }

.yorum-satir { padding: 18px 0; border-bottom: 1px solid var(--renk-bolum-zemin); }
.yorum-satir__ust { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.yorum-satir__puan { color: var(--renk-turuncu); letter-spacing: 1px; }

@media (max-width: 767px) {
  .nitelik-tablo th { width: auto; }
  .nitelik-tablo th, .nitelik-tablo td { display: block; }
}

/* --------------------------------------------------------------------------
 * Kurs detay: istek listesi, paylasim, egitmen, degerlendirmeler
 * -------------------------------------------------------------------------- */

.kurs-eylemler {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 20px 0 28px;
}

.kurs-eylemler__istek { display: inline-flex; align-items: center; gap: 8px; }
.kurs-eylemler__kalp { font-size: 1.15em; line-height: 1; }
.kurs-eylemler__istek[aria-pressed="true"] { border-color: var(--renk-mor); }
.kurs-eylemler__istek[aria-pressed="true"] .kurs-eylemler__kalp { color: var(--renk-mor); }

.paylas { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.paylas__etiket { font-size: 0.85rem; color: var(--renk-metin-2); }

.paylas__bag {
  font-size: 0.85rem;
  padding: 5px 12px;
  border: 1px solid var(--renk-kenar);
  border-radius: 999px;
  text-decoration: none;
  transition: border-color 0.15s ease, color 0.15s ease;
}

.paylas__bag:hover, .paylas__bag:focus-visible {
  border-color: var(--renk-mor);
  color: var(--renk-mor);
}

/* --- Egitmen --- */
.egitmen__ic { display: flex; gap: 16px; align-items: flex-start; }
.egitmen__resim { border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.egitmen__ad { display: block; font-size: 1.05rem; }
.egitmen__unvan { display: block; font-size: 0.9rem; color: var(--renk-metin-2); }
.egitmen__bio { margin-top: 8px; }

/* --- Puan ozeti --- */
.yildiz { color: #f0a500; letter-spacing: 1px; white-space: nowrap; }

.puan-ozet {
  display: grid;
  grid-template-columns: minmax(140px, 200px) 1fr;
  gap: 24px;
  align-items: center;
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--renk-kenar);
}

.puan-ozet__sayi { text-align: center; }
.puan-ozet__sayi strong { display: block; font-size: 2.6rem; line-height: 1.1; }
.puan-ozet__dagilim { display: grid; gap: 6px; }

.puan-satir {
  display: grid;
  grid-template-columns: 52px 1fr 32px;
  align-items: center;
  gap: 10px;
}

.puan-satir__ad { font-size: 0.85rem; white-space: nowrap; }
.puan-satir__ad span { color: #f0a500; }

.puan-satir__cubuk {
  height: 8px;
  border-radius: 999px;
  background: var(--renk-kenar);
  overflow: hidden;
}

.puan-satir__cubuk > span { display: block; height: 100%; background: #f0a500; }

/* --- Yorumlar --- */
.yorumlar { display: grid; gap: 18px; }
.yorum { padding-bottom: 18px; border-bottom: 1px solid var(--renk-kenar); }
.yorum:last-child { border-bottom: 0; padding-bottom: 0; }

.yorum__ust {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}

@media (max-width: 767px) {
  .kurs-eylemler { flex-direction: column; align-items: stretch; }
  .puan-ozet { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
 * Mufredat basliklari (orijinalde konu h4, ders h5)
 * -------------------------------------------------------------------------- */

.mufredat__baslik {
  display: flex;
  flex: 1;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
}

.mufredat__baslik small { font-weight: 400; color: var(--renk-metin-2); }

.mufredat__ad {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 400;
}

.mufredat__ad a { text-decoration: none; }
.mufredat__ad a:hover { text-decoration: underline; }

/* --------------------------------------------------------------------------
 * Urun degerlendirme formu
 * -------------------------------------------------------------------------- */

.yorum-formu {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid var(--renk-kenar);
}

.yorum-formu label { display: block; margin-bottom: 6px; font-weight: 600; }
.yorum-formu textarea { width: 100%; }
.yorum-formu__not { margin-top: 12px; color: var(--renk-metin-2); }
.zorunlu { color: var(--renk-hata); }
.yorum__dogrulama { font-size: 0.85rem; color: var(--renk-metin-2); }

.yildiz-secim { border: 0; padding: 0; margin: 0 0 16px; }
.yildiz-secim legend { font-weight: 600; margin-bottom: 8px; }
.yildiz-secim__oge { display: inline-flex; align-items: center; gap: 4px; margin-right: 14px; }
.yildiz-secim__oge input { margin: 0; }

/* --------------------------------------------------------------------------
 * Iletisim sayfasi
 * -------------------------------------------------------------------------- */

.iletisim {
  display: grid;
  grid-template-columns: minmax(260px, 340px) 1fr;
  gap: 24px;
  align-items: start;
}

.iletisim__kanallar { display: grid; gap: 16px; }
.iletisim__kart h2 { margin: 0 0 6px; font-size: 1rem; }
.iletisim__kart p { margin: 0; }
.iletisim__form-kart h2 { margin-top: 0; font-size: 1.15rem; }
.iletisim__form-kart label { display: block; margin-bottom: 6px; font-weight: 600; }

.iletisim__form-kart input,
.iletisim__form-kart textarea { width: 100%; }

.iletisim__politika { margin-top: 14px; color: var(--renk-metin-2); }
.sade-liste { list-style: none; margin: 0; padding: 0; }

@media (max-width: 900px) {
  .iletisim { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
 * Yonetim paneli
 * -------------------------------------------------------------------------- */

.panel--genis { grid-template-columns: 220px 1fr; }

.panel__menu a { display: flex; align-items: center; justify-content: space-between; gap: 8px; }

.panel__rozet {
  min-width: 20px;
  padding: 1px 6px;
  border-radius: 999px;
  background: var(--renk-turuncu);
  color: var(--renk-beyaz);
  font-size: 0.75rem;
  text-align: center;
}

/* --- Ozet kartlari --- */
.ozet-izgara {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 12px;
  margin-bottom: 28px;
}

.ozet-kart {
  display: block;
  padding: 14px 16px;
  border: 1px solid var(--renk-kenar);
  border-radius: 10px;
  background: var(--renk-kart-zemin);
  text-decoration: none;
  color: inherit;
}

.ozet-kart strong { display: block; font-size: 1.6rem; line-height: 1.2; }
.ozet-kart span { font-size: 0.85rem; color: var(--renk-metin-2); }
a.ozet-kart:hover { border-color: var(--renk-mor); }

/* Bekleyen is varsa dikkat cek; sifirsa sakin dursun */
.ozet-kart--dikkat strong { color: var(--renk-turuncu); }
.ozet-kart--dikkat:not(:has(strong:not(:empty))) strong { color: inherit; }

/* --- Veri tablosu --- */
.veri-tablo { width: 100%; border-collapse: collapse; margin-bottom: 20px; }

.veri-tablo th, .veri-tablo td {
  padding: 9px 10px;
  border-bottom: 1px solid var(--renk-kenar);
  text-align: left;
  vertical-align: top;
}

.veri-tablo th { font-size: 0.82rem; color: var(--renk-metin-2); font-weight: 600; }
.veri-tablo .sag { text-align: right; }
.veri-tablo tbody tr:hover { background: var(--renk-bolum-zemin); }
.veri-tablo tfoot td { border-bottom: 0; }
.veri-tablo--duzenlenebilir input,
.veri-tablo--duzenlenebilir select { width: 100%; max-width: 110px; padding: 4px 6px; }

.soluk { color: var(--renk-metin-2); }

.bag-dugme {
  padding: 0;
  border: 0;
  background: none;
  color: var(--renk-mor);
  font: inherit;
  cursor: pointer;
  text-decoration: underline;
}

/* --- Durum rozetleri --- */
.durum {
  display: inline-block;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 0.78rem;
  white-space: nowrap;
  background: var(--renk-kenar);
}

.durum--completed { background: #DCFAE6; color: #067647; }
.durum--shipped   { background: #E0F2FE; color: #026AA2; }
.durum--pending,
.durum--on_hold   { background: #FEF0C7; color: #B54708; }
.durum--cancelled,
.durum--failed    { background: #FEE4E2; color: #B42318; }
.durum--refunded  { background: #F4EBFF; color: #6941C6; }

/* --- Suzgec seridi --- */
.suzgec {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  padding: 12px;
  border: 1px solid var(--renk-kenar);
  border-radius: 10px;
  background: var(--renk-bolum-zemin);
}

.suzgec input[type="search"] { flex: 1 1 220px; }
.suzgec .onay { margin: 0; white-space: nowrap; }

/* --- Sayfalama --- */
.sayfalama {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 18px 0;
}

.sayfalama__dugme {
  padding: 6px 14px;
  border: 1px solid var(--renk-kenar);
  border-radius: 8px;
  background: var(--renk-beyaz);
  cursor: pointer;
  font: inherit;
}

.sayfalama__dugme:hover { border-color: var(--renk-mor); }
.sayfalama__pasif { padding: 6px 14px; color: var(--renk-metin-2); }
.sayfalama__bilgi { font-size: 0.85rem; color: var(--renk-metin-2); }

/* --- Siparis detayi --- */
.siparis-detay { margin-top: 24px; padding: 20px; }
.siparis-detay__ust { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.siparis-detay__ust h2 { margin: 0; }

.siparis-detay__adresler {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
  margin: 18px 0;
}

.siparis-detay__adresler h4 { margin: 0 0 6px; font-size: 0.9rem; }

.kargo-form, .durum-form {
  margin-top: 20px;
  padding: 16px;
  border: 1px solid var(--renk-kenar);
  border-radius: 10px;
  background: var(--renk-bolum-zemin);
}

.kargo-form h3, .durum-form h3 { margin: 0 0 12px; font-size: 1rem; }
.kargo-form__alanlar { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.kargo-form__alanlar label { display: grid; gap: 4px; flex: 1 1 180px; }
.kargo-form__alanlar span { font-size: 0.85rem; font-weight: 600; }
.kargo-form .kucuk { margin: 10px 0 0; }
.durum-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.durum-form h3 { width: 100%; margin-bottom: 0; }

.not-listesi { list-style: none; padding: 0; display: grid; gap: 8px; }
.not-listesi li { padding: 8px 10px; border-left: 3px solid var(--renk-kenar); }

/* --- Yorum moderasyonu --- */
.yorum-moderasyon { display: grid; gap: 14px; }
.yorum-kart { padding: 16px; }

.yorum-kart__ust {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}

.yorum-kart__yazan { margin: 0 0 8px; font-size: 0.85rem; color: var(--renk-metin-2); }
.yorum-kart__eylem { display: flex; gap: 8px; margin-top: 12px; }

.etiket {
  padding: 2px 8px;
  border-radius: 6px;
  background: var(--renk-kenar);
  font-size: 0.75rem;
}

/* --- Mesajlar --- */
.mesaj-listesi { display: grid; gap: 14px; }
.mesaj-kart { padding: 16px; }
.mesaj-kart--yeni { border-left: 3px solid var(--renk-turuncu); }
.mesaj-kart__ust { display: flex; flex-wrap: wrap; gap: 12px; align-items: baseline; }
.mesaj-kart__metin { white-space: pre-wrap; }

.buton--kucuk { padding: 4px 12px; font-size: 0.85rem; }
.buton--tehlike { border-color: var(--renk-hata); color: var(--renk-hata); }
.buton--tehlike:hover { background: var(--renk-hata); color: var(--renk-beyaz); }

/* --------------------------------------------------------------------------
 * Yonetim paneli — ortak parcalar
 *
 * Bunlarin bir kismi (baslik seridi, detay kutusu, eylem seridi) siparis
 * detayinda da kullaniliyordu ama tanimsizdi; artik hepsi burada.
 * -------------------------------------------------------------------------- */

.panel__baslik {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.panel__baslik h1 { margin: 0; }

.eylemler { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

.detay-kutu {
  margin-top: 22px;
  padding: 20px;
  border: 1px solid var(--renk-kenar);
  border-radius: 10px;
  background: var(--renk-kart-zemin);
}

.detay-kutu h2 { margin-top: 0; }
.detay-kutu h3 { margin: 22px 0 8px; font-size: 1rem; }

.detay-liste {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 6px 18px;
  margin: 0 0 18px;
  font-size: 0.9rem;
}

.detay-liste dt { color: var(--renk-metin-2); }
.detay-liste dd { margin: 0; }

.uyari-kutu {
  padding: 12px 14px;
  border-left: 3px solid var(--renk-turuncu);
  border-radius: 0 8px 8px 0;
  background: var(--renk-bolum-zemin);
  font-size: 0.9rem;
}

.log-kutu {
  max-height: 220px;
  overflow: auto;
  padding: 12px;
  border: 1px solid var(--renk-kenar);
  border-radius: 8px;
  background: var(--renk-bolum-zemin);
  font-size: 0.82rem;
  line-height: 1.6;
  white-space: pre-wrap;
}

/* Ikincil eylem — cerceveli ama vurgusuz */
.buton--sade {
  background: transparent;
  border-color: var(--renk-kenar);
  color: var(--renk-metin);
}

.buton--sade:hover { border-color: var(--renk-mor); color: var(--renk-mor); }

.rozet--uyari { background: #FEF0C7; color: #B54708; }

/* Fatura durumlari — siparis durumlariyla ayni dil */
.durum--issued   { background: #DCFAE6; color: #067647; }
.durum--returned { background: #F4EBFF; color: #6941C6; }

/* --- Analiz --- */

.aralik-secim { display: flex; gap: 6px; }
.aralik-secim .aktif { border-color: var(--renk-mor); color: var(--renk-mor); }

.ozet-kart .artis { font-size: 0.8rem; color: #067647; }
.ozet-kart .azalis { font-size: 0.8rem; color: #B42318; }

.grafik { margin: 0 0 28px; }

.grafik svg {
  width: 100%;
  height: 200px;
  overflow: visible;
}

.grafik__alan { fill: var(--renk-mor); opacity: 0.12; }

.grafik__cizgi {
  fill: none;
  stroke: var(--renk-mor);
  stroke-width: 2;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.grafik figcaption {
  display: flex;
  justify-content: space-between;
  margin-top: 6px;
  font-size: 0.8rem;
  color: var(--renk-metin-2);
}


/* --- Kargonomi paneli (siparis detayi) --- */
.kargonomi {
  margin: 22px 0;
  padding: 16px 18px;
  border: 1px solid var(--renk-kenar);
  border-radius: 10px;
  background: var(--renk-bolum-zemin);
}

.kargonomi h3 { margin: 0 0 12px; font-size: 1rem; }
.kargonomi .detay-liste { margin-bottom: 14px; }
.kargonomi details { margin-top: 14px; font-size: 0.85rem; }
.kargonomi summary { cursor: pointer; color: var(--renk-metin-2); }

/* --------------------------------------------------------------------------
 * Pencere (pop-up) — siparis detayi sayfayi terk etmeden acilir
 * -------------------------------------------------------------------------- */

.pencere {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 24px 16px;
  overflow-y: auto;
}

.pencere__zemin {
  position: fixed;
  inset: 0;
  background: rgba(20, 22, 32, 0.55);
}

.pencere__kutu {
  position: relative;
  width: min(1100px, 100%);
  margin: auto;
  border-radius: 12px;
  background: var(--renk-kart-zemin);
  box-shadow: 0 24px 60px -20px rgba(0, 0, 0, 0.5);
  outline: none;
}

.pencere__ust {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 22px;
  border-bottom: 1px solid var(--renk-kenar);
  position: sticky;
  top: 0;
  background: var(--renk-kart-zemin);
  border-radius: 12px 12px 0 0;
  z-index: 1;
}

.pencere__ust h2 { margin: 0; font-size: 1.15rem; }

.pencere__kapat {
  border: 0;
  background: none;
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
  color: var(--renk-metin-2);
  padding: 0 4px;
}

.pencere__kapat:hover { color: var(--renk-hata); }
.pencere__govde { padding: 22px; }

/* Arka plan kaymasin */
body.pencere-acik { overflow: hidden; }

/* --- Panel kutusu: WordPress metabox karsiligi --- */
.kutu-panel {
  margin: 0 0 18px;
  padding: 16px 18px;
  border: 1px solid var(--renk-kenar);
  border-radius: 10px;
  background: var(--renk-kart-zemin);
}

.kutu-panel > h3 {
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--renk-kenar);
  font-size: 0.95rem;
}

.kutu-panel textarea,
.kutu-panel input[type="text"],
.kutu-panel input[type="number"],
.kutu-panel select { width: 100%; }

/* --- Siparis detayi: iki sutun (WooCommerce yerlesimi) --- */
.siparis-duzen {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 20px;
  align-items: start;
}

.siparis-duzen__yan { position: sticky; top: 80px; }

.siparis-ust-bilgi {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  align-items: center;
  margin: 0 0 14px;
  font-size: 0.9rem;
  color: var(--renk-metin-2);
}

.musteri-notu {
  margin: 12px 0 0;
  padding: 10px 12px;
  border-left: 3px solid var(--renk-turuncu);
  background: var(--renk-bolum-zemin);
  font-size: 0.9rem;
}

.not-form { display: grid; gap: 8px; margin-top: 12px; }
.not-form textarea { resize: vertical; }

/* --------------------------------------------------------------------------
 * e-Fatura kutulari
 * -------------------------------------------------------------------------- */

.ef-rozet {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 3px;
  font-size: 0.8rem;
  font-weight: 600;
}

.ef-rozet--tamam { background: #d5f5e3; color: #1e7e34; }
.ef-rozet--iptal  { background: #fef3cd; color: #8a6d00; }
.ef-rozet--hata   { background: #fdecea; color: #b02a37; }
.ef-rozet--yok    { background: #eef; color: #334; font-weight: 400; }

.efatura-kutu p { margin: .3em 0; font-size: 0.85rem; }
.efatura-kutu .ef-uuid { word-break: break-all; }

.ef-uyari {
  margin: 10px 0;
  padding: 8px 10px;
  background: #fff8e5;
  border-left: 3px solid #d9a406;
  color: #6b5200;
  font-size: 0.82rem;
  line-height: 1.5;
}

.ef-not {
  margin: 8px 0;
  padding: 8px 10px;
  background: var(--renk-bolum-zemin);
  border-left: 3px solid #888;
  color: var(--renk-metin-2);
  font-size: 0.82rem;
  line-height: 1.5;
}

.ef-hata { color: #b02a37; word-break: break-word; }

.ef-iade-bilgi {
  margin: 0 0 12px;
  padding: 8px 10px;
  background: #fdecea;
  border-left: 3px solid #c0392b;
  color: #7b241c;
  font-size: 0.85rem;
}

.ef-ettn {
  color: var(--renk-metin-2);
  font-size: 0.72rem;
  word-break: break-all;
}

.kalem-tablo .dar { width: 36px; }
.kalem-tablo input[type="number"] { width: 72px; }
.kalem-tablo .iade-adet { color: #b02a37; }

/* "Siparişi iade et" kutusu (WooCommerce iade akisi, 2026-09-26) */
.iade-adet { color: #b02a37; }
.alan--kutu { display: flex; align-items: center; gap: 8px; margin: 12px 0; font-size: 0.9rem; }
.iade-kutu .alan { display: block; margin: 12px 0; }
.iade-kutu .alan input[type="text"] { width: 100%; }
.iade-ozet {
  width: 100%; max-width: 380px; margin: 12px 0 12px auto;
  border-collapse: collapse; font-size: 0.9rem;
}
.iade-ozet td { padding: 4px 0; }
.iade-ozet .sag { text-align: right; }
.iade-ozet tr:last-child td { border-top: 1px solid var(--renk-kenar); padding-top: 8px; }
.iade-gecmis {
  list-style: none; margin: 16px 0 0; padding: 12px 0 0;
  border-top: 1px dashed var(--renk-kenar); font-size: 0.88rem;
}
.iade-gecmis li + li { margin-top: 10px; }

/* Eklentideki `subsubsub` filtre seridi */
.alt-sekmeler {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
  margin: 14px 0 18px;
  padding: 0;
  list-style: none;
  font-size: 0.88rem;
}

.alt-sekmeler button {
  border: 0;
  background: none;
  padding: 0;
  cursor: pointer;
  color: var(--renk-mor);
  font: inherit;
}

.alt-sekmeler li + li::before {
  content: "|";
  color: var(--renk-kenar);
  margin-right: 14px;
}

.alt-sekmeler .current { color: var(--renk-metin); font-weight: 600; }

/* --------------------------------------------------------------------------
 * Urun duzenleme — WooCommerce urun ekraninin yerlesimi
 * -------------------------------------------------------------------------- */

.urun-duzen {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 20px;
  align-items: start;
}

.urun-duzen__yan { position: sticky; top: 80px; }

.urun-duzen__baslik { margin-bottom: 18px; }

.urun-duzen__baslik input[name="ad"] {
  width: 100%;
  padding: 10px 12px;
  font-size: 1.25rem;
  font-weight: 600;
}

.kalici-bag {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 8px 0 0;
  font-size: 0.82rem;
  color: var(--renk-metin-2);
}

.kalici-bag input { flex: 1 1 180px; padding: 3px 6px; font-size: 0.82rem; }

/* --- Sekmeli "Ürün verisi" kutusu --- */
.urun-veri__ust {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 18px;
  margin: 0 0 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--renk-kenar);
}

.urun-veri__ust h3 {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 0.95rem;
  margin-right: auto;
}

.urun-veri__govde {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  border: 1px solid var(--renk-kenar);
  border-radius: 8px;
  overflow: hidden;
}

.urun-veri__sekmeler {
  margin: 0;
  padding: 0;
  list-style: none;
  background: var(--renk-bolum-zemin);
  border-right: 1px solid var(--renk-kenar);
}

.urun-veri__sekmeler button {
  display: block;
  width: 100%;
  padding: 10px 14px;
  border: 0;
  border-bottom: 1px solid var(--renk-kenar);
  background: none;
  text-align: left;
  cursor: pointer;
  font: inherit;
  font-size: 0.88rem;
  color: var(--renk-metin-2);
}

.urun-veri__sekmeler button:hover { color: var(--renk-mor); }

.urun-veri__sekmeler .aktif {
  background: var(--renk-kart-zemin);
  color: var(--renk-metin);
  font-weight: 600;
  border-right: 2px solid var(--renk-mor);
  margin-right: -1px;
}

.urun-veri__panel { padding: 16px 18px; }

.urun-veri__panel > div {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px 18px;
}

.urun-veri__panel .alan { margin: 0; }
.urun-veri__panel .alan--genis { grid-column: 1 / -1; }

.olcu-satiri { display: flex; gap: 8px; }
.olcu-satiri input { min-width: 0; }

/* --- Yan sutun kutulari --- */
.gorsel-kutu {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 140px;
  margin-bottom: 10px;
  border: 1px dashed var(--renk-kenar);
  border-radius: 8px;
  background: var(--renk-bolum-zemin);
  overflow: hidden;
}

.gorsel-kutu img { max-width: 100%; max-height: 180px; display: block; }
.gorsel-kutu__bos { color: var(--renk-metin-2); font-size: 0.85rem; }

.galeri-izgara {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(64px, 1fr));
  gap: 6px;
  min-height: 72px;
  margin-bottom: 10px;
  padding: 6px;
  border: 1px dashed var(--renk-kenar);
  border-radius: 8px;
  background: var(--renk-bolum-zemin);
  align-content: start;
}

.galeri-izgara img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 4px;
}

.galeri-izgara .gorsel-kutu__bos { grid-column: 1 / -1; align-self: center; text-align: center; }

.yayinla-eylemler {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--renk-kenar);
}

.tehlike-bag { color: var(--renk-hata); margin-left: auto; }

/* --------------------------------------------------------------------------
 * Kurs duzenleme — mufredat, alan izgarasi, ogrenci secici
 * -------------------------------------------------------------------------- */

.alan-izgara {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px 18px;
}

.alan-izgara .alan { margin: 0; }
.alan-izgara .alan--genis { grid-column: 1 / -1; }

.alt-baslik {
  margin: 22px 0 10px;
  padding-top: 14px;
  border-top: 1px solid var(--renk-kenar);
  font-size: 0.9rem;
  color: var(--renk-metin-2);
}

/* --- Mufredat (Tutor "Course Builder") --- */

.konu {
  margin: 0 0 12px;
  border: 1px solid var(--renk-kenar);
  border-radius: 8px;
  background: var(--renk-bolum-zemin);
  overflow: hidden;
}

.konu__ust {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  background: var(--renk-kart-zemin);
  border-bottom: 1px solid var(--renk-kenar);
}

.konu__tut { color: var(--renk-metin-2); cursor: grab; user-select: none; }
.konu__eylem { display: flex; gap: 6px; margin-left: auto; flex-wrap: wrap; }
.konu__ozet { margin: 8px 12px; font-size: 0.85rem; color: var(--renk-metin-2); }
.konu__bos { margin: 10px 12px; }

.ders-listesi {
  margin: 0;
  padding: 6px 12px 10px 34px;
  font-size: 0.9rem;
}

.ders-listesi li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 5px 0;
  border-bottom: 1px dashed var(--renk-kenar);
}

.ders-listesi li:last-child { border-bottom: 0; }
.ders__ad { flex: 1 1 200px; }
.ders__eylem { display: flex; gap: 10px; }

/* --- Manuel kayit: kullanici secici --- */

.ogrenci-ekle { display: grid; gap: 10px; max-width: 460px; }

.oneri-listesi {
  display: grid;
  max-height: 220px;
  overflow-y: auto;
  border: 1px solid var(--renk-kenar);
  border-radius: 8px;
  background: var(--renk-kart-zemin);
}

.oneri-listesi button {
  padding: 8px 12px;
  border: 0;
  border-bottom: 1px solid var(--renk-kenar);
  background: none;
  text-align: left;
  cursor: pointer;
  font: inherit;
}

.oneri-listesi button:last-child { border-bottom: 0; }
.oneri-listesi button:hover { background: var(--renk-bolum-zemin); }
.oneri-listesi p { margin: 0; padding: 10px 12px; }

.secili-kullanici {
  margin: 0;
  padding: 8px 12px;
  border-radius: 6px;
  background: #DCFAE6;
  color: #067647;
  font-size: 0.88rem;
}

@media (max-width: 1000px) {
  .siparis-duzen,
  .urun-duzen { grid-template-columns: 1fr; }
  .siparis-duzen__yan,
  .urun-duzen__yan { position: static; }
  .urun-veri__govde { grid-template-columns: 1fr; }
  .urun-veri__sekmeler {
    display: flex;
    overflow-x: auto;
    border-right: 0;
    border-bottom: 1px solid var(--renk-kenar);
  }
  .urun-veri__sekmeler button { white-space: nowrap; border-bottom: 0; }
  .urun-veri__sekmeler .aktif { border-right: 0; border-bottom: 2px solid var(--renk-mor); }
}

@media (max-width: 900px) {
  .panel--genis { grid-template-columns: 1fr; }
  .veri-tablo { display: block; overflow-x: auto; white-space: nowrap; }
  .urun-formu fieldset { grid-template-columns: 1fr; }
  .detay-liste { grid-template-columns: 1fr; gap: 2px 0; }
  .detay-liste dt { margin-top: 8px; }
  .panel__baslik { align-items: flex-start; flex-direction: column; }
}

/* --------------------------------------------------------------------------
 * Kahraman: video kapagi ve ozellik karti (orijinal duzen)
 * -------------------------------------------------------------------------- */

.kahraman__eylem { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.kahraman__simge { width: 120px; height: auto; }
.kahraman__yan { display: grid; gap: 20px; align-content: start; }

.video-kapak {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 14px;
  overflow: hidden;
  background: var(--renk-ana);
  cursor: pointer;
  line-height: 0;
}

.video-kapak img { width: 100%; height: auto; display: block; }

.video-kapak__oynat {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  transition: transform 0.18s ease;
}

.video-kapak:hover .video-kapak__oynat,
.video-kapak:focus-visible .video-kapak__oynat { transform: scale(1.08); }

.video-kutu {
  position: relative;
  aspect-ratio: 16 / 9;
  border-radius: 14px;
  overflow: hidden;
  background: #000;
}

.video-cerceve, .video-kutu iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Rozet karti — orijinalde videonun altinda beyaz bir kutuydu */
.kahraman__rozetler {
  list-style: none;
  margin: 0;
  padding: 20px 22px;
  display: grid;
  gap: 12px;
  border: 1px solid var(--renk-kenar);
  border-radius: 14px;
  background: var(--renk-kart-zemin);
}

.kahraman__rozetler li {
  position: relative;
  padding-left: 28px;
  font-size: 0.95rem;
}

.kahraman__rozetler li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  width: 19px;
  height: 19px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--renk-mor);
  color: var(--renk-beyaz);
  font-size: 0.7rem;
}

/* --------------------------------------------------------------------------
 * Sahiplik durumu (kursa kayitli kullanici)
 * -------------------------------------------------------------------------- */

.kurs-karti__sahip, .urun-detay__sahip {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 10px;
  color: var(--renk-basari);
  font-weight: 600;
  font-size: 0.9rem;
}


/* --------------------------------------------------------------------------
 * Iletisim sayfasi
 * -------------------------------------------------------------------------- */

.kanal-izgara {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 18px;
  margin-bottom: 32px;
}

.kanal {
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: 26px 20px;
  border: 1px solid var(--renk-kenar);
  border-radius: 14px;
  background: var(--renk-kart-zemin);
  text-align: center;
  text-decoration: none;
  color: inherit;
  transition: border-color 0.16s ease, transform 0.16s ease;
}

.kanal:hover, .kanal:focus-visible {
  border-color: var(--renk-mor);
  transform: translateY(-2px);
}

.kanal__ikon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--renk-bolum-zemin);
  color: var(--renk-mor);
}

.kanal h3 { margin: 0; font-size: 1rem; }
.kanal p { margin: 0; color: var(--renk-metin-2); }

.iletisim {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: start;
}

.iletisim__harita { min-height: 435px; display: grid; }

.harita-kapak, .harita-cerceve {
  width: 100%;
  min-height: 435px;
  border: 1px solid var(--renk-kenar);
  border-radius: 14px;
}

.harita-kapak {
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 10px;
  padding: 24px;
  background: var(--renk-bolum-zemin);
  color: var(--renk-metin-3);
  cursor: pointer;
  font: inherit;
  text-align: center;
}

.harita-kapak:hover, .harita-kapak:focus-visible { border-color: var(--renk-mor); }
.harita-kapak__ikon { color: var(--renk-mor); }
.harita-kapak__metin { font-weight: 600; }
.harita-kapak__ipucu { font-size: 0.85rem; color: var(--renk-metin-2); }
.harita-cerceve { display: block; }

.iletisim__form-kart { padding: 26px; }
.iletisim__form-kart h2 { margin: 0 0 18px; font-size: 1.15rem; }
.iletisim__saatler { margin: 0 0 6px; font-size: 0.95rem; color: var(--renk-mor); }
.iletisim__form-kart .alan { margin-bottom: 14px; }
.iletisim__form-kart label { display: block; margin-bottom: 6px; font-weight: 600; }
.iletisim__form-kart input, .iletisim__form-kart textarea { width: 100%; }
.iletisim__form-kart .onay { display: flex; gap: 8px; margin: 14px 0; font-weight: 400; }
.iletisim__form-kart .onay input { width: auto; margin-top: 3px; }

/* --------------------------------------------------------------------------
 * Hakkimizda — dikey sekmeler
 * -------------------------------------------------------------------------- */

.sekmeler--dikey {
  display: grid;
  grid-template-columns: 250px 1fr;
  gap: 24px;
  align-items: start;
}

.sekmeler--dikey .sekmeler__basliklar {
  display: grid;
  gap: 6px;
  border: 0;
  position: sticky;
  top: 90px;
}

.sekmeler--dikey .sekmeler__basliklar button {
  padding: 11px 15px;
  border: 1px solid var(--renk-kenar);
  border-radius: 10px;
  background: var(--renk-kart-zemin);
  text-align: left;
  cursor: pointer;
  font: inherit;
}

.sekmeler--dikey .sekmeler__basliklar button[aria-selected="true"] {
  border-color: var(--renk-mor);
  background: var(--renk-mor);
  color: var(--renk-beyaz);
}

.sekmeler--dikey .sekmeler__govde {
  padding: 26px 28px;
  border: 1px solid var(--renk-kenar);
  border-radius: 14px;
  background: var(--renk-kart-zemin);
}

.sekmeler--dikey .sekmeler__govde h2 { margin-top: 0; }

@media (max-width: 900px) {
  .iletisim { grid-template-columns: 1fr; }
  .sekmeler--dikey { grid-template-columns: 1fr; }
  .sekmeler--dikey .sekmeler__basliklar { position: static; }
  .kahraman__eylem { gap: 14px; }
  .kahraman__simge { width: 84px; }
}

/* Arama sonuclari */
.sonuc-listesi { list-style: none; padding: 0; display: grid; gap: 14px; }

.sonuc-listesi li {
  padding: 14px 16px;
  border: 1px solid var(--renk-kenar);
  border-radius: 10px;
  background: var(--renk-kart-zemin);
}

.sonuc-listesi a { font-weight: 600; }
.sonuc-listesi p { margin: 4px 0 0; }

/* --------------------------------------------------------------------------
 * Sinav
 * -------------------------------------------------------------------------- */

.sinav-tanitim, .sinav, .sinav-sonuc { padding: 26px 28px; }
.sinav__ust { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.sinav__ust h1 { margin: 0; }

.sinav-sayac {
  padding: 6px 14px;
  border-radius: 999px;
  background: var(--renk-bolum-zemin);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}

.sinav-sayac--az { background: var(--renk-hata); color: var(--renk-beyaz); }

.sinav-kurallar { list-style: none; padding: 0; display: grid; gap: 8px; margin: 18px 0; }
.sinav-kurallar li { padding-left: 20px; position: relative; }
.sinav-kurallar li::before { content: "•"; position: absolute; left: 4px; color: var(--renk-mor); }

.sinav-soru {
  border: 1px solid var(--renk-kenar);
  border-radius: 12px;
  padding: 18px 20px;
  margin: 18px 0;
}

.sinav-soru legend { font-weight: 600; padding: 0 6px; }
.sinav-soru__sira { color: var(--renk-metin-2); font-weight: 400; margin-right: 8px; }

.sinav-secenek {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  margin-top: 8px;
  border: 1px solid var(--renk-kenar);
  border-radius: 9px;
  cursor: pointer;
}

.sinav-secenek:hover { border-color: var(--renk-mor); }
.sinav-secenek:has(input:checked) { border-color: var(--renk-mor); background: var(--renk-bolum-zemin); }
.sinav-acik { width: 100%; margin-top: 10px; }

.sinav-sonuc__puan {
  display: grid;
  justify-items: center;
  gap: 4px;
  padding: 22px;
  margin: 18px 0;
  border-radius: 14px;
  background: var(--renk-bolum-zemin);
}

.sinav-sonuc__puan strong { font-size: 2.6rem; line-height: 1; }
.sinav-sonuc__puan.gecti strong { color: var(--renk-basari); }
.sinav-sonuc__puan.kaldi strong { color: var(--renk-hata); }

.sinav-dokum { display: grid; gap: 10px; padding-left: 0; list-style: none; }

.sinav-dokum li {
  display: flex;
  gap: 10px;
  padding: 10px 12px;
  border-left: 3px solid var(--renk-kenar);
}

.sinav-dokum li.dogru { border-left-color: var(--renk-basari); }
.sinav-dokum li.yanlis { border-left-color: var(--renk-hata); }
.sinav-dokum li.bekliyor { border-left-color: var(--renk-uyari); }
.sinav-dokum__isaret { font-weight: 700; }
.sinav-dokum li.dogru .sinav-dokum__isaret { color: var(--renk-basari); }
.sinav-dokum li.yanlis .sinav-dokum__isaret { color: var(--renk-hata); }

/* --------------------------------------------------------------------------
 * Soru-cevap
 * -------------------------------------------------------------------------- */

/* Kapsam sekmeleri: "Bu Ders" / "Genel". Orijinal ders ekranindaki
   `tutor-nav` seridinin karsiligi — altta ince cizgi, etkin sekmede
   mor alt kenarlik. */
.qa-sekmeler {
  display: flex;
  gap: 4px;
  margin-bottom: 16px;
  border-bottom: 1px solid var(--renk-kenar);
}
.qa-sekmeler button {
  appearance: none;
  background: none;
  border: 0;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  padding: 8px 14px;
  font: inherit;
  font-weight: 600;
  font-size: 14px;
  color: var(--renk-metin-2);
  cursor: pointer;
}
.qa-sekmeler button:hover { color: var(--renk-mor); }
.qa-sekmeler button[aria-selected="true"] {
  color: var(--renk-mor);
  border-bottom-color: var(--renk-mor);
}

.qa-formu { display: grid; gap: 8px; margin-bottom: 20px; }
.qa-formu label { font-weight: 600; }
.qa-formu textarea, .qa-yanit-formu textarea { width: 100%; }
.qa-formu button, .qa-yanit-formu button { justify-self: start; }

.qa-liste { display: grid; gap: 16px; }

.qa-soru {
  padding: 16px 18px;
  border: 1px solid var(--renk-kenar);
  border-radius: 12px;
}

.qa__yazan { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 6px; }

.qa-yanit {
  margin: 12px 0 0 20px;
  padding: 12px 14px;
  border-left: 3px solid var(--renk-kenar);
  background: var(--renk-bolum-zemin);
  border-radius: 0 8px 8px 0;
}

.qa-yanit--egitmen { border-left-color: var(--renk-mor); }
.qa-yanit-formu { display: grid; gap: 8px; margin-top: 12px; }

/* --------------------------------------------------------------------------
 * Yonetim kabugu — wp-admin gibi AYRI arayuz
 *
 * Site kabugundan bagimsiz: ust bar, sol menu, genis icerik alani.
 * Sayfa `taban.html`i kullanmadigi icin buradaki kurallar yalnizca panelde
 * gecerli (`body.yonetim-govde`).
 * -------------------------------------------------------------------------- */

.yonetim-govde {
  margin: 0;
  background: var(--renk-bolum-zemin);
  min-height: 100vh;
}

/* --- Ust bar --- */
.yonetim-ust {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  height: 52px;
  padding: 0 18px;
  background: #1F2233;
  color: #fff;
}

.yonetim-ust a { color: #fff; text-decoration: none; }
.yonetim-ust a:hover { color: #C9C4FF; }

.yonetim-ust__marka {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 0.95rem;
}

.yonetim-ust__marka span {
  font-size: 0.78rem;
  opacity: 0.7;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.yonetim-ust__sag {
  display: flex;
  align-items: center;
  gap: 18px;
  font-size: 0.85rem;
}

.yonetim-ust__kullanici {
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: 0.85;
}

/* --- Duzen: sol menu + icerik --- */
.yonetim-duzen {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  align-items: start;
  min-height: calc(100vh - 52px);
}

.yonetim-yan {
  position: sticky;
  top: 52px;
  align-self: start;
  background: #2A2E45;
  min-height: calc(100vh - 52px);
}

.yonetim-yan__ac { display: none; }

.yonetim-menu { display: flex; flex-direction: column; padding: 10px 0; }

.yonetim-menu a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 16px;
  color: #C7CBE0;
  text-decoration: none;
  font-size: 0.9rem;
  border-left: 3px solid transparent;
}

.yonetim-menu a:hover { background: #343954; color: #fff; }

.yonetim-menu .aktif {
  background: #343954;
  color: #fff;
  border-left-color: var(--renk-mor);
  font-weight: 600;
}

.yonetim-menu__simge { width: 18px; text-align: center; opacity: 0.8; }
.yonetim-menu__ad { flex: 1; }

.yonetim-menu .panel__rozet {
  min-width: 20px;
  padding: 1px 6px;
  border-radius: 999px;
  background: var(--renk-turuncu);
  color: #fff;
  font-size: 0.72rem;
  text-align: center;
}

.yonetim-ana {
  padding: 24px 28px 60px;
  max-width: 1400px;
  width: 100%;
}

.yonetim-ana > h1 { margin-top: 0; }

/* Panelde site basligi olmadigi icin bildirimler sag altta */
.yonetim-govde .bildirim-alani {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 300;
}

@media (max-width: 860px) {
  .yonetim-duzen { grid-template-columns: 1fr; }

  .yonetim-yan {
    position: static;
    min-height: 0;
  }

  .yonetim-yan__ac {
    display: block;
    width: 100%;
    padding: 12px 16px;
    border: 0;
    background: #2A2E45;
    color: #fff;
    text-align: left;
    font: inherit;
    cursor: pointer;
  }

  .yonetim-menu { display: none; }
  .yonetim-menu.acik { display: flex; }
  .yonetim-ana { padding: 16px; }
}

/* --- Ayarlar ekrani --- */
.durum-izgara {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}

.durum-kutu {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--renk-kenar);
  border-radius: 10px;
  background: var(--renk-kart-zemin);
  font-size: 0.88rem;
}

.durum-nokta {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex: none;
}

.durum-nokta--acik { background: #2CAE43; }
.durum-nokta--kapali { background: #B0B4C0; }

/* ==========================================================================
   Kisiye ozel kampanya kutusu
   ==========================================================================
   Geri donen ziyaretciye gosterilen indirim bildirimi. Sag altta, sayfanin
   akisini bozmadan duruyor; mobilde tam genislige yayiliyor.

   `position: fixed` bilerek: kisi sayfanin neresinde olursa olsun gormeli,
   ama okumayi engellememeli — bu yuzden kose, ortada modal degil. Modal
   olsaydi her geri donuste okuma akisini kesen bir engel olurdu ve
   indirim sevindirmek yerine rahatsiz ederdi.
   ========================================================================== */

.kisisel-teklif {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 60;
  width: min(340px, calc(100vw - 32px));
  padding: 20px 20px 18px;
  border-radius: 16px;
  background: var(--renk-ana);
  color: var(--renk-metin-1);
  box-shadow: 0 18px 40px rgba(33, 25, 81, .35);
  border: 2px solid var(--renk-mor);
  animation: teklif-gir .35s ease-out;
}
@keyframes teklif-gir {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: none; }
}
/* Hareketi kapatmis kullaniciya animasyon gosterme */
@media (prefers-reduced-motion: reduce) {
  .kisisel-teklif { animation: none; }
}

.kisisel-teklif__kapat {
  position: absolute;
  top: 8px;
  right: 10px;
  appearance: none;
  background: none;
  border: 0;
  font-size: 22px;
  line-height: 1;
  color: var(--renk-metin-1);
  cursor: pointer;
  opacity: .7;
}
.kisisel-teklif__kapat:hover { opacity: 1; }

.kisisel-teklif__baslik {
  margin: 0 0 6px;
  font-size: 16px;
  font-weight: 700;
  color: var(--renk-beyaz);
}
.kisisel-teklif__metin { margin: 0 0 10px; font-size: 14px; }
.kisisel-teklif__metin strong { color: var(--renk-turkuaz); }

.kisisel-teklif__kod {
  margin: 0 0 12px;
  font-size: 13px;
}
.kisisel-teklif__kod code {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 6px;
  background: var(--renk-ana-acik);
  color: var(--renk-beyaz);
  font-size: 13px;
  letter-spacing: .3px;
}
.kisisel-teklif__kullan { width: 100%; }
.kisisel-teklif__sure { margin: 8px 0 0; text-align: center; opacity: .8; }

@media (max-width: 480px) {
  .kisisel-teklif { right: 16px; left: 16px; bottom: 16px; width: auto; }
}

/* ==========================================================================
   Ürün ilgisi tablosu
   ==========================================================================
   Dokuz sütunlu bir tablo telefona sığmaz. İki seçenek vardı: sütun gizlemek
   ya da yatay kaydırma. Gizlemek, tam da karşılaştırma yapmak için açılan
   ekranda veriyi saklamak olurdu — kaydırma seçildi. Kaydırılabilir olduğu
   sağ kenardaki gölgeyle belli ediliyor.
   ========================================================================== */

.tablo-kaydir {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  /* Sagda kaydirilacak icerik varken beliren golge */
  background:
    linear-gradient(to right, var(--renk-kart-zemin) 30%, transparent),
    linear-gradient(to left, var(--renk-kart-zemin) 30%, transparent) 100% 0,
    linear-gradient(to right, rgba(33, 25, 81, .12), transparent),
    linear-gradient(to left, rgba(33, 25, 81, .12), transparent) 100% 0;
  background-repeat: no-repeat;
  background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
  background-attachment: local, local, scroll, scroll;
}
.tablo-kaydir .tablo { margin: 0; min-width: 640px; }

.tablo .sayi { text-align: right; white-space: nowrap; }
.tablo .sayi .kucuk { display: block; font-weight: 400; }

/* Siralama basliklari: buton ama baslik gibi gorunuyor */
.tablo__sirala {
  appearance: none;
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  font-weight: 600;
  color: inherit;
  cursor: pointer;
  white-space: nowrap;
}
.tablo__sirala:hover { color: var(--renk-mor); }
.tablo__sirala.etkin { color: var(--renk-mor); text-decoration: underline; }
.tablo__sirala.etkin::after { content: " ▾"; }

/* Tabloda baglanti gibi davranan buton */
.baglanti-dugme {
  appearance: none;
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  color: var(--renk-mor);
  text-align: left;
  cursor: pointer;
}
.baglanti-dugme:hover { text-decoration: underline; }

/* Zirve kartlari: sayi degil URUN ADI one cikiyor */
.ozet-kart--zirve strong {
  font-size: 1.05rem;
  line-height: 1.3;
  margin-bottom: 2px;
}
.ozet-kart--zirve span { display: block; margin-bottom: 6px; }

/* --------------------------------------------------------------------------
   Hesabim: Adreslerim + siparis detayinda iade talebi (2026-09-26)
   -------------------------------------------------------------------------- */
.adres-formu { display: grid; gap: 18px; margin-top: 18px; max-width: 760px; }
.adres-kart {
  border: 1px solid var(--renk-kenar); border-radius: var(--yuvarlak);
  padding: 18px 20px 6px; background: var(--renk-beyaz);
}
.adres-kart h2 { font-size: 1.1rem; margin: 0 0 6px; }
.adres-kart > .kucuk { margin: 0 0 14px; }
.secim-grubu { border: 0; margin: 0 0 14px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; }
.secim-grubu legend { width: 100%; font-weight: 600; font-size: 14px; color: var(--renk-metin-3); margin-bottom: 6px; }
.secim-grubu .onay { margin: 0; }
.teslimat-secimi {
  margin: 18px 0 0; padding: 14px 16px 4px;
  border: 1px dashed var(--renk-kenar); border-radius: var(--yuvarlak);
}
.teslimat-secimi [data-teslimat-alanlar] { margin-top: 6px; }

.siparis-kargo { margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--renk-kenar); }
.siparis-kargo p { margin: 0 0 6px; }

.iade-bolumu h2 { margin-bottom: 14px; }
.iade-talep {
  border: 1px solid var(--renk-kenar); border-radius: var(--yuvarlak);
  padding: 14px 16px; margin-bottom: 14px;
}
.iade-talep p { margin: 0 0 8px; }
.iade-talep__ust { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 10px; }
.iade-not { padding: 10px 12px; border-radius: var(--yuvarlak-kucuk); margin: 0 0 10px; font-size: .92rem; }
.iade-not--hata { background: rgba(240, 68, 56, 0.08); color: #912018; border: 1px solid rgba(240, 68, 56, 0.25); }
.iade-vurgu {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px;
  padding: 12px 14px; margin: 0 0 10px; border-radius: var(--yuvarlak);
  background: var(--renk-bolum-zemin); border: 1px solid #DCD6FF;
}
.iade-vurgu__kod { font-size: 1.15rem; letter-spacing: .04em; color: var(--renk-ana); word-break: break-all; }
.iade-vurgu p { width: 100%; margin: 4px 0 0; }
.iade-zaman summary { cursor: pointer; font-weight: 600; font-size: .92rem; color: var(--renk-metin-3); }
.iade-zaman ol { list-style: none; margin: 10px 0 0; padding: 0 0 0 14px; border-left: 2px solid var(--renk-kenar); }
.iade-zaman li { position: relative; margin: 0 0 10px; font-size: .9rem; }
.iade-zaman li::before {
  content: ""; position: absolute; left: -20px; top: 6px; width: 10px; height: 10px;
  border-radius: 50%; background: var(--renk-mor);
}
.iade-zaman time { display: block; color: var(--renk-metin-2); font-size: .8rem; }
.iade-formu { margin-top: 6px; }
.iade-formu__kalemler { border: 1px solid var(--renk-kenar); border-radius: var(--yuvarlak); padding: 10px 14px; margin: 0 0 14px; }
.iade-formu__kalemler legend { font-weight: 600; font-size: 14px; padding: 0 6px; }
.iade-kalem { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 6px 0; }
.iade-kalem + .iade-kalem { border-top: 1px dashed var(--renk-kenar); }
.iade-kalem .onay { margin: 0; flex: 1 1 220px; }
.iade-kalem select { width: auto; margin-left: 6px; }
.iade-formu__eylem { display: flex; flex-wrap: wrap; gap: 10px; }

/* --------------------------------------------------------------------------
   Urun tanitimi (Pentrix, 2026-09-26) — pentrix.com.tr akisi: giris, video,
   ozellik bloklari (gorsel sol/sag), karsilastirma, teknik, baglantilar, SSS.
   Yalniz uzun aciklamasi `urun-tanitim` blogu olan urunlerde gorunur.
   -------------------------------------------------------------------------- */
.urun-bilgi__kisa .urun-kisa-liste {
  list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px;
}
.urun-bilgi__kisa .urun-kisa-liste li { display: inline-flex; align-items: center; gap: 6px; color: #434B5F; font-weight: 500; }
.urun-bilgi__kisa .urun-kisa-liste li::before {
  content: "✓"; display: inline-grid; place-items: center; width: 18px; height: 18px;
  border-radius: 50%; background: rgba(39, 213, 255, .18); color: #0B8FB0; font-size: 11px; font-weight: 700;
}
.urun-bilgi__video {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 14px;
  padding: 7px 16px 7px 7px; border: 1px solid var(--renk-kenar); border-radius: 999px;
  background: #FFFFFF; color: #242A3A; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer;
  transition: border-color .2s, box-shadow .2s;
}
.urun-bilgi__video:hover, .urun-bilgi__video:focus-visible { border-color: var(--renk-mor); box-shadow: 0 4px 14px -6px rgba(127, 39, 255, .45); }
.urun-bilgi__video-simge {
  display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%;
  background: var(--renk-mor); color: #FFFFFF;
}

.urun-tanitim { display: grid; gap: 56px; font-size: 15px; line-height: 1.65; color: #5B6270; }
.urun-tanitim h2 { margin: 0 0 10px; font-size: 30px; line-height: 1.2; font-weight: 600; color: #242A3A; }
.urun-tanitim h3 { margin: 0 0 10px; font-size: 21px; line-height: 1.3; font-weight: 600; color: #242A3A; }
.urun-tanitim p { margin: 0 0 12px; }
.urun-tanitim img { display: block; max-width: 100%; height: auto; }
.tanitim-ust {
  margin: 0 0 8px !important; font-size: 12.5px; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: var(--renk-mor);
}
.tanitim-alt { max-width: 680px; color: #7F858C; }
.tanitim-vurgu {
  background: linear-gradient(90deg, #27D5FF, #9F70FD); -webkit-background-clip: text;
  background-clip: text; color: transparent;
}

/* Giris bandi: koyu zemin, turkuaz vurgu */
.tanitim-giris {
  padding: 44px 28px; border-radius: 18px; text-align: center; color: #D1CCEC;
  background:
    radial-gradient(120% 90% at 85% 0%, rgba(39, 213, 255, .22) 0%, transparent 55%),
    radial-gradient(90% 80% at 0% 100%, rgba(127, 39, 255, .35) 0%, transparent 60%),
    #211951;
}
.tanitim-giris .tanitim-ust { color: #27D5FF; }
.tanitim-giris h2 { font-size: 36px; color: #FFFFFF; }
.tanitim-giris .tanitim-alt { margin: 0 auto 18px; color: #D1CCEC; }
.tanitim-rozetler, .tanitim-seritler {
  list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px;
}
.tanitim-rozetler li {
  padding: 6px 14px; border-radius: 999px; border: 1px solid rgba(39, 213, 255, .45);
  color: #FFFFFF; font-size: 13.5px; font-weight: 600;
}
.tanitim-seritler { margin-top: 22px; gap: 6px 8px; }
.tanitim-seritler li {
  padding: 4px 10px; border-radius: 8px; background: rgba(255, 255, 255, .08);
  color: #D1CCEC; font-size: 12.5px;
}

/* Video karti */
.tanitim-video { max-width: 900px; width: 100%; margin: 0 auto; }
.tanitim-video__baslik { text-align: center; }
.tanitim-video__kapak {
  position: relative; display: block; width: 100%; padding: 0; border: 0; border-radius: 18px;
  overflow: hidden; background: #211951; cursor: pointer; box-shadow: 0 18px 40px -22px rgba(33, 25, 81, .6);
}
.tanitim-video__kapak img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform .4s; }
.tanitim-video__kapak:hover img { transform: scale(1.03); }
.tanitim-video__oynat {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  display: grid; place-items: center; width: 78px; height: 78px; border-radius: 50%;
  background: rgba(255, 255, 255, .95); color: var(--renk-mor);
  box-shadow: 0 0 0 10px rgba(255, 255, 255, .25); transition: transform .2s;
}
.tanitim-video__oynat svg { margin-left: 4px; }
.tanitim-video__kapak:hover .tanitim-video__oynat { transform: translate(-50%, -50%) scale(1.08); }

/* Ozellik bloklari: gorsel ve metin sirayla yer degistirir */
.tanitim-ozellikler { display: grid; gap: 40px; }
.tanitim-ozellikler > h2, .tanitim-ozellikler > .tanitim-ust, .tanitim-ozellikler > .tanitim-alt { margin-bottom: 0; }
.tanitim-ozellikler > h2 { margin-top: -32px; }
.tanitim-ozellikler > .tanitim-alt { margin-top: -30px; }
.tanitim-blok { display: grid; grid-template-columns: 1fr 1fr; gap: 44px; align-items: center; }
.tanitim-blok img { width: 100%; border-radius: 18px; aspect-ratio: 4 / 3; object-fit: cover; }
.tanitim-blok:nth-of-type(even) img { order: 2; }
.tanitim-blok__etiket {
  display: inline-block; margin-bottom: 10px !important; padding: 4px 12px; border-radius: 999px;
  background: var(--renk-bolum-zemin); color: var(--renk-mor); font-size: 13px; font-weight: 600;
}
.tanitim-maddeler { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 8px; }
.tanitim-maddeler li { display: flex; align-items: center; gap: 10px; color: #434B5F; font-weight: 500; }
.tanitim-maddeler li::before, .tanitim-kutu li::before {
  content: "✓"; flex: none; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%;
  background: rgba(39, 213, 255, .16); color: #0B8FB0; font-size: 12px; font-weight: 700;
}
.tanitim-dahili { padding: 26px; border-radius: 18px; background: var(--renk-bolum-zemin); text-align: center; }
.tanitim-dahili ul {
  list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px;
}
.tanitim-dahili li {
  padding: 8px 14px; border-radius: 12px; background: #FFFFFF; color: #242A3A;
  font-size: 14px; font-weight: 600; box-shadow: 0 2px 8px -4px rgba(33, 25, 81, .25);
}

/* Karsilastirma */
.tanitim-tablo { overflow-x: auto; border: 1px solid var(--renk-kenar); border-radius: 16px; }
.tanitim-tablo table { width: 100%; min-width: 620px; border-collapse: collapse; font-size: 14px; }
.tanitim-tablo th, .tanitim-tablo td { padding: 12px 14px; border-bottom: 1px solid var(--renk-kenar); text-align: center; }
.tanitim-tablo tbody th { text-align: left; font-weight: 500; color: #434B5F; }
.tanitim-tablo thead th { background: #F7F7FB; color: #242A3A; font-weight: 600; }
.tanitim-tablo tr:last-child > * { border-bottom: 0; }
.tanitim-tablo .tanitim-tablo__biz { background: rgba(127, 39, 255, .06); }
.tanitim-tablo thead .tanitim-tablo__biz { background: var(--renk-mor); color: #FFFFFF; }
.tanitim-tablo .var, .tanitim-tablo .yok {
  display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 600;
}
.tanitim-tablo .var { background: rgba(18, 183, 106, .12); color: #0E8A51; }
.tanitim-tablo .yok { background: #F2F2F5; color: #9AA0A6; }
.tanitim-tablo__fiyat > * { font-weight: 700; color: #242A3A; }
.tanitim-tablo__fiyat .tanitim-tablo__biz { color: var(--renk-mor); font-size: 16px; }
.tanitim-dipnot { margin-top: 10px !important; font-size: 12.5px; color: #9AA0A6; }

/* Teknik */
.tanitim-teknik { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: 36px; align-items: start; }
.tanitim-kutu { margin-top: 18px; padding: 20px; border: 1px solid var(--renk-kenar); border-radius: 16px; }
.tanitim-kutu h3 { font-size: 17px; }
.tanitim-kutu ul { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 8px; }
.tanitim-kutu li { display: flex; align-items: center; gap: 10px; color: #434B5F; font-weight: 500; }
.tanitim-kutu p { margin: 0; font-size: 13.5px; color: #7F858C; }
.tanitim-ozellik-listesi { margin: 0; border: 1px solid var(--renk-kenar); border-radius: 16px; overflow: hidden; }
.tanitim-ozellik-listesi > div { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 14px; padding: 12px 18px; }
.tanitim-ozellik-listesi > div:nth-child(odd) { background: #F7F7FB; }
.tanitim-ozellik-listesi dt { font-weight: 600; color: #242A3A; }
.tanitim-ozellik-listesi dd { margin: 0; color: #5B6270; }

/* Baglanti kartlari */
.tanitim-baglantilar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.tanitim-kart {
  display: flex; flex-direction: column; gap: 8px; padding: 20px; border: 1px solid var(--renk-kenar);
  border-radius: 16px; color: #5B6270; text-decoration: none; transition: border-color .2s, transform .2s;
}
.tanitim-kart:hover { border-color: var(--renk-mor); transform: translateY(-2px); }
.tanitim-kart strong { color: #242A3A; font-size: 16px; }
.tanitim-kart span { font-size: 14px; }
.tanitim-kart em { margin-top: auto; font-style: normal; font-weight: 600; color: var(--renk-mor); }

/* SSS */
.tanitim-sss { max-width: 860px; }
.tanitim-sss details { border-bottom: 1px solid var(--renk-kenar); }
.tanitim-sss summary {
  display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 0;
  cursor: pointer; list-style: none; font-weight: 600; font-size: 16px; color: #242A3A;
}
.tanitim-sss summary::-webkit-details-marker { display: none; }
.tanitim-sss summary::after {
  content: "+"; flex: none; font-size: 22px; font-weight: 400; color: var(--renk-mor); transition: transform .2s;
}
.tanitim-sss details[open] summary::after { transform: rotate(45deg); }
.tanitim-sss details p { margin: 0 0 16px; }
.tanitim-yasal {
  margin: 0 !important; padding: 14px 16px; border-radius: 12px; background: #FFF8EB;
  border: 1px solid #FCE2B4; color: #8A5A00; font-size: 13.5px;
}
.tanitim-yasal a { color: inherit; font-weight: 600; }

@media (max-width: 900px) {
  .tanitim-blok { gap: 24px; }
  .tanitim-teknik { grid-template-columns: 1fr; }
  .tanitim-baglantilar { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .urun-tanitim { gap: 40px; font-size: 14.5px; }
  .urun-tanitim h2 { font-size: 24px; }
  .urun-tanitim h3 { font-size: 19px; }
  .tanitim-giris { padding: 30px 18px; }
  .tanitim-giris h2 { font-size: 27px; }
  .tanitim-blok { grid-template-columns: 1fr; gap: 16px; }
  .tanitim-blok:nth-of-type(even) img { order: 0; }
  .tanitim-ozellikler > h2 { margin-top: -24px; }
  .tanitim-ozellikler > .tanitim-alt { margin-top: -26px; }
  .tanitim-video__oynat { width: 60px; height: 60px; }
  .tanitim-ozellik-listesi > div { grid-template-columns: 1fr; gap: 2px; }
}