﻿/* ============================================================
   LTS_Maui — app.css
   LTS kurumsal palet (ltsyazilim.com) uygulanmis tam surum.
   Not: @import kurallari CSS'te diger tum kurallardan once gelmek
   zorundadir; bu blok dosyanin en ustunde kalmalidir.
   ============================================================ */

@import url("https://cdn.jsdelivr.net/npm/ag-grid-community@31.0.3/styles/ag-grid.css");
@import url("https://cdn.jsdelivr.net/npm/ag-grid-community@31.0.3/styles/ag-theme-alpine.css");

/* ── Outfit variable font — lokal servis, offline calisir ──
   url() CSS dosyasinin konumuna gore cozulur; app.css zaten
   _content/LTS_Maui.Shared/ altindan servis edildigi icin goreli yol dogru. */

/* Latin-ext: g-breve, s-cedilla, I-dot (TR icin sart) */
@font-face {
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('fonts/outfit-latin-ext-wght-normal.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Latin: temel karakterler + c/o/u-umlaut + dotless i */
@font-face {
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('fonts/outfit-latin-wght-normal.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============================================================
   1. KURUMSAL PALET — TOKEN SETI
   Tum renkler tek yerden yonetilir. Marka rengi degisirse
   sadece bu blok guncellenir.
   ============================================================ */

:root {
    /* --- Marka renkleri --- */
    --lts-accent: #0d9e6e; /* Birincil aksiyon, link, vurgu */
    --lts-accent-dark: #0a7a55; /* Hover ve basili durum */
    --lts-accent-bright: #10c47f; /* Koyu zemin uzerinde vurgu */
    --lts-accent-soft: #d1fae5; /* Secili satir zemini */
    --lts-accent-faint: #ecfdf5; /* Hover satiri, ikon kutusu */
    --lts-accent-rgb: 13, 158, 110; /* rgba() kullanimlari icin */
    /* --- Koyu yuzeyler --- */
    --lts-ink: #1a1f2e; /* Header, footer, koyu buton */
    --lts-ink-2: #2d3548;
    /* --- Zeminler --- */
    --lts-paper: #ffffff;
    --lts-paper-2: #f7fafc; /* Input ve kart zemini */
    --lts-paper-3: #f0f9f5; /* Sayfa arka plani */
    /* --- Metin ve cizgi --- */
    --lts-text: #1a1f2e;
    --lts-muted: #64748b;
    --lts-border: rgba(0, 0, 0, .07);
    --lts-border-strong: #c9c9c9;
    /* --- Durum renkleri --- */
    --lts-danger: #dc2626;
    --lts-danger-bg: #fef2f2;
    --lts-success: #166534;
    --lts-success-bg: #f0fdf4;
    /* --- Tipografi --- */
    --lts-font: 'Outfit', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    /* Tip olcegi — 13px taban, ~1.15 oran */
    --lts-fs-xs: 10px; /* rozet, sayac */
    --lts-fs-sm: 11.5px; /* alt satir, yardimci metin */
    --lts-fs-md: 13px; /* govde, kart degeri, buton */
    --lts-fs-lg: 15px; /* kart basligi, siparis no */
    --lts-fs-xl: 18px; /* sayfa basligi */
    /* --- Bootstrap koprusu ---
       Bu degiskenler sayesinde .text-primary, .bg-primary, .border-primary
       gibi elle dokunulmayan utility siniflari otomatik marka rengine doner. */
    --bs-primary: #0d9e6e;
    --bs-primary-rgb: 13, 158, 110;
    --bs-link-color: #0d9e6e;
    --bs-link-color-rgb: 13, 158, 110;
    --bs-link-hover-color: #0a7a55;
    --lts-surface: #ffffff;
    --lts-surface-alt: #f8f9fa;
    --lts-text-muted: #5a6270;
    --lts-backdrop: rgba(26, 31, 46, .6);
    --lts-close-filter: none;
}
/* Bootstrap'in derlenmis mavi utility'leri — degisken uzerinden ezilemedigi
   icin acikca tanimlandi. 5.3'te zaten yesil doner, alt surumlerde bu blok devreye girer. */
.border-primary {
    border-color: var(--lts-accent) !important;
}

.text-primary {
    color: var(--lts-accent) !important;
}

.bg-primary {
    background-color: var(--lts-accent) !important;
}

.link-primary {
    color: var(--lts-accent) !important;
}

    .link-primary:hover,
    .link-primary:focus {
        color: var(--lts-accent-dark) !important;
    }

/* Sol kenar vurgusu — filtre seridindeki mavi detay */
.border-start.border-primary,
.border-left.border-primary {
    border-left-color: var(--lts-accent) !important;
}

/* ============================================================
   2. TEMEL / BOOTSTRAP EZMELERI
   ============================================================ */

html, body {
    font-family: var(--lts-font);
    color: var(--lts-text);
}

a, .btn-link {
    color: var(--lts-accent);
}

    a:hover, .btn-link:hover {
        color: var(--lts-accent-dark);
    }

.btn-primary {
    color: #fff;
    background-color: var(--lts-accent);
    border-color: var(--lts-accent);
}

    .btn-primary:hover,
    .btn-primary:active,
    .btn-primary:focus,
    .btn-primary:disabled {
        color: #fff !important;
        background-color: var(--lts-accent-dark) !important;
        border-color: var(--lts-accent-dark) !important;
    }

.btn-outline-primary {
    color: var(--lts-accent);
    border-color: var(--lts-accent);
}

    .btn-outline-primary:hover,
    .btn-outline-primary:active,
    .btn-outline-primary:focus {
        color: #fff !important;
        background-color: var(--lts-accent) !important;
        border-color: var(--lts-accent) !important;
    }

/* Bootstrap'in .btn-success yesili (#198754) marka yesiline cok yakin;
   yan yana gelince "iki farkli yesil" gorunumu olusuyor. Ayni tona cekildi.
   Uzun vadede markup'ta btn-success yerine btn-primary kullanmak daha dogru. */
.btn-success {
    --bs-btn-bg: var(--lts-accent);
    --bs-btn-border-color: var(--lts-accent);
    --bs-btn-hover-bg: var(--lts-accent-dark);
    --bs-btn-hover-border-color: var(--lts-accent-dark);
    --bs-btn-active-bg: var(--lts-accent-dark);
    --bs-btn-active-border-color: var(--lts-accent-dark);
    --bs-btn-disabled-bg: var(--lts-accent);
    --bs-btn-disabled-border-color: var(--lts-accent);
}

.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 .1rem #fff, 0 0 0 .25rem rgba(var(--lts-accent-rgb), .35);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--lts-accent);
}

/* Bootstrap checkbox/radio isaretli rengi derlenmis sabit (#0d6efd),
   degisken uzerinden ezilemiyor; acikca tanimlandi. */
.form-check-input:checked {
    background-color: var(--lts-accent);
    border-color: var(--lts-accent);
}

.page-item.active .page-link {
    background-color: var(--lts-accent);
    border-color: var(--lts-accent);
}

.page-link {
    color: var(--lts-accent);
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid var(--lts-accent);
}

.invalid {
    outline: 1px solid var(--lts-danger);
}

.validation-message {
    color: var(--lts-danger);
}

.blazor-error-boundary {
    background: var(--lts-danger);
    padding: 1rem 1rem 1rem 3.7rem;
    color: #fff;
}

    .blazor-error-boundary::after {
        content: "Bir hata olustu.";
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.login-box {
    width: 100%;
    max-width: 400px;
}

.table td {
    vertical-align: middle;
}

tr {
    cursor: pointer;
}

.badge {
    font-size: var(--lts-fs-sm);
    padding: 6px 8px;
}


/* ============================================================
   3. HOME — GRID KABUGU VE FILTRE CUBUGU
   ============================================================ */

.home-grid-shell {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    margin-top: 0 !important;
}

.home-filter-toolbar {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    width: 100% !important;
    margin: 0 0 6px 0 !important;
    padding: 0 !important;
}

.home-filter-date,
.home-filter-getir,
.home-filter-layout,
.home-filter-selection {
    width: auto !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    padding: 0 !important;
    margin: 0 !important;
}

.home-filter-date {
    width: 126px !important;
    flex-basis: 126px !important;
}

.home-filter-getir {
    width: 132px !important;
    flex-basis: 132px !important;
}

/* Onceki surumde bu kural dosyada uc kez tanimliydi ve son tanim
   digerlerini eziyordu. Tek kurala birlestirildi (efektif sonuc korundu). */
.home-filter-layout {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    margin-left: auto !important;
    order: 99;
}

.home-filter-selection {
    margin-left: 8px !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    order: 10;
}

.home-filter-toolbar .form-control,
.home-filter-toolbar .form-control-sm,
.home-filter-toolbar input[type="date"],
.home-filter-toolbar .btn {
    height: 28px !important;
    min-height: 28px !important;
    font-size: var(--lts-fs-md) !important;
    line-height: 1 !important;
    margin: 0 !important;
}

.home-filter-toolbar .form-control,
.home-filter-toolbar .form-control-sm,
.home-filter-toolbar input[type="date"] {
    width: 100% !important;
    padding: 2px 6px !important;
}

.home-filter-toolbar .btn {
    padding: 0 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
}


/* ============================================================
   4. GRID LAYOUT BUTONLARI
   ============================================================ */

.grid-layout-actions {
    position: relative !important;
    display: inline-flex !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
    height: 28px !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
}

    .grid-layout-actions .btn {
        height: 28px !important;
        min-height: 28px !important;
        margin: 0 0 0 -1px !important;
        border-radius: 0 !important;
        padding: 0 8px !important;
        font-size: var(--lts-fs-md) !important;
        line-height: 1 !important;
    }

        .grid-layout-actions .btn:first-child {
            margin-left: 0 !important;
            border-top-left-radius: 4px !important;
            border-bottom-left-radius: 4px !important;
        }

        .grid-layout-actions .btn:nth-of-type(3),
        .grid-layout-actions .btn:last-child {
            border-top-right-radius: 4px !important;
            border-bottom-right-radius: 4px !important;
        }


/* ============================================================
   5. AG GRID — ALPINE TEMASI
   --ag-alpine-active-color tek basina en etkili satir: checkbox tiki,
   siralama oku, focus cercevesi ve range selection kenari bundan turer.
   ============================================================ */

/* Renkler token'lardan gelir; koyu tema :root devirmeleriyle
   kendiliğinden oluşur, ayrı bir koyu AG bloğuna gerek yok. */
.ag-theme-alpine {
    --ag-alpine-active-color: var(--lts-accent);
    --ag-background-color: var(--lts-paper);
    --ag-foreground-color: var(--lts-text);
    --ag-header-background-color: var(--lts-paper-2);
    --ag-header-foreground-color: var(--lts-text);
    --ag-odd-row-background-color: var(--lts-paper-2);
    --ag-row-hover-color: var(--lts-accent-faint);
    --ag-selected-row-background-color: var(--lts-accent-soft);
    --ag-border-color: var(--lts-border);
    --ag-secondary-border-color: var(--lts-border);
    --ag-control-panel-background-color: var(--lts-paper-2);
    --ag-subheader-background-color: var(--lts-paper-2);
    --ag-chip-background-color: var(--lts-paper-2);
    --ag-input-border-color: var(--lts-border-strong);
    --ag-disabled-foreground-color: var(--lts-muted);
    --ag-checkbox-unchecked-color: var(--lts-muted);
    --ag-font-family: var(--lts-font);
    --ag-font-size: 10.5px;
    --ag-grid-size: 2.6px;
}

    .ag-theme-alpine.ag-theme-alpine {
        --ag-background-color: var(--lts-paper-2);
        --ag-odd-row-background-color: var(--lts-paper);
        --ag-alpine-active-color: var(--lts-accent);
        --ag-background-color: var(--lts-paper);
        --ag-foreground-color: var(--lts-text);
        --ag-header-background-color: var(--lts-paper-2);
        --ag-header-foreground-color: var(--lts-text);
        --ag-odd-row-background-color: var(--lts-paper-2);
        --ag-row-hover-color: var(--lts-accent-faint);
        --ag-selected-row-background-color: var(--lts-accent-soft);
        --ag-border-color: var(--lts-border);
        --ag-secondary-border-color: var(--lts-border);
        --ag-control-panel-background-color: var(--lts-paper-2);
        --ag-subheader-background-color: var(--lts-paper-2);
        --ag-chip-background-color: var(--lts-paper-2);
        --ag-input-border-color: var(--lts-border-strong);
        --ag-disabled-foreground-color: var(--lts-muted);
        --ag-checkbox-unchecked-color: var(--lts-muted);
        --ag-font-family: var(--lts-font);
        --ag-font-size: 10.5px;
        --ag-grid-size: 2.6px;
    }

.home-ag-grid {
    flex: 1 1 auto;
    min-height: 0;
    height: calc(100vh - 78px) !important;
    width: 100% !important;
    margin: auto;
}

.home-grid-shell .ag-theme-alpine .ag-row,
.siparis-list-ag-grid .ag-row {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    border-left: none !important;
    border-bottom: 1px solid var(--lts-border);
}

.home-grid-shell .ag-theme-alpine .ag-cell,
.siparis-list-ag-grid .ag-cell {
    padding: 2px 6px !important;
    border-left: none !important;
    line-height: 14px !important;
    display: flex;
    align-items: center;
    justify-content: center !important;
    text-align: center !important;
    overflow: hidden !important;
    white-space: nowrap !important;
}

.home-grid-shell .ag-theme-alpine .ag-row-hover {
    border-left: none !important;
}

.home-grid-shell .ag-theme-alpine .ag-header-cell-label {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 16px !important;
    padding: 4px 4px !important;
}

.home-grid-shell .ag-theme-alpine .ag-header {
    height: auto !important;
    min-height: 32px !important;
}

.home-grid-shell .ag-theme-alpine .ag-header-cell {
    height: auto !important;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
    display: flex !important;
    align-items: center !important;
}

    /* Secim kolonundaki header checkbox'i ortala */
    .home-grid-shell .ag-theme-alpine .ag-header-cell[col-id="selected"] .ag-header-cell-label {
        justify-content: center !important;
        align-items: center !important;
    }

.home-grid-shell .ag-theme-alpine .ag-pinned-right-cols-container .ag-cell {
    border-left: 2px solid #ccc !important;
}

.home-grid-shell .ag-theme-alpine .ag-row:not(.ag-row-first) {
    border-top-width: 1px !important;
}

.home-grid-shell .ag-theme-alpine .btn-sm {
    padding: 1px 4px !important;
    font-size: 10px !important;
    line-height: 1 !important;
}

.home-grid-shell .ag-theme-alpine .ag-paging-panel {
    padding: 15px 17px !important;
    font-size: 13px !important;
    height: 50px !important;
    line-height: 50px !important;
    min-width: 80px !important;
}

.home-grid-shell .ag-side-bar,
.home-grid-shell .ag-tool-panel-wrapper {
    z-index: 50;
}

.home-grid-shell .ag-column-drop,
.home-grid-shell .ag-column-select-list {
    font-size: 12px;
}

.home-grid-shell .ag-cell .badge {
    font-size: var(--lts-fs-xs) !important;
    padding: 2px 5px !important;
    line-height: 1 !important;
    border-radius: 3px;
}

.home-grid-shell .home-grid-action {
    height: 18px !important;
    min-height: 18px !important;
    white-space: nowrap !important;
}

.home-grid-shell .home-ag-musteri-cell {
    align-items: center !important;
}

.home-ag-customer {
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1px;
    overflow: hidden;
    line-height: 14px;
}

.home-ag-customer-line {
    display: block;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 14px;
}

.home-ag-select-cell {
    justify-content: center;
}

/* Kompakt grid metin boyutu */
.home-grid-shell .ag-theme-alpine .ag-cell,
.home-grid-shell .ag-theme-alpine .ag-header-cell-label,
.home-grid-shell .home-ag-customer,
.home-grid-shell .home-ag-customer-line {
    font-size: 10.5px !important;
}


/* ============================================================
   6. KOLON PANELI (SURUKLE-BIRAK)
   ============================================================ */

.column-panel {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 280px;
    height: 300px;
    background: var(--lts-paper);
    border: 1px solid var(--lts-border-strong);
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, .25);
    padding: 10px;
    z-index: 9999;
    display: none;
    overflow-y: auto;
    overflow-x: hidden;
}

.column-dropzone {
    max-height: 230px;
    overflow-y: auto;
    border: 2px dashed #bbb;
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 8px;
    font-size: var(--lts-fs-md);
    color: var(--lts-muted);
    transition: .2s ease;
}

    .column-dropzone.drag-over {
        background: var(--lts-accent-faint);
        border-color: var(--lts-accent);
        color: var(--lts-accent);
    }

.column-badge {
    background: var(--lts-paper-2);
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 4px 6px;
    margin: 3px;
    font-size: var(--lts-fs-sm);
    cursor: pointer;
    width: 90%;
    text-align: center;
    user-select: none;
}

#closeColumnPanel {
    position: absolute;
    top: 5px;
    right: 8px;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 1000000;
    font-size: var(--lts-fs-xl);
    background: var(--lts-paper);
    border: none;
    border-radius: 4px;
}

.home-column-drag-ghost {
    position: fixed;
    background: var(--lts-accent);
    color: #fff;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: var(--lts-fs-sm);
    z-index: 999999;
    pointer-events: none;
}


/* ============================================================
   7. GRID AYAR MENUSU
   (Onceki surumde bu blok dosyada iki kez tekrarliyordu, teke indirildi.)
   ============================================================ */

.grid-settings-wrapper {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    height: 28px;
}

.grid-settings-button {
    width: 34px !important;
    min-width: 34px !important;
    padding: 0 !important;
    font-size: var(--lts-fs-md) !important;
    color: var(--lts-accent) !important;
    border-color: var(--lts-accent) !important;
    background: var(--lts-paper) !important;
}

    .grid-settings-button:hover,
    .grid-settings-button:focus {
        color: #fff !important;
        background: var(--lts-accent) !important;
        border-color: var(--lts-accent) !important;
    }

.grid-settings-menu {
    position: absolute;
    top: 32px;
    right: 0;
    z-index: 2147482500;
    width: 145px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 6px;
    background: var(--lts-paper);
    border: 1px solid var(--lts-border-strong);
    border-radius: 4px;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .22);
}

    .grid-settings-menu .btn {
        width: 100% !important;
        justify-content: flex-start !important;
        border-radius: 4px !important;
        margin: 0 !important;
    }


/* ============================================================
   8. DOSYA YUKLEME
   ============================================================ */

.upload-box {
    overflow: hidden;
    min-height: 82px;
}

.upload-file-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.upload-file-size {
    flex: 0 0 auto;
    white-space: nowrap;
    font-size: var(--lts-fs-sm);
    color: var(--lts-muted);
}

.file-overlay {
    position: absolute;
    inset: 0;
    opacity: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    font-size: 0;
}

/* ============================================================
   10. MOBIL BILESENLER
   ============================================================ */

/* Mobil filtre cubugu scroll'da ustte kalsin */
.mobile-filter-bar {
    position: sticky;
    top: 0;
    z-index: 5;
    background: var(--bs-body-bg, #fff);
    padding: .35rem 0;
}

    /* Filtre cubugu kontrolleri. Bu blok bilerek sayfa scope'suz:
       SiparisList, SiparisTeslimat, SiparisEvrakKayit ve Home ayni
       filtre cubugunu kullaniyor, punto hepsinde ayni olmali. */
    .mobile-filter-bar .form-control,
    .mobile-filter-bar .form-select,
    .mobile-filter-bar .input-group-text {
        font-size: var(--lts-fs-md);
        padding: 3px 7px;
        border-radius: 7px;
    }

    /* Alan secici, arama kutusuyla ayni satirda dar dursun */
    .mobile-filter-bar .mobile-field-select {
        flex: 0 0 36%;
        max-width: 36%;
        font-size: var(--lts-fs-md);
        padding: 3px 4px;
    }

/* Mobil siparis karti — kompakt gorunum */
.mobile-order-card .card-body,
.mobile-order-card .card-footer {
    font-size: var(--lts-fs-md);
}

.mobile-order-card .btn-sm {
    --bs-btn-padding-y: .2rem;
    --bs-btn-font-size: var(--lts-fs-md);
}

/* Mobil ust blok (tarih + arama) scroll'da sabit kalir */
.mobile-sticky-head {
    position: sticky;
    top: 0;
    z-index: 5;
    background: var(--bs-body-bg, #fff);
    padding: .35rem 0 .25rem;
}

.mobile-top-toolbar {
    margin-bottom: .35rem;
}

    /* Tarih input'lari dar ekranda tasmasin */
    .mobile-top-toolbar .mobile-date-input {
        min-width: 0;
        padding: .2rem .3rem;
        font-size: var(--lts-fs-md);
    }

    .mobile-top-toolbar .mobile-toolbar-btn {
        --bs-btn-padding-x: .55rem;
        --bs-btn-padding-y: .2rem;
        --bs-btn-font-size: var(--lts-fs-md);
    }


/* ============================================================
   11. QR OKUYUCU KATMANI
   ============================================================ */

.lts-qr-overlay {
    position: fixed;
    inset: 0;
    z-index: 20000;
    background: #000;
}

.lts-qr-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lts-qr-frame {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 70vw;
    max-width: 320px;
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
    border: 3px solid var(--lts-accent-bright);
    border-radius: 16px;
    box-shadow: 0 0 0 100vmax rgba(0, 0, 0, .45);
}

.lts-qr-close {
    position: absolute;
    left: 50%;
    bottom: 24px;
    transform: translateX(-50%);
    padding: 10px 28px;
    border: none;
    border-radius: 999px;
    background: #fff;
    font-weight: 600;
}


/* ============================================================
   12. RESPONSIVE
   Media query'ler dosyanin sonunda toplandi ki ustteki kurallari
   guvenle ezsinler.
   ============================================================ */

/* --- MASAUSTU --- */
@media (min-width: 768px) {
    html,
    body {
        overflow: hidden;
    }

    .content {
        padding-top: .35rem !important;
    }

    .home-grid-shell {
        height: calc(100vh - 12px);
    }
}

/* --- MOBIL --- */
@media (max-width: 767px) {
    .home-filter-layout {
        display: none !important;
    }

    .home-filter-toolbar {
        position: sticky !important;
        top: 0 !important;
        z-index: 50 !important;
        background: var(--lts-paper) !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
        padding: 6px !important;
        border-bottom: 1px solid #eee;
    }

    .home-filter-date {
        flex: 1 1 48% !important;
        width: 48% !important;
    }

    .home-filter-getir {
        flex: 1 1 100% !important;
        width: 100% !important;
    }

    .home-filter-toolbar .btn {
        width: 100% !important;
    }

    .home-filter-toolbar .btn-success {
        font-weight: 600;
    }
}
/* Telefon yatay modu.
   Sabit yukseklik + overflow:hidden yerine sayfa dogal akisinda kayar;
   grid'e calisilabilir bir min-height verilir. Boylece filtre karti
   buyudugunde ya da klavye acildiginda icerik kirpilmaz. */
@media (max-height: 600px) {

    html,
    body {
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    .siparis-page {
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
        padding-bottom: env(safe-area-inset-bottom, 0px) !important;
    }

    .siparis-filter-card {
        flex: 0 0 auto !important;
        margin-bottom: 4px !important;
    }

        .siparis-filter-card .card-body {
            padding: 4px 8px !important;
        }

    .siparis-desktop-area {
        height: calc(100dvh - 104px) !important;
        min-height: 240px !important;
        overflow: visible !important;
    }

    .siparis-list-ag-grid {
        height: 100% !important;
        min-height: 240px !important;
    }
}

/* Yatayda centik/kavisli kenar payi. viewport-fit=cover olmadan bu degerler
   0 doner; App.razor'daki meta guncellenmeli. */
@media (orientation: landscape) {
    body {
        padding-left: env(safe-area-inset-left, 0px);
        padding-right: env(safe-area-inset-right, 0px);
    }
}

/* ============================================================
   13. LOGIN EKRANI
   Global surum: scoped CSS (.razor.css) yerine app.css icinde.
   ::deep kaldirildi — global CSS'te scope izolasyonu olmadigi icin
   InputText'in urettigi <input>'a dogrudan ulasilir.
   Tum siniflar "lts-" onekli, cakisma riski yok.
   ============================================================ */

/* ---------- Layout kabugu ---------- */

.login-shell {
    /* dvh: mobil tarayicida adres cubugu acilip kapandiginda
       yukseklik zipmasin. Desteklemeyen tarayici vh'ye duser. */
    min-height: 100vh;
    min-height: 100dvh;
    width: 100%;
    display: flex;
    background: var(--lts-paper-3, #f0f9f5);
    padding-top: env(safe-area-inset-top, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    overflow-x: hidden;
}

.lts-login {
    position: relative;
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    width: 100%;
    min-height: 100%;
    background: var(--lts-paper, #fff);
}


/* ---------- SOL: marka paneli ---------- */

.lts-login__brand {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 3rem 3.5rem;
    background: var(--lts-ink, #1a1f2e);
    color: #fff;
    overflow: hidden;
}

    /* Sag ustten inen yumusak yesil isik */
    .lts-login__brand::before {
        content: "";
        position: absolute;
        top: -30%;
        right: -20%;
        width: 70%;
        aspect-ratio: 1;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(16, 196, 127, .22) 0%, transparent 70%);
        pointer-events: none;
    }

    /* Alt kenarda ince marka seridi */
    .lts-login__brand::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 3px;
        background: linear-gradient(90deg, var(--lts-accent, #0d9e6e), var(--lts-accent-bright, #10c47f));
    }

.lts-brand__head {
    position: relative;
    display: flex;
    align-items: center;
    gap: .55rem;
}

.lts-brand__mark {
    font-size: 1.9rem;
    font-weight: 900;
    letter-spacing: -.04em;
    line-height: 1;
}

.lts-brand__badge {
    background: var(--lts-accent, #0d9e6e);
    color: #fff;
    font-size: .6rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: .22rem .5rem;
    border-radius: 4px;
}

.lts-brand__body {
    position: relative;
    margin: 3rem 0;
}

.lts-brand__title {
    font-size: clamp(1.7rem, 2.6vw, 2.5rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -.03em;
    margin: 0 0 1rem;
}

    /* Siteki italik serif vurgusu */
    .lts-brand__title em {
        font-family: 'Lora', Georgia, serif;
        font-style: italic;
        font-weight: 600;
        color: var(--lts-accent-bright, #10c47f);
    }

.lts-brand__text {
    font-size: .95rem;
    line-height: 1.75;
    color: rgba(255, 255, 255, .55);
    max-width: 34ch;
    margin: 0 0 2rem;
}

.lts-brand__pillars {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .7rem;
}

    .lts-brand__pillars li {
        display: flex;
        align-items: center;
        gap: .7rem;
        font-size: .87rem;
        color: rgba(255, 255, 255, .78);
    }

        .lts-brand__pillars li::before {
            content: "✓";
            flex-shrink: 0;
            width: 20px;
            height: 20px;
            border-radius: 50%;
            background: rgba(16, 196, 127, .16);
            color: var(--lts-accent-bright, #10c47f);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: .68rem;
            font-weight: 800;
        }

.lts-brand__foot {
    position: relative;
    display: flex;
    align-items: center;
    gap: .55rem;
    font-size: .76rem;
    font-weight: 600;
    letter-spacing: .04em;
    color: rgba(255, 255, 255, .4);
}

.lts-brand__pulse {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--lts-accent-bright, #10c47f);
    animation: ltsPulse 2s infinite;
}

@keyframes ltsPulse {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: .25;
    }
}


/* ---------- SAG: form paneli ---------- */

.lts-login__panel {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3rem 2rem;
    background: var(--lts-paper, #fff);
}

.lts-login__inner {
    width: 100%;
    max-width: 380px;
}

.lts-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--lts-accent, #0d9e6e);
    background: var(--lts-accent-faint, #ecfdf5);
    border: 1px solid rgba(13, 158, 110, .2);
    padding: .35rem .85rem;
    border-radius: 100px;
    margin-bottom: 1.4rem;
}

.lts-eyebrow__dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--lts-accent-bright, #10c47f);
}

.lts-login__title {
    font-size: 1.85rem;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -.03em;
    color: var(--lts-text, #1a1f2e);
    margin: 0 0 .5rem;
}

    .lts-login__title em {
        font-family: 'Lora', Georgia, serif;
        font-style: italic;
        font-weight: 600;
        color: var(--lts-accent, #0d9e6e);
    }

.lts-login__sub {
    font-size: .9rem;
    line-height: 1.6;
    color: var(--lts-muted, #64748b);
    margin: 0 0 2rem;
}


/* ---------- Form alanlari ---------- */

.lts-form {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
}

.lts-label {
    display: block;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--lts-muted, #64748b);
    margin-bottom: .45rem;
}

.lts-input {
    position: relative;
    display: flex;
    align-items: center;
}

.lts-input__icon {
    position: absolute;
    left: .9rem;
    width: 17px;
    height: 17px;
    color: var(--lts-muted, #64748b);
    pointer-events: none;
    transition: color .2s;
}

.lts-input .form-control {
    width: 100%;
    height: 46px;
    background: var(--lts-paper-2, #f7fafc);
    border: 1.5px solid var(--lts-border, rgba(0, 0, 0, .07));
    border-radius: 10px;
    padding: 0 .95rem 0 2.75rem;
    font-family: inherit;
    font-size: .92rem;
    color: var(--lts-text, #1a1f2e);
    outline: none;
    transition: border-color .2s, box-shadow .2s, background .2s;
    -webkit-appearance: none;
}

    .lts-input .form-control::placeholder {
        color: #a8b3c1;
    }

    .lts-input .form-control:focus {
        background: #fff;
        border-color: var(--lts-accent, #0d9e6e);
        box-shadow: 0 0 0 3px rgba(13, 158, 110, .12);
    }

    /* Blazor gecersiz alan isareti */
    .lts-input .form-control.invalid {
        border-color: var(--lts-danger, #dc2626);
        outline: none;
    }

/* Ikon, alan focus'landiginda marka rengine doner */
.lts-input:focus-within .lts-input__icon {
    color: var(--lts-accent, #0d9e6e);
}

/* Sifre alaninda sagda ekstra bosluk birak */
.lts-input:has(.lts-input__toggle) .form-control {
    padding-right: 2.9rem;
}

.lts-input__toggle {
    position: absolute;
    right: .5rem;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: 7px;
    color: var(--lts-muted, #64748b);
    cursor: pointer;
    padding: 0;
    transition: background .2s, color .2s;
}

    .lts-input__toggle svg {
        width: 17px;
        height: 17px;
    }

    .lts-input__toggle:hover {
        background: var(--lts-accent-faint, #ecfdf5);
        color: var(--lts-accent, #0d9e6e);
    }


/* ---------- Dogrulama mesajlari ---------- */

.lts-validation .validation-errors {
    list-style: none;
    margin: 0;
    padding: .7rem .9rem;
    background: var(--lts-danger-bg, #fef2f2);
    border: 1px solid rgba(220, 38, 38, .18);
    border-radius: 9px;
}

.lts-validation .validation-message {
    display: block;
    font-size: .8rem;
    line-height: 1.5;
    color: var(--lts-danger, #dc2626);
}

/* Hata yokken bosluk birakmasin */
.lts-validation:empty {
    display: none;
}


/* ---------- Gonder butonu ---------- */

.lts-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    width: 100%;
    height: 48px;
    margin-top: .5rem;
    background: var(--lts-ink, #1a1f2e);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-family: inherit;
    font-size: .92rem;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(26, 31, 46, .18);
    transition: background .2s, transform .15s, box-shadow .2s;
}

    .lts-submit svg {
        width: 17px;
        height: 17px;
        transition: transform .2s;
    }

    /* Siteki kalip: koyu buton, hover'da marka yesiline doner */
    .lts-submit:hover:not(:disabled) {
        background: var(--lts-accent, #0d9e6e);
        transform: translateY(-1px);
        box-shadow: 0 6px 20px rgba(13, 158, 110, .28);
    }

        .lts-submit:hover:not(:disabled) svg {
            transform: translateX(3px);
        }

    .lts-submit:active:not(:disabled) {
        transform: translateY(0);
    }

    .lts-submit:disabled {
        background: var(--lts-muted, #64748b);
        cursor: not-allowed;
        box-shadow: none;
    }

.lts-login__foot {
    margin: 1.6rem 0 0;
    font-size: .78rem;
    line-height: 1.6;
    text-align: center;
    color: var(--lts-muted, #64748b);
}


/* ---------- Spinner ---------- */

.lts-spinner {
    width: 15px;
    height: 15px;
    border: 2px solid rgba(255, 255, 255, .3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: ltsSpin .7s linear infinite;
}

.lts-spinner--lg {
    width: 26px;
    height: 26px;
    border-width: 2.5px;
    border-color: rgba(255, 255, 255, .18);
    border-top-color: var(--lts-accent-bright, #10c47f);
}

@keyframes ltsSpin {
    to {
        transform: rotate(360deg);
    }
}


/* ---------- Oturum kontrol splash'i ---------- */

.lts-splash {
    position: absolute;
    inset: 0;
    z-index: 20;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.6rem;
    background: var(--lts-ink, #1a1f2e);
}

.lts-splash__mark {
    font-size: 2.2rem;
    font-weight: 900;
    letter-spacing: -.04em;
    color: #fff;
}


/* ---------- Responsive ---------- */

/* Tablet ve alti: marka paneli ustte kompakt seride doner */
@media (max-width: 900px) {
    .lts-login {
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr;
    }

    .lts-login__brand {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding: 1.1rem 1.5rem;
    }

        .lts-login__brand::before {
            display: none;
        }

    .lts-brand__body,
    .lts-brand__foot {
        display: none;
    }

    .lts-brand__head {
        gap: .5rem;
    }

    .lts-brand__mark {
        font-size: 1.4rem;
    }

    .lts-login__panel {
        padding: 2.5rem 1.5rem;
        align-items: flex-start;
    }
}

@media (max-width: 400px) {
    .lts-login__panel {
        padding: 2rem 1.1rem;
    }

    .lts-login__title {
        font-size: 1.55rem;
    }
}

/* Hareket azaltma tercihine saygi */
@media (prefers-reduced-motion: reduce) {
    .lts-brand__pulse,
    .lts-spinner {
        animation: none;
    }

    .lts-submit,
    .lts-submit svg {
        transition: none;
    }
}
/* Logo dikey ortada, durum satiri sol altta sabit */
.lts-login__brand {
    justify-content: center;
    align-items: center;
}

/* Beyaz cip: siyah kutular koyu zeminde kaybolmasin.
   Logoya dokunmadan kontrast sorununu cozer. */
.lts-brand__chip {
    position: relative;
    display: inline-flex;
    background: #fff;
    padding: 1.4rem 1.9rem;
    border-radius: 16px;
    box-shadow: 0 18px 44px rgba(0, 0, 0, .3);
}

.lts-brand__logo {
    display: block;
    width: auto;
}

.lts-brand__logo--tam {
    height: 100px;
}

.lts-brand__logo--mini {
    display: none;
}

.lts-brand__foot {
    position: absolute;
    left: 3.5rem;
    bottom: 3rem;
}

/* ============================================================
   14. SİPARİŞ LİSTESİ (/siparisler)
   SiparisList.razor icindeki <style> blogundan tasindi.

   Kapsam notu: app.css'te ayni isimde kurallar zaten var
   (.column-panel, .column-badge, .grid-settings-*, .mobile-filter-bar).
   Cakismayi onlemek icin sayfaya ozgu olanlar .siparis-page altina,
   JS ile body'e eklenenler ise id/benzersiz sinif uzerinden hedeflendi.
   ============================================================ */

.siparis-page {
    background: var(--lts-paper-3);
    min-height: 100%;
    font-size: var(--lts-fs-md);
}


/* ---------- Kartlar ---------- */

.siparis-filter-card,
.siparis-state-card,
.siparis-mobile-card {
    border: 1px solid var(--lts-border);
    border-radius: 12px;
    overflow: visible;
    background-color: var(--lts-paper);
    /* Sol vurgu seridi arka planin parcasi olarak ciziliyor.
       border-left kullanildiginda yuvarlak kosedeki renk gecisi koyu
       temada kayboluyor ve serit kisa gorunuyor. */
    background-image: linear-gradient(to right, var(--lts-accent) 0 4px, transparent 4px);
    background-repeat: no-repeat;
    box-shadow: 0 2px 10px rgba(15, 23, 42, .06);
}

    .siparis-filter-card .card-body {
        padding: 4px 8px;
    }


/* ---------- Filtre satırı ---------- */

.siparis-page .filter-input,
.siparis-page .filter-btn {
    height: 28px;
    min-height: 28px;
    border-radius: 7px;
    font-size: var(--lts-fs-md);
    padding: 2px 7px;
}

.siparis-page .filter-btn {
    font-weight: 600;
}


/* ---------- AG Grid ---------- */

.siparis-desktop-area {
    height: calc(100vh - 118px);
    min-height: 520px;
}

/* Bu grid .home-grid-shell altinda olmadigi icin LTS temasini
   ayrica almasi gerekiyor; aksi halde Alpine'in varsayilan mavisi kalir. */
.ag-theme-alpine.siparis-list-ag-grid {
    --ag-alpine-active-color: var(--lts-accent);
    --ag-header-background-color: var(--lts-paper-2);
    --ag-header-foreground-color: var(--lts-text);
    --ag-odd-row-background-color: var(--lts-paper-2);
    --ag-row-hover-color: var(--lts-accent-faint);
    --ag-selected-row-background-color: var(--lts-accent-soft);
    --ag-border-color: var(--lts-border);
    --ag-font-family: var(--lts-font);
}

.siparis-list-ag-grid {
    width: 100%;
    height: 100%;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--lts-border);
    background: var(--lts-paper);
}

    /* Masaüstü + tablet filtre ikonları hep görünsün */
    .siparis-list-ag-grid .ag-header-cell-menu-button,
    .siparis-list-ag-grid .ag-header-cell-filter-button {
        opacity: 1 !important;
        visibility: visible !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 24px !important;
        height: 24px !important;
        cursor: pointer !important;
        z-index: 999 !important;
    }

    /* Tıklama butona gitsin */
    .siparis-list-ag-grid .ag-icon-menu,
    .siparis-list-ag-grid .ag-icon-filter {
        pointer-events: auto !important;
    }

    .siparis-list-ag-grid .ag-header-cell,
    .siparis-list-ag-grid .ag-header-cell-label {
        overflow: visible !important;
    }


/* ---------- Grid ayar menüsü (sayfaya özgü) ---------- */

.siparis-page .grid-settings-wrapper {
    position: relative;
    width: 100%;
}

.siparis-page .grid-settings-button {
    height: 28px;
    border-radius: 7px;
}

.siparis-page .grid-settings-menu {
    position: absolute;
    top: 38px;
    right: 0;
    z-index: 50;
    min-width: 150px;
    padding: 8px;
    background: var(--lts-paper);
    border: 1px solid var(--lts-border);
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .15);
    display: grid;
    gap: 6px;
}


/* ---------- Sütun paneli (JS ile body'e eklenir) ---------- */

#siparisListAgColumnPanel {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 9999;
    width: 260px;
    padding: 12px;
    display: none;
    background: var(--lts-paper);
    border: 1px solid var(--lts-border);
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .18);
}

    #siparisListAgColumnPanel #closeSiparisListColumnPanel {
        position: absolute;
        top: 8px;
        right: 8px;
        border: none;
        background: transparent;
        font-size: var(--lts-fs-md);
    }

    #siparisListAgColumnPanel .column-dropzone {
        min-height: 80px;
        border: 1px dashed var(--lts-border-strong);
        border-radius: 10px;
        padding: 8px;
        background: var(--lts-paper-2);
    }

        #siparisListAgColumnPanel .column-dropzone p {
            font-size: var(--lts-fs-sm);
            color: var(--lts-muted);
            margin: 0;
        }

    #siparisListAgColumnPanel .column-badge {
        display: inline-block;
        width: auto;
        margin: 3px;
        padding: 4px 8px;
        background: var(--lts-accent-faint);
        border: 1px solid rgba(var(--lts-accent-rgb), .25);
        border-radius: 999px;
        font-size: var(--lts-fs-sm);
        cursor: pointer;
    }

/* Sürükleme hayaleti (body'e eklenir) */
.siparis-list-column-drag-ghost {
    position: absolute;
    z-index: 10000;
    pointer-events: none;
    padding: 4px 8px;
    border-radius: 8px;
    border: 1px solid rgba(var(--lts-accent-rgb), .3);
    background: var(--lts-accent-faint);
    color: var(--lts-text);
    font-size: var(--lts-fs-sm);
    font-weight: 600;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .18);
}


/* ---------- Durum rozetleri ---------- */

.status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 7px;
    border-radius: 999px;
    font-size: var(--lts-fs-xs);
    font-weight: 700;
    white-space: nowrap;
    line-height: 1.2;
}

/* Yüklendi */
.status-warning {
    background: #fef3c7;
    color: #92400e;
}

/* İşlemde */
.status-info {
    background: #dbeafe;
    color: #1e40af;
}

/* Teslim edildi — tamamlanmis is icin marka yesili */
.status-success {
    background: var(--lts-accent-soft);
    color: #065f46;
}

.status-secondary {
    background: #eef2f7;
    color: var(--lts-muted);
}


/* ---------- Mobil kartlar ---------- */

.siparis-page .compact-main-text {
    font-size: var(--lts-fs-md);
    line-height: 1.15;
}

.siparis-page .compact-sub-text {
    font-size: var(--lts-fs-sm);
    line-height: 1.1;
    margin-top: 1px;
}

.mobile-info-group {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--lts-border);
    background: var(--lts-paper-2);
    padding: 6px 8px 6px 11px;
    border-radius: 9px;
    margin-bottom: 5px;
}

    /* Sol vurgu seridi: border-left yerine pseudo-element.
       Border kullanildiginda yuvarlak kosedeki renk gecisi koyu temada
       kayboluyor ve serit kisa gorunuyor. */
    .mobile-info-group::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        width: 3px;
        background: var(--lts-accent);
    }

.mobile-value {
    font-size: var(--lts-fs-md);
    font-weight: 600;
    color: var(--lts-text);
}

.mobile-action-btn {
    font-size: var(--lts-fs-md);
    padding: 5px 8px;
}


/* ---------- Grid satır aksiyonları ---------- */

.siparis-action-cell {
    display: flex;
    justify-content: flex-end;
    gap: 4px;
    align-items: center;
    height: 100%;
}

.siparis-list-grid-action {
    width: 20px;
    height: 20px;
    padding: 0;
    border-radius: 4px;
    border: 1px solid;
    font-size: var(--lts-fs-xs);
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--lts-paper);
    cursor: pointer;
}

.action-edit {
    color: var(--lts-accent);
    border-color: var(--lts-accent);
}

    .action-edit:hover {
        background: var(--lts-accent);
        color: #fff;
    }

.action-delete {
    color: var(--lts-danger);
    border-color: var(--lts-danger);
}

    .action-delete:hover {
        background: var(--lts-danger);
        color: #fff;
    }


/* ---------- Silme modalı (.siparis-page dışında render edilir) ---------- */

.sil-modal-content {
    border-radius: 12px;
}

.sil-textarea {
    font-size: var(--lts-fs-md);
    border-radius: 8px;
    resize: vertical;
}


/* ---------- Mobil arama çubuğu (sayfaya özgü) ---------- */

.siparis-page .mobile-filter-bar {
    position: sticky;
    top: 0;
    z-index: 5;
    background: var(--lts-paper-3);
    padding: 4px 0 6px;
    margin-bottom: 2px;
}



/* ---------- Sipariş listesi responsive ---------- */

@media (min-width: 768px) and (max-width: 1199px) {
    .siparis-desktop-area {
        height: calc(100dvh - 120px);
        min-height: 480px;
    }

    .siparis-list-ag-grid {
        height: 100%;
    }
}

/* Telefon yatay modu */
@media (min-width: 768px) and (max-height: 500px) {
    .siparis-page {
        height: calc(100dvh - 3.5rem) !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding-bottom: 0 !important;
    }

    .siparis-filter-card {
        flex: 0 0 auto !important;
        margin-bottom: 4px !important;
    }

        .siparis-filter-card .card-body {
            padding: 4px 8px !important;
        }

    .siparis-desktop-area {
        height: calc(100dvh - 104px) !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

    .siparis-list-ag-grid {
        height: 100% !important;
        min-height: 0 !important;
    }
}

/* ============================================================
   KOYU TEMA
   Cihazin sistem temasi koyuysa devreye girer.
   ============================================================ */
/* ---------- Token devirmeleri ---------- */

html[data-bs-theme="dark"] {
    color-scheme: dark;
    /* Zeminler — acik temanin tersi degil, ayri bir olcek.
       Saf siyah kullanilmiyor; OLED'de kenar titremesi yapar
       ve golgeler gorunmez hale gelir. */
    --lts-paper: #12161f; /* sayfa zemini */
    --lts-paper-2: #1a1f2e; /* input, kart, header */
    --lts-paper-3: #0e1218; /* en derin katman */
    /* Koyu yuzeyler acik temada koyuydu; koyu temada bir tik acilir
       ki sayfa zemininden ayrissin. */
    --lts-ink: #1a1f2e;
    --lts-ink-2: #252c3d;
    /* Metin */
    --lts-text: #e7ecf3;
    --lts-muted: #94a3b8;
    /* Cizgi */
    --lts-border: rgba(255, 255, 255, .09);
    --lts-border-strong: rgba(255, 255, 255, .18);
    /* Marka — koyu zeminde #0d9e6e yeterince parlamiyor,
       bir ton acigina geciliyor. Kontrast orani 3.1 -> 5.4. */
    --lts-accent: #10c47f;
    --lts-accent-dark: #0d9e6e;
    --lts-accent-bright: #34d9a0;
    --lts-accent-soft: rgba(16, 196, 127, .22);
    --lts-accent-faint: rgba(16, 196, 127, .10);
    --lts-accent-rgb: 16, 196, 127;
    /* Durum */
    --lts-danger: #f87171;
    --lts-danger-bg: rgba(248, 113, 113, .12);
    --lts-success: #4ade80;
    --lts-success-bg: rgba(74, 222, 128, .12);
    /* Modal / dropdown yuzeyleri (eski [data-bs-theme="dark"] blogundan tasindi) */
    --lts-surface: #1e2430;
    --lts-surface-alt: #262d3b;
    --lts-text-muted: #a4abb8;
    --lts-backdrop: rgba(0, 0, 0, .7);
    --lts-close-filter: invert(1) grayscale(100%) brightness(200%);
    /* Bootstrap koprusu */
    --bs-primary: #10c47f;
    --bs-primary-rgb: 16, 196, 127;
    --bs-link-color: #10c47f;
    --bs-link-color-rgb: 16, 196, 127;
    --bs-link-hover-color: #34d9a0;
    /* Modal içi bileşenlerin ihtiyaç duyduğu, koyu temada devrilmeyen token'lar */
    --lts-border-strong: rgba(255, 255, 255, .22);
    --lts-muted: #a4abb8;
    --lts-accent: #10c47f;
    --lts-accent-faint: rgba(16, 196, 127, .12);
    --lts-accent-rgb: 16, 196, 127;
}


/* ---------- Govde ---------- */

html[data-bs-theme="dark"],
[data-bs-theme="dark"] body {
    background: var(--lts-paper);
    color: var(--lts-text);
}


/* ---------- Bootstrap bilesenleri ----------
   .btn-primary koyu zeminde beyaz metinle yeterli kontrasti
   vermiyor; koyu ink metin daha okunur. */

[data-bs-theme="dark"] .btn-primary,
[data-bs-theme="dark"] .btn-success {
    color: #0b1016 !important;
}

[data-bs-theme="dark"] .btn-outline-primary:hover,
[data-bs-theme="dark"] .btn-outline-primary:active,
[data-bs-theme="dark"] .btn-outline-primary:focus {
    color: #0b1016 !important;
}

[data-bs-theme="dark"] .btn:focus,
[data-bs-theme="dark"] .btn:active:focus,
[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus,
[data-bs-theme="dark"] .form-check-input:focus {
    box-shadow: 0 0 0 .1rem var(--lts-paper), 0 0 0 .25rem rgba(var(--lts-accent-rgb), .4);
}

[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
    background-color: var(--lts-paper-2);
    border-color: var(--lts-border);
    color: var(--lts-text);
}

    [data-bs-theme="dark"] .form-control::placeholder {
        color: var(--lts-muted);
    }

/* Tarih secici ikonu koyu zeminde siyah kaliyor */
[data-bs-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator {
    filter: opacity(.7);
}

[data-bs-theme="dark"] .table {
    --bs-table-color: var(--lts-text);
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--lts-border);
}

[data-bs-theme="dark"] .blazor-error-boundary {
    background: #7f1d1d;
}


/* ---------- AG GRID ----------
   Alpine acik tema; degiskenleri tek tek devriliyor. */

[data-bs-theme="dark"] .ag-theme-alpine {
    --ag-background-color: var(--lts-paper-2);
    --ag-odd-row-background-color: var(--lts-paper);
    --ag-header-background-color: var(--lts-paper-3);
    --ag-row-hover-color: rgba(var(--lts-accent-rgb), .12);
    --ag-selected-row-background-color: rgba(var(--lts-accent-rgb), .20);
    --ag-range-selection-border-color: var(--lts-accent);
    --ag-checkbox-checked-color: var(--lts-accent);
    --ag-alpine-active-color: var(--lts-accent);
    --ag-foreground-color: var(--lts-text);
    --ag-data-color: var(--lts-text);
    --ag-header-foreground-color: var(--lts-muted);
    --ag-secondary-foreground-color: var(--lts-muted);
    --ag-disabled-foreground-color: #6b7280;
    --ag-border-color: var(--lts-border);
    --ag-secondary-border-color: var(--lts-border);
    --ag-row-border-color: var(--lts-border);
    --ag-input-background-color: var(--lts-paper-3);
    --ag-input-border-color: var(--lts-border);
    --ag-input-disabled-background-color: var(--lts-ink-2);
}

/* Sabit hex tasiyan eski kurallar */
[data-bs-theme="dark"] .home-grid-shell .ag-theme-alpine .ag-row {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    border-left: none !important;
    border-bottom: 1px solid var(--lts-border);
    border-bottom-color: rgba(255, 255, 255, .07);
}

[data-bs-theme="dark"] .home-grid-shell .ag-theme-alpine .ag-pinned-right-cols-container .ag-cell {
    border-left-color: rgba(255, 255, 255, .18) !important;
}


/* ---------- Kolon paneli ---------- */

[data-bs-theme="dark"] .column-panel {
    background: var(--lts-paper-2);
    border-color: var(--lts-border-strong);
    box-shadow: 0 5px 20px rgba(0, 0, 0, .5);
}

[data-bs-theme="dark"] .column-dropzone {
    border-color: rgba(255, 255, 255, .18);
    color: var(--lts-muted);
}

[data-bs-theme="dark"] .column-badge {
    background: var(--lts-ink-2);
    border-color: var(--lts-border);
    color: var(--lts-text);
}

[data-bs-theme="dark"] #closeColumnPanel {
    background: var(--lts-paper-2);
    color: var(--lts-text);
}

[data-bs-theme="dark"] .home-column-drag-ghost {
    color: #0b1016;
}


/* ---------- Grid ayar menusu ---------- */

[data-bs-theme="dark"] .grid-settings-button {
    background: var(--lts-paper-2) !important;
}

    [data-bs-theme="dark"] .grid-settings-button:hover,
    [data-bs-theme="dark"] .grid-settings-button:focus {
        color: #0b1016 !important;
    }

[data-bs-theme="dark"] .grid-settings-menu {
    background: var(--lts-paper-2);
    border-color: var(--lts-border-strong);
    box-shadow: 0 8px 22px rgba(0, 0, 0, .5);
}


/* ---------- Mobil bilesenler ---------- */

[data-bs-theme="dark"] .mobile-filter-bar,
[data-bs-theme="dark"] .mobile-sticky-head {
    background: var(--lts-paper);
}

[data-bs-theme="dark"] .home-filter-toolbar {
    border-bottom-color: var(--lts-border);
}


/* ---------- LOGIN EKRANI ---------- */

[data-bs-theme="dark"] .login-shell {
    background: var(--lts-paper-3);
}

[data-bs-theme="dark"] .lts-login,
[data-bs-theme="dark"] .lts-login__panel {
    background: var(--lts-paper);
}

/* Marka paneli sayfa zemininden ayrissin */
[data-bs-theme="dark"] .lts-login__brand {
    background: var(--lts-paper-3);
    border-right: 1px solid var(--lts-border);
}

/* Logo siyah bilesen tasiyor; koyu zeminde beyaz cipe oturuyor.
   Logonun kendi renkleri degistirilmiyor. */
[data-bs-theme="dark"] .lts-brand__logo {
    background: #fff;
    padding: .9rem 1.2rem;
    border-radius: 12px;
}

[data-bs-theme="dark"] .lts-input .form-control {
    background: var(--lts-paper-2);
    color: var(--lts-text);
}

    [data-bs-theme="dark"] .lts-input .form-control::placeholder {
        color: var(--lts-muted);
    }

    [data-bs-theme="dark"] .lts-input .form-control:focus {
        background: var(--lts-ink-2);
    }

/* Koyu ink buton koyu zeminde kayboluyor; marka rengine geciyor */
[data-bs-theme="dark"] .lts-submit {
    background: var(--lts-accent);
    color: #0b1016;
    box-shadow: 0 4px 16px rgba(16, 196, 127, .18);
}

    [data-bs-theme="dark"] .lts-submit:hover:not(:disabled) {
        background: var(--lts-accent-bright);
        box-shadow: 0 6px 20px rgba(16, 196, 127, .3);
    }

    [data-bs-theme="dark"] .lts-submit:disabled {
        background: var(--lts-ink-2);
        color: var(--lts-muted);
    }

[data-bs-theme="dark"] .lts-spinner {
    border-color: rgba(11, 16, 22, .3);
    border-top-color: #0b1016;
}

[data-bs-theme="dark"] .lts-splash {
    background: var(--lts-paper);
}


/* ---------- Kaydirma cubugu (WebKit) ---------- */

[data-bs-theme="dark"] ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

[data-bs-theme="dark"] ::-webkit-scrollbar-track {
    background: var(--lts-paper);
}

[data-bs-theme="dark"] ::-webkit-scrollbar-thumb {
    background: #2d3548;
    border-radius: 5px;
}

    [data-bs-theme="dark"] ::-webkit-scrollbar-thumb:hover {
        background: #3c465e;
    }

/* Durum rozetleri — acik temada pastel zemin + koyu metin;
   koyu temada zemin saydamlasip metin renklendiriliyor. */
[data-bs-theme="dark"] .status-badge {
    border: 1px solid transparent;
}

[data-bs-theme="dark"] .status-warning {
    background: rgba(251, 191, 36, .16);
    border-color: rgba(251, 191, 36, .35);
    color: #fcd34d;
}

[data-bs-theme="dark"] .status-info {
    background: rgba(96, 165, 250, .16);
    border-color: rgba(96, 165, 250, .35);
    color: #93c5fd;
}

[data-bs-theme="dark"] .status-success {
    background: var(--lts-success-bg);
    border-color: rgba(74, 222, 128, .35);
    color: var(--lts-success);
}

[data-bs-theme="dark"] .status-secondary {
    background: rgba(148, 163, 184, .16);
    border-color: rgba(148, 163, 184, .32);
    color: var(--lts-muted);
}

/* ── PWA kurulum banner'ı ───────────────────────────── */
.pwa-install-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    padding: .75rem 1rem;
    background: var(--lts-ink, #1a1f2e);
    color: #fff;
    /* iPhone home indicator alanı */
    padding-bottom: calc(.75rem + env(safe-area-inset-bottom));
}

/* iOS varyantı: talimat iki satır olduğu için hizalama üstten */
.pwa-install-banner--ios {
    align-items: flex-start;
}

.pwa-install-banner-metin {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    font-size: .875rem;
    line-height: 1.4;
}

    .pwa-install-banner-metin strong {
        font-weight: 700;
    }

.pwa-install-banner-actions {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.pwa-install-banner-btn {
    background: transparent;
    border: 1px solid #fff;
    color: #fff;
    border-radius: 4px;
    padding: .25rem .75rem;
}

.pwa-install-banner-close {
    background: transparent;
    border: none;
    color: #fff;
    font-size: var(--lts-fs-xl);
    line-height: 1;
}


:root,
[data-bs-theme="light"] {
    --lts-surface: #ffffff;
    --lts-surface-alt: #f8f9fa;
    --lts-text: #1a1f2e;
    --lts-text-muted: #5a6270;
    --lts-border: rgba(26, 31, 46, .12);
    --lts-backdrop: rgba(26, 31, 46, .6);
    --lts-close-filter: none;
}

[data-bs-theme="dark"] {
    --lts-surface: #1e2430;
    --lts-surface-alt: #262d3b;
    --lts-text: #e8eaed;
    --lts-text-muted: #a4abb8;
    --lts-border: rgba(255, 255, 255, .14);
    --lts-backdrop: rgba(0, 0, 0, .7);
    --lts-close-filter: invert(1) grayscale(100%) brightness(200%);
}

/* ── Tema seçici ────────────────────────────────────── */

.lts-tema-secici {
    position: relative;
    display: inline-block;
}

.lts-tema-btn {
    background: transparent;
    border: none;
    font-size: var(--lts-fs-xl);
    line-height: 1;
    padding: .35rem .5rem;
    cursor: pointer;
}

/* Menü dışına tıklandığında kapanmayı sağlayan şeffaf katman */
.lts-tema-katman {
    position: fixed;
    inset: 0;
    z-index: 1040;
}

.lts-tema-menu {
    position: absolute;
    top: calc(100% + .35rem);
    right: 0;
    z-index: 1050;
    min-width: 9rem;
    padding: .25rem 0;
    border: 1px solid var(--lts-border);
    border-radius: .5rem;
    background: var(--lts-surface);
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .18);
}

.lts-tema-menu-item {
    display: flex;
    align-items: center;
    width: 100%;
    padding: .4rem .85rem;
    border: none;
    background: transparent;
    color: var(--lts-text);
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
}

    .lts-tema-menu-item:hover {
        background: var(--lts-surface-alt);
    }

    .lts-tema-menu-item.active {
        background: var(--lts-brand, #0d9e6e);
        color: #fff;
    }

.lts-tema-menu-ikon {
    margin-right: .5rem;
}

/* ── LTS modal ──────────────────────────────────────── */

.lts-modal-backdrop {
    background-color: var(--lts-backdrop);
}

    .lts-modal-backdrop .modal-content {
        color-scheme: light;
        background-color: var(--lts-surface);
        color: var(--lts-text);
        border-color: var(--lts-border);
    }

    .lts-modal-backdrop .modal-title {
        color: var(--lts-text);
        font-weight: 600;
    }

    .lts-modal-backdrop .modal-header,
    .lts-modal-backdrop .modal-footer {
        border-color: var(--lts-border);
    }

    .lts-modal-backdrop .btn-close {
        filter: var(--lts-close-filter);
        opacity: .75;
    }

    .lts-modal-backdrop .text-muted {
        color: var(--lts-text-muted) !important;
    }

    .lts-modal-backdrop .table {
        --bs-table-color: var(--lts-text);
        --bs-table-bg: transparent;
        --bs-table-border-color: var(--lts-border);
        --bs-table-hover-color: var(--lts-text);
        --bs-table-hover-bg: var(--lts-surface-alt);
    }

        /* Bootstrap hücre renklerini doğrudan ezer (thead dahil) */
        .lts-modal-backdrop .table > :not(caption) > * > * {
            background-color: transparent;
            color: var(--lts-text);
            border-bottom-color: var(--lts-border);
        }

    .lts-modal-backdrop .table-light > * > * {
        background-color: var(--lts-surface-alt);
        color: var(--lts-text);
    }

    .lts-modal-backdrop .card {
        background-color: var(--lts-surface-alt);
        border-color: var(--lts-border);
        color: var(--lts-text);
    }

    .lts-modal-backdrop .alert-info {
        background-color: var(--lts-surface-alt);
        border-color: var(--lts-border);
        color: var(--lts-text);
    }

/* ============================================================
   BOOTSTRAP KOYU TEMA KOPRUSU
   app.css'te html[data-bs-theme="dark"] token blogunun ARDINA eklenir.

   Bolum 14 yalnizca vurgu degiskenlerini (--bs-primary, link renkleri)
   devirmisti; govde ve yuzey degiskenleri acik kaliyordu. Mobil
   gorunumde ekranlar Bootstrap .card / .list-group / .alert
   uzerinden render edildigi icin sorun yalnizca dar ekranda
   goze carpiyor.

   Ozgulluk notu: Bootstrap 5.2+ bilesenleri kendi kurallarinin
   icinde --bs-*-bg degiskenini yeniden tanimliyor. Bu yuzden
   degiskeni :root seviyesinde ezmek yetmez, bilesen selektorunde
   ezilmesi gerekir.
   ============================================================ */

/* ---------- Govde degiskenleri ---------- */

html[data-bs-theme="dark"] {
    --bs-body-bg: #12161f;
    --bs-body-bg-rgb: 18, 22, 31;
    --bs-body-color: #e7ecf3;
    --bs-body-color-rgb: 231, 236, 243;
    --bs-emphasis-color: #ffffff;
    --bs-emphasis-color-rgb: 255, 255, 255;
    --bs-heading-color: var(--lts-text);
    /* .text-muted ve .text-secondary bu degiskene bagli */
    --bs-secondary-color: rgba(231, 236, 243, .68);
    --bs-secondary-color-rgb: 231, 236, 243;
    --bs-secondary-bg: #1a1f2e;
    --bs-secondary-bg-rgb: 26, 31, 46;
    --bs-tertiary-color: rgba(231, 236, 243, .48);
    --bs-tertiary-bg: #0e1218;
    --bs-tertiary-bg-rgb: 14, 18, 24;
    --bs-border-color: var(--lts-border);
    --bs-border-color-translucent: var(--lts-border);
    --bs-highlight-bg: rgba(251, 191, 36, .25);
}


    /* ---------- Kart ---------- */

    html[data-bs-theme="dark"] .card {
        --bs-card-bg: var(--lts-paper-2);
        --bs-card-color: var(--lts-text);
        --bs-card-cap-bg: var(--lts-paper-3);
        --bs-card-cap-color: var(--lts-text);
        --bs-card-border-color: var(--lts-border);
        background-color: var(--lts-paper-2);
        color: var(--lts-text);
        border-color: var(--lts-border);
    }

    html[data-bs-theme="dark"] .card-header,
    html[data-bs-theme="dark"] .card-footer {
        background-color: var(--lts-paper-3);
        border-color: var(--lts-border);
        color: var(--lts-text);
    }

    /* .text-muted eski surumlerde sabit renk tasiyor */
    html[data-bs-theme="dark"] .text-muted {
        color: rgba(231, 236, 243, .68) !important;
    }


    /* ---------- Liste ve accordion ---------- */

    html[data-bs-theme="dark"] .list-group {
        --bs-list-group-bg: var(--lts-paper-2);
        --bs-list-group-color: var(--lts-text);
        --bs-list-group-border-color: var(--lts-border);
        --bs-list-group-action-hover-bg: var(--lts-ink-2);
        --bs-list-group-action-hover-color: var(--lts-text);
    }

    html[data-bs-theme="dark"] .accordion {
        --bs-accordion-bg: var(--lts-paper-2);
        --bs-accordion-color: var(--lts-text);
        --bs-accordion-border-color: var(--lts-border);
        --bs-accordion-btn-bg: var(--lts-paper-3);
        --bs-accordion-btn-color: var(--lts-text);
        --bs-accordion-active-bg: rgba(var(--lts-accent-rgb), .14);
        --bs-accordion-active-color: var(--lts-accent);
    }


    /* ---------- Uyarilar ---------- */

    html[data-bs-theme="dark"] .alert-secondary {
        background-color: var(--lts-paper-2);
        border-color: var(--lts-border);
        color: var(--lts-text);
    }

    html[data-bs-theme="dark"] .alert-warning {
        background-color: rgba(251, 191, 36, .12);
        border-color: rgba(251, 191, 36, .32);
        color: #fcd34d;
    }

    html[data-bs-theme="dark"] .alert-danger {
        background-color: var(--lts-danger-bg);
        border-color: rgba(248, 113, 113, .32);
        color: var(--lts-danger);
    }


    /* ---------- Butonlar ---------- */

    html[data-bs-theme="dark"] .btn-outline-secondary {
        --bs-btn-color: var(--lts-text);
        --bs-btn-border-color: var(--lts-border-strong);
        --bs-btn-hover-bg: var(--lts-ink-2);
        --bs-btn-hover-color: var(--lts-text);
        --bs-btn-hover-border-color: var(--lts-border-strong);
        --bs-btn-active-bg: var(--lts-ink-2);
        --bs-btn-active-color: var(--lts-text);
    }

    html[data-bs-theme="dark"] .btn-link {
        --bs-btn-color: var(--lts-accent);
        --bs-btn-hover-color: var(--lts-accent-bright);
    }


    /* ---------- Form kontrolleri ---------- */

    html[data-bs-theme="dark"] .form-check-input {
        background-color: var(--lts-paper-3);
        border-color: var(--lts-border-strong);
    }

        html[data-bs-theme="dark"] .form-check-input:checked {
            background-color: var(--lts-accent);
            border-color: var(--lts-accent);
        }

    html[data-bs-theme="dark"] .input-group-text {
        background-color: var(--lts-paper-3);
        border-color: var(--lts-border);
        color: var(--lts-muted);
    }

    html[data-bs-theme="dark"] .form-control:disabled,
    html[data-bs-theme="dark"] .form-select:disabled {
        background-color: var(--lts-ink-2);
        color: var(--lts-muted);
    }


    /* ---------- Spinner ---------- */

    html[data-bs-theme="dark"] .spinner-border {
        color: var(--lts-accent);
    }

/* ============================================================
   BAGLANTI SERIDI
   app.css'e eklenir (scoped .razor.css proje sinirini gecmiyor).

   Konum: ekranin altinda. Ust taraf mobilde .mobile-sticky-head
   tarafindan kullaniliyor; ustte olsa filtre barini asagi iter ve
   liste zipliyor.
   ============================================================ */

.lts-ag-banner {
    position: fixed;
    left: 50%;
    bottom: calc(12px + env(safe-area-inset-bottom));
    transform: translateX(-50%);
    z-index: 1080;
    display: flex;
    align-items: center;
    gap: 9px;
    max-width: calc(100vw - 24px);
    padding: 9px 15px;
    border-radius: 999px;
    border: 1px solid transparent;
    font-size: var(--lts-fs-md);
    font-weight: 500;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: 0 6px 20px rgba(0, 0, 0, .18);
    animation: ltsAgBannerGiris .22s ease-out;
}

@keyframes ltsAgBannerGiris {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

.lts-ag-banner__nokta {
    flex: 0 0 auto;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
}

/* ---------- Kopuk ---------- */

.lts-ag-banner--kopuk {
    background: #fef3c7;
    border-color: #fcd34d;
    color: #92400e;
}

    .lts-ag-banner--kopuk .lts-ag-banner__nokta {
        animation: ltsAgBannerNabiz 1.6s ease-in-out infinite;
    }

@keyframes ltsAgBannerNabiz {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: .35;
    }
}

/* ---------- Geri geldi ---------- */

.lts-ag-banner--geldi {
    background: rgba(var(--lts-accent-rgb), .12);
    border-color: rgba(var(--lts-accent-rgb), .35);
    color: var(--lts-accent);
}

/* ---------- Koyu tema ---------- */

html[data-bs-theme="dark"] .lts-ag-banner {
    box-shadow: 0 8px 24px rgba(0, 0, 0, .45);
}

html[data-bs-theme="dark"] .lts-ag-banner--kopuk {
    background: rgba(240, 169, 46, .14);
    border-color: rgba(240, 169, 46, .35);
    color: #f0a92e;
}

/* ---------- Hareket azaltma ---------- */

@media (prefers-reduced-motion: reduce) {
    .lts-ag-banner {
        animation: none;
    }

    .lts-ag-banner--kopuk .lts-ag-banner__nokta {
        animation: none;
    }
}

/* ---------- Evrak yükleme modalı ---------- */

.lts-modal-backdrop .form-label {
    color: var(--lts-text);
}

.lts-modal-backdrop .form-control,
.lts-modal-backdrop .form-select {
    background-color: var(--lts-surface-alt);
    border-color: var(--lts-border);
    color: var(--lts-text);
}

    .lts-modal-backdrop .form-control::placeholder {
        color: var(--lts-text-muted);
    }

/* Dosya bırakma kutusu — Bootstrap .border yerine token'lı kesik çerçeve */
.lts-modal-backdrop .upload-box {
    background-color: var(--lts-surface-alt);
    border: 2px dashed var(--lts-border-strong);
    border-radius: 10px;
    color: var(--lts-text);
    transition: border-color .15s ease, background-color .15s ease;
}

    .lts-modal-backdrop .upload-box:hover {
        border-color: var(--lts-accent);
        background-color: var(--lts-accent-faint);
    }

/* Hazırlanan dosya listesi */
.lts-modal-backdrop .list-group-item {
    background-color: var(--lts-surface-alt);
    border-color: var(--lts-border);
    color: var(--lts-text);
}

.lts-modal-backdrop .upload-file-size {
    color: var(--lts-text-muted);
}

/* Sabitlenmiş evrak tipi rozeti */
.upload-tip-badge {
    background-color: var(--lts-accent-faint);
    border: 1px solid rgba(var(--lts-accent-rgb), .35);
    color: var(--lts-accent);
    font-weight: 600;
}
/* iOS Safari, 16px altindaki bir input'a odaklanildiginda sayfayi
   otomatik yakinlastiriyor ve kullanici elle geri cikmak zorunda kaliyor.
   @supports kosulu bu bloku yalnizca iOS/iPadOS ile sinirlar; Android
   WebView ve masaustu tarayicilar tip olcegini korur. */
@supports (-webkit-touch-callout: none) {
    @media (pointer: coarse) {
        .form-control,
        .form-select,
        input[type="date"],
        input[type="text"],
        input[type="number"] {
            font-size: 16px;
        }
    }
}

/* Boş/loading durum kartı mobilde ekranı doldurmasın */
@media (max-width: 767.98px) {
    .siparis-page .siparis-state-card {
        min-height: auto;
    }
}
/* Mobil filtre çubuğu ortak kontrol yüksekliği.
   Değeri tek yerden değiştirmek için token. */
.mobile-filter-card {
    --lts-filtre-yukseklik: 42px;
}

    /* Flex item'ların içeriğe göre şişip kartı taşırmasını engeller.
   Bootstrap kolonlarının varsayılan min-width: auto değeri buna izin veriyor. */
    .mobile-filter-card .row > [class*="col-"] {
        min-width: 0;
    }

    .mobile-filter-card .input-group > .form-control,
    .mobile-filter-card .input-group > .form-select {
        min-width: 0;
    }

    /* Select, input ve temizle butonu aynı yükseklikte olsun.
   .filter-input kendi padding'ini taşıdığı için input-group içinde
   buton ile arasında yükseklik farkı oluşuyordu. */
    .mobile-filter-card .form-select,
    .mobile-filter-card .form-control,
    .mobile-filter-card .input-group > .btn {
        height: var(--lts-filtre-yukseklik);
        min-height: var(--lts-filtre-yukseklik);
        padding-top: 0;
        padding-bottom: 0;
        line-height: calc(var(--lts-filtre-yukseklik) - 2px);
    }

    /* Buton kare kalsın, metin uzayınca ezilmesin. */
    .mobile-filter-card .input-group > .btn {
        width: var(--lts-filtre-yukseklik);
        padding-left: 0;
        padding-right: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }

    /* type="search" WebKit'te searchfield intrinsic genişliği taşıyor;
   ayrıca native temizle ikonu kendi ✖ butonumuzla mükerrer oluyor. */
    .mobile-filter-card input[type="search"] {
        -webkit-appearance: none;
        appearance: none;
    }

        .mobile-filter-card input[type="search"]::-webkit-search-cancel-button,
        .mobile-filter-card input[type="search"]::-webkit-search-decoration {
            -webkit-appearance: none;
            appearance: none;
        }

/* ═══════════════════════════════════════════════════════════
   MAL KABUL (SIR02) EKRANI
   app.css dosyasının SONUNA eklenecek.

   Not: scoped .razor.css yerine global app.css tercih edildi;
   AG Grid DOM'unu body'ye taşıdığı için scope attribute'ları
   grid içindeki elemanlara ulaşmıyor.

   ÖNEMLİ: Bu bloğu ekledikten sonra service worker cache adını
   bump'lamayı unutma, aksi halde eski app.css servis edilir.
   ═══════════════════════════════════════════════════════════ */

.mal-kabul-page {
    --mk-panel-bosluk: 8px;
    --mk-header-yukseklik: 38px;
}

    .mal-kabul-page .mk-label {
        font-size: .72rem;
        font-weight: 600;
        margin-bottom: 2px;
        color: var(--lts-text-muted, #6c757d);
    }

    .mal-kabul-page .mk-filter-card {
        border-radius: 10px;
    }

    /* ── Masaüstü yerleşimi ───────────────────────────────────── */

    .mal-kabul-page .mk-layout {
        display: grid;
        grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
        grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
        gap: var(--mk-panel-bosluk);
        /* Filtre kartı + navbar payı düşülür; grid'ler ekranı doldurur */
        height: calc(100vh - 190px);
        min-height: 460px;
    }

    .mal-kabul-page .mk-panel-siparis {
        grid-column: 1;
        grid-row: 1 / span 2;
    }

    .mal-kabul-page .mk-panel-toplama {
        grid-column: 2;
        grid-row: 1;
    }

    .mal-kabul-page .mk-panel-toplama-detay {
        grid-column: 2;
        grid-row: 2;
    }

    .mal-kabul-page .mk-panel {
        display: flex;
        flex-direction: column;
        min-height: 0;
        min-width: 0;
        background: var(--lts-surface, #fff);
        border: 1px solid var(--lts-border, #dee2e6);
        border-radius: 10px;
        overflow: hidden;
    }

    .mal-kabul-page .mk-panel-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        height: var(--mk-header-yukseklik);
        padding: 0 10px;
        background: var(--lts-surface-alt, #f8f9fa);
        border-bottom: 1px solid var(--lts-border, #dee2e6);
        flex: 0 0 auto;
    }

    .mal-kabul-page .mk-panel-title {
        display: flex;
        align-items: center;
        font-size: .82rem;
        font-weight: 700;
        color: var(--lts-text, #212529);
    }

    .mal-kabul-page .mk-badge {
        display: inline-block;
        margin-left: 6px;
        padding: 1px 7px;
        border-radius: 10px;
        font-size: .7rem;
        font-weight: 600;
        background: var(--lts-primary-soft, #e7f1ff);
        color: var(--lts-primary, #0d6efd);
    }

    .mal-kabul-page .mk-grid {
        flex: 1 1 auto;
        min-height: 0;
        width: 100%;
    }

    .mal-kabul-page .mk-ozet-satiri {
        flex: 0 0 auto;
        padding: 5px 10px;
        font-size: .76rem;
        font-weight: 700;
        color: var(--lts-danger, #b02a37);
        background: var(--lts-surface-alt, #f8f9fa);
        border-top: 1px solid var(--lts-border, #dee2e6);
        white-space: nowrap;
        overflow-x: auto;
    }

    .mal-kabul-page .mk-ozet-kutu {
        font-size: .7rem;
        font-weight: 600;
        line-height: 1.25;
        padding: 4px 8px;
        border-radius: 6px;
        background: var(--lts-surface-alt, #f8f9fa);
        border: 1px solid var(--lts-border, #dee2e6);
        max-height: 38px;
        overflow: hidden;
    }

    /* ── Grid ayar menüsü ─────────────────────────────────────── */

    .mal-kabul-page .mk-ayar-sarmal {
        position: relative;
    }

    .mal-kabul-page .mk-ayar-buton {
        padding: 1px 8px;
        line-height: 1.3;
        font-size: .82rem;
    }

    .mal-kabul-page .mk-ayar-menu {
        position: absolute;
        right: 0;
        top: calc(100% + 4px);
        z-index: 1050;
        display: flex;
        flex-direction: column;
        gap: 4px;
        padding: 6px;
        min-width: 148px;
        background: var(--lts-surface, #fff);
        border: 1px solid var(--lts-border, #dee2e6);
        border-radius: 8px;
        box-shadow: 0 6px 18px rgba(0, 0, 0, .14);
    }

    /* ── Satır renklendirme (masaüstü RowCellStyle karşılığı) ─── */

    .mal-kabul-page .ag-theme-alpine .mk-satir-islemde,
    .ag-theme-alpine .mk-satir-islemde {
        background-color: rgba(255, 165, 0, .28) !important;
    }

    .mal-kabul-page .ag-theme-alpine .mk-satir-tamamlandi,
    .ag-theme-alpine .mk-satir-tamamlandi {
        background-color: rgba(40, 167, 69, .24) !important;
    }

    .mal-kabul-page .ag-theme-alpine .mk-satir-indiriliyor,
    .ag-theme-alpine .mk-satir-indiriliyor {
        background-color: rgba(255, 214, 0, .30) !important;
    }

/* Seçili satır durum renginin üstünde kalmalı */
.ag-theme-alpine .ag-row-selected {
    background-color: rgba(13, 110, 253, .22) !important;
}

/* Koyu temada aynı renkler daha düşük opaklıkla okunur kalır */
[data-bs-theme="dark"] .ag-theme-alpine .mk-satir-islemde {
    background-color: rgba(255, 165, 0, .18) !important;
}

[data-bs-theme="dark"] .ag-theme-alpine .mk-satir-tamamlandi {
    background-color: rgba(40, 167, 69, .16) !important;
}

[data-bs-theme="dark"] .ag-theme-alpine .mk-satir-indiriliyor {
    background-color: rgba(255, 214, 0, .18) !important;
}

/* ── Durum etiketi ────────────────────────────────────────── */

.mk-durum-etiket {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 10px;
    font-size: .7rem;
    font-weight: 600;
    background: var(--lts-surface-alt, #eef1f4);
    color: var(--lts-text, #212529);
    white-space: nowrap;
}

    .mk-durum-etiket.mk-durum-islemde {
        background: rgba(255, 165, 0, .25);
    }

    .mk-durum-etiket.mk-durum-tamamlandi {
        background: rgba(40, 167, 69, .22);
    }

    .mk-durum-etiket.mk-durum-indiriliyor {
        background: rgba(255, 214, 0, .28);
    }

/* ── Sağa yaslı sayısal hücreler ──────────────────────────── */

.ag-theme-alpine .ag-text-right {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* ── Mobil ────────────────────────────────────────────────── */

.mal-kabul-page .mk-tabs .nav-link {
    font-size: .78rem;
    padding: 6px 4px;
    border-radius: 8px;
}

.mal-kabul-page .mk-card {
    border-radius: 10px;
}

.mal-kabul-page .mk-card-tiklanabilir {
    cursor: pointer;
}

.mal-kabul-page .mk-card-secili {
    border-color: var(--lts-primary, #0d6efd);
    box-shadow: 0 0 0 2px rgba(13, 110, 253, .18);
}

.mal-kabul-page .mk-card-baslik {
    font-size: .86rem;
    line-height: 1.25;
    word-break: break-word;
}

.mal-kabul-page .mk-card-satir {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 12px;
    font-size: .76rem;
    line-height: 1.4;
    margin-top: 2px;
}

.mal-kabul-page .mk-vurgu {
    font-weight: 700;
}

.mal-kabul-page .mk-bos-ikon {
    font-size: 1.6rem;
}

/* ── Yatay mod: alçak ama geniş ekranlarda grid'lere yer aç ── */

@media (min-width: 992px) and (max-height: 620px) {
    .mal-kabul-page .mk-layout {
        height: calc(100vh - 150px);
        min-height: 360px;
    }
}

/* ═══════════════════════════════════════════════════════════
   AKSİYON ÇUBUĞU — yalnızca dokunmatik / dar ekran
   ═══════════════════════════════════════════════════════════ */

/*
   Masaüstünde aynı aksiyonlar sağ tık menüsünden yapılıyor;
   çubuk hem yer kaplıyor hem de aynı işi iki yerden sunuyordu.
   Varsayılan gizli, yalnızca aşağıdaki iki koşulda görünür.
*/
.mal-kabul-page .mk-aksiyon-cubugu.mk-sadece-dokunmatik {
    display: none;
}

/* Dar ekran (mobil kart görünümü) */
@media (max-width: 991.98px) {
    .mal-kabul-page .mk-aksiyon-cubugu.mk-sadece-dokunmatik {
        display: flex;
    }
}

/* Geniş ama dokunmatik cihaz (tablet yatay, dokunmatik dizüstü):
   grid görünümü açık ama sağ tık yok, çubuk gerekli. */
@media (hover: none) and (pointer: coarse) {
    .mal-kabul-page .mk-aksiyon-cubugu.mk-sadece-dokunmatik {
        display: flex;
    }
}

.mal-kabul-page .mk-aksiyon-cubugu {
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 10px;
    background: var(--lts-primary-soft, #e7f1ff);
    border: 1px solid var(--lts-primary, #0d6efd);
}

.mal-kabul-page .mk-aksiyon-bilgi {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: .8rem;
    font-weight: 600;
}

.mal-kabul-page .mk-aksiyon-butonlar {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

/* Dar ekranda alta sabitlenir: el terminalinde tek elle erişim */
@media (max-width: 991.98px) {
    .mal-kabul-page .mk-aksiyon-cubugu {
        position: sticky;
        bottom: 8px;
        z-index: 1030;
        box-shadow: 0 4px 16px rgba(0, 0, 0, .18);
        background: var(--lts-surface, #fff);
    }

    .mal-kabul-page .mk-aksiyon-butonlar {
        width: 100%;
    }

        .mal-kabul-page .mk-aksiyon-butonlar .btn {
            flex: 1 1 auto;
            min-height: 40px;
        }
}


/* ═══════════════════════════════════════════════════════════
   SAĞ TIK MENÜSÜ
   ═══════════════════════════════════════════════════════════ */

.mk-menu-katman {
    position: fixed;
    inset: 0;
    z-index: 2000;
    background: transparent;
}

/*
   ÖNEMLİ: max-height + overflow-y kullanılmıyor.
   Kaydırma çubuğu hem görsel olarak kötüydü hem de alt menüyü
   kırpıyordu (alt menü DOM'da içeride, overflow onu kesiyor).
   Menü öğe sayısı sabit ve az; taşma riski yok.
*/
.mk-context-menu {
    position: fixed;
    z-index: 2001;
    width: max-content;
    min-width: 210px;
    max-width: min(320px, calc(100vw - 16px));
    padding: 4px;
    overflow: visible;
    background: var(--lts-surface, #fff);
    border: 1px solid var(--lts-border, #dee2e6);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
    font-size: .82rem;
}

.mk-menu-oge {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 6px;
    cursor: pointer;
    white-space: nowrap;
    color: var(--lts-text, #212529);
    user-select: none;
}

    .mk-menu-oge:hover {
        background: var(--lts-primary-soft, #e7f1ff);
    }

    /* Yetkisi olmayan veya henüz taşınmamış aksiyonlar */
    .mk-menu-oge.pasif {
        opacity: .45;
        cursor: default;
        pointer-events: none;
    }

.mk-menu-ikon {
    flex: 0 0 auto;
    width: 18px;
    text-align: center;
}

.mk-menu-metin {
    flex: 1 1 auto;
}

.mk-menu-ok {
    flex: 0 0 auto;
    font-size: 1.05rem;
    line-height: 1;
    opacity: .6;
}

.mk-menu-ayirac {
    height: 1px;
    margin: 4px 6px;
    background: var(--lts-border, #dee2e6);
}

/* ── Alt menü ─────────────────────────────────────────────── */

.mk-menu-alt-sarmal {
    position: relative;
}

.mk-context-menu.mk-alt-menu {
    position: absolute;
    left: calc(100% - 4px);
    top: -4px;
    min-width: 220px;
}

/* Dar ekranda alt menü sola açılır */
@media (max-width: 1400px) {
    .mk-context-menu.mk-alt-menu {
        left: auto;
        right: calc(100% - 4px);
    }
}

/* ── Koyu tema ────────────────────────────────────────────── */

[data-bs-theme="dark"] .mk-context-menu {
    box-shadow: 0 8px 24px rgba(0, 0, 0, .5);
}

/* ── Dokunmatikte sağ tık menüsü gizlenir ─────────────────── */

@media (hover: none) and (pointer: coarse) {
    .mk-context-menu,
    .mk-menu-katman {
        display: none;
    }
}


/* Detayı gösterilen satır — sol kenarda çubuk + hafif zemin */
.ag-theme-alpine .mk-satir-odak {
    background-color: rgba(13, 110, 253, .10) !important;
    box-shadow: inset 3px 0 0 0 var(--lts-primary, #0d6efd);
}

/* Checkbox ile seçilmiş satır odak satırının üstünde görünür kalmalı */
.ag-theme-alpine .ag-row-selected {
    background-color: rgba(13, 110, 253, .22) !important;
}

    /* Hem seçili hem odakta ise seçim rengi kazanır, çubuk korunur */
    .ag-theme-alpine .ag-row-selected.mk-satir-odak {
        background-color: rgba(13, 110, 253, .26) !important;
        box-shadow: inset 3px 0 0 0 var(--lts-primary, #0d6efd);
    }

/* Durum renkleri odak satırında da okunur kalsın */
.ag-theme-alpine .mk-satir-odak.mk-satir-islemde {
    background-color: rgba(255, 165, 0, .30) !important;
}

.ag-theme-alpine .mk-satir-odak.mk-satir-tamamlandi {
    background-color: rgba(40, 167, 69, .26) !important;
}

.ag-theme-alpine .mk-satir-odak.mk-satir-indiriliyor {
    background-color: rgba(255, 214, 0, .32) !important;
}

/* ── Koyu tema ────────────────────────────────────────────── */

[data-bs-theme="dark"] .ag-theme-alpine .mk-satir-odak {
    background-color: rgba(13, 110, 253, .16) !important;
}

[data-bs-theme="dark"] .ag-theme-alpine .ag-row-selected {
    background-color: rgba(13, 110, 253, .26) !important;
}

[data-bs-theme="dark"] .ag-theme-alpine .mk-satir-odak.mk-satir-islemde {
    background-color: rgba(255, 165, 0, .20) !important;
}

[data-bs-theme="dark"] .ag-theme-alpine .mk-satir-odak.mk-satir-tamamlandi {
    background-color: rgba(40, 167, 69, .18) !important;
}

[data-bs-theme="dark"] .ag-theme-alpine .mk-satir-odak.mk-satir-indiriliyor {
    background-color: rgba(255, 214, 0, .20) !important;
}


/* ════════════════════════════════════════════════════════════
   Araç Talep Raporu (AracTalepRaporModal)

   app.css sonuna eklenir. Scoped .razor.css kullanılmadı:
   modal içeriği Bootstrap modal katmanında render edildiği için
   scoped öznitelik zincirleri daha önce sorun çıkardı.

   NOT: app.css değiştikten sonra service worker cache adı bump
   edilmeli (publish sırasında MSBuild damgası bunu yapar).
   ════════════════════════════════════════════════════════════ */

.at-modal .modal-content {
    background: var(--lts-surface, #fff);
    color: var(--lts-text);
}

.at-modal .at-durum {
    display: flex;
    align-items: center;
    padding: 24px 8px;
    color: var(--lts-muted);
    font-size: var(--lts-fs-md, 13px);
}

/* ── Yerleşim ───────────────────────────────────────────── */

.at-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

@media (min-width: 992px) {
    .at-layout {
        /* Özet listesi solda, 3D sağda */
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }
}

.at-panel {
    border: 1px solid var(--lts-border, rgba(0,0,0,.07));
    border-radius: 6px;
    background: var(--lts-paper, #fff);
    overflow: hidden;
}

.at-panel-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    background: var(--lts-paper-2, #f7fafc);
    border-bottom: 1px solid var(--lts-border, rgba(0,0,0,.07));
    font-size: var(--lts-fs-sm, 11.5px);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--lts-muted);
}

.at-ipucu {
    margin-left: auto;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    font-size: var(--lts-fs-xs, 10px);
    opacity: .8;
}

/* ── Tablolar ───────────────────────────────────────────── */

.at-tablo-sarmal {
    max-height: 240px;
    overflow: auto;
}

.at-detay .at-tablo-sarmal {
    max-height: 260px;
}

.at-tablo {
    font-size: var(--lts-fs-sm, 11.5px);
    white-space: nowrap;
}

    .at-tablo thead th {
        position: sticky;
        top: 0;
        z-index: 2;
        background: var(--lts-paper-2, #f7fafc);
        font-weight: 600;
        border-bottom: 1px solid var(--lts-border-strong, #c9c9c9);
    }

.at-ozet tbody tr {
    cursor: pointer;
}

    .at-satir-secili,
    .at-ozet tbody tr.at-satir-secili:hover > * {
        background: var(--lts-accent-soft, #d1fae5) !important;
        color: var(--lts-text);
    }

/* ── 3D alanı ───────────────────────────────────────────── */

.at-3d-govde {
    position: relative;
    height: 300px;
}

@media (min-width: 992px) {
    .at-3d-govde {
        /* Özet tablosu ile aynı hizada dursun */
        height: 268px;
    }
}

@media (min-width: 1400px) {
    .at-3d-govde {
        height: 320px;
    }
}

.at-3d-tuval {
    position: absolute;
    inset: 0;
    /* three.js tuvali buraya eklenir; boyut ResizeObserver ile izlenir */
    overflow: hidden;
}

.at-3d-uyari {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    text-align: center;
    font-size: var(--lts-fs-sm, 11.5px);
    color: var(--lts-muted);
    background: var(--lts-paper-2, #f7fafc);
}

/* Sahne üstündeki paneller — koyu zemin üzerinde okunur olması için
   tema token'larından bağımsız sabit renk kullanır. */

.at-bilgi-panel,
.at-palet-panel {
    position: absolute;
    top: 8px;
    min-width: 168px;
    max-width: 210px;
    padding: 8px 10px;
    background: rgba(17, 24, 39, .94);
    border: 1px solid #f59e0b;
    border-radius: 4px;
    color: #e5e7eb;
    font-size: var(--lts-fs-xs, 10px);
    box-shadow: 0 6px 18px rgba(0,0,0,.35);
    pointer-events: none;
}

.at-bilgi-panel {
    left: 8px;
}

.at-palet-panel {
    right: 8px;
    max-width: 240px;
    pointer-events: auto;
}

.at-bilgi-baslik {
    margin-bottom: 6px;
    color: #fbbf24;
    font-size: var(--lts-fs-sm, 11.5px);
    font-weight: 700;
    white-space: normal;
}

.at-bilgi-satir {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-top: 4px;
}

    .at-bilgi-satir span {
        color: #9ca3af;
    }

    .at-bilgi-satir b {
        color: #fff;
        text-align: right;
    }

.at-ayirac {
    height: 1px;
    margin: 8px 0;
    background: #374151;
}

.at-palet-miktar {
    margin-bottom: 6px;
    color: #fff;
    font-size: var(--lts-fs-sm, 11.5px);
    font-weight: 700;
}

.at-palet-kapat {
    position: absolute;
    top: 4px;
    right: 6px;
    padding: 0 4px;
    border: 0;
    background: transparent;
    color: #9ca3af;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
}

    .at-palet-kapat:hover {
        color: #fff;
    }

/* Dar ekranda iki panel üst üste binmesin */
@media (max-width: 575.98px) {
    .at-palet-panel {
        top: auto;
        bottom: 8px;
        left: 8px;
        right: 8px;
        max-width: none;
    }
}
/* ═══════════════════════════════════════════════════════════
   Araç Talep 3D Viewer modalı (Arac3DViewerModal.razor)
   Bu bloğu app.css SONUNA ekleyin.
   Not: app.css değiştiği için service worker cache adı bump
   edilmeli (publish'te MSBuild timestamp bunu otomatik yapar).
   ═══════════════════════════════════════════════════════════ */

.a3d-dialog {
    max-width: min(1240px, 96vw);
}

.a3d-icerik {
    height: min(88vh, 900px);
    display: flex;
    flex-direction: column;
    background: var(--lts-surface);
    color: var(--lts-ink);
    border: 1px solid var(--lts-border);
}

.a3d-govde {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Araç seçici butonları — çok araçta yatay kaydırma */
.a3d-arac-secici {
    display: flex;
    gap: .4rem;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: .2rem;
    -webkit-overflow-scrolling: touch;
}

    .a3d-arac-secici .btn {
        white-space: nowrap;
        flex: 0 0 auto;
    }

/* Sahne + özet yan yana; mobilde alt alta */
.a3d-yerlesim {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    gap: .5rem;
}

.a3d-sahne-sarmal {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    border: 1px solid var(--lts-border-strong);
    border-radius: .375rem;
    overflow: hidden;
    /* 3D sahne her temada koyu kalır; canvas arkası boş kalmasın */
    background: #20242b;
}

.a3d-sahne {
    position: absolute;
    inset: 0;
}

    .a3d-sahne canvas {
        display: block;
    }

.a3d-ozet {
    flex: 0 0 250px;
    align-self: flex-start;
    max-height: 100%;
    overflow-y: auto;
    background: var(--lts-surface);
    border-color: var(--lts-border);
    font-size: var(--lts-fs-sm);
}

.a3d-ozet-baslik {
    color: var(--lts-accent);
}

/* Palet detay kartı — sahnenin sağ üstünde yüzer */
.a3d-palet-detay {
    position: absolute;
    top: .5rem;
    right: .5rem;
    width: min(285px, calc(100% - 1rem));
    z-index: 10;
    background: var(--lts-surface);
    border: 1px solid var(--lts-accent);
    font-size: var(--lts-fs-sm);
}

.a3d-palet-baslik {
    color: var(--lts-accent);
    font-size: var(--lts-fs-md);
    line-height: 1.2;
}

.a3d-detay-satir {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    margin-top: .25rem;
}

    .a3d-detay-satir span {
        color: var(--lts-muted);
    }

    .a3d-detay-satir b {
        text-align: right;
    }

.a3d-detay-miktar {
    font-weight: 600;
    margin: .25rem 0 .4rem;
}

.a3d-ipucu {
    position: absolute;
    left: .5rem;
    bottom: .35rem;
    z-index: 5;
    color: #9ca3af;
    font-size: .72rem;
    pointer-events: none;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
}

/* ── Mobil / dar ekran ── */
@media (max-width: 991.98px) {
    .a3d-icerik {
        height: 100%;
    }

    .a3d-yerlesim {
        flex-direction: column;
    }

    .a3d-sahne-sarmal {
        flex: 1 1 auto;
        min-height: 260px;
    }

    .a3d-ozet {
        flex: 0 0 auto;
        max-height: 34vh;
        width: 100%;
    }
}

/* Yatay mobil (landscape): dikey alan dar — özet yana alınır.
   min-width + min-height birlikte: telefon landscape'i yakalar,
   küçük dik ekranları etkilemez. */
@media (max-width: 991.98px) and (orientation: landscape) and (min-width: 500px) {
    .a3d-yerlesim {
        flex-direction: row;
    }

    .a3d-ozet {
        flex: 0 0 220px;
        max-height: 100%;
    }
}

/* Onay / sonuç modalları 3D modalın üstünde durmalı.
   Bootstrap modal varsayılanı 1055; bu katman onun üzerine çıkar. */
.a3d-ust-modal {
    z-index: 1080;
}

/* ── Tedarikçi seçim listesi (araç talep maili onayı) ── */
.a3d-nakliyeci-liste {
    max-height: 34vh;
    overflow-y: auto;
    border: 1px solid var(--lts-border);
    border-radius: .375rem;
    -webkit-overflow-scrolling: touch;
}

.a3d-nakliyeci-satir {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    padding: .45rem .6rem;
    border-bottom: 1px solid var(--lts-border);
    cursor: pointer;
    /* Dokunmatikte satır hedefi rahat olsun */
    min-height: 44px;
}

    .a3d-nakliyeci-satir:last-child {
        border-bottom: 0;
    }

    .a3d-nakliyeci-satir:hover {
        background: var(--lts-accent-faint);
    }

.a3d-nakliyeci-bilgi {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.a3d-nakliyeci-unvan {
    font-size: var(--lts-fs-sm);
    font-weight: 600;
    line-height: 1.2;
}

.a3d-nakliyeci-mail {
    font-size: var(--lts-fs-xs);
    color: var(--lts-muted);
    overflow-wrap: anywhere;
}

═════════════════════════════════════════════════════ */
/* Onay modallarındaki kayıt listesi.
   NOT: .mk-onay-liste sınıfı Toplama Sil onayında da kullanılıyordu
   ama hiçbir CSS'te tanımlı değildi; burada tanımlanınca o modal da
   düzelir. */
.mk-onay-liste {
    list-style: none;
    margin: 0 0 .5rem;
    padding: .35rem .5rem;
    max-height: 30vh;
    overflow-y: auto;
    border: 1px solid var(--lts-border);
    border-radius: .375rem;
    font-size: var(--lts-fs-sm);
    -webkit-overflow-scrolling: touch;
}

.mk-onay-liste li {
    padding: .15rem 0;
    border-bottom: 1px dashed var(--lts-border);
}

    .mk-onay-liste li:last-child {
        border-bottom: 0;
    }

/* ── Sürükleme geri bildirimi ──────────────────────────────
   AG Grid sürüklenen satırı .ag-row-dragging ile işaretler;
   kullanıcı neyi taşıdığını görmeli. */
.mal-kabul-page .ag-row-dragging {
    opacity: .65;
    outline: 2px dashed var(--lts-accent);
    outline-offset: -2px;
}

/* Bırakma hedefi vurgusu. AG Grid drop zone üzerindeyken
   grid köküne .ag-dnd-ghost-parent eklemez; bu yüzden hedef
   vurgusu grid kapsayıcısına hover ile verilir. */
.mal-kabul-page .ag-root-wrapper.mk-drop-hedef {
    box-shadow: inset 0 0 0 2px var(--lts-accent);
}

/* Sürükleme hayaleti (imleçle taşınan etiket).
   pointer-events:none ZORUNLU — hayalet imlecin tam altında durduğu için
   fare olaylarını yakalarsa altındaki grid tespit edilemez. JS tarafında
   ayrıca elementsFromPoint ile atlanıyor; ikisi birlikte güvenli. */
.ag-dnd-ghost {
    pointer-events: none !important;
    background: var(--lts-surface) !important;
    color: var(--lts-ink) !important;
    border: 1px solid var(--lts-accent) !important;
    font-size: var(--lts-fs-sm) !important;
}

    /* AG Grid'in "bırakılamaz" ikonu: kendi drop zone mekanizmasını
   kullanmadığımız için her zaman yasak işareti gösteriyor, yanıltıcı. */
    .ag-dnd-ghost .ag-dnd-ghost-icon {
        display: none !important;
    }

/* Sürükleme boyunca metin seçimi kapatılır.
   Grid'lerde enableCellTextSelection açık olduğu için imleç satırların
   üzerinden geçtikçe tüm hücreler seçiliyor ve ekran maviye boyanıyordu. */
body.mk-suruklemede,
body.mk-suruklemede * {
    user-select: none !important;
    -webkit-user-select: none !important;
    overflow: hidden !important;
}

    /* Form alanları HARİÇ. Sınıf herhangi bir sebeple gövdede takılı kalırsa
   (sürükleme yarıda kesilmesi vb.) kullanıcı metin kutularına yazamaz
   hale gelirdi; bazı tarayıcılarda user-select:none düzenlemeyi de
   engelliyor. */
    body.mk-suruklemede input,
    body.mk-suruklemede textarea,
    body.mk-suruklemede select,
    body.mk-suruklemede [contenteditable="true"] {
        user-select: text !important;
        -webkit-user-select: text !important;
    }

body.mk-suruklemede {
    cursor: copy;
    overflow: hidden !important;
}

/* Mobil kart aksiyonları — dokunmatik hedefi rahat olsun */
.mal-kabul-page .mk-card-satir .btn-sm {
    min-height: 36px;
}

/* ── Koyu tema düzeltmeleri ──────────────────────────────── */

/* Onay listesi kutusu */
.mk-onay-liste {
    background: var(--lts-surface-alt);
    color: var(--lts-text);
}

/* Sağ tık menüsü: hover zemini --lts-primary-soft ile geliyor ve koyu
   temada açık mavi kalıyordu; üzerindeki açık yazı okunmuyordu.
   Alt menü açan öğe sürekli hover'da göründüğü için en çok orada
   göze çarpıyor. */
[data-bs-theme="dark"] .mk-menu-oge:hover,
[data-bs-theme="dark"] .mk-menu-alt-sarmal:hover {
    background: var(--lts-accent-faint);
    color: var(--lts-text);
}

[data-bs-theme="dark"] .mk-menu-oge,
[data-bs-theme="dark"] .mk-menu-metin,
[data-bs-theme="dark"] .mk-menu-ok {
    color: var(--lts-text);
}

    /* Pasif öğeler: opacity .45 koyu zeminde okunmaz seviyeye düşüyordu */
    [data-bs-theme="dark"] .mk-menu-oge.pasif {
        opacity: .65;
        color: var(--lts-text-muted);
    }

/* Mobil kartlardaki aksiyon butonları */
[data-bs-theme="dark"] .mk-card-satir .btn-outline-success,
[data-bs-theme="dark"] .mk-card-satir .btn-outline-danger {
    background: transparent;
}
 



.a3d-dialog {
    max-width: min(1240px, 96vw);
}

.a3d-icerik {
    height: min(88vh, 900px);
    display: flex;
    flex-direction: column;
    background: var(--lts-surface);
    color: var(--lts-text);
    border: 1px solid var(--lts-border);
}

.a3d-govde {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Araç seçici butonları — çok araçta yatay kaydırma */
.a3d-arac-secici {
    display: flex;
    gap: .4rem;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: .2rem;
    -webkit-overflow-scrolling: touch;
}

    .a3d-arac-secici .btn {
        white-space: nowrap;
        flex: 0 0 auto;
    }

/* Sahne + özet yan yana; mobilde alt alta */
.a3d-yerlesim {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    gap: .5rem;
}

.a3d-sahne-sarmal {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    border: 1px solid var(--lts-border-strong);
    border-radius: .375rem;
    overflow: hidden;
    /* 3D sahne her temada koyu kalır; canvas arkası boş kalmasın */
    background: #20242b;
}

.a3d-sahne {
    position: absolute;
    inset: 0;
}

    .a3d-sahne canvas {
        display: block;
    }

.a3d-ozet {
    flex: 0 0 250px;
    align-self: flex-start;
    max-height: 100%;
    overflow-y: auto;
    background: var(--lts-surface);
    border-color: var(--lts-border);
    font-size: var(--lts-fs-sm);
}

.a3d-ozet-baslik {
    color: var(--lts-accent);
}

/* Palet detay kartı — sahnenin sağ üstünde yüzer */
.a3d-palet-detay {
    position: absolute;
    top: .5rem;
    right: .5rem;
    width: min(285px, calc(100% - 1rem));
    z-index: 10;
    background: var(--lts-surface);
    border: 1px solid var(--lts-accent);
    font-size: var(--lts-fs-sm);
}

.a3d-palet-baslik {
    color: var(--lts-accent);
    font-size: var(--lts-fs-md);
    line-height: 1.2;
}

.a3d-detay-satir {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    margin-top: .25rem;
}

    .a3d-detay-satir span {
        color: var(--lts-text-muted);
    }

    .a3d-detay-satir b {
        text-align: right;
    }

.a3d-detay-miktar {
    font-weight: 600;
    margin: .25rem 0 .4rem;
}

.a3d-ipucu {
    position: absolute;
    left: .5rem;
    bottom: .35rem;
    z-index: 5;
    color: #9ca3af;
    font-size: .72rem;
    pointer-events: none;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
}

/* ── Mobil / dar ekran ── */
@media (max-width: 991.98px) {
    .a3d-icerik {
        height: 100%;
    }

    .a3d-yerlesim {
        flex-direction: column;
    }

    .a3d-sahne-sarmal {
        flex: 1 1 auto;
        min-height: 260px;
    }

    .a3d-ozet {
        flex: 0 0 auto;
        max-height: 34vh;
        width: 100%;
    }
}

/* Yatay mobil (landscape): dikey alan dar — özet yana alınır.
   min-width + min-height birlikte: telefon landscape'i yakalar,
   küçük dik ekranları etkilemez. */
@media (max-width: 991.98px) and (orientation: landscape) and (min-width: 500px) {
    .a3d-yerlesim {
        flex-direction: row;
    }

    .a3d-ozet {
        flex: 0 0 220px;
        max-height: 100%;
    }
}

/* Onay / sonuç modalları 3D modalın üstünde durmalı.
   Bootstrap modal varsayılanı 1055; bu katman onun üzerine çıkar. */
.a3d-ust-modal {
    z-index: 1080;
}

/* ── Tedarikçi seçim listesi (araç talep maili onayı) ── */
.a3d-nakliyeci-liste {
    max-height: 34vh;
    overflow-y: auto;
    border: 1px solid var(--lts-border);
    border-radius: .375rem;
    -webkit-overflow-scrolling: touch;
}

.a3d-nakliyeci-satir {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    padding: .45rem .6rem;
    border-bottom: 1px solid var(--lts-border);
    cursor: pointer;
    /* Dokunmatikte satır hedefi rahat olsun */
    min-height: 44px;
}

    .a3d-nakliyeci-satir:last-child {
        border-bottom: 0;
    }

    .a3d-nakliyeci-satir:hover {
        background: var(--lts-accent-faint);
    }

.a3d-nakliyeci-bilgi {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.a3d-nakliyeci-unvan {
    font-size: var(--lts-fs-sm);
    font-weight: 600;
    line-height: 1.2;
}

.a3d-nakliyeci-mail {
    font-size: var(--lts-fs-xs);
    color: var(--lts-text-muted);
    overflow-wrap: anywhere;
}

/* ── Koyu tema düzeltmeleri ────────────────────────────────
   Modallar .lts-modal-backdrop sınıfını da taşır; aşağıdakiler
   yalnızca bu ekrana özel parçalar içindir. */

.a3d-ozet,
.a3d-palet-detay {
    background: var(--lts-surface);
    color: var(--lts-text);
    border-color: var(--lts-border);
}

.a3d-palet-detay {
    border-color: var(--lts-accent);
}

.a3d-detay-satir span {
    color: var(--lts-text-muted);
}

.a3d-detay-satir b,
.a3d-detay-miktar {
    color: var(--lts-text);
}

/* Tedarikçi seçim listesi */
.a3d-nakliyeci-liste {
    background: var(--lts-surface);
    color: var(--lts-text);
}

.a3d-nakliyeci-unvan {
    color: var(--lts-text);
}

.a3d-nakliyeci-mail {
    color: var(--lts-text-muted);
}

/* Araç seçici: seçili olmayan butonlar koyu temada okunur kalsın */
[data-bs-theme="dark"] .a3d-arac-secici .btn-outline-secondary {
    color: var(--lts-text);
    border-color: var(--lts-border-strong);
}

    [data-bs-theme="dark"] .a3d-arac-secici .btn-outline-secondary:hover {
        background: var(--lts-accent-faint);
        color: var(--lts-text);
    }

/* Badge'ler text-bg-light ile açık zeminli geliyor; koyu temada
   üzerindeki yazı görünmez oluyordu. */
[data-bs-theme="dark"] .a3d-arac-secici .badge.text-bg-light {
    background-color: var(--lts-surface-alt) !important;
    color: var(--lts-text) !important;
}
 

/* ═══════════════════════════════════════════════════════════
   GELEN ARAÇ EKRANI — V2
   Masaüstü: AG Grid / Mobil: sıkı kart görünümü
   - Seçim checkbox kolonu kaldırıldı
   - Araç Seç ve durum aksiyonu satır bazlı
   - Özetler filtre satırına taşındı
   - Ana grid ayarı Yenile'nin solunda
   ═══════════════════════════════════════════════════════════ */

.gelen-arac-page {
    --ga-plaka-bg: #f0f7ff;
    --ga-geldi-bg: #fff8cc;
    --ga-yuklendi-bg: #e8f8ea;
    --ga-cikti-bg: #fde8e8;
    --ga-rampada-bg: #e4f4fb;
    --ga-bekliyor-bg: var(--lts-surface);
    --ga-manuel-bg: #f3f4f6;
    --ga-plaka-accent: #7aa8d6;
    --ga-geldi-accent: #d6b84b;
    --ga-yuklendi-accent: #4e9d60;
    --ga-cikti-accent: #c65f5f;
    --ga-rampada-accent: #4e9ac2;
    color: var(--lts-text);
}

html[data-bs-theme="dark"] .gelen-arac-page {
    --ga-plaka-bg: rgba(70, 130, 180, .16);
    --ga-geldi-bg: rgba(218, 165, 32, .17);
    --ga-yuklendi-bg: rgba(46, 139, 87, .19);
    --ga-cikti-bg: rgba(205, 92, 92, .19);
    --ga-rampada-bg: rgba(70, 160, 210, .19);
    --ga-bekliyor-bg: var(--lts-surface);
    --ga-manuel-bg: rgba(148, 163, 184, .12);
    --ga-plaka-accent: #80b8ef;
    --ga-geldi-accent: #e5c95c;
    --ga-yuklendi-accent: #5fc478;
    --ga-cikti-accent: #df7777;
    --ga-rampada-accent: #64b8e8;
}

/* ───────────────────────────────────────────────────────────
   ÜST SATIR — filtre + özet + ayar + yenile
   ─────────────────────────────────────────────────────────── */

.gelen-arac-page .ga-filter {
    min-height: 32px;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 3px;
    padding: 2px 3px;
    background: var(--lts-surface);
    border: 1px solid var(--lts-border);
    border-radius: 5px;
}

.gelen-arac-page .ga-filter-item {
    display: flex;
    align-items: center;
    gap: 2px;
    min-width: 0;
}

.gelen-arac-page .ga-filter-date {
    flex: 0 0 138px;
    width: 138px;
}

.gelen-arac-page .ga-filter-type {
    flex: 0 0 138px;
    width: 138px;
}

.gelen-arac-page .ga-filter-search {
    flex: 1 1 320px;
    min-width: 220px;
}

.gelen-arac-page .ga-filter-caption {
    margin: 0;
    font-size: 9px;
    line-height: 1;
    font-weight: 700;
    color: var(--lts-text-muted);
    white-space: nowrap;
}

.gelen-arac-page .ga-filter .form-control-sm,
.gelen-arac-page .ga-filter .form-select-sm,
.gelen-arac-page .ga-filter .input-group-sm > .form-control,
.gelen-arac-page .ga-filter .input-group-sm > .input-group-text,
.gelen-arac-page .ga-filter .input-group-sm > .btn {
    min-height: 27px;
    height: 27px;
    padding-top: 1px;
    padding-bottom: 1px;
    font-size: 10.5px;
    line-height: 1;
}

/* Özetler artık ayrı satır değildir. */
.gelen-arac-page .ga-summary-inline {
    flex: 0 1 400px;
    min-width: 330px;
    display: grid;
    grid-template-columns: repeat(6, minmax(48px, 1fr));
    gap: 2px;
}

.gelen-arac-page .ga-summary-item {
    min-width: 0;
    height: 27px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 3px;
    padding: 0 5px;
    background: var(--lts-surface-alt);
    border: 1px solid var(--lts-border);
    border-radius: 4px;
    color: var(--lts-text);
    overflow: hidden;
}

    .gelen-arac-page .ga-summary-item span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 8.8px;
        color: var(--lts-text-muted);
    }

    .gelen-arac-page .ga-summary-item strong {
        flex: 0 0 auto;
        font-size: 11.5px;
        line-height: 1;
        color: var(--lts-text);
        font-variant-numeric: tabular-nums;
    }

.gelen-arac-page .ga-top-grid-settings {
    flex: 0 0 auto;
}

.gelen-arac-page .ga-yenile {
    flex: 0 0 72px;
    min-width: 72px;
    height: 27px;
    padding: 1px 6px;
    font-size: 10.5px;
}

/* ───────────────────────────────────────────────────────────
   GRID YERLEŞİMİ
   Üstte ayrı özet/aksiyon satırı kalmadığı için ekran daha çok grid'e ayrılır.
   ─────────────────────────────────────────────────────────── */

.gelen-arac-page .ga-layout {
    height: calc(100vh - 96px);
    min-height: 520px;
    display: grid;
    grid-template-rows: minmax(300px, 66%) minmax(170px, 34%);
    gap: 2px;
}

.gelen-arac-page .ga-panel {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--lts-border);
    border-radius: 4px;
    overflow: hidden;
    background: var(--lts-surface);
}

.gelen-arac-page .ga-panel-header {
    height: 27px;
    min-height: 27px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 4px;
    padding: 0 4px 0 6px;
    background: var(--lts-surface-alt);
    border-bottom: 1px solid var(--lts-border);
    color: var(--lts-text);
}

.gelen-arac-page .ga-panel-title {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    color: var(--lts-text) !important;
}

.gelen-arac-page .ga-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--lts-accent-soft);
    color: var(--lts-accent-dark);
    font-size: 9px;
    font-weight: 700;
}

html[data-bs-theme="dark"] .gelen-arac-page .ga-badge {
    background: rgba(var(--lts-accent-rgb), .20);
    color: var(--lts-accent-bright);
}

.gelen-arac-page .ga-grid {
    flex: 1 1 auto;
    width: 100%;
    min-height: 0;
}

/* ───────────────────────────────────────────────────────────
   GRID AYAR MENÜSÜ
   ─────────────────────────────────────────────────────────── */

.gelen-arac-page .ga-ayar-sarmal {
    position: relative;
}

.gelen-arac-page .ga-ayar-buton {
    width: 27px;
    min-width: 27px;
    height: 27px;
    padding: 0;
    line-height: 1;
    font-size: 10px;
}

.gelen-arac-page .ga-ayar-menu {
    position: absolute;
    z-index: 2147482500;
    top: calc(100% + 3px);
    right: 0;
    width: 122px;
    display: grid;
    gap: 3px;
    padding: 4px;
    background: var(--lts-surface);
    border: 1px solid var(--lts-border-strong);
    border-radius: 6px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .16);
}

    .gelen-arac-page .ga-ayar-menu .btn {
        width: 100%;
        min-height: 24px;
        padding: 1px 5px;
        text-align: left;
        font-size: 10px;
    }

/* ───────────────────────────────────────────────────────────
   AG GRID — satırlar tamamen sıkı
   ─────────────────────────────────────────────────────────── */

.gelen-arac-page .ag-theme-alpine {
    --ag-font-family: var(--lts-font);
    --ag-font-size: 10px;
    --ag-background-color: var(--lts-surface);
    --ag-foreground-color: var(--lts-text);
    --ag-header-background-color: var(--lts-surface-alt);
    --ag-header-foreground-color: var(--lts-text);
    --ag-border-color: var(--lts-border);
    --ag-secondary-border-color: var(--lts-border);
    --ag-row-border-color: var(--lts-border);
    --ag-odd-row-background-color: transparent;
    --ag-row-hover-color: rgba(var(--lts-accent-rgb), .07);
    --ag-selected-row-background-color: rgba(var(--lts-accent-rgb), .15);
    --ag-input-focus-border-color: var(--lts-accent);
    --ag-range-selection-border-color: var(--lts-accent);
    --ag-cell-horizontal-padding: 3px;
    --ag-grid-size: 2px;
    --ag-list-item-height: 23px;
    color: var(--lts-text);
}

    .gelen-arac-page .ag-theme-alpine .ag-root-wrapper {
        border: 0 !important;
        border-radius: 0 !important;
        background: var(--lts-surface) !important;
    }

    .gelen-arac-page .ag-theme-alpine .ag-header,
    .gelen-arac-page .ag-theme-alpine .ag-header-row,
    .gelen-arac-page .ag-theme-alpine .ag-header-cell,
    .gelen-arac-page .ag-theme-alpine .ag-header-group-cell {
        background: var(--lts-surface-alt) !important;
        color: var(--lts-text) !important;
    }

    .gelen-arac-page .ag-theme-alpine .ag-header-cell {
        padding-left: 3px !important;
        padding-right: 3px !important;
    }

    .gelen-arac-page .ag-theme-alpine .ag-header-cell-label {
        gap: 1px !important;
    }

    .gelen-arac-page .ag-theme-alpine .ag-header-cell-text,
    .gelen-arac-page .ag-theme-alpine .ag-header-group-text {
        color: var(--lts-text) !important;
        font-size: 9.5px !important;
        font-weight: 700 !important;
    }

    .gelen-arac-page .ag-theme-alpine .ag-row,
    .gelen-arac-page .ag-theme-alpine .ag-cell {
        color: var(--lts-text) !important;
    }

    .gelen-arac-page .ag-theme-alpine .ag-row {
        border-bottom: 1px solid var(--lts-border) !important;
    }

    .gelen-arac-page .ag-theme-alpine .ag-cell {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        padding-left: 3px !important;
        padding-right: 3px !important;
        line-height: 23px !important;
        border-right-color: var(--lts-border) !important;
    }

    .gelen-arac-page .ag-theme-alpine .ag-row:hover {
        filter: brightness(.985);
    }

html[data-bs-theme="dark"] .gelen-arac-page .ag-theme-alpine .ag-row:hover {
    filter: brightness(1.08);
}

/* Satırdaki işlem butonları */
.gelen-arac-page .ag-theme-alpine .ga-row-action-cell {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 2px !important;
    overflow: visible !important;
}

.gelen-arac-page .ga-grid-row-btn,
.gelen-arac-page .ga-row-btn {
    height: 19px;
    min-height: 19px;
    max-height: 19px;
    padding: 0 5px;
    border: 1px solid var(--lts-border-strong);
    border-radius: 3px;
    background: var(--lts-surface);
    color: var(--lts-text);
    font-family: var(--lts-font);
    font-size: 8.8px;
    font-weight: 700;
    line-height: 17px;
    white-space: nowrap;
    cursor: pointer;
}

    .gelen-arac-page .ga-grid-row-btn:hover:not(:disabled),
    .gelen-arac-page .ga-row-btn:hover:not(:disabled) {
        border-color: var(--lts-accent);
        background: var(--lts-accent-faint);
        color: var(--lts-accent-dark);
    }

.gelen-arac-page .ga-grid-row-btn-arac,
.gelen-arac-page .ga-row-btn-arac {
    border-color: rgba(var(--lts-accent-rgb), .45);
    color: var(--lts-accent-dark);
}

html[data-bs-theme="dark"] .gelen-arac-page .ga-grid-row-btn-arac,
html[data-bs-theme="dark"] .gelen-arac-page .ga-row-btn-arac {
    color: var(--lts-accent-bright);
}

.gelen-arac-page .ga-grid-row-btn-islem,
.gelen-arac-page .ga-row-btn-islem {
    border-color: var(--lts-accent);
    background: var(--lts-accent);
    color: #fff;
}

html[data-bs-theme="dark"] .gelen-arac-page .ga-grid-row-btn-islem,
html[data-bs-theme="dark"] .gelen-arac-page .ga-row-btn-islem {
    color: #0b1016;
}

.gelen-arac-page .ga-grid-row-btn-muted,
.gelen-arac-page .ga-grid-row-btn:disabled,
.gelen-arac-page .ga-row-btn:disabled {
    opacity: .48;
    cursor: default;
    background: var(--lts-surface-alt);
}

/* ───────────────────────────────────────────────────────────
   DURUM SATIR RENKLERİ
   ─────────────────────────────────────────────────────────── */

.gelen-arac-page .ag-theme-alpine .ga-satir-plaka {
    background: var(--ga-plaka-bg) !important;
}

.gelen-arac-page .ag-theme-alpine .ga-satir-geldi {
    background: var(--ga-geldi-bg) !important;
}

.gelen-arac-page .ag-theme-alpine .ga-satir-yuklendi {
    background: var(--ga-yuklendi-bg) !important;
}

.gelen-arac-page .ag-theme-alpine .ga-satir-cikti {
    background: var(--ga-cikti-bg) !important;
}

.gelen-arac-page .ag-theme-alpine .ga-satir-rampada {
    background: var(--ga-rampada-bg) !important;
}

.gelen-arac-page .ag-theme-alpine .ga-satir-bekliyor {
    background: var(--ga-bekliyor-bg) !important;
}

.gelen-arac-page .ag-theme-alpine .ga-satir-manuel {
    background: var(--ga-manuel-bg) !important;
}

/* Detayı açık satır soldan yeşil çizgiyle belirginleşir */
.gelen-arac-page .ag-theme-alpine .ga-satir-odak {
    box-shadow: inset 3px 0 0 var(--lts-accent) !important;
}

.gelen-arac-page .ag-theme-alpine .ga-plaka {
    font-weight: 800;
}

/* Durum rozetleri */
.gelen-arac-page .ga-durum,
.gelen-arac-page .ga-status {
    display: inline-flex;
    align-items: center;
    min-height: 17px;
    padding: 0 4px;
    border-radius: 3px;
    font-size: 8.8px;
    line-height: 1;
    font-weight: 700;
    border: 1px solid transparent;
    white-space: nowrap;
}

.gelen-arac-page .ga-durum-1,
.gelen-arac-page .ga-status-plaka {
    background: var(--ga-plaka-bg);
    border-color: var(--ga-plaka-accent);
    color: var(--lts-text);
}

.gelen-arac-page .ga-durum-2,
.gelen-arac-page .ga-status-geldi {
    background: var(--ga-geldi-bg);
    border-color: var(--ga-geldi-accent);
    color: var(--lts-text);
}

.gelen-arac-page .ga-durum-5,
.gelen-arac-page .ga-status-rampada {
    background: var(--ga-rampada-bg);
    border-color: var(--ga-rampada-accent);
    color: var(--lts-text);
}

.gelen-arac-page .ga-durum-3,
.gelen-arac-page .ga-status-yuklendi {
    background: var(--ga-yuklendi-bg);
    border-color: var(--ga-yuklendi-accent);
    color: var(--lts-text);
}

.gelen-arac-page .ga-durum-4,
.gelen-arac-page .ga-status-cikti {
    background: var(--ga-cikti-bg);
    border-color: var(--ga-cikti-accent);
    color: var(--lts-text);
}

.gelen-arac-page .ga-durum-9,
.gelen-arac-page .ga-status-manuel {
    background: var(--ga-manuel-bg);
    border-color: var(--lts-border-strong);
    color: var(--lts-text);
}

.gelen-arac-page .ga-durum-0,
.gelen-arac-page .ga-status-bekliyor {
    background: var(--ga-bekliyor-bg);
    border-color: var(--lts-border-strong);
    color: var(--lts-text-muted);
}

/* ───────────────────────────────────────────────────────────
   MOBİL — checkbox yok, satır bazlı aksiyonlar
   ─────────────────────────────────────────────────────────── */

.gelen-arac-page .ga-mobile {
    display: grid;
    gap: 2px;
}

.gelen-arac-page .ga-mobile-card {
    margin: 0;
    padding: 0;
    border: 1px solid var(--lts-border);
    border-left-width: 3px;
    border-radius: 4px;
    background: var(--lts-surface);
    overflow: hidden;
}

.gelen-arac-page .ga-mobile-state-1 {
    border-left-color: var(--ga-plaka-accent);
    background: var(--ga-plaka-bg);
}

.gelen-arac-page .ga-mobile-state-2 {
    border-left-color: var(--ga-geldi-accent);
    background: var(--ga-geldi-bg);
}

.gelen-arac-page .ga-mobile-state-3 {
    border-left-color: var(--ga-yuklendi-accent);
    background: var(--ga-yuklendi-bg);
}

.gelen-arac-page .ga-mobile-state-4 {
    border-left-color: var(--ga-cikti-accent);
    background: var(--ga-cikti-bg);
}

.gelen-arac-page .ga-mobile-state-5 {
    border-left-color: var(--ga-rampada-accent);
    background: var(--ga-rampada-bg);
}

.gelen-arac-page .ga-mobile-main {
    width: 100%;
    min-height: 27px;
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 1px 4px;
    border: 0;
    background: transparent;
    color: var(--lts-text);
    text-align: left;
}

.gelen-arac-page .ga-mobile-plaka {
    font-size: 11.5px;
    font-weight: 800;
}

.gelen-arac-page .ga-mobile-chevron {
    margin-left: auto;
    font-size: 9px;
    color: var(--lts-text-muted);
}

.gelen-arac-page .ga-mobile-meta {
    display: grid;
    grid-template-columns: 1.35fr 1fr 1.3fr .7fr;
    gap: 3px;
    padding: 0 4px 2px;
    font-size: 9px;
    color: var(--lts-text-muted);
}

    .gelen-arac-page .ga-mobile-meta span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.gelen-arac-page .ga-mobile-row-actions {
    display: flex;
    align-items: center;
    gap: 3px;
    padding: 2px 4px 3px;
    border-top: 1px solid color-mix(in srgb, var(--lts-border) 65%, transparent);
}

.gelen-arac-page .ga-mobile-detail {
    padding: 2px 4px 3px;
    border-top: 1px solid var(--lts-border);
    background: color-mix(in srgb, var(--lts-surface) 88%, transparent);
}

.gelen-arac-page .ga-mobile-detail-line {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1.2fr;
    gap: 4px;
    padding: 1px 0;
    border-bottom: 1px solid var(--lts-border);
    font-size: 9px;
    color: var(--lts-text-muted);
}

    .gelen-arac-page .ga-mobile-detail-line:last-child {
        border-bottom: 0;
    }

.gelen-arac-page .ga-empty {
    padding: 14px 8px;
    text-align: center;
    font-size: 10.5px;
    color: var(--lts-text-muted);
}

.gelen-arac-page .ga-modal-backdrop {
    background: var(--lts-backdrop);
}

/* ───────────────────────────────────────────────────────────
   RESPONSIVE
   ─────────────────────────────────────────────────────────── */

/* Orta genişlikte özetler ikinci satıra kayabilir; masaüstü grid korunur. */
@media (min-width: 992px) and (max-width: 1399.98px) {
    .gelen-arac-page .ga-filter {
        flex-wrap: wrap;
    }

    .gelen-arac-page .ga-filter-search {
        flex: 1 1 300px;
    }

    .gelen-arac-page .ga-summary-inline {
        flex: 1 1 100%;
        min-width: 0;
        order: 20;
    }

    .gelen-arac-page .ga-top-grid-settings,
    .gelen-arac-page .ga-yenile {
        order: 10;
    }

    .gelen-arac-page .ga-layout {
        height: calc(100vh - 125px);
    }
}

@media (max-width: 991.98px) {
    .gelen-arac-page .ga-filter {
        flex-wrap: wrap;
        gap: 2px;
    }

    .gelen-arac-page .ga-filter-date {
        flex: 1 1 calc(50% - 2px);
        width: auto;
    }

    .gelen-arac-page .ga-filter-type {
        flex: 1 1 130px;
        width: auto;
    }

    .gelen-arac-page .ga-filter-search {
        flex: 1 1 100%;
        order: 10;
    }

    .gelen-arac-page .ga-summary-inline {
        flex: 1 1 100%;
        min-width: 0;
        order: 20;
        grid-template-columns: repeat(3, 1fr);
    }

    .gelen-arac-page .ga-summary-item {
        height: 25px;
    }

    .gelen-arac-page .ga-top-grid-settings {
        display: none;
    }

    .gelen-arac-page .ga-yenile {
        flex: 0 0 72px;
    }
}

@media (max-width: 575.98px) {
    .gelen-arac-page {
        padding-left: 3px !important;
        padding-right: 3px !important;
    }

        .gelen-arac-page .ga-filter-caption {
            display: none;
        }

        .gelen-arac-page .ga-mobile-meta {
            grid-template-columns: 1fr 1fr;
        }

        .gelen-arac-page .ga-mobile-detail-line {
            grid-template-columns: 1fr;
            gap: 0;
        }
}

/* ============================================================
   TOPLAMA / MAL KABUL GİRİŞ — app.css SONUNA EKLENECEK
   ============================================================ */

.tg-root {
    --tg-gap: 3px;
    display: flex;
    flex-direction: column;
    gap: var(--tg-gap);
    width: 100%;
    height: 100%;
    min-height: 0;
    color: var(--lts-text);
    background: var(--lts-bg);
}

    .tg-root.tg-modal-mode {
        height: min(88vh, 820px);
        min-height: 520px;
    }

.tg-toolbar {
    min-height: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    padding: 2px 4px;
    background: var(--lts-surface);
    border: 1px solid var(--lts-border);
    border-radius: 5px;
}

.tg-toolbar-title {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
}

    .tg-toolbar-title > strong {
        flex: 0 0 auto;
        font-size: 11.5px;
    }

.tg-toolbar-sub {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--lts-text-muted);
    font-size: 9.5px;
}

.tg-toolbar-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 3px;
}

.tg-toolbar-btn {
    width: 28px;
    min-width: 28px;
    height: 26px;
    padding: 0;
    line-height: 1;
    font-size: 10px;
}

.tg-summary-inline {
    display: flex;
    align-items: center;
    gap: 2px;
}

    .tg-summary-inline > span {
        height: 24px;
        display: inline-flex;
        align-items: center;
        gap: 3px;
        padding: 0 5px;
        border: 1px solid var(--lts-border);
        border-radius: 4px;
        background: var(--lts-surface-alt);
        color: var(--lts-text-muted);
        font-size: 8.8px;
        white-space: nowrap;
    }

    .tg-summary-inline strong {
        color: var(--lts-text);
        font-size: 10px;
    }

.tg-status,
.tg-grid-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 17px;
    padding: 0 5px;
    border-radius: 3px;
    font-size: 8.5px;
    font-weight: 700;
    white-space: nowrap;
}

.tg-status-default {
    border: 1px solid var(--lts-border-strong);
    background: var(--lts-surface-alt);
}

.tg-status-success,
.tg-grid-status-ok {
    border: 1px solid rgba(46, 139, 87, .55);
    background: rgba(46, 139, 87, .13);
}

.tg-status-warning,
.tg-grid-status-wait {
    border: 1px solid rgba(218, 165, 32, .60);
    background: rgba(218, 165, 32, .14);
}

.tg-master {
    display: grid;
    gap: 2px;
    padding: 3px;
    background: var(--lts-surface);
    border: 1px solid var(--lts-border);
    border-radius: 5px;
}

.tg-master-group {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 2px;
}

.tg-master-primary {
    grid-template-columns: .8fr .8fr .8fr .9fr 1.7fr;
}

.tg-master-wide {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.tg-master-aciklama {
    grid-template-columns: 1fr;
}

.tg-master-field {
    min-width: 0;
    min-height: 29px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 4px;
    padding: 1px 5px;
    border: 1px solid var(--lts-border);
    border-radius: 3px;
    background: var(--lts-surface-alt);
}

.tg-master-label {
    color: var(--lts-text-muted);
    font-size: 8.5px;
    font-weight: 700;
    white-space: nowrap;
}

.tg-master-value {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--lts-text);
    font-size: 9.7px;
}

.tg-value-strong {
    font-weight: 800;
}

.tg-desktop {
    flex: 1 1 auto;
    min-height: 0;
}

.tg-panel {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--lts-border);
    border-radius: 5px;
    overflow: hidden;
    background: var(--lts-surface);
}

.tg-panel-header {
    height: 27px;
    min-height: 27px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 4px;
    padding: 0 5px;
    background: var(--lts-surface-alt);
    border-bottom: 1px solid var(--lts-border);
}

.tg-panel-title {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--lts-text);
    font-size: 9.8px;
    font-weight: 700;
}

.tg-panel-hint {
    color: var(--lts-text-muted);
    font-size: 8px;
}

.tg-count {
    min-width: 18px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--lts-accent-soft);
    color: var(--lts-accent-dark);
    font-size: 8.5px;
}

.tg-grid {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
}

.tg-grid-settings {
    position: relative;
}

.tg-grid-settings-menu {
    position: absolute;
    z-index: 2147483000;
    top: calc(100% + 3px);
    right: 0;
    width: 125px;
    display: grid;
    gap: 3px;
    padding: 4px;
    background: var(--lts-surface);
    border: 1px solid var(--lts-border-strong);
    border-radius: 6px;
    box-shadow: 0 8px 22px rgba(0,0,0,.18);
}

    .tg-grid-settings-menu .btn {
        width: 100%;
        min-height: 24px;
        padding: 1px 5px;
        text-align: left;
        font-size: 9.5px;
    }

/* AG Grid */
.tg-root .ag-theme-alpine {
    --ag-font-family: var(--lts-font);
    --ag-font-size: 9.7px;
    --ag-background-color: var(--lts-surface);
    --ag-foreground-color: var(--lts-text);
    --ag-header-background-color: var(--lts-surface-alt);
    --ag-header-foreground-color: var(--lts-text);
    --ag-border-color: var(--lts-border);
    --ag-row-border-color: var(--lts-border);
    --ag-row-hover-color: rgba(var(--lts-accent-rgb), .07);
    --ag-selected-row-background-color: rgba(var(--lts-accent-rgb), .14);
    --ag-cell-horizontal-padding: 3px;
    --ag-grid-size: 2px;
}

    .tg-root .ag-theme-alpine .ag-root-wrapper {
        border: 0 !important;
        border-radius: 0 !important;
    }

    .tg-root .ag-theme-alpine .ag-header-cell {
        padding-left: 3px !important;
        padding-right: 3px !important;
    }

    .tg-root .ag-theme-alpine .ag-header-cell-text {
        color: var(--lts-text) !important;
        font-size: 9.2px !important;
        font-weight: 700 !important;
    }

    .tg-root .ag-theme-alpine .ag-cell {
        padding-left: 3px !important;
        padding-right: 3px !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        line-height: 23px !important;
    }

    .tg-root .ag-theme-alpine .tg-num {
        text-align: right;
        font-variant-numeric: tabular-nums;
    }

    .tg-root .ag-theme-alpine .tg-grid-row-counted {
        background: rgba(46, 139, 87, .055) !important;
    }

    .tg-root .ag-theme-alpine .tg-grid-row-wait {
        background: transparent;
    }

html[data-bs-theme="dark"] .tg-root .ag-theme-alpine .tg-grid-row-counted {
    background: rgba(46, 139, 87, .13) !important;
}

.tg-mobile {
    display: grid;
    gap: 3px;
    overflow-y: auto;
}

.tg-mobile-card {
    border: 1px solid var(--lts-border);
    border-left: 3px solid rgba(218, 165, 32, .65);
    border-radius: 5px;
    background: var(--lts-surface);
    overflow: hidden;
}

.tg-mobile-counted {
    border-left-color: rgba(46, 139, 87, .75);
}

.tg-mobile-card-head {
    min-height: 29px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
    padding: 2px 5px;
    border-bottom: 1px solid var(--lts-border);
}

    .tg-mobile-card-head > div {
        min-width: 0;
        display: flex;
        align-items: center;
        gap: 5px;
    }

    .tg-mobile-card-head strong {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 10.5px;
    }

    .tg-mobile-card-head span {
        color: var(--lts-text-muted);
        font-size: 8.5px;
    }

.tg-counted-badge,
.tg-waiting-badge {
    flex: 0 0 auto;
    min-height: 17px;
    display: inline-flex;
    align-items: center;
    padding: 0 5px;
    border-radius: 3px;
    font-size: 8px !important;
    font-weight: 700;
}

.tg-counted-badge {
    border: 1px solid rgba(46, 139, 87, .55);
    background: rgba(46, 139, 87, .13);
}

.tg-waiting-badge {
    border: 1px solid rgba(218, 165, 32, .55);
    background: rgba(218, 165, 32, .13);
}

.tg-mobile-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2px;
    padding: 3px;
}

.tg-mobile-field {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 4px;
    padding: 2px 3px;
    border-bottom: 1px solid var(--lts-border);
    font-size: 8.8px;
}

.tg-mobile-label {
    color: var(--lts-text-muted);
}

.tg-mobile-field strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: right;
}

.tg-loading,
.tg-empty,
.tg-mobile-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 90px;
    padding: 10px;
    color: var(--lts-text-muted);
    background: var(--lts-surface);
    border: 1px solid var(--lts-border);
    border-radius: 5px;
    font-size: 10px;
}

@media (max-width: 991.98px) {
    .tg-root.tg-modal-mode {
        height: min(92vh, 900px);
    }

    .tg-toolbar {
        align-items: flex-start;
    }

    .tg-toolbar-title {
        flex-wrap: wrap;
    }

    .tg-summary-inline {
        display: none;
    }

    .tg-master-group,
    .tg-master-primary,
    .tg-master-wide {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .tg-master-group,
    .tg-master-primary,
    .tg-master-wide {
        grid-template-columns: 1fr;
    }

    .tg-mobile-grid {
        grid-template-columns: 1fr;
    }
}

/* Gelen Araç -> Toplama Giriş modalı için app.css sonuna ekle */

.gelen-arac-page ~ .modal .ga-toplama-modal-dialog,
.ga-toplama-modal-dialog {
    width: min(96vw, 1680px);
    max-width: min(96vw, 1680px);
    height: 94vh;
    margin: 3vh auto;
}

.ga-toplama-modal-content {
    height: 94vh;
    min-height: 560px;
    overflow: hidden;
    background: var(--lts-bg);
    border-color: var(--lts-border);
}

@media (max-width: 991.98px) {
    .ga-toplama-modal-dialog {
        width: 100vw;
        max-width: 100vw;
        height: 100dvh;
        margin: 0;
    }

    .ga-toplama-modal-content {
        height: 100dvh;
        min-height: 0;
        border-radius: 0;
    }
}

/* ============================================================
   TOPLAMA GİRİŞ - MASTER EDIT / LOOKUP EKLENTİSİ
   Mevcut ToplamaGiris app.css kurallarının SONUNA ekleyin.
   ============================================================ */

.tg-save-btn {
    min-height: 26px;
    padding: 2px 8px;
    font-size: 9.5px;
    white-space: nowrap;
}

.tg-master-edit {
    display: grid;
    gap: 3px;
    padding: 3px;
    background: var(--lts-surface);
    border: 1px solid var(--lts-border);
    border-radius: 5px;
}

.tg-readonly-strip {
    display: grid;
    grid-template-columns: 1fr .7fr .8fr 1.4fr;
    gap: 2px;
}

.tg-edit-grid {
    display: grid;
    grid-template-columns: .75fr 1fr 1.35fr 1.35fr;
    gap: 3px;
    align-items: start;
}

.tg-edit-field {
    min-width: 0;
}

    .tg-edit-field > label {
        display: block;
        margin: 0 0 1px 2px;
        color: var(--lts-text-muted);
        font-size: 8px;
        font-weight: 700;
        line-height: 1.1;
    }

    .tg-edit-field > small {
        display: block;
        min-width: 0;
        margin: 1px 2px 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: var(--lts-text-muted);
        font-size: 7.8px;
    }

.tg-span-2 {
    grid-column: span 2;
}

.tg-span-all {
    grid-column: 1 / -1;
}

.tg-input {
    min-height: 27px !important;
    height: 27px;
    padding: 2px 5px !important;
    font-size: 9.5px !important;
    color: var(--lts-text) !important;
    background: var(--lts-surface-alt) !important;
    border-color: var(--lts-border-strong) !important;
}

.tg-textarea {
    min-height: 38px !important;
    height: 38px;
    resize: vertical;
}

.tg-lookup {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 28px auto;
    gap: 2px;
}

.tg-lookup-btn,
.tg-clear-btn {
    width: 28px;
    min-width: 28px;
    height: 27px;
    padding: 0 !important;
    font-size: 9px !important;
}

.tg-backdrop {
    position: fixed;
    inset: 0;
    z-index: 2147483200;
    background: rgba(0, 0, 0, .42);
}

.tg-lookup-modal {
    position: fixed;
    z-index: 2147483210;
    top: 8vh;
    left: 50%;
    transform: translateX(-50%);
    width: min(920px, calc(100vw - 20px));
    max-height: 78vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--lts-surface);
    border: 1px solid var(--lts-border-strong);
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(0,0,0,.30);
}

.tg-lookup-modal-xl {
    width: min(1120px, calc(100vw - 20px));
}

.tg-modal-head {
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 4px 7px;
    background: var(--lts-surface-alt);
    border-bottom: 1px solid var(--lts-border);
}

    .tg-modal-head strong {
        font-size: 11px;
    }

.tg-modal-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 3px;
    padding: 5px;
    border-bottom: 1px solid var(--lts-border);
}

.tg-modal-table-wrap {
    overflow: auto;
    min-height: 120px;
    max-height: calc(78vh - 80px);
}

.tg-modal-table {
    margin: 0 !important;
    color: var(--lts-text);
    font-size: 9px;
}

    .tg-modal-table thead {
        position: sticky;
        top: 0;
        z-index: 2;
    }

    .tg-modal-table th {
        background: var(--lts-surface-alt) !important;
        color: var(--lts-text) !important;
        border-color: var(--lts-border) !important;
        white-space: nowrap;
        font-size: 8.6px;
    }

    .tg-modal-table td {
        color: var(--lts-text) !important;
        border-color: var(--lts-border) !important;
        vertical-align: middle;
    }

.tg-select-row {
    cursor: pointer;
}

    .tg-select-row:hover > td {
        background: rgba(var(--lts-accent-rgb), .08) !important;
    }

@media (max-width: 991.98px) {
    .tg-readonly-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tg-edit-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tg-span-2 {
        grid-column: span 1;
    }

    .tg-span-all {
        grid-column: 1 / -1;
    }

    .tg-lookup-modal,
    .tg-lookup-modal-xl {
        top: 4vh;
        width: calc(100vw - 10px);
        max-height: 88vh;
    }

    .tg-modal-table-wrap {
        max-height: calc(88vh - 80px);
    }
}

@media (max-width: 575.98px) {
    .tg-readonly-strip,
    .tg-edit-grid {
        grid-template-columns: 1fr;
    }

    .tg-span-all {
        grid-column: auto;
    }

    .tg-modal-search {
        grid-template-columns: minmax(0, 1fr) auto;
    }

        .tg-modal-search .btn-primary {
            grid-column: 1 / -1;
        }
}
.tg-page-modal-backdrop {
    background: rgba(15, 23, 42, .48);
    padding: 14px;
}

.tg-page-modal-dialog {
    width: min(1220px, calc(100vw - 28px));
    max-width: 1220px;
    margin: 0 auto;
}

.tg-page-modal-content {
    height: min(84dvh, 790px);
    max-height: 790px;
    overflow: hidden;
    border-radius: 12px;
    border: 1px solid var(--bs-border-color);
    background: var(--bs-body-bg);
    box-shadow: 0 22px 60px rgba(0,0,0,.24);
}

.tg-page-modal-host {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

    .tg-page-modal-host ::deep > * {
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
    }

@media (max-width: 991.98px) {
    .tg-page-modal-backdrop {
        padding: 8px;
    }

    .tg-page-modal-dialog {
        width: calc(100vw - 16px);
        max-width: calc(100vw - 16px);
    }

    .tg-page-modal-content {
        height: calc(100dvh - 20px);
        max-height: calc(100dvh - 20px);
    }
}
