/* =========================================================================
   EMO PA5X  --  06-yonetim

   Yonetim paneli, editor, yukleyici, ayarlar ve destek talepleri

   Bu dosya pa5x.css'in bir parcasidir. Parcalar duzende sirayla
   baglanir; kaskad sirasi dosya adlarindaki numaraya baglidir.
   ========================================================================= */

/* --------------------------------------------------------------------------
   21. Yonetim paneli
   -------------------------------------------------------------------------- */
.yonetim {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: var(--a7);
    align-items: start;
    padding-top: var(--a4);
}

/* Sol ray: kutu degil, sag kenarinda kilcal cizgi */
.yonetim-ray {
    position: sticky;
    top: calc(var(--bar) + var(--a4));
    padding-right: var(--a5);
    border-right: 1px solid var(--cizgi);
}

.yonetim-ray .cip { margin-bottom: var(--a3); }

.yonetim-ray nav { display: flex; flex-direction: column; gap: 1px; }

.yonetim-ray nav a {
    display: flex;
    align-items: center;
    gap: var(--a3);
    padding: 9px 10px;
    border-radius: var(--r2);
    font-size: var(--yz-3);
    font-weight: 500;
    color: var(--yazi-3);
    transition: color var(--h1), background var(--h1);
}

.yonetim-ray nav a svg { width: 16px; height: 16px; flex: 0 0 auto; opacity: .6; }

.yonetim-ray nav a:hover { color: var(--yazi); background: var(--yuzey); }
.yonetim-ray nav a:hover svg { opacity: 1; }

.yonetim-ray nav a.etkin {
    color: var(--yazi);
    background: var(--yuzey);
    font-weight: 600;
}

.yonetim-ray nav a.etkin svg { opacity: 1; color: var(--vurgu); }

.ray-ayrac { height: 1px; background: var(--cizgi); margin: var(--a3) 10px; }

/* Bekleyen is sayaci */
.ray-sayac {
    margin-left: auto;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    display: inline-grid;
    place-items: center;
    border-radius: 10px;
    background: var(--vurgu);
    color: #180800;
    font-family: var(--f-mono);
    font-size: var(--yz-1);
    font-weight: 700;
}

.yonetim-icerik { min-width: 0; }

.yonetim-icerik .sayfa-basi { padding-top: 0; }

/* --------------------------------------------------------------------------
   26. Uye detay modali
   -------------------------------------------------------------------------- */

/* Genis modal: ekrani doldurmadan tum alanlar gorunsun diye sik duzen. */
.popup-genis { align-items: center; padding: var(--a4); }

.popup-genis .popup-ic {
    max-width: 760px;
    max-height: calc(100vh - var(--a6));
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Basligi sabit tut, yalnizca govde kaysin. */
.popup-genis .popup-bas { flex: 0 0 auto; padding: var(--a4) var(--a5) var(--a3); }
.popup-genis .popup-govde { flex: 1 1 auto; overflow-y: auto; }

.popup-yukleniyor {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--a3);
    padding: var(--a8);
    color: var(--yazi-3);
    font-size: var(--yz-4);
}

/* Listede uye adi: baglanti gibi davranan dugme */
.uye-ad {
    padding: 0;
    border: 0;
    background: none;
    color: var(--yazi);
    font: inherit;
    font-weight: 600;
    letter-spacing: inherit;
    text-align: left;
    cursor: pointer;
    border-bottom: 1px solid transparent;
    transition: color var(--h1), border-color var(--h1);
}

.uye-ad:hover { color: var(--vurgu); border-bottom-color: var(--vurgu); }

/* Etiket/deger listesi */
.veri-listesi {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--a4);
    margin: 0;
}

.veri-listesi-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.veri-listesi dt {
    font-family: var(--f-mono);
    font-size: var(--yz-1);
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--yazi-3);
    margin-bottom: 3px;
}

.veri-listesi dd {
    margin: 0;
    font-size: var(--yz-4);
    color: var(--yazi);
    word-break: break-word;
}

/* Hizli islem seridi: kaydetmeden bagimsiz tekil eylemler */
.hizli-islem {
    display: flex;
    gap: var(--a2);
    flex-wrap: wrap;
    margin-top: var(--a5);
    padding-top: var(--a4);
    border-top: 1px solid var(--cizgi);
}

.hizli-islem form { margin: 0; }

@media (max-width: 600px) {
    .veri-listesi,
    .veri-listesi-3 { grid-template-columns: 1fr; gap: var(--a3); }

    .popup-genis { padding: var(--a3); }
}

/* --------------------------------------------------------------------------
   27. Sik form duzeni (modal icin)
   -------------------------------------------------------------------------- */
.popup-govde.sik { padding: 0 var(--a5) var(--a5); }

/* Alan araligi ve yukseklikleri kisilir; 3 sutun yan yana sigar. */
.sik .alan { margin-bottom: var(--a3); gap: 3px; }

.sik .alan > label {
    font-size: var(--yz-2);
    font-weight: 500;
    color: var(--yazi-3);
}

.sik .gir,
.sik select.gir {
    height: 36px;
    padding: 0 10px;
    font-size: var(--yz-3);
    border-radius: var(--r2);
}

.sik select.gir { padding-right: 30px; background-position: calc(100% - 15px) 55%, calc(100% - 10px) 55%; }

.sik .gir:disabled { opacity: .55; }

.sik .ipucu { font-size: var(--yz-1); }

.izgara-sik { display: grid; gap: var(--a3); }
.izgara-sik.u2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.izgara-sik.u3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* Iki sutun kaplayan alan (ornegin e-posta) */
.izgara-sik .gen2 { grid-column: span 2; }

/* --- Modal basligi --- */
.uye-bas { display: flex; flex-direction: column; gap: 6px; min-width: 0; }

.uye-bas h2 { margin: 0; font-size: var(--yz-6); letter-spacing: -.03em; }

.uye-rozetler { display: flex; gap: 6px; flex-wrap: wrap; }

.uye-rozetler .rozet { height: 19px; padding: 0 7px; font-size: var(--yz-1); }

/* --- Cihaz serit: degistirilemez bilgiler tek satirda --- */
.cihaz-serit {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--a3);
    padding: var(--a3) var(--a4);
    margin-bottom: var(--a4);
    border: 1px solid var(--cizgi);
    border-left: 2px solid var(--yazi-3);
    border-radius: 0 var(--r2) var(--r2) 0;
    background: var(--yuzey-2);
}

.cihaz-serit span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

.cihaz-serit i {
    font-style: normal;
    font-family: var(--f-mono);
    font-size: var(--yz-1);
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--yazi-3);
}

.cihaz-serit b {
    font-size: var(--yz-2);
    font-weight: 600;
    color: var(--yazi-2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* --- Eylem satirlari --- */
.uye-eylem {
    display: flex;
    align-items: center;
    gap: var(--a2);
    margin-top: var(--a4);
}

.uye-eylem form { margin: 0; }

.uye-eylem-hizli {
    padding-top: var(--a3);
    border-top: 1px solid var(--cizgi);
    flex-wrap: wrap;
}

.uye-eylem-hizli:empty { display: none; }

/* --- Gecmis: tek satir, mono --- */
.uye-gecmis {
    display: flex;
    flex-wrap: wrap;
    gap: var(--a2) var(--a5);
    margin: var(--a5) 0 0;
    padding-top: var(--a4);
    border-top: 1px solid var(--cizgi);
    /* Kunye satiri: daha kucuk ve modern; daktilo goruntusunden cikarildi. */
    font-family: var(--f);
    font-size: var(--yz-1);
    letter-spacing: -.005em;
    color: var(--yazi-3);
}

.uye-gecmis b { color: var(--yazi-2); font-weight: 500; }

@media (max-width: 760px) {
    .izgara-sik.u3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .izgara-sik .gen2 { grid-column: span 2; }
    .cihaz-serit { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 520px) {
    .izgara-sik.u2,
    .izgara-sik.u3 { grid-template-columns: 1fr; }
    .izgara-sik .gen2 { grid-column: auto; }
    .cihaz-serit { grid-template-columns: 1fr; }
    .popup-genis { padding: var(--a2); }
    .popup-govde.sik { padding: 0 var(--a4) var(--a4); }
}

/* --------------------------------------------------------------------------
   28. Dosya yukleyici
   -------------------------------------------------------------------------- */

/* Birakma alani */
.birak {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: var(--a5) var(--a5);
    border: 1px dashed var(--cizgi-k);
    border-radius: var(--r3);
    background: var(--yuzey);
    text-align: center;
    cursor: pointer;
    transition: border-color var(--h1), background var(--h1);
}

.birak:hover,
.birak:focus-visible { border-color: var(--vurgu); }

.birak[data-uzerinde] {
    border-color: var(--vurgu);
    border-style: solid;
    background: var(--vurgu-is);
}

.birak > svg { width: 24px; height: 24px; color: var(--yazi-3); margin-bottom: 2px; }
.birak[data-uzerinde] > svg { color: var(--vurgu); }

.birak b { font-size: var(--yz-5); letter-spacing: -.028em; }
.birak span { font-size: var(--yz-3); color: var(--yazi-3); }
.birak u { text-decoration-color: var(--vurgu); }

.birak-sinir {
    margin-top: 6px;
    font-family: var(--f-mono);
    font-size: var(--yz-1);
    letter-spacing: .04em;
    color: var(--yazi-3);
}

.uzanti-listesi {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin: var(--a3) 0 0;
}

.uzanti-listesi code { font-size: var(--yz-1); padding: 1px 5px; color: var(--yazi-3); }

/* --- Kuyruk --- */
.kuyruk { display: flex; flex-direction: column; gap: var(--a3); }

.yuk {
    border: 1px solid var(--cizgi);
    border-radius: var(--r3);
    background: var(--yuzey);
    overflow: hidden;
    transition: opacity var(--h2), transform var(--h2);
}

.yuk-silindi { opacity: 0; transform: translateX(-12px); }

.yuk-bas {
    display: flex;
    align-items: center;
    gap: var(--a4);
    padding: var(--a4);
}

.yuk-ikon {
    width: 36px;
    height: 36px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border: 1px solid var(--cizgi);
    border-radius: var(--r2);
    color: var(--yazi-3);
}

.yuk-ikon svg { width: 18px; height: 18px; }

.yuk[data-durumu="yukleniyor"] .yuk-ikon { color: var(--vurgu); border-color: var(--vurgu); }
.yuk[data-durumu="tamam"] .yuk-ikon { color: var(--olumlu); border-color: var(--olumlu); }
.yuk[data-durumu="hata"] .yuk-ikon { color: var(--hata); border-color: var(--hata); }

.yuk-kimlik { flex: 1; min-width: 0; }

.yuk-kimlik b {
    display: block;
    font-size: var(--yz-4);
    font-weight: 600;
    letter-spacing: -.026em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.yuk-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--a1) var(--a3);
    margin-top: 3px;
    font-family: var(--f-mono);
    font-size: var(--yz-1);
    letter-spacing: .02em;
    color: var(--yazi-3);
}

.yuk[data-durumu="yukleniyor"] [data-durum] { color: var(--vurgu); }
.yuk[data-durumu="tamam"] [data-durum] { color: var(--olumlu); }
.yuk[data-durumu="hata"] [data-durum] { color: var(--hata); }
.yuk[data-durumu="durakladi"] [data-durum] { color: var(--uyari); }

/* Aktarim bitti, kayit bekliyor: dikkat cekmeli ama hata gibi durmamali */
.yuk[data-durumu="hazir"] [data-durum] { color: var(--vurgu); font-weight: 600; }
.yuk[data-durumu="hazir"] .yuk-ikon { color: var(--vurgu); border-color: var(--vurgu); }
.yuk[data-durumu="hazir"] { border-color: var(--vurgu); }

.yuk-dugmeler { display: flex; gap: 6px; flex: 0 0 auto; }

/* Ilerleme cubugu: kilcal, panelin tam genisliginde */
.yuk-cubuk {
    height: 2px;
    background: var(--yuzey-3);
    overflow: hidden;
}

.yuk-cubuk i {
    display: block;
    height: 100%;
    width: 0;
    background: var(--vurgu);
    transition: width 220ms linear;
}

.yuk[data-durumu="tamam"] .yuk-cubuk i { background: var(--olumlu); }
.yuk[data-durumu="hata"] .yuk-cubuk i { background: var(--hata); }
.yuk[data-durumu="durakladi"] .yuk-cubuk i { background: var(--uyari); }
.yuk[data-durumu="hazir"] .yuk-cubuk i { background: var(--vurgu); }

/* Ustveri alani */
.yuk-bilgi {
    padding: var(--a4);
    border-top: 1px solid var(--cizgi);
    background: var(--yuzey-2);
}

.yuk-bilgi .alan { margin-bottom: var(--a3); gap: 3px; }
.yuk-bilgi .alan > label { font-size: var(--yz-2); font-weight: 500; color: var(--yazi-3); }
.yuk-bilgi .gir,
.yuk-bilgi select.gir { height: 36px; padding: 0 10px; font-size: var(--yz-3); }
.yuk-bilgi textarea.gir { height: auto; min-height: 52px; padding: 8px 10px; font-size: var(--yz-3); }

.yuk-onay { margin-top: 20px; font-size: var(--yz-3); }

/* Sonuc seridi */
.yuk-sonuc {
    display: flex;
    align-items: center;
    gap: var(--a3);
    flex-wrap: wrap;
    padding: var(--a3) var(--a4);
    border-top: 1px solid var(--cizgi);
    background: var(--yuzey-2);
}

.sha {
    display: flex;
    align-items: center;
    gap: var(--a2);
    width: 100%;
    margin-top: 4px;
}

.sha i {
    font-style: normal;
    font-family: var(--f-mono);
    font-size: var(--yz-1);
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--yazi-3);
    flex: 0 0 auto;
}

.sha code {
    font-size: var(--yz-1);
    word-break: break-all;
    color: var(--yazi-3);
    background: none;
    border: 0;
    padding: 0;
}

@media (max-width: 600px) {
    .birak { padding: var(--a4); }
    .yuk-bas { flex-wrap: wrap; }
    .yuk-dugmeler { width: 100%; }
}

/* --------------------------------------------------------------------------
   30. Yazi duzenleme ekrani
   -------------------------------------------------------------------------- */
.yazi-duzen {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: var(--a6);
    align-items: start;
}

.gir-buyuk { height: 52px; font-size: var(--yz-6); font-weight: 600; letter-spacing: -.025em; }

.gir-yazi {
    font-family: var(--f-mono);
    font-size: var(--yz-3);
    line-height: 1.7;
    min-height: 420px;
}

.gir-dosya { height: auto; padding: 9px 12px; font-size: var(--yz-3); }

.yazi-yan { display: flex; flex-direction: column; gap: var(--a3); position: sticky; top: calc(var(--bar) + var(--a4)); }

.yan-kutu {
    padding: var(--a4);
    border: 1px solid var(--cizgi);
    border-radius: var(--r3);
    background: var(--yuzey);
}

.yan-kutu .onay { display: flex; margin-bottom: var(--a3); }
.yan-kutu .onay:last-child { margin-bottom: 0; }

.yan-eylem { background: none; border: 0; padding: 0; }

.kapak-onizleme {
    width: 100%;
    border: 1px solid var(--cizgi);
    border-radius: var(--r2);
}

/* Biçimlendirme yardımı */
.ipucu-kutu {
    margin-top: var(--a4);
    padding: var(--a4);
    border: 1px solid var(--cizgi);
    border-radius: var(--r3);
    background: var(--yuzey);
    font-size: var(--yz-3);
    color: var(--yazi-3);
}

.ipucu-kutu summary {
    cursor: pointer;
    font-weight: 550;
    color: var(--yazi-2);
    list-style: none;
}

.ipucu-kutu summary::before { content: "＋ "; color: var(--vurgu); }
.ipucu-kutu[open] summary::before { content: "－ "; }

.ipucu-kutu ul { margin: var(--a3) 0; padding-left: var(--a5); }
.ipucu-kutu li { margin-bottom: 4px; }

@media (max-width: 900px) {
    .yazi-duzen { grid-template-columns: 1fr; gap: var(--a5); }
    .yazi-yan { position: static; }
}

@media (max-width: 600px) {
    .haber-kapak { display: none; }
    .yazi { padding-top: var(--a5); }
}

/* --------------------------------------------------------------------------
   31. Metin editoru
   -------------------------------------------------------------------------- */
.editor {
    border: 1px solid var(--cizgi);
    border-radius: var(--r3);
    background: var(--yuzey);
    overflow: hidden;
    transition: border-color var(--h1), box-shadow var(--h1);
}

.editor:focus-within { border-color: var(--vurgu); box-shadow: 0 0 0 3px var(--vurgu-is); }

/* Arac cubugu */
.editor-cubuk {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 6px 8px;
    border-bottom: 1px solid var(--cizgi);
    background: var(--yuzey-2);
}

.editor-cubuk button {
    min-width: 30px;
    height: 30px;
    padding: 0 8px;
    display: inline-grid;
    place-items: center;
    border: 1px solid transparent;
    border-radius: var(--r2);
    background: none;
    color: var(--yazi-2);
    font-size: var(--yz-3);
    cursor: pointer;
    transition: all var(--h1);
}

.editor-cubuk button:hover {
    background: var(--yuzey-3);
    color: var(--yazi);
    border-color: var(--cizgi);
}

.editor-cubuk button:active { transform: translateY(1px); }

.editor-cubuk button svg { width: 15px; height: 15px; }

.editor-cubuk b { font-weight: 700; }
.editor-cubuk i { font-style: italic; font-family: Georgia, serif; }

.editor-ayrac {
    width: 1px;
    height: 18px;
    background: var(--cizgi);
    margin-inline: 5px;
}

.editor-sayac {
    font-family: var(--f-mono);
    font-size: var(--yz-1);
    letter-spacing: .03em;
    color: var(--yazi-3);
    margin-right: var(--a2);
    white-space: nowrap;
}

/* Duz metin alani: betik calisinca gizlenir, calismazsa tek yazma yolu olur */
.editor-alan {
    border: 0;
    border-radius: 0;
    background: transparent;
    min-height: 420px;
}

.editor-alan:focus { box-shadow: none; }

.editor[data-hazir] .editor-alan { display: none; }

/* Zengin yazma yuzeyi: yayinlanan yaziyla ayni gorunur */
.editor-yuzey {
    display: none;
    min-height: 420px;
    padding: var(--a5);
    outline: none;
    font-size: var(--yz-5);
    line-height: 1.72;
    color: var(--yazi-2);
    overflow-wrap: break-word;
}

.editor[data-hazir] .editor-yuzey { display: block; }

.editor-yuzey:empty::before,
.editor-yuzey > p:only-child:empty::before {
    content: "Duyuru metni...";
    color: var(--yazi-3);
    pointer-events: none;
}

/* Yuzey icindeki ogeler yazi sayfasiyla ayni bicimde gorunsun */
.editor-yuzey p { margin: 0 0 var(--a4); }
.editor-yuzey h3 { margin: var(--a5) 0 var(--a3); color: var(--yazi); }
.editor-yuzey ul,
.editor-yuzey ol { margin: 0 0 var(--a4); padding-left: var(--a5); }
.editor-yuzey li { margin-bottom: 5px; }
.editor-yuzey a { color: var(--vurgu); text-decoration: underline; text-underline-offset: 3px; }
.editor-yuzey strong { color: var(--yazi); font-weight: 600; }
.editor-yuzey code { font-size: .88em; }

.editor-yuzey blockquote {
    margin: 0 0 var(--a4);
    padding: var(--a2) 0 var(--a2) var(--a4);
    border-left: 2px solid var(--vurgu);
    color: var(--yazi-3);
    font-style: italic;
}

/* Arac cubugunda etkin bicim vurgulanir */
.editor-cubuk button[aria-pressed="true"] {
    background: var(--vurgu-is);
    border-color: var(--vurgu);
    color: var(--vurgu);
}

/* --------------------------------------------------------------------------
   32. Kapak gorseli yukleyici
   -------------------------------------------------------------------------- */
.kapak { transition: border-color var(--h1), background var(--h1); }

.kapak[data-uzerinde] {
    border-color: var(--vurgu);
    background: var(--vurgu-is);
}

/* Bos durum: kucuk birakma alani */
.kapak-bos {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: var(--a5) var(--a3);
    border: 1px dashed var(--cizgi-k);
    border-radius: var(--r2);
    background: var(--zemin);
    text-align: center;
    cursor: pointer;
    transition: border-color var(--h1), color var(--h1);
}

.kapak-bos:hover,
.kapak-bos:focus-visible { border-color: var(--vurgu); }

.kapak-bos svg { width: 20px; height: 20px; color: var(--yazi-3); margin-bottom: 4px; }
.kapak-bos b { font-size: var(--yz-3); font-weight: 600; }
.kapak-bos span { font-size: var(--yz-2); color: var(--yazi-3); }

/* Dolu durum: onizleme + uzerinde eylemler */
.kapak-onizleme {
    position: relative;
    border: 1px solid var(--cizgi);
    border-radius: var(--r2);
    overflow: hidden;
    background: var(--zemin);
}

.kapak-onizleme img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
}

/* Yukleme sirasinda gorseli soluklastirip donen gostergeyi ac */
.kapak-perde {
    position: absolute;
    inset: 0;
    display: none;
    place-items: center;
    background: color-mix(in srgb, var(--zemin) 65%, transparent);
    color: var(--vurgu);
}

.kapak[data-yukleniyor] .kapak-perde { display: grid; }
.kapak[data-yukleniyor] .kapak-eylem { display: none; }

/* Eylemler: imleç üzerindeyken belirir, dokunmatikte hep açık */
.kapak-eylem {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    gap: 6px;
    justify-content: center;
    padding: var(--a2);
    background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .55));
    opacity: 0;
    transition: opacity var(--h1);
}

.kapak-onizleme:hover .kapak-eylem,
.kapak-onizleme:focus-within .kapak-eylem { opacity: 1; }

@media (hover: none) {
    .kapak-eylem { opacity: 1; }
}

.kapak-eylem .dg { backdrop-filter: blur(4px); }

@media (max-width: 900px) {
    .editor-alan,
    .editor-yuzey { min-height: 300px; }
}

@media (max-width: 600px) {
    .editor-cubuk { flex-wrap: wrap; }
    .editor-sayac { display: none; }
}

/* --------------------------------------------------------------------------
   33. Ayarlar ekrani
   -------------------------------------------------------------------------- */
.ayar-duzen {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: var(--a6);
    align-items: start;
}

.ayar-bolum {
    padding: var(--a5);
    margin-bottom: var(--a4);
    border: 1px solid var(--cizgi);
    border-radius: var(--r3);
    background: var(--yuzey);
}

.ayar-bolum h2 {
    margin: 0 0 var(--a4);
    padding-bottom: var(--a3);
    border-bottom: 1px solid var(--cizgi);
    font-size: var(--yz-6);
    letter-spacing: -.03em;
}

.ayar-yan {
    display: flex;
    flex-direction: column;
    gap: var(--a3);
    position: sticky;
    top: calc(var(--bar) + var(--a4));
}

/* Tek sutunlu etiket/deger listesi */
.veri-listesi-tek { grid-template-columns: 1fr; gap: var(--a3); }

.veri-listesi-tek > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--a3);
}

.veri-listesi-tek dt { margin: 0; flex: 0 0 auto; }
.veri-listesi-tek dd { text-align: right; min-width: 0; }

@media (max-width: 1080px) {
    .ayar-duzen { grid-template-columns: 1fr; gap: var(--a5); }
    .ayar-yan { position: static; }
}

/* --------------------------------------------------------------------------
   34. SMTP baglanti denemesi
   -------------------------------------------------------------------------- */
.test-mail {
    margin-top: var(--a5);
    padding: var(--a4);
    border: 1px solid var(--cizgi);
    border-radius: var(--r3);
    background: var(--yuzey-2);
}

.test-mail-adres { flex: 1; min-width: 220px; height: 40px; }

.olumlu-yazi { color: var(--olumlu); }

/* --------------------------------------------------------------------------
   Destek talepleri
   -------------------------------------------------------------------------- */

/* Talep listesi ortak .liste-satir bilesenini kullanir; burada yalnizca
   talebe ozgu kucuk eklentiler var. */
.liste-satir .liste-damga.talep-no { min-width: 78px; font-size: var(--yz-2); }

/* Okunmamis mesaj isareti */
.talep-nokta {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--vurgu);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--vurgu) 22%, transparent);
}

/* Yonetim tablosunda okunmamis satir */
.tablo tr.vurgulu td { background: color-mix(in srgb, var(--vurgu) 5%, transparent); }

/* Talep listesindeki ek acilir suzgecler. Sekme ve arama kutusu projenin
   ortak .suzgec desenini kullanir; burada yalnizca kategori/oncelik
   secimlerinin dizilimi tanimlanir. */
.suzgec-ek { display: flex; flex-wrap: wrap; gap: var(--a2); margin-left: auto; }

.suzgec-ek .gir { height: 36px; width: auto; min-width: 150px; font-size: var(--yz-3); }

/* --- Detay duzeni --- */
.talep-duzen {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: var(--a7);
    align-items: start;
}

.talep-yan { display: grid; gap: var(--a4); position: sticky; top: 96px; }

@media (max-width: 1080px) {
    .talep-duzen { grid-template-columns: 1fr; gap: var(--a6); }
    .talep-yan { position: static; }
}

/* --- Yazisma --- */
.yazisma { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--a5); }

.mesaj {
    border: 1px solid var(--cizgi);
    border-radius: var(--r3);
    background: var(--yuzey);
    overflow: hidden;
}

/* Yetkili mesaji soldan turuncu seritle ayrilir. */
.mesaj.yetkili { border-left: 3px solid var(--vurgu); }

.mesaj.ic-not {
    border-left: 3px solid var(--uyari);
    background: color-mix(in srgb, var(--uyari) 6%, var(--yuzey));
}

.mesaj-bas {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--a4);
    flex-wrap: wrap;
    padding: var(--a4) var(--a5);
    border-bottom: 1px solid var(--cizgi);
}

.mesaj-kim { display: flex; align-items: center; gap: var(--a3); min-width: 0; }

.mesaj-kim > span { display: grid; gap: 1px; min-width: 0; }

.mesaj-kim b { font-size: var(--yz-4); font-weight: 600; }

.mesaj-avatar {
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--yuzey-2);
    border: 1px solid var(--cizgi);
    font-size: var(--yz-3);
    font-weight: 600;
    color: var(--yazi-2);
}

.mesaj.yetkili .mesaj-avatar {
    background: color-mix(in srgb, var(--vurgu) 16%, transparent);
    border-color: color-mix(in srgb, var(--vurgu) 35%, transparent);
    color: var(--vurgu);
}

.mesaj-araclar { display: flex; align-items: center; gap: var(--a3); flex-wrap: wrap; }

.mesaj-govde { padding: var(--a5); font-size: var(--yz-4); }

.mesaj-govde > :last-child { margin-bottom: 0; }

/* --- Mesaj ekleri --- */
.mesaj-ekler {
    list-style: none;
    margin: 0;
    padding: var(--a4) var(--a5) var(--a5);
    display: flex;
    flex-wrap: wrap;
    gap: var(--a3);
    border-top: 1px solid var(--cizgi);
}

.ek-baglanti {
    display: flex;
    align-items: center;
    gap: var(--a3);
    padding: 8px 13px;
    border: 1px solid var(--cizgi);
    border-radius: var(--r2);
    color: inherit;
    transition: all var(--h1);
}

.ek-baglanti:hover { border-color: var(--vurgu); color: var(--vurgu); }

.ek-baglanti svg { width: 17px; height: 17px; flex: 0 0 auto; color: var(--yazi-3); }

.ek-baglanti:hover svg { color: var(--vurgu); }

.ek-baglanti > span { display: grid; gap: 1px; min-width: 0; }

.ek-baglanti b { font-size: var(--yz-3); font-weight: 550; }

/* --- Yanit kutusu --- */
.yanit-kutu {
    margin-top: var(--a6);
    padding-top: var(--a5);
    border-top: 1px solid var(--cizgi);
}

.yanit-kutu h2 { font-size: var(--yz-5); letter-spacing: -.03em; margin-bottom: var(--a4); }

/* --- Dosya ekleme alani --- */
.ek-alani { margin-top: var(--a4); }

.ek-birak {
    display: flex;
    align-items: center;
    gap: var(--a4);
    padding: var(--a4) var(--a5);
    border: 1px dashed var(--cizgi-k);
    border-radius: var(--r2);
    cursor: pointer;
    transition: all var(--h1);
}

.ek-birak:hover { border-color: var(--vurgu); background: var(--yuzey-2); }

.ek-birak svg { width: 20px; height: 20px; flex: 0 0 auto; color: var(--yazi-3); }

.ek-birak > span { display: grid; gap: 2px; }

.ek-birak b { font-size: var(--yz-4); font-weight: 600; }

.ek-alani.hatali .ek-birak { border-color: var(--hata); }

/* Dosya girdisi gizlenir; etiket zaten tikliyor. */
.ek-girdi {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

.ek-girdi:focus-visible + .ek-liste,
.ek-birak:focus-within { outline: 2px solid var(--vurgu); outline-offset: 3px; }

.ek-liste { list-style: none; margin: var(--a3) 0 0; padding: 0; display: grid; gap: 4px; }

.ek-liste li {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--a4);
    padding: 6px 10px;
    border-radius: var(--r1);
    background: var(--yuzey-2);
    font-size: var(--yz-3);
}

.ek-liste li b { font-weight: 550; word-break: break-all; }

.ek-liste .ek-ozet {
    background: none;
    padding-left: 0;
    font-family: var(--f-mono);
    font-size: var(--yz-2);
    color: var(--yazi-3);
}

@media (max-width: 620px) {
    .suzgec-ek { margin-left: 0; }
    .suzgec-ek .gir { min-width: 0; width: 100%; }
}