﻿/* ══════════════════════════════════════════════════════════════════════════
   Super5 Merkez — Admin Shell tema sistemi (17.08.2026)
   LOYALTY panelinin (C:\ADANET\Super5\LOYALTY\SuperLol_panel) tasarımından
   uyarlandı: CSS custom property token'ları + açık/koyu tema + sabit
   (fixed) kenar çubuğu. Marka kimliği korunuyor — LOYALTY'nin mavisi yerine
   Merkez'in kendi kırmızı vurgusu (#b91c1c) kullanılıyor.
   ══════════════════════════════════════════════════════════════════════════ */

:root {
    --merkez-primary:     #b91c1c;
    --merkez-primary-fg:  #ffffff;
    --merkez-sidebar-w:   230px;
    --merkez-sidebar-w-dar: 64px;   /* daraltilmis ray genisligi (27.08.2026) */
    --merkez-bg:          #f1f5f9;
    --merkez-sidebar-bg:        #ffffff;
    --merkez-sidebar-fg:        #475569;
    --merkez-sidebar-muted:     #64748b;
    --merkez-sidebar-border:    #e2e8f0;
    --merkez-sidebar-hover-bg:  #f1f5f9;
    --merkez-sidebar-hover-fg:  #0f172a;
    --merkez-sidebar-active-bg: #fee2e2;
    --merkez-sidebar-active-fg: #991b1b;
    --merkez-sidebar-brand-fg:  #991b1b;
    --merkez-sidebar-faint:     #64748b;

    /* Semantik token'lar — dark modda override edilir */
    --merkez-card-bg:      #ffffff;
    --merkez-card-border:  #e5e7eb;
    --merkez-topbar-bg:    #ffffff;
    --merkez-topbar-bd:    #e5e7eb;
    --merkez-th-bg:        #f8fafc;
    --merkez-th-color:     #6b7280;
    --merkez-th-border:    #eef0f3;
    --merkez-input-bg:     #ffffff;
    --merkez-text:         #1f2937;
    --merkez-text-muted:   #6b7280;
    --merkez-row-hover:    #f9fafb;
    --merkez-row-selected: #fdecea;
    --merkez-shadow:       rgba(0,0,0,.05);
}

[data-bs-theme="dark"] {
    --merkez-bg:          #0f172a;
    --merkez-card-bg:     #1e293b;
    --merkez-card-border: #334155;
    --merkez-topbar-bg:   #1e293b;
    --merkez-topbar-bd:   #334155;
    --merkez-th-bg:       #0f172a;
    --merkez-th-color:    #94a3b8;
    --merkez-th-border:   #334155;
    --merkez-input-bg:    #0f172a;
    --merkez-text:        #e2e8f0;
    --merkez-text-muted:  #94a3b8;
    --merkez-row-hover:   rgba(255,255,255,.03);
    --merkez-row-selected: rgba(185,28,28,.16);
    --merkez-shadow:      rgba(0,0,0,.3);
    --merkez-sidebar-bg:        #1f2430;
    --merkez-sidebar-fg:        #c7c9d1;
    --merkez-sidebar-muted:     #8b90a0;
    --merkez-sidebar-border:    #333a4a;
    --merkez-sidebar-hover-bg:  #2a3040;
    --merkez-sidebar-hover-fg:  #ffffff;
    --merkez-sidebar-active-bg: #2a3040;
    --merkez-sidebar-active-fg: #ffffff;
    --merkez-sidebar-brand-fg:  #ffffff;
    --merkez-sidebar-faint:     #7a8091;
}

html, body {
    height: 100%;
    margin: 0;
    background: var(--merkez-bg);
    transition: background .2s;
}

/* ── Kabuk / kenar çubuğu (LOYALTY'deki admin-wrapper/admin-sidebar deseni) ── */
.merkez-shell { display: flex; min-height: 100vh; }

.merkez-nav {
    width: var(--merkez-sidebar-w);
    min-width: var(--merkez-sidebar-w);
    background: var(--merkez-sidebar-bg);
    color: var(--merkez-sidebar-fg);
    min-height: 100vh;
    position: fixed;
    top: 0; left: 0; bottom: 0;
    z-index: 100;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    border-right: 1px solid var(--merkez-sidebar-border);
    transition: background .2s, color .2s, border-color .2s, transform .25s ease;
}

.merkez-nav-brand {
    padding: 1rem 1.1rem;
    font-weight: 600;
    color: var(--merkez-sidebar-brand-fg);
    border-bottom: 1px solid var(--merkez-sidebar-border);
    flex-shrink: 0;
}

.merkez-nav-links { flex: 1 1 auto; padding-bottom: .5rem; }

.merkez-nav-section {
    padding: .7rem 1.1rem .2rem;
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--merkez-sidebar-faint);
}

/* -- KATLANABILIR MENU GRUPLARI (27.08.2026) -----------------------------
   Menu 34 baglantiyla ekrana sigmiyordu. Her grup artik bir akordiyon:
   baslik bir <button>, govde acikken gorunur. Bulunulan sayfanin grubu
   NavMenu.razor tarafindan kendiliginden aciliyor. */
.merkez-nav-grup { display: flex; flex-direction: column; }

.merkez-nav-grup-baslik {
    display: flex; align-items: center; gap: .5rem;
    width: 100%;
    background: transparent;
    border: 0;
    border-left: 3px solid transparent;
    color: var(--merkez-sidebar-muted);
    padding: .55rem 1.1rem;
    font-size: .68rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .06em;
    text-align: left;
    cursor: pointer;
    transition: background .15s, color .15s;
}
.merkez-nav-grup-baslik:hover { background: var(--merkez-sidebar-hover-bg); color: var(--merkez-sidebar-hover-fg); }

/* Bulunulan sayfa bu gruptaysa baslik da vurgulanir -- grup kapaliyken bile
   kullanicinin nerede oldugu belli olsun. */
.merkez-nav-grup-baslik.aktif { color: var(--merkez-sidebar-active-fg); border-left-color: var(--merkez-primary); }

.merkez-nav-grup-baslik > i:first-child { font-size: .95rem; }

.grup-ok { margin-left: auto; font-size: .7rem; transition: transform .18s ease; }
.merkez-nav-grup.acik .grup-ok { transform: rotate(180deg); }

.merkez-nav-grup-govde { display: none; }
.merkez-nav-grup.acik .merkez-nav-grup-govde { display: block; }

/* Grup icindeki baglantilar bir kademe icerde -- hiyerarsi gozle secilsin. */
.merkez-nav-grup-govde .nav-link { padding-left: 1.75rem; }

.merkez-nav .nav-link {
    color: var(--merkez-sidebar-fg);
    padding: .5rem 1.1rem;
    font-size: .88rem;
    border-left: 3px solid transparent;
    border-radius: 0;
    transition: background .15s, color .15s;
}

.merkez-nav .nav-link:hover { background: var(--merkez-sidebar-hover-bg); color: var(--merkez-sidebar-hover-fg); }
.merkez-nav .nav-link.active { background: var(--merkez-sidebar-active-bg); color: var(--merkez-sidebar-active-fg); border-left-color: var(--merkez-primary); }

/* ── Kenar çubuğu alt bilgisi + tema seçici (LOYALTY'deki tema-pills) ──── */
.merkez-nav-footer { border-top: 1px solid var(--merkez-sidebar-border); padding: .9rem 1.1rem 1rem; flex-shrink: 0; }

.tema-baslik {
    font-size: .65rem; font-weight: 700; letter-spacing: .06em;
    text-transform: uppercase; color: var(--merkez-sidebar-faint); margin-bottom: 6px;
}
.tema-pills { display: flex; gap: 4px; margin-bottom: 10px; }
.tema-pill {
    flex: 1; display: flex; align-items: center; justify-content: center;
    height: 30px; border: 1px solid var(--merkez-sidebar-border); border-radius: 6px;
    background: transparent; color: var(--merkez-sidebar-muted); font-size: .8rem;
    cursor: pointer; transition: background .15s, color .15s, border-color .15s;
}
.tema-pill:hover { background: var(--merkez-sidebar-hover-bg); color: var(--merkez-sidebar-hover-fg); }
.tema-pill.aktif { background: var(--merkez-primary); border-color: var(--merkez-primary); color: #fff; }

.merkez-powered { display: flex; flex-direction: column; align-items: center; gap: 1px; margin-top: 8px; }
.merkez-powered-brand { font-size: .8rem; font-weight: 700; color: var(--merkez-sidebar-muted); letter-spacing: .08em; }
.merkez-powered-label { font-size: .6rem; font-weight: 600; color: var(--merkez-sidebar-faint); letter-spacing: .03em; }

/* ── Ana alan / üst çubuk ─────────────────────────────────────────────── */
.merkez-main { margin-left: var(--merkez-sidebar-w); flex: 1; display: flex; flex-direction: column; min-width: 0; background: var(--merkez-bg); }

/* -- UST CUBUK (27.08.2026'da yeniden duzenlendi) ------------------------
   ESKI HATA: hizalama `.merkez-topbar span:first-child { margin-right:auto }`
   ile yapiliyordu. Menu ac/kapat DUGMESI eklenince baslik artik ilk cocuk
   olmaktan cikti, secici HICBIR SEYE uymadi ve butun ogeler saga yigildi.
   Artik hizalama konuma degil SINIFA bagli: baslik solda, geri kalani sag
   grupta. Cubuk ayrica STICKY -- uzun listelerde cikis/rol hep gorunur. */
.merkez-topbar {
    display: flex; align-items: center; gap: .75rem;
    padding: .55rem 1.25rem;
    background: var(--merkez-topbar-bg);
    border-bottom: 1px solid var(--merkez-topbar-bd);
    min-height: 56px;
    position: sticky; top: 0; z-index: 30;
    transition: background .2s, border-color .2s;
}

.merkez-topbar-baslik {
    margin-right: auto;
    display: flex; align-items: center; gap: .5rem;
    font-weight: 600; color: var(--merkez-primary);
    min-width: 0;
}
.merkez-topbar-baslik .baslik-metin {
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.merkez-topbar-sag { display: flex; align-items: center; gap: .6rem; flex-shrink: 0; }
.merkez-topbar-sag form { margin: 0; }
.merkez-topbar-kullanici { color: var(--merkez-text-muted); font-size: .82rem; }

@media (max-width: 767.98px) {
    .merkez-topbar { padding: .5rem .75rem; gap: .5rem; }
    .merkez-topbar-baslik .baslik-metin { display: none; }
    .merkez-topbar-kullanici { display: none; }
    .merkez-topbar-sag .cikis-metin { display: none; }
}

.merkez-content { padding: 1.25rem; flex: 1; }

/* -- Menu ac/kapat dugmesi -----------------------------------------------
   Artik HER EKRANDA gorunur (eskiden yalniz <=991px). Masaustunde menuyu
   dar raya indirir, mobilde cekmeceyi acar. */
.merkez-sidebar-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    width: 34px; height: 34px; flex-shrink: 0;
}

/* -- DAR (RAY) MOD -- yalniz masaustu ------------------------------------
   Tercih <html data-menu="dar"> ile tasinir (localStorage). Mobilde anlamsiz:
   orada menu zaten cekmece, o yuzden kurallar min-width: 992px icinde. */
@media (min-width: 992px) {
    html[data-menu="dar"] .merkez-nav {
        width: var(--merkez-sidebar-w-dar);
        min-width: var(--merkez-sidebar-w-dar);
        overflow-x: hidden;
    }
    html[data-menu="dar"] .merkez-main { margin-left: var(--merkez-sidebar-w-dar); }

    /* Metinler gizlenir, simgeler ortalanir. Ad `title` ile tooltip olarak kalir. */
    html[data-menu="dar"] .merkez-nav .nav-metin,
    html[data-menu="dar"] .merkez-nav-brand .marka-metin,
    html[data-menu="dar"] .tema-baslik,
    html[data-menu="dar"] .merkez-powered { display: none; }

    html[data-menu="dar"] .merkez-nav .nav-link {
        padding: .55rem 0;
        text-align: center;
        border-left-width: 2px;
    }
    html[data-menu="dar"] .merkez-nav .nav-link i { margin-right: 0 !important; font-size: 1.05rem; }
    html[data-menu="dar"] .merkez-nav-brand { padding: 1rem 0; text-align: center; }

    /* Bolum basliklari metin olarak sigmaz -- yerine ince bir ayirici cizgi. */
    html[data-menu="dar"] .merkez-nav-section { font-size: 0; padding: .45rem .9rem; }
    html[data-menu="dar"] .merkez-nav-section::after {
        content: ""; display: block; height: 1px; background: var(--merkez-sidebar-border);
    }

    /* Grup basliklari raya inince simgeye duser; akordiyon KAPANMAZ.
       64 px'lik rayda acip kapatmak anlamsiz -- kullanici simgeleri dogrudan
       gormeli, yoksa menu ise yaramaz bir simge sutununa doner. */
    html[data-menu="dar"] .merkez-nav-grup-baslik {
        justify-content: center; padding: .45rem 0; font-size: 0; gap: 0;
    }
    html[data-menu="dar"] .merkez-nav-grup-baslik > i:first-child { font-size: 1rem; }
    html[data-menu="dar"] .grup-ok { display: none; }
    html[data-menu="dar"] .merkez-nav-grup-govde { display: block !important; }
    html[data-menu="dar"] .merkez-nav-grup-govde .nav-link { padding-left: 0; }

    html[data-menu="dar"] .merkez-nav-footer { padding: .75rem .5rem; }
    html[data-menu="dar"] .tema-pills { flex-direction: column; gap: 4px; margin-bottom: 0; }

    /* Ortu masaustunde ASLA cikmaz: ayni dugme her iki modu da tetikledigi icin
       _sidebarAcik masaustunde de degisiyor; gorsel karsiligi olmamali. */
    .merkez-sidebar-overlay { display: none !important; }
}

@media (max-width: 991.98px) {
    .merkez-nav {
        transform: translateX(-100%);
        transition: transform .25s ease;
        z-index: 1050;
    }
    .merkez-nav.open { transform: translateX(0); }
    .merkez-main { margin-left: 0; }
}


.merkez-sidebar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 1040;
}
.merkez-sidebar-overlay.show { display: block; }

/* ── Kart / tablo yüzeyleri (tanım ekranları dahil) — dark mod token'ı ── */
.tanim-panel,
.stat-card,
.table-card {
    background: var(--merkez-card-bg) !important;
    border-color: var(--merkez-card-border) !important;
    transition: background .2s, border-color .2s;
}

.tanim-panel-baslik { border-bottom-color: var(--merkez-th-border) !important; color: var(--merkez-text-muted); }
.tanim-satir:hover > td { background: var(--merkez-row-hover) !important; }
.tanim-satir.secili > td { background: var(--merkez-row-selected) !important; box-shadow: inset 2px 0 0 var(--merkez-primary); }

.table thead th,
.tanim-panel thead th {
    color: var(--merkez-th-color) !important;
    background: var(--merkez-th-bg) !important;
    border-bottom-color: var(--merkez-th-border) !important;
}

[data-bs-theme="dark"] .text-muted { color: var(--merkez-text-muted) !important; }
[data-bs-theme="dark"] .bg-white,
[data-bs-theme="dark"] .bg-light { background-color: var(--merkez-card-bg) !important; }
[data-bs-theme="dark"] .border,
[data-bs-theme="dark"] .border-top,
[data-bs-theme="dark"] .border-bottom,
[data-bs-theme="dark"] .border-start,
[data-bs-theme="dark"] .border-end { border-color: var(--merkez-card-border) !important; }

/* ── Bağlantı/hata bildirim çubuğu ───────────────────────────────────── */
#blazor-error-ui {
    display: none;
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 1080;
    background: #fef3c7;
    border-top: 2px solid #f59e0b;
    color: #78350f;
    padding: 12px 48px 12px 18px;
    box-shadow: 0 -2px 10px rgba(0,0,0,.12);
    font-size: .9rem;
    align-items: center;
    gap: 10px;
}
#blazor-error-ui[style*="display: block"],
#blazor-error-ui[style*="display:block"] { display: flex !important; }
#blazor-error-ui .reload {
    background: #f59e0b; color: #fff; text-decoration: none;
    padding: 6px 14px; border-radius: 8px; font-weight: 600; white-space: nowrap;
}
#blazor-error-ui .reload:hover { background: #d97706; }
#blazor-error-ui .dismiss {
    position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
    cursor: pointer; color: #92400e; text-decoration: none; font-size: 1rem;
}

/* ═══════════════════════════════════════════════════════════════════════
   19.08.2026 — KOYU TEMA GENEL DÜZELTMESİ  (kullanıcı isteği)

   SORUN: Sayfaların çoğu kendi <style> bloğunda kart/panel/buton zeminini
   SABİT açık renkle (#fff, #f8fafc) veriyordu. Koyu temada gövde koyulaşıp
   metin --merkez-text ile AÇIK renge dönünce bu yüzeyler beyaz kalıyor,
   açık gri metin beyaz zemine düşüp OKUNMUYORDU. En belirgin yeri "Detay"
   butonlarının açtığı .modal-box popup'lardı (14 sayfada aynı kural).

   ÇÖZÜM: Sayfa <style> blokları app.css'ten SONRA yüklendiği için aynı
   özgüllükteki bir kural kazanamaz. Bu yüzden buradaki kurallar
   [data-bs-theme="dark"] ile öneklendi — özgüllük 0,2,0 > 0,1,0 olduğu
   için sıra fark etmeksizin sayfa kuralını EZER. Böylece 20+ sayfayı tek
   tek düzenlemeye gerek kalmadı ve açık tema hiç etkilenmedi.

   KAPSAM DIŞI (bilerek): .pre-screen/.pre-bar/.pre-card/.cs-prev-card ve
   .cs-sw-dot — bunlar telefon önizleme maketi ve anahtar topuzu; müşterinin
   telefonunu simüle ettikleri için koyu temada da AÇIK kalmaları doğru.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Kart / panel yüzeyleri ── */
[data-bs-theme="dark"] .al-card,
[data-bs-theme="dark"] .an-card,
[data-bs-theme="dark"] .bd-card,
[data-bs-theme="dark"] .bd-kpi,
[data-bs-theme="dark"] .cs-rule,
[data-bs-theme="dark"] .cs-sug,
[data-bs-theme="dark"] .cs-perf,
[data-bs-theme="dark"] .dy-card,
[data-bs-theme="dark"] .tm-card,
[data-bs-theme="dark"] .s-card,
[data-bs-theme="dark"] .sa-card,
[data-bs-theme="dark"] .od-card,
[data-bs-theme="dark"] .oo-card,
[data-bs-theme="dark"] .pi-card,
[data-bs-theme="dark"] .pr-card,
[data-bs-theme="dark"] .kmp-card,
[data-bs-theme="dark"] .metric-card,
[data-bs-theme="dark"] .stat,
[data-bs-theme="dark"] .login-card,
[data-bs-theme="dark"] .basvuru-card,
[data-bs-theme="dark"] .modal-box,
[data-bs-theme="dark"] .modal-box-genis,
[data-bs-theme="dark"] .tanim-panel,
[data-bs-theme="dark"] .tanim-sekme button.aktif,
[data-bs-theme="dark"] .galeri-kutu,
[data-bs-theme="dark"] .logo-onizleme-kutu,
[data-bs-theme="dark"] .urun-sonuc-liste {
    background: var(--merkez-card-bg) !important;
    color: var(--merkez-text);
    border-color: var(--merkez-card-border);
}

/* ── İkon / çip / segment butonları ── */
[data-bs-theme="dark"] .ic-btn,
[data-bs-theme="dark"] .cs-ic-btn,
[data-bs-theme="dark"] .cs-chipbtn,
[data-bs-theme="dark"] .chipbtn,
[data-bs-theme="dark"] .cs-seg-b,
[data-bs-theme="dark"] .f-sort-btn {
    background: var(--merkez-input-bg) !important;
    color: var(--merkez-text);
    border-color: var(--merkez-card-border);
}

/* ── Kart içi soluk şeritler / satırlar (açık temada #f8fafc idi) ── */
[data-bs-theme="dark"] .al-ikon,
[data-bs-theme="dark"] .cs-flow,
[data-bs-theme="dark"] .cs-offrow,
[data-bs-theme="dark"] .kad-row {
    background: var(--merkez-th-bg) !important;
    color: var(--merkez-text);
    border-color: var(--merkez-card-border);
}

/* ── Tablo başlıkları ── */
[data-bs-theme="dark"] .kamp-table th,
[data-bs-theme="dark"] .liste-scroll thead th,
[data-bs-theme="dark"] .tanim-panel thead th {
    background: var(--merkez-th-bg) !important;
    color: var(--merkez-th-color) !important;
    border-color: var(--merkez-th-border);
}

/* ── Yönetim Bilgi Sistemi / SuperBoss rapor aktarımı (10.09.2026) ───── */
.ybs-dashboard,.ybs-catalog,.ybs-report-page{max-width:1500px;margin:0 auto;color:var(--merkez-text)}
.ybs-hero,.ybs-catalog-hero{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 32px;margin-bottom:20px;border-radius:20px;color:#fff;background:radial-gradient(circle at 78% 20%,rgba(248,113,113,.30),transparent 28%),linear-gradient(125deg,#111827 0%,#30151a 62%,#7f1d1d 130%);box-shadow:0 18px 50px rgba(15,23,42,.18)}
.ybs-hero:after,.ybs-catalog-hero:after{content:"";position:absolute;width:230px;height:230px;right:-70px;bottom:-150px;border:36px solid rgba(255,255,255,.055);border-radius:50%}
.ybs-eyebrow{display:flex;align-items:center;gap:8px;font-size:.68rem;letter-spacing:.16em;font-weight:800;color:#fca5a5}.ybs-eyebrow span{width:20px;height:2px;background:#ef4444}
.ybs-hero h1{font-size:clamp(1.45rem,2.4vw,2.15rem);font-weight:400;margin:8px 0 5px}.ybs-hero h1 strong{font-weight:750}.ybs-hero p,.ybs-catalog-hero p{margin:0;color:#cbd5e1;font-size:.84rem}
.ybs-live{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.07);border-radius:999px;font-size:.68rem;font-weight:800;letter-spacing:.1em;z-index:1}.ybs-live span,.status-dot{width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.14)}
.ybs-loading{min-height:260px;display:flex;flex-direction:column;gap:14px;align-items:center;justify-content:center;color:var(--merkez-text-muted)}
.ybs-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}.ybs-kpi{position:relative;text-align:left;padding:18px 18px 16px;border:1px solid var(--merkez-card-border);border-radius:16px;background:var(--merkez-card-bg);color:var(--merkez-text);box-shadow:0 5px 18px var(--merkez-shadow);transition:.18s ease}.ybs-kpi:hover{transform:translateY(-2px);border-color:#fca5a5;box-shadow:0 10px 25px rgba(15,23,42,.11)}
.ybs-kpi-icon{position:absolute;right:16px;top:16px;width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#fee2e2;color:#b91c1c;font-size:1.05rem}.ybs-kpi-icon.violet{background:#ede9fe;color:#7c3aed}.ybs-kpi-icon.green{background:#dcfce7;color:#15803d}.ybs-kpi-icon.amber{background:#fef3c7;color:#b45309}
.ybs-kpi-label{display:block;font-size:.63rem;letter-spacing:.08em;font-weight:800;color:var(--merkez-text-muted);margin:3px 48px 12px 0}.ybs-kpi>strong{display:block;font-size:1.72rem;line-height:1.1;letter-spacing:-.04em}.ybs-kpi>strong em{font-size:.9rem;font-style:normal;color:var(--merkez-text-muted);font-weight:600}.ybs-kpi small{display:flex;align-items:center;gap:6px;margin-top:9px;color:var(--merkez-text-muted);font-size:.72rem}.ybs-kpi small.up{color:#16a34a}.ybs-kpi small.down{color:#dc2626}
.ybs-panel{border:1px solid var(--merkez-card-border);border-radius:17px;background:var(--merkez-card-bg);box-shadow:0 5px 18px var(--merkez-shadow);padding:20px}.ybs-grid-main{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(320px,.8fr);gap:16px;margin-bottom:16px}.ybs-grid-bottom{display:grid;grid-template-columns:1.3fr .7fr;gap:16px}.ybs-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px}.ybs-panel h2,.ybs-paket-focus h2{font-size:1rem;margin:3px 0 0;font-weight:750}.overline{font-size:.6rem;letter-spacing:.12em;font-weight:800;color:#dc2626}.ybs-panel-head button{border:0;background:transparent;color:#dc2626;font-size:.75rem;font-weight:700;padding:4px}
.ybs-chart-summary{margin:18px 0 -10px;display:flex;align-items:baseline;gap:10px}.ybs-chart-summary strong{font-size:1.45rem}.ybs-chart-summary span{font-size:.7rem;color:var(--merkez-text-muted)}.ybs-bars{height:205px;display:flex;gap:9px;align-items:flex-end;padding-top:22px}.ybs-bar-col{height:100%;flex:1;display:flex;flex-direction:column;align-items:center;min-width:0}.ybs-bar-value{height:22px;font-size:.58rem;color:var(--merkez-text-muted);white-space:nowrap}.ybs-bar-track{width:min(30px,68%);flex:1;display:flex;align-items:flex-end;background:var(--merkez-th-bg);border-radius:8px 8px 4px 4px;overflow:hidden}.ybs-bar-track i{width:100%;display:block;background:linear-gradient(180deg,#ef4444,#991b1b);border-radius:8px 8px 3px 3px;min-height:4px}.ybs-bar-col b{font-size:.65rem;color:var(--merkez-text-muted);margin-top:7px;text-transform:uppercase}
.ybs-rank-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--merkez-card-border)}.ybs-rank-row:last-child{border:0}.ybs-rank{width:25px;height:25px;display:grid;place-items:center;border-radius:8px;background:var(--merkez-th-bg);font-size:.68rem;font-weight:800}.ybs-rank.top-1{background:#fef3c7;color:#92400e}.ybs-rank.top-2{background:#e2e8f0;color:#475569}.ybs-rank.top-3{background:#ffedd5;color:#9a3412}.ybs-rank-info{flex:1;min-width:0}.ybs-rank-info b,.ybs-rank-info small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ybs-rank-info b{font-size:.78rem}.ybs-rank-info small{font-size:.65rem;color:var(--merkez-text-muted)}.ybs-rank-info i,.ybs-table-bar{display:block;height:3px;border-radius:3px;background:var(--merkez-th-bg);margin-top:5px;overflow:hidden}.ybs-rank-info i span,.ybs-table-bar i{display:block;height:100%;background:#ef4444;border-radius:3px}.ybs-rank-row>strong{font-size:.75rem}
.ybs-region-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.ybs-region-grid button{display:flex;align-items:center;gap:10px;border:1px solid var(--merkez-card-border);background:var(--merkez-th-bg);color:var(--merkez-text);border-radius:11px;padding:11px;text-align:left}.ybs-region-grid button>i{color:#dc2626}.ybs-region-grid span{flex:1}.ybs-region-grid b,.ybs-region-grid small{display:block}.ybs-region-grid b{font-size:.76rem}.ybs-region-grid small{font-size:.62rem;color:var(--merkez-text-muted)}.ybs-region-grid strong{font-size:.7rem}.ybs-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.ybs-actions button{border:1px solid var(--merkez-card-border);background:var(--merkez-th-bg);color:var(--merkez-text);border-radius:11px;padding:13px 8px;font-size:.68rem}.ybs-actions i{display:block;color:#dc2626;font-size:1rem;margin-bottom:5px}
.ybs-paket-focus{position:relative;margin-bottom:16px;padding:20px;border:1px solid rgba(239,68,68,.32);border-radius:18px;background:linear-gradient(120deg,var(--merkez-card-bg),rgba(239,68,68,.06));box-shadow:0 8px 26px rgba(127,29,29,.09);overflow:hidden}.ybs-paket-focus:after{content:"";position:absolute;right:-50px;top:-90px;width:190px;height:190px;border-radius:50%;background:rgba(239,68,68,.06)}.ybs-paket-title{display:flex;align-items:center;gap:12px;position:relative;z-index:1}.ybs-paket-icon{width:43px;height:43px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(135deg,#ef4444,#991b1b);color:#fff;font-size:1.15rem;box-shadow:0 8px 20px rgba(185,28,28,.25)}.ybs-paket-title>div{flex:1}.ybs-paket-title>div>span{font-size:.6rem;letter-spacing:.13em;font-weight:850;color:#dc2626}.ybs-paket-title>button{border:0;border-radius:10px;padding:9px 13px;background:#b91c1c;color:#fff;font-size:.72rem;font-weight:750}.ybs-paket-body{display:grid;grid-template-columns:.8fr 1.2fr;gap:18px;margin:18px 0 14px}.ybs-paket-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.ybs-paket-metrics div{padding:11px;border-radius:11px;background:var(--merkez-th-bg)}.ybs-paket-metrics span,.ybs-paket-metrics strong{display:block}.ybs-paket-metrics span{font-size:.61rem;color:var(--merkez-text-muted)}.ybs-paket-metrics strong{font-size:.95rem;margin-top:4px;white-space:nowrap}.ybs-channel-chips{display:flex;gap:7px;overflow-x:auto}.ybs-channel-chips button{min-width:145px;border:1px solid var(--merkez-card-border);border-radius:11px;background:var(--merkez-card-bg);color:var(--merkez-text);padding:9px;text-align:left}.ybs-channel-chips span,.ybs-channel-chips b,.ybs-channel-chips small{display:block}.ybs-channel-chips span{font-size:.62rem;color:var(--merkez-text-muted)}.ybs-channel-chips b{font-size:.78rem;margin:3px 0;white-space:nowrap}.ybs-channel-chips small{font-size:.59rem;color:var(--merkez-text-muted)}.empty-chip{align-self:center;color:var(--merkez-text-muted);font-size:.72rem}.ybs-paket-links{display:flex;gap:7px;border-top:1px solid var(--merkez-card-border);padding-top:12px}.ybs-paket-links button{border:0;background:transparent;color:var(--merkez-text-muted);font-size:.67rem;padding:4px 9px}.ybs-paket-links i{color:#dc2626;margin-right:5px}
.ybs-pasta-panel{position:relative;z-index:1;border:1px solid var(--merkez-card-border);border-radius:14px;background:var(--merkez-card-bg);padding:12px 14px;min-width:0}.ybs-pasta-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.ybs-pasta-head>div span,.ybs-pasta-head>div b{display:block}.ybs-pasta-head>div span{font-size:.57rem;letter-spacing:.1em;font-weight:850;color:#dc2626}.ybs-pasta-head>div b{font-size:.76rem;margin-top:2px}.ybs-pasta-head>button{border:1px solid var(--merkez-card-border);border-radius:8px;background:var(--merkez-th-bg);color:var(--merkez-text);padding:5px 8px;font-size:.62rem}.ybs-pasta-content{display:grid;grid-template-columns:190px 1fr;gap:14px;align-items:center;margin-top:7px}.ybs-pasta-canvas{height:170px;min-width:0}.ybs-pasta-legend{display:grid;grid-template-columns:1fr 1fr;gap:5px;max-height:170px;overflow:auto}.ybs-pasta-legend>button{display:flex;align-items:center;gap:7px;min-width:0;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--merkez-text);padding:7px;text-align:left}.ybs-pasta-legend>button.drill{cursor:pointer;border-color:rgba(220,38,38,.25);background:rgba(220,38,38,.05)}.ybs-pasta-legend>button>i{width:9px;height:9px;flex:0 0 9px;border-radius:50%}.ybs-pasta-legend>button>span{flex:1;min-width:0}.ybs-pasta-legend b,.ybs-pasta-legend small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ybs-pasta-legend b{font-size:.68rem}.ybs-pasta-legend small{font-size:.57rem;color:var(--merkez-text-muted);margin-top:2px}.ybs-pasta-legend em{font-size:.56rem;color:#dc2626;font-style:normal}.ybs-pasta-legend em i{margin-left:2px}.ybs-paket-focus>.ybs-channel-chips{position:relative;z-index:1;margin:-5px 0 12px;padding-bottom:3px}
.ybs-catalog-hero h1{font-size:2rem;margin:6px 0}.ybs-catalog-count{z-index:1;text-align:center;min-width:105px;padding:14px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.07);border-radius:14px}.ybs-catalog-count strong,.ybs-catalog-count span{display:block}.ybs-catalog-count strong{font-size:1.8rem}.ybs-catalog-count span{font-size:.62rem;color:#cbd5e1}.ybs-catalog-section{margin:22px 0}.ybs-section-title{display:flex;align-items:center;gap:12px;margin-bottom:10px}.ybs-section-title span{font-size:.64rem;font-weight:850;letter-spacing:.1em;color:var(--merkez-text-muted)}.ybs-section-title i{height:1px;background:var(--merkez-card-border);flex:1}.ybs-report-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.ybs-report-card{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid var(--merkez-card-border);background:var(--merkez-card-bg);color:var(--merkez-text);border-radius:14px;padding:14px;transition:.18s}.ybs-report-card:hover{transform:translateY(-2px);border-color:#fca5a5;box-shadow:0 8px 22px var(--merkez-shadow)}.ybs-report-icon{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border-radius:12px;font-size:1rem}.ybs-report-icon.red{background:#fee2e2;color:#b91c1c}.ybs-report-icon.blue{background:#dbeafe;color:#1d4ed8}.ybs-report-icon.violet{background:#ede9fe;color:#7c3aed}.ybs-report-icon.green{background:#dcfce7;color:#15803d}.ybs-report-icon.amber{background:#fef3c7;color:#b45309}.ybs-report-copy{flex:1;min-width:0}.ybs-report-copy b,.ybs-report-copy small{display:block}.ybs-report-copy b{font-size:.8rem}.ybs-report-copy small{font-size:.64rem;color:var(--merkez-text-muted);margin-top:3px;line-height:1.35}.ybs-report-go{font-size:.75rem;color:var(--merkez-text-muted)}.ybs-coming{display:flex;gap:14px;align-items:center;padding:16px;border:1px dashed var(--merkez-card-border);border-radius:14px;color:var(--merkez-text-muted)}.ybs-coming>i{font-size:1.4rem;color:#16a34a}.ybs-coming b,.ybs-coming span{display:block}.ybs-coming b{font-size:.78rem;color:var(--merkez-text)}.ybs-coming span{font-size:.68rem;margin-top:3px}
.ybs-back{border:0;background:transparent;color:var(--merkez-text-muted);font-size:.72rem;padding:3px 0;margin-bottom:14px}.ybs-report-header{display:flex;align-items:center;gap:14px;margin-bottom:18px}.ybs-report-header>div:last-child>span{font-size:.59rem;letter-spacing:.12em;font-weight:850;color:#dc2626}.ybs-report-header h1{font-size:1.55rem;margin:2px 0}.ybs-report-header p{font-size:.74rem;color:var(--merkez-text-muted);margin:0}.ybs-filterbar{display:flex;align-items:flex-end;gap:10px;padding:14px;margin-bottom:14px;border-radius:14px;background:var(--merkez-card-bg);border:1px solid var(--merkez-card-border)}.ybs-filterbar label span{display:block;font-size:.61rem;color:var(--merkez-text-muted);font-weight:700;margin-bottom:4px}.ybs-filterbar input{border:1px solid var(--merkez-card-border);background:var(--merkez-input-bg);color:var(--merkez-text);border-radius:8px;padding:7px 9px;font-size:.73rem}.ybs-filterbar button{border:0;border-radius:8px;background:#b91c1c;color:#fff;padding:8px 13px;font-size:.72rem;font-weight:700}.ybs-report-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:14px}.ybs-report-kpis div{padding:13px 15px;border:1px solid var(--merkez-card-border);border-radius:12px;background:var(--merkez-card-bg)}.ybs-report-kpis span,.ybs-report-kpis strong{display:block}.ybs-report-kpis span{font-size:.61rem;color:var(--merkez-text-muted)}.ybs-report-kpis strong{font-size:1.05rem;margin-top:4px}.ybs-table-panel{padding:0;overflow:hidden}.ybs-table{width:100%;border-collapse:collapse}.ybs-table th{padding:11px 13px;background:var(--merkez-th-bg);color:var(--merkez-th-color);font-size:.62rem;text-transform:uppercase;letter-spacing:.06em}.ybs-table td{padding:10px 13px;border-top:1px solid var(--merkez-card-border);font-size:.73rem}.ybs-table td b,.ybs-table td small{display:block}.ybs-table td small{font-size:.61rem;color:var(--merkez-text-muted);margin-top:2px}.ybs-row-no{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:var(--merkez-th-bg);font-size:.62rem;font-weight:800}.ybs-empty{min-height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:var(--merkez-text-muted);font-size:.72rem}.ybs-empty>i{font-size:1.5rem}.ybs-empty b{color:var(--merkez-text)}
[data-bs-theme="dark"] .ybs-kpi-icon.red,[data-bs-theme="dark"] .ybs-report-icon.red{background:rgba(239,68,68,.16)}[data-bs-theme="dark"] .ybs-report-icon.blue{background:rgba(59,130,246,.16)}[data-bs-theme="dark"] .ybs-report-icon.violet,[data-bs-theme="dark"] .ybs-kpi-icon.violet{background:rgba(139,92,246,.16)}[data-bs-theme="dark"] .ybs-report-icon.green,[data-bs-theme="dark"] .ybs-kpi-icon.green{background:rgba(34,197,94,.16)}[data-bs-theme="dark"] .ybs-report-icon.amber,[data-bs-theme="dark"] .ybs-kpi-icon.amber{background:rgba(245,158,11,.16)}
@media(max-width:1100px){.ybs-kpis{grid-template-columns:1fr 1fr}.ybs-grid-main,.ybs-grid-bottom{grid-template-columns:1fr}.ybs-report-grid{grid-template-columns:1fr 1fr}.ybs-paket-body{grid-template-columns:1fr}}
@media(max-width:650px){.ybs-hero,.ybs-catalog-hero{padding:22px 18px}.ybs-live{display:none}.ybs-kpis,.ybs-report-kpis,.ybs-report-grid{grid-template-columns:1fr}.ybs-region-grid{grid-template-columns:1fr}.ybs-filterbar{flex-wrap:wrap}.ybs-filterbar label{flex:1}.ybs-paket-metrics{grid-template-columns:1fr 1fr}.ybs-paket-links{overflow-x:auto}.ybs-paket-title>button{font-size:0}.ybs-paket-title>button i{font-size:.8rem}.ybs-bars{gap:3px}.ybs-bar-value{display:none}}
@media(max-width:650px){.ybs-pasta-content{grid-template-columns:1fr}.ybs-pasta-canvas{height:190px}.ybs-pasta-legend{max-height:none}.ybs-pasta-legend>button{padding:6px}.ybs-paket-focus{padding:15px}}
/* ========================================================================
   Yönetim raporları — teslimat ısı haritası ve coğrafi satış analizi
   ======================================================================== */
.cgr-page{display:grid;gap:1rem;padding-bottom:2rem}.cgr-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.cgr-head h1{font-size:1.65rem;font-weight:800;margin:.15rem 0}.cgr-head p{color:var(--bs-secondary-color);margin:0}.cgr-eyebrow{font-size:.69rem;font-weight:800;letter-spacing:.14em;color:#dc2626}.cgr-filter{display:flex;align-items:end;gap:.65rem;flex-wrap:wrap;padding:.85rem;background:var(--bs-tertiary-bg);border:1px solid var(--bs-border-color);border-radius:14px}.cgr-filter label{display:grid;gap:.25rem;min-width:145px;font-size:.72rem;font-weight:700;color:var(--bs-secondary-color)}.cgr-filter label:nth-child(3){min-width:220px}.cgr-query{height:31px;min-width:108px}.cgr-loading{padding:3rem;text-align:center;color:var(--bs-secondary-color)}.cgr-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}.cgr-kpis article{position:relative;display:grid;gap:.2rem;padding:1rem 1rem 1rem 3.2rem;border:1px solid var(--bs-border-color);border-radius:14px;background:var(--bs-body-bg);box-shadow:0 5px 18px rgba(15,23,42,.05)}.cgr-kpis article>i{position:absolute;left:1rem;top:1.05rem;width:1.65rem;height:1.65rem;display:grid;place-items:center;border-radius:8px;color:#fff;background:linear-gradient(135deg,#ef4444,#b91c1c)}.cgr-kpis span{font-size:.72rem;color:var(--bs-secondary-color);font-weight:700}.cgr-kpis strong{font-size:1.25rem}.cgr-panel{border:1px solid var(--bs-border-color);border-radius:15px;background:var(--bs-body-bg);overflow:hidden}.cgr-panel-title{display:flex;align-items:center;justify-content:space-between;padding:.85rem 1rem;border-bottom:1px solid var(--bs-border-color)}.cgr-panel-title h2{font-size:.95rem;font-weight:800;margin:0}.cgr-panel-title small{display:block;color:var(--bs-secondary-color);font-size:.7rem;margin-top:.15rem}.cgr-panel-title>span{font-size:.72rem;font-weight:700;color:var(--bs-secondary-color);background:var(--bs-tertiary-bg);padding:.25rem .55rem;border-radius:999px}.cgr-map-wrap{position:relative}.cgr-map{height:460px;width:100%;background:var(--bs-tertiary-bg)}.cgr-map-panel .leaflet-container{font-family:inherit}.cgr-map-panel .leaflet-control-attribution{font-size:9px}.cgr-map-wrap>.cgr-map.yok{display:none}.cgr-map-wrap .cgr-map{z-index:1}.cgr-map-wrap .cgr-map+*{z-index:2}.cgr-map-wrap{min-height:300px}.cgr-map-wrap .cgr-map{min-height:300px}.cgr-map-wrap>.cgr-map:not(:empty){display:block}.cgr-map-wrap .cgr-map{position:relative}.cgr-map-wrap .cgr-map~.cgr-map-warning,.cgr-map-wrap .cgr-map~.cgr-empty{position:absolute;inset:0}.cgr-map-warning,.cgr-map-wrap .cgr-empty{display:grid;place-items:center;color:var(--bs-secondary-color);background:var(--bs-tertiary-bg)}.cgr-map-wrap .cgr-map~.cgr-map-warning{position:absolute;inset:0}.cgr-map-wrap .cgr-map~.cgr-map-warning,.cgr-map-wrap .cgr-map~.cgr-map-empty{display:grid;place-items:center;color:var(--bs-secondary-color);background:var(--bs-tertiary-bg)}.mcm-popup{display:grid;gap:.18rem;min-width:150px}.mcm-popup strong{font-size:.82rem}.mcm-popup span{font-size:.68rem;color:#64748b}.mcm-popup b{font-size:.72rem;color:#b91c1c}.cgr-table{font-size:.78rem;margin:0}.cgr-table thead th{white-space:nowrap;padding:.65rem 1rem;font-size:.66rem;text-transform:uppercase;letter-spacing:.04em;color:var(--bs-secondary-color);background:var(--bs-tertiary-bg)}.cgr-table tbody td{padding:.65rem 1rem}.cgr-table td strong{display:block}.cgr-table td small{display:block;color:var(--bs-secondary-color);font-size:.67rem}.cgr-empty{text-align:center!important;padding:2.5rem!important;color:var(--bs-secondary-color)}
@media(max-width:900px){.cgr-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.cgr-map{height:380px}}
@media(max-width:600px){.cgr-head{align-items:stretch;flex-direction:column}.cgr-filter{display:grid;grid-template-columns:1fr 1fr}.cgr-filter label,.cgr-filter label:nth-child(3){min-width:0}.cgr-filter label:nth-child(3),.cgr-query{grid-column:1/-1}.cgr-kpis{grid-template-columns:1fr 1fr}.cgr-kpis article{padding:.8rem .7rem .8rem 2.7rem}.cgr-kpis article>i{left:.7rem;top:.85rem}.cgr-kpis strong{font-size:1rem}.cgr-map{height:330px}}
