/* Panel gorunum katmani.
   Panel ic aractir. 14.08.2026 karari: keskin kose ve dar palet kurali
   BURADA gevsetildi, site.css'te aynen duruyor. Olculer referans alinan
   panele yaklastirildi (kose 8px, yumusak golge, indigo-mor palet, yogun
   tipografi) ama birebir kopyalanmadi.

   Bu dosya yalniz panel sayfalarinda yuklenir; site sayfalari almaz. */

:root {
  /* Palet - indigo/mor ekseninde, marka morumuza yakin */
  --ana: #5f57ef;
  --ana-koyu: #4c44d6;
  --ana-acik: #8b7cf6;
  --vurgu: #9e5cf7;
  --basari: #1fc39a;
  --uyari: #eaa63c;
  --tehlike: #ef4747;
  --bilgi: #0ea5e8;

  /* Zemin ve metin - mavimsi acik gri */
  --zemin: #f7f8fc;
  --zemin-2: #f1f3f9;
  --zemin-3: #e8ebf4;
  --kart: #ffffff;
  --kenar: #eaeef7;
  --kenar-koyu: #dde3ef;
  --metin: #212b37;
  --metin-2: #4a5568;
  --metin-3: #8a94a6;

  /* Kose ve golge */
  --kose-kucuk: 5px;
  --kose-orta: 7px;
  --kose-buyuk: 8px;
  --golge-1: 0 4px 12px 1px rgba(0, 0, 0, .04);
  --golge-2: 0 6px 16px 2px rgba(0, 0, 0, .05);
  --golge-3: 0 12px 34px 2px rgba(0, 0, 0, .10);

  --panel-yan: #232a4a;
  --panel-yan-metin: #b2b8c7;
  --panel-kose: 8px;

  --k-mor: #5f57ef; --k-mavi: #0ea5e8; --k-yesil: #1fc39a;
  --k-turuncu: #eaa63c; --k-pembe: #d6479b; --k-kirmizi: #ef4747;
}

:root[data-tema="koyu"] {
  --zemin: #12172b; --zemin-2: #1a2038; --zemin-3: #232a46;
  --kart: #1a2038; --kenar: #2b3352; --kenar-koyu: #384162;
  --metin: #e6e9f2; --metin-2: #b8c0d4; --metin-3: #8992a8;
  --panel-yan: #171d31;
}

/* Tipografi - panel daha yogun ve geometrik */
body {
  font-family: "Poppins", var(--yazi-govde);
  font-size: 13.5px;
  background: var(--zemin);
}
h1, h2, h3, .kutucuk-sayi, .marka-ad, .halka-orta strong {
  font-family: "Poppins", var(--yazi-baslik);
  font-weight: 500;
  letter-spacing: -0.005em;
}
.kutucuk-sayi, .halka-orta strong { font-weight: 600; }

/* ── Koyu yan menu ─────────────────────────────────── */
.yan { background: var(--panel-yan); border-right: 0; color: var(--panel-yan-metin); }
.yan-tepe { border-bottom: 1px solid rgba(255,255,255,.07); }
.yan-tepe .marka-ad { color: #fff; }
.yan-tepe .marka-alt { color: var(--panel-yan-metin); opacity: .75; }
.yan-baslik { color: rgba(255,255,255,.34); font-size: 10px; letter-spacing: .14em; }
.yan-menu a { color: var(--panel-yan-metin); border-radius: 6px; font-weight: 400; }
.yan-menu a:hover { background: rgba(255,255,255,.06); color: #fff; }
.yan-grup-tepe { color: var(--panel-yan-metin); border-radius: 6px; font-weight: 400; }
.yan-grup-tepe:hover { background: rgba(255,255,255,.06); color: #fff; }
.yan-menu a[aria-current="page"] {
  background: var(--ana); color: #fff; font-weight: 500;
  box-shadow: 0 4px 12px rgba(95, 87, 239, .38);
}
:root[data-tema="koyu"] .yan-menu a[aria-current="page"] { color: #fff; }
.yan-alt { border-top: 1px solid rgba(255,255,255,.07); }
.yan-alt .dugme-ikincil {
  background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.13); color: #fff;
}
.yan-alt .dugme-ikincil:hover { background: rgba(255,255,255,.14); }

/* ── Ust cubuk ─────────────────────────────────────── */
.ust { gap: var(--aralik-4); background: var(--kart); }
.ust-baslik-sar { min-width: 0; }
.kirinti {
  font-size: 11px; color: var(--metin-3);
  display: flex; align-items: center; gap: 6px; margin-bottom: 1px;
}
.kirinti span:not(:last-child)::after { content: "\203A"; margin-left: 6px; opacity: .6; }
.ust h1 { font-size: 19px; margin: 0; line-height: 1.2; }

.ara-kutu { flex: 1; max-width: 380px; position: relative; margin-left: var(--aralik-5); }
.ara-kutu svg {
  position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  width: 15px; height: 15px; color: var(--metin-3); pointer-events: none;
}
.ara-kutu input {
  width: 100%; padding: .5rem .9rem .5rem 2.2rem;
  border: 1px solid var(--kenar); border-radius: var(--kose-buyuk);
  background: var(--zemin-2); color: var(--metin); font: inherit; font-size: 13px;
}
.ara-kutu input:focus {
  outline: none; border-color: var(--ana); background: var(--kart);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ana) 14%, transparent);
}
.ara-sonuc {
  position: absolute; inset: calc(100% + 6px) 0 auto 0; z-index: 40;
  background: var(--kart); border: 1px solid var(--kenar);
  border-radius: var(--panel-kose); box-shadow: var(--golge-3);
  padding: 5px; display: grid; gap: 2px; max-height: 300px; overflow-y: auto;
}
.ara-sonuc button {
  text-align: left; border: 0; background: transparent; font: inherit;
  font-size: 13px; color: var(--metin); padding: .45rem .7rem;
  border-radius: 6px; cursor: pointer;
}
.ara-sonuc button:hover { background: var(--zemin-2); }
@media (max-width: 900px) { .ara-kutu { display: none; } }

.ust-ayrac { width: 1px; height: 24px; background: var(--kenar); }
.ust-kimlik { display: flex; align-items: center; gap: 10px; }
.ust-kimlik .ad { font-size: 13px; font-weight: 500; line-height: 1.2; }
.ust-kimlik .rol { font-size: 11px; color: var(--metin-3); }
.bas-harf {
  width: 34px; height: 34px; flex: none; display: grid; place-items: center;
  background: linear-gradient(140deg, var(--ana-acik), var(--ana));
  color: #fff; font-weight: 600; font-size: 13px;
  font-family: "Poppins", var(--yazi-baslik); border-radius: 50%;
}
@media (max-width: 640px) { .ust-kimlik .ad, .ust-kimlik .rol { display: none; } }

.simge-dugme { position: relative; }
.simge-rozet {
  position: absolute; top: 0; right: 0; min-width: 16px; height: 16px;
  padding: 0 4px; border-radius: 999px; background: var(--tehlike);
  color: #fff; font-size: 10px; font-weight: 600; line-height: 16px;
  text-align: center; box-shadow: 0 0 0 2px var(--kart);
}

/* ── Gosterge ─────────────────────────────────────── */
.gosterge { display: grid; gap: var(--aralik-5); }
.kutucuk-izgara {
  display: grid; gap: var(--aralik-4);
  grid-template-columns: repeat(auto-fill, minmax(212px, 1fr));
}
.kutucuk {
  padding: 18px 20px;
  background: var(--kart); border: 1px solid var(--kenar);
  border-radius: var(--panel-kose); box-shadow: var(--golge-1);
  display: grid; grid-template-columns: 1fr auto; gap: 2px 12px;
  align-items: start; transition: box-shadow var(--gecis), transform var(--gecis);
}
.kutucuk:hover { box-shadow: var(--golge-2); transform: translateY(-1px); }
.kutucuk-etiket {
  grid-column: 1; font-size: 11px; color: var(--metin-3);
  text-transform: uppercase; letter-spacing: .05em; font-weight: 500;
}
.kutucuk-sayi { grid-column: 1; font-size: 26px; line-height: 1.25; font-variant-numeric: tabular-nums; }
.kutucuk-alt { grid-column: 1; font-size: 11.5px; color: var(--metin-3); }
.kutucuk-ikon {
  grid-column: 2; grid-row: 1 / span 3;
  width: 42px; height: 42px; border-radius: 50%;
  display: grid; place-items: center; color: #fff;
}
.kutucuk-ikon svg { width: 20px; height: 20px; }
.i-mor { background: var(--k-mor); } .i-mavi { background: var(--k-mavi); }
.i-yesil { background: var(--k-yesil); } .i-turuncu { background: var(--k-turuncu); }
.i-pembe { background: var(--k-pembe); } .i-kirmizi { background: var(--k-kirmizi); }

.degisim { font-size: 11.5px; font-weight: 600; display: inline-flex; gap: 3px; }
.degisim.arti { color: var(--basari); }
.degisim.eksi { color: var(--tehlike); }
.degisim.duz { color: var(--metin-3); }

.gosterge-ikili {
  display: grid; gap: var(--aralik-5);
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}
.gosterge .pano { position: static; max-height: none; box-shadow: var(--golge-1); }
.pano-tepe h2 { font-size: 15px; }

.egri { display: flex; align-items: flex-end; gap: 5px; height: 120px; }
.egri-sutun {
  flex: 1; min-height: 3px; border-radius: 4px 4px 0 0;
  background: linear-gradient(180deg, var(--ana-acik), var(--ana));
  opacity: .9; transition: opacity var(--gecis);
}
.egri-sutun:hover { opacity: 1; }
.egri-eksen { display: flex; gap: 5px; margin-top: 6px; font-size: 10px; color: var(--metin-3); }
.egri-eksen span { flex: 1; text-align: center; }

.satir-liste { display: grid; }
.satir-liste > div {
  padding: 11px 0; display: flex; align-items: center; gap: 11px;
  font-size: 13px; border-bottom: 1px solid var(--kenar);
}
.satir-liste > div:last-child { border-bottom: 0; }
.satir-liste .sag { margin-left: auto; color: var(--metin-3); font-size: 11.5px; white-space: nowrap; }
.satir-nokta { width: 8px; height: 8px; border-radius: 50%; background: var(--ana-acik); flex: none; }
.satir-nokta.uyari { background: var(--uyari); }
.satir-nokta.kritik { background: var(--tehlike); }

.etiket {
  font-size: 11px; font-weight: 500; padding: 3px 10px;
  border-radius: 999px; white-space: nowrap;
}
.etiket-yesil { background: color-mix(in srgb, var(--basari) 14%, transparent); color: var(--basari); }
.etiket-sari  { background: color-mix(in srgb, var(--uyari) 18%, transparent); color: #b47c17; }
.etiket-kirmizi { background: color-mix(in srgb, var(--tehlike) 13%, transparent); color: var(--tehlike); }
.etiket-mor { background: color-mix(in srgb, var(--ana) 12%, transparent); color: var(--ana); }
.etiket-gri { background: var(--zemin-3); color: var(--metin-3); }

.halka-sar { display: flex; align-items: center; gap: var(--aralik-5); flex-wrap: wrap; }
.halka { width: 132px; height: 132px; flex: none; position: relative; }
.halka svg { transform: rotate(-90deg); width: 100%; height: 100%; }
.halka-orta { position: absolute; inset: 0; display: grid; place-items: center; text-align: center; }
.halka-orta strong { display: block; font-size: 24px; line-height: 1; }
.halka-orta span { font-size: 11px; color: var(--metin-3); }
.halka-anahtar { flex: 1; min-width: 170px; display: grid; gap: 7px; }
.halka-anahtar div { display: flex; align-items: center; gap: 8px; font-size: 12.5px; }
.halka-anahtar i { width: 9px; height: 9px; border-radius: 3px; flex: none; }
.halka-anahtar .sag { margin-left: auto; color: var(--metin-3); font-variant-numeric: tabular-nums; }

.uyg-liste { display: grid; }
.uyg-liste > div {
  display: flex; align-items: center; gap: 11px;
  padding: 11px 0; border-bottom: 1px solid var(--kenar); font-size: 13px;
}
.uyg-liste > div:last-child { border-bottom: 0; }
.uyg-liste .sag { margin-left: auto; display: flex; align-items: center; gap: 8px; }

/* Panelin geri kalani da yumusasin */
.bilesen-satir, .pano, .liste-alan, .ekle-kart, .ortu-kutu, .giris-kutu {
  border-radius: var(--panel-kose);
}
.bilesen-satir { box-shadow: var(--golge-1); }
.dugme { border-radius: var(--kose-buyuk); font-weight: 500; }

/* ── Widget galerisi ────────────────────────────────────
   Her bilesenin CANLI onizlemesi. Onizleme cercevede (iframe) acilir:
   site stilleri panelin stiline karismasin. */
.galeri-arac {
  display: flex; align-items: center; gap: .6rem; flex-wrap: wrap;
  margin-bottom: var(--aralik-5);
}
.galeri-arac input[type="search"] {
  flex: 1; min-width: 200px; max-width: 320px;
  padding: .5rem .9rem .5rem 2.2rem;
  border: 1px solid var(--kenar); border-radius: var(--kose-buyuk);
  background: var(--zemin-2); color: var(--metin); font: inherit; font-size: 13px;
}
.galeri-sayac { margin-left: auto; font-size: 12px; color: var(--metin-3); }

.galeri-sekme {
  display: inline-flex; gap: 2px; padding: 3px;
  background: var(--zemin-2); border-radius: var(--kose-buyuk);
}
.galeri-sekme button {
  border: 0; background: transparent; font: inherit; font-size: 12.5px;
  padding: .38rem .85rem; border-radius: 6px; cursor: pointer; color: var(--metin-2);
}
.galeri-sekme button[aria-pressed="true"] {
  background: var(--kart); color: var(--metin); font-weight: 500; box-shadow: var(--golge-1);
}

.galeri-izgara {
  display: grid; gap: var(--aralik-5);
  grid-template-columns: repeat(auto-fill, minmax(420px, 1fr));
}
.galeri-kart {
  background: var(--kart); border: 1px solid var(--kenar);
  border-radius: var(--panel-kose); overflow: hidden;
  display: flex; flex-direction: column;
  transition: box-shadow var(--gecis);
}
.galeri-kart:hover { box-shadow: var(--golge-2); }
.galeri-tepe {
  display: flex; align-items: center; gap: .6rem;
  padding: .8rem 1rem; border-bottom: 1px solid var(--kenar);
}
.galeri-tepe strong { font-size: 13.5px; font-weight: 500; }
.galeri-tepe .tur {
  font-size: 11px; color: var(--metin-3); font-family: ui-monospace, monospace;
}
.galeri-tepe .sag { margin-left: auto; display: flex; gap: 4px; }
.galeri-aciklama {
  padding: .55rem 1rem; font-size: 12px; color: var(--metin-3);
  border-bottom: 1px solid var(--kenar);
}
.galeri-cerceve {
  width: 100%; height: 300px; border: 0; display: block; background: #fff;
  transition: height var(--gecis);
}
.galeri-kart.genis { grid-column: 1 / -1; }
.galeri-kart.genis .galeri-cerceve { height: 520px; }

.galeri-bolge {
  font-size: 10px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  padding: .12rem .5rem; border-radius: 999px;
  background: color-mix(in srgb, var(--ana) 12%, transparent); color: var(--ana);
}
.galeri-bolge.tepe { background: color-mix(in srgb, var(--bilgi) 14%, transparent); color: var(--bilgi); }
.galeri-bolge.alt { background: color-mix(in srgb, var(--uyari) 18%, transparent); color: #b47c17; }

/* ── Tasarim ekrani ─────────────────────────────────────
   Solda denetimler, sagda canli onizleme. Onizleme gercek
   anasayfayi cerceve icinde gosterir. */
.tasarim-duzen {
  display: grid; gap: var(--aralik-5);
  grid-template-columns: minmax(320px, 400px) 1fr;
  align-items: start;
}
@media (max-width: 1100px) { .tasarim-duzen { grid-template-columns: 1fr; } }
.tasarim-sol { display: grid; gap: var(--aralik-5); }

.tema-izgara {
  display: grid; gap: .6rem;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
}
.tema-kart {
  display: flex; align-items: center; gap: .6rem;
  padding: .6rem .7rem; border: 1px solid var(--kenar);
  border-radius: var(--panel-kose); background: var(--kart);
  cursor: pointer; font: inherit; text-align: left;
  transition: border-color var(--gecis), box-shadow var(--gecis);
}
.tema-kart:hover { border-color: var(--ana); box-shadow: var(--golge-1); }
.tema-renkler { display: flex; flex: none; }
.tema-renkler i {
  width: 15px; height: 15px; border-radius: 50%;
  border: 2px solid var(--kart); margin-left: -6px;
}
.tema-renkler i:first-child { margin-left: 0; }
.tema-ad { font-size: 12.5px; color: var(--metin); }

.oniz-sar {
  background: var(--zemin-3); padding: var(--aralik-4);
  display: flex; justify-content: center;
  border-radius: 0 0 var(--panel-kose) var(--panel-kose);
}
.oniz-cerceve {
  width: 100%; height: 620px; border: 1px solid var(--kenar);
  border-radius: 6px; background: #fff; display: block;
  transition: width var(--gecis);
}
.oniz-tablet .oniz-cerceve { width: 768px; max-width: 100%; }
.oniz-telefon .oniz-cerceve { width: 390px; max-width: 100%; }

/* Sozlesme onayi */
.sozlesme-pencere { width: min(760px, calc(100% - 2rem)); max-height: 88vh; overflow-y: auto; padding: 1.4rem;
  border: 1px solid var(--kenar); border-radius: 14px; background: var(--kart); color: var(--metin); }
.sozlesme-pencere::backdrop { background: rgba(0, 0, 0, .5); }
.sozlesme-pencere h2 { margin: 0 0 .4rem; font-size: 1.15rem; }
.sozlesme-liste { list-style: none; margin: .8rem 0; padding: 0; display: grid; gap: .5rem; }
.sozlesme-liste li { display: flex; align-items: center; justify-content: space-between; gap: .75rem;
  padding: .6rem .8rem; border: 1px solid var(--kenar); border-radius: 10px; }
.sozlesme-okuma { max-height: 45vh; overflow-y: auto; margin: .6rem 0; padding: .8rem 1rem; border: 1px solid var(--kenar);
  border-radius: 10px; background: var(--zemin-2); font-size: .85rem; line-height: 1.6; }
.sozlesme-okuma[hidden] { display: none; }
.sozlesme-okuma table { max-width: 100%; }
.sozlesme-onay-satir { display: flex; gap: .6rem; align-items: flex-start; margin: 1rem 0; font-weight: 500; }
.sozlesme-onay-satir input { margin-top: .2rem; width: 18px; height: 18px; accent-color: var(--elektrik, var(--ana)); }
.sozlesme-alt { display: flex; justify-content: flex-end; gap: .5rem; }
.sozlesme-serit { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
  margin: 0 0 1rem; padding: .75rem 1rem; border-radius: 12px; border: 1px solid #d97706;
  background: color-mix(in srgb, #d97706 10%, var(--kart)); font-size: .88rem; }
@media print { body > *:not(.sozlesme-pencere) { display: none !important; } .sozlesme-pencere { position: static; max-height: none; border: 0; } }

/* Tasarim onizlemesi sayfayi takip eder (16 Eki 2026) */
.tasarim-sag { align-self: stretch; }
.tasarim-oniz-kutu { position: sticky; top: 76px; max-height: none; }
.tasarim-oniz-tepe { flex-wrap: wrap; gap: .5rem; }
.tasarim-oniz-kutu .oniz-olcek { position: relative; overflow: hidden; border: 1px solid var(--kenar); border-radius: 6px; background: #fff; flex: none; }
.tasarim-oniz-kutu .oniz-cerceve { position: absolute; left: 0; top: 0; max-width: none; border: 0; border-radius: 0; transform-origin: 0 0; transition: none; }
@media (max-width: 1100px) { .tasarim-oniz-kutu { position: static; } }

/* ═══ Kullanici Yonetimi (cxx.dropshipping duzeni, 16 Eki 2026) ═══ */
.kul-ekran { display: grid; gap: 1rem; max-width: 1280px; }
.kul-tepe { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.kul-alt-baslik { margin: 0; color: var(--metin-2); font-size: .9rem; }
.kul-tepe .dugme { display: inline-flex; align-items: center; gap: .45rem; }
.kul-tepe .dugme svg { width: 16px; height: 16px; }
.kul-filtre {
  display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; padding: .9rem 1rem;
  background: var(--kart); border: 1px solid var(--kenar); border-radius: 12px;
}
.kul-filtre select { width: auto; min-width: 150px; }
.kul-ara { position: relative; flex: 1 1 260px; }
.kul-ara span { position: absolute; left: .7rem; top: 50%; transform: translateY(-50%); color: var(--metin-3); display: flex; }
.kul-ara svg { width: 16px; height: 16px; }
.kul-ara input { width: 100%; padding-left: 2.2rem; }
.kul-tablo-kutu { background: var(--kart); border: 1px solid var(--kenar); border-radius: 12px; overflow: hidden; }
.kul-tablo-sar { overflow-x: auto; }
.kul-tablo { width: 100%; border-collapse: collapse; font-size: .875rem; }
.kul-tablo th {
  text-align: left; padding: .75rem 1rem; font-size: .72rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase;
  color: var(--metin-3); background: var(--zemin-2); border-bottom: 1px solid var(--kenar); white-space: nowrap;
}
.kul-tablo td { padding: .75rem 1rem; border-bottom: 1px solid var(--kenar); vertical-align: middle; color: var(--metin); }
.kul-tablo tr:last-child td { border-bottom: 0; }
.kul-tablo tbody tr:hover td { background: var(--zemin-2); }
.kul-tablo td small { display: block; margin-top: 2px; font-size: .75rem; color: var(--metin-3); }
.kul-tablo td strong { font-weight: 600; }
.kul-tablo tr.kul-pasif td { opacity: .6; }
.kul-id { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; color: var(--metin-3) !important; }
.kul-rozet { display: inline-block; padding: .2rem .6rem; border-radius: 999px; font-size: .72rem; font-weight: 600; white-space: nowrap; }
.kul-rozet-yonetici { background: color-mix(in srgb, #7c3aed 15%, transparent); color: #7c3aed; }
.kul-rozet-musteri { background: color-mix(in srgb, #0070f3 13%, transparent); color: #0070f3; }
:root[data-tema="koyu"] .kul-rozet-yonetici { color: #c4b5fd; }
:root[data-tema="koyu"] .kul-rozet-musteri { color: #7cc4ff; }
.kul-durum { display: inline-flex; align-items: center; gap: .35rem; padding: .2rem .6rem; border-radius: 999px; font-size: .72rem; font-weight: 600; }
.kul-durum::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.kul-durum.aktif { background: color-mix(in srgb, #16a34a 14%, transparent); color: #16a34a; }
.kul-durum.pasif { background: var(--zemin-2); color: var(--metin-3); }
.kul-islem { display: flex; justify-content: flex-end; gap: .15rem; }
.kul-islem .simge-dugme:hover { color: var(--ana); }
.kul-islem .kul-tehlike:hover { color: #dc2626; }
.kul-islem .kul-olumlu:hover { color: #16a34a; }
.kul-sayfa { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .7rem 1rem; border-top: 1px solid var(--kenar); font-size: .85rem; color: var(--metin-2); }
.kul-sayfa > div { display: flex; align-items: center; gap: .5rem; }
.kul-form { display: grid; gap: .25rem; }
.kul-ikili { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.kul-pencere-alt { display: flex; justify-content: flex-end; gap: .5rem; }
.kul-detay-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .9rem 1.25rem; }
.kul-detay-izgara small { display: block; font-size: .72rem; color: var(--metin-3); margin-bottom: 2px; }
.kul-detay-izgara span { font-size: .9rem; font-weight: 500; overflow-wrap: anywhere; }
.kul-detay-baslik { margin: 1.4rem 0 .5rem; font-size: .8rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--metin-3); }
.kul-detay-satir { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem .75rem; background: var(--zemin-2); border-radius: 8px; margin-bottom: .35rem; font-size: .86rem; }
.kul-detay-satir small { color: var(--metin-3); white-space: nowrap; }
@media (max-width: 640px) { .kul-ikili { grid-template-columns: 1fr; } .kul-filtre select { flex: 1 1 140px; } }
.kul-filtre input, .kul-filtre select {
  height: 40px; padding: 0 .75rem; border: 1px solid var(--kenar); border-radius: 8px;
  background: var(--zemin-2); color: var(--metin); font: inherit; font-size: .875rem;
}
.kul-filtre input { padding-left: 2.2rem; }
.kul-filtre input:focus, .kul-filtre select:focus { outline: none; border-color: var(--ana); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ana) 18%, transparent); }

/* ═══ Menu agac duzenleyici (16 Eki 2026) ═══ */
.mn-ekran { max-width: 1100px; display: grid; gap: 1.25rem; }
.mn-kutu { position: static !important; max-height: none !important; }
.mn-kutu .pano-tepe { display: flex; align-items: center; gap: .6rem; }
.mn-agac { display: grid; gap: .4rem; }
.mn-satir {
  display: grid; grid-template-columns: 22px minmax(140px, 1fr) minmax(160px, 1.3fr) auto auto; gap: .5rem; align-items: center;
  margin-left: calc(var(--mn-girinti) * 2.2rem); padding: .45rem .5rem; border: 1px solid var(--kenar); border-radius: 10px; background: var(--kart);
}
.mn-satir.mn-pasif { opacity: .6; }
.mn-satir input { height: 36px; padding: 0 .6rem; border: 1px solid var(--kenar); border-radius: 8px; background: var(--zemin-2); color: var(--metin); font: inherit; font-size: .875rem; min-width: 0; }
.mn-seviye { color: var(--metin-3); font-family: ui-monospace, monospace; text-align: center; }
.mn-isaretler { display: flex; gap: .25rem; }
.mn-islem { display: flex; align-items: center; gap: .1rem; }
.mn-islem .simge-dugme[disabled] { opacity: .3; cursor: default; }
.mn-degisti { font-size: .8rem; color: #d97706; }
.mn-kutu .pano-alt { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
@media (max-width: 860px) { .mn-satir { grid-template-columns: 1fr 1fr; margin-left: calc(var(--mn-girinti) * 1rem); } .mn-seviye { display: none; } .mn-islem, .mn-isaretler { grid-column: 1 / -1; } }

/* ═══ Menuler — WordPress duzeni (16 Eki 2026) ═══ */
.mn2 { display: grid; gap: 1rem; max-width: 1280px; }
.mn2 .pano { position: static; max-height: none; }
.mn2-serit-ic { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; padding: .8rem 1rem !important; }
.mn2-serit-ic label { font-weight: 600; font-size: .9rem; }
.mn2-serit-ic select { min-height: 40px; padding: 0 .7rem; border: 1px solid var(--kenar); border-radius: 8px; background: var(--zemin-2); color: var(--metin); font: inherit; min-width: 260px; }
.mn2-serit-ic .dugme-ana { margin-left: auto; }
.mn2-izgara { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 1rem; align-items: start; }
.mn2-sol { display: grid; gap: .6rem; position: sticky; top: 84px; max-height: calc(100vh - 100px); overflow-y: auto; padding-right: 2px; }
.mn2-kaynak summary { list-style: none; cursor: pointer; padding: .8rem 1rem; font-weight: 600; display: flex; justify-content: space-between; align-items: center; }
.mn2-kaynak summary::-webkit-details-marker { display: none; }
.mn2-kaynak summary::after { content: "▾"; color: var(--metin-3); transition: transform .2s; }
.mn2-kaynak[open] summary::after { transform: rotate(180deg); }
.mn2-kaynak[open] summary { border-bottom: 1px solid var(--kenar); }
.mn2-kaynak-govde { padding: .8rem 1rem; display: grid; gap: .6rem; }
.mn2-kaynak-govde input[type="search"], .mn2-kaynak-govde input[type="text"], .mn2-kaynak-govde select { width: 100%; min-height: 38px; padding: 0 .65rem; border: 1px solid var(--kenar); border-radius: 8px; background: var(--zemin-2); color: var(--metin); font: inherit; font-size: .88rem; }
.mn2-secim { max-height: 240px; overflow-y: auto; display: grid; gap: 2px; border: 1px solid var(--kenar); border-radius: 8px; padding: .3rem; background: var(--zemin-2); }
.mn2-secim-satir { display: flex; align-items: center; gap: .55rem; padding: .4rem .45rem; border-radius: 6px; font-size: .88rem; cursor: pointer; }
.mn2-secim-satir:hover { background: var(--kart); }
.mn2-secim-satir[hidden] { display: none; }
.mn2-secim-satir input { width: 16px; height: 16px; accent-color: var(--ana); flex: none; }
.mn2-secim-satir small { margin-left: auto; color: var(--metin-3); font-size: .72rem; }
.mn2-kaynak-alt { display: flex; gap: .5rem; flex-wrap: wrap; justify-content: space-between; }
.mn2-sag .pano-tepe { display: grid; gap: .25rem; }
.mn2-liste-sar { position: relative; }
.mn2-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.mn2-oge { border: 1px solid var(--kenar); border-radius: 10px; background: var(--kart); transition: margin-left .15s ease; }
.mn2-oge.acik { border-color: color-mix(in srgb, var(--ana) 45%, var(--kenar)); box-shadow: 0 6px 18px rgba(0,0,0,.06); }
.mn2-oge.mn2-pasif { opacity: .6; }
.mn2-oge.mn2-tasinan { opacity: .35; outline: 2px dashed var(--ana); }
.mn2-tepe { display: flex; align-items: center; gap: .5rem; padding: .35rem .5rem; min-height: 50px; }
.mn2-tutamak { flex: none; width: 30px; height: 36px; display: grid; place-items: center; border: 0; border-radius: 6px; background: none; color: var(--metin-3); cursor: grab; touch-action: none; }
.mn2-tutamak:hover, .mn2-tutamak:focus-visible { background: var(--zemin-3); color: var(--metin); }
.mn2-tutamak svg { width: 18px; height: 18px; fill: currentColor; }
.mn2-simge-oniz { flex: none; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 7px; background: var(--zemin-3); color: var(--ana); object-fit: contain; }
.mn2-simge-oniz svg { width: 16px; height: 16px; }
.mn2-ac { flex: 1; min-width: 0; display: grid; gap: 1px; text-align: left; border: 0; background: none; color: var(--metin); font: inherit; cursor: pointer; padding: .2rem .25rem; }
.mn2-ac strong { font-size: .92rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mn2-yol { font-size: .75rem; color: var(--metin-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mn2-isaretler { display: flex; gap: .25rem; flex-wrap: wrap; justify-content: flex-end; }
.mn2-isaretler .rozet { font-size: .66rem; }
.mn2-tur { flex: none; font-size: .72rem; color: var(--metin-3); padding: .15rem .5rem; border: 1px solid var(--kenar); border-radius: 999px; }
.mn2-ayar { border-top: 1px solid var(--kenar); padding: .8rem 1rem 1rem; display: grid; gap: .8rem; }
.mn2-sekmeler { justify-self: start; }
.mn2-alanlar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .2rem 1rem; }
.mn2-alanlar > .alan { margin: 0; }
.mn2-genis, .mn2-bagli { grid-column: 1 / -1; }
.mn2-bagli p { margin: .2rem 0; }
.mn2-simgeler { display: grid; grid-template-columns: repeat(auto-fill, minmax(38px, 1fr)); gap: 4px; max-height: 172px; overflow-y: auto; padding: 4px; border: 1px solid var(--kenar); border-radius: 8px; background: var(--zemin-2); }
.mn2-simgeler button { height: 38px; display: grid; place-items: center; border: 1px solid transparent; border-radius: 7px; background: var(--kart); color: var(--metin-2); cursor: pointer; }
.mn2-simgeler button span { font-size: .68rem; }
.mn2-simgeler button svg { width: 18px; height: 18px; }
.mn2-simgeler button:hover { border-color: var(--kenar); color: var(--metin); }
.mn2-simgeler button[aria-checked="true"] { border-color: var(--ana); color: var(--ana); background: color-mix(in srgb, var(--ana) 10%, var(--kart)); }
.mn2-ayar-alt { display: flex; gap: .4rem; flex-wrap: wrap; padding-top: .7rem; border-top: 1px dashed var(--kenar); }
.dugme-tehlike { background: #dc2626; color: #fff; border: 1px solid #dc2626; }
.dugme-tehlike:hover { background: #b91c1c; }
.mn2-gosterge { position: absolute; right: 16px; height: 0; border-top: 3px solid var(--ana); pointer-events: none; z-index: 5; }
.mn2-gosterge::before { content: ""; position: absolute; left: -6px; top: -7.5px; width: 12px; height: 12px; border-radius: 50%; background: var(--ana); }
.mn2-gosterge { font-size: .7rem; font-weight: 700; color: var(--ana); line-height: 1.6; padding-left: 10px; }
.mn2-gosterge.gecersiz { color: #dc2626; }
.mn2-gosterge.gecersiz { border-color: #dc2626; }
.mn2-gosterge.gecersiz::before { background: #dc2626; }
body.mn2-surukleniyor { cursor: grabbing; user-select: none; }
@media (max-width: 1000px) {
  .mn2-izgara { grid-template-columns: 1fr; }
  .mn2-sol { position: static; max-height: none; }
}
@media (max-width: 640px) {
  .mn2-alanlar { grid-template-columns: 1fr; }
  .mn2-isaretler, .mn2-tur { display: none; }
  .mn2-oge { margin-left: 0 !important; border-left-width: calc(1px + var(--d, 0) * 4px); }
}

/* ═══ Sol menu ac/kapat (16 Eki 2026) ═══ */
.ust .yan-dugme { flex: none; }
body.yan-kapali .panel-govde { grid-template-columns: 1fr; }
body.yan-kapali .yan { display: none; }
@media (max-width: 900px) {
  .panel-govde { grid-template-columns: 1fr; }
  .yan { position: fixed; left: 0; top: 0; z-index: 90; width: min(290px, 86vw); transform: translateX(-102%); transition: transform .22s ease; box-shadow: none; }
  body.yan-kapali .yan { display: flex; }
  body.yan-acik .yan { transform: none; box-shadow: 0 0 0 100vmax rgba(0,0,0,.45); }
}

/* Bolum ayarlari: uygulama / paket secimi */
.vitrin-secim { display: grid; gap: .35rem; }
.vitrin-secim select { min-height: 40px; padding: 0 .6rem; border: 1px solid var(--kenar); border-radius: 8px; background: var(--zemin-2); color: var(--metin); font: inherit; }
.vitrin-secim-paketler { display: grid; gap: .25rem; margin-top: .3rem; }
.vitrin-secim-satir { display: flex; align-items: center; gap: .5rem; padding: .35rem .5rem; border: 1px solid var(--kenar); border-radius: 8px; font-size: .88rem; cursor: pointer; }
.vitrin-secim-satir input { width: 16px; height: 16px; accent-color: var(--ana); }
.vitrin-secim-satir small { margin-left: auto; color: var(--metin-3); font-size: .72rem; }

/* ═══ Gorsel duzenleyici (Tasarim ekrani, 16 Eki 2026) ═══ */
.tasarim-duzen.tasarim-gorsel { grid-template-columns: minmax(0, 1fr) minmax(320px, 400px); }
.tasarim-denetci { position: sticky; top: 84px; max-height: calc(100vh - 100px); overflow-y: auto; display: grid; gap: var(--aralik-5); align-content: start; padding-right: 2px; }
.tasarim-denetci .tasarim-sol[hidden], .tasarim-secim[hidden] { display: none; }
.tasarim-secim-kutu { position: static !important; max-height: none !important; }
.tasarim-secim-tepe { display: grid !important; gap: .6rem; }
.tasarim-secim-tepe .dugme { justify-self: start; }
.tasarim-secim-tepe small { color: var(--metin-3); font-size: .75rem; }
.tasarim-secim-tepe h2 { margin: .1rem 0 0; }
.tasarim-secim-alt { display: flex; gap: .4rem; flex-wrap: wrap; position: sticky; bottom: 0; background: var(--kart); }
.tasarim-secim-alt .dugme-ana { flex: 1; }
.tasarim-secim-not { display: grid; gap: .5rem; margin: .8rem 0; padding: .7rem .8rem; border: 1px dashed var(--kenar); border-radius: 10px; font-size: .85rem; color: var(--metin-2); }
.tasarim-secim-not .dugme { justify-self: start; }
.tasarim-duzen-izgara { display: grid; gap: .5rem; margin-top: .6rem; }
.tasarim-duzen-kart { display: grid; gap: .2rem; text-align: left; padding: .7rem .85rem; border: 1px solid var(--kenar); border-radius: 10px; background: var(--zemin-2); color: var(--metin); cursor: pointer; font: inherit; }
.tasarim-duzen-kart small { color: var(--metin-3); font-size: .78rem; line-height: 1.4; }
.tasarim-duzen-kart:hover { border-color: var(--ana); }
.tasarim-duzen-kart.etkin { border-color: var(--ana); background: color-mix(in srgb, var(--ana) 10%, var(--zemin-2)); }
.tasarim-sayfa-sec { min-height: 34px; padding: 0 .5rem; border: 1px solid var(--kenar); border-radius: 8px; background: var(--zemin-2); color: var(--metin); font: inherit; font-size: .85rem; max-width: 200px; }
.tasarim-mod[aria-pressed="true"] { border-color: var(--ana); color: var(--ana); }
@media (max-width: 1100px) {
  .tasarim-duzen.tasarim-gorsel { grid-template-columns: 1fr; }
  .tasarim-denetci { position: static; max-height: none; }
}
.tasarim-duzen-kart.deneniyor { border-style: dashed; border-color: var(--ana); }

/* SEO Bot */
.seo-bot-serit { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; padding: .85rem 1rem; border-radius: 12px; border: 1px solid var(--kenar); background: var(--zemin-2); }
.seo-bot-serit.acik { border-color: #16a34a; background: color-mix(in srgb, #16a34a 10%, var(--kart)); }
.seo-bot-ayar textarea { width: 100%; font-family: ui-monospace, Consolas, monospace; font-size: .8rem; padding: .6rem; border: 1px solid var(--kenar); border-radius: 8px; background: var(--zemin-2); color: var(--metin); }
.seo-bot-calisma { border: 1px solid var(--kenar); border-radius: 10px; margin-bottom: .5rem; }
.seo-bot-calisma summary { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; padding: .7rem .9rem; cursor: pointer; }
.seo-bot-calisma summary small { color: var(--metin-3); }
.seo-bot-ozet { padding: 0 .9rem .9rem; display: grid; gap: .5rem; font-size: .88rem; }
.seo-bot-ozet p { margin: 0; }
.seo-bot-ozet ul { margin: 0; padding-left: 1.2rem; color: var(--metin-2); }

/* Gorsel duzenleyici: hazir baslik duzenleri (kucuk sema) ve dar menu duzenleyici */
.tasarim-hazir-izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; margin-top: .5rem; }
.tasarim-hazir-kart { display: grid; gap: .35rem; padding: .45rem; border: 1px solid var(--kenar); border-radius: 10px; background: var(--zemin-2); color: var(--metin); cursor: pointer; font: inherit; font-size: .74rem; line-height: 1.3; text-align: left; }
.tasarim-hazir-kart:hover { border-color: var(--ana); }
.tasarim-hazir-kart.etkin { border-color: var(--ana); box-shadow: 0 0 0 2px color-mix(in srgb, var(--ana) 30%, transparent); }
.tasarim-hazir-kart.deneniyor { border-style: dashed; border-color: var(--ana); }
.te-sema { --s-zemin: #ffffff; --s-yazi: #1f2937; --s-vurgu: #2563eb; position: relative; display: grid; height: 42px; border-radius: 6px; overflow: hidden;
  background: var(--s-zemin); border: 1px solid rgba(0,0,0,.08); }
.te-sema.saydam { background: linear-gradient(135deg, #1e3a5f, #4b6b8f); --s-yazi: var(--s-yazi, #fff); }
.te-sema.saydam:not([style*="--s-yazi"]) { --s-yazi: #ffffff; }
.te-sema.kart { background: #e5e7eb; padding: 5px; } .te-sema.kart .s-ic { background: var(--s-zemin); border-radius: 5px; }
.te-sema .s-serit { position: absolute; left: 0; right: 0; top: 0; height: 7px; background: var(--s-vurgu); opacity: .85; }
.te-sema .s-ic { display: flex; align-items: center; gap: 6px; padding: 0 8px; margin-top: auto; height: 34px; }
.te-sema .s-logo { width: 22px; height: 9px; border-radius: 3px; background: var(--s-yazi); opacity: .9; flex: none; }
.te-sema .s-menu { display: flex; gap: 4px; flex: 1; }
.te-sema .s-menu i { width: 12px; height: 3px; border-radius: 2px; background: var(--s-yazi); opacity: .55; }
.te-sema .s-dugme { width: 18px; height: 9px; border-radius: 5px; background: var(--s-vurgu); flex: none; }
.te-sema .s-hamburger { display: grid; gap: 2px; margin-left: auto; } .te-sema .s-hamburger i { width: 12px; height: 2px; background: var(--s-yazi); }
.te-sema-sol-menu-orta .s-menu { justify-content: center; }
.te-sema-sol-menu-sag .s-menu { justify-content: flex-end; }
.te-sema-sol-menu-sol .s-menu { justify-content: flex-start; }
.te-sema-orta-logo-iki-satir .s-ic, .te-sema-orta-logo-bolunmus .s-ic { justify-content: center; }
.te-sema-orta-logo-iki-satir .s-ic { flex-direction: column; justify-content: center; gap: 3px; height: 38px; }
.te-sema-orta-logo-iki-satir .s-menu { flex: none; } .te-sema-orta-logo-iki-satir .s-dugme { display: none; }
.te-sema-orta-logo-bolunmus .s-logo { order: 2; } .te-sema-orta-logo-bolunmus .s-menu { order: 1; justify-content: flex-end; } .te-sema-orta-logo-bolunmus .s-dugme { order: 3; margin-left: 4px; }
.te-sema-hamburger .s-dugme { display: none; }
.tasarim-dene-serit { position: sticky; bottom: 0; display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-top: 1rem; padding: .7rem .8rem; border-radius: 10px;
  background: color-mix(in srgb, var(--ana) 12%, var(--kart)); border: 1px solid var(--ana); font-size: .85rem; }
.tasarim-dene-serit span { flex: 1 1 100%; font-weight: 600; }
/* Dar menu duzenleyici (sag panelde) */
.mn2-dar .mn2-izgara { grid-template-columns: 1fr; }
.mn2-dar .mn2-sol { position: static; max-height: none; }
.mn2-dar .mn2-serit-ic select { min-width: 0; width: 100%; }
.mn2-dar .mn2-serit-ic .dugme-ana { margin-left: 0; width: 100%; }
.mn2-dar .mn2-alanlar { grid-template-columns: 1fr; }
.mn2-dar .mn2-isaretler, .mn2-dar .mn2-tur { display: none; }
.mn2-dar .mn2-sag .pano-tepe p { display: none; }
.tasarim-menu .mn2 { gap: .6rem; }
.tasarim-secim-alt[hidden] { display: none; }

/* Liste alani: daraltilabilir, surukle-birak (16 Eki 2026) */
.liste-oge .liste-oge-tepe { margin-bottom: 0; cursor: grab; }
.liste-oge.acik .liste-oge-tepe { margin-bottom: var(--aralik-3); }
.liste-oge-tut { display: grid; place-items: center; color: var(--metin-3); flex: none; }
.liste-oge-tut svg { width: 16px; height: 16px; }
.liste-oge-resim { width: 40px; height: 28px; object-fit: cover; border-radius: 5px; flex: none; }
.liste-oge-ad { flex: 1; min-width: 0; text-align: left; border: 0; background: none; color: var(--metin); font: inherit; font-weight: 600; font-size: var(--olcek-2); cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: .2rem 0; }
.liste-oge .simge-dugme[disabled] { opacity: .3; cursor: default; }
.liste-oge.surukleniyor { opacity: .4; }
.liste-oge.hedef { outline: 2px dashed var(--ana); outline-offset: 2px; }

/* Gecmis penceresi */
.gecmis-liste { display: grid; gap: .5rem; }
.gecmis-satir { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .7rem .85rem; border: 1px solid var(--kenar); border-radius: 10px; }
.gecmis-satir div { display: grid; gap: .15rem; }
.gecmis-satir small { color: var(--metin-3); }

/* Gorsel duzenleyici: sayfa bolumleri listesi, bolum ekleme penceresi */
.bolum-liste { display: grid; gap: 0; }
.bolum-araya { position: relative; display: block; width: 100%; height: .7rem; padding: 0; border: 0; background: none; cursor: pointer; }
.bolum-araya::before { content: ''; position: absolute; left: .4rem; right: .4rem; top: 50%; height: 2px; margin-top: -1px; border-radius: 2px; background: var(--ana); opacity: 0; transition: opacity .12s; }
.bolum-araya span { position: absolute; left: 50%; top: 50%; width: 1.25rem; height: 1.25rem; margin: -.625rem 0 0 -.625rem; display: grid; place-items: center; border-radius: 50%; background: var(--ana); color: #fff; font: 700 .9rem/1 system-ui, sans-serif; opacity: 0; transform: scale(.6); transition: opacity .12s, transform .12s; z-index: 1; }
.bolum-araya:hover::before, .bolum-araya:focus-visible::before { opacity: 1; }
.bolum-araya:hover span, .bolum-araya:focus-visible span { opacity: 1; transform: none; }
.bolum-araya:focus-visible { outline: none; }
.bolum-liste-oge { position: relative; display: flex; align-items: center; gap: .35rem; padding: .3rem .35rem .3rem .2rem; border: 1px solid var(--kenar); border-radius: 9px; background: var(--zemin-2); color: var(--metin); }
.bolum-liste-oge:hover, .bolum-liste-oge.secili { border-color: var(--ana); }
.bolum-liste-oge.secili { box-shadow: inset 3px 0 0 var(--ana); }
.bolum-liste-oge.gizli .bolum-liste-ad { opacity: .5; }
.bolum-liste-oge.suruklenen { opacity: .4; }
.bolum-liste-oge.birak-ust::before, .bolum-liste-oge.birak-alt::after { content: ''; position: absolute; left: 0; right: 0; height: 3px; border-radius: 3px; background: var(--ana); pointer-events: none; }
.bolum-liste-oge.birak-ust::before { top: -4px; }
.bolum-liste-oge.birak-alt::after { bottom: -4px; }
.bolum-tutamak { flex: none; width: 1.1rem; text-align: center; color: var(--metin-3); cursor: grab; letter-spacing: -.2em; user-select: none; }
.bolum-liste-oge:active .bolum-tutamak { cursor: grabbing; }
.bolum-liste-ad { flex: 1; min-width: 0; display: grid; gap: .1rem; text-align: left; padding: .25rem .2rem; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
.bolum-liste-ad strong, .bolum-liste-ad small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bolum-liste-ad small { color: var(--metin-3); font-size: .75rem; }
.bolum-eylemler { flex: none; display: flex; gap: .1rem; }
.bolum-eylem { display: grid; place-items: center; width: 1.85rem; height: 1.85rem; padding: 0; border: 0; border-radius: 7px; background: none; color: var(--metin-3); cursor: pointer; }
.bolum-eylem svg { width: 1rem; height: 1rem; }
.bolum-eylem:hover { background: var(--zemin-3, var(--zemin)); color: var(--metin); }
.bolum-eylem.tehlike:hover { color: #dc2626; }
.bolum-eylem:focus-visible, .bolum-liste-ad:focus-visible { outline: 2px solid var(--ana); outline-offset: 1px; }
.bolum-liste-oge.gizli .bolum-eylem:first-child { color: var(--ana); }
.silinen-bolumler { margin-top: .8rem; } .silinen-bolumler summary { cursor: pointer; font-weight: 600; font-size: .88rem; padding: .3rem 0; }
.silinen-bolumler .gecmis-satir { margin-top: .4rem; }
.bolum-sec-ara { width: 100%; min-height: 42px; padding: 0 .8rem; border: 1px solid var(--kenar); border-radius: 10px; background: var(--zemin-2); color: var(--metin); font: inherit; margin-bottom: .8rem; }
.bolum-sec-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .5rem; max-height: 60vh; overflow-y: auto; }
.bolum-sec-kart { display: grid; gap: .25rem; text-align: left; padding: .75rem .85rem; border: 1px solid var(--kenar); border-radius: 10px; background: var(--zemin-2); color: var(--metin); font: inherit; cursor: pointer; }
.bolum-sec-kart:hover { border-color: var(--ana); }
.bolum-sec-kart small { color: var(--metin-3); font-size: .78rem; line-height: 1.4; }

/* Hesabim ve Guvenlik: uygulama dogrulamasi kurulumu */
.hesap-totp { display: grid; gap: .8rem; justify-items: start; }
.totp-qr { padding: .6rem; background: #fff; border-radius: 12px; line-height: 0; }
.totp-qr svg { width: 220px; height: 220px; }
.totp-gizli { font-size: 1rem; letter-spacing: .08em; padding: .2rem .5rem; border-radius: 6px; background: var(--zemin-3); }
.totp-kod { font-size: 1.4rem; letter-spacing: .3em; max-width: 220px; text-align: center; }
.totp-yedekler { margin: 0; padding: .9rem 1.1rem; border-radius: 10px; background: var(--zemin-3); font-size: 1.05rem; letter-spacing: .08em; columns: 2; }

/* Tasarim > Alt bilgi menu seridi: sutun sayisi secimi (1 / 2 / 3 / 4) */
.ams-sayi-secim { display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; }
.ams-sayi { display: grid; gap: .35rem; justify-items: center; padding: .55rem .4rem; border: 1px solid var(--kenar); border-radius: 10px; background: var(--zemin-2, transparent); color: inherit; font: inherit; font-size: .8rem; cursor: pointer; }
.ams-sayi:hover { border-color: var(--ana); }
.ams-sayi.etkin { border-color: var(--ana); box-shadow: 0 0 0 2px color-mix(in srgb, var(--ana) 30%, transparent); font-weight: 600; }
.ams-sayi-sema { display: flex; gap: 3px; width: 100%; height: 22px; }
.ams-sayi-sema i { flex: 1; border-radius: 3px; background: color-mix(in srgb, var(--ana) 35%, transparent); }
.ams-sayi.etkin .ams-sayi-sema i { background: var(--ana); }
.ams-sutun-ayar { display: grid; gap: .45rem; padding: .7rem; border: 1px solid var(--kenar); border-radius: 10px; }
.ams-sutun-ayar > .dugme { justify-self: start; }

/* Yonlendirmeler: eski adres -> yeni adres formu */
.yonlendirme-form { display: grid; grid-template-columns: 1.3fr auto 1.3fr .9fr 1fr; gap: .75rem; align-items: end; }
.yonlendirme-form .alan { display: grid; gap: .3rem; margin: 0; }
.yonlendirme-form .alan > span { font-size: .8rem; font-weight: 600; }
.yonlendirme-ok { padding-bottom: .55rem; font-size: 1.2rem; opacity: .6; }
@media (max-width: 900px) { .yonlendirme-form { grid-template-columns: 1fr; } .yonlendirme-ok { display: none; } }

/* Blog kategorileri kutusu */
.blog-kat-satir { display: grid; grid-template-columns: 1.2fr 5.5rem 2fr auto auto; gap: .5rem; align-items: center; padding: .5rem 0; border-bottom: 1px solid var(--kenar); }
.blog-kat-satir small { grid-column: 1 / -1; opacity: .7; }
.blog-kat-satir.pasif { opacity: .55; }
.blog-kat-yeni { grid-template-columns: 1fr auto; border-bottom: 0; }
@media (max-width: 700px) { .blog-kat-satir { grid-template-columns: 1fr; } }

/* Form yanitlari */
.form-yanit-yeni { border-left: 3px solid var(--ana); }
.form-yanit-liste { display: grid; grid-template-columns: minmax(120px, 220px) 1fr; gap: .35rem 1rem; margin: 0 0 .75rem; }
.form-yanit-liste dt { font-weight: 600; opacity: .8; }
.form-yanit-liste dd { margin: 0; white-space: pre-line; overflow-wrap: anywhere; }
@media (max-width: 640px) { .form-yanit-liste { grid-template-columns: 1fr; } .form-yanit-liste dd { margin-bottom: .5rem; } }

/* Tasarim: ekip yorumlari paneli */
.tz-panel { display: grid; gap: .6rem; }
.tz-yeni { display: grid; gap: .35rem; padding: .7rem; border: 1px solid #ef4444; border-radius: 10px; }
.tz-kart { display: grid; gap: .35rem; padding: .7rem; border: 1px solid var(--kenar); border-radius: 10px; }
.tz-kart.secili { border-color: var(--ana); box-shadow: 0 0 0 2px color-mix(in srgb, var(--ana) 25%, transparent); }
.tz-kart.cozuldu { opacity: .65; }
.tz-kart p { margin: 0; white-space: pre-line; }
.tz-kart-tepe { display: flex; align-items: center; gap: .5rem; padding: 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; text-align: left; }
.tz-kart-tepe small { margin-left: auto; opacity: .7; }
.tz-no { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50% 50% 50% 4px; background: #f59e0b; color: #111; font-size: .78rem; font-weight: 700; flex: none; }
.tz-kart.cozuldu .tz-no { background: #9ca3af; }
.tz-yanit { padding-left: .75rem; border-left: 2px solid var(--kenar); font-size: .9rem; }
.tz-cozen { opacity: .7; }

/* Tasarim: tek "Kaydet ve yayinla" - bekleyen degisiklik varken belirgin */
.tasarim-tek-kayit[disabled] { opacity: .6; cursor: default; }
.tasarim-tek-kayit.bekliyor { background: #ea580c; border-color: #ea580c; color: #fff; box-shadow: 0 0 0 3px color-mix(in srgb, #ea580c 30%, transparent); }
.tasarim-tek-kayit-not { margin: .75rem 1rem 1rem; }

/* Baglanti secici */
.bag-satir { display: flex; gap: .4rem; }
.bag-satir input { flex: 1; min-width: 0; }
.bag-liste { margin-top: .4rem; max-height: 280px; overflow: auto; border: 1px solid var(--kenar); border-radius: 10px; padding: .4rem; background: var(--kart); display: grid; gap: 2px; }
.bag-liste[hidden] { display: none; }
.bag-liste input[type="search"] { margin-bottom: .3rem; }
.bag-grup { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; opacity: .65; padding: .4rem .3rem .15rem; }
.bag-oge { display: flex; justify-content: space-between; gap: .5rem; text-align: left; padding: .35rem .5rem; border: 0; border-radius: 6px; background: none; color: inherit; font: inherit; font-size: .85rem; cursor: pointer; }
.bag-oge:hover, .bag-oge:focus-visible { background: var(--zemin-3, rgba(127,127,127,.12)); }
.bag-oge small { opacity: .6; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 50%; }
.bag-oge[hidden] { display: none; }

/* Panel Tasarimi ekrani (17 Eki 2026) */
.pt-ara-baslik { margin: 1.1rem 0 .5rem; font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--metin-3); }
.pt-ara-baslik:first-child { margin-top: .2rem; }
.pt-madde { gap: .4rem; }
.pt-madde input[type="text"] { min-height: 32px; padding: 0 .5rem; border: 1px solid var(--kenar); border-radius: 7px; background: var(--kart); color: var(--metin); font: inherit; font-size: .88rem; }
.pt-madde-simge { flex: none; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 1px solid var(--kenar); border-radius: 8px; background: var(--kart); color: var(--ana); cursor: pointer; }
.pt-madde-simge svg, .pt-simgeler svg { width: 18px; height: 18px; }
.pt-simgeler { display: grid; grid-template-columns: repeat(auto-fill, minmax(34px, 1fr)); gap: .3rem; margin: .3rem 0 .5rem; padding: .5rem; border: 1px dashed var(--kenar); border-radius: 9px; }
.pt-simgeler button { display: grid; place-items: center; height: 34px; padding: 0; border: 1px solid transparent; border-radius: 7px; background: var(--zemin-2); color: var(--metin-2); cursor: pointer; }
.pt-simgeler button:hover, .pt-simgeler button[aria-pressed="true"] { border-color: var(--ana); color: var(--ana); }
.pt-grup-satir { background: transparent; border-style: dashed; }
.pt-grup-satir strong { font-size: .78rem; letter-spacing: .04em; text-transform: uppercase; }
.bolum-liste-ad input { min-height: 30px; padding: 0 .45rem; border: 1px solid var(--ana); border-radius: 6px; background: var(--kart); color: var(--metin); font: inherit; }

/* Simge secici ve menu secici (17 Eki 2026) */
.simge-sec { position: relative; }
.simge-sec-dugme { display: flex; align-items: center; gap: .55rem; width: 100%; min-height: 40px; padding: .35rem .6rem; border: 1px solid var(--kenar); border-radius: 8px; background: var(--zemin-2); color: var(--metin); font: inherit; cursor: pointer; text-align: left; }
.simge-sec-dugme svg { width: 20px; height: 20px; flex: none; color: var(--ana); }
.simge-sec-dugme small { margin-left: auto; color: var(--metin-3); font-size: .75rem; }
.simge-sec-yok { display: inline-grid; place-items: center; width: 20px; height: 20px; color: var(--metin-3); }
.simge-sec-panel { margin-top: .35rem; padding: .5rem; border: 1px solid var(--kenar); border-radius: 10px; background: var(--kart); box-shadow: var(--golge-2); }
.simge-sec-panel[hidden] { display: none; }
.simge-sec-panel input { width: 100%; min-height: 34px; margin-bottom: .45rem; padding: 0 .55rem; border: 1px solid var(--kenar); border-radius: 7px; background: var(--zemin-2); color: var(--metin); font: inherit; }
.simge-sec-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(38px, 1fr)); gap: .3rem; max-height: 220px; overflow-y: auto; }
.simge-sec-izgara button { display: grid; place-items: center; height: 38px; padding: 0; border: 1px solid transparent; border-radius: 8px; background: var(--zemin-2); color: var(--metin-2); cursor: pointer; }
.simge-sec-izgara button svg { width: 20px; height: 20px; }
.simge-sec-izgara button:hover, .simge-sec-izgara button[aria-pressed="true"] { border-color: var(--ana); color: var(--ana); }
.menu-sec select { width: 100%; }
.menu-sec-yeni { display: flex; gap: .4rem; margin-top: .4rem; }
.menu-sec-yeni[hidden] { display: none; }
.menu-sec-yeni input { flex: 1; min-width: 0; min-height: 34px; padding: 0 .55rem; border: 1px solid var(--kenar); border-radius: 7px; background: var(--zemin-2); color: var(--metin); font: inherit; }
.bolum-site-geneli { display: grid; gap: .1rem; width: 100%; margin-bottom: .6rem; padding: .55rem .7rem; text-align: left; border: 1px dashed var(--ana); border-radius: 9px; background: color-mix(in srgb, var(--ana) 6%, var(--zemin-2)); color: var(--metin); font: inherit; cursor: pointer; }
.bolum-site-geneli small { color: var(--metin-3); font-size: .75rem; }
.bolum-site-geneli:hover { background: color-mix(in srgb, var(--ana) 12%, var(--zemin-2)); }

/* Temalar paneli (17 Eki 2026) */
.tmp-yeni { display: grid; gap: .4rem; margin-bottom: 1rem; padding: .75rem; border: 1px dashed var(--ana); border-radius: 10px; background: color-mix(in srgb, var(--ana) 5%, var(--zemin-2)); }
.tmp-yeni-satir { display: flex; gap: .4rem; }
.tmp-yeni-satir input { flex: 1; min-width: 0; min-height: 34px; padding: 0 .55rem; border: 1px solid var(--kenar); border-radius: 7px; background: var(--kart); color: var(--metin); font: inherit; }
.tmp-liste { display: grid; gap: .55rem; }
.tmp-kart { display: grid; gap: .45rem; padding: .7rem .75rem; border: 1px solid var(--kenar); border-radius: 10px; background: var(--zemin-2); }
.tmp-kart.etkin { border-color: var(--basari, #16a34a); box-shadow: inset 3px 0 0 var(--basari, #16a34a); }
.tmp-kart.onizleniyor { border-color: var(--ana); box-shadow: inset 3px 0 0 var(--ana); }
.tmp-kart-tepe { display: flex; align-items: center; gap: .6rem; }
.tmp-kart-tepe strong { display: block; }
.tmp-kart-tepe small { color: var(--metin-3); font-size: .75rem; }
.tmp-renkler { display: inline-flex; flex: none; }
.tmp-renkler i { width: 18px; height: 18px; margin-left: -5px; border: 2px solid var(--kart); border-radius: 50%; }
.tmp-renkler i:first-child { margin-left: 0; }
.tmp-renkler:empty { width: 18px; height: 18px; border-radius: 50%; background: var(--zemin-3); }
.tmp-aciklama { margin: 0; font-size: .8rem; color: var(--metin-2); }
.tmp-dugmeler { display: flex; flex-wrap: wrap; gap: .3rem; }

/* Uygulamalar — ultra ayarlar (17 Eki 2026) */
.uyg-ultra-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: .75rem; }
.uyg-ultra-kart { display: flex; align-items: center; gap: .8rem; padding: .9rem 1rem; text-align: left; border: 1px solid var(--kenar); border-radius: 12px; background: var(--kart); color: var(--metin); font: inherit; cursor: pointer; }
.uyg-ultra-kart:hover { border-color: var(--ana); box-shadow: var(--golge-2); }
.uyg-ultra-simge { display: grid; place-items: center; flex: none; width: 44px; height: 44px; overflow: hidden; border-radius: 12px; background: linear-gradient(135deg, var(--ana), color-mix(in srgb, var(--ana) 55%, #00ccff)); color: #fff; }
.uyg-ultra-simge img { width: 100%; height: 100%; object-fit: cover; }
.uyg-ultra-simge svg { width: 22px; height: 22px; }
.uyg-ultra-yazi { flex: 1; min-width: 0; display: grid; gap: .1rem; }
.uyg-ultra-yazi small { color: var(--metin-3); font-size: .78rem; }
.uyg-ultra { max-width: 980px; }
.uyg-ultra-tepe { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; margin-bottom: .8rem; }
.uyg-ultra-tepe h2 { margin: 0; font-size: 1.15rem; }
.uyg-ultra-tepe small { color: var(--metin-3); font-size: .78rem; }
.uyg-ultra-tepe > a { margin-left: auto; }
.uyg-ultra-sekmeler { flex-wrap: wrap; margin-bottom: 1rem; }
.uyg-ultra-dl { display: grid; grid-template-columns: max-content 1fr; gap: .45rem 1rem; margin: 0; }
.uyg-ultra-dl dt { color: var(--metin-3); }
.uyg-ultra-dl dd { margin: 0; font-weight: 500; word-break: break-all; }
.uyg-baglanti { display: grid; gap: .35rem; margin-bottom: .6rem; }
.uyg-baglanti-satir { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; padding: .45rem .6rem; border: 1px solid var(--kenar); border-radius: 8px; }
.uyg-baglanti-satir > span:first-child { flex: 1; min-width: 200px; font-family: ui-monospace, Consolas, monospace; font-size: .82rem; }
.uyg-baglanti-satir small { width: 100%; color: var(--metin-3); }
.uyg-surum-liste { display: grid; gap: .3rem; }
.uyg-surum-liste > div { display: grid; grid-template-columns: minmax(120px, max-content) 110px 1fr; gap: .8rem; padding: .4rem .6rem; border-bottom: 1px solid var(--kenar); font-size: .88rem; }
.uyg-surum-liste span { color: var(--metin-2); }

/* Uygulama sayfasi: marka, belgeler (17 Eki 2026) */
.uyg-marka-oniz { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .75rem; margin-bottom: 1rem; }
.uyg-marka-kutu { display: grid; gap: .35rem; }
.uyg-marka-kutu > small { color: var(--metin-3); font-size: .75rem; }
.uyg-marka-kart { display: flex; align-items: center; gap: .6rem; padding: .7rem; border: 1px solid var(--kenar); border-radius: 12px; background: var(--kart); }
.uyg-marka-sekme { display: flex; align-items: center; gap: .45rem; padding: .45rem .7rem; border-radius: 9px 9px 0 0; background: var(--zemin-3); font-size: .8rem; max-width: 240px; }
.uyg-marka-sekme img { width: 16px; height: 16px; }
.uyg-marka-sekme span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uyg-marka-logo { display: grid; place-items: center; height: 76px; padding: .6rem; border: 1px solid var(--kenar); border-radius: 10px; background: #fff; color: #64748b; font-size: .8rem; }
.uyg-marka-logo.koyu { background: #0f172a; color: #94a3b8; }
.uyg-marka-logo img { max-height: 56px; max-width: 100%; }
.blg-duzen { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 1rem; align-items: start; }
@media (max-width: 1000px) { .blg-duzen { grid-template-columns: 1fr; } }
.blg-liste { display: grid; gap: .3rem; padding: .75rem; border: 1px solid var(--kenar); border-radius: 12px; background: var(--kart); }
.blg-yeni { display: grid; gap: .35rem; padding-bottom: .6rem; margin-bottom: .3rem; border-bottom: 1px solid var(--kenar); }
.blg-yeni input { min-height: 34px; padding: 0 .55rem; border: 1px solid var(--kenar); border-radius: 7px; background: var(--zemin-2); color: var(--metin); font: inherit; }
.blg-kat { margin: .6rem 0 .1rem; font-size: .7rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--metin-3); }
.blg-oge { display: grid; gap: .2rem; padding: .5rem .6rem; text-align: left; border: 1px solid transparent; border-radius: 8px; background: none; color: var(--metin); font: inherit; cursor: pointer; }
.blg-oge:hover { background: var(--zemin-2); }
.blg-oge.secili { border-color: var(--ana); background: color-mix(in srgb, var(--ana) 8%, var(--kart)); }
.blg-oge strong { font-size: .88rem; font-weight: 600; }
.blg-rozetler { display: flex; gap: .25rem; }
.blg-duzenleyici { min-width: 0; padding: .9rem; border: 1px solid var(--kenar); border-radius: 12px; background: var(--kart); }
.blg-alanlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .6rem; }
.blg-ek { margin: .4rem 0 .8rem; }
.blg-ek summary { cursor: pointer; color: var(--metin-2); font-size: .85rem; margin-bottom: .5rem; }
.blg-arac { display: flex; flex-wrap: wrap; gap: .25rem; margin-bottom: .4rem; }
.blg-arac button { min-height: 30px; padding: 0 .6rem; border: 1px solid var(--kenar); border-radius: 7px; background: var(--zemin-2); color: var(--metin); font: inherit; font-size: .8rem; cursor: pointer; }
.blg-arac button:hover { border-color: var(--ana); color: var(--ana); }
.blg-iki { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
@media (max-width: 1300px) { .blg-iki { grid-template-columns: 1fr; } }
.blg-metin { width: 100%; min-height: 520px; padding: .8rem; border: 1px solid var(--kenar); border-radius: 10px; background: var(--zemin-2); color: var(--metin); font: 14px/1.6 ui-monospace, Consolas, monospace; resize: vertical; }
.blg-oniz { max-height: 640px; overflow-y: auto; padding: .4rem 1rem; border: 1px solid var(--kenar); border-radius: 10px; background: var(--zemin); line-height: 1.7; }
.blg-oniz h2 { font-size: 1.25rem; margin: 1.2rem 0 .5rem; } .blg-oniz h3 { font-size: 1.05rem; margin: 1rem 0 .4rem; }
.blg-oniz img { max-width: 100%; border-radius: 8px; border: 1px solid var(--kenar); }
.blg-oniz code { padding: .1rem .3rem; border-radius: 4px; background: var(--zemin-3); }
.blg-oniz .bl-kod { padding: .8rem; border-radius: 8px; background: #0f172a; color: #e2e8f0; overflow-x: auto; }
.blg-oniz .bl-kod code { background: none; }
.blg-oniz .bl-kutu { margin: 0 0 .8rem; padding: .6rem .8rem; border-left: 4px solid var(--kenar); border-radius: 0 8px 8px 0; background: var(--zemin-2); }
.blg-oniz .bl-kutu p { margin: 0; } .blg-oniz .bl-kutu-etiket { display: block; font-size: .75rem; text-transform: uppercase; }
.blg-oniz .bl-ipucu { border-left-color: #16a34a; } .blg-oniz .bl-uyari { border-left-color: #f59e0b; } .blg-oniz .bl-not { border-left-color: var(--ana); }
.blg-oniz table { border-collapse: collapse; width: 100%; } .blg-oniz th, .blg-oniz td { border: 1px solid var(--kenar); padding: .35rem .5rem; text-align: left; }
.blg-alt { display: flex; gap: .5rem; align-items: center; margin-top: .6rem; }
.blg-oniz ol { list-style: decimal; padding-left: 1.5rem; } .blg-oniz ul { list-style: disc; padding-left: 1.4rem; }

/* Sayfa yapisi: Ust (header) · Govde · Alt (footer) gruplari (17 Eki 2026) */
.yapi-baslik { margin: 1rem 0 .4rem; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--metin-3); }
.yapi-baslik:first-child { margin-top: 0; }
.yapi-tepe { padding: .35rem; border: 1px dashed color-mix(in srgb, var(--ana) 45%, transparent); border-radius: 10px; background: color-mix(in srgb, var(--ana) 4%, transparent); }
.yapi-alt-oge { margin-left: 1.1rem; }
.bolum-liste-ad[disabled] { cursor: default; opacity: 1; }
.bolum-eylem[disabled] { opacity: .3; cursor: default; }

/* Koyu tema esi: hemen ustundeki alanin koyu temadaki degeri (17 Eki 2026) */
.alan.alan-koyu-esi { margin-top: -.35rem; padding: .5rem .65rem .55rem; border-left: 3px solid #3b4252; background: color-mix(in srgb, #1d2230 7%, transparent); border-radius: 0 8px 8px 0; }
.alan.alan-koyu-esi > label::before { content: "☾ "; opacity: .75; }
.alan.alan-koyu-esi .alan-ipucu { font-size: .72rem; }

/* Surgulu sayi alani (karartma) */
.surgu-satir { display: flex; align-items: center; gap: .5rem; }
.surgu-satir input[type="range"] { flex: 1 1 auto; min-width: 0; accent-color: var(--ana, #015798); }
.surgu-satir input[type="number"] { width: 4.6rem; flex: 0 0 auto; }
.surgu-satir .surgu-birim { opacity: .7; font-size: .85rem; }
.surgu-satir.surgu-bos input[type="range"] { opacity: .45; }