/* =========================
         KC UI - CLEAN STYLE PACK
         ========================= */

/* --- generic --- */
.kc-hidden{ display:none!important; }

/* =========================
   PROGRESS / LOADER
   ========================= */
.kc-progress-wrap{
    display:flex; align-items:center; gap:10px;
    background:#fff;
    border:1px solid rgba(0,0,0,.06);
    border-radius:12px;
    padding:10px 12px;
    box-shadow:0 10px 22px rgba(0,0,0,.06);
    margin-bottom:12px;
}
.kc-progress-label{
    font-weight:800; font-size:12px; opacity:.8;
    white-space:nowrap;
}
.kc-progress{
    position:relative; height:8px; flex:1;
    background:rgba(0,0,0,.06);
    border-radius:999px;
    overflow:hidden;
}
.kc-progress > span{
    display:block; height:100%;
    width:0%;
    background:linear-gradient(90deg,#ff3b30,#d31722,#7a0b0f);
    border-radius:999px;
    transition:width .25s ease;
}
.kc-progress-pct{
    font-weight:900; font-size:12px; opacity:.75;
    width:44px; text-align:right;
}

/* =========================
   SKELETON CARDS
   ========================= */
.kc-skel-card{
    background:#fff;
    border:1px solid rgba(0,0,0,.06);
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 10px 22px rgba(0,0,0,.06);
}
.kc-skel-img{ height:190px; }
.kc-skel-pad{ padding:14px; }
.kc-skel-line{ height:12px; border-radius:999px; margin:10px 0; }
.kc-skel-line.sm{ height:10px; }
.kc-skel-line.w60{ width:60%; }
.kc-skel-line.w80{ width:80%; }
.kc-skel-line.w95{ width:95%; }

.kc-shimmer{
    background:linear-gradient(90deg,#f1f3f5 0%,#e9ecef 45%,#f1f3f5 100%);
    background-size:200% 100%;
    animation:kcShimmer 1.1s linear infinite;
}
@keyframes kcShimmer{
    0%{ background-position:200% 0; }
    100%{ background-position:-200% 0; }
}

/* =========================
   SIDEBAR - MINIMAL & FIXED
   ========================= */
.car-sidebar .car-widget{
    padding:10px;
    border:1px solid rgba(0,0,0,.06);
    border-radius:12px;
    margin-bottom:10px;
    background:#fff;
}
.car-sidebar .car-widget-title{
    font-size:12px;
    margin:0 0 8px;
    font-weight:800;
}

/* UL reset (içe kaymayı bitirir) */
.car-sidebar ul,
#brand-list, #trans-list, #fuel-list{
    list-style:none;
    padding-left:0 !important;
    margin:0;
}

/* Scroll areas */
#brand-list{ max-height:280px; overflow:auto; padding-right:6px; }
#trans-list, #fuel-list{ max-height:180px; overflow:auto; padding-right:6px; }

/* li spacing */
#brand-list li, #trans-list li, #fuel-list li{
    padding:2px 0;
    overflow:visible;
}

/* Form-check alignment FIX (Bootstrap negative margin iptal) */
.car-sidebar .form-check{
    position:relative;
    padding-left:1.45rem !important;
    margin:0;
}
.car-sidebar .form-check-input{
    position:absolute;
    left:0;
    top:0.18rem;
    margin:0 !important;
    float:none !important;
}
.car-sidebar .form-check-label{
    display:block;
    font-size:11.5px;
    line-height:1.2;
    margin:0;
    white-space:normal;
    overflow:visible;
}

/* Brand search */
.kc-brand-search{
    width:100%;
    height:30px;
    font-size:12px;
    padding:6px 8px;
    border-radius:10px;
    border:1px solid rgba(0,0,0,.12);
    margin-bottom:8px;
}

/* Section headings inside brand list */
.kc-subhead{
    font-size:11px;
    font-weight:800;
    color:#6c757d;
    text-transform:uppercase;
    margin:10px 0 6px;
    padding:6px 0 0;
}

/* Models collapse panel */
.kc-models{
    display:none;
    margin:6px 0 10px 14px;      /* checkbox hizasına uygun */
    padding:8px;
    border-left:2px solid rgba(13,110,253,.22);
    background:rgba(13,110,253,.04);
    border-radius:10px;
}
.kc-models .kc-models-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:6px;
}
.kc-models .kc-models-head .form-check{
    padding-left:1.45rem !important;
}
.kc-models .kc-models-head .form-check-label{
    font-size:11.5px;
}
.kc-mini-link{
    font-size:11px;
    color:#0d6efd;
    cursor:pointer;
    user-select:none;
    white-space:nowrap;
}
.kc-models-list{
    max-height:200px;
    overflow:auto;
    padding-right:6px;
}

/* Range inputs */
.car-sidebar input.form-control-sm{
    height:30px;
    font-size:12px;
    padding:6px 8px;
    border-radius:10px;
}

/* =========================
   MOBILE QUALITY
   ========================= */
/* Mobilde sidebar üstte görünür; grid order ile de yapmalısın (HTML) */
@media (max-width: 991.98px){
    .car-area.grid.bg{ padding:30px 15px !important; }
    .car-sort{ gap:10px; }
    .car-sort-box{ width:100% !important; }
    .car-sort-box select{ width:100% !important; }
    #brand-list{ max-height:220px; }
    #trans-list, #fuel-list{ max-height:160px; }
}

/* Reset/Apply butonları daha kompakt */
#kcResetFilters, #kcApplyFilters{
    height:32px;
    font-size:12px;
    border-radius:10px;
    padding:6px 10px;
}

/* fiyat inputları zaten form-control-sm ayarlı */

/* Mobilde başlık kötü görünüyorsa (Fahrzeugkatalog / KoreaCAR) */
@media (max-width: 575.98px){
    .site-heading .site-title-tagline{
        font-size:12px !important;
        letter-spacing:1px;
    }
    .site-heading .site-title{
        font-size:28px !important;
        line-height:1.05 !important;
        margin-bottom:10px !important;
    }
    .heading-divider{ margin-top:10px !important; }
    .car-area.grid.bg{ padding:30px 12px !important; }
}

/* Apply bar sticky/fixed */
.kc-applybar{
    z-index: 60;
    background:#fff;
    border:1px solid rgba(0,0,0,.06);
    border-radius:14px;
    padding:10px;
    box-shadow:0 10px 26px rgba(16,24,40,.08);
}

.kc-dirty-dot{
    display:inline-block;
    width:8px; height:8px;
    border-radius:50%;
    margin-left:6px;
    background:#dc3545;
    vertical-align:middle;
    visibility:hidden;
}

.kc-applybar.kc-dirty .kc-dirty-dot{ visibility:visible; }

@media (max-width: 991.98px){
    .kc-applybar{
        position: fixed;
        left: 0; right: 0; bottom: 0;
        border-radius: 0;
        border-left: 0; border-right: 0; border-bottom: 0;
        padding: 12px 12px 14px;
        box-shadow: 0 -10px 26px rgba(16,24,40,.10);
    }
    body{ padding-bottom: 86px; } /* bar kapatmasın */
    .kc-apply-hint{ display:none; }
}

/* Sticky actions (desktop sidebar) */
.kc-filter-actions{
    position: sticky;
    top: 12px;
    z-index: 30;
    background: #fff;
    border-radius: 14px;
    padding: 10px;
    box-shadow: 0 10px 28px rgba(16,24,40,.08);
}

/* Dirty indicator on View button */
#kcApplyFilters.kc-dirty{
    position: relative;
}
#kcApplyFilters.kc-dirty::after{
    content:"";
    display:inline-block;
    width:8px;height:8px;
    border-radius:50%;
    background:#ff3b30;
    margin-left:8px;
    vertical-align:middle;
}

/* Mobile: actions fixed bottom */
@media (max-width: 991px){
    .kc-filter-actions{
        position: fixed;
        left: 0; right: 0; bottom: 0; top: auto;
        border-radius: 16px 16px 0 0;
        padding: 12px;
        box-shadow: 0 -10px 30px rgba(16,24,40,.12);
    }
    body{
        padding-bottom: 92px; /* butonlar içerik kapatmasın */
    }
}

/* APPLY BAR - desktop: sticky, mobile: fixed bottom */
#kcApplyBar{
    position: sticky;
    top: 12px;          /* header sticky ise 80-110px yap */
    bottom: auto;
    z-index: 999;
}

@media (max-width: 991.98px){
    #kcApplyBar{
        position: fixed;
        left: 0; right: 0; bottom: 0; top: auto;
        border-radius: 16px 16px 0 0;
        border-left: 0; border-right: 0; border-bottom: 0;
        padding: 12px 12px 14px;
        box-shadow: 0 -10px 30px rgba(16,24,40,.12);
    }
    body{ padding-bottom: 92px; }
}

/* sticky bozan parent durumlarına karşı */
.car-area,
.car-area * {
    transform: none !important;
}

.car-area,
.main,
.container,
.row,
.col-lg-3,
.car-sidebar{
    overflow: visible !important;
}

/* === APPLY BAR: desktop sticky, mobile fixed === */

@media (min-width: 992px){
    #kcApplyBar{
        position: sticky !important;
        top: var(--kcStickyTop, 90px) !important;  /* header yüksekliği + boşluk */
        z-index: 999 !important;
        align-self: flex-start;
    }
}

@media (max-width: 991.98px){
    #kcApplyBar{
        position: fixed !important;
        left: 0; right: 0; bottom: 0; top: auto;
        border-radius: 16px 16px 0 0;
        border-left: 0; border-right: 0; border-bottom: 0;
        padding: 12px 12px 14px;
        box-shadow: 0 -10px 30px rgba(16,24,40,.12);
        z-index: 9999 !important;
    }
    body{ padding-bottom: 92px; }
}

/* sticky'nin çalışması için parent'larda overflow görünür olmalı */
.car-area.grid.bg,
.car-area.grid.bg .container,
.car-area.grid.bg .row,
.car-area.grid.bg .col-lg-3,
.car-area.grid.bg .car-sidebar{
    overflow: visible !important;
    transform: none !important;
}

#kc-pagination-wrap .page-item {
    margin: 0;
    display: inline-flex;
    flex-shrink: 0 !important;
}

#kc-pagination-wrap .page-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 48px;
    min-height: 48px;
    min-width: 48px;                /* Tek haneliler için tam kare olmasını sağlar */
    width: fit-content !important;  /* Sayı büyüdükçe kutunun ezilmeden genişlemesini zorunlu kılar */
    padding: 0 18px !important;     /* Sağdan ve soldan kesin nefes boşluğu (artırıldı) */
    box-sizing: border-box !important;
    text-align: center;
    white-space: nowrap !important;
    border-radius: 14px;
    font-size: 18px;
    font-weight: 700;
    line-height: 1 !important;
    flex-shrink: 0 !important;      /* Ekran daralsa bile içindeki metni asla sıkıştırma */
    margin: 0 !important;
}

/* Mobildeki sıkışmayı engellemek için */
@media (max-width: 576px) {
    #kc-pagination-wrap .pagination {
        gap: 6px;
    }

    #kc-pagination-wrap .page-link {
        height: 44px;
        min-height: 44px;
        min-width: 44px;
        padding: 0 16px !important; /* Mobilde de 3 haneliler için ferah padding */
        font-size: 16px;
        border-radius: 12px;
    }
}
/* =========================
   HIERARCHICAL CATALOG FILTERS
   ========================= */
.kc-model-row,
.kc-generation-row{
    margin:4px 0;
}
.kc-nested{
    margin:6px 0 8px 14px;
    padding:7px 8px;
    border-left:2px solid rgba(220,38,38,.28);
    background:rgba(220,38,38,.035);
    border-radius:10px;
}
.kc-generations-list,
.kc-variants-list{
    max-height:190px;
    overflow:auto;
    padding-right:6px;
}
.kc-level-title{
    color:#64748b;
    font-size:10.5px;
    font-weight:800;
    letter-spacing:.02em;
    text-transform:uppercase;
    margin:0 0 6px;
}
.kc-option-count{
    float:right;
    margin-left:6px;
    color:#94a3b8;
    font-size:10.5px;
    font-weight:700;
}
.kc-generation-row > .form-check .form-check-label,
.kc-model-row > .form-check .form-check-label{
    padding-right:4px;
}


/* v15: daha geniş ve okunaklı katalog marka/model filtresi */
.car-sidebar .car-widget{
    padding:14px;
}
#brand-list{
    max-height:420px;
}
.kc-brand-search{
    height:42px;
    font-size:14px;
    padding:9px 12px;
    border-radius:12px;
}
.car-sidebar .form-check-label{
    font-size:13px;
    line-height:1.35;
}
.kc-models{
    margin:8px 0 12px 18px;
    padding:11px;
}
.kc-models-list{
    max-height:310px;
}
.kc-generations-list,
.kc-variants-list{
    max-height:260px;
}
.kc-option-count{
    font-size:11.5px;
}

/* v16: Sidebar genişliği eski düzende kalır; sadece liste alanı boylamasına uzatıldı. */
.kc-catalog-page .car-sidebar .car-widget,
.car-sidebar .car-widget{
    padding:12px;
}
.kc-catalog-page #brand-list,
#brand-list{
    max-height:620px;
    overflow-y:auto;
    padding-right:6px;
}
.kc-catalog-page .kc-brand-search,
.kc-brand-search{
    height:32px;
    font-size:12px;
    padding:6px 8px;
    border-radius:10px;
}
.kc-catalog-page .car-sidebar .form-check-label,
.car-sidebar .form-check-label{
    font-size:11.8px;
    line-height:1.24;
}
.kc-catalog-page .kc-models,
.kc-models{
    margin:6px 0 10px 14px;
    padding:8px;
}
.kc-catalog-page .kc-models-list,
.kc-models-list{
    max-height:500px;
    overflow-y:auto;
}
.kc-catalog-page .kc-generations-list,
.kc-catalog-page .kc-variants-list,
.kc-generations-list,
.kc-variants-list{
    max-height:430px;
    overflow-y:auto;
}
.kc-catalog-page .kc-option-count,
.kc-option-count{
    font-size:10.5px;
}

/* v19: Live cache/layout guard for hierarchical sidebar filter */
.kc-catalog-page .car-sidebar .car-widget{padding:12px!important;}
.kc-catalog-page #brand-list{max-height:720px!important;overflow-y:auto!important;padding-right:6px!important;}
.kc-catalog-page .kc-brand-search{width:100%!important;height:34px!important;font-size:13px!important;padding:6px 10px!important;border:1px solid rgba(15,23,42,.12)!important;border-radius:10px!important;margin-bottom:10px!important;}
.kc-catalog-page .kc-brand-item{margin-bottom:6px!important;}
.kc-catalog-page .kc-models{display:none;margin:8px 0 12px 14px!important;padding:10px!important;border-left:2px solid rgba(37,99,235,.24)!important;background:rgba(37,99,235,.045)!important;border-radius:12px!important;max-width:100%!important;}
.kc-catalog-page .kc-models-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;margin-bottom:8px!important;}
.kc-catalog-page .kc-models-list{max-height:560px!important;overflow-y:auto!important;padding-right:6px!important;}
.kc-catalog-page .kc-model-row,.kc-catalog-page .kc-generation-row{margin:5px 0!important;}
.kc-catalog-page .kc-nested{margin:8px 0 10px 14px!important;padding:9px 10px!important;border-left:2px solid rgba(239,29,38,.28)!important;background:rgba(239,29,38,.045)!important;border-radius:12px!important;max-width:100%!important;}
.kc-catalog-page .kc-generations-list,.kc-catalog-page .kc-variants-list{max-height:480px!important;overflow-y:auto!important;padding-right:6px!important;}
.kc-catalog-page .kc-level-title{color:#64748b!important;font-size:10.5px!important;font-weight:800!important;letter-spacing:.04em!important;text-transform:uppercase!important;margin:0 0 7px!important;}
.kc-catalog-page .kc-option-count{float:right!important;margin-left:8px!important;color:#94a3b8!important;font-size:11px!important;font-weight:700!important;}
.kc-catalog-page .car-sidebar .form-check-label{font-size:12.8px!important;line-height:1.32!important;width:100%!important;}
.kc-catalog-page .kc-models-close{flex:0 0 28px!important;}
@media (min-width: 992px){.kc-catalog-page .col-lg-3.order-1.order-lg-2{width:25%!important}.kc-catalog-page .col-lg-9.order-2.order-lg-1{width:75%!important}}