/* TALEP PENCERESI ve KONUSMA - TEK TANIM. Iki pencere ayni yerlesimi kullanir (`.ticket-window`): Yonetim > Destek
   Talepleri (Views/Admin/AdminTicketRequest.cshtml; yalniz yonetime ozgu durum secici ve Quill editoru
   admin-ticket-request.css'te) ve kullanicinin Destek penceresi (Views/Shared/Partials/_SupportTicketModalPartial.cshtml;
   Destek sayfasi ve Destek cekmecesi ayni pencereyi acar). Her sayfada yuklenir (_StyleImportsPartial): cekmece kenar
   menusunden her sayfada acilir.

   Kabin kosesi, kenari, golgesi, baslik ve govde gorunumu ortak UST KATMAN'dan (panel-chrome.css); bu dosya YALNIZ
   yerlesim yazar, renkler tema degiskeninden.

   Yerlesim: solda KONUSMA (talebin kendi mesaji ve ekleri ilk balon, altinda yanitlar; kalan yuksekligi doldurur, kendi
   icinde kayar; altta yanit kutusu sabit), sagda AYRINTILAR (evin anahtar-deger listesi .bz-kv). Eskiden iki ayri
   kopya vardi: yonetimde gri govdede iki ozel stilli kutu, kullanici tarafinda 165 px'lik kaydirmali alanlar,
   gradyanli sohbet kutusu ve sabit renkler (support-page.css, support-quick-access.css). */

.ticket-window .modal-dialog {
    max-width: min(1320px, 97vw);
}

/* Konusma penceresi: sabit yukseklik, ICINDE kayar (sohbet duzeni). Bos alan kalmaz: konusma kalani doldurur. */
.ticket-window .modal-content {
    height: min(90vh, 900px);
}

.ticket-window .modal-body {
    display: flex;
    min-height: 0;
    padding: 0;
    overflow: hidden;
}

/* Baslik: ad + kimlik satiri solda, durum (secici ya da etiket) ve eylemler sagda, kapatma dugmesinden once. */
.ticket-window .ticket-head {
    flex: 1 1 auto;
    min-width: 0;
}

.ticket-window .ticket-head-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .2rem .45rem;
    margin-top: .2rem;
    font-size: var(--bz-font-sm);
    color: var(--bs-secondary-color);
}

.ticket-window .ticket-head-actions {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-left: auto;
    padding-left: 1rem;
}

/* Govde: iki bolum yan yana. */
.ticket-window .ticket-detail {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
}

/* Bolum basligi: kucuk, ikincil; ayirici yok - aralik bolumun dolgusundan. */
.ticket-window .ticket-section-title {
    display: block;
    margin-bottom: .5rem;
    font-size: var(--bz-font-sm);
    font-weight: 600;
    color: var(--bs-secondary-color);
}

/* --- Konusma ---------------------------------------------------------------- */

.ticket-window .ticket-thread {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.ticket-window .ticket-thread-scroll {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.ticket-window .ticket-chat-list {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: .75rem;
    padding: 1rem;
    overflow-y: auto;
}

/* Balon: talep sahibi sagda, yanitlayan solda; zemin / kenar temadan, golge yok. */
.ticket-chat-bubble {
    display: flex;
    flex-direction: column;
    max-width: 76%;
}

    .ticket-chat-bubble.ticket-chat-requester {
        margin-left: auto;
        align-items: flex-end;
    }

    .ticket-chat-bubble.ticket-chat-resolver {
        margin-right: auto;
        align-items: flex-start;
    }

.ticket-chat-meta {
    margin-bottom: .2rem;
    font-size: var(--bz-font-xs);
    color: var(--bs-secondary-color);
}

.ticket-chat-text {
    max-width: 100%;
    padding: .55rem .75rem;
    font-size: var(--bz-font-md);
    line-height: var(--bz-line-normal);
    color: var(--bs-body-color);
    background: var(--bs-body-bg);
    border: var(--bz-border-width) solid var(--bs-border-color);
    border-radius: var(--bz-radius);
}

    .ticket-chat-requester .ticket-chat-text {
        background: var(--bs-tertiary-bg);
    }

    /* Destek ekibinin yanitlari zengin metin (Quill); paragraf boslugu balonu sisirmesin. */
    .ticket-chat-text > :last-child {
        margin-bottom: 0;
    }

/* Talep sahibinin metni DUZ METIN (yazi kutusundan): HTML olarak yorumlanmaz, satir sonlari korunur. */
.ticket-chat-plain {
    white-space: pre-wrap;
}

/* Ilk mesajin ekleri balonun icinde, ince cizgiyle ayrilir. */
.ticket-chat-attachments {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    margin-top: .5rem;
    padding-top: .45rem;
    border-top: var(--bz-border-width) solid var(--bs-border-color);
    font-size: var(--bz-font-sm);
}

    .ticket-chat-attachments-title {
        font-weight: 600;
        color: var(--bs-secondary-color);
    }

    .ticket-chat-attachments small {
        color: var(--bs-secondary-color);
    }

/* Bekleme / yukleniyor / bos satiri. */
.ticket-chat-status {
    margin: auto;
    color: var(--bs-secondary-color);
}

/* Kaydirma isaretleri: listenin kayan tarafi oldugunu gosterir; tiklanmaz. */
.ticket-scroll-indicator {
    position: absolute;
    left: 50%;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: var(--bz-border-width) solid var(--bs-border-color);
    border-radius: 50%;
    background: var(--bs-body-bg);
    color: var(--bs-secondary-color);
    pointer-events: none;
    opacity: 0;
    transform: translateX(-50%);
    transition: opacity .15s ease;
}

    .ticket-scroll-indicator.is-visible {
        opacity: 1;
    }

.ticket-scroll-indicator-top {
    top: .5rem;
}

.ticket-scroll-indicator-bottom {
    bottom: .5rem;
}

/* Yanit kutusu: konusmanin altinda sabit. */
.ticket-window .ticket-chat-composer {
    flex: none;
    padding: .75rem 1rem 1rem;
    border-top: var(--bz-border-width) solid var(--bs-border-color-translucent);
}

/* Duz metin yanit kutusu (kullanici): icerikle buyur (betik), uzun yanitta kendi icinde kayar. */
.ticket-window .ticket-reply-input {
    min-height: 3.5rem;
    max-height: min(30vh, 12rem);
    resize: none;
    overflow-y: auto;
}

/* Eylem satiri: gonder sagda; yanindaki secenek (yonetimde "e-posta ile gonder") solda. */
.ticket-window .ticket-chat-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .75rem;
    margin-top: .6rem;
}

    .ticket-window .ticket-chat-actions .form-check {
        margin: 0 auto 0 0;
    }

/* Yanit yazilamazken (destek ekibinin yaniti bekleniyor) yanit kutusu yerine kisa not. */
.ticket-window .ticket-composer-note {
    display: flex;
    align-items: center;
    gap: .5rem;
    color: var(--bs-secondary-color);
}

/* --- Ayrintilar --------------------------------------------------------------- */

.ticket-window .ticket-details {
    flex: 0 0 20rem;
    min-width: 0;
    padding: 1rem;
    overflow-y: auto;
    border-left: var(--bz-border-width) solid var(--bs-border-color-translucent);
}

    /* Dar sutunda deger kendi icinde sarar (uzun e-posta). */
    .ticket-window .ticket-details dd {
        overflow-wrap: anywhere;
    }

/* Dar ekran: bolumler alt alta (ayrintilar ustte), pencere dogal boyda, govde kayar. */
@media (max-width: 991.98px) {
    .ticket-window .modal-content {
        height: auto;
    }

    .ticket-window .modal-body {
        overflow: visible;
    }

    .ticket-window .ticket-detail {
        flex-direction: column;
    }

    .ticket-window .ticket-details {
        order: -1;
        flex: none;
        border-left: 0;
        border-bottom: var(--bz-border-width) solid var(--bs-border-color-translucent);
    }

    .ticket-window .ticket-chat-list {
        max-height: 55vh;
    }
}
