/* ════════════════════════════════════════════════════════════════
   KOBİCAR PANEL KABUĞU (12 Ekim 2026) — KobiCar ERP yönetim düzeninin
   (Barem / OtoBerco /yonetim, admin/layouts/app.blade.php) satır içi
   stil bloğu, BİREBİR. Kaynak: otoberco.com, kobicar-prod.
   Sıra referansla aynı: tabler → kobicar.css → bs4-uyum → kobicar-palet →
   panel/* → kobicar-gece → BU DOSYA (satır içi blok + tasarım
   değişkenleri + panel palet kilidi).
   ════════════════════════════════════════════════════════════════ */
    /* AYAR-KAYDET-BAR */
    .ayar-kaydet-bar{display:flex;justify-content:flex-end;align-items:center;gap:14px;margin-top:4px;}
    .ayar-kaydet-bar.ust-cizgi{border-top:1px solid #eef0f5;padding-top:14px;margin-top:18px;}
    .btn-kaydet{background:transparent !important;border:0 !important;box-shadow:none !important;color:var(--tblr-primary);font-weight:600;font-size:.94rem;padding:8px 6px;display:inline-flex;align-items:center;gap:7px;cursor:pointer;}
    .btn-kaydet:hover,.btn-kaydet:focus{color:var(--tblr-primary);opacity:.92;text-decoration:none;}
    .btn-kaydet i{font-size:1.05rem;}
    .btn-kaydet-ghost{background:transparent !important;border:0 !important;box-shadow:none !important;color:#8a93a3;font-weight:600;font-size:.9rem;padding:8px 6px;display:inline-flex;align-items:center;gap:7px;cursor:pointer;}
    .btn-kaydet-ghost:hover,.btn-kaydet-ghost:focus{color:#5b6573;text-decoration:none;}
    /* === BIRLESIK AYAR KAYDET CUBUGU === */
    .kobicar-kaydet-bar{position:sticky;bottom:0;z-index:30;display:flex;justify-content:flex-end;align-items:center;gap:12px;padding:13px 16px;margin:26px 0 0;border-radius:0 0 var(--radius) var(--radius);border-top:1px solid transparent;transition:background-color .15s ease,box-shadow .15s ease,border-color .15s ease;}
    .kobicar-kaydet-bar.is-stuck{background:#fff;border-top-color:#e6eaf2;box-shadow:0 -5px 18px rgba(15,23,42,.08);}
    .kobicar-kaydet-bar .btn{min-width:128px;font-weight:600;}
    .kobicar-kaydet-sentinel{height:1px;width:100%;pointer-events:none;}
    @media (max-width:576px){.kobicar-kaydet-bar{padding:11px 12px;gap:8px;}.kobicar-kaydet-bar .btn{flex:1 1 auto;min-width:0;}}
    /* === AYAR BOLUM BASLIGI === */
    .ss-bolum-baslik{font-size:1rem;font-weight:600;color:var(--tblr-primary);border-bottom:1px solid #e9ecf3;padding-bottom:.5rem;margin-bottom:1rem;}
    .ss-bolum-baslik i{margin-right:.4rem;}
        /* === INCE ADMIN FOOTER === */
    .page-wrapper{display:flex;flex-direction:column;min-height:calc(100vh - 60px);}
    .page-wrapper > .page-body{flex:1 1 auto;}
    .admin-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 14px;padding:12px 16px 1rem;margin-top:auto;font-size:.72rem;color:#9aa3b2;letter-spacing:.2px;}
    .admin-footer .af-left,.admin-footer .af-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
    .admin-footer .af-sep{color:#d2d8e2;}
    .admin-footer .af-brand b{color:#6b7689;font-weight:600;}
    .admin-footer .af-ip i,.admin-footer .af-tarih i{font-size:.95rem;opacity:.7;}
    .admin-footer .af-tarih{display:inline-flex;align-items:center;gap:5px;}
    .admin-footer .af-log{display:inline-flex;align-items:center;gap:5px;color:#b45309;background:#fff7ec;border:1px solid #ffe1bd;padding:1px 9px;border-radius:var(--radius);font-weight:600;}
    .admin-footer .af-log i{font-size:.9rem;}
    .admin-footer .af-dot{width:7px;height:7px;border-radius:50%;display:inline-block;background:#c2c8d2;flex:0 0 auto;}
    .admin-footer .af-dot.on{background:#22c55e;animation:afpulse 2s infinite;}
    .admin-footer .af-dot.off{background:#ef4444;}
    @keyframes afpulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.45)}70%{box-shadow:0 0 0 5px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
    @media(max-width:767.98px){.admin-footer{flex-direction:column;justify-content:center;gap:5px;text-align:center;font-size:.68rem;}.admin-footer .af-left,.admin-footer .af-right{justify-content:center;}}
    /* === Basari rengi marka aksanina baglanir (white-label) === */
    .btn-success{background-color:var(--tblr-primary) !important;border-color:var(--tblr-primary) !important;color:#fff !important;}
    .btn-success:hover,.btn-success:focus,.btn-success:active,.btn-success.active{background-color:var(--tblr-primary-darken, var(--tblr-primary)) !important;border-color:var(--tblr-primary-darken, var(--tblr-primary)) !important;}
    .btn-outline-success{color:var(--tblr-primary) !important;border-color:var(--tblr-primary) !important;}
    .btn-outline-success:hover,.btn-outline-success:focus,.btn-outline-success:active{background-color:var(--tblr-primary) !important;border-color:var(--tblr-primary) !important;color:#fff !important;}
    .text-success{color:var(--tblr-primary) !important;}
    .bg-success{background-color:var(--tblr-primary) !important;}
    .border-success{border-color:var(--tblr-primary) !important;}
    .alert-success{background-color:var(--tblr-primary-lt) !important;border-color:var(--tblr-border-color) !important;color:var(--tblr-primary-darken, var(--tblr-primary)) !important;}
    .card-btm-border.border-success{border-bottom-color:var(--tblr-primary) !important;}
    .card-btm-border.border-success:after{background-color:var(--tblr-primary) !important;}
    .progress-bar.bg-success,.progress-bar-success{background-color:var(--tblr-primary) !important;}
    a.text-success:hover,a.text-success:focus{color:var(--tblr-primary-darken, var(--tblr-primary)) !important;}
    /* === GELEN KUTUSU: platform renkleri korunur === */
    .gk-wa{color:#25D366 !important;}
    .gk-ig{color:#E4405F !important;}
    .gk-fb{color:#1877F2 !important;}
    [style*="#28a745"]{color:var(--tblr-primary) !important;}
    /* === Form alani standardi (kompakt -sm haric) === */
    input.form-control:not(.form-control-sm), select.form-control:not(.form-control-sm){ height:44px; padding:.45rem .9rem; font-size:.95rem; }
    textarea.form-control:not(.form-control-sm){ padding:.55rem .9rem; font-size:.95rem; }

    .input-group:not(.input-group-sm) > .form-control, .input-group:not(.input-group-sm) .input-group-text{ height:44px; }
    .select2-container--bootstrap .select2-selection--single, .select2-container--default .select2-selection--single{ height:44px !important; display:flex; align-items:center; }
    .select2-container--bootstrap .select2-selection--single .select2-selection__rendered, .select2-container--default .select2-selection--single .select2-selection__rendered{ line-height:42px; }
    .select2-container--default .select2-selection--single .select2-selection__arrow{ height:42px; }
    /* Coklu secim: etiketler tasmasin, kutu tek secimle ayni cizgide dursun. */
    .select2-container--default .select2-selection--multiple{ min-height:44px; border-color:var(--tblr-border-color); }
    .select2-container--default .select2-selection--multiple .select2-selection__choice{
        background:var(--tblr-primary); border:0; color:#fff; border-radius:var(--tblr-border-radius);
        padding:2px 8px; margin:5px 4px 0 0; font-size:.8rem;
    }
    .select2-container--default .select2-selection--multiple .select2-selection__choice__remove{ color:#fff; margin-right:5px; }
    .select2-container--default .select2-search--inline .select2-search__field{ margin-top:8px; }
    /* === Ust bar: sayfa basligi bandi koyu zemine oturur === */
    /* Ust menu modunda sayfa basligi koyu bandin uzerinde durur -> beyaz.
       Sol menu modunda acik zemine duser -> Tabler'in kendi rengi kalir. */
    body.kc-menu-ust .page-header .page-title,
    body.kc-menu-ust .page-header .page-pretitle{ color:#fff; }
    /* Breadcrumb koyu bantta "pretitle" gibi durur. kobicar-ui.css'ten gelen
       beyaz zemin + kenarlik + padding SIFIRLANIR (orada gri govde icin yazilmisti). */
    .page-header .kobicar-breadcrumb{
        background:transparent !important; border:0 !important; padding:0 !important;
        margin:0 0 .15rem !important; font-size:.75rem; gap:5px;
    }
    body.kc-menu-ust .page-header .kobicar-breadcrumb,
    body.kc-menu-ust .page-header .kobicar-breadcrumb a,
    body.kc-menu-ust .page-header .kobicar-breadcrumb .bb-ayrac{ color:rgba(255,255,255,.65); }
    .page-header .kobicar-breadcrumb a{ font-weight:500; }
    body.kc-menu-ust .page-header .kobicar-breadcrumb a:hover{ color:#fff; text-decoration:none; }
    body.kc-menu-ust .page-header .kobicar-breadcrumb .bb-aktif{ color:rgba(255,255,255,.92); font-weight:600; }
    .kobicar-page-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.4rem;}
    @media(max-width:767.98px){ .kobicar-page-actions{justify-content:flex-start;} }
    /* Tema ikonu SITE temasina gore secilir (html kokunden); navbar'in kendi koyu temasi karistirmasin */
    html[data-bs-theme="light"] .tema-acik-ikon{ display:none; }
    html[data-bs-theme="dark"] .tema-koyu-ikon{ display:none; }
    .btn-tema{ background:none; border:0; cursor:pointer; }

    /* ═══════════ BUTON OLCEGI ═══════════ (.kc-btn-olcek isareti)
       Onceki kural .btn-icon'u da yakalayip kare ikon butonlari dikdortgene
       ceviriyordu. Artik ikon butonlar KARE, metinli butonlar rahat nefes alir. */
    .btn:not(.btn-icon):not(.btn-sm):not(.btn-lg):not(.btn-link){
        padding:.5rem 1.1rem; font-size:.875rem; min-height:38px;
    }
    .btn-sm:not(.btn-icon){ padding:.375rem .8rem; font-size:.8125rem; min-height:32px; }
    .btn-icon{
        padding:0 !important; width:38px; height:38px; min-height:38px;
        display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto;
    }
    .btn-icon.btn-sm{ width:32px; height:32px; min-height:32px; }
    .btn-list{ gap:.4rem; }
    /* Tablo ici aksiyon butonlari birbirine yapismasin */
    .table .btn-list, td .btn-list{ flex-wrap:nowrap; }

    /* ═══════════ LINK: fare uzerine gelince ALTI CIZILMESIN ═══════════
       Tabler/Bootstrap varsayilani hover'da underline; panelde gorsel gurultu
       yapiyor. Rengin koyulasmasi vurgu icin yeterli. */
    .page-wrapper a:hover, .page-wrapper a:focus,
    .kc-secbar a:hover, .kc-yan a:hover,
    .navbar a:hover, .dropdown-item:hover, .list-group-item-action:hover,
    .card a:hover, .table a:hover{ text-decoration:none; }

    /* Mobil tasma emniyeti (kc-mobil-sarma)
       Filtre/tarih formlari d-flex ile tek satirda zorlaniyor ve 375px'te
       ekranin disina tasiyordu. Formlari sardiriyoruz, sabit genislikli tarih
       alanlarini esnetiyoruz. Sohbet gibi BILINCLI yatay duzenlere
       dokunmaz: kural yalniz form ve buton kapsayicilarini hedefler. */
    @media(max-width:767.98px){
        .page-wrapper form.d-flex,
        .page-wrapper .card-body > .d-flex.flex-wrap,
        /* Tablo icindeki islem butonlari HARIC (flex-nowrap): sarilinca satir
           yuksekligi 107px'e cikiyor ve liste okunmaz hale geliyordu. */
        .page-wrapper .btn-list:not(.flex-nowrap):not(td .btn-list){ flex-wrap:wrap !important; }
        .page-wrapper td .btn-list, .page-wrapper .btn-list.flex-nowrap{ flex-wrap:nowrap !important; }
        .page-wrapper form input[type="date"],
        .page-wrapper form input[type="search"]{ width:auto !important; min-width:0; flex:1 1 8.5rem; }
        .page-wrapper form .form-select,
        .page-wrapper form select.form-control{ min-width:0; }
        .page-wrapper form .ms-auto{ margin-left:0 !important; }
    }

    /* Mobil: parmak hedefi buyusun */
    @media(max-width:767.98px){
        .btn:not(.btn-icon):not(.btn-lg){ min-height:42px; padding:.55rem 1rem; }
        .btn-icon{ width:42px; height:42px; min-height:42px; }
        .btn-icon.btn-sm{ width:38px; height:38px; min-height:38px; }
    }

    /* ═══════════ SAYFA ZEMINI VE GENISLIGI ═══════════
       Icerik alani saf beyaz yerine hafif gri; ic sidebar bir tik daha koyu ki
       katmanlar birbirinden ayrissin. Gece modunda Tabler'in kendi zeminleri
       gecerli kalir. */

    /* Container'in max-width'i iptal: icerik ortada dar bir sutunda kalmasin,
       ekranin tamamini kullansin. Kenar boslugu container'in kendi padding'i. */
    .page-wrapper .container-xl,
    .page-header .container-xl{ max-width:none; }

    /* ═══════════ RAY DUZENI (otodeger panel catisi, KobiCar paleti) ═══════════
       Ince ust bar + 50px ikon rayi + 200px ic sidebar. Sert kose (3px),
       aktif ogede 3px sol vurgu seridi. Renkler panel paletinden gelir. */
    body.kc-menu-ray{ --kc-ust-y:50px; --kc-ray-g:50px; --kc-sec-g:200px; }

    .kc-ust{
        position:sticky; top:0; z-index:60; height:var(--kc-ust-y);
        display:flex; align-items:center; gap:.25rem; padding:0 .5rem 0 0;
        background:var(--kc-menu); box-shadow:0 1px 3px rgba(0,0,0,.25);
        color:rgba(255,255,255,.82);   /* cocuklar (ayrac, sube, arama) buradan miras alir */
    }
    .kc-ust-logo{
        display:flex; align-items:center; height:var(--kc-ust-y);
        padding:0 .9rem; text-decoration:none;
    }
    .kc-ust-hamb{
        width:var(--kc-ray-g); height:var(--kc-ust-y); border:0; background:none;
        color:rgba(255,255,255,.75); font-size:1.25rem; cursor:pointer;
    }
    .kc-ust-bosluk{ flex:1 1 auto; }

    /* ── Ust bar sol bolgesi: ayrac + sube secici + menu arama ──────────
       otodeger panelindeki gibi logo | sube | arama dizilimi.
       Renk bilincli olarak INHERIT: ayni parca hem koyu ust barda (ray/ust)
       hem acik seritte (sol duzeni) dogru gorunsun diye. */
    .kc-ust-ayrac{
        width:1px; height:22px; flex:0 0 1px;
        background:currentColor; opacity:.18; margin:0 .35rem;
    }
    .kc-sube-btn{
        display:inline-flex; align-items:center; gap:.35rem;
        height:32px; padding:0 .6rem; border-radius:3px;
        color:inherit; opacity:.85; text-decoration:none;
        font-size:.8125rem; white-space:nowrap; cursor:pointer;
    }
    .kc-sube-btn:hover{ opacity:1; background:rgba(128,128,128,.18); color:inherit; }
    .kc-sube-btn i:first-child{ font-size:1rem; }
    .kc-sube-ok{ font-size:.7rem; opacity:.7; }
    .kc-sube .dropdown-menu{ min-width:13rem; }
    @media(max-width:1199.98px){ .kc-sube-ad{ display:none; } }

    .kc-ara{ position:relative; flex:0 1 20rem; min-width:0; }
    .kc-ara-ikon{
        position:absolute; left:.6rem; top:50%; transform:translateY(-50%);
        font-size:.95rem; opacity:.55; pointer-events:none; color:inherit;
    }
    .kc-ara-giris{
        width:100%; height:32px; padding:0 .6rem 0 2rem;
        border:1px solid rgba(128,128,128,.28); border-radius:3px;
        background:rgba(128,128,128,.12); color:inherit;
        font-size:.8125rem; outline:none;
    }
    .kc-ara-giris::placeholder{ color:currentColor; opacity:.5; }
    .kc-ara-giris:focus{ background:rgba(128,128,128,.2); border-color:rgba(128,128,128,.45); }
    .kc-ara-sonuc{
        position:absolute; top:calc(100% + 4px); left:0; right:0; z-index:1080;
        background:var(--kc-yuzey); border:1px solid var(--kc-cizgi); border-radius:3px;
        box-shadow:0 6px 20px rgba(0,0,0,.16); overflow:hidden; max-height:60vh; overflow-y:auto;
    }
    .kc-ara-oge{
        display:flex; align-items:center; gap:.5rem;
        padding:.45rem .65rem; color:var(--kc-metin); text-decoration:none;
        border-bottom:1px solid var(--kc-cizgi-ince); font-size:.8125rem;
    }
    .kc-ara-oge:last-child{ border-bottom:0; }
    .kc-ara-oge:hover, .kc-ara-oge.etkin{ background:var(--kc-yuzey-3); color:var(--kc-baslik); }
    .kc-ara-oge i{ font-size:1rem; opacity:.65; flex:0 0 auto; }
    .kc-ara-ad{ font-weight:500; white-space:nowrap; }
    .kc-ara-yol{
        margin-left:auto; padding-left:.5rem; font-size:.6875rem;
        color:var(--kc-metin-3); white-space:nowrap;
        overflow:hidden; text-overflow:ellipsis; max-width:11rem;
    }
    .kc-ara-bos{ padding:.6rem .65rem; font-size:.8125rem; color:var(--kc-metin-3); }

    /* ── MOBIL UST BAR BUTCESI ──────────────────────────────────────────
       375px'te bar tasiyordu. Sirayla feda edilenler:
       1. menu arama (zaten d-none d-lg-block)
       2. sube etiketi -> yalniz ikon (>=1200px'te geri gelir)
       3. ayrac cizgisi ve chevron
       4. logo olcegi ve yan bosluklar
       Logo hangi dosya olursa olsun bari tasirmasin diye kapsayici min-width:0. */
    .kc-ust-logo{ min-width:0; overflow:hidden; flex:0 1 auto; }
    @media(max-width:575.98px){
        .kc-ust{ gap:0; }
        .kc-ust-logo{ padding:0 .5rem; }
        .kc-ust-logo .panel-logo svg,
        .kc-ust-logo .panel-logo img{ height:.95rem !important; }
        .kc-ust-ayrac{ display:none; }
        .kc-sube-ok{ display:none; }
        .kc-sube-btn{ padding:0 .4rem; }
    }
    /* 320-374px: cok dar ekran. Logo kirpilmasin diye tema dugmesi feda edilir
       (salt tercih; islev kaybi yok) ve logo bir kademe daha kucultulur. */
    @media(max-width:374.98px){
        .kc-ust-sag .btn-tema{ display:none; }
        .kc-ust-logo{ padding:0 .35rem; }
        .kc-ust-logo .panel-logo svg,
        .kc-ust-logo .panel-logo img{ height:.75rem !important; }
    }

    /* UST duzeni: navbar koyu temada; parcalar acik murekkep alsin. */
    [data-bs-theme="dark"] > .container-fluid > .kc-sube-btn,
    [data-bs-theme="dark"] .kc-ust-ayrac,
    [data-bs-theme="dark"] > .container-fluid .kc-ara-giris,
    .navbar[data-bs-theme="dark"] .kc-sube-btn,
    .navbar[data-bs-theme="dark"] .kc-ara-giris{ color:rgba(255,255,255,.88); }
    /* Sonuc kutusu HER ZAMAN acik yuzey: koyu barin mirasini kirar. */
    .kc-ara-sonuc, .kc-ara-sonuc *{ color:var(--kc-metin); }
    .kc-ara-sonuc .kc-ara-yol{ color:var(--kc-metin-3); }
    .kc-ara-sonuc .kc-ara-oge.etkin, .kc-ara-sonuc .kc-ara-oge:hover{ color:var(--kc-baslik); }

    /* ── Veri tablolari TEK SATIR ───────────────────────────────────────
       Hucre icerigi alt satira dusmesin; tasma .table-responsive icinde
       yatay kaydirmayla cozulur (sayfa govdesi yatay kaymaz).
       Cok satirli olmasi GEREKEN hucreler .kc-sar ile muaf tutulabilir. */
    .table-vcenter > thead > tr > th,
    .table-vcenter > tbody > tr > td{ white-space:nowrap; }
    /* Asiri uzun hucre (or. log dokumleri, 1000+ karakter) tabloyu metrelerce
       genisletmesin: uc nokta ile kesilir, satir yine TEK kalir. Buton/menu
       iceren hucreler ve son kolon (islemler) haric tutulur ki acilir menuler
       kirpilmasin. :has() desteklemeyen tarayicida kural dusar, davranis eskiye
       doner: bozulma degil, yalniz genis tablo. */
    .table-vcenter > tbody > tr > td:not(:last-child):not(:has(.dropdown)):not(:has(.btn)):not(:has(input)){
        max-width:30rem; overflow:hidden; text-overflow:ellipsis;
    }
    .table-vcenter > tbody > tr > td.kc-sar,
    .table-vcenter > tbody > tr > td .kc-sar{ white-space:normal; }

    /* Sag ikonlar birbirine cok yakindi; nefes payi verildi. */
    .kc-ust-sag{ gap:.5rem; }
    .kc-ust-sag > *{ margin-left:0; }
    .kc-ust-sag .nav-link{ padding-left:.65rem; padding-right:.65rem; }
    .kc-ust-sag .nav-link, .kc-ust-sag .btn-tema{ color:rgba(255,255,255,.82); }
    .kc-ust-sag .nav-link:hover, .kc-ust-sag .btn-tema:hover{ color:#fff; }

    .kc-kabuk{ display:flex; align-items:stretch; min-height:calc(100vh - var(--kc-ust-y)); }

    .kc-ray{
        flex:0 0 var(--kc-ray-g); width:var(--kc-ray-g);
        background:var(--kc-menu); display:flex; flex-direction:column;
        padding-top:4px; position:sticky; top:var(--kc-ust-y);
        height:calc(100vh - var(--kc-ust-y));
        height:calc(100dvh - var(--kc-ust-y));   /* mobil tarayici cubuklarina dayanikli */
        z-index:56;
        /* DIKKAT: burada overflow-y:auto KULLANMA. Overflow bir kirpma baglami
           yaratir ve .kc-ipucu (ikonun yaninda cikan menu adi) rayin DISINA
           konumlandigi icin kirpilir, yani ipucu gorunmez olur.
           Mobilde kaydirma gerekiyor; onu asagidaki medya blogu veriyor. */
    }
    .kc-ri{
        position:relative; height:46px; display:flex; align-items:center; justify-content:center;
        color:rgba(255,255,255,.62); text-decoration:none;
        border-left:3px solid transparent; transition:background .12s, color .12s;
    }
    .kc-ri i{ font-size:1.3rem; }
    .kc-ri:hover{ background:rgba(255,255,255,.06); color:#fff; }
    .kc-ri.acik{ background:rgba(255,255,255,.08); color:#fff; border-left-color:var(--kc-marka); }
    .kc-ri.acik i{ color:var(--kc-marka); }
    .kc-ipucu{
        position:absolute; left:calc(var(--kc-ray-g) + 2px); top:50%; transform:translateY(-50%);
        background:#141a1d; color:#fff; font-size:12px; padding:5px 10px; border-radius:3px;
        white-space:nowrap; opacity:0; pointer-events:none; z-index:70; transition:opacity .12s;
    }
    .kc-ri:hover .kc-ipucu{ opacity:1; }
    .kc-ray-ayrac{ height:1px; background:rgba(255,255,255,.09); margin:4px 10px; }
    .kc-ray-dip{ margin-top:auto; }

    .kc-secbar{
        flex:0 0 var(--kc-sec-g); width:var(--kc-sec-g);
        background:var(--tblr-bg-surface-secondary, #f4f6f9);
        border-right:1px solid var(--tblr-border-color);
        position:sticky; top:var(--kc-ust-y);
        height:calc(100vh - var(--kc-ust-y));
        height:calc(100dvh - var(--kc-ust-y));
        overflow-y:auto; overscroll-behavior:contain;
        display:flex; flex-direction:column;
    }
    /* Modul bolum kumesi: TUM moduller basilir, yalniz gorunen olan acilir.
       Masaustunde aktif modul, mobilde raydan secilen modul gorunur. */
    .kc-sg[hidden]{ display:none; }
    /* Gorunen kume kolonu doldurur; 'ayar' ogesi kolonun DIBINE yapisir. */
    .kc-sg:not([hidden]){ display:flex; flex-direction:column; flex:1 1 auto; min-height:100%; }
    .kc-si-dip{ margin-top:auto; border-top:1px solid var(--tblr-border-color); }
    .kc-sh{
        padding:13px 14px 8px; font-size:14px; font-weight:700; color:var(--tblr-body-color);
        border-bottom:1px solid var(--tblr-border-color); margin-bottom:4px;
    }
    .kc-si-grup{
        padding:9px 14px 3px; font-size:.66rem; font-weight:700; letter-spacing:.06em;
        text-transform:uppercase; color:var(--tblr-secondary);
    }
    .kc-si{
        display:flex; align-items:center; gap:9px; padding:8px 14px; font-size:13px;
        color:var(--tblr-body-color); text-decoration:none;
        border-left:3px solid transparent; transition:background .12s;
    }
    .kc-si i{ font-size:1rem; color:var(--tblr-secondary); flex:0 0 auto; }
    .kc-si:hover{ background:rgba(0,0,0,.04); color:var(--tblr-body-color); }
    .kc-si.acik{
        background:var(--kc-marka-zemin); border-left-color:var(--kc-marka);
        color:var(--kc-marka); font-weight:600;
    }
    .kc-si.acik i{ color:var(--kc-marka); }

    /* ── Marka logo kutusu ────────────────────────────────────────────
       Marka gecen her ekranda ayni olcu: degerleme listesi, filtreler,
       hizli sorgula, katalog ayarlari. Logosu olmayan markada bas harf. */
    .mk-satir{ display:inline-flex; align-items:center; gap:8px; min-width:0; }
    .mk-kutu{
        display:inline-flex; align-items:center; justify-content:center;
        width:38px; height:28px; flex:0 0 auto; overflow:hidden;
        background:#fff; border:1px solid var(--tblr-border-color);
        border-radius:var(--tblr-border-radius);
    }
    .mk-kutu img{ max-width:30px; max-height:20px; object-fit:contain; display:block; }
    .mk-kutu .mk-harf{ font-size:.74rem; font-weight:700; color:#7b8494; line-height:1; }
    .mk-kutu.mk-kucuk{ width:30px; height:22px; }
    .mk-kutu.mk-kucuk img{ max-width:24px; max-height:16px; }

    /* ── Musteri etiketi rozeti (bronze / silver / gold / platinum) ──
       Rozetin kendisi satir ici SVG: admin/kobicar/_etiket-rozet.blade.php */
    .mk-svg{ display:block; flex:0 0 auto; filter:drop-shadow(0 1px 2px rgba(0,0,0,.18)); }
    .mk-rozet-secim{ display:flex; flex-wrap:wrap; gap:8px; }
    .mk-rozet-oge{
        margin:0; cursor:pointer; user-select:none; text-align:center;
        display:flex; flex-direction:column; align-items:center; gap:4px;
        padding:8px 10px 6px; min-width:78px;
        border:1px solid var(--tblr-border-color); border-radius:var(--tblr-border-radius);
        background:var(--tblr-bg-surface); transition:border-color .12s, box-shadow .12s;
    }
    .mk-rozet-oge:hover{ border-color:var(--tblr-primary); }
    .mk-rozet-oge.secili{ border-color:var(--tblr-primary); box-shadow:0 0 0 .12rem rgba(var(--tblr-primary-rgb),.16); }
    .mk-rozet-oge .mk-rozet-ad{ font-size:.72rem; font-weight:600; color:var(--tblr-secondary); }
    .mk-rozet-oge.secili .mk-rozet-ad{ color:var(--tblr-primary); }
    .mk-rozet-oge:not(.secili) .mk-svg{ filter:grayscale(.65) opacity(.75); }
    .mk-rozet-yok{
        width:40px; height:48px; display:flex; align-items:center; justify-content:center;
        color:var(--tblr-secondary); font-size:1.35rem;
    }
    /* Pano tarih secici: masaustunde sabit genislik, mobilde tam genislik.
       (Satir ici stil kullanilmiyor; mobil kurali ezemiyordu.) */
    [data-pn-tarih] { width:200px; cursor:pointer; }
    @media (max-width:575.98px) { [data-pn-tarih] { width:100%; } }
    /* Bildirim listesi: okunmamis satir sol kenardan vurgulanir. */
    .bl-satir { border-left:3px solid transparent; }
    .bl-yeni { border-left-color:var(--tblr-primary); background:rgba(var(--tblr-primary-rgb), .04); }
    /* ── MOBIL DUZEN ─────────────────────────────────────────────────────
       Kart basligi dar ekranda tek satira sikisiyordu: baslik + sayac + arama
       ust uste biniyor, kutular kenardan tasiyordu. Aksiyonlar kendi satirina
       iner ve tam genislik alir. */
    @media (max-width: 575.98px) {
        .card-header { flex-wrap:wrap; row-gap:.5rem; }
        /* Yalniz form/filtre tasiyan aksiyonlar alta iner; tek butonlar (Duzenle,
           Ac/Kapat) basligin sagindaki yerinde kalir. */
        .card-header > .card-actions:has(input, select, .input-group, .btn-group) {
            width:100%; margin-left:0; justify-content:flex-start;
        }
        .card-header > .card-actions > form { flex:1 1 auto; }
        .card-header > .card-actions .kc-ara-kutu,
        .card-header > .card-actions .form-select,
        .card-header > .card-actions input.form-control { width:100%; }
        .kc-mobil-tam { width:100%; }
    }
    /* Tablo islem sutunu: butonlar alt alta dusup satiri 107px'e cikariyordu.
       Bootstrap'in flex-nowrap yardimcisi bu pakette yok, kural burada. */
    .btn-list.flex-nowrap { flex-wrap:nowrap; }
    @media (max-width: 767.98px) {
        /* Harita 375px'e sigdiginda il rakamlari ~3px kaliyor: okunmuyor.
           Dokununca ipucu ve yan liste zaten sayiyi veriyor. */
        .pn-harita-yazi { display:none; }
    }
    /* Etiketli alanlarla ayni satirda duran buton: form-select ile ayni yukseklik. */
    .kc-satir-btn { height:calc(1.4285714em + .875rem + 2px); }
    /* Kart basligindaki tek arama kutusu. */
    .kc-ara-kutu { width:340px; }
    @media (max-width:575.98px) { .kc-ara-kutu { width:100%; } }
    /* Listede rozeti olmayan musteri: cizgi degil, bos rozet kutusu. */
    .mk-rozet-bos {
        display:inline-block; width:22px; height:26px;
        border:1px dashed var(--tblr-border-color); border-radius:4px; opacity:.7;
    }

    /* ── Kose yaricapi: TEK token ────────────────────────────────────
       Panelde bircok yerde var(--radius) yaziliyordu ama bu degisken
       yonetim tarafinda HIC TANIMLI DEGILDI; kural gecersiz kalip o
       ogeler kare koseli render oluyordu (Operasyon Muhasebesi kartlari,
       kaydet cubugu, toast, footer rozeti). Tabler token'ina baglandi. */
    :root { --radius: var(--tblr-border-radius); }

    /* ── Operasyon Muhasebesi: gece modu ─────────────────────────────
       Modul kendi .opm-* CSS'ini kullaniyor ve renkleri sabit hex'ti;
       gece modunda koyu zeminde koyu yazi cikiyordu. Renkler burada
       Tabler token'larina cevrilir (yerlesim/olcu degismez). */
    [data-bs-theme="dark"] .opm-nav,
    [data-bs-theme="dark"] .opm-panel,
    [data-bs-theme="dark"] .opm-card { background:var(--tblr-bg-surface); border-color:var(--tblr-border-color); }
    [data-bs-theme="dark"] .opm-nav a { color:var(--tblr-secondary); }
    [data-bs-theme="dark"] .opm-nav a i { color:var(--tblr-secondary); }
    [data-bs-theme="dark"] .opm-nav a:hover { background:var(--tblr-bg-surface-secondary); color:var(--tblr-body-color); }
    [data-bs-theme="dark"] .opm-heading,
    [data-bs-theme="dark"] .opm-card-head,
    [data-bs-theme="dark"] .opm-table td { border-color:var(--tblr-border-color); }
    [data-bs-theme="dark"] .opm-heading h1,
    [data-bs-theme="dark"] .opm-card-head h2,
    [data-bs-theme="dark"] .opm-metric strong,
    [data-bs-theme="dark"] .opm-table td,
    [data-bs-theme="dark"] .opm-table td strong { color:var(--tblr-body-color); }
    [data-bs-theme="dark"] .opm-heading p,
    [data-bs-theme="dark"] .opm-card-head span,
    [data-bs-theme="dark"] .opm-metric small,
    [data-bs-theme="dark"] .opm-empty,
    [data-bs-theme="dark"] .opm-subtle,
    [data-bs-theme="dark"] .opm-form-field label,
    [data-bs-theme="dark"] .opm-table th { color:var(--tblr-secondary); }
    [data-bs-theme="dark"] .opm-metric,
    [data-bs-theme="dark"] .opm-table th,
    [data-bs-theme="dark"] .opm-pill,
    [data-bs-theme="dark"] .opm-button-secondary { background:var(--tblr-bg-surface-secondary); border-color:var(--tblr-border-color); }
    [data-bs-theme="dark"] .opm-pill,
    [data-bs-theme="dark"] .opm-button-secondary { color:var(--tblr-secondary); }
    [data-bs-theme="dark"] .opm-input,
    [data-bs-theme="dark"] .opm-select,
    [data-bs-theme="dark"] .opm-cancel-reason { background:var(--tblr-bg-forms); border-color:var(--tblr-border-color); color:var(--tblr-body-color); }

    /* ── Modul panosu: Turkiye isi haritasi ──────────────────────────
       Satir ici SVG; il yollari resources/data/turkiye-harita.json'dan. */
    .pn-harita-sar { position:relative; overflow:hidden; border-radius:var(--tblr-border-radius); }
    .pn-harita { display:block; width:100%; height:auto; }
    /* #pnKat = CRM panosu, .pn-kat = tekrar kullanilabilir harita bileseni. */
    .pn-harita #pnKat,
    .pn-harita .pn-kat { transition:transform .55s cubic-bezier(.4,0,.2,1); transform-origin:0 0; }

    /* Plaka rozeti (admin/_plaka-rozet.blade.php) - gercek plaka gorunumu */
    .kc-plaka { display:inline-flex; align-items:stretch; border:2px solid #111; border-radius:5px;
                overflow:hidden; background:#fff; color:#111; font-weight:700; line-height:1;
                letter-spacing:.06em; vertical-align:middle; }
    .kc-plaka .tr { background:#0b4ea2; color:#fff; padding:6px 5px; font-size:.55rem; font-weight:700;
                    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; }
    .kc-plaka .tr svg { width:11px; height:8px; }
    .kc-plaka .no { padding:6px 11px; font-size:1rem; white-space:nowrap; }
    .kc-plaka-kucuk .tr { padding:4px 4px; font-size:.45rem; }
    .kc-plaka-kucuk .no { padding:4px 8px; font-size:.82rem; }
    [data-bs-theme="dark"] .kc-plaka { border-color:#000; }

    /* Pano kisayol kutusu */
    .pw-kisayol { display:grid; grid-template-columns:repeat(auto-fill, minmax(148px, 1fr)); gap:8px; }
    .pw-kisayol-oge {
        display:flex; align-items:center; gap:8px; padding:8px 10px; min-width:0;
        border:1px solid var(--tblr-border-color); border-radius:var(--tblr-border-radius);
        background:var(--tblr-bg-surface); color:inherit; text-decoration:none;
        font-size:.8rem; font-weight:500; transition:border-color .12s, background .12s;
    }
    .pw-kisayol-oge:hover { border-color:var(--tblr-primary); background:var(--tblr-bg-surface-secondary); color:inherit; }
    .pw-kisayol-ad { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .pn-harita path { stroke:var(--tblr-border-color); stroke-width:.6; transition:fill .12s, opacity .12s; }
    .pn-il { cursor:pointer; }
    .pn-il:hover path { opacity:.75; }
    /* Uzerine gelince rakam gider, yerine ipucu cikar. */
    .pn-il:hover .pn-harita-yazi { opacity:0; }

    .pn-ipucu {
        position:absolute; z-index:5; pointer-events:none;
        background:var(--tblr-bg-surface); border:1px solid var(--tblr-border-color);
        border-radius:var(--tblr-border-radius); box-shadow:0 6px 20px rgba(15,20,34,.16);
        padding:6px 10px; display:flex; flex-direction:column; line-height:1.25; white-space:nowrap;
    }
    .pn-ipucu b { font-size:.82rem; }
    .pn-ipucu span { font-size:.7rem; color:var(--tblr-secondary); }

    /* Harita + kalici yan liste (il <-> ilce ayni kutuda yer degistirir) */
    /* align-items:start -> uzun liste satiri gerip haritayi uzatmasin. */
    .pn-harita-duzen { display:grid; grid-template-columns:minmax(0,1fr) 290px; gap:14px; align-items:start; }
    @media (max-width: 991.98px) { .pn-harita-duzen { grid-template-columns:1fr; } }

    .pn-yan {
        display:flex; flex-direction:column; min-height:0; overflow:hidden;
        max-height:51vh;                     /* harita boyunu asmasin */
        border:1px solid var(--tblr-border-color); border-radius:var(--tblr-border-radius);
        background:var(--tblr-bg-surface);
    }
    .pn-yan-bas {
        display:flex; align-items:center; gap:6px; padding:9px 11px;
        border-bottom:1px solid var(--tblr-border-color); font-weight:600; font-size:.8rem;
    }
    .pn-yan-govde { flex:1 1 auto; overflow-y:auto; padding:6px 8px 8px; min-height:0; }
    .pn-yan-bos { padding:14px 4px; color:var(--tblr-secondary); font-size:.75rem; }

    .pn-sat {
        width:100%; display:grid; grid-template-columns:1fr 56px 52px; align-items:center; gap:8px;
        padding:6px 6px; border:0; background:none; color:inherit; text-align:left;
        border-radius:var(--tblr-border-radius); font-size:.75rem; cursor:pointer;
    }
    .pn-sat:hover { background:var(--tblr-bg-surface-secondary); }
    .pn-sat.pn-sat-duz { cursor:default; }
    .pn-sat.pn-sat-duz:hover { background:none; }
    .pn-sat-ad { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .pn-sat-cubuk { height:5px; border-radius:99px; background:var(--tblr-bg-surface-secondary); overflow:hidden; }
    .pn-sat-cubuk > span { display:block; height:100%; background:var(--tblr-primary); border-radius:99px; }
    .pn-sat-adet { text-align:right; font-variant-numeric:tabular-nums; font-weight:600; }
    /* Oranli liste (orn. olumlu teklif): adetin yaninda gelene gore yuzde. */
    .pn-yan-govde.pn-oranli .pn-sat { grid-template-columns:1fr 38px 46px 44px; }
    .pn-sat-oran { text-align:right; font-variant-numeric:tabular-nums; font-size:.7rem; color:var(--tblr-secondary); }
    .pn-harita-olcek { display:flex; align-items:center; gap:5px; margin-top:10px; font-size:.7rem; }
    .pn-olcek-kutu { width:26px; height:10px; border-radius:2px; display:inline-block; }
    .pn-harita-yazi { font-size:9px; font-weight:700; text-anchor:middle; dominant-baseline:middle; pointer-events:none; }
    /* Yakinlasinca il rakami devasa buyuyor; gizlenir, yerini ilce sinirlari alir. */
    .pn-harita-sar.yakin .pn-harita-yazi { opacity:0; }
    .pn-ilce-yol { stroke:#fff; stroke-width:1.1; stroke-linejoin:round; cursor:pointer; transition:opacity .12s; }
    .pn-ilce-yol:hover { opacity:.72; }

    /* En cok musteri olan sehirler: dortlu kutu */
    .pn-sehir-kutu {
        display:flex; flex-direction:column; gap:4px; padding:12px 14px; height:100%;
        border:1px solid var(--tblr-border-color); border-radius:var(--tblr-border-radius);
        background:var(--tblr-bg-surface); text-decoration:none; color:inherit; transition:border-color .12s;
    }
    .pn-sehir-kutu:hover { border-color:var(--tblr-primary); }
    .pn-sehir-ad { font-size:.75rem; font-weight:600; color:var(--tblr-secondary); }
    .pn-sehir-adet { font-size:1.25rem; font-weight:700; line-height:1.1; font-variant-numeric:tabular-nums; }
    .pn-sehir-cubuk { display:block; height:4px; border-radius:99px; background:var(--tblr-bg-surface-secondary); overflow:hidden; }
    .pn-sehir-cubuk > span { display:block; height:100%; background:var(--tblr-primary); border-radius:99px; }

    /* ── Modul panosu: rozet dagilimi ───────────────────────────────── */
    /* Masaustunde kartlar tam genisligi doldurur. min() sarmasi dar ekranda
       parcanin 312px'e kilitlenip tasmasini onler (mobilde tek kolon). */
    /* Dizustu ve masaustunde 4'lu; auto-fill kullanilmaz cunku dizustunde
       icerik alani 4x312px'e yetmeyip 3 kolona dusuyordu. */
    .mp-rozet-izgara { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:10px; }
    @media (max-width: 991.98px) { .mp-rozet-izgara { grid-template-columns:repeat(3, minmax(0, 1fr)); } }
    @media (max-width: 767.98px) { .mp-rozet-izgara { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
    .mp-rozet {
        display:flex; flex-direction:column; align-items:center; gap:4px; padding:14px 10px 12px;
        border:1px solid var(--tblr-border-color); border-radius:var(--tblr-border-radius);
        background:var(--tblr-bg-surface); text-decoration:none; color:inherit; transition:border-color .12s, box-shadow .12s;
    }
    .mp-rozet:hover { border-color:var(--tblr-primary); box-shadow:0 0 0 .12rem rgba(var(--tblr-primary-rgb),.14); }
    .mp-rozet-adet { font-size:1.35rem; font-weight:700; line-height:1.1; font-variant-numeric:tabular-nums; }
    .mp-rozet-ad { font-size:.75rem; font-weight:600; color:var(--tblr-secondary); }

    /* ── Telefon girdisi (tek standart) ──────────────────────────────
       Onek +90 SABIT; kullanici yalniz 10 haneyi yazar. Bicimleme ve
       "5 ile baslar" kurali sayfa sonundaki kcTelefonKur() ile isler. */
    .kc-tel .kc-tel-onek {
        display:flex; align-items:center; gap:6px; font-weight:600; color:var(--tblr-secondary);
        /* Ic koseler KARE: bayrak kutusu ile numara alani bitisik dursun.
           Gri zemin, aradaki ayrac cizgi ve dis koseler aynen kalir. */
        border-top-right-radius:0; border-bottom-right-radius:0;
    }
    .kc-tel .kc-tel-bayrak { border-radius:2px; flex:0 0 auto; display:block; }
    .kc-tel .kc-tel-girdi {
        font-variant-numeric:tabular-nums; letter-spacing:.02em;
        border-top-left-radius:0; border-bottom-left-radius:0;
    }

    /* ── Modal standardi (panel geneli) ──────────────────────────────
       Masaustunde HICBIR modal 500px'in altina inmez. Tabler varsayilani
       540px, .modal-sm 380px idi; ikisi de yukseltildi.
       Mobilde bottom-sheet davranisi assets/kobicar.css Bolum 11'den
       gelir (tum .modal'lar icin generic), buraya tekrar yazilmaz. */
    @media (min-width: 576px) {
        .modal-dialog { --tblr-modal-width: 560px; }
        .modal-sm     { --tblr-modal-width: 500px; }
    }

    /* ── Sayfalama standardi ─────────────────────────────────────────
       Gorunum AppServiceProvider'da pagination::bootstrap-4'e sabitlendi;
       burasi olcu/hizalamayi tum ekranlarda esitler. */
    .pagination { margin-bottom: 0; flex-wrap: wrap; row-gap: 6px; }
    .pagination .page-link { font-size: .82rem; }
    .card-footer .pagination { justify-content: flex-end; }
    @media (max-width: 575.98px) {
        .card-footer .pagination { width: 100%; justify-content: center; }
    }

    /* Eylem seridi: sayfa basligi kalkti, yalniz dugmeler kaldi. */
    .kc-eylem-serit{ padding:.85rem 0 0; }
    .kc-eylem-serit .kobicar-page-actions{ display:flex; flex-wrap:wrap; gap:.5rem; justify-content:flex-end; }
    @media(max-width:767.98px){ .kc-eylem-serit .kobicar-page-actions{ justify-content:flex-start; } }
    .kc-mcol{ flex:1 1 auto; min-width:0; }
    body.kc-menu-ray .page-wrapper{ min-height:calc(100vh - var(--kc-ust-y)); }

    /* Mobil: ray ve ic sidebar disari kayar, hamburger ile acilir (kc-mobil-menu-v2)
       KRITIK: height MUTLAKA ezilmeli. top + bottom + height birlikte verilince
       kutu over-constrained olur, bottom duser ve alt kenar 100vh'ye gider;
       mobilde gorunur alan daha kucuk oldugu icin alttaki bolumlere ulasilamaz. */
    @media(max-width:991.98px){
        /* CEKMECE: left ile konumlanir (transform ile cozulemedi; ayrinti asagida).
           height MUTLAKA ezilir: top + bottom + height birlikte verilince kutu
           over-constrained olur, bottom duser ve alt kenar 100vh'ye gider. */
        .kc-ray, .kc-secbar{
            position:fixed; top:var(--kc-ust-y); bottom:0;
            height:auto !important; max-height:none !important;
            overflow-y:auto; overscroll-behavior:contain;
            -webkit-overflow-scrolling:touch;
            transform:none;
            transition:left .2s ease;
            z-index:56;
        }
        .kc-ray{ left:calc(-1 * var(--kc-ray-g) - 10px); }
        .kc-secbar{
            box-shadow:2px 0 12px rgba(0,0,0,.15);
            width:min(var(--kc-sec-g), calc(100vw - var(--kc-ray-g) - 44px));
            /* Kapali: kendi genisligi + ray payi kadar sola. Eskiden yalniz kendi
               genisligi kadar kaydiriliyordu ve 30px'lik serit ekranda kaliyordu. */
            left:calc(-1 * min(var(--kc-sec-g), 100vw - var(--kc-ray-g) - 44px) - var(--kc-ray-g) - 16px);
        }
        body.kc-menu-ray.kc-ray-acik .kc-ray{ left:0; }
        body.kc-menu-ray.kc-ray-acik .kc-secbar{ left:var(--kc-ray-g); }
        .kc-mcol{ width:100%; }
        /* Cekmece acikken arka plan kaymasin */
        body.kc-menu-ray.kc-ray-acik{ overflow:hidden; }
        /* Arka perde */
        body.kc-menu-ray.kc-ray-acik .kc-perde{
            display:block; position:fixed; inset:var(--kc-ust-y) 0 0 0;
            background:rgba(0,0,0,.38); z-index:54;
        }
        /* Mobilde ray ikonu gezinmez, alt menuyu acar: secili olan belli olsun */
        .kc-ri.secili{ background:rgba(255,255,255,.12); color:#fff; }
    }
    .kc-perde{ display:none; }

    /* Modul sol menusu — kobicar admin (musteriler/23) ile BIREBIR.
       Tabler'in kendi .list-group-item olculeri KORUNUR; padding/font ezilmez. */
    .kc-yan{ position:sticky; top:1rem; }
    .kc-yan-oge.aktif{
        background:var(--kc-marka-zemin); color:var(--kc-marka); font-weight:600;
        box-shadow:inset 2px 0 0 var(--kc-marka);
    }
    .kc-yan-oge.aktif i{ color:var(--kc-marka); }
    .kc-yan-oge i{ color:var(--tblr-secondary); flex:0 0 auto; font-size:1.05rem; }
    @media(max-width:991.98px){ .kc-yan{ position:static; } }

    /* Modul acilis kutulari */
    .card-link-pop{ transition:transform .12s ease, box-shadow .12s ease; }
    .card-link-pop:hover{ transform:translateY(-2px); }

    .navbar-brand .panel-logo svg, .navbar-brand .panel-logo img{ display:block; }
    /* Ust menu: modul acilir listeleri uzun olabilir -> kendi icinde kaysin */
    .navbar .dropdown-menu{ max-height:78vh; overflow-y:auto; }
    /* Sutunlu modul menusu. DIKKAT: .dropdown-menu-columns Tabler'da menunun ICINDE
       sarmalayicidir; dogrudan .dropdown-menu uzerine konursa Tabler'in kosulsuz
       display:flex kurali .dropdown-menu{display:none}'i ezer ve tum menuler acik kalir. */
    .navbar .dropdown-menu-columns{ flex-wrap:wrap; gap:.25rem; width:max-content; max-width:min(62rem, calc(100vw - 3rem)); }
    .navbar .dropdown-menu-column{ flex:1 1 12rem; min-width:12rem; }
    .navbar .dropdown-menu-column .dropdown-header{ white-space:nowrap; }
    @media(max-width:767.98px){
        .navbar .dropdown-menu-columns{ display:block; max-width:none; }
        .navbar .dropdown-menu-column{ min-width:0; }
        /* Ayarlar kartinin iki sutunu dar ekranda okunmuyor */
        .navbar .dropdown-menu-card .card-body .row > .col-6{ width:100%; }
    }

/* ── tasarim-vars (TasarimController::css('panel')), yazı tipi içe aktarımları hariç: yazı tipleri index.html'de ── */
:root{--brand-50:246 236 236;--brand-100:237 217 217;--brand-200:221 185 185;--brand-300:201 142 142;--brand-400:181 100 100;--brand-500:165 67 67;--brand-600:153 41 41;--brand-700:143 20 20;--brand-800:126 18 18;--brand-900:103 14 14;--brand-950:64 9 9;--accent-50:251 232 232;--accent-100:245 205 205;--accent-200:237 159 159;--accent-300:228 113 113;--accent-400:219 67 67;--accent-500:211 26 26;--accent-600:173 21 21;--accent-700:139 17 17;--accent-800:106 13 13;--accent-900:80 10 10;--font-sans:'Inter';--font-display:'Plus Jakarta Sans';--brand-grad:linear-gradient(135deg, rgb(var(--accent-500)) 0%, rgb(var(--accent-300)) 100%);--btn-bg:#D31A1A;--btn-text:#ffffff;--radius:4px;}.btn-primary{background-color:var(--btn-bg);color:var(--btn-text)}body{background-color:#ffffff;color:#111111}h1{color:#111111;font-size:2.25rem;}h2{color:#111111;}h3{color:#111111;}h4{color:#111111;font-weight:700;}h5{color:#111111;}h6{color:#111111;}p{font-size:0.9375rem;font-weight:400;line-height:1.7}.text-brand-700:not(:has(svg)):not(:has(img)),.text-accent-700:not(:has(svg)):not(:has(img)),.text-accent-600:not(:has(svg)):not(:has(img)),.eyebrow:not(:has(svg)):not(:has(img)),.text-brand-grad{color:rgb(var(--accent-500))}.btn-primary,.btn-accent{background-image:none!important;background-color:rgb(var(--accent-500))!important;color:#fff}.btn-primary:hover,.btn-accent:hover{background-color:rgb(var(--brand-700))!important;filter:none}

/* ── panel-palet-kilidi ── */
        :root{
            /* Tasarim ekrani bu ikisini basar; panelde urun yesiline geri cekilir */
            --btn-bg: var(--kc-marka);
            --btn-text: #ffffff;
            /* Eski panel bilesenlerinin (kobicar-ui.css, custom.css) kullandigi
               aksan skalasi: musteri tonlari yerine sabit panel tonlari */
            --accent-300: 95 208 168;
            --accent-400: 38 193 141;
            --accent-500: 0 177 114;
            --accent-600: 0 156 100;
        }
        /* MUSTERI govde rengi geri cekilir.
           TasarimController::css() "body{background-color:..;color:..}" basar;
           bu on yuze aittir. Panelde gorunurse hem marka rengi panele sizar hem
           de gece modunda siyah ustune siyah yazi olusur (olculen 1.06:1).
           "html body" ozgullugu duz "body"yi eser; !important gerekmez ve
           deger tema degiskeninden geldigi icin gece/gunduz dogru calisir. */
        html body{ background-color: var(--kc-govde); color: var(--kc-metin); }