/* ==========================================================================
   BM Offcanvas — Tüm offcanvas'lar için global tasarım
   Reference: Support sayfasının "Hızlı Erişim" offcanvas'ı (#supportQuickAccess).
   Her .offcanvas elementi default olarak floating, rounded, elevated görünür.
   Sayfa kendi width/height vs. ile override edebilir.
   ========================================================================== */

/* Genel: floating drawer görünümü, ekran kenarlarından boşluklu, rounded, gölgeli.
   !important ile Bootstrap default ve adminlte.css'i ezer (aynı specificity'de loaded order'a bağlı kalmasın). */
.offcanvas {
    border-radius: 1rem !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18) !important;
    border: 0 !important;
}

/* Sağdan açılan (en yaygın — filter, support quick access vs.) */
.offcanvas-end {
    top: 1rem !important;
    bottom: 1rem !important;
    right: 1.25rem !important;
    height: auto !important;
    /* Default genişlik (filter panel'lere uygun); Support gibi ekstra geniş istenenler kendi #id'sinde override eder */
    width: min(420px, 90vw) !important;
}

/* Soldan açılan */
.offcanvas-start {
    top: 1rem !important;
    bottom: 1rem !important;
    left: 1.25rem !important;
    height: auto !important;
    width: min(420px, 90vw) !important;
}

/* Üstten açılan */
.offcanvas-top {
    top: 1rem !important;
    left: 1.25rem !important;
    right: 1.25rem !important;
    width: auto !important;
    height: min(50vh, 480px) !important;
}

/* Alttan açılan */
.offcanvas-bottom {
    bottom: 1rem !important;
    left: 1.25rem !important;
    right: 1.25rem !important;
    width: auto !important;
    height: min(50vh, 480px) !important;
}

/* Header — Support tarzı border-bottom, kompakt padding */
.offcanvas .offcanvas-header {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #eef1f4;
    align-items: flex-start;
}

.offcanvas .offcanvas-title {
    font-size: 1rem;
    font-weight: 600;
    color: #2f3440;
    margin: 0;
    line-height: 1.3;
}

/* Header subtitle — Support kullanıyor (.small.text-muted). Standart pattern. */
.offcanvas .offcanvas-header .small.text-muted {
    font-size: .78rem;
    line-height: 1.3;
    margin-top: .15rem;
}

/* Header'daki close button + extra action butonlarına alan */
.offcanvas .offcanvas-header .btn-close {
    margin: 0;
    padding: .5rem;
    background-size: .8em;
}

/* Body — kompakt scroll'lı container; sayfalar kendi içeriğini koyar */
.offcanvas .offcanvas-body {
    padding: 1rem 1.25rem;
}

/* === Body içindeki form elementleri — tüm offcanvas'larda aynı scale === */

/* Label — küçük, semibold, alt boşluk düzgün */
.offcanvas .offcanvas-body .form-label {
    font-size: .78rem;
    font-weight: 600;
    color: #2f3440;
    margin-bottom: .35rem;
    line-height: 1.3;
}

/* Input + select — tek tip yükseklik, padding, font */
.offcanvas .offcanvas-body .form-control,
.offcanvas .offcanvas-body .form-select {
    font-size: .85rem;
    padding: .4rem .6rem;
    line-height: 1.35;
    border-radius: .5rem;
    border-color: #d7dde6;
}

.offcanvas .offcanvas-body .form-control:focus,
.offcanvas .offcanvas-body .form-select:focus {
    border-color: var(--bs-primary, #8a0d1e);
    box-shadow: 0 0 0 .15rem rgba(var(--bs-primary-rgb, 138, 13, 30), .15);
}

/* Form group spacing — Bootstrap mb-3 kullanılsa da kullanılmasa da tutarlı */
.offcanvas .offcanvas-body > .mb-3,
.offcanvas .offcanvas-body > div:not(:last-child) {
    margin-bottom: .9rem;
}

/* Aksiyon button satırı (Filter / Reset) — alt sticky-like, eşit genişlik */
.offcanvas .offcanvas-body .bm-offcanvas-actions,
.offcanvas .offcanvas-body > .d-flex.gap-2:last-child,
.offcanvas .offcanvas-body > .row:last-child {
    display: flex;
    gap: .5rem;
    margin-top: 1rem;
    padding-top: .75rem;
    border-top: 1px solid #eef1f4;
}

.offcanvas .offcanvas-body .bm-offcanvas-actions .btn,
.offcanvas .offcanvas-body > .d-flex.gap-2:last-child .btn,
.offcanvas .offcanvas-body > .row:last-child .btn {
    flex: 1 1 0;
    font-size: .85rem;
    padding: .45rem .75rem;
    border-radius: .5rem;
    font-weight: 500;
}

/* Section heading (opsiyonel: form sectionları gruplama için) */
.offcanvas .offcanvas-body .bm-offcanvas-section-title {
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #7b7f87;
    margin: 1rem 0 .5rem;
    padding-bottom: .25rem;
    border-bottom: 1px solid #eef1f4;
}

.offcanvas .offcanvas-body .bm-offcanvas-section-title:first-child {
    margin-top: 0;
}

/* Backdrop — Bootstrap default biraz koyu; daha hafif yap */
.offcanvas-backdrop {
    background-color: rgba(15, 23, 42, 0.32);
}

.offcanvas-backdrop.show {
    opacity: 1;
}

/* Mobile — küçük ekranda kenardan kenara full, kompakt köşe yarıçapı */
@media (max-width: 575.98px) {
    .offcanvas-end,
    .offcanvas-start {
        top: .5rem;
        bottom: .5rem;
        width: calc(100vw - 1rem);
        border-radius: .75rem;
    }
    .offcanvas-end {
        right: .5rem;
    }
    .offcanvas-start {
        left: .5rem;
    }
    .offcanvas-top,
    .offcanvas-bottom {
        left: .5rem;
        right: .5rem;
        border-radius: .75rem;
    }
    .offcanvas-top {
        top: .5rem;
    }
    .offcanvas-bottom {
        bottom: .5rem;
    }

    .offcanvas .offcanvas-header,
    .offcanvas .offcanvas-body {
        padding: .75rem 1rem;
    }
}

/* Opt-out — default tasarım istenmiyorsa class ekle */
.offcanvas.bm-offcanvas-flush {
    border-radius: 0;
    box-shadow: none;
    top: 0 !important;
    bottom: 0 !important;
    right: 0 !important;
    left: 0 !important;
    height: 100% !important;
}

/* ==========================================================================
   Aktif filtre rozetleri (offcanvas filter uygulandıktan sonra gösterilen chip'ler)
   Her sayfada `<div id="activeFilters">` olarak tanımlanmış. Sadeleştirilmiş tek tip:
   compact pill, neutral light bg, bordo accent. Chip içindeki keyboard_arrow_down icon
   gizlenir (gereksiz görsel kirlilik).
   ========================================================================== */

#activeFilters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem;
}

/* Badge / button → pill chip, kompakt */
#activeFilters .badge,
#activeFilters button.badge {
    font-size: .7rem !important;
    font-weight: 500 !important;
    padding: .25rem .55rem !important;
    background: #f1f3f5 !important;
    color: #495057 !important;
    border: 1px solid #dee2e6 !important;
    border-radius: 999px !important;
    line-height: 1.3 !important;
    cursor: pointer;
    transition: background-color .12s, border-color .12s, color .12s;
    display: inline-flex !important;
    align-items: center;
    gap: .25rem;
    white-space: nowrap;
    height: 24px;
}

#activeFilters .badge:hover,
#activeFilters button.badge:hover {
    background: rgba(var(--bs-primary-rgb, 138, 13, 30), .08) !important;
    border-color: rgba(var(--bs-primary-rgb, 138, 13, 30), .25) !important;
    color: var(--bs-primary, #8a0d1e) !important;
}

/* Chip içindeki dekoratif arrow_down icon'larını gizle — gereksiz görsel kirlilik */
#activeFilters .badge .material-symbols-rounded,
#activeFilters .badge .material-symbols-outlined {
    font-size: 13px !important;
    line-height: 1 !important;
}

/* keyboard_arrow_down sayfaların JS'inden geliyor — CSS'le gizle, JS değişikliğine gerek yok */
#activeFilters .badge .material-symbols-rounded:last-child,
#activeFilters .badge .material-symbols-outlined:last-child {
    display: none !important;
}

/* Ama tek child icon (reset filter butonundaki filter_alt_off) görünsün */
#activeFilters .badge > .material-symbols-rounded:only-child,
#activeFilters .badge > .material-symbols-outlined:only-child {
    display: inline-flex !important;
    font-size: 14px !important;
}

/* Sadece icon içeren chip (reset filter) — kompakt kare */
#activeFilters .badge:has(> .material-symbols-rounded:only-child),
#activeFilters .badge:has(> .material-symbols-outlined:only-child) {
    padding: 0 !important;
    width: 24px;
    justify-content: center;
}