/* Bootstrap 5.3 üzerine yalnızca proje kuralları. */

/* Kontrast (WCAG 2.2 AA, metin 4.5:1): Bootstrap'in çerçeveli butonları gri zeminde (kart başlığı) ve koyu temada
   yetersiz kalıyor; metin ve çerçeve rengi iki temada da yeterli tona çekilir. */
:root,
[data-bs-theme="light"] {
    --uyg-cerceve-mavi: #0a58ca;
    --uyg-cerceve-gri: #5c636a;
    --uyg-cerceve-yesil: #146c43;
    --uyg-cerceve-kirmizi: #b02a37;
    --uyg-dolu-yazi: #fff;
}

[data-bs-theme="dark"] {
    --uyg-cerceve-mavi: #6ea8fe;
    --uyg-cerceve-gri: #adb5bd;
    --uyg-cerceve-yesil: #75b798;
    --uyg-cerceve-kirmizi: #ea868f;
    --uyg-dolu-yazi: #000;
}

/* Üzerine gelince / basılıyken dolu görünüm de yeterli karşıtlıkta (telefonda dokunulan düğme bu halde kalabilir). */
.btn-outline-primary {
    --bs-btn-color: var(--uyg-cerceve-mavi);
    --bs-btn-border-color: var(--uyg-cerceve-mavi);
    --bs-btn-hover-color: var(--uyg-dolu-yazi);
    --bs-btn-hover-bg: var(--uyg-cerceve-mavi);
    --bs-btn-hover-border-color: var(--uyg-cerceve-mavi);
    --bs-btn-active-color: var(--uyg-dolu-yazi);
    --bs-btn-active-bg: var(--uyg-cerceve-mavi);
    --bs-btn-active-border-color: var(--uyg-cerceve-mavi);
}

.btn-outline-secondary {
    --bs-btn-color: var(--uyg-cerceve-gri);
    --bs-btn-border-color: var(--uyg-cerceve-gri);
}

/* Yeşil (onayla) ve kırmızı (sil, kapat) çerçeveli düğmeler: vurgulu (yeşil zeminli) satırda ve koyu temada da okunur. */
.btn-outline-success {
    --bs-btn-color: var(--uyg-cerceve-yesil);
    --bs-btn-border-color: var(--uyg-cerceve-yesil);
    --bs-btn-hover-color: var(--uyg-dolu-yazi);
    --bs-btn-hover-bg: var(--uyg-cerceve-yesil);
    --bs-btn-hover-border-color: var(--uyg-cerceve-yesil);
    --bs-btn-active-color: var(--uyg-dolu-yazi);
    --bs-btn-active-bg: var(--uyg-cerceve-yesil);
    --bs-btn-active-border-color: var(--uyg-cerceve-yesil);
}

.btn-outline-danger {
    --bs-btn-color: var(--uyg-cerceve-kirmizi);
    --bs-btn-border-color: var(--uyg-cerceve-kirmizi);
    --bs-btn-hover-color: var(--uyg-dolu-yazi);
    --bs-btn-hover-bg: var(--uyg-cerceve-kirmizi);
    --bs-btn-hover-border-color: var(--uyg-cerceve-kirmizi);
    --bs-btn-active-color: var(--uyg-dolu-yazi);
    --bs-btn-active-bg: var(--uyg-cerceve-kirmizi);
    --bs-btn-active-border-color: var(--uyg-cerceve-kirmizi);
}
[data-bs-theme="dark"] .link-danger {
    color: var(--bs-danger-text-emphasis) !important;
}

/* ---------------------------------------------------------------- Ana menü (Stok / Cari / Hizmet / Masraf açılır grupları) */

/* Açılır menüler kart sayfalarındaki yapışkan arama bölümünün (z-index 1020) üstünde kalsın; pencereler (1055) yine üstte. */
.ust-bolum {
    position: relative;
    z-index: 1030;
}

.menu-marka {
    padding-block: .5rem;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--bs-emphasis-color);
    text-decoration: none;
}

.ana-menu .nav-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding-inline: .75rem;
    color: var(--bs-body-color);
    border-radius: var(--bs-border-radius);
}

.ana-menu .nav-link:hover,
.ana-menu .nav-link.show {
    color: var(--bs-emphasis-color);
    background-color: var(--bs-secondary-bg);
}

/* Bulunulan bölüm: kalın yazı ve alt çizgi (yalnızca renkle ayırt edilmez). */
.ana-menu .nav-link.active {
    font-weight: 600;
    color: var(--bs-emphasis-color);
    box-shadow: inset 0 -3px 0 var(--uyg-cerceve-mavi);
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

/* Menüdeki geçerli sayfa: Bootstrap'in #0d6efd zemini beyaz yazıyla sınırda kalıyor; iki temada da yeterli karşıtlık. */
.ana-menu .dropdown-menu {
    --bs-dropdown-link-active-bg: var(--uyg-cerceve-mavi);
    --bs-dropdown-link-active-color: var(--uyg-dolu-yazi);
}

.ana-menu .dropdown-item {
    display: flex;
    align-items: center;
    min-height: 44px;
}

/* Onay kutusu ve anahtar: kapalıyken çerçeve ve düğme zeminden ayırt edilsin (bileşen sınırı en az 3:1). */
.form-check-input {
    border-color: var(--bs-secondary-color);
}

.form-switch .form-check-input:not(:checked) {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%235c636a'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] .form-switch .form-check-input:not(:checked) {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23adb5bd'/%3e%3c/svg%3e");
}

/* Dokunma hedefi en az 44 px (mobilde rahat kullanım). */
.btn,
.form-control,
.form-select {
    min-height: 44px;
}

/* Bağlantı olarak yazılan butonlarda da metin dikeyde ortalansın. */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* jQuery unobtrusive doğrulama sınıflarını Bootstrap görünümüne bağla. */
.field-validation-error {
    display: block;
    margin-top: .25rem;
    font-size: .875em;
    color: var(--bs-form-invalid-color);
}

.input-validation-error {
    border-color: var(--bs-form-invalid-border-color);
}

.input-validation-error:focus {
    border-color: var(--bs-form-invalid-border-color);
    box-shadow: 0 0 0 .25rem rgba(var(--bs-danger-rgb), .25);
}

.validation-summary-valid {
    display: none;
}

.validation-summary-errors ul {
    margin-bottom: 0;
}

/* Birim kutuları ve fiyat listesi kutuları: başlık çerçevenin üst çizgisinde */
fieldset.birim legend,
fieldset.fiyat-listesi legend {
    float: none;
    width: auto;
    margin-bottom: .5rem;
    padding: 0 .25rem;
    font-size: 1rem;
    font-weight: 600;
}

.min-w-0 {
    min-width: 0;
}

/* Formlu modal: başlık ve alt çubuk sabit, gövde kayar (modal-dialog-scrollable; form, modal-content ile gövde arasında). */
.modal-content > form {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

/* ---------------------------------------------------------------- Kart sayfaları (stok kartı, cari kartı) */

/* Geniş ekranda arama üstte sabit kalır; başka karta geçmek için yukarı kaydırmak gerekmez. */
@media (min-width: 768px) {
    .arama-bolumu {
        position: sticky;
        top: 0;
        z-index: 1020;
        margin-top: -1rem;
        padding-block: 1rem .75rem;
        background-color: var(--bs-body-bg);
    }
}

/* Bölüm bağlantısıyla (telefon) kaydırınca kart başlığı sabit arama alanının altında kalmasın. */
.grup-karti {
    scroll-margin-top: 10rem;
}

.arama-alani,
.secim-alani {
    position: relative;
}

/* Arama sonuçları ve yazarak seçme kutusunun listesi aynı görünür. */
.arama-paneli,
.secim-listesi {
    position: absolute;
    top: calc(100% + .25rem);
    left: 0;
    right: 0;
    z-index: 1030;
    max-height: min(60vh, 28rem);
    overflow-y: auto;
    background-color: var(--bs-body-bg);
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius-lg);
    box-shadow: var(--bs-box-shadow-lg);
}

.arama-secenegi[aria-selected="true"],
.secim-secenegi[aria-selected="true"] {
    background-color: var(--bs-primary-bg-subtle);
    color: var(--bs-primary-text-emphasis);
    box-shadow: inset 4px 0 0 var(--bs-primary);
}

/* Yazarak seçme kutusu: seçenek adı solda, ek bilgisi (ör. il) sağda */
.secim-secenegi {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    padding: .5rem 1rem;
    cursor: pointer;
    border-bottom: var(--bs-border-width) solid var(--bs-border-color-translucent);
}

.secim-secenegi:hover {
    background-color: var(--bs-tertiary-bg);
}

.secim-secenegi small {
    flex: none;
    color: var(--bs-secondary-color);
}

.secim-secenegi[aria-selected="true"] small {
    color: inherit;
}

.secim-bos {
    padding: .5rem 1rem;
    color: var(--bs-secondary-color);
}

.arama-alt {
    padding: .5rem 1rem;
    border-top: var(--bs-border-width) solid var(--bs-border-color-translucent);
}

/* Kart özeti: kod, isim ve dört rakam kutusu */
.kart-rakamlari {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
    gap: .75rem;
}

.kart-rakamlari > div {
    min-width: 0;
    padding: .75rem 1rem;
    border-radius: var(--bs-border-radius-lg);
    background-color: var(--bs-tertiary-bg);
}

.kart-rakamlari dt {
    margin-bottom: .15rem;
    font-size: .8125rem;
    font-weight: 500;
    color: var(--bs-secondary-color);
}

.kart-rakamlari dd {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.kart-rakamlari dd small {
    font-size: .8125rem;
    font-weight: 500;
    color: var(--bs-secondary-color);
}

/* Bölüm kartı başlığı: ikon, başlık, Düzenle */
.grup-basligi {
    display: flex;
    align-items: center;
    gap: .75rem;
    background-color: var(--bs-tertiary-bg);
}

.grup-ikonu {
    flex: none;
    display: inline-grid;
    place-items: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: .6rem;
    font-size: 1.1rem;
    background-color: var(--bs-primary-bg-subtle);
    color: var(--bs-primary-text-emphasis);
}

/* Kartlardaki etiket / değer listesi */
.bilgi-listesi {
    display: grid;
    grid-template-columns: minmax(8rem, 38%) 1fr;
    gap: .5rem 1rem;
    margin: 0;
}

.bilgi-listesi dt {
    font-weight: 400;
    color: var(--bs-secondary-color);
}

.bilgi-listesi dd {
    margin: 0;
    font-weight: 500;
    overflow-wrap: anywhere;
}

.alt-baslik {
    margin-bottom: .5rem;
    font-size: .8125rem;
    font-weight: 600;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--bs-secondary-color);
}

/* Cari kartı sınıflandırma penceresi: seçim + "yeni tanım" / "tanımı düzenle" düğmeleri ve satır içi tanım paneli */
.tanim-secimi {
    display: flex;
    gap: .5rem;
}

.tanim-secimi .form-select {
    flex: 1 1 auto;
    min-width: 0;
}

.tanim-paneli:has(> *) {
    margin-top: .75rem;
    padding: .75rem 1rem 1rem;
    border: var(--bs-border-width) solid var(--bs-primary-border-subtle);
    border-radius: var(--bs-border-radius-lg);
    background-color: var(--bs-primary-bg-subtle);
}

.tanim-paneli legend {
    font-size: .9375rem;
    font-weight: 600;
}

/* Adres penceresi: her adres çerçeveli bir kutu, başlığı çerçevenin üstünde */
.adres-kutusu {
    padding: .5rem 1rem 1rem;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius-lg);
}

.adres-kutusu > legend {
    float: none;
    width: auto;
    padding-inline: .375rem;
}

/* Kart adres listesi: fatura / sevk rozetleri */
.adres-listesi > li + li {
    border-top: var(--bs-border-width) solid var(--bs-border-color-translucent);
}

/* Telefonda bölümlere hızlı geçiş şeridi */
.bolum-gezinti ul {
    overflow-x: auto;
    padding-bottom: .25rem;
    scrollbar-width: thin;
}

/* Kaydedilen kart kısa süre vurgulanır */
.kart-guncellendi {
    animation: kart-vurgu 1.8s ease-out;
}

@keyframes kart-vurgu {
    0%, 35% {
        border-color: var(--bs-success);
        box-shadow: 0 0 0 .25rem rgba(var(--bs-success-rgb), .5);
    }
    100% {
        box-shadow: 0 0 0 .25rem rgba(var(--bs-success-rgb), 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .kart-guncellendi {
        animation: none;
        border-color: var(--bs-success);
    }
}


/* ================================================================ Satış evrakı (teklif) */

/* Evrak özeti: etiket üstte, değer altta; genişliğe göre sütunlar */
.evrak-ozeti {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr));
    gap: .75rem 1.25rem;
    margin: 0;
}

.evrak-ozeti dt {
    font-size: .8125rem;
    font-weight: 500;
    color: var(--bs-secondary-color);
}

.evrak-ozeti dd {
    margin: 0;
    font-weight: 500;
    overflow-wrap: anywhere;
}

.evrak-ozeti .evrak-ozeti-genis {
    grid-column: 1 / -1;
}

/* Kalem tablosu: rakamlar hizalı */
.kalem-tablosu td,
.kalem-tablosu th {
    font-variant-numeric: tabular-nums;
}

.kalem-tablosu .kalem-adi {
    min-width: 14rem;
}

.ozel-satir {
    color: var(--bs-warning-text-emphasis);
}

/* Toplamlar */
.toplam-listesi > div {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    padding: .4rem 0;
    border-bottom: var(--bs-border-width) dashed var(--bs-border-color);
}

.toplam-listesi dt {
    font-weight: 400;
    color: var(--bs-secondary-color);
}

.toplam-listesi dd {
    margin: 0;
    text-align: end;
    font-variant-numeric: tabular-nums;
    font-weight: 500;
}

.toplam-listesi .genel-toplam {
    border-bottom: 0;
    padding-top: .75rem;
    font-size: 1.25rem;
}

.toplam-listesi .genel-toplam dt {
    color: var(--bs-body-color);
    font-weight: 600;
}

.toplam-listesi .genel-toplam dd {
    font-weight: 700;
}

/* Kalem penceresi */
.border-dashed {
    border-style: dashed !important;
}

.secili-kalem {
    padding: .5rem .75rem;
    border-radius: var(--bs-border-radius-lg);
    background-color: var(--bs-tertiary-bg);
}

/* Siparişte kalemin depodaki durumu ve satış fiyatının kaynağı (fiyat listesi) */
.depo-durumu {
    padding: .4rem .75rem;
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius-lg);
}

.depo-durumu [data-stok-uyarisi]:empty {
    display: none;
}

.fiyat-kaynagi {
    color: var(--bs-info-text-emphasis);
}

.input-group > .iskonto-tipi {
    flex: 0 0 auto;
    width: auto;
    min-width: 6.5rem;
}

/* İskontolar geniş ekranda iki sütun */
.iskonto-listesi {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    column-gap: 1rem;
}

.iskonto-listesi > [hidden] {
    display: none;
}

.kdv-dahil {
    font-variant-numeric: tabular-nums;
}

.kalem-ozeti {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr));
    gap: .5rem;
}

.kalem-ozeti > div {
    padding: .5rem .75rem;
    border-radius: var(--bs-border-radius);
    background-color: var(--bs-tertiary-bg);
}

.kalem-ozeti dt {
    font-size: .8125rem;
    font-weight: 500;
    color: var(--bs-secondary-color);
}

.kalem-ozeti dd {
    margin: 0;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.kalem-ozeti .kalem-ozeti-toplam {
    background-color: var(--bs-primary-bg-subtle);
    color: var(--bs-primary-text-emphasis);
}

.kalem-ozeti .kalem-ozeti-toplam dt {
    color: inherit;
}

/* Pencere içindeki arama paneli pencerenin kaydırma alanında kalır */
.modal .arama-paneli {
    max-height: 18rem;
    overflow-y: auto;
}

.teklif-cari {
    max-width: 22rem;
}

/* Faturalar: özet kartları (Bootstrap renk değişkenleriyle; açık ve koyu temada yeterli karşıtlık) */
.ozet-karti .ozet-etiket {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .35rem;
    font-size: .875rem;
    color: var(--bs-secondary-color);
}

.ozet-karti .ozet-ikonu {
    flex: none;
    display: inline-grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: .5rem;
    background-color: var(--bs-primary-bg-subtle);
    color: var(--bs-primary-text-emphasis);
}

.ozet-karti .ozet-deger {
    margin-bottom: .15rem;
    font-size: 1.3rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
}

.ozet-karti .ozet-alt {
    margin: 0;
    font-size: .8125rem;
    color: var(--bs-secondary-color);
}

.ozet-basari .ozet-ikonu {
    background-color: var(--bs-success-bg-subtle);
    color: var(--bs-success-text-emphasis);
}

.ozet-uyari .ozet-ikonu {
    background-color: var(--bs-warning-bg-subtle);
    color: var(--bs-warning-text-emphasis);
}

.ozet-tehlike {
    border-color: var(--bs-danger-border-subtle);
}

.ozet-tehlike .ozet-ikonu {
    background-color: var(--bs-danger-bg-subtle);
    color: var(--bs-danger-text-emphasis);
}

.ozet-tehlike .ozet-deger {
    color: var(--bs-danger-text-emphasis);
}

.fatura-tablosu .teklif-cari {
    max-width: 16rem;
}


/* Telefonda: evrak özeti iki sütun; .mobil-kart tablolar satır başına bir kart (etiketler hücrenin başında, data-etiket) */
@media (max-width: 575.98px) {
    .evrak-ozeti {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    /* Telefonda gruplar dört sütunlu ızgarada: açılır ok gizlenir (aria-expanded açılır menüyü yine bildirir). */
    .ana-menu .nav-link {
        padding-inline: .25rem;
        font-size: .875rem;
    }

    .ana-menu .dropdown-toggle::after {
        display: none;
    }
}

/* Geniş ekranda gruplar ve Ayarlar sağda yan yana (marka solda). */
@media (min-width: 992px) {
    .ana-menu-gruplar {
        margin-left: auto;
    }
}

/* Tablette menü markanın altında kendi satırında, sıkı aralıkla tek satır; Ayarlar marka satırının sağında. */
@media (max-width: 991.98px) {
    .ana-menu .nav-link {
        padding-inline: .5rem;
    }

    .ana-menu-ayarlar {
        order: 2;
        margin-left: auto;
    }

    .ana-menu-gruplar {
        order: 3;
        width: 100%;
    }
}

/* Telefonda gruplar dört sütunlu ızgarada (sekiz grup iki satıra düzgün dizilir). Açılan menü ızgaranın altında tam genişlikte
   panel olur: ilk satırın menüsü ikinci satırın düğmelerini örtmesin (Popper'ın konumu geçersiz kılınır). */
@media (max-width: 767.98px) {
    .ana-menu-gruplar {
        position: relative;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        width: 100%;
    }

    .ana-menu-gruplar > .dropdown {
        position: static;
    }

    .ana-menu-gruplar .nav-link {
        justify-content: center;
        width: 100%;
        white-space: nowrap;
    }

    .ana-menu-gruplar .dropdown-menu.show {
        position: absolute !important;
        inset: 100% 0 auto 0 !important;
        transform: none !important;
        margin-top: .25rem !important;
    }
}

@media (max-width: 767.98px) {
    .mobil-kart thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip-path: inset(50%);
        white-space: nowrap;
    }

    .mobil-kart,
    .mobil-kart tbody,
    .mobil-kart tr,
    .mobil-kart td {
        display: block;
    }

    .mobil-kart tr {
        padding: .75rem 1rem;
        border-bottom: var(--bs-border-width) solid var(--bs-border-color);
    }

    .mobil-kart > :not(caption) > * > td {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        gap: 1rem;
        padding: .15rem 0;
        border: 0;
        text-align: end !important;
        white-space: normal !important;
    }

    .mobil-kart td[data-etiket]::before {
        content: attr(data-etiket);
        flex: none;
        color: var(--bs-secondary-color);
        text-align: start;
    }

    .mobil-kart > :not(caption) > * > td.kalem-adi {
        display: block;
        min-width: 0;
        margin-bottom: .35rem;
        text-align: start !important;
    }

    .mobil-kart > :not(caption) > * > td.satir-no {
        display: none;
    }

    .mobil-kart > :not(caption) > * > td.islemler {
        justify-content: flex-end;
        padding-top: .5rem;
    }
}

/* Teklif operasyonları */
.teklif-ara {
    width: 100%;
    max-width: 22rem;
}

.teklif-tablosu td,
.teklif-tablosu th {
    font-variant-numeric: tabular-nums;
}

.teklif-tablosu tr[tabindex="-1"]:focus {
    outline: 3px solid var(--uyg-cerceve-mavi);
    outline-offset: -3px;
}

.teklif-sekmeleri {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
}

.teklif-sekmeleri .nav-link {
    white-space: nowrap;
}

.siparis-miktari {
    width: 9rem;
}

@media (max-width: 767.98px) {
    .siparis-miktari {
        width: auto;
    }
}
.flex-none {
    flex: none;
}


/* ================================================================ Föyler */

/* Satır renkleri: yumuşak zemin + sol kenarda koyu çizgi (renk tek başına bilgi taşımaz; yön ekran okuyucuya metinle de
   verilir). Açık ve koyu temada metin karşıtlığı korunur. */
:root,
[data-bs-theme="light"] {
    --foy-yesil-zemin: #edf8f1;
    --foy-yesil-cizgi: #2b9a5f;
    --foy-gul-zemin: #fdeff2;
    --foy-gul-cizgi: #d4436a;
    --foy-seftali-zemin: #fff2e4;
    --foy-seftali-cizgi: #de7518;
    --foy-nane-zemin: #e7f6f3;
    --foy-nane-cizgi: #1c9884;
    --foy-mavi-zemin: #ebf2ff;
    --foy-mavi-cizgi: #3a78de;
    --foy-lavanta-zemin: #f3effc;
    --foy-lavanta-cizgi: #7e5fcb;
    --foy-devir-zemin: #eceff2;
    --foy-devir-cizgi: #6c757d;
}

[data-bs-theme="dark"] {
    --foy-yesil-zemin: #1f3329;
    --foy-yesil-cizgi: #5cc98f;
    --foy-gul-zemin: #3a2329;
    --foy-gul-cizgi: #f0809d;
    --foy-seftali-zemin: #3a2c1e;
    --foy-seftali-cizgi: #f2a65c;
    --foy-nane-zemin: #1d3330;
    --foy-nane-cizgi: #5fd1bf;
    --foy-mavi-zemin: #1f2b40;
    --foy-mavi-cizgi: #84aef5;
    --foy-lavanta-zemin: #2c2640;
    --foy-lavanta-cizgi: #b59cf0;
    --foy-devir-zemin: #2b3035;
    --foy-devir-cizgi: #adb5bd;
}

.foy-yesil { --foy-zemin: var(--foy-yesil-zemin); --foy-cizgi: var(--foy-yesil-cizgi); }
.foy-gul { --foy-zemin: var(--foy-gul-zemin); --foy-cizgi: var(--foy-gul-cizgi); }
.foy-seftali { --foy-zemin: var(--foy-seftali-zemin); --foy-cizgi: var(--foy-seftali-cizgi); }
.foy-nane { --foy-zemin: var(--foy-nane-zemin); --foy-cizgi: var(--foy-nane-cizgi); }
.foy-mavi { --foy-zemin: var(--foy-mavi-zemin); --foy-cizgi: var(--foy-mavi-cizgi); }
.foy-lavanta { --foy-zemin: var(--foy-lavanta-zemin); --foy-cizgi: var(--foy-lavanta-cizgi); }
.foy-devir { --foy-zemin: var(--foy-devir-zemin); --foy-cizgi: var(--foy-devir-cizgi); }

.foy-hesap {
    overflow-wrap: anywhere;
}

/* Lejant kutucukları */
.foy-renk {
    display: inline-block;
    width: .95rem;
    height: .95rem;
    margin-right: .35rem;
    vertical-align: -.15rem;
    border: 1px solid var(--bs-border-color);
    border-radius: .25rem;
    background-color: var(--foy-zemin);
    box-shadow: inset 3px 0 0 var(--foy-cizgi);
}

.foy-lejant {
    border-bottom: var(--bs-border-width) solid var(--bs-border-color-translucent);
}

/* Tablo kendi içinde kayar: başlık üstte, dip toplam altta sabit; çok kolonda yatay kaydırma. */
.foy-kaydirma {
    max-height: min(72vh, 52rem);
    overflow: auto;
    overscroll-behavior: contain;
}

.foy-kaydirma:focus-visible {
    outline: 3px solid var(--uyg-cerceve-mavi);
    outline-offset: -3px;
}

.foy-tablosu {
    font-size: .875rem;
    font-variant-numeric: tabular-nums;
}

/* Başlık (ve sipariş föyünde altındaki filtre satırı) birlikte yapışık. */
.foy-tablosu > thead {
    position: sticky;
    top: 0;
    z-index: 2;
}

.foy-tablosu > thead > tr > th {
    --bs-table-bg: var(--bs-tertiary-bg);
    font-weight: 600;
    white-space: nowrap;
    box-shadow: inset 0 -1px 0 var(--bs-border-color);
}

/* Sipariş föyü kolon filtreleri: başlığın altında; dolu filtre vurgulu. */
.foy-filtre-satiri > td {
    --bs-table-bg: var(--bs-tertiary-bg);
    padding: .25rem .3rem;
    box-shadow: inset 0 -1px 0 var(--bs-border-color);
}

.foy-filtre-satiri .form-control,
.foy-filtre-satiri .form-select {
    min-width: 6.5rem;
    font-size: .8125rem;
}

.foy-filtre-satiri .foy-filtre-dolu {
    border-color: var(--bs-primary);
    background-color: var(--bs-primary-bg-subtle);
}

.foy-filtreler {
    background-color: var(--bs-primary-bg-subtle);
}

.foy-filtre-cipi {
    --bs-btn-padding-y: .15rem;
    --bs-btn-bg: var(--bs-body-bg);
}

.foy-tablosu > tfoot > tr > * {
    position: sticky;
    bottom: 0;
    z-index: 2;
    --bs-table-bg: var(--bs-tertiary-bg);
    font-weight: 600;
    border-bottom: 0;
    box-shadow: inset 0 1px 0 var(--bs-border-color);
}

.foy-tablosu > tbody > tr.foy-satir {
    --bs-table-bg: var(--foy-zemin, var(--bs-body-bg));
}

.foy-tablosu > tbody > tr.foy-satir > td:first-child {
    box-shadow: inset 4px 0 0 var(--foy-cizgi, transparent);
}

.foy-tablosu > tbody > tr.foy-satir:hover > td {
    background-image: linear-gradient(rgba(var(--bs-emphasis-color-rgb), .045), rgba(var(--bs-emphasis-color-rgb), .045));
}

.foy-tablosu > tbody > tr.foy-devir > td {
    font-weight: 600;
}

.foy-tablosu > tbody > tr.foy-kapali > td {
    color: var(--uyg-cerceve-gri);
}

.foy-tablosu > tbody > tr.foy-yeni > td:first-child {
    box-shadow: inset 4px 0 0 var(--foy-cizgi, transparent), inset 7px 0 0 var(--bs-body-bg), inset 9px 0 0 var(--uyg-cerceve-mavi);
}

.foy-tablosu tr:focus {
    outline: 3px solid var(--uyg-cerceve-mavi);
    outline-offset: -3px;
}

.foy-ac-kolonu {
    width: 2.75rem;
    min-width: 2.75rem;
}

.foy-tablosu .foy-bakiye {
    font-weight: 600;
}

.foy-tablosu .foy-eksi {
    color: var(--bs-danger-text-emphasis);
}

.foy-uzun {
    min-width: 9rem;
    max-width: 15rem;
    white-space: normal;
}

.foy-uzun > span {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

/* Satırın detay düğmesi: küçük yuvarlak "+"; açıkken "×". */
.btn.foy-ac {
    width: 28px;
    height: 28px;
    min-height: 28px;
    padding: 0;
    border: 1px solid var(--uyg-cerceve-gri);
    border-radius: 50%;
    color: var(--uyg-cerceve-gri);
    background-color: var(--bs-body-bg);
    line-height: 1;
}

.btn.foy-ac:hover,
.btn.foy-ac[aria-expanded="true"] {
    color: var(--uyg-dolu-yazi);
    background-color: var(--uyg-cerceve-mavi);
    border-color: var(--uyg-cerceve-mavi);
}

.btn.foy-ac i {
    transition: transform .15s ease-out;
}

.btn.foy-ac[aria-expanded="true"] i {
    transform: rotate(45deg);
}

@media (prefers-reduced-motion: reduce) {
    .btn.foy-ac i {
        transition: none;
    }
}

/* "Daha eskiye git" ve aralığın başı: yatay kaydırmada da görünür kalır. */
.foy-tablosu > tbody > tr.foy-yukle > td,
.foy-tablosu > tbody > tr.foy-bas > td {
    padding: .6rem .75rem;
    --bs-table-bg: var(--bs-body-bg);
}

.foy-uc {
    position: sticky;
    left: .75rem;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem .75rem;
    max-width: calc(var(--foy-gorunur, 100vw) - 2rem);
}

/* Satır içi detay */
.foy-tablosu > tbody > tr.foy-detay-satiri > td {
    padding: .75rem 1rem 1rem;
    --bs-table-bg: var(--bs-body-bg);
    box-shadow: inset 4px 0 0 var(--uyg-cerceve-mavi);
    white-space: normal;
}

.foy-detay-icerik {
    position: sticky;
    left: 1rem;
    width: min(72rem, calc(var(--foy-gorunur, 100vw) - 3rem));
}

.foy-detay-bilgi {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
    gap: .35rem 1.25rem;
    margin: 0;
}

.foy-detay-bilgi dt {
    font-size: .75rem;
    font-weight: 500;
    color: var(--bs-secondary-color);
}

.foy-detay-bilgi dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.foy-detay-tablosu {
    font-size: .8125rem;
    font-variant-numeric: tabular-nums;
}

.foy-detay-tablosu > thead > tr > th {
    --bs-table-bg: var(--bs-tertiary-bg);
    white-space: nowrap;
}

.foy-detay-tablosu > tbody > tr.foy-detay-secili > td {
    --bs-table-bg: var(--bs-warning-bg-subtle);
}

/* Özet kartları: yumuşak kırmızı ikon ve vurgulu değer */
.ozet-tehlike-yumusak .ozet-ikonu {
    background-color: var(--bs-danger-bg-subtle);
    color: var(--bs-danger-text-emphasis);
}

.ozet-vurgu {
    border-color: var(--bs-primary-border-subtle);
}

.ozet-vurgu .ozet-deger {
    color: var(--bs-primary-text-emphasis);
}

/* ================================================================ Tahsilat ve tediye makbuzu */

/* Ödeme yöntemlerinin tatlı renkleri (föy renkleriyle aynı aile): zemin ve sol kenar çizgisi. */
.yontem-nakit { --yontem-zemin: var(--foy-yesil-zemin); --yontem-cizgi: var(--foy-yesil-cizgi); }
.yontem-cek { --yontem-zemin: var(--foy-mavi-zemin); --yontem-cizgi: var(--foy-mavi-cizgi); }
.yontem-senet { --yontem-zemin: var(--foy-lavanta-zemin); --yontem-cizgi: var(--foy-lavanta-cizgi); }
.yontem-kart { --yontem-zemin: var(--foy-seftali-zemin); --yontem-cizgi: var(--foy-seftali-cizgi); }
.yontem-havale { --yontem-zemin: var(--foy-nane-zemin); --yontem-cizgi: var(--foy-nane-cizgi); }
.yontem-soz { --yontem-zemin: var(--foy-gul-zemin); --yontem-cizgi: var(--foy-gul-cizgi); }

.yontem-dugmeleri {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
    gap: .5rem;
}

.btn.yontem-dugmesi {
    gap: .5rem;
    justify-content: flex-start;
    padding: .6rem .85rem;
    font-weight: 500;
    color: var(--bs-body-color);
    background-color: var(--yontem-zemin);
    border: 1px solid var(--bs-border-color);
    box-shadow: inset 4px 0 0 var(--yontem-cizgi);
}

.btn.yontem-dugmesi:hover,
.btn.yontem-dugmesi:focus-visible {
    color: var(--bs-emphasis-color);
    border-color: var(--yontem-cizgi);
}

.btn.yontem-dugmesi:disabled {
    opacity: 1;
    color: var(--bs-secondary-color);
    background-color: var(--bs-tertiary-bg);
    box-shadow: none;
}

.btn.yontem-dugmesi i {
    font-size: 1.15rem;
    color: var(--yontem-cizgi);
}

.btn.yontem-dugmesi:disabled i {
    color: inherit;
}

.makbuz-satirlari {
    display: grid;
    gap: .75rem;
}

.makbuz-satiri {
    padding: .75rem 1rem 1rem;
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius-lg);
    background-color: var(--yontem-zemin);
    box-shadow: inset 5px 0 0 var(--yontem-cizgi);
}

.makbuz-satiri-ust {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem .75rem;
    margin-bottom: .5rem;
}

.makbuz-satiri .yontem-ikonu {
    display: inline-grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: .5rem;
    color: var(--yontem-cizgi);
    background-color: var(--bs-body-bg);
}

.satir-referans {
    padding: .1rem .5rem;
    border-radius: 1rem;
    background-color: var(--bs-body-bg);
}

.satir-dugmeleri .btn {
    min-height: 32px;
    min-width: 32px;
    background-color: var(--bs-body-bg);
}

.makbuz-tutar {
    font-variant-numeric: tabular-nums;
}

/* Renkli satır zemininde hata metni de yeterli karşıtlıkta */
.makbuz-satiri .invalid-feedback,
.makbuz-satiri .text-danger-emphasis {
    color: var(--bs-danger-text-emphasis);
    font-weight: 500;
}

.makbuz-diger > summary {
    cursor: pointer;
    color: var(--uyg-cerceve-mavi);
    font-weight: 500;
}

/* Toplam ve kaydet: sayfanın altında yapışkan. */
.makbuz-alt {
    position: sticky;
    bottom: .5rem;
    z-index: 1010;
    border-color: var(--bs-success-border-subtle);
    box-shadow: var(--bs-box-shadow);
}

.makbuz-toplam {
    margin-left: .35rem;
    font-size: 1.5rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

/* Telefonda alt çubuk ince: dağılım gizli, düğme yanında */
@media (max-width: 575.98px) {
    .makbuz-alt .card-body {
        padding: .5rem .75rem;
        gap: .5rem !important;
    }

    .makbuz-alt #makbuz-dagilim {
        display: none;
    }

    .makbuz-toplam {
        font-size: 1.2rem;
    }

    .makbuz-alt .btn-lg {
        padding-inline: 1rem !important;
        font-size: 1rem;
    }

    .makbuz-alt #makbuz-sonra {
        font-size: .75rem;
    }
}

.yontem-rozeti {
    display: inline-flex;
    align-items: center;
    padding: .1rem .5rem;
    font-size: .8125rem;
    border-radius: 1rem;
    background-color: var(--yontem-zemin);
    box-shadow: inset 3px 0 0 var(--yontem-cizgi);
    white-space: nowrap;
}

.yontem-rozeti i {
    color: var(--yontem-cizgi);
}

/* Tediye: portföyden ciro edilen evrakın bilgileri (salt okunur) */
.makbuz-evrak-bilgisi {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
    gap: .35rem .75rem;
    padding: .5rem .75rem;
    border-radius: var(--bs-border-radius);
    background-color: var(--bs-body-bg);
}

.makbuz-evrak-bilgisi dt {
    font-size: .75rem;
    font-weight: 500;
    color: var(--bs-secondary-color);
}

.makbuz-evrak-bilgisi dd {
    margin: 0;
    overflow-wrap: anywhere;
}

/* Portföy penceresi: uzun listede tablo kendi içinde kayar, başlık sabit */
.portfoy-tablosu-kap {
    max-height: min(55vh, 32rem);
}

.portfoy-tablosu > thead > tr > th {
    position: sticky;
    top: 0;
    z-index: 1;
    --bs-table-bg: var(--bs-tertiary-bg);
    white-space: nowrap;
}

.portfoy-tablosu .form-check-input {
    width: 1.35rem;
    height: 1.35rem;
    margin: 0;
}

.portfoy-tablosu label {
    cursor: pointer;
}

/* ================================================================ Satınalma talebi */

.talep-ekle .arama-alani {
    max-width: 42rem;
}

.talep-satirlari {
    display: grid;
    gap: .5rem;
}

/* Satır: telefonda numara + kalem, altında miktar ve düğmeler; geniş ekranda tek satır (başlık satırıyla hizalı). */
.talep-satir-basligi,
.talep-satiri-ana {
    display: grid;
    grid-template-columns: 1.75rem minmax(0, 1fr) auto;
    grid-template-areas: "no kalem kalem" ". miktar islem";
    gap: .5rem .75rem;
    align-items: center;
}

.talep-satir-basligi {
    display: none;
}

.talep-satiri {
    padding: .6rem .75rem;
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius-lg);
    background-color: var(--bs-body-bg);
}

/* Satıra özel proje / sorumluluk merkezi / ihtiyaç tarihi / açıklama: sol kenarda lavanta çizgi */
.talep-satiri.talep-satiri-ozel {
    box-shadow: inset 4px 0 0 var(--foy-lavanta-cizgi);
}

.talep-satiri.talep-satiri-hatali {
    border-color: var(--bs-danger-border-subtle);
    box-shadow: inset 4px 0 0 var(--bs-danger);
}

.talep-satiri.talep-satiri-yeni {
    animation: talep-yeni 1.2s ease-out;
}

@keyframes talep-yeni {
    from { background-color: var(--bs-success-bg-subtle); }
    to { background-color: var(--bs-body-bg); }
}

@media (prefers-reduced-motion: reduce) {
    .talep-satiri.talep-satiri-yeni {
        animation: none;
    }
}

.talep-satir-no {
    grid-area: no;
    align-self: start;
    display: inline-grid;
    place-items: center;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 50%;
    font-size: .8125rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    background-color: var(--bs-secondary-bg);
}

.talep-kalem {
    grid-area: kalem;
}

.talep-miktar {
    grid-area: miktar;
}

.talep-islemler {
    grid-area: islem;
    align-self: end;
    margin-bottom: 4px;
}

.talep-miktar-kutusu {
    font-variant-numeric: tabular-nums;
}

.talep-birim {
    flex: 0 0 auto;
    width: auto;
    max-width: 9rem;
}

.talep-durum {
    font-variant-numeric: tabular-nums;
}

.talep-satir-ozet .ozel {
    font-weight: 600;
    color: var(--bs-primary-text-emphasis);
}

.talep-satiri .btn[data-satir-ayar][aria-expanded="true"],
.talep-satiri.talep-satiri-ozel .btn[data-satir-ayar] {
    color: var(--bs-primary-text-emphasis);
    border-color: var(--bs-primary-border-subtle);
    background-color: var(--bs-primary-bg-subtle);
}

.talep-satiri-ayar {
    margin: .6rem 0 0 2.5rem;
    padding: .6rem .75rem .75rem;
    border-radius: var(--bs-border-radius);
    background-color: var(--bs-tertiary-bg);
}

.talep-satiri .invalid-feedback,
.talep-satiri .text-danger-emphasis {
    color: var(--bs-danger-text-emphasis);
}

@media (min-width: 992px) {
    .talep-satir-basligi,
    .talep-satiri-ana {
        grid-template-columns: 1.75rem minmax(0, 1fr) 17rem 9.5rem;
        grid-template-areas: "no kalem miktar islem";
    }

    .talep-satir-basligi {
        display: grid;
        padding: 0 calc(.75rem + 1px) .25rem;
        font-size: .8125rem;
        font-weight: 600;
        color: var(--bs-secondary-color);
    }

    .talep-islemler {
        align-self: center;
        justify-self: end;
        margin-bottom: 0;
    }

    /* Başlık satırı göründüğünde miktar etiketi ekran okuyucuya kalır */
    .talep-satiri .satir-etiketi {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        padding: 0 !important;
        margin: -1px !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        white-space: nowrap !important;
        border: 0 !important;
    }
}

@media (max-width: 575.98px) {
    .talep-satiri-ayar {
        margin-left: 0;
    }
}

/* ================================================================ Depo fişleri (talep satırının düzeni; fiyat ve tutar sütunlarıyla) */

.depo-fis-satir-basligi,
.depo-fis-satiri .talep-satiri-ana {
    display: grid;
    grid-template-columns: 1.75rem minmax(0, 1fr) minmax(0, 1fr) auto;
    grid-template-areas: "no kalem kalem kalem" ". miktar miktar miktar" ". fiyat tutar islem";
    gap: .5rem .75rem;
    align-items: center;
}

.depo-fis-satir-basligi {
    display: none;
}

.depo-fis-fiyat {
    grid-area: fiyat;
}

.depo-fis-tutar {
    grid-area: tutar;
    align-self: end;
    padding-bottom: .4rem;
    font-variant-numeric: tabular-nums;
}

.depo-fis-satiri .talep-islemler {
    align-self: end;
}

.depo-fis-toplu {
    flex: 0 1 24rem;
    min-width: 0;
}

.depo-fis-kalemleri td,
.depo-fis-kalemleri th {
    font-variant-numeric: tabular-nums;
}

@media (min-width: 992px) {
    .depo-fis-satir-basligi,
    .depo-fis-satiri .talep-satiri-ana {
        grid-template-columns: 1.75rem minmax(0, 1fr) 15rem 9rem 8rem 2.25rem;
        grid-template-areas: "no kalem miktar fiyat tutar islem";
    }

    .depo-fis-satir-basligi {
        display: grid;
        padding: 0 calc(.75rem + 1px) .25rem;
        font-size: .8125rem;
        font-weight: 600;
        color: var(--bs-secondary-color);
    }

    .depo-fis-tutar {
        align-self: center;
        padding-bottom: 0;
    }

    .depo-fis-satiri .talep-islemler {
        align-self: center;
    }
}

/* Satınalma talep operasyonları: listede kalem özeti; talepten sipariş penceresinde tedarikçi kutusu ve kalem sütunları */
.talep-kalemleri {
    display: block;
    max-width: 18rem;
}

.tedarikci-secili {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .6rem .75rem;
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius-lg);
    background-color: var(--bs-tertiary-bg);
}

.talep-siparis-tablosu td,
.talep-siparis-tablosu th {
    font-variant-numeric: tabular-nums;
}

.talep-siparis-miktar {
    width: 10rem;
}

.talep-siparis-fiyat {
    width: 11rem;
}

.talep-siparis-iskonto {
    width: 5.5rem;
}

.talep-siparis-kdv {
    width: 6.5rem;
}

.talep-siparis-teslim {
    width: 9.5rem;
}

.fiyat-kaynagi {
    font-size: .75rem;
    line-height: 1.25;
}

@media (max-width: 767.98px) {
    .talep-kalemleri {
        max-width: none;
    }

    .talep-siparis-miktar,
    .talep-siparis-fiyat,
    .talep-siparis-iskonto,
    .talep-siparis-kdv,
    .talep-siparis-teslim {
        width: auto;
    }

    /* Telefonda kalem kartında kutular etiketin karşısında makul genişlikte */
    .talep-siparis-tablosu td > .d-block {
        width: min(14rem, 60%);
    }
}

/* Süzgeçte uygulanmamış değişiklik: "Göster" vurgulu */
.foy-bekliyor {
    box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb), .4);
}

/* Boş durum ve yükleniyor */
.foy-bos-ikonu {
    font-size: 3rem;
    color: var(--bs-secondary-color);
}

/* Kolon seçici */
.kolon-secici {
    --bs-offcanvas-width: min(27rem, 100vw);
}

.kolon-listesi {
    margin: 0;
    padding: 0;
}

[data-secili-liste] {
    padding: .25rem;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius-lg);
}

[data-secili-liste]:empty::before {
    content: "Kolon seçilmedi.";
    display: block;
    padding: .5rem;
    color: var(--bs-secondary-color);
}

.kolon-ogesi {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .3rem .5rem;
    border-radius: var(--bs-border-radius);
}

.kolon-ogesi:hover {
    background-color: var(--bs-tertiary-bg);
}

.kolon-ogesi .form-check-label {
    overflow-wrap: anywhere;
}

.kolon-tasima {
    display: none;
    flex: none;
    gap: .25rem;
}

[data-secili-liste] .kolon-tasima {
    display: inline-flex;
}

.kolon-tasima .btn {
    width: 32px;
    height: 32px;
    min-height: 32px;
    padding: 0;
}

.kolon-grubu[hidden],
.kolon-ogesi[hidden] {
    display: none;
}

/* ================================================================ Pano (ana sayfa) */

/* Seri renkleri dataviz referans paletinin ilk iki yuvası (mavi, turuncu); açık (#fff) ve koyu (#212529) kart zemininde
   doğrulandı: renk körlüğü ayrımı ΔE ≥ 24, kontrast ≥ 3:1. "Diğer" geri planda gri. Metin seri rengini giymez. */
:root,
[data-bs-theme="light"] {
    --pano-seri-1: #2a78d6;
    --pano-seri-2: #eb6834;
    --pano-diger: #b9b8b0;
    --pano-cizgi: #e6e5e0;
    --pano-taban: #c3c2b7;
    --pano-iyi: #006300;
    --pano-kotu: #b42318;
}

[data-bs-theme="dark"] {
    --pano-seri-1: #3987e5;
    --pano-seri-2: #d95926;
    --pano-diger: #6b6a65;
    --pano-cizgi: #343a40;
    --pano-taban: #495057;
    --pano-iyi: #4cc94c;
    --pano-kotu: #f08a8a;
}

.pano-seri-1 { background-color: var(--pano-seri-1); }
.pano-seri-2 { background-color: var(--pano-seri-2); }
.pano-seri-0,
.pano-seri-diger { background-color: var(--pano-diger); }
.pano-iyi { color: var(--pano-iyi); }
.pano-kotu { color: var(--pano-kotu); }

.pano-dugme {
    min-width: 32px;
    min-height: 32px;
    padding: .15rem .45rem;
}

.pano-yardim {
    border-bottom: 1px solid var(--bs-border-color);
    background-color: var(--bs-tertiary-bg);
}

.pano-yukleniyor {
    display: flex;
    align-items: center;
    min-height: 8rem;
    color: var(--bs-secondary-color);
}

.pano-ozet {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: .75rem 1.75rem;
}

.pano-ozet-etiket {
    margin: 0;
    font-size: .8125rem;
    color: var(--bs-secondary-color);
}

.pano-ozet-deger {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.3;
}

.pano-buyuk-deger {
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.2;
}

.pano-ozet-not {
    margin: 0;
    font-size: .75rem;
    color: var(--bs-secondary-color);
}

.pano-uyari .pano-ozet-etiket,
.pano-uyari .pano-ozet-deger {
    color: var(--bs-danger-text-emphasis);
}

/* Sütun grafiği: çizim alanı + solda değer ekseni (çizgilerin etiketleri) + altta ay / gün ekseni. Sütun yuvası tümüyle
   üzerine gelme / odak alanıdır (çubuktan büyük). */
/* Kartı dolduran grafik (aylık satışlar: yanındaki sütun uzunsa çizim alanı büyür). */
.pano-kart-dolu .card-body,
.pano-kart-dolu .pano-grafik {
    display: flex;
    flex-direction: column;
}

.pano-kart-dolu .pano-grafik {
    flex: 1 1 auto;
}

.pano-kart-dolu .pano-cizim {
    flex: 1 1 auto;
    min-height: 12rem;
}

.pano-cizim {
    position: relative;
    height: 12rem;
    margin-left: 3.5rem;
    border-bottom: 1px solid var(--pano-taban);
}

.pano-cizgi {
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    border-top: 1px solid var(--pano-cizgi);
}

.pano-cizgi-deger {
    position: absolute;
    right: calc(100% + .4rem);
    top: -.6em;
    font-size: .6875rem;
    color: var(--bs-secondary-color);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.pano-sutunlar {
    position: absolute;
    inset: 0;
    display: flex;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pano-sutun {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    border-radius: 4px 4px 0 0;
    outline-offset: -2px;
}

.pano-sutun[tabindex]:hover,
.pano-sutun[tabindex]:focus-visible,
.pano-yatay-satir:hover,
.pano-yatay-satir:focus-visible {
    background-color: color-mix(in srgb, var(--bs-body-color) 6%, transparent);
}

.pano-cubuk,
.pano-yigin {
    display: flex;
    flex-direction: column;
    width: min(24px, 62%);
}

.pano-cubuk {
    border-radius: 4px 4px 0 0;
}

.pano-yigin {
    gap: 2px;
}

.pano-parca {
    flex-basis: 0;
    min-height: 2px;
}

.pano-yigin > :first-child {
    border-radius: 4px 4px 0 0;
}

.pano-sutun-deger {
    position: absolute;
    left: 50%;
    padding-bottom: 3px;
    transform: translateX(-50%);
    font-size: .6875rem;
    font-weight: 600;
    white-space: nowrap;
    pointer-events: none;
}

.pano-x-ekseni {
    display: flex;
    margin: .35rem 0 0 3.5rem;
    padding: 0;
    list-style: none;
}

.pano-x-ekseni > li {
    flex: 1 1 0;
    min-width: 0;
    text-align: center;
    font-size: .6875rem;
    color: var(--bs-secondary-color);
    font-variant-numeric: tabular-nums;
}

.pano-x-ay {
    font-size: .625rem;
}

/* Gelecek aylar: sütunu yok; ay adı okunur kalır (soluklaştırma kontrastı düşürür). */
.pano-gelecek {
    font-style: italic;
}

.pano-lejant {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem 1rem;
    margin: 0 0 .5rem;
    padding: 0;
    list-style: none;
    font-size: .8125rem;
    color: var(--bs-secondary-color);
}

.pano-anahtar {
    display: inline-block;
    width: .75rem;
    height: .75rem;
    margin-right: .35rem;
    border-radius: 2px;
    vertical-align: -.1em;
}

/* Yatay çubuklar: ad · çubuk · değer (çubuğun ucunda, her zaman dışarıda). */
.pano-yatay {
    display: grid;
    gap: .3rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Dar kartta çubuk tam genişlikte kalsın: ad ve değer üstte, çubuk altta. */
.pano-yatay-satir {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "ad deger" "iz iz";
    align-items: baseline;
    gap: .15rem .5rem;
    padding: .3rem .35rem;
    border-radius: 4px;
    outline-offset: -2px;
}

.pano-yatay-ad {
    grid-area: ad;
    font-size: .8125rem;
}

.pano-yatay-deger {
    grid-area: deger;
}

.pano-yatay-iz {
    grid-area: iz;
    display: block;
    height: 12px;
}

.pano-yatay-cubuk {
    display: block;
    height: 100%;
    min-width: 2px;
    border-radius: 0 4px 4px 0;
}

.pano-yatay-deger {
    font-size: .8125rem;
    font-weight: 600;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.pano-tablo {
    font-size: .8125rem;
    font-variant-numeric: tabular-nums;
}

.pano-mali > li + li {
    margin-top: .75rem;
    padding-top: .75rem;
    border-top: 1px solid var(--bs-border-color);
}

/* İpucu: değer önde (koyu), seri adı arkada; anahtar kısa çizgi. */
.pano-ipucu {
    position: fixed;
    z-index: 1080;
    min-width: 9rem;
    max-width: 18rem;
    padding: .45rem .65rem;
    border: 1px solid var(--bs-border-color);
    border-radius: .5rem;
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
    box-shadow: var(--bs-box-shadow);
    font-size: .8125rem;
    pointer-events: none;
}

.pano-ipucu-baslik {
    margin-bottom: .2rem;
    font-size: .75rem;
    color: var(--bs-secondary-color);
}

.pano-ipucu-satir {
    display: flex;
    align-items: center;
    gap: .45rem;
    white-space: nowrap;
}

.pano-ipucu-anahtar {
    width: 12px;
    height: 3px;
    border-radius: 2px;
    flex: none;
}

.pano-ipucu-satir strong {
    font-variant-numeric: tabular-nums;
}

.pano-ipucu-satir span:last-child {
    color: var(--bs-secondary-color);
}
/* ================================================================ Satış fiyat listeleri */

/* Satırdaki fiyat alanı (fiyat + döviz) sağa yaslı, rakamlar hizalı; değiştirilmiş (henüz kaydedilmemiş) satırın solunda
   sarı çizgi; kaydedilen satır kısa süre yeşilden söner (hareket azaltma tercihinde sönmez). */
.fiyat-tablosu td,
.fiyat-tablosu th,
.onizleme-tablosu td {
    font-variant-numeric: tabular-nums;
}

.fiyat-sec {
    width: 2.5rem;
}

.fiyat-stok-adi {
    max-width: 22rem;
}

.fiyat-alani {
    min-width: 11rem;
    max-width: 15rem;
    margin-left: auto;
    flex-wrap: nowrap;
}

.fiyat-alani .fiyat-doviz {
    flex: 0 0 5.25rem;
    max-width: 5.25rem;
}

.fiyat-tablosu tr.fiyat-degisti > td:first-child {
    box-shadow: inset 4px 0 0 var(--bs-warning);
}

.fiyat-tablosu tr.fiyat-kaydedildi > td {
    animation: fiyat-kaydedildi 2.5s ease-out;
}

@keyframes fiyat-kaydedildi {
    from { background-color: var(--bs-success-bg-subtle); }
    to { background-color: transparent; }
}

@media (prefers-reduced-motion: reduce) {
    .fiyat-tablosu tr.fiyat-kaydedildi > td {
        animation: none;
    }
}

.fiyat-tablosu tr[tabindex="-1"]:focus {
    outline: 3px solid var(--uyg-cerceve-mavi);
    outline-offset: -3px;
}

/* Vurgulu (yeşil / sarı zeminli) satırda stok bağlantısı satırın yazı renginde (altı çizili kalır): mavi, açık zeminde 4,5:1'i
   tutturmuyor. */
.fiyat-tablosu tr.table-success a,
.fiyat-tablosu tr.table-warning a {
    color: inherit;
}

.grup-ikonu-tehlike {
    background-color: var(--bs-danger-bg-subtle);
    color: var(--bs-danger-text-emphasis);
}

/* Ekleme penceresi: sonuçlar kaydırılabilir alanda (başlık sabit), eklenecekler altta. */
.aday-tablosu-kap {
    max-height: 22rem;
    overflow: auto;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
}

.aday-tablosu > thead > tr > th {
    position: sticky;
    top: 0;
    z-index: 1;
    background-color: var(--bs-body-bg);
}

.aday-tablosu tr.aday-ek-birim > td {
    border-top-style: dashed;
}

.ekle-fiyat-alani {
    max-width: 16rem;
}

@media (max-width: 767.98px) {
    .mobil-kart > :not(caption) > * > td.fiyat-sec {
        justify-content: flex-start;
    }

    .mobil-kart > :not(caption) > * > td.fiyat-hucresi > div,
    .mobil-kart .ekle-fiyat-alani {
        flex: 1;
        max-width: 16rem;
    }

    .fiyat-alani {
        min-width: 0;
    }
}
/* Tanım pencereleri (fiyat liste tanımı, depo tanımı): bölüm başlıkları ince çizgiyle ayrılır; açılır bölümün (ör. "Döviz, kur,
   iskonto ve kampanya", "Adres ve iletişim") oku kapalıyken sağa döner. */
.liste-tanim-bolumu > legend,
.depo-bolumu > legend {
    width: 100%;
    margin-bottom: .75rem;
    padding-bottom: .35rem;
    border-bottom: var(--bs-border-width) solid var(--bs-border-color);
}

.tanim-ok {
    display: inline-block;
    transition: transform .2s;
}

.collapsed > .tanim-ok {
    transform: rotate(-90deg);
}

@media (prefers-reduced-motion: reduce) {
    .tanim-ok {
        transition: none;
    }
}
/* ================================================================ Raporlar: depo son durum */

/* Tablo kendi alanında kayar; başlık satırı üstte sabit kalır (sütunlar çok olunca yatay da kayar). */
.depo-durum-kap {
    max-height: 70vh;
    overflow: auto;
}

.depo-durum-tablosu > thead > tr > th {
    position: sticky;
    top: 0;
    z-index: 1;
    background-color: var(--bs-body-bg);
    box-shadow: inset 0 -1px 0 var(--bs-border-color);
    white-space: nowrap;
}

.depo-durum-tablosu td,
.depo-durum-tablosu th {
    font-variant-numeric: tabular-nums;
}

.depo-stok-adi {
    min-width: 12rem;
}

/* Sıralanabilir sütun başlığı: başlık görünümünde düğme. */
.siralama-dugmesi {
    display: inline-flex;
    align-items: center;
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    font-weight: inherit;
    text-align: inherit;
}

th.text-end > .siralama-dugmesi {
    justify-content: flex-end;
}

.siralama-dugmesi:focus-visible {
    outline: 2px solid var(--uyg-cerceve-mavi);
    outline-offset: 2px;
    border-radius: .2rem;
}

.depo-durum-tablosu tr.depo-eksi > td:first-child {
    box-shadow: inset 4px 0 0 var(--bs-danger);
}

.kolon-menusu {
    min-width: 16rem;
    max-height: 60vh;
    overflow-y: auto;
}

@media (max-width: 767.98px) {
    .depo-durum-kap {
        max-height: none;
    }

    .depo-durum-tablosu > thead > tr > th {
        position: static;
    }
}
/* ================================================================ Raporlar: satış analizi (pivot) */

.satis-trend-cizim {
    height: 11rem;
}

.pivot-kap {
    max-height: 70vh;
    overflow: auto;
}

.pivot-tablosu td,
.pivot-tablosu th {
    font-variant-numeric: tabular-nums;
}

/* Başlık satırı ve ilk sütun kayarken sabit. */
.pivot-tablosu > thead > tr > th {
    position: sticky;
    top: 0;
    z-index: 2;
    background-color: var(--bs-body-bg);
    box-shadow: inset 0 -1px 0 var(--bs-border-color);
    white-space: nowrap;
}

.pivot-tablosu .pivot-etiket,
.pivot-tablosu > thead > tr > th:first-child,
.pivot-tablosu > tfoot > tr > th:first-child {
    position: sticky;
    left: 0;
    z-index: 1;
    min-width: 12rem;
    max-width: 22rem;
    background-color: var(--bs-body-bg);
    box-shadow: inset -1px 0 0 var(--bs-border-color);
}

.pivot-tablosu > thead > tr > th:first-child {
    z-index: 3;
}

.pivot-tablosu > tfoot > tr > * {
    font-weight: 600;
    border-top: 2px solid var(--bs-emphasis-color);
    background-color: var(--bs-tertiary-bg);
}

.pivot-tablosu tr.pivot-diger > * {
    color: var(--bs-secondary-color);
    font-style: italic;
}

/* Ayrıntıya inme: bağlantı görünümünde düğme. */
.pivot-in {
    padding: 0;
    border: 0;
    background: none;
    color: var(--uyg-cerceve-mavi);
    text-align: start;
    text-decoration: underline;
    text-underline-offset: .15em;
}

.pivot-in:hover {
    text-decoration-thickness: 2px;
}

/* Föy bağlantısı: simge küçük, tıklama alanı 24 px (WCAG 2.5.8); satır yüksekliğini büyütmesin. */
.pivot-foy {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    min-height: 24px;
    margin-block: -4px;
    vertical-align: middle;
    color: var(--bs-secondary-color);
}

/* Isı haritası: tek renk tonu (dataviz sıralı ölçek), 5 kademe; yazı rengi değişmez. */
.pivot-tablosu td.isi-1 { background-color: color-mix(in srgb, var(--pano-seri-1) 8%, transparent); }
.pivot-tablosu td.isi-2 { background-color: color-mix(in srgb, var(--pano-seri-1) 15%, transparent); }
.pivot-tablosu td.isi-3 { background-color: color-mix(in srgb, var(--pano-seri-1) 22%, transparent); }
.pivot-tablosu td.isi-4 { background-color: color-mix(in srgb, var(--pano-seri-1) 30%, transparent); }
.pivot-tablosu td.isi-5 { background-color: color-mix(in srgb, var(--pano-seri-1) 38%, transparent); }

/* Toplam sütununda satırın payı kadar ince çubuk. */
.pivot-toplam {
    min-width: 9rem;
}

.pivot-cubuk {
    display: block;
    height: 4px;
    margin-top: 3px;
    border-radius: 2px;
    background-color: var(--pano-taban);
    overflow: hidden;
}

.pivot-cubuk > span {
    display: block;
    height: 100%;
    margin-left: auto;
    border-radius: 2px;
}
/* ================================================================ Finans: virman ve borç / alacak dekontu */

/* Telefonda taraflar alt alta: ok aşağı döner. */
@media (max-width: 767.98px) {
    .finans-ok .bi {
        display: inline-block;
        transform: rotate(90deg);
    }
}

.finans-cari-secili {
    padding: .5rem .75rem;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    background-color: var(--bs-tertiary-bg);
}

.dekont-tablosu .dekont-tutar {
    width: 12rem;
}

.fis-hesaplar {
    max-width: 28rem;
}

/* Kaydedilen fişin (yeşil zeminli satır) numara düğmesi satırın yazı renginde, altı çizili: mavi, açık yeşilde 4,5:1'i tutturmuyor. */
#son-fisler-tablosu tr.table-success .btn-link {
    color: inherit;
    text-decoration: underline !important;
}

/* Pano: açılıp kapanan bölümün düğmesi (aria-expanded'a göre "göster" / "gizle"), kasa ve banka hesap tablosu. */
.pano-ac-kapa[aria-expanded="true"] .pano-kapaliyken,
.pano-ac-kapa[aria-expanded="false"] .pano-acikken {
    display: none;
}

.pano-hesaplar .pano-grup-satiri > th {
    --bs-table-bg: var(--bs-tertiary-bg);
    font-size: .8125rem;
    font-weight: 600;
}

.pano-hesaplar .pano-ara-toplam > * {
    border-bottom-width: 2px;
}

/* ================================================================ Hesap (giriş, firma seçimi, şifre, kurulum) ve hesap menüsü */

.hesap-kapsami {
    max-width: 28rem;
    margin: 2rem auto;
}

.hesap-kapsami.hesap-genis {
    max-width: 44rem;
}

.firma-listesi .btn {
    border-radius: 0;
}

.firma-listesi .btn.active {
    color: var(--uyg-dolu-yazi);
    background-color: var(--uyg-cerceve-mavi);
}

.menu-firma {
    font-size: .8125rem;
    font-weight: 600;
    font-family: var(--bs-font-monospace);
}

/* Ayarlar 576–1399 px'te yalnızca dişli simgesi (ad ekran okuyucuya ve ipucuna kalır): hesap menüsüyle birlikte gruplar
   1366 px'te tek satıra sığsın. Telefonda simge yok, ad görünür (marka satırında). */
@media (min-width: 576px) and (max-width: 1399.98px) {
    #menu-ayarlar .menu-baslik {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
    }

    #menu-ayarlar .bi {
        margin-right: 0 !important;
    }
}

.hesap-menusu {
    min-width: 15rem;
}

.gecici-sifre {
    letter-spacing: .15em;
    user-select: all;
}