:root {
    /* ── Marka renkleri (değişmez) ── */
    --fanpo-green:  #04974a;   /* Tablo link hover */
    --brand:        #16a34a;   /* Ana yeşil — oluştur / kaydet / onayla */
    --brand-hover:  #15803d;
    --brand-soft:   #dcfce7;
    --brand-ink:    #14532d;   /* Koyu metin versiyonu */

    --navy:         #1c3557;   /* Lacivert — görüntüle / git / ikincil önemli */
    --navy-hover:   #152844;
    --navy-soft:    #dbeafe;
    --navy-ink:     #1c3557;

    /* ── Semantik durum renkleri ── */
    --c-success:    #059669;   /* = brand */
    --c-success-bg: #d1fae5;
    --c-success-bd: #6ee7b7;
    --c-success-tx: #065f46;

    --c-info:       #2563eb;   /* Bilgi / belge / PDF */
    --c-info-bg:    #dbeafe;
    --c-info-bd:    #93c5fd;
    --c-info-tx:    #1e40af;

    --c-warn:       #d97706;   /* Uyarı / dönüştür / bekliyor */
    --c-warn-bg:    #fef3c7;
    --c-warn-bd:    #fcd34d;
    --c-warn-tx:    #92400e;

    --c-danger:     #dc2626;   /* Sil / iptal / yıkıcı */
    --c-danger-bg:  #fee2e2;
    --c-danger-bd:  #fca5a5;
    --c-danger-tx:  #991b1b;

    /* ── Yüzey & metin ── */
    --bg:       #f2f2f7;
    --surface:  #ffffff;
    --soft:     #f8fafc;
    --line:     #e2e8f0;
    --line-med: #cbd5e1;
    --text:     #0f172a;
    --muted:    #64748b;

    /* ── Mobil tipografi skalası ── */
    --mt-hero:   22px;   /* sayfa başlığı */
    --mt-title:  17px;   /* kart başlığı */
    --mt-body:   15px;   /* standart gövde */
    --mt-meta:   13px;   /* açıklama / metaveri */
    --mt-label:  11px;   /* etiket / ikincil meta (uppercase, tracked) */
    --mt-tiny:   11px;   /* badge / yardımcı */
    --mt-amount: 20px;   /* para / tutar */
    --mt-btn:    15px;   /* buton yazısı */

    /* ── Mobil buton yükseklikleri ── */
    --btn-h-lg:  52px;   /* ana işlem butonu */
    --btn-h-md:  48px;   /* standart buton / minimum dokunma alanı */
    --btn-h-sm:  36px;   /* chip / küçük aksiyon */

    /* ── Mobil boşluklar ── */
    --gap-page:  16px;   /* sayfa kenar boşluğu */
    --gap-card:  10px;   /* kartlar arası */
    --gap-inner: 12px;   /* kart iç padding */
    --radius-card: 13px; /* kart köşe */
    --radius-btn:  12px; /* buton köşe */
    --radius-chip: 20px; /* chip/pill köşe */

    /* ── Gölgeler ── */
    --shadow-card: 0 1px 3px rgba(0,0,0,.06);
    --shadow-fab:  0 4px 16px rgba(0,0,0,.18);
    --shadow-panel: 0 1px 4px rgba(0,0,0,.07);

    /* ── Masaüstü tablo ── */
    --dt-row-h:  44px;
    --dt-hover:  #f8fafc;
    --dt-active-border: 3px solid var(--navy);

    /* ── Geriye uyumluluk takma adları (eski kodu kırmamak için) ── */
    --green:        var(--brand);
    --green-ink:    var(--brand-ink);
    --green-soft:   var(--brand-soft);
    --navy-dark:    var(--navy-hover);
    --blue-soft:    var(--c-info-bg);
    --amber-soft:   var(--c-warn-bg);
    --rose-soft:    var(--c-danger-bg);
}

* { box-sizing: border-box; }
body {
    margin: 0;
    height: 100vh;
    overflow: hidden;
    display: grid;
    grid-template-columns: 242px minmax(0, 1fr);
    background: var(--bg);
    color: var(--text);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    font-size: 14px;
    line-height: 1.5;
}
body.embed-mode { grid-template-columns: 0 1fr; }
body.embed-mode .sidebar { display: none; }
body.embed-mode .topbar { display: none; }
body.embed-mode .main { padding-top: 0; }
body.bare-mode { display: block; height: auto; overflow: auto; }
body.bare-mode .sidebar { display: none; }
body.bare-mode .topbar { display: none; }
body.bare-mode .main { height: auto; overflow: visible; }
body.bare-mode .page-body { overflow: visible; height: auto; }
/* UF modal içinde offer özet paneli: modal yüksekliğini aşmasın, kendi içinde scroll etsin */
#uf-content .sticky-summary {
    position: sticky;
    top: 0;
    max-height: calc(92vh - 54px);
    overflow-y: auto;
}
.sidebar {
    background: #1c3557;
    color: white;
    padding: 14px 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 100vh;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.15) transparent;
}
.brand { display: flex; gap: 10px; align-items: center; }
.brand-mark {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    background: var(--green);
    border-radius: 8px;
    font-weight: 800;
}
.brand span, .sidebar-footer span { display: block; opacity: .72; font-size: 12px; margin-top: 3px; }
.quick-search {
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(255,255,255,.08);
    border-radius: 7px;
    padding: 9px 10px;
    color: rgba(255,255,255,.78);
    font-size: 12px;
}
nav { display: grid; gap: 4px; }
.erp-nav { gap: 10px; }
.nav-group {
    display: grid;
    gap: 1px;
    padding: 6px 0 8px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}
.nav-group:last-child { border-bottom: none; }
.nav-title {
    display: block;
    padding: 0 8px 5px;
    color: rgba(255,255,255,.38);
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .6px;
}
nav a {
    color: rgba(255,255,255,.78);
    text-decoration: none;
    padding: 6px 9px;
    border-radius: 6px;
    font-size: 12.5px;
    line-height: 1.3;
    transition: background .12s;
}
nav a:hover { background: rgba(255,255,255,.13); color: white; }
nav a.active {
    background: var(--brand);
    color: #fff;
    font-weight: 700;
}
/* Sidebar asistan özeti */
.sidebar-ast-summary {
    display: flex; align-items: center; gap: 10px;
    margin: 8px 12px; padding: 10px 12px;
    background: rgba(255,255,255,.08); border-radius: 10px;
    text-decoration: none; border: 1px solid rgba(255,255,255,.12);
}
.sas-score { font-size: 22px; font-weight: 900; flex-shrink: 0; }
.sas-score small { font-size: 11px; opacity: .7; }
.sas-alerts { display: flex; flex-direction: column; gap: 3px; }
.sas-pill { font-size: 11px; font-weight: 600; }
.sas-pill--red    { color: #fca5a5; }
.sas-pill--yellow { color: #fcd34d; }
.sas-pill--green  { color: #86efac; }

.sidebar-footer {
    margin-top: auto;
    padding: 12px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 8px;
    background: rgba(255,255,255,.07);
}
.main { padding: 0; overflow: hidden; height: 100vh; display: flex; flex-direction: column; }
.topbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 0;
    padding: 18px 22px 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
    flex-shrink: 0;
    background: var(--bg);
}
.page-body {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 16px 22px 24px;
    scrollbar-gutter: stable;
}

/* Liste sayfaları: sabit header + kaydırılabilir tablo */
.page-body:has(.list-page-layout) {
    padding: 0 22px 0;
}
.list-page-layout {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}
.list-page-header {
    flex-shrink: 0;
    padding-bottom: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.list-stat-row {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 10px 0 6px;
    border-bottom: 1px solid var(--line);
}
.list-stat { font-size: 13px; color: var(--muted); white-space: nowrap; }
.list-stat strong { color: var(--text); font-weight: 700; margin-right: 2px; }
.list-stat.warn strong { color: var(--c-warn); }
.list-filter-bar {
    display: flex;
    flex-wrap: nowrap;
    gap: 6px;
    align-items: center;
    padding: 8px 0 6px;
}
.list-filter-bar input[type=search],
.list-filter-bar input[type=date],
.list-filter-bar select {
    height: 32px;
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 0 9px;
    font-size: 13px;
    background: var(--surface);
    color: var(--text);
    white-space: nowrap;
}
.list-filter-bar select { padding-right: 24px; }
.list-page-table {
    flex: 1;
    min-height: 0;
    overflow: hidden;
}
.list-page-table .table-wrap {
    height: 100%;
    overflow-y: auto;
    overflow-x: auto;
}
.page-title {
    margin: 0;
    color: var(--navy-dark);
    font-size: 19px;
    font-weight: 800;
    letter-spacing: -.2px;
}
.topbar-user {
    font-size: 13px;
    color: var(--muted);
    font-weight: 600;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    line-height: 1.2;
}
.topbar-user:hover { color: var(--text); }
.topbar-role {
    font-size: 10px;
    font-weight: 500;
    color: var(--green);
    letter-spacing: .2px;
}
.eyebrow, .mini-label {
    margin: 0 0 5px;
    color: var(--green-ink);
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0;
}
h1 { margin: 0; color: var(--navy-dark); font-size: 22px; }
.page-subtitle { margin: 2px 0 0; font-size: 11px; color: var(--muted,#94a3b8); max-width: 500px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
h2 { margin: 0; color: var(--navy-dark); font-size: 17px; }
h3 { margin: 0 0 8px; color: var(--navy-dark); font-size: 14px; }
.topbar p { margin: 5px 0 0; color: var(--muted); max-width: 860px; line-height: 1.45; }
.top-actions { display: flex; align-items: center; gap: 8px; white-space: nowrap; padding-top: 2px; }
.topbar-badge { display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:4px 9px;border-radius:20px;text-decoration:none;border:1px solid transparent;transition:opacity .15s; }
.topbar-badge span { display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 4px;border-radius:9px;font-size:10px;font-weight:800; }
.topbar-badge--danger { background:var(--c-danger-bg);color:var(--c-danger-tx);border-color:var(--c-danger-bd); }
.topbar-badge--danger span { background:var(--c-danger);color:#fff; }
.topbar-badge--warn { background:var(--c-warn-bg);color:var(--c-warn-tx);border-color:var(--c-warn-bd); }
.topbar-badge--warn span { background:var(--c-warn);color:#fff; }
.topbar-badge:hover { opacity:.75; }
.topbar-search-btn { font-size:18px;color:var(--muted);text-decoration:none;line-height:1;padding:2px 4px; }
.topbar-search-btn:hover { color:var(--navy); }
.datebox, .panel, .architecture-panel, .kpi, .module-band, .alert {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 8px;
}
.datebox { padding: 9px 11px; color: var(--navy); font-weight: 700; }
.alert { padding: 12px 14px; margin-bottom: 14px; border-left: 4px solid var(--green); }
.alert.danger { border-left-color: #c0392b; }
.hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(330px, .75fr);
    gap: 14px;
    margin-bottom: 14px;
}
.architecture-panel, .panel, .module-band { padding: 15px; margin-bottom: 14px; }
.section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
}
/* status-pill: tek tanım aşağıda (satır ~706) */
.layer-stack { display: grid; gap: 8px; }
.layer-row {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 10px;
    padding: 10px;
    background: var(--soft);
    border: 1px solid var(--line);
    border-radius: 7px;
}
.layer-row span { color: var(--muted); line-height: 1.35; }
.kpi-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.kpi { padding: 13px; }
.kpi span { display: block; color: var(--muted); font-size: 12px; }
.kpi strong { display: block; color: var(--green); font-size: 28px; margin: 5px 0; }
.kpi small { color: var(--muted); }
.flow {
    display: grid;
    grid-template-columns: repeat(5, minmax(145px, 1fr));
    gap: 9px;
}
.flow-step {
    position: relative;
    min-height: 74px;
    padding: 12px;
    border: 1px solid #a9d9cb;
    background: var(--green-soft);
    border-radius: 8px;
}
.flow-step strong, .flow-step span { display: block; }
.flow-step span { color: var(--green-ink); margin-top: 5px; line-height: 1.3; }
.cross-links {
    display: grid;
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 10px;
}
.cross-links span {
    text-align: center;
    padding: 8px;
    border: 1px dashed #c9b089;
    border-radius: 7px;
    background: #fff8ed;
    color: #704411;
    font-weight: 700;
    font-size: 12px;
}
.module-band.blue { background: #f4f5ff; }
.module-band.green { background: #eefaf6; }
.module-band.amber { background: #fff8ec; }
.module-band.neutral { background: #f7f7f5; }
.module-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.module-card {
    background: white;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 12px;
    min-height: 152px;
}
.module-card ul { margin: 0; padding-left: 18px; color: var(--muted); line-height: 1.55; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.dense .panel { margin-bottom: 0; }

/* Panel (kart kutusu) */
.panel {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 14px;
    box-shadow: var(--shadow-panel);
    min-width: 0;
}
.panel > h2:first-child { margin: 0 0 12px; }

/* ── Dashboard yardımcı hücre sınıfları ── */
.cell-nowrap  { white-space: nowrap; }
.cell-nowrap-bold { white-space: nowrap; font-weight: 600; }
.cell-trunc   { max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cell-muted   { color: var(--muted); font-size: 12px; }
.panel--flex-col { display: flex; flex-direction: column; overflow: hidden; }
.panel--flex-col .dash-panel-head { flex-shrink: 0; }

/* ── Arama input genişlik ── */
.lf-search-input { flex: 1; min-width: 160px; }

/* ── Sipariş liste yardımcıları ── */
.so-dchip--danger { border-color: #fca5a5 !important; color: #dc2626 !important; }
.status-pill--sm  { font-size: 11px; padding: 3px 9px; margin-top: 3px; display: inline-block; }

/* ── Sevk dialog ── */
.sevk-method-btn { border: 2px solid var(--line, #e2e8f0); border-radius: 10px; padding: 10px 14px; text-align: center; font-size: 13px; font-weight: 600; color: #64748b; cursor: pointer; transition: border-color .15s, background .15s, color .15s; }
.sevk-method-btn--active-kargo   { border-color: var(--navy, #1e3a5f) !important; background: #eef2ff; color: var(--navy, #1e3a5f) !important; }
.sevk-method-btn--active-fabrika { border-color: #0f766e !important; background: #f0fdf4; color: #0f766e !important; }
.sevk-dlg-lbl   { font-size: 12px; font-weight: 600; color: #475569; display: block; margin-bottom: 10px; }
.sevk-dlg-inp   { margin-top: 4px; width: 100%; padding: 7px 10px; border: 1px solid var(--line, #e2e8f0); border-radius: 8px; font-size: 13px; box-sizing: border-box; font-family: inherit; }
.sevk-dlg-grid  { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 10px; }
.sevk-dlg-body  { padding: 20px 22px 0; }
.sevk-dlg-footer { display: flex; gap: 8px; justify-content: flex-end; padding: 14px 22px; border-top: 1px solid var(--line, #e2e8f0); background: #f8fafc; border-radius: 0 0 14px 14px; }
.btn--teal      { background: #0f766e; border-color: #0f766e; color: #fff; }

/* Key-value detail list inside panels */
dl.detail-list { display: grid; grid-template-columns: 160px 1fr; gap: 6px 16px; margin: 0; }
dl.detail-list dt { color: var(--muted); font-size: .8rem; font-weight: 500; padding-top: 2px; }
dl.detail-list dd { margin: 0; font-size: .9rem; color: var(--text); }

/* Tablo sarmalayıcı — yatay kaydırma */
.table-wrap {
    overflow-x: auto;
    border-radius: 10px;
    border: 1px solid var(--line);
}

/* Temel tablo */
table { width: 100%; border-collapse: collapse; background: var(--surface); }
th {
    padding: 9px 12px;
    border-bottom: 1.5px solid var(--line);
    text-align: left;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .3px;
    background: var(--soft);
    white-space: nowrap;
}
td { padding: 0 12px; height: var(--dt-row-h, 44px); border-bottom: 1px solid #f1f5f9; vertical-align: middle; }
tr:last-child td { border-bottom: none; }
tbody tr:hover td { background: var(--dt-hover, #f8fafc); }
tbody tr.active-row td:first-child { border-left: var(--dt-active-border); }
td small { display: block; color: var(--muted); font-size: 11px; margin-top: 2px; }

/* data-table: tablo için alias, ileride farklı davranmak gerekirse ayrıştırılabilir */
.data-table { width: 100%; border-collapse: collapse; background: var(--surface); }
.data-table th { padding: 9px 12px; border-bottom: 1.5px solid var(--line); text-align: left; color: var(--muted); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .3px; background: var(--soft); white-space: nowrap; }
.data-table td { padding: 0 12px; height: var(--dt-row-h, 44px); border-bottom: 1px solid #f1f5f9; vertical-align: middle; }
.data-table tr:last-child td { border-bottom: none; }
.data-table tbody tr:hover td { background: var(--dt-hover, #f8fafc); }
.data-table tbody tr.active-row td:first-child { border-left: var(--dt-active-border); }
.data-table td small { display: block; color: var(--muted); font-size: 11px; margin-top: 2px; }
.data-table td strong { color: var(--navy-dark); }
.data-table td a { text-decoration: none; color: var(--navy-dark); font-weight: 600; }
.data-table td a:hover { color: var(--fanpo-green, #04974a); }
/* ── Tablo sort başlığı ── */
.th-sort { display: inline-flex; align-items: center; gap: 4px; color: inherit; text-decoration: none; white-space: nowrap; }
.th-sort:hover { color: var(--navy); }
.th-sort .sa { font-size: 10px; opacity: .4; }
.th-sort.active .sa { opacity: 1; color: var(--navy); }

.empty-state { padding: 32px; text-align: center; color: var(--muted); font-size: 13px; }
.empty-row { padding: 24px 12px !important; text-align: center; color: var(--muted); font-size: 13px; }
.roadmap { display: grid; gap: 8px; }
.roadmap div {
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: var(--soft);
}
.roadmap strong, .roadmap span { display: block; }
.roadmap span { margin-top: 4px; color: var(--muted); line-height: 1.35; }
.actions { display: flex; gap: 8px; margin-bottom: 12px; }
.row-actions, .compact-actions { display: flex; gap: 6px; align-items: center; }
.compact-actions a, .row-actions a {
    font-size: 12px;
    font-weight: 600;
    color: var(--navy);
    text-decoration: none;
    padding: 4px 8px;
    border-radius: 6px;
    border: 1px solid var(--line);
    background: var(--surface);
    transition: background .12s;
    white-space: nowrap;
}
.compact-actions a:hover, .row-actions a:hover { background: var(--soft); border-color: #94a3b8; }
a { color: var(--green-ink); }
/*
 * ── BUTON SİSTEMİ ──────────────────────────────────────────────
 *
 * Renk → anlam eşlemesi:
 *   (varsayılan / yeşil)  Kaydet, Oluştur, Onayla, Ekle
 *   .secondary  (lacivert) Görüntüle, Git, Önemli ikincil eylem
 *   .ghost      (gri/nötr) Geri, İptal, Yardımcı link
 *   .info       (mavi)     PDF, Yazdır, İndir, Önizle
 *   .warn       (amber)    Dönüştür, Uyar, Bekliyor aksiyonu
 *   .danger     (kırmızı)  Sil, İptal Et, Yıkıcı eylem (dolu)
 *   .ghost-danger (kırmızı çerçeve) Silme onay butonu (hafif)
 * ────────────────────────────────────────────────────────────── */

.btn {
    --_bg:     var(--brand);
    --_bg-hov: var(--brand-hover);
    --_bd:     var(--brand);
    --_tx:     #fff;
    border: 1.5px solid var(--_bd);
    background: var(--_bg);
    color: var(--_tx);
    padding: 9px 16px;
    border-radius: 8px;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    line-height: 1.25;
    transition: background .13s, border-color .13s, opacity .13s;
    white-space: nowrap;
    user-select: none;
}
.btn:hover   { background: var(--_bg-hov); border-color: var(--_bg-hov); }
.btn:active  { opacity: .82; }
.btn:focus-visible { outline: 3px solid var(--_bd); outline-offset: 2px; opacity: .9; }
.btn:disabled, .btn[disabled] { opacity: .4; cursor: not-allowed; pointer-events: none; }

/* ── Boyut ── */
.btn.compact { padding: 5px 11px; font-size: 12px; border-radius: 7px; }
.btn.lg      { padding: 12px 22px; font-size: 14px; border-radius: 9px; }
.btn.full    { width: 100%; }

/* ── Renk varyantları ── */

/* Lacivert: Görüntüle / Git / Önemli ikincil eylem */
.btn.secondary {
    --_bg:     var(--navy);
    --_bg-hov: var(--navy-hover);
    --_bd:     var(--navy);
    --_tx:     #fff;
}

/* Gri: İptal / Geri / Yardımcı */
.btn.ghost {
    --_bg:     transparent;
    --_bg-hov: var(--soft);
    --_bd:     var(--line-med);
    --_tx:     var(--text);
}
.btn.ghost:hover { border-color: var(--muted); }

/* Mavi: PDF / İndir / Yazdır / Önizle */
.btn.info {
    --_bg:     var(--c-info-bg);
    --_bg-hov: #bfdbfe;
    --_bd:     var(--c-info-bd);
    --_tx:     var(--c-info-tx);
}

/* Amber: Dönüştür / Bekliyor aksiyonu */
.btn.warn {
    --_bg:     var(--c-warn);
    --_bg-hov: #b45309;
    --_bd:     var(--c-warn);
    --_tx:     #fff;
}

/* Kırmızı dolu: Sil / İptal Et */
.btn.danger {
    --_bg:     var(--c-danger);
    --_bg-hov: #b91c1c;
    --_bd:     var(--c-danger);
    --_tx:     #fff;
}

/* Kırmızı çerçeveli: hafif silme onay butonu */
.btn.ghost-danger {
    --_bg:     var(--c-danger-bg);
    --_bg-hov: #fecaca;
    --_bd:     var(--c-danger-bd);
    --_tx:     var(--c-danger-tx);
}

/* Amber çerçeveli: hafif uyarı */
.btn.ghost-warn {
    --_bg:     var(--c-warn-bg);
    --_bg-hov: var(--c-warn-bd);
    --_bd:     var(--c-warn-bd);
    --_tx:     var(--c-warn-tx);
}

/* ── Toggle (sevk, durum geçişi) ── */
.btn.toggle-off   { --_bg: var(--soft); --_bg-hov: #e2e8f0; --_bd: var(--line-med); --_tx: var(--muted); }
.btn.toggle-on    { --_bg: var(--c-success-bg); --_bg-hov: var(--c-danger-bg); --_bd: var(--c-success-bd); --_tx: var(--c-success-tx); }
.btn.toggle-on:hover  { --_bd: var(--c-danger-bd); --_tx: var(--c-danger-tx); }
.btn.toggle-ready { --_bg: var(--c-warn-bg); --_bg-hov: var(--c-warn-bd); --_bd: var(--c-warn-bd); --_tx: var(--c-warn-tx); }
/* ── İkon Butonu (tooltip ile) ── */
.btn-icon {
    --_sz: 30px;
    display: inline-flex; align-items: center; justify-content: center;
    width: var(--_sz); height: var(--_sz);
    border-radius: 7px; border: 1.5px solid var(--line);
    background: var(--soft); color: var(--muted);
    cursor: pointer; font-family: inherit; transition: all .13s;
    position: relative; flex-shrink: 0; text-decoration: none;
}
.btn-icon:hover { background: #e8edf4; border-color: var(--muted); color: var(--navy); }
.btn-icon.sm { --_sz: 26px; border-radius: 6px; }
.btn-icon.lg { --_sz: 36px; border-radius: 9px; }
.btn-icon[data-tip]:hover::after {
    content: attr(data-tip);
    position: absolute; bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%);
    background: #1e293b; color: #fff; font-size: 11px; font-weight: 500;
    padding: 4px 8px; border-radius: 5px; white-space: nowrap; pointer-events: none;
    z-index: 200; line-height: 1.4;
}
.btn-icon.green { background: #ecfdf5; border-color: #b7e4d2; color: #065f46; }
.btn-icon.green:hover { background: #d1fae5; }
.btn-icon.red { background: #fef2f2; border-color: #fecaca; color: #dc2626; }
.btn-icon.red:hover { background: #fee2e2; }
.btn-icon.blue { background: #eff6ff; border-color: #bfdbfe; color: #1d4ed8; }
.btn-icon.blue:hover { background: #dbeafe; }

/* ── Satır Aksiyon Grubu ── */
.row-acts {
    display: flex; align-items: center; gap: 4px;
    white-space: nowrap;
}
.row-acts .btn-icon { opacity: 0; transition: opacity .13s, background .13s, border-color .13s; }
tr:hover .row-acts .btn-icon,
tr.row--active .row-acts .btn-icon { opacity: 1; }
/* always visible: primary + dot-menu */
.row-acts .btn-icon.row-primary { opacity: 1 !important; }
.row-acts .row-dot {
    display: inline-flex; align-items: center; justify-content: center;
    width: 26px; height: 26px; border-radius: 6px;
    border: 1.5px solid var(--line); background: var(--soft); color: var(--muted);
    cursor: pointer; font-size: 15px; line-height: 1; font-family: inherit;
    transition: all .13s; opacity: 1 !important; flex-shrink: 0;
}
.row-acts .row-dot:hover { background: #e8edf4; border-color: var(--muted); color: var(--navy); }

.link-button {
    background: none;
    border: none;
    color: var(--green-ink);
    cursor: pointer;
    font: inherit;
    padding: 0;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
label { display: grid; gap: 6px; font-size: 13px; color: #52636d; }
.form-group { display: flex; flex-direction: column; gap: 5px; margin-bottom: 14px; }
.form-group label { font-size: 13px; font-weight: 600; color: #374151; margin-bottom: 2px; }
.form-group input, .form-group select, .form-group textarea { margin: 0; }
.form-actions { display: flex; gap: 10px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); }
input, select, textarea {
    width: 100%;
    border: 1.5px solid var(--line);
    border-radius: 7px;
    padding: 9px 10px;
    font: inherit;
    font-size: 13px;
    background: var(--surface);
    color: var(--text);
    transition: border-color .12s, box-shadow .12s;
}
input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 3px rgba(5,150,105,.14);
}
input::placeholder, textarea::placeholder { color: #a0adb4; }
textarea { min-height: 92px; resize: vertical; }

/* Field-level validation errors */
.field-error { display: block; color: var(--c-danger-tx); font-size: .77rem; margin-top: 3px; }
input.is-invalid, select.is-invalid, textarea.is-invalid {
    border-color: var(--c-danger);
    box-shadow: 0 0 0 3px rgba(220,38,38,.1);
}
/* Sayfa üst aksiyon çubuğu */
.page-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.full { grid-column: 1 / -1; }
.check { display: flex; align-items: center; gap: 8px; }
.check input { width: auto; }
.items { display: grid; gap: 8px; margin-bottom: 16px; }
.item-row {
    display: grid;
    grid-template-columns: 1.1fr 1.4fr .6fr .6fr .8fr .7fr .7fr;
    gap: 8px;
}
@media (max-width: 1100px) {
    .hero-grid, .grid-2 { grid-template-columns: 1fr; }
    .flow, .cross-links, .module-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* ═══════════════════════════════════════════════
   MOBİL UYUMLULUK
   ═══════════════════════════════════════════════ */

/* Topbar hamburger — yalnız mobilde görünür */
.topbar-hamburger { display: none; }

/* Mobilde gizlenecek nav öğeleri */
@media (max-width: 768px) {
    [data-mobile-hide] { display: none !important; }
    /* Tüm linkleri gizlenince nav-group başlığı da gizle */
    .nav-group[data-mobile-hide] { display: none !important; }
    /* Sadece gizlenmiş linkler kalan nav-group'u boş bırakmaması için */
    .nav-group:has(> a:not([data-mobile-hide])) { display: block; }
    /* Sidebar overlay açıkken TÜM linkler görünür (Menü butonuyla erişim) */
    .sidebar.mobile-open [data-mobile-hide] { display: block !important; }
    .sidebar.mobile-open .nav-group[data-mobile-hide] { display: block !important; }
}

/* ── Alt navigasyon çubuğu (yalnız mobil) ── */
.mobile-bottom-nav {
    display: none;
}
@media (max-width: 768px) {
    .mobile-bottom-nav {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        height: 66px;
        padding-bottom: env(safe-area-inset-bottom, 0px);
        background: #fff;
        border-top: 1.5px solid var(--line);
        z-index: 150;
        box-shadow: 0 -2px 16px rgba(0,0,0,.10);
    }
    .mobile-bottom-nav a {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        color: var(--muted);
        text-decoration: none;
        font-size: 11px;
        font-weight: 700;
        padding: 6px 2px;
        transition: color .15s;
        -webkit-tap-highlight-color: transparent;
        letter-spacing: .2px;
    }
    .mobile-bottom-nav a.active {
        color: var(--navy);
    }
    .mobile-bottom-nav a svg { transition: stroke .15s; }
    .mobile-bottom-nav a.active svg { stroke: var(--navy); }
    .ast-nav-badge {
        position: absolute; top: 4px; right: calc(50% - 18px);
        background: #dc2626; color: #fff;
        font-size: 9px; font-weight: 800;
        min-width: 16px; height: 16px; border-radius: 8px;
        display: flex; align-items: center; justify-content: center;
        padding: 0 3px; border: 1.5px solid #fff;
        pointer-events: none;
    }
    /* Alt nav yüksekliği kadar page-body'ye padding */
    .page-body { padding-bottom: 74px !important; }
    .page-body:has(.list-page-layout) { padding-bottom: 0 !important; }
    .list-page-table { padding-bottom: 74px; }
    /* Offer/Sipariş form sayfasında alt nav gizle — form alanları binmez */
    .page-body:has(.offer-workspace) .mobile-bottom-nav,
    body:has(.offer-workspace) .mobile-bottom-nav,
    .page-body:has(.sow-wrap) .mobile-bottom-nav,
    body:has(.sow-wrap) .mobile-bottom-nav { display: none !important; }
    .page-body:has(.offer-workspace) { padding-bottom: 0 !important; }
    .page-body:has(.sow-wrap) { padding-bottom: 0 !important; }
    /* Offer form sayfasında layout header'ındaki + Teklif butonunu gizle */
    body:has(.offer-workspace) .mob-hide-on-mobile { display: none !important; }
    /* Offer listesinde layout header'ındaki + Teklif gizle (FAB yeterli) */
    body:has(.offer-mob-fab) .mob-hide-on-mobile { display: none !important; }
}

/* Hamburger butonu — masaüstünde gizli */
.hamburger-btn {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    color: white;
    border-radius: 6px;
    flex-shrink: 0;
}
.hamburger-btn:hover { background: rgba(255,255,255,.12); }
.hamburger-btn svg { display: block; }

/* Sidebar overlay backdrop */
.sidebar-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 999;
}

@media (max-width: 768px) {
    /* ── Layout ── */
    body {
        grid-template-columns: 1fr;
        height: 100dvh;
        overflow: hidden;
        max-width: 100vw;
    }
    /* Yatay taşmayı engelle */
    .main, .page-body, .panel, .table-wrap,
    .list-page-layout, .list-page-header { max-width: 100%; overflow-x: hidden; }

    /* ── Sidebar: tam genişlik kayan panel ── */
    .sidebar {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: 88vw;
        max-width: 340px;
        z-index: 1000;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        -webkit-transition: -webkit-transform .28s cubic-bezier(.4,0,.2,1);
        transition: transform .28s cubic-bezier(.4,0,.2,1);
        will-change: transform;
        min-height: 100dvh;
        padding: 0;
        display: flex !important;
        flex-direction: column;
        gap: 0;
        overflow-y: auto;
        overflow-x: hidden;
        visibility: visible !important;
    }
    .sidebar.mobile-open {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    /* Brand alanı: logo + kapat butonu */
    .sidebar .brand.logo-brand {
        padding: 16px 16px 14px;
        border-bottom: 1px solid rgba(255,255,255,.12);
        margin-bottom: 0;
        flex-shrink: 0;
    }
    .sidebar .hamburger-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        border-radius: 10px;
        background: rgba(255,255,255,.12);
        margin-left: auto;
        flex-shrink: 0;
    }

    /* Arama kutusu */
    .sidebar .quick-search-form {
        padding: 12px 16px;
        border-bottom: 1px solid rgba(255,255,255,.1);
        flex-shrink: 0;
    }
    .sidebar .quick-search-form input {
        width: 100%;
        padding: 10px 14px;
        border-radius: 10px;
        font-size: 15px;
        background: rgba(255,255,255,.1);
        border: 1px solid rgba(255,255,255,.18);
        color: white;
        outline: none;
    }
    .sidebar .quick-search-form input::placeholder { color: rgba(255,255,255,.5); }

    /* Nav: tam genişlik, düzgün blok */
    .sidebar nav.erp-nav {
        display: flex;
        flex-direction: column;
        gap: 0;
        flex: 1;
        padding: 8px 0;
    }
    .sidebar .nav-group {
        display: flex;
        flex-direction: column;
        gap: 0;
        padding: 8px 0;
        border-bottom: 1px solid rgba(255,255,255,.08);
    }
    .sidebar .nav-group:last-child { border-bottom: none; }
    .sidebar .nav-title {
        padding: 4px 18px 6px;
        font-size: 10px;
        font-weight: 900;
        color: rgba(255,255,255,.38);
        text-transform: uppercase;
        letter-spacing: .8px;
    }
    /* Linkler: tam genişlik, büyük dokunma hedefi */
    .sidebar nav a {
        display: block;
        width: 100%;
        padding: 13px 18px;
        font-size: 15px;
        font-weight: 500;
        color: rgba(255,255,255,.88);
        border-radius: 0;
        line-height: 1.3;
        border-left: 3px solid transparent;
        transition: background .12s, color .12s, border-color .12s;
        text-decoration: none;
    }
    .sidebar nav a:hover {
        background: rgba(255,255,255,.1);
        color: white;
        border-left-color: rgba(255,255,255,.3);
    }
    .sidebar nav a.active {
        background: rgba(5,150,105,.25);
        color: #6ee7b7;
        border-left-color: var(--brand);
        font-weight: 700;
    }

    /* Katlanabilir nav grupları (desktop) */
    .sidebar .nav-title {
        cursor: pointer;
        user-select: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .sidebar .nav-title::after {
        content: '▾';
        font-size: 11px;
        opacity: .5;
        transition: transform .18s;
        flex-shrink: 0;
        margin-right: 2px;
    }
    .sidebar .nav-group.ng-collapsed .nav-title::after { transform: rotate(-90deg); }
    .sidebar .nav-group.ng-collapsed > a { display: none !important; }
    /* Kontrol grubu her zaman açık */
    .sidebar .nav-group[data-nav-always-open] .nav-title { cursor: default; }
    .sidebar .nav-group[data-nav-always-open] .nav-title::after { display: none; }

    /* Footer */
    .sidebar .sidebar-footer {
        padding: 14px 18px;
        margin-top: auto;
        border-top: 1px solid rgba(255,255,255,.12);
        flex-shrink: 0;
        border-radius: 0;
        background: rgba(0,0,0,.15);
        border: none;
        border-top: 1px solid rgba(255,255,255,.12);
    }

    /* Backdrop */
    .sidebar-backdrop.visible { display: block; }
    .hamburger-btn { display: flex; align-items: center; }

    /* ── Main alan ── */
    .main {
        height: 100dvh;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }

    /* ── Topbar: kompakt mobil header ── */
    .topbar {
        padding: 10px 14px;
        padding-top: calc(10px + env(safe-area-inset-top, 0px));
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        flex-wrap: nowrap;
        flex-shrink: 0;
    }
    .topbar > div:first-child {
        display: flex;
        align-items: center;
        gap: 10px;
        min-width: 0;
        flex: 1;
    }
    /* Hamburger'ı topbar'a taşı */
    /* Üst hamburger gizle — alt nav'daki Menü butonu var */
    .topbar-hamburger { display: none !important; }
    .page-title {
        font-size: .95rem !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .page-subtitle { display: none; }
    .top-actions {
        display: flex;
        align-items: center;
        gap: 6px;
        flex-shrink: 0;
    }
    /* Çıkış ve profil metni gizle */
    .topbar-user .topbar-role { display: none; }
    .topbar-user { font-size: .8rem; max-width: 80px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .topbar-badge { display: none; }

    /* ── Page body ── */
    .page-body {
        flex: 1;
        overflow-y: auto;
        overflow-x: hidden;
        padding: 12px 14px 24px;
        -webkit-overflow-scrolling: touch;
    }
    .page-body:has(.list-page-layout) { padding: 0 14px 0; }

    /* ── Tablolar → Kart görünümü ── */
    .table-wrap {
        overflow-x: visible !important;
        border-radius: 0;
        border: none;
        background: transparent;
        box-shadow: none;
    }
    /* Tablo başlığını gizle */
    .data-table thead { display: none; }
    /* Her satır bir kart */
    .data-table,
    .data-table tbody { display: block; width: 100%; }
    .data-table tr {
        display: block;
        background: var(--surface);
        border: 1px solid var(--line);
        border-radius: 10px;
        margin-bottom: 8px;
        padding: 10px 12px;
        box-shadow: 0 1px 3px rgba(0,0,0,.06);
        position: relative;
    }
    .data-table td {
        display: flex;
        align-items: baseline;
        gap: 6px;
        padding: 3px 0;
        border: none !important;
        font-size: .85rem;
        white-space: normal;
        word-break: break-word;
    }
    /* data-label etiketi — th metni buradan gelir */
    .data-table td[data-label]::before {
        content: attr(data-label);
        font-size: 10px;
        font-weight: 800;
        color: var(--muted);
        text-transform: uppercase;
        letter-spacing: .3px;
        white-space: nowrap;
        min-width: 72px;
        flex-shrink: 0;
    }
    /* İlk td (isim/başlık) — tam genişlik, kalın, etiket yok */
    .data-table td:first-child {
        display: block;
        font-size: .92rem;
        font-weight: 700;
        margin-bottom: 5px;
        padding-bottom: 7px;
        border-bottom: 1px solid var(--line) !important;
    }
    .data-table td:first-child::before { content: none; }
    /* Son td (aksiyon butonları) */
    .data-table td:last-child {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
        margin-top: 6px;
        padding-top: 6px;
        border-top: 1px solid var(--line) !important;
    }
    .data-table td:last-child::before { content: none; }
    /* Boş satır */
    .data-table tr:has(.empty-state) { display: block; background: var(--soft); padding: 16px; text-align: center; }
    /* Pagination alanı */
    .list-page-table { overflow: visible; }

    /* ── Grid düzenlemeleri — tümünü tek sütuna al ── */
    .layer-row,
    .kpi-panel,
    .flow,
    .cross-links,
    .module-grid,
    .form-grid,
    .item-row,
    .hero-grid,
    .grid-2,
    .erp-grid.two,
    .erp-grid.three,
    .work-order-layout,
    .service-form-layout,
    .agent-panel,
    .compact-form-grid,
    .definition-filter-form,
    .soc-panel .soc-grid-4,
    dl.detail-list { grid-template-columns: 1fr !important; }

    /* Satır içi formlar — minimum genişliği kaldır */
    .inline-edit-form,
    .inline-edit-form.bom-inline-edit { grid-template-columns: 1fr 1fr !important; }
    .inline-edit-form input,
    .inline-edit-form select { min-width: 0 !important; width: 100% !important; }

    /* Teklif/sipariş/servis yan panel — tam genişlik */
    .offer-layout, .purchase-layout,
    [class*="-layout"] { grid-template-columns: 1fr !important; }

    /* Filtre barları — sararak devam et */
    .list-filter-bar { flex-wrap: wrap; gap: 6px; }
    .list-filter-bar input,
    .list-filter-bar select { min-width: 0 !important; flex: 1 1 140px; max-width: 100%; }

    .kpi-grid, .compact-kpis { grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .module-overview-grid { grid-template-columns: 1fr; }

    /* ── Panel ve butonlar — dokunma hedefi min 44px ── */
    .panel { padding: 12px; }
    .btn { padding: 10px 16px; font-size: .85rem; min-height: 44px; }
    .btn.compact { min-height: 42px; padding: 8px 14px; }
    .page-actions { flex-wrap: nowrap !important; overflow-x: auto !important; scrollbar-width: none !important; padding-bottom: 4px; gap: 6px; }
    .page-actions::-webkit-scrollbar { display: none; }
    .page-actions .btn, .page-actions button, .page-actions a { flex-shrink: 0 !important; white-space: nowrap !important; }
    .row-actions { gap: 4px; }

    /* Genel input / select: iOS zoom önle (16px altı zoom tetikler) */
    input[type="text"], input[type="number"], input[type="date"],
    input[type="email"], input[type="search"], input[type="tel"],
    select, textarea { font-size: 16px !important; }

    /* ── Dialog / Modal ── */
    dialog {
        max-width: 96vw !important;
        width: 96vw !important;
        max-height: 90dvh;
        overflow-y: auto;
    }

    /* ── List filter bar ── */
    .list-filter-bar { flex-wrap: wrap; }
    .list-stat-row { flex-wrap: wrap; gap: 8px; }

    /* ── SOC (Sales Order Create) panel ── */
    .soc-panel .soc-grid-4 { grid-template-columns: 1fr 1fr !important; }
}

@media (max-width: 480px) {
    .topbar { padding: 8px 12px; }
    .kpi-grid, .compact-kpis { grid-template-columns: 1fr 1fr; gap: 6px; }
    .kpi-card { padding: 10px 11px; }
    .kpi-card strong { font-size: 1.1rem; }
    .data-table { font-size: .74rem; }
    .status-pill { font-size: .68rem; padding: 2px 6px; }
    .soc-panel .soc-grid-4 { grid-template-columns: 1fr !important; }
    .btn.compact { padding: 6px 10px; font-size: .78rem; }
    h1.page-title { font-size: .9rem !important; }
}

.logo-brand {
    align-items: center;
    gap: 12px;
}
.brand-logo {
    width: 132px;
    height: auto;
    display: block;
    object-fit: contain;
    background: rgba(255,255,255,.96);
    border-radius: 6px;
    padding: 5px 7px;
}
.logo-brand strong {
    display: block;
    font-size: 18px;
    letter-spacing: 0;
}
.agent-panel {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(280px, .9fr) minmax(300px, .9fr);
    gap: 12px;
    padding: 15px;
    margin-bottom: 14px;
    border: 1px solid #b9e5d5;
    border-radius: 8px;
    background: linear-gradient(180deg, #f4fbf8, #ffffff);
}
.agent-panel p {
    margin: 7px 0 0;
    color: var(--muted);
    line-height: 1.45;
}
.agent-list {
    display: grid;
    gap: 7px;
}
.agent-list span {
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: white;
    color: var(--navy-dark);
    font-weight: 700;
    font-size: 12px;
}
.decision-box {
    padding: 12px;
    border-radius: 8px;
    background: var(--navy);
    color: white;
}
.decision-box strong {
    display: block;
    margin-bottom: 8px;
}
.decision-box ol {
    margin: 0;
    padding-left: 18px;
    line-height: 1.45;
    color: rgba(255,255,255,.86);
}

@media (max-width: 1100px) {
    .agent-panel { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .brand-logo { width: 118px; padding: 4px 6px; }
    .logo-brand strong { font-size: 16px; }
}
.customer-hero {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: flex-start;
    padding: 15px;
    margin-bottom: 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: white;
}
.customer-hero h2 {
    font-size: 22px;
}
.customer-hero p {
    margin: 5px 0 0;
    color: var(--muted);
}
.customer-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.customer-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}
.info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.info-grid span {
    display: grid;
    gap: 4px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: var(--soft);
    color: var(--muted);
}
.info-grid strong {
    color: var(--navy-dark);
}
.note-block {
    margin: 10px 0 0;
    padding: 10px;
    border-left: 3px solid var(--green);
    background: #f6fbf8;
    color: var(--muted);
}
.definition-switchboard {
    display: grid;
    gap: 12px;
}
.definition-panel {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    overflow: hidden;
}
.definition-panel > summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 15px 16px;
    background: #f8fbfa;
}
.definition-panel > summary::-webkit-details-marker { display: none; }
.definition-panel > summary strong {
    display: block;
    color: var(--navy-dark);
    font-size: 17px;
}
.definition-panel > summary small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    line-height: 1.35;
}
.definition-panel > summary b {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 76px;
    padding: 8px 12px;
    border-radius: 7px;
    background: var(--green);
    color: #fff;
}
.definition-panel[open] > summary b::before { content: "Kapat"; }
.definition-panel[open] > summary b { font-size: 0; background: var(--navy); }
.definition-panel[open] > summary b::before { font-size: 13px; }
.definition-body {
    display: grid;
    gap: 12px;
    padding: 12px;
}
.inline-edit-row td {
    background: #f8fbfa;
}
.inline-edit-form {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr)) auto;
    gap: 8px;
    align-items: end;
}
.inline-edit-form.bom-inline-edit {
    grid-template-columns: minmax(180px, 1.5fr) minmax(150px, 1fr) 90px 80px 80px 90px minmax(130px, 1fr) auto;
}
.inline-edit-form label {
    font-size: 11px;
    font-weight: 800;
}
.inline-actions {
    display: flex;
    align-items: end;
    gap: 6px;
}
.inline-form {
    display: inline-flex;
    align-items: center;
    margin: 0;
}
.inline-delete-form {
    margin-top: 8px;
    display: flex;
    justify-content: flex-end;
}
.definition-filter-form {
    display: grid;
    grid-template-columns: minmax(220px, 1.2fr) repeat(4, minmax(140px, .7fr)) auto;
    gap: 8px;
    align-items: end;
    padding: 10px;
    margin-bottom: 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--soft);
}
.definition-filter-form label {
    font-size: 11px;
    font-weight: 800;
}
.filter-actions {
    display: flex;
    gap: 6px;
    align-items: end;
}
.work-order-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.36fr);
    gap: 14px;
    align-items: start;
}
.compact-form-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.service-form-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 14px;
    align-items: start;
}
.service-form-main {
    min-width: 0;
}
.service-context-panel {
    position: sticky;
    top: 14px;
}
.service-context-panel h2 {
    margin: 0 0 12px;
    font-size: 16px;
}
.service-context-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
}
.service-context-grid div {
    min-width: 0;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--soft);
}
.service-context-grid span {
    display: block;
    margin-bottom: 4px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}
.service-context-grid strong {
    display: block;
    color: var(--navy);
    font-size: 13px;
    overflow-wrap: anywhere;
}
.product-360-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 14px;
    align-items: start;
    margin-bottom: 14px;
}
.product-decision-panel {
    position: sticky;
    top: 14px;
}
.product-chain-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.product-chain-grid.two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.product-chain-grid h3 {
    margin: 0 0 8px;
    color: var(--navy);
    font-size: 14px;
}
.compact-heading {
    margin-top: 18px;
}
.empty-state.small {
    padding: 10px;
    font-size: 12px;
}
.work-order-summary {
    position: sticky;
    top: 14px;
}
/*
 * status-pill → buton renk semantiğiyle birebir örtüşür:
 *   .ok      = yeşil  (tamamlandı / ödendi / onaylandı)
 *   .info    = mavi   (bilgi / referans)
 *   .warn    = amber  (bekliyor / beklemede / kısmi)
 *   .danger  = kırmızı (iptal / gecikmiş / risk)
 *   (sınıfsız) = gri  (tarafsız / açık)
 */
.status-pill {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--soft);
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .2px;
    white-space: nowrap;
    border: 1px solid var(--line);
}
.status-pill.ok      { background: var(--c-success-bg); color: var(--c-success-tx); border-color: var(--c-success-bd); }
.status-pill.info    { background: var(--c-info-bg);    color: var(--c-info-tx);    border-color: var(--c-info-bd); }
.status-pill.warning,
.status-pill.warn    { background: var(--c-warn-bg);    color: var(--c-warn-tx);    border-color: var(--c-warn-bd); }
.status-pill.danger  { background: var(--c-danger-bg);  color: var(--c-danger-tx);  border-color: var(--c-danger-bd); }

/* ── offer-status-card renk modifierleri (teklif listesi durum sütunu) ── */
.offer-status-card { padding: 8px 12px; border-radius: 10px; background: var(--soft); border: 1px solid var(--line); }
.offer-status-card.ok     { background: var(--c-success-bg); border-color: var(--c-success-bd); color: var(--c-success-tx); }
.offer-status-card.info   { background: var(--c-info-bg);    border-color: var(--c-info-bd);    color: var(--c-info-tx); }
.offer-status-card.warn   { background: var(--c-warn-bg);    border-color: var(--c-warn-bd);    color: var(--c-warn-tx); }
.offer-status-card.danger { background: var(--c-danger-bg);  border-color: var(--c-danger-bd);  color: var(--c-danger-tx); }
.offer-status-card strong { font-size: 12px; font-weight: 700; display: block; }
.offer-status-card small  { font-size: 11px; color: inherit; opacity: .75; }

/* ── line-badge renk modifierleri (tablo satır içi durum rozeti) ── */
.line-badge { display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 999px; font-size: 11px; font-weight: 700; background: var(--soft); color: var(--muted); border: 1px solid var(--line); white-space: nowrap; }
.line-badge.ok     { background: var(--c-success-bg); color: var(--c-success-tx); border-color: var(--c-success-bd); }
.line-badge.info   { background: var(--c-info-bg);    color: var(--c-info-tx);    border-color: var(--c-info-bd); }
.line-badge.warn   { background: var(--c-warn-bg);    color: var(--c-warn-tx);    border-color: var(--c-warn-bd); }
.line-badge.danger { background: var(--c-danger-bg);  color: var(--c-danger-tx);  border-color: var(--c-danger-bd); }

/* ── Global dialog base stili ── */
dialog {
    border: none;
    border-radius: 16px;
    padding: 0;
    box-shadow: 0 8px 40px rgba(0,0,0,.18), 0 2px 8px rgba(0,0,0,.08);
    max-width: min(560px, 95vw);
    color: var(--text);
    font-family: inherit;
}
dialog::backdrop {
    background: rgba(0,0,0,.45);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

/* ── Standart empty state (boş liste / kart) ── */
.erp-empty {
    padding: 40px 20px;
    text-align: center;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.5;
}
.mrp-kpis {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 12px 0;
}
.mrp-kpis div {
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 10px;
    background: #fbfdfc;
}
.mrp-kpis span {
    display: block;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}
.mrp-kpis strong {
    display: block;
    margin-top: 6px;
    color: var(--navy-dark);
    font-size: 16px;
}
.mrp-alert {
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 10px;
    margin-bottom: 10px;
    color: var(--muted);
    background: var(--soft);
    font-size: 13px;
    line-height: 1.4;
}
.mrp-alert.ok {
    border-color: #bfe9cf;
    background: #effaf3;
    color: #067647;
}
.mrp-alert.warning {
    border-color: #f4d77b;
    background: #fff9e6;
    color: #8a5b00;
}
.mrp-alert.danger {
    border-color: #ffc7c7;
    background: #fff1f1;
    color: #b42318;
}
.compact-table th,
.compact-table td {
    padding: 8px 7px;
    font-size: 12px;
}
.compact-table td strong,
.compact-table td small {
    display: block;
}
.compact-table td small {
    margin-top: 2px;
    color: var(--muted);
}
.compact-number-input {
    width: 104px;
    min-height: 34px;
    padding: 7px 8px;
    border: 1px solid var(--line);
    border-radius: 8px;
    font-weight: 800;
}
.risk-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 8px;
    border-radius: 999px;
    font-weight: 800;
    font-size: 11px;
}
.risk-badge.ok {
    background: #e9f8ef;
    color: var(--green);
}
.risk-badge.danger {
    background: #fde8e8;
    color: #b42318;
}
.work-order-actions {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}
.offer-show-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 14px;
}
.offer-show-header h1 {
    margin: 4px 0 4px;
    font-size: 28px;
    letter-spacing: 0;
}
.offer-show-header p {
    margin: 0;
    color: var(--muted);
}
.offer-show-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    max-width: 780px;
}
.offer-progress-compact {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 14px;
}
.offer-progress-compact span {
    min-height: 34px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    color: var(--muted);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 800;
}
.offer-progress-compact span.active {
    border-color: var(--green);
    background: #e8f8ee;
    color: var(--green);
}
.offer-progress-compact span.done {
    border-color: #b7e5c7;
    background: #f2fbf5;
    color: var(--green);
}
.offer-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 14px;
    align-items: start;
}
.offer-detail-main {
    display: grid;
    gap: 14px;
    min-width: 0;
}
.offer-document-panel {
    border-top: 3px solid var(--green);
}
.offer-info-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.offer-info-grid div {
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 10px;
    background: #fbfdfc;
    min-height: 82px;
}
.offer-info-grid span,
.offer-total-list span {
    display: block;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}
.offer-info-grid strong,
.offer-info-grid small {
    display: block;
}
.offer-info-grid strong {
    margin-top: 6px;
}
.offer-info-grid small {
    margin-top: 4px;
    color: var(--muted);
    line-height: 1.35;
}
.offer-notes-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
.offer-notes-grid p {
    margin: 6px 0 0;
    line-height: 1.55;
}
.offer-decision-panel {
    position: sticky;
    top: 18px;
}
.offer-decision-panel h2 {
    margin-top: 0;
}
.offer-total-list {
    display: grid;
    gap: 8px;
    margin-bottom: 12px;
}
.offer-total-list div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid var(--line);
    padding-bottom: 8px;
}
.offer-total-list div:nth-child(3),
.offer-total-list div:nth-child(4) {
    font-size: 16px;
}
.full-btn {
    width: 100%;
    justify-content: center;
    margin-top: 8px;
}
.erp-toast-stack {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 1200;
    display: grid;
    gap: 10px;
    width: min(360px, calc(100vw - 32px));
}
.erp-toast {
    border: 1px solid var(--line);
    border-left: 4px solid var(--blue);
    border-radius: 8px;
    background: #fff;
    color: var(--ink);
    box-shadow: 0 14px 34px rgba(20, 38, 59, .16);
    padding: 12px 14px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    opacity: 1;
    transform: translateY(0);
    transition: opacity .25s ease, transform .25s ease;
}
.erp-toast.ok { border-left-color: var(--green); }
.erp-toast.warn { border-left-color: #f2a93b; }
.erp-toast.danger { border-left-color: #d94848; }
.erp-toast.is-hiding {
    opacity: 0;
    transform: translateY(8px);
}
.sales-chain-steps {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}
.chain-step {
    position: relative;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    padding: 12px;
    min-height: 76px;
}
.chain-step::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -10px;
    width: 10px;
    height: 2px;
    background: var(--line);
}
.chain-step:last-child::after {
    display: none;
}
.chain-step span {
    display: block;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}
.chain-step a,
.chain-step strong {
    display: block;
    margin-top: 8px;
    color: var(--ink);
    font-weight: 800;
    text-decoration: none;
    line-height: 1.3;
}
.chain-step.done {
    border-color: rgba(4, 151, 74, .32);
    background: #f3fbf6;
}
.chain-step.done span {
    color: var(--green);
}
.chain-step.waiting {
    background: #fbfdfc;
}
.customer-ops-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 14px;
    align-items: start;
    margin-bottom: 14px;
}
.customer-flow-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}
.customer-flow-grid article {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fbfdfc;
    padding: 12px;
    min-height: 92px;
}
.customer-flow-grid span,
.risk-row span {
    display: block;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}
.customer-flow-grid strong {
    display: block;
    margin-top: 8px;
    font-size: 26px;
    color: var(--ink);
}
.customer-flow-grid small {
    display: block;
    margin-top: 6px;
    color: var(--muted);
    line-height: 1.35;
}
.customer-chain-steps {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    margin-top: 14px;
}
.customer-chain-steps span {
    border: 1px dashed var(--line);
    border-radius: 999px;
    padding: 8px 10px;
    background: #fff;
    color: var(--muted);
    text-align: center;
    font-size: 12px;
    font-weight: 800;
}
.customer-chain-steps span.active {
    border-style: solid;
    border-color: rgba(4, 151, 74, .32);
    background: #f3fbf6;
    color: var(--green);
}
.customer-risk-panel {
    position: sticky;
    top: 18px;
}
.risk-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    border-bottom: 1px solid var(--line);
    padding: 10px 0;
}
.risk-row strong {
    white-space: nowrap;
}
@media (max-width: 900px) {
    .customer-hero { flex-direction: column; }
    .customer-actions { justify-content: flex-start; }
    .customer-kpis, .info-grid { grid-template-columns: 1fr; }
    .inline-edit-form, .definition-filter-form, .work-order-layout, .compact-form-grid, .service-form-layout, .product-360-grid, .product-chain-grid, .product-chain-grid.two, .offer-detail-layout, .offer-info-grid, .offer-notes-grid, .offer-progress-compact, .sales-chain-steps, .customer-ops-layout, .customer-flow-grid, .customer-chain-steps { grid-template-columns: 1fr; }
    .filter-actions { justify-content: flex-start; }
    .work-order-summary, .service-context-panel, .product-decision-panel, .offer-decision-panel, .customer-risk-panel { position: static; }
    .offer-show-header { flex-direction: column; }
    .offer-show-actions { justify-content: flex-start; }
}

/* Sevkiyat index - operasyonel akış */
.shipment-next-step { min-width: 130px; }
.shipment-next-step form { display: inline; }
.shipment-next-step .btn { white-space: nowrap; }
.shipment-next-step small { display: block; margin-top: 4px; font-size: 11px; color: var(--muted); }

/* Planlama kuyruğu - risk panelleri */
.planning-risk-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 20px; }
.planning-risk-card { border-radius: 10px; padding: 14px 16px; border: 1px solid var(--line); }
.planning-risk-card.high { background: var(--rose-soft); border-color: #fecaca; }
.planning-risk-card.med  { background: var(--amber-soft); border-color: #fed7aa; }
.planning-risk-card.ok   { background: var(--green-soft); border-color: #bbf7d0; }
.planning-risk-card .risk-label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.planning-risk-card .risk-count { font-size: 26px; font-weight: 800; line-height: 1.1; margin: 4px 0 2px; }
.planning-risk-card .risk-sub   { font-size: 12px; color: var(--muted); }
.planning-risk-card.high .risk-count { color: #dc2626; }
.planning-risk-card.med  .risk-count { color: #d97706; }
.planning-risk-card.ok   .risk-count { color: var(--green-ink); }

/* Sipariş detay — koli listesi */
.pkg-list-table { border: 1px solid var(--line); border-radius: 8px; overflow: hidden; margin-top: 6px; }
.pkg-list-head,
.pkg-list-row { display: grid; grid-template-columns: 32px 1fr 120px 110px 1fr; }
.pkg-list-head { background: var(--soft); padding: 7px 12px; font-size: 11px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; border-bottom: 1px solid var(--line); gap: 8px; }
.pkg-list-row { padding: 8px 12px; gap: 8px; font-size: 13px; border-bottom: 1px solid var(--line); align-items: center; }
.pkg-list-row:last-child { border-bottom: 0; }
.pkg-list-row:nth-child(even) { background: #fafcfb; }
.pkg-list-row span:first-child { font-weight: 800; color: var(--muted); text-align: center; }

/* ── Sayı rozeti (section başlıkları vb.) ─────────────────────── */
.badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 800;
    background: var(--line);
    color: var(--text);
    vertical-align: middle;
    line-height: 1;
}
.badge.ok      { background: var(--c-success-bg); color: var(--c-success-tx); }
.badge.warn    { background: var(--c-warn-bg);    color: var(--c-warn-tx); }
.badge.danger  { background: var(--c-danger-bg);  color: var(--c-danger-tx); }
.badge.info    { background: var(--c-info-bg);    color: var(--c-info-tx); }

/* ── Global alert success/warning variants ────────────────────── */
.alert.success { background: var(--c-success-bg); border-color: var(--c-success-bd); color: var(--c-success-tx); }

/* ── list-stat.warn also colors the label text ───────────────── */
.list-stat.warn { color: var(--c-warn-tx); }

/* ── Tablo satırı tıklanabilirlik ipucu ───────────────────────── */
.data-table tbody tr { transition: background .1s; }
.data-table tbody tr:hover { background: #f3f8f5; cursor: default; }
.data-table tbody tr[onclick],
.data-table tbody tr.clickable { cursor: pointer; }

/* ── info color text utility ──────────────────────────────────── */
.val-muted { color: var(--muted); }

/* ══════════════════════════════════════════════════════════════
   MOBİL ÖZEL STİLLER — Bölüm bazlı iyileştirmeler (≤ 768px)
   ══════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ── Topbar: isim/rol gizle, sadece ikonlar ── */
  .topbar-user { display: none !important; }
  .top-actions .btn.compact { padding: 7px 10px; font-size: .78rem; }
  .topbar-search-btn { font-size: 1.1rem; padding: 5px 8px; min-height: 34px; display: flex; align-items: center; }

  /* ── Sidebar içindeki arama kutusu ── */
  .quick-search-form input { font-size: 14px; padding: 10px 12px; border-radius: 10px; }

  /* ── Genel liste sayfası header ── */
  .list-page-header { padding: 12px 0 8px; }
  .list-stat-row .btn { font-size: .78rem; padding: 6px 10px; }
  .list-stat { font-size: 12px; }
  .list-stat strong { font-size: 15px; }

  /* ── Filtre çubuğu ── */
  .list-filter-bar { gap: 6px; }
  .list-filter-bar input,
  .list-filter-bar select { font-size: .83rem; padding: 7px 10px; height: auto; }

  /* ── Kart görünümü genel iyileştirme ── */
  .data-table tr {
    padding: 12px 14px;
    gap: 0;
    border-radius: 12px;
    margin-bottom: 10px;
  }
  .data-table td { font-size: .84rem; line-height: 1.4; }
  .data-table td small { font-size: .76rem; color: var(--muted); display: block; margin-top: 1px; }
  .data-table td:first-child { font-size: .93rem; padding-bottom: 8px; margin-bottom: 4px; }
  .data-table td:last-child { padding-top: 8px; margin-top: 4px; gap: 6px; }
  .data-table .btn, .data-table .btn.compact, .data-table .btn.ghost {
    padding: 7px 12px !important; font-size: .78rem !important; min-height: 34px;
  }

  /* ── Teklifler (offer-operation-table) ──
     Kolonlar: 1-Teklif 2-Müşteri 3-Tutar 4-Durum 5-SonrakiAdım 6-İşlem */
  .offer-operation-table thead th:nth-child(5),
  .offer-operation-table td.offer-next-step { display: none !important; }
  .offer-status-card { padding: 6px 8px; font-size: .8rem; border-radius: 8px; }
  .offer-status-card strong { font-size: .85rem; }
  .offer-amount-cell { display: flex; flex-direction: column; gap: 1px; }
  .offer-amount-cell strong { font-size: .95rem; }
  .offer-amount-cell small { font-size: .75rem; }
  .offer-action-cell { display: flex; flex-wrap: wrap; gap: 5px; }

  /* ── Siparişler (sales-order-operation-table) ──
     Kolonlar: 1-Sipariş 2-Müşteri 3-Termin 4-Teslimat 5-Planlama 6-KalanBakiye 7-Tahsilat 8-Risk 9-İşlem */
  .sales-order-operation-table thead th:nth-child(4),
  .sales-order-operation-table thead th:nth-child(5),
  .sales-order-operation-table thead th:nth-child(7),
  .sales-order-operation-table thead th:nth-child(8),
  .sales-order-operation-table tbody td:nth-child(4),
  .sales-order-operation-table tbody td:nth-child(5),
  .sales-order-operation-table tbody td:nth-child(7),
  .sales-order-operation-table tbody td:nth-child(8) { display: none !important; }

  /* ── Ürünler (data-table ürün listesinde) ──
     Kolonlar: 1-Kod 2-ÜrünAdı 3-Tip 4-Stok 5-Birim 6-Alış 7-Satış 8-ParaBr 9-Kategori 10-actions */
  .products-list-table thead th:nth-child(3),
  .products-list-table thead th:nth-child(6),
  .products-list-table thead th:nth-child(8),
  .products-list-table thead th:nth-child(9),
  .products-list-table tbody td:nth-child(3),
  .products-list-table tbody td.prow-birim,
  .products-list-table tbody td:nth-child(6),
  .products-list-table tbody td.prow-cur,
  .products-list-table tbody td:nth-child(9) { display: none !important; }
  .products-list-table td.prow-stok { font-weight: 700; color: var(--brand); }

  /* ── Ödemeler ──
     Kolonlar: 1-Tarih 2-Müşteri 3-Satış 4-Tutar 5-TRY 6-Yöntem 7-SatışDurum 8-Muhasebe 9-Makbuz 10-İşlem */
  .payments-list-table thead th:nth-child(3),
  .payments-list-table thead th:nth-child(5),
  .payments-list-table thead th:nth-child(7),
  .payments-list-table thead th:nth-child(8),
  .payments-list-table thead th:nth-child(9),
  .payments-list-table tbody td:nth-child(3),
  .payments-list-table tbody td:nth-child(5),
  .payments-list-table tbody td:nth-child(7),
  .payments-list-table tbody td:nth-child(8),
  .payments-list-table tbody td:nth-child(9) { display: none !important; }

  /* ── Faturalar ──
     Kolonlar: 1-Fatura 2-Müşteri 3-KaynakTeklif 4-Sevkiyat 5-Tarih 6-Tip 7-Tutar 8-Durum 9-PDF 10-İşlem */
  .invoices-list-table thead th:nth-child(3),
  .invoices-list-table thead th:nth-child(4),
  .invoices-list-table thead th:nth-child(6),
  .invoices-list-table thead th:nth-child(9),
  .invoices-list-table tbody td:nth-child(3),
  .invoices-list-table tbody td:nth-child(4),
  .invoices-list-table tbody td:nth-child(6),
  .invoices-list-table tbody td:nth-child(9) { display: none !important; }

  /* ── Sevkiyat (compact-offer-list) ──
     Kolonlar: 1-Sevkiyat 2-Müşteri 3-Teslimat 4-İrsaliye 5-Belgeler 6-SevkDurumu ... */
  .compact-offer-list thead th:nth-child(4),
  .compact-offer-list thead th:nth-child(5),
  .compact-offer-list tbody td:nth-child(4),
  .compact-offer-list tbody td:nth-child(5) { display: none !important; }

  /* ── Dashboard KPI kartları ── */
  .kpi-grid, .compact-kpis { grid-template-columns: 1fr 1fr; gap: 8px; }
  .kpi-card { padding: 12px 13px; border-radius: 12px; }
  .kpi-card strong { font-size: 1.15rem; }
  .kpi-card span { font-size: .75rem; }

  /* ── Form alanları ── */
  .form-group label, label { font-size: .83rem; margin-bottom: 4px; }
  input[type=text], input[type=number], input[type=email],
  input[type=date], select, textarea {
    font-size: 16px !important; /* iOS zoom engelle */
    padding: 10px 12px !important;
    border-radius: 9px !important;
    min-height: 44px;
  }
  textarea { min-height: 80px; }

  /* ── Panel başlıkları ── */
  .panel-head h2 { font-size: .9rem; }
  .panel h2, .panel h3 { font-size: .95rem; }

  /* ── Sayfalama ── */
  .pagination { flex-wrap: wrap; gap: 4px; }
  .pagination a, .pagination span { padding: 7px 11px; font-size: .8rem; border-radius: 7px; min-width: 34px; text-align: center; }

  /* ── Durum pilleri ── */
  .status-pill { font-size: .72rem; padding: 3px 8px; border-radius: 6px; }

  /* ── Teklif detay (show) sayfası ── */
  .offer-show-header { flex-direction: column; gap: 10px; }
  .offer-show-header h1 { font-size: 1.2rem; }
  .offer-show-actions { display: flex; flex-wrap: wrap; gap: 6px; }
  .offer-show-actions .btn { flex: 1 1 auto; text-align: center; font-size: .8rem; padding: 8px 10px; }
  .offer-progress-compact { overflow-x: auto; white-space: nowrap; padding-bottom: 4px; }

  /* ── Mini istatistik satırı ── */
  .list-stat-row { gap: 8px; padding: 8px 0; }

  /* ── Boş durum ── */
  .empty-state, .empty-row { padding: 24px 16px; font-size: .85rem; }
}

/* ── Çok küçük ekranlar (≤ 420px) ── */
@media (max-width: 420px) {
  .mobile-bottom-nav a span { font-size: 9px; }
  .mobile-bottom-nav { height: 58px; }
  .data-table tr { padding: 10px 11px; }
  .kpi-card strong { font-size: 1rem; }
  .offer-show-actions .btn { font-size: .75rem; padding: 7px 8px; }
}

/* ══ MOBİL: 44px dokunmatik standart düzeltmeleri (≤ 768px) ══ */
@media (max-width: 768px) {

  /* Topbar: ⌕, + Teklif, Çıkış butonları */
  .topbar-search-btn {
    min-width: 44px !important;
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 6px !important;
    font-size: 20px !important;
  }
  .top-actions .btn.compact,
  .topbar .btn.compact {
    min-height: 44px !important;
    padding: 0 14px !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  /* Satır içi metin butonları: Aç, Düzenle, 360°, Sil, Sayım Gir vb. */
  button.row-action-btn,
  a.row-action-btn {
    min-height: 36px !important;
    min-width: 36px !important;
    padding: 6px 10px !important;
    font-size: 13px !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  /* Teklif formu: satır aksiyonları (Düzenle/Kopyala/Sil ikonları) */
  .line-actions button {
    min-width: 36px !important;
    min-height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px !important;
  }
  .line-actions button svg {
    width: 18px !important;
    height: 18px !important;
  }
}

/* ══════════════════════════════════════════════════════════════════
   MOBİL KART HİYERARŞİSİ  ≤ 768px
   Hedef yapı:
     [Durum rozeti]                   [Tutar / Risk]
     Ana başlık (büyük, kalın)
     Alt bilgi: müşteri / tarih / belge no
     [Aç]  [Belge / Düzenle]  [Diğer]
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ─── GENEL KART RESET ─────────────────────────────────────────── */
  .offer-operation-table,
  .sales-order-operation-table,
  .customers-list-table {
    display: block !important;
    min-width: 0 !important;
  }
  .offer-operation-table thead,
  .sales-order-operation-table thead,
  .customers-list-table thead { display: none !important; }

  .offer-operation-table tbody,
  .sales-order-operation-table tbody,
  .customers-list-table tbody {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding: 2px 0 !important;
  }

  /* ─── TEKLİF KARTI ─────────────────────────────────────────────
     İstenen yapı:
       Satır 1: [Teklif No · Tarih]  (sol, ikincil)  [Durum rozeti] (sağ)
       Satır 2: [Müşteri Adı BIG]                     [Tutar BOLD]
       Satır 3: [Para Birimi / Tarih küçük]
       Satır 4: [Aç]  [Belge]  [Siparişe Çevir]
     Kolonlar: 1-TeklifNo  2-Müşteri  3-Tutar  4-Durum  5-Sonraki  6-İşlem */
  .offer-operation-table tr {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    gap: 0 !important;
    padding: 0 !important;
    border: 1px solid var(--line, #e2e8f0) !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 2px 6px rgba(0,0,0,.07) !important;
    overflow: hidden !important;
  }
  .offer-operation-table td { display: none !important; }

  /* Satır 1 sol: Teklif No + Tarih (ikincil, muted) */
  .offer-operation-table td.offer-no-cell {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    padding: 10px 8px 0 12px !important;
  }
  .offer-no-cell strong { font-size: .78rem !important; font-weight: 700 !important; color: var(--muted, #888) !important; }
  .offer-no-cell small  { font-size: .72rem !important; color: var(--muted, #888) !important; }
  .offer-no-cell a { color: var(--muted, #888) !important; text-decoration: none !important; }

  /* Satır 1 sağ: Durum rozeti */
  .offer-operation-table td:nth-child(4) {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    padding: 10px 12px 0 6px !important;
  }
  .offer-status-card {
    padding: 3px 9px !important;
    border-radius: 20px !important;
    font-size: .7rem !important;
    font-weight: 700 !important;
    display: inline-flex !important;
    align-items: center !important;
    white-space: nowrap !important;
  }
  .offer-status-card strong { font-size: .7rem !important; font-weight: 700 !important; }
  .offer-status-card small  { display: none !important; }

  /* Satır 2 sol: Müşteri Adı BIG */
  .offer-operation-table td:nth-child(2) {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    grid-column: 1 !important;
    grid-row: 2 !important;
    padding: 6px 8px 0 12px !important;
  }
  .offer-operation-table td:nth-child(2) strong,
  .offer-operation-table td:nth-child(2) a {
    font-size: 1.05rem !important;
    font-weight: 800 !important;
    color: var(--navy, #1e3a5f) !important;
    text-decoration: none !important;
    display: block !important;
  }
  .offer-operation-table td:nth-child(2) small { font-size: .72rem !important; color: var(--muted) !important; }

  /* Satır 2 sağ: Tutar BOLD */
  .offer-operation-table td.offer-amount-cell {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: center !important;
    grid-column: 2 !important;
    grid-row: 2 !important;
    padding: 6px 12px 0 6px !important;
    text-align: right !important;
  }
  .offer-amount-cell strong { font-size: 1.05rem !important; font-weight: 800 !important; color: var(--navy, #1e3a5f) !important; white-space: nowrap !important; }
  .offer-amount-cell small  { font-size: .7rem !important; color: var(--muted) !important; }

  /* Sonraki adım gizle */
  .offer-operation-table td.offer-next-step { display: none !important; }

  /* Satır 3: Aksiyon butonları */
  .offer-operation-table td.offer-action-cell {
    display: flex !important;
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    gap: 6px !important;
    padding: 10px 12px 12px !important;
    border-top: 1px solid #f0f4f8 !important;
    margin-top: 10px !important;
  }
  .offer-action-cell .btn {
    flex: 1 !important;
    min-height: 42px !important;
    font-size: .82rem !important;
    padding: 0 6px !important;
    border-radius: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .offer-action-cell .btn + .btn { margin-left: 6px !important; }

  /* Durum kartı küçük badge formatında */
  .offer-status-card {
    padding: 3px 8px !important;
    border-radius: 20px !important;
    font-size: .72rem !important;
    display: inline-flex !important;
    align-items: center !important;
  }
  .offer-status-card strong { font-size: .72rem !important; font-weight: 700 !important; }
  .offer-status-card small { display: none !important; }

  /* ─── CARİ KARTI ────────────────────────────────────────────────
     Tablo class: customers-list-table (customers/index.blade.php)
     Kolonlar: 1-Ünvan  2-Tip  3-Telefon  4-Şehir  5-Bakiye  6-row-actions */
  .customers-list-table tr {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    gap: 0 !important;
    padding: 0 !important;
    border: 1px solid var(--line, #e2e8f0) !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 1px 4px rgba(0,0,0,.06) !important;
    overflow: hidden !important;
    margin-bottom: 0 !important;
  }
  .customers-list-table td { display: none !important; }

  /* Tip (2) — sağ üst badge */
  .customers-list-table td.cell-type {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    padding: 10px 12px 0 !important;
    font-size: .72rem !important;
    font-weight: 700 !important;
    color: var(--muted) !important;
  }

  /* Ünvan (1) — ana başlık */
  .customers-list-table td:nth-child(1) {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    padding: 10px 8px 0 12px !important;
  }
  .customers-list-table td:nth-child(1) strong { font-size: 1rem !important; font-weight: 800 !important; }
  .customers-list-table td:nth-child(1) button.row-action-btn {
    font-size: 1rem !important;
    font-weight: 800 !important;
    text-align: left !important;
    padding: 0 !important;
    min-height: 0 !important;
    border: none !important;
  }
  .customers-list-table td:nth-child(1) button.row-action-btn:hover { text-decoration: underline; }

  /* Telefon (3) + Şehir (4) — alt bilgi satırı */
  .customers-list-table td.cell-phone,
  .customers-list-table td.cell-city {
    display: inline-flex !important;
    align-items: center !important;
    font-size: .78rem !important;
    color: var(--muted) !important;
    padding: 4px 0 0 !important;
  }
  .customers-list-table td.cell-phone { grid-column: 1; grid-row: 2; padding-left: 12px !important; }
  .customers-list-table td.cell-city  { grid-column: 2; grid-row: 2; padding-right: 12px !important; text-align: right; }

  /* Bakiye (5) */
  .customers-list-table td:nth-child(5) {
    display: flex !important;
    align-items: center !important;
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    padding: 4px 12px 0 !important;
    font-size: .9rem !important;
    font-weight: 700 !important;
    color: var(--navy, #1e3a5f) !important;
  }

  /* Aksiyon (6) */
  .customers-list-table td.row-actions {
    display: flex !important;
    grid-column: 1 / -1 !important;
    grid-row: 4 !important;
    gap: 6px !important;
    padding: 8px 12px 10px !important;
    border-top: 1px solid #f0f4f8 !important;
    margin-top: 8px !important;
  }
  .customers-list-table td.row-actions button,
  .customers-list-table td.row-actions a {
    flex: 1 !important;
    min-height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: .82rem !important;
    border: 1px solid var(--line) !important;
    border-radius: 8px !important;
    padding: 0 8px !important;
    text-decoration: none !important;
    min-width: 0 !important;
  }
}

/* ══════════════════════════════════════════════════════════════════
   MOBİL FİLTRE SİSTEMİ — global, tüm list-filter-bar formları
   ══════════════════════════════════════════════════════════════════ */

/* Desktop: mobil-only elemanları gizle */
.mob-show-only { display: none; }
.mob-dashboard { display: none; }
.mob-filter-bar   { display: none; }
.mob-filter-active{ display: none; }
.mob-filter-sheet { display: none; }
.mob-sheet-backdrop{ display: none; }
.mob-fab          { display: none; }

@media (max-width: 768px) {

  /* ── Orijinal filtre barını gizle ── */
  form.list-filter-bar { display: none !important; }

  /* ── Kompakt bar: [Arama] [Filtre] ── */
  .mob-filter-bar {
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 6px 0 4px;
  }
  .mob-filter-search-wrap { flex: 1; position: relative; }
  .mob-filter-search-input {
    width: 100%;
    height: 44px;
    padding: 0 12px;
    border: 1px solid var(--line, #e2e8f0);
    border-radius: 10px;
    font-size: 15px;
    background: #fff;
    outline: none;
    box-sizing: border-box;
  }
  .mob-filter-search-input:focus { border-color: var(--navy, #1e3a5f); }

  .mob-filter-toggle {
    flex-shrink: 0;
    height: 44px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    position: relative;
  }
  .mob-filter-count {
    background: var(--navy, #1e3a5f);
    color: #fff;
    border-radius: 99px;
    font-size: 10px;
    font-weight: 800;
    min-width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
  }

  /* ── Aktif filtre rozeti satırı ── */
  .mob-filter-active {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0 0 6px;
  }
  .mob-filter-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 99px;
    font-size: 11px;
    font-weight: 600;
    color: #1e40af;
    text-decoration: none;
  }
  .mob-filter-badge--clear {
    background: #fef2f2;
    border-color: #fecaca;
    color: #b91c1c;
  }

  /* ── Bottom sheet ── */
  .mob-sheet-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 1400;
    background: rgba(20,38,59,.45);
    opacity: 0;
    pointer-events: none;
    transition: opacity .25s;
  }
  .mob-sheet-backdrop.open {
    opacity: 1;
    pointer-events: auto;
  }

  .mob-filter-sheet {
    display: block;
    position: fixed;
    bottom: 0; left: 0; right: 0;
    z-index: 1500;
    background: #fff;
    border-radius: 20px 20px 0 0;
    box-shadow: 0 -8px 40px rgba(20,38,59,.18);
    transform: translateY(100%);
    transition: transform .3s cubic-bezier(.32,.72,0,1);
    max-height: 85dvh;
    display: flex;
    flex-direction: column;
  }
  .mob-filter-sheet.open { transform: translateY(0); }

  .mob-sheet-handle {
    width: 36px; height: 4px;
    background: #d1d5db;
    border-radius: 99px;
    margin: 10px auto 0;
    flex-shrink: 0;
  }
  .mob-sheet-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px 10px;
    border-bottom: 1px solid var(--line, #e2e8f0);
    flex-shrink: 0;
  }
  .mob-sheet-head strong { font-size: 15px; font-weight: 700; }
  .mob-sheet-close {
    width: 32px; height: 32px;
    border: 0; border-radius: 99px;
    background: #f1f5f9;
    font-size: 16px; font-weight: 700;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
  }

  .mob-sheet-body {
    flex: 1;
    overflow-y: auto;
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  .mob-sheet-field {
    display: flex;
    flex-direction: column;
    gap: 5px;
  }
  .mob-sheet-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--muted, #64748b);
  }
  .mob-sheet-field select,
  .mob-sheet-field input {
    height: 46px;
    font-size: 15px;
    padding: 0 12px;
    border: 1px solid var(--line, #e2e8f0);
    border-radius: 10px;
    background: #fff;
    width: 100%;
    box-sizing: border-box;
  }
  .mob-sheet-field select:focus,
  .mob-sheet-field input:focus {
    border-color: var(--navy, #1e3a5f);
    outline: none;
  }

  .mob-sheet-foot {
    display: flex;
    gap: 10px;
    padding: 12px 16px 24px;
    border-top: 1px solid var(--line, #e2e8f0);
    flex-shrink: 0;
  }
  .mob-sheet-foot .btn { flex: 1; height: 48px; font-size: 15px; font-weight: 700; border-radius: 12px; }
  .mob-sheet-apply { background: var(--navy, #1e3a5f) !important; color: #fff !important; border: 0 !important; }

  /* ── Sabit alt FAB: + Yeni buton ── */
  .mob-fab {
    display: flex;
    position: fixed;
    bottom: 72px; /* bottom nav üstünde */
    right: 16px;
    z-index: 900;
  }
  .mob-fab a, .mob-fab button {
    height: 52px;
    padding: 0 20px;
    border-radius: 26px;
    background: var(--navy, #1e3a5f);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    border: 0;
    box-shadow: 0 4px 20px rgba(20,38,59,.35);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    cursor: pointer;
  }

  /* Stat row: mobilde Yeni butonunu gizle (FAB olarak gösterilecek) */
  .list-stat-row .mob-hide-on-mobile { display: none !important; }
  .mob-hide-on-mobile { display: none !important; }
  .mob-show-only { display: flex !important; }
}

/* ── Diğer dropdown menüsü ── */
.mob-more-btn { display: none; }
.mob-more-menu { display: none; }

@media (max-width: 768px) {
  .mob-more-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 36px !important;
    min-height: 36px !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    border-radius: 8px !important;
    flex-shrink: 0;
  }

  .mob-more-menu {
    display: none;
    position: absolute;
    right: 0;
    bottom: calc(100% + 4px);
    background: #fff;
    border: 1px solid var(--line, #e2e8f0);
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(20,38,59,.18);
    min-width: 160px;
    z-index: 1350;
    overflow: hidden;
    flex-direction: column;
  }
  .mob-more-menu.open { display: flex; }

  .mob-more-item,
  .mob-more-menu form button,
  .mob-more-menu a {
    display: block !important;
    width: 100% !important;
    padding: 12px 16px !important;
    text-align: left !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #dc2626 !important;
    cursor: pointer !important;
    text-decoration: none !important;
    border-top: 1px solid var(--line, #e2e8f0) !important;
    box-sizing: border-box !important;
  }
  .mob-more-menu > *:first-child .mob-more-item,
  .mob-more-menu > a:first-child,
  .mob-more-menu > form:first-child button { border-top: 0 !important; }

  /* Aksiyon hücresine relative ekle */
  td.row-actions, td.offer-action-cell { position: relative !important; }
}

/* ══════════════════════════════════════════════════════════════════
   SAYFA BAZLI MOBİL KART İYİLEŞTİRMELERİ
   ══════════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {

  /* ════════════════════════════════
     SATIŞ SİPARİŞLERİ — kart yapısı
     ════════════════════════════════ */

  /* Sipariş No + Durum yan yana (satır 1) */
  .sales-order-operation-table td:nth-child(1) {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-bottom: 6px !important;
    border-bottom: 1px solid #f0f0f0 !important;
  }
  .sales-order-operation-table td:nth-child(1) .order-no-cell,
  .sales-order-operation-table .order-no-cell { width: auto !important; }

  /* Aksiyon: Aç + Sevk Edildi büyük, Belge tam genişlik */
  .order-action-cell { flex-direction: row !important; flex-wrap: wrap !important; }
  .order-action-cell .btn {
    flex: 1 1 auto !important;
    min-height: 44px !important;
    font-size: .85rem !important;
    font-weight: 700 !important;
  }
  /* Sevk Edildi butonu yeşil ve öne çıksın */
  .order-action-cell .btn[style*="0f766e"] {
    flex: 1 1 100% !important;
    order: -1 !important;
    font-size: .9rem !important;
    min-height: 48px !important;
  }
  /* Belge details tam genişlik */
  .order-action-cell .row-document-menu {
    flex: 1 1 100% !important;
    border: 1px solid var(--line) !important;
    border-radius: 8px !important;
  }
  .order-action-cell .row-document-menu summary {
    padding: 10px 14px !important;
    font-size: .85rem !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    list-style: none !important;
  }

  /* ════════════════════════════════
     CARİ — 360° öne çık
     ════════════════════════════════ */
  .customers-list-table td.row-actions {
    flex-direction: row !important;
  }
  /* 360° ilk buton → tam genişlik yeşil */
  .customers-list-table td.row-actions button:first-child,
  .customers-list-table td.row-actions .row-action-btn:first-child {
    flex: 2 !important;
    background: var(--navy, #1e3a5f) !important;
    color: #fff !important;
    border-color: var(--navy, #1e3a5f) !important;
    font-weight: 800 !important;
    font-size: .9rem !important;
    min-height: 44px !important;
  }

  /* ════════════════════════════════
     STOK — Sayım Gir büyük
     ════════════════════════════════ */
  .products-list-table td.row-actions .row-action-btn:first-child,
  td.row-actions button[onclick*="openStockModal"] {
    background: var(--navy, #1e3a5f) !important;
    color: #fff !important;
    border-color: var(--navy, #1e3a5f) !important;
    flex: 2 !important;
    min-height: 44px !important;
    font-weight: 700 !important;
  }

  /* ════════════════════════════════
     SEVKİYAT — büyük ikonlu butonlar
     ════════════════════════════════ */
  .shipments-table { display: block !important; min-width: 0 !important; }
  .shipments-table thead { display: none !important; }
  .shipments-table tbody { display: flex !important; flex-direction: column !important; gap: 10px !important; padding: 6px !important; }
  .shipments-table tr {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    border: 1px solid var(--line) !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 1px 4px rgba(0,0,0,.06) !important;
    overflow: hidden !important;
    padding: 0 !important;
    gap: 0 !important;
  }
  .shipments-table td { display: none !important; padding: 0 !important; }

  /* Sevkiyat no + tarih */
  .shipments-table td:nth-child(1) {
    display: flex !important;
    flex-direction: column !important;
    grid-column: 1 !important; grid-row: 1 !important;
    padding: 10px 12px 0 !important;
  }
  .shipments-table td:nth-child(1) strong { font-size: 1rem !important; font-weight: 800 !important; }
  .shipments-table td:nth-child(1) small { font-size: .72rem !important; color: var(--muted) !important; }

  /* Sevk durumu — sağ üst */
  .shipments-table td:nth-child(6) {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: flex-end !important;
    grid-column: 2 !important; grid-row: 1 / 3 !important;
    padding: 10px 10px 0 6px !important;
  }
  .svk-toggle {
    padding: 4px 10px !important;
    border-radius: 20px !important;
    font-size: .72rem !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    min-height: 0 !important;
  }
  .svk-toggle.shipped { background: #ecfdf5 !important; border-color: #b7e4d2 !important; color: #065f46 !important; }
  .svk-toggle.ready { background: #eff6ff !important; border-color: #bfdbfe !important; color: #1e40af !important; }

  /* Müşteri / Sipariş */
  .shipments-table td:nth-child(2) {
    display: flex !important;
    flex-direction: column !important;
    grid-column: 1 !important; grid-row: 2 !important;
    padding: 4px 12px 0 !important;
  }
  .shipments-table td:nth-child(2) strong { font-size: .95rem !important; font-weight: 700 !important; color: var(--navy) !important; }

  /* Belgeler — büyük butonlar tam genişlik */
  .shipments-table td.compact-actions {
    display: flex !important;
    grid-column: 1 / -1 !important; grid-row: 3 !important;
    gap: 6px !important;
    padding: 10px 12px 12px !important;
    border-top: 1px solid #f0f4f8 !important;
    margin-top: 8px !important;
  }
  .compact-actions a {
    flex: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px !important;
    border: 1px solid var(--line) !important;
    border-radius: 8px !important;
    font-size: .82rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    color: var(--text) !important;
    background: #f8fafc !important;
    padding: 0 8px !important;
  }
  /* WA butonu yeşil */
  .compact-actions a[href*="wa.me"] {
    background: #ecfdf5 !important;
    border-color: #b7e4d2 !important;
    color: #065f46 !important;
  }
  /* İrsaliye / Etiket mavi */
  .compact-actions a:not([href*="wa.me"]) {
    background: #eff6ff !important;
    border-color: #bfdbfe !important;
    color: #1e40af !important;
  }

  /* ════════════════════════════════
     TAHSİLAT/ÖDEME — modal tek kolon
     ════════════════════════════════ */
  [id*="payment-modal"] .erp-form-grid,
  [id*="tahsilat"] .erp-form-grid,
  .payment-form-grid {
    grid-template-columns: 1fr !important;
  }
  [id*="payment-modal"] input,
  [id*="payment-modal"] select,
  [id*="payment-modal"] textarea,
  [id*="tahsilat"] input,
  [id*="tahsilat"] select {
    font-size: 16px !important;
    min-height: 44px !important;
  }
}

/* ══ MOBİL: Sevkiyat link-btn dokunma alanı ══ */
@media (max-width: 768px) {
  .link-btn {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    min-height: 34px;
    border-radius: 6px;
    background: var(--soft, #f1f5f9);
    text-decoration: none !important;
    font-size: 12px;
    line-height: 1.2;
  }
}

/* ══ MOBİL: Laravel Pagination ══ */
@media (max-width: 768px) {
  /* ul.pagination li'leri gizle (sayı linkleri) */
  ul.pagination { display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: nowrap; }
  ul.pagination li { display: none !important; }
  /* Önceki / Sonraki ve aktif sayfa göster */
  ul.pagination li:first-child,
  ul.pagination li:last-child,
  ul.pagination li.active { display: flex !important; }
  ul.pagination li a,
  ul.pagination li span {
    display: inline-flex;
    align-items: center;
    padding: 8px 16px;
    min-height: 40px;
    border-radius: 8px;
    border: 1px solid var(--line, #e2e8f0);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    background: #fff;
    color: var(--navy, #1e3a5f);
  }
  ul.pagination li.active span { background: var(--navy, #1e3a5f); color: #fff; border-color: var(--navy, #1e3a5f); }
  ul.pagination li.disabled span { color: var(--muted, #94a3b8); background: var(--soft, #f8fafc); }
}

/* ══════════════════════════════════════════════════════════════
   MOBİL SAYI / KART STANDARDI  (≤ 768px)
   ──────────────────────────────────────────────────────────────
   Tek kaynak doğrusu — tüm sayısal bileşenler burada normalize edilir.
   Başka dosyalarda font-size override yazmayın.

   Skala:
     Alt açıklama / etiket min : 11–12px
     Liste istatistik değeri   : 15px   (.list-stat strong)
     Kart içi tutar            : 16px   (.dash-kpi-card strong)
     KPI ana rakam             : 18px   (.kpi-val, .mob-ops-card strong, vb.)
     Büyük toplam              : 20px   (.summary-row.grand strong)
══════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ── 1. Dashboard mob-ops-bar ───────────────────────────────
     Taşmayı engellemek için ikon küçüldü, metin clip'lendi.      */
  .mob-ops-bar { gap: 6px !important; }
  .mob-ops-card {
    gap: 8px !important;
    padding: 10px 10px !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }
  .mob-ops-icon { font-size: 20px !important; flex-shrink: 0 !important; }
  .mob-ops-info { min-width: 0 !important; overflow: hidden !important; }
  .mob-ops-card strong {
    font-size: 18px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: block !important;
  }
  .mob-ops-card span {
    font-size: 11px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: block !important;
  }

  /* ── 1b. Mobil Dashboard ── */
  .mob-dashboard { display: block; }

  /* KPI 2×2 grid */
  .mob-kpi-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 14px;
  }
  .mob-kpi-box {
    background: #fff; border: 1.5px solid var(--line,#e2e8f0); border-radius: 14px;
    padding: 16px 14px; text-decoration: none; color: inherit;
    display: flex; flex-direction: column; gap: 4px;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
    min-height: 80px;
  }
  .mob-kpi-box.mob-kpi-ok   { border-color: #86efac; background: #f0fdf4; }
  .mob-kpi-box.mob-kpi-warn { border-color: #fca5a5; background: #fff5f5; }
  .mob-kpi-val { font-size: 30px; font-weight: 900; color: var(--navy,#1e3a5f); line-height: 1; }
  .mob-kpi-lbl { font-size: 13px; color: var(--muted,#64748b); font-weight: 600; margin-top: 2px; }
  .mob-kpi-sub { font-size: 12px; color: var(--green,#059669); font-weight: 600; }
  .mob-kpi-box.mob-kpi-warn .mob-kpi-val { color: #dc2626; }
  .mob-kpi-grid--2 { margin-top: -4px; }
  .mob-kpi-val--sm { font-size: 22px !important; font-weight: 900 !important; }
  .mob-kpi-lbl { order: -1; }

  /* Kısayollar: yatay scroll */
  .mob-shortcuts {
    display: flex; gap: 10px; overflow-x: auto; padding: 2px 0 8px; margin-bottom: 14px;
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .mob-shortcuts::-webkit-scrollbar { display: none; }
  .mob-shortcut {
    flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: 6px;
    background: #fff; border: 1.5px solid var(--line,#e2e8f0); border-radius: 14px;
    padding: 14px 16px; text-decoration: none; color: var(--navy,#1e3a5f);
    font-size: 13px; font-weight: 700; white-space: nowrap;
    min-width: 72px; min-height: 72px; text-align: center;
    justify-content: center;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
  }
  .mob-shortcut:active { background: #f0f4f8; }
  .mob-sc-ico { font-size: 24px; }

  /* Son işlemler */
  .mob-recents {
    background: #fff; border: 1.5px solid var(--line,#e2e8f0);
    border-radius: 14px; overflow: hidden; margin-bottom: 14px;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
  }
  .mob-recents-head {
    padding: 12px 16px; font-size: 13px; font-weight: 800;
    color: var(--navy,#1e3a5f); border-bottom: 1px solid var(--line,#e2e8f0);
    text-transform: uppercase; letter-spacing: .04em;
  }
  .mob-recent-row {
    display: flex; align-items: center; gap: 12px; padding: 14px 16px;
    min-height: 56px;
    border-bottom: 1px solid var(--line,#e2e8f0); text-decoration: none; color: inherit;
  }
  .mob-recent-row:last-child { border-bottom: none; }
  .mob-recent-row:active { background: #f8fafc; }
  .mob-recent-icon { font-size: 22px; flex-shrink: 0; }
  .mob-recent-info { flex: 1; min-width: 0; }
  .mob-recent-info strong { display: block; font-size: 15px; font-weight: 700; color: var(--navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mob-recent-info span   { font-size: 13px; color: var(--muted); }
  .mob-recent-right { text-align: right; flex-shrink: 0; }
  .mob-recent-right strong { display: block; font-size: 15px; font-weight: 800; color: var(--navy); }
  .mob-recent-right span   { font-size: 12px; color: var(--muted); }

  /* ── 2. Liste üstü istatistik satırı ───────────────────────
     white-space: nowrap kaldırıldı, wrap izni verildi.            */
  .list-stat-row { flex-wrap: wrap !important; gap: 6px 12px !important; }
  .list-stat { font-size: 12px !important; white-space: normal !important; }
  .list-stat strong { font-size: 15px !important; }

  /* ── 3. Muhasebe KPI (acc-kpi / kpi-*) ─────────────────────  */
  .kpi-lbl { font-size: 11px !important; }
  .kpi-val { font-size: 18px !important; }
  .kpi-sub { font-size: 12px !important; }

  /* ── 4. Muhasebe hızlı kısayollar / yaşlandırma ────────────  */
  .aq-sub { font-size: 12px !important; }
  .acc-aging-pct { font-size: 12px !important; }
  .acc-aging-badge { font-size: 11px !important; }
  .acc-stack-item small { font-size: 12px !important; }

  /* ── 5. Dashboard dash-kpi-card ────────────────────────────  */
  .dash-kpi-card strong { font-size: 16px !important; }
  .dash-kpi-card span   { font-size: 12px !important; white-space: normal !important; }
  .dash-kpi-card small  { font-size: 12px !important; }
  .dash-rate-detail small { font-size: 12px !important; }

  /* ── 6. Cari 360° KPI ──────────────────────────────────────  */
  .c360-kpi-label { font-size: 11px !important; }
  .c360-kpi-value { font-size: 18px !important; }
  .c360-flow-step span,
  .c360-flow-step small { font-size: 12px !important; }

  /* ── 7. Rapor KPI ──────────────────────────────────────────  */
  .rpt-kpi-value { font-size: 18px !important; }
  .rpt-mini-kpi strong { font-size: 16px !important; }

  /* ── 8. KDV Özeti KPI ──────────────────────────────────────  */
  .kdv-kpi strong { font-size: 18px !important; }
  .kdv-kpi small  { font-size: 12px !important; }

  /* ── 9. Teklif özet / grand-total ──────────────────────────
     offer.css'teki 1.05rem override'ını ezer.                    */
  .summary-row.grand strong { font-size: 20px !important; }
  .summary-row span { font-size: 12px !important; }
  .summary-row strong { font-size: 13px !important; }
  .summary-row.grand strong { font-size: 20px !important; }
}

/* ══ MOBİL MENÜ LİSTESİ (sidebar içinde) ══════════════════════════ */

/* Desktop: mob-menu-list gizli, erp-nav görünür */
.mob-menu-list { display: none; }

@media (max-width: 768px) {
  /* Sidebar'ın üst kısmı: logo + search → sade tut */
  .sidebar .brand { padding: 12px 14px 10px; }
  .sidebar .quick-search-form { margin: 0 12px 8px; }

  /* erp-nav gizle, mob-menu-list göster */
  .sidebar .erp-nav { display: none !important; }
  .sidebar .sidebar-footer { display: none !important; }
  .mob-menu-list {
    display: flex !important;
    flex-direction: column;
    overflow-y: auto;
    flex: 1;
    padding: 4px 0 80px;
  }

  /* Her satır */
  .mml-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 16px;
    min-height: 60px;
    border-bottom: 1px solid #f0f0f0;
    text-decoration: none;
    color: #111;
    background: #fff;
    -webkit-tap-highlight-color: transparent;
  }
  .mml-row:first-child { border-top: 1px solid #f0f0f0; }
  .mml-row:active { background: #f2f2f7; }
  .mml-row.mml-active { background: #f0f7ff; }
  .mml-row.mml-active .mml-title { color: #1c3557; }
  .mml-row.mml-active .mml-ico { background: #dbeafe; color: #1c3557; }

  /* İkon kutusu: 36px, renkli arka plan */
  .mml-ico {
    flex-shrink: 0;
    width: 36px; height: 36px;
    background: #1c3557;
    border-radius: 9px;
    display: flex; align-items: center; justify-content: center;
    color: #fff;
  }
  .mml-ico svg { width: 18px; height: 18px; }

  /* Modüle özgü ikon renkleri */
  .mml-ico--blue   { background: #2563eb; }   /* Müşteriler */
  .mml-ico--indigo { background: #4f46e5; }   /* Teklifler */
  .mml-ico--navy   { background: #1c3557; }   /* Siparişler */
  .mml-ico--cyan   { background: #0891b2; }   /* Sevkiyat */
  .mml-ico--violet { background: #7c3aed; }   /* Satın Alma */
  .mml-ico--orange { background: #ea580c; }   /* Ürünler */
  .mml-ico--amber  { background: #d97706; }   /* Stok */
  .mml-ico--green  { background: #16a34a; }   /* Tahsilat */
  .mml-ico--rose   { background: #e11d48; }   /* Masraf */
  .mml-ico--teal   { background: #0d9488; }   /* Üretim */
  .mml-ico--gray   { background: #4b5563; }   /* Diğer */

  /* Aktif satır ikonu rengi korunur (sadece opacity düşer) */
  .mml-row.mml-active .mml-ico { opacity: 1; }

  /* Başlık + açıklama */
  .mml-body {
    flex: 1;
    display: flex; flex-direction: column; gap: 1px;
    min-width: 0;
  }
  .mml-title {
    font-size: 15px; font-weight: 600;
    color: #111;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .mml-desc {
    font-size: 12px; color: #9ca3af;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }

  /* Sağ ok: Apple chevron stili */
  .mml-arrow {
    flex-shrink: 0;
    font-size: 18px; font-weight: 400;
    color: #c7c7cc;
    line-height: 1;
  }

  /* Bildirim izin satırı */
  .mml-notif-row { display:flex; align-items:center; gap:12px; padding:14px 16px; border-bottom:1px solid #f1f5f9; }
  .mml-notif-body { flex:1; display:flex; flex-direction:column; gap:2px; }
  .mml-notif-btn { padding:7px 14px; border-radius:10px; border:none; font-size:12px; font-weight:700; cursor:pointer; background:#0a84ff; color:#fff; white-space:nowrap; font-family:inherit; }
  .mml-notif-btn.granted { background:#f0fff4; color:#1a7f2e; }
  .mml-notif-btn.denied  { background:#fff2f2; color:#c0392b; cursor:default; }
  .mml-ico--orange { background:#fff8ee; color:#ff9500; }

  /* Alt: çıkış butonu */
  .mml-footer {
    padding: 16px 16px 8px;
    margin-top: auto;
  }
  .mml-logout {
    width: 100%;
    padding: 12px;
    border: 1.5px solid var(--line, #e2e8f0);
    border-radius: 10px;
    background: #fff;
    font-size: 14px; font-weight: 600;
    color: var(--muted, #64748b);
    cursor: pointer;
  }
}

/* ══════════════════════════════════════════════════════════════════
   MOBİL GÖRSEL STANDARTLAR — v1
   Bu blok her zaman en sonda olmalı; diğer tüm mobil kuralları ezer.
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ══════════════════════════════════════════════
     TİPOGRAFİ STANDARDI (Mobil)
     ══════════════════════════════════════════════
     Sayfa başlığı   : 22px / 800
     Kart başlığı    : 16px / 700
     Ana rakam       : 22–26px / 700
     Normal metin    : 14px / 400
     Yardımcı metin  : 12px / 400
     Rozet           : 11px / 600
  */

  /* Sayfa başlığı: 22px */
  .page-title,
  .mob-page-title { font-size: 22px !important; font-weight: 800 !important; letter-spacing: -0.3px; }

  /* Kart / bölüm başlığı: 16px */
  .section-title,
  .panel > h2,
  .panel > h3,
  .card-title,
  .module-card h3,
  h2.section-title,
  .mob-card-title { font-size: 16px !important; font-weight: 700 !important; }

  /* Ana rakam (KPI, tutar, özet sayı): 24px */
  .mob-kpi-val,
  .mob-big-num,
  .rpm-val,
  .kpi-value { font-size: 24px !important; font-weight: 700 !important; letter-spacing: -0.5px; }

  /* Normal metin: 14px */
  body,
  .mob-normal,
  .mob-card p,
  td, th,
  label { font-size: 14px !important; }
  /* iOS zoom önleme: input/select/textarea min 16px olmalı */
  input, select, textarea { font-size: 16px !important; }

  /* Yardımcı / ikincil metin: 12px */
  .section-sub,
  .list-stat,
  small,
  .muted,
  .sk-sub,
  .mob-kpi-lbl,
  .mob-recent-info span,
  .mob-desc,
  .mob-helper,
  .mob-meta { font-size: 12px !important; color: var(--muted, #64748b); }

  /* Rozet / etiket: 11px */
  .badge,
  .status-badge,
  .mob-badge,
  .prdc-badge,
  .dg-chip,
  .rpm-delta,
  .doc-type-badge { font-size: 11px !important; font-weight: 600 !important; }

  /* ══════════════════════════════════════════════
     RENK STANDARDI (Mobil)
     ══════════════════════════════════════════════
     Arka plan    : #f2f2f7  (açık gri, Apple system)
     Kart         : #ffffff
     Ana vurgu    : #1c3557  (Fanpo lacivert)
     Başarılı     : #16a34a  (yeşil — sadece kaydet/oluştur/onay)
     Uyarı        : #d97706  (amber)
     Risk         : #dc2626  (kırmızı)
     Bilgi        : #2563eb  (mavi)
     Metin        : #111827
     İkincil metin: #6b7280
     Ayraç        : #e5e7eb

     KURAL: Yeşil yalnızca CREATE / SAVE / APPROVE eylemlerinde
     kullanılır. Durum renkleri için amber/kırmızı/mavi tercih edilir.
  */

  /* ── Genel sayfa zemini ── */
  body { background: #f2f2f7 !important; }

  /* ── Kart / panel zemini ── */
  .card,
  .mob-card,
  .panel,
  .prdc-card,
  .dg-card,
  .doc-card,
  .pay-card,
  .rpm-card { background: #ffffff !important; }

  /* ── Durum rozetleri — renk semantiği ── */
  /* Başarılı / tamamlandı / onaylandı */
  .badge--success, .status--success,
  .badge-success, .status-badge.success,
  [class*="status"][class*="ödendi"],
  [class*="status"][class*="tamamlandi"],
  [class*="status"][class*="onaylandi"] {
    background: #dcfce7 !important; color: #15803d !important;
  }
  /* Uyarı / beklemede / bekliyor */
  .badge--warn, .status--warn,
  .badge-warning, .status-badge.warn,
  [class*="status"][class*="bekle"] {
    background: #fef3c7 !important; color: #92400e !important;
  }
  /* Risk / iptal / gecikmiş */
  .badge--danger, .status--danger,
  .badge-danger, .status-badge.danger,
  [class*="status"][class*="iptal"],
  [class*="status"][class*="gecikmis"] {
    background: #fee2e2 !important; color: #991b1b !important;
  }
  /* Bilgi / taslak / pasif */
  .badge--info, .status--info,
  .badge-info, .status-badge.info {
    background: #dbeafe !important; color: #1e40af !important;
  }
  /* Nötr / işlemde / hazırlanıyor */
  .badge--neutral, .status--neutral,
  .badge-secondary, .status-badge.neutral {
    background: #f3f4f6 !important; color: #374151 !important;
  }

  /* ── Yanlış yeşil kullanımlarını düzelt ── */
  /* Quick-action, header, navigasyon butonları lacivert kalmalı */
  .mob-quick-btn:not(.green-action) { background: #f2f2f7 !important; color: #1c3557 !important; }
  /* Yeşil FAB sadece gerçek oluşturma eylemi için (class .green ile işaretlenmiş) */
  .mob-fab:not(.green) { background: #1c3557 !important; }

  /* ── Uyarı kartları — sol kenar rengi ── */
  .dg-card--danger { border-left-color: #dc2626 !important; }
  .dg-card--warn   { border-left-color: #d97706 !important; }
  .dg-card--info   { border-left-color: #2563eb !important; }

  /* ══════════════════════════════════════════════
     BUTON STANDARDI (Mobil)
     ══════════════════════════════════════════════

     ANAKİLİT PRENSİPLERİ:
       • Her tıklanabilir alan min 44×44px
       • Ana işlem  → .mob-btn-primary   (lacivert #1c3557)
       • İkincil    → .mob-btn-secondary (açık zemin, kenarlı)
       • Riskli     → .mob-btn-danger    (kırmızı, SADECE detay sayfalarında)
       • Liste kart → sadece "Aç ›" chevron (no extra buttons)
       • Diğer seç  → .mob-btn-more "⋯" (44×44 yuvarlak)
  */

  /* ── GLOBAL: Tüm .btn'ler mobilde min 44px ── */
  .btn,
  button.btn { min-height: 44px !important; }
  .btn.compact,
  button.btn.compact { min-height: 44px !important; padding: 10px 16px !important; font-size: 14px !important; }

  /* ── MOBİL BUTON SİSTEMİ ── */

  /* Birincil: lacivert dolu */
  .mob-btn-primary {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    min-height: 44px; padding: 0 20px; border-radius: 12px;
    background: #1c3557; color: #fff; border: none;
    font-size: 15px; font-weight: 700; font-family: inherit;
    cursor: pointer; text-decoration: none; white-space: nowrap;
    -webkit-tap-highlight-color: transparent;
  }
  .mob-btn-primary:active { opacity: .82; }

  /* Birincil yeşil (tahsilat, kaydet vb.) */
  .mob-btn-green {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    min-height: 44px; padding: 0 20px; border-radius: 12px;
    background: #059669; color: #fff; border: none;
    font-size: 15px; font-weight: 700; font-family: inherit;
    cursor: pointer; text-decoration: none; white-space: nowrap;
    -webkit-tap-highlight-color: transparent;
  }
  .mob-btn-green:active { opacity: .82; }

  /* İkincil: açık zemin + kenarlı */
  .mob-btn-secondary {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    min-height: 44px; padding: 0 18px; border-radius: 12px;
    background: #f2f2f7; color: #1c3557; border: 1px solid #e5e7eb;
    font-size: 15px; font-weight: 600; font-family: inherit;
    cursor: pointer; text-decoration: none; white-space: nowrap;
    -webkit-tap-highlight-color: transparent;
  }
  .mob-btn-secondary:active { background: #e5e7eb; }

  /* Riskli: kırmızı — SADECE detay sayfası için */
  .mob-btn-danger {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    min-height: 44px; padding: 0 18px; border-radius: 12px;
    background: #fee2e2; color: #dc2626; border: 1px solid #fecaca;
    font-size: 15px; font-weight: 600; font-family: inherit;
    cursor: pointer; text-decoration: none; white-space: nowrap;
    -webkit-tap-highlight-color: transparent;
  }
  .mob-btn-danger:active { background: #fecaca; }

  /* "⋯" daha fazla butonu */
  .mob-btn-more {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; border-radius: 12px;
    background: #f2f2f7; color: #555; border: 1px solid #e5e7eb;
    font-size: 20px; font-weight: 400; font-family: inherit;
    cursor: pointer; flex-shrink: 0;
    -webkit-tap-highlight-color: transparent;
  }
  .mob-btn-more:active { background: #e5e7eb; }

  /* Full-width buton (form kaydet, sheet aksiyon) */
  .mob-btn-primary.full,
  .mob-btn-green.full,
  .mob-btn-secondary.full,
  .mob-btn-danger.full {
    width: 100%; border-radius: 14px; min-height: 52px; font-size: 17px;
  }

  /* ── LİSTE KART ÇEVRON (sadece Aç ›) ── */
  .mob-card-chev {
    font-size: 20px; color: #c7c7cc;
    flex-shrink: 0; margin-left: auto; padding-left: 8px;
  }

  /* ── TABLO / SAYFA İÇİ .btn.compact: liste sayfasında küçük tutulabilir ──
     Sadece masaüstü hedefli data-table içindeki hücreler — mobile'da gizli */
  .data-table .btn.compact,
  .compact-actions .btn,
  .row-actions .btn {
    display: none !important; /* Mobilde tablo zaten gizli, butonlar gereksiz */
  }

  /* ── BOTTOM-SHEET AKSİYON BARI ── */
  .mob-action-bar {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 100;
    background: #fff; border-top: 1px solid #f0f0f0;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
    display: flex; gap: 8px;
  }
  .mob-action-bar .mob-btn-primary { flex: 1; }
  .mob-action-bar .mob-btn-secondary { flex: 1; }

  /* ── FAB (Floating Action Button) ── */
  .mob-fab {
    position: fixed; right: 16px; bottom: calc(76px + env(safe-area-inset-bottom, 0px));
    z-index: 150;
    display: inline-flex; align-items: center; gap: 8px;
    height: 52px; padding: 0 20px; border-radius: 26px;
    background: #1c3557; color: #fff; border: none;
    font-size: 15px; font-weight: 700; font-family: inherit;
    cursor: pointer; box-shadow: 0 4px 16px rgba(28,53,87,.35);
    -webkit-tap-highlight-color: transparent;
  }
  .mob-fab:active { opacity: .85; transform: scale(.97); }
  .mob-fab.green { background: #059669; box-shadow: 0 4px 16px rgba(5,150,105,.35); }

  /* ── QUICK ACTION GRID (detay sayfası kısa işlem butonları) ── */
  .mob-quick-actions {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
    padding: 12px 16px;
  }
  .mob-quick-btn {
    display: flex; flex-direction: column; align-items: center;
    gap: 5px; padding: 10px 4px; background: #fff;
    border-radius: 12px; border: none; cursor: pointer;
    font-size: 11px; font-weight: 600; color: #1c3557;
    text-decoration: none; text-align: center;
    box-shadow: 0 1px 3px rgba(0,0,0,.06); min-height: 56px;
    -webkit-tap-highlight-color: transparent;
  }
  .mob-quick-btn svg { width: 22px; height: 22px; }
  .mob-quick-btn:active { background: #f2f2f7; }

  /* ── KART / PANEL İÇ BOŞLUĞU: 14px ────────────────────────── */
  .panel { padding: 14px !important; }
  .data-table tr { padding: 12px 14px !important; }

  /* ── SAYFA YAN BOŞLUĞU: 14px ───────────────────────────────── */
  .page-body { padding-left: 14px !important; padding-right: 14px !important; }
  .page-body:has(.list-page-layout) { padding-left: 14px !important; padding-right: 14px !important; }
  .list-page-header { padding-left: 0 !important; padding-right: 0 !important; }

  /* ── ALT MENÜ: güvenli alan desteği (iPhone çentik) ─────────── */
  .mobile-bottom-nav {
    height: calc(62px + env(safe-area-inset-bottom, 0px)) !important;
    padding-bottom: env(safe-area-inset-bottom, 0px) !important;
  }
  .page-body { padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)) !important; }
  .page-body:has(.list-page-layout) { padding-bottom: 0 !important; }
  .list-page-table { padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)) !important; }
  /* Offer form: yan padding kaldır, form tam genişlik aksın */
  .page-body:has(.offer-workspace) { padding: 0 !important; }
  .page-body:has(.offer-workspace) .mobile-bottom-nav { display: none !important; }
  /* Offer steps bar tam genişlik */
  .ofw-steps { width: 100% !important; box-sizing: border-box !important; }

  /* Cari sayfası: iç scroll yerine body scroll */
  .page-body:has(.erp-grid.two) {
    overflow-y: visible !important;
    height: auto !important;
  }
  .page-body:has(.erp-grid.two) .table-wrap {
    overflow-x: auto !important;
    overflow-y: visible !important;
    max-height: none !important;
  }

  /* Menü sidebar: yatay scroll engelle */
  .mob-menu-list { overflow-x: hidden !important; }
  .mml-row { max-width: 100% !important; box-sizing: border-box !important; }
  .mml-label, .mml-desc { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }

  /* ── PARA / SAYISAL FORMAT ──────────────────────────────────── */
  /* .mob-amount sınıfı: tutarlı para gösterimi için yardımcı sınıf  */
  .mob-amount {
    font-variant-numeric: tabular-nums;
    letter-spacing: -.3px;
    white-space: nowrap;
  }
  /* Büyük ana rakam (KPI kutuları) */
  .mob-kpi-val,
  .mob-kpi-box .mob-kpi-val { font-size: 20px !important; font-weight: 800 !important; line-height: 1.1 !important; }
  /* Orta rakam (kart içi tutar) */
  .mob-amount-md { font-size: 14px !important; font-weight: 700 !important; }
  /* Küçük yardımcı rakam */
  .mob-amount-sm { font-size: 12px !important; font-weight: 600 !important; color: var(--muted, #64748b) !important; }

  /* ── STATUS PİL / ROZET boyut standardı ─────────────────────── */
  .status-pill,
  .line-badge {
    font-size: 11px !important;
    padding: 2px 8px !important;
    border-radius: 20px !important;
  }

  /* ── INPUT yüksekliği (iOS zoom önleme + dokunma hedefi) ──────  */
  input[type="text"],
  input[type="number"],
  input[type="date"],
  input[type="email"],
  input[type="search"],
  input[type="tel"],
  select { min-height: 44px !important; font-size: 16px !important; }
  textarea { font-size: 16px !important; }

  /* ── TAHSİLAT listesi kart görünümü ─── */
  .payments-list-table { display: block !important; min-width: 0 !important; }
  .payments-list-table thead { display: none !important; }
  .payments-list-table tbody { display: flex !important; flex-direction: column !important; gap: 8px !important; padding: 4px 0 !important; }
  .payments-list-table tr { display: grid !important; grid-template-columns: 1fr auto !important; grid-template-rows: auto auto auto !important; gap: 4px 8px !important; padding: 12px 14px !important; background: #fff !important; border: 1px solid var(--line, #e2e8f0) !important; border-radius: 12px !important; box-shadow: 0 1px 3px rgba(0,0,0,.05) !important; }
  .payments-list-table td { display: none !important; padding: 0 !important; }
  .payments-list-table td:nth-child(2) { display: flex !important; align-items: center !important; grid-column: 1; grid-row: 1; font-size: 15px !important; font-weight: 700 !important; }
  .payments-list-table td:nth-child(4) { display: flex !important; align-items: center !important; justify-content: flex-end !important; grid-column: 2; grid-row: 1; font-size: 14px !important; font-weight: 700 !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .payments-list-table td:nth-child(1) { display: flex !important; align-items: center !important; grid-column: 1; grid-row: 2; font-size: 12px !important; color: var(--muted) !important; }
  .payments-list-table td:nth-child(6) { display: flex !important; align-items: center !important; justify-content: flex-end !important; grid-column: 2; grid-row: 2; font-size: 12px !important; color: var(--muted) !important; }
  .payments-list-table td:nth-child(10) { display: flex !important; grid-column: 1/-1; grid-row: 3; gap: 6px !important; border-top: 1px solid #f1f5f9 !important; padding-top: 8px !important; margin-top: 4px !important; }
  .payments-list-table td:nth-child(10) a { padding: 7px 12px !important; border: 1.5px solid var(--line) !important; border-radius: 8px !important; font-size: 12px !important; font-weight: 600 !important; text-decoration: none !important; color: var(--navy) !important; }

  /* ── SATIN ALMA siparişleri: .pr-wrap gizle, tablo kart ─── */
  .pr-wrap { display: none !important; }
  .po-slider-wrap { display: none !important; }
}

/* ── Modal/dialog açıkken FAB + alt nav gizle ── */
@media (max-width: 768px) {
  body.mob-modal-open .mobile-bottom-nav,
  body.mob-modal-open [class*="-mob-fab"],
  body.mob-modal-open .offer-mob-fab,
  body.mob-modal-open .cust-mob-fab,
  body.mob-modal-open .so-mob-fab {
    display: none !important;
  }
}

/* Mobil geri butonu */
.mob-back-btn {
    display: none;
    align-items: center; justify-content: center;
    width: 40px; height: 40px;
    border: none;
    background: var(--soft, #f1f5f9);
    color: var(--navy, #1e3a5f);
    cursor: pointer;
    border-radius: 10px;
    flex-shrink: 0;
    transition: background .15s;
}
.mob-back-btn:active { background: #dde4ee; }

/* Dialog otomatik kapatma butonu */
.dlg-auto-close { display: none; }
@media (max-width: 768px) {
    dialog { position: relative; }
    .dlg-auto-close {
        display: flex;
        align-items: center; justify-content: center;
        position: absolute; top: 12px; right: 12px;
        width: 36px; height: 36px;
        border: none; border-radius: 50%;
        background: var(--soft, #f1f5f9);
        border: 1.5px solid var(--line, #e2e8f0);
        color: var(--muted, #64748b);
        cursor: pointer; z-index: 10; flex-shrink: 0;
        transition: background .15s;
    }
    .dlg-auto-close:active { background: #dde4ee; }
    /* Bottom-sheet dialog'larda handle alanında göster */
    .pur-doc-dialog .dlg-auto-close,
    .inv-doc-dialog .dlg-auto-close,
    .sodlg-dialog .dlg-auto-close,
    .cust-doc-dialog .dlg-auto-close,
    .prod-doc-dialog .dlg-auto-close,
    .ofc-actions-dialog .dlg-auto-close { top: 8px; right: 12px; }
}

/* ═══════════════════════════════════════════════
   MOBİL TİPOGRAFİ & GENEL DÜZELTMELER
   ═══════════════════════════════════════════════ */
@media (max-width: 768px) {
    /* Topbar başlık */
    .page-title  { font-size: var(--mt-hero) !important; font-weight: 800 !important; }
    .page-subtitle { display: none !important; } /* alt başlık mobilde yer çalar */

    /* Kart başlıkları */
    .ofc-no, .soc-no, .cusc-name, .prdc-name,
    .purc-no, .invc-no { font-size: var(--mt-title) !important; font-weight: 700 !important; }

    /* Kart meta/etiket */
    .ofc-date, .soc-date, .cusc-meta, .prdc-code,
    .purc-sub, .invc-type { font-size: var(--mt-tiny) !important; }

    /* Kart tutar */
    .ofc-amount strong, .soc-amount, .cusc-balance,
    .prdc-stok strong, .purc-amount, .invc-amount {
        font-size: var(--mt-title) !important;
        font-weight: 800 !important;
    }

    /* Buton tutarlılığı: tüm birincil mobil butonlar */
    .ofc-btn-open, .soc-btn-open, .cusc-btn-open,
    .prdc-btn-open, .purc-btn-open, .invc-btn-open {
        font-size: 14px !important;
        font-weight: 700 !important;
        letter-spacing: .2px !important;
    }

    /* ⋯ butonları eşit boyut */
    .ofc-btn-more, .soc-btn-more, .cusc-btn-more,
    .prdc-btn-more, .purc-btn-more, .invc-btn-more {
        font-size: 20px !important;
        line-height: 1 !important;
    }
}

/* ═══════════════════════════════════════════════
   FİLTRE BOTTOM-SHEET (global)
   ═══════════════════════════════════════════════ */
/* Mobilde filtre barı gizle; yerine arama + filtre butonu */
@media (max-width: 768px) {
    .list-filter-bar { display: none !important; }

    /* Arama + filtre buton çubuğu */
    .mob-filter-row {
        display: flex;
        gap: 8px;
        padding: 0 0 10px;
        align-items: center;
    }
    .mob-filter-search {
        flex: 1;
        height: 46px;
        border: 1.5px solid var(--line);
        border-radius: 10px;
        padding: 0 14px;
        font-size: 16px;
        font-family: inherit;
        background: var(--surface, #fff);
        color: var(--text);
    }
    .mob-filter-btn {
        display: flex;
        align-items: center;
        gap: 6px;
        height: 46px;
        padding: 0 16px;
        border: 1.5px solid var(--line);
        border-radius: 10px;
        background: var(--surface, #fff);
        color: var(--navy);
        font-size: 14px;
        font-weight: 700;
        cursor: pointer;
        white-space: nowrap;
        flex-shrink: 0;
    }
    .mob-filter-btn.has-filter {
        background: var(--navy);
        color: #fff;
        border-color: var(--navy);
    }
    .mob-filter-btn svg { flex-shrink: 0; }

    /* Bottom-sheet */
    .mob-filter-sheet {
        position: fixed !important;
        bottom: 0; left: 0; right: 0; top: auto !important;
        width: 100% !important; max-width: 100% !important;
        margin: 0 !important;
        padding: 0 0 env(safe-area-inset-bottom, 16px) !important;
        border: none !important;
        border-radius: 20px 20px 0 0 !important;
        box-shadow: 0 -4px 32px rgba(0,0,0,.18) !important;
        max-height: 88dvh !important;
        overflow-y: auto !important;
        z-index: 9999;
    }
    .mob-filter-sheet::backdrop { background: rgba(0,0,0,.45) !important; }
    .mob-fsh-handle { width: 36px; height: 4px; background: #cbd5e1; border-radius: 4px; margin: 14px auto 2px; }
    .mob-fsh-title {
        font-size: 15px; font-weight: 800; color: var(--navy);
        text-align: center; padding: 6px 16px 14px;
        border-bottom: 1px solid var(--line);
    }
    .mob-fsh-body { padding: 16px; display: flex; flex-direction: column; gap: 12px; }
    .mob-fsh-label {
        font-size: 11px; font-weight: 700; color: var(--muted);
        text-transform: uppercase; letter-spacing: .4px;
        margin-bottom: 4px; display: block;
    }
    .mob-fsh-body input,
    .mob-fsh-body select {
        width: 100%; height: 48px;
        border: 1.5px solid var(--line); border-radius: 10px;
        padding: 0 14px; font-size: 16px; font-family: inherit;
        background: var(--surface, #fff); color: var(--text);
        box-sizing: border-box;
    }
    .mob-fsh-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    .mob-fsh-actions {
        display: flex; gap: 10px;
        padding: 14px 16px;
        border-top: 1px solid var(--line);
    }
    .mob-fsh-clear {
        flex: 0 0 auto; height: 48px; padding: 0 18px;
        border: 1.5px solid var(--line); border-radius: 10px;
        background: var(--soft); color: var(--text);
        font-size: 14px; font-weight: 600; cursor: pointer;
    }
    .mob-fsh-apply {
        flex: 1; height: 48px;
        border: none; border-radius: 10px;
        background: var(--navy); color: #fff;
        font-size: 15px; font-weight: 700; cursor: pointer;
    }
}

/* ═══════════════════════════════════════════════
   MOBİL: BÜYÜK FORM DIALOG'LARI → BOTTOM SHEET
   ═══════════════════════════════════════════════ */
@media (max-width: 768px) {
    /* Form dialog'ları bottom-sheet */
    dialog[style*="width:560px"],
    dialog[style*="width:620px"],
    dialog[style*="width:640px"],
    dialog[style*="width:700px"],
    dialog[style*="width:720px"],
    dialog[style*="width: 560px"],
    dialog[style*="width: 620px"],
    dialog[style*="width: 640px"],
    dialog[style*="width: 700px"],
    dialog[style*="width: 720px"],
    dialog#dlg-customer-edit,
    dialog#dlg-stock-movement,
    dialog#dlg-expense,
    dialog#dlg-product {
        width: 100vw !important;
        max-width: 100vw !important;
        max-height: 92dvh !important;
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        margin: 0 !important;
        border-radius: 20px 20px 0 0 !important;
        border: none !important;
        overflow-y: auto !important;
        box-shadow: 0 -4px 32px rgba(0,0,0,.2) !important;
    }
    /* Form içi font boyutu — iOS zoom engelini kaldır */
    dialog input[type=text],
    dialog input[type=number],
    dialog input[type=email],
    dialog input[type=date],
    dialog input[type=tel],
    dialog select,
    dialog textarea {
        font-size: 16px !important;
    }
    /* Form grid'leri tek sütun */
    dialog .form-grid-2,
    dialog [style*="grid-template-columns: 1fr 1fr"],
    dialog [style*="grid-template-columns:1fr 1fr"] {
        grid-template-columns: 1fr !important;
    }
}

/* ═══════════════════════════════════════════════
   MOBİL: "BUGÜN" EKRANI — Apple Health tarzı
   ═══════════════════════════════════════════════ */
.mob-today { display: none; }

@media (max-width: 768px) {

/* Eski mob-dashboard gizle */
.mob-dashboard { display: none !important; }

/* Yeni ekranı göster */
.mob-today {
    display: block;
    padding-bottom: 24px;
}

/* ── Başlık ── */
.mob-today-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 4px 0 20px;
}
.mob-today-date {
    font-size: 13px;
    font-weight: 600;
    color: #94a3b8;
    text-transform: capitalize;
    letter-spacing: .01em;
}
.mob-today-title {
    font-size: 28px;
    font-weight: 800;
    color: #1e3a5f;
    letter-spacing: -.5px;
    line-height: 1.1;
    margin-top: 2px;
}

/* ── Ana kartlar ── */
.mob-today-cards {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 28px;
}

.mtc {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 18px 20px;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 1px 4px rgba(0,0,0,.05);
    transition: transform .1s, box-shadow .1s;
    min-height: 80px;
}
.mtc:active { transform: scale(.98); box-shadow: none; }

.mtc-left { display: flex; flex-direction: column; gap: 3px; flex: 1; min-width: 0; }

.mtc-label {
    font-size: 12px;
    font-weight: 700;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.mtc-value {
    font-size: 28px;
    font-weight: 800;
    color: #1e293b;
    letter-spacing: -.5px;
    line-height: 1.15;
}
.mtc-sub {
    font-size: 13px;
    color: #64748b;
}
.mtc-arrow {
    font-size: 22px;
    color: #cbd5e1;
    font-weight: 300;
    flex-shrink: 0;
    margin-left: 12px;
}

/* Kart renk varyantları */
.mtc-ok    { border-color: #bbf7d0; background: #f0fdf4; }
.mtc-ok .mtc-value  { color: #059669; }
.mtc-ok .mtc-arrow  { color: #86efac; }

.mtc-warn  { border-color: #fde68a; background: #fffbeb; }
.mtc-warn .mtc-value { color: #b45309; }
.mtc-warn .mtc-arrow { color: #fcd34d; }

.mtc-danger { border-color: #fecaca; background: #fef2f2; }
.mtc-danger .mtc-value { color: #dc2626; }
.mtc-danger .mtc-arrow { color: #fca5a5; }

/* ── Bölüm başlığı ── */
.mob-today-section-title {
    font-size: 12px;
    font-weight: 700;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: 10px;
}

/* ── Hızlı işlem grid ── */
.mob-quick-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-bottom: 28px;
}

.mqg-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 14px 8px;
    text-decoration: none;
    color: #1e3a5f;
    font-size: 12px;
    font-weight: 600;
    min-height: 64px;
    transition: background .1s;
}
.mqg-item:active { background: #f1f5f9; }
.mqg-item svg { stroke: #1e3a5f; opacity: .8; }

/* ── Gündem listesi ── */
.mob-agenda {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 8px;
}

.mob-agenda-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    text-decoration: none;
    color: inherit;
    border-bottom: 1px solid #f1f5f9;
}
.mob-agenda-row:last-child { border-bottom: none; }
.mob-agenda-row:active { background: #f8fafc; }

.mob-agenda-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}
.mob-agenda-dot--blue  { background: #3b82f6; }
.mob-agenda-dot--green { background: #10b981; }
.mob-agenda-dot--orange { background: #f59e0b; }

.mob-agenda-info { flex: 1; min-width: 0; }
.mob-agenda-info strong {
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mob-agenda-info span {
    display: block;
    font-size: 12px;
    color: #64748b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mob-agenda-right { text-align: right; flex-shrink: 0; }
.mob-agenda-right strong { display: block; font-size: 14px; font-weight: 700; color: #1e293b; }
.mob-agenda-right span   { display: block; font-size: 11px; color: #94a3b8; }

/* Masaüstü bölümleri mobilde gizle */
.dash-kpi-strip { display: none !important; }
.dash-main-grid { display: none !important; }

/* ── MOBİL BADGE (header) ── */
.mob-alert-badge {
    background: #dc2626; color: #fff;
    font-size: 12px; font-weight: 700;
    min-width: 22px; height: 22px; border-radius: 11px;
    display: flex; align-items: center; justify-content: center;
    padding: 0 6px; flex-shrink: 0;
}

/* ── DİKKAT GEREKENLER (mobil) ── */
.dg-wrap {
    margin: 0 0 16px;
}
.dg-header {
    display: flex; align-items: center; gap: 8px;
    padding: 0 0 8px;
}
.dg-title {
    font-size: 13px; font-weight: 700; color: #1e293b;
    text-transform: uppercase; letter-spacing: .04em;
}
.dg-count {
    background: #dc2626; color: #fff;
    font-size: 11px; font-weight: 700;
    padding: 1px 7px; border-radius: 10px;
}
.dg-list {
    display: flex; flex-direction: column; gap: 0;
    border-radius: 14px; overflow: hidden;
}
.dg-card {
    display: flex; align-items: center; gap: 10px;
    padding: 12px 14px; background: #fff;
    border-bottom: 1px solid #f3f4f6;
    text-decoration: none; color: inherit;
}
.dg-card:last-child { border-bottom: none; }
.dg-card:active { background: #f9fafb; }
.dg-card--danger { border-left: 3px solid #dc2626; }
.dg-card--warn   { border-left: 3px solid #f59e0b; }
.dg-card--info   { border-left: 3px solid #3b82f6; }
.dg-card-icon { font-size: 20px; flex-shrink: 0; width: 28px; text-align: center; }
.dg-card-body { flex: 1; display: flex; flex-direction: column; gap: 1px; }
.dg-card-title { font-size: 14px; font-weight: 700; color: #111; }
.dg-card-desc  { font-size: 12px; color: #888; }
.dg-card-chev  { font-size: 18px; color: #c7c7cc; flex-shrink: 0; }

  /* ══════════════════════════════════════════════
     MEVCUT SAYFA BUTONLARI — STANDARDİZASYON
     Tüm özel sınıflı mobil butonlar tek kuralda
     ══════════════════════════════════════════════ */

  /* Tüm sayfaların ana FAB / ekle butonları → lacivert standart */
  .exm-add-btn,
  .pay-mob-fab,
  .mob-fab,
  .shq-label-btn {
    min-height: 44px !important;
    border-radius: 12px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    -webkit-tap-highlight-color: transparent;
  }

  /* Masraf ekle butonu → tam standart */
  .exm-add-btn {
    height: 44px !important;
    padding: 0 18px !important;
    border-radius: 22px !important;
  }

  /* Sevkiyat etiket butonu → standart */
  .shq-label-btn {
    padding: 0 16px !important;
    height: 44px !important;
  }

  /* Ürün kart detay butonu */
  .prdc-btn-open {
    min-height: 44px !important;
    border-radius: 10px !important;
    font-size: 14px !important;
  }

  /* Müşteri hızlı aksiyon butonları */
  .cs-mob-actions a,
  .cs-mob-actions button {
    min-height: 56px !important;
    border-radius: 12px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
  }

  /* Sipariş detayı sabit alt bar butonları */
  .sos-mob-bar form button,
  .sos-mob-bar a,
  .sos-mob-bar button {
    min-height: 44px !important;
    border-radius: 10px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
  }

  /* Sheet içi aksiyon butonları */
  .shq-opt-show,
  .shq-opt-hide,
  .sos-sheet-item {
    min-height: 52px !important;
    font-size: 16px !important;
  }

  /* Dialog kaydet/vazgeç butonları */
  .xdlg-save,
  .pay-mob-save {
    min-height: 52px !important;
    font-size: 17px !important;
    border-radius: 14px !important;
  }

  /* Liste üzerindeki Sil butonları — mobilde tamamen gizle */
  .btn.danger:not(.detail-only),
  .btn.ghost-danger:not(.detail-only),
  [data-method="DELETE"].btn:not(.detail-only),
  a[onclick*="confirm"]:not(.detail-only) {
    display: none !important;
  }

  /* Compact butonlar — mobilin tablo dışı alanlarında min 44px garantisi */
  .list-stat-row .btn.compact,
  .list-filter-bar .btn.compact,
  .mob-topbar .btn.compact {
    min-height: 44px !important;
    padding: 10px 16px !important;
    font-size: 14px !important;
    border-radius: 10px !important;
  }

} /* end @media 768px */

/* ── DİKKAT GEREKENLER (desktop şerit) ── */
.dg-desktop-strip {
    display: flex; flex-wrap: wrap; gap: 8px;
    margin: 0 0 14px;
}
.dg-desktop-chip {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 5px 12px; border-radius: 20px; font-size: 12px; font-weight: 600;
    text-decoration: none; white-space: nowrap;
    border: 1.5px solid transparent;
}
.dg-chip--danger { background: #fef2f2; color: #dc2626; border-color: #fecaca; }
.dg-chip--warn   { background: #fffbeb; color: #d97706; border-color: #fde68a; }
.dg-chip--info   { background: #eff6ff; color: #2563eb; border-color: #bfdbfe; }
.dg-chip-desc { color: inherit; opacity: .75; font-weight: 400; }
@media (max-width: 768px) {
    .dg-desktop-strip { display: none !important; }
}

/* ══════════════════════════════════════════════════════════════════
   ORTAK MOBİL BİLEŞENLER — mob-* utility sınıfları
   Modüle özgü prefix (ofc-*, so-*, exm-*, doc-*) yerine bu
   sınıfları kullanmak tasarım bütünlüğünü korur.
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ── mob-card : standart liste kartı ── */
  .mob-card {
    display: flex; align-items: center; gap: 10px;
    background: #fff; border-radius: 12px;
    padding: 12px 14px;
    box-shadow: 0 1px 3px rgba(0,0,0,.06);
    text-decoration: none; color: inherit;
    -webkit-tap-highlight-color: transparent;
  }
  .mob-card:active { background: #f8f8f8; }
  .mob-card + .mob-card { margin-top: 8px; }

  /* ── mob-list-row : bağlı liste (Apple Settings tarzı) ── */
  .mob-list-group {
    background: #fff; border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.06);
  }
  .mob-list-row {
    display: flex; align-items: center; gap: 10px;
    padding: 13px 16px;
    border-bottom: 1px solid #f0f0f0;
    text-decoration: none; color: inherit;
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
  }
  .mob-list-row:last-child { border-bottom: none; }
  .mob-list-row:active { background: #f2f2f7; }
  .mob-list-row-icon {
    width: 32px; height: 32px; border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; font-size: 16px;
  }
  .mob-list-row-body { flex: 1; min-width: 0; }
  .mob-list-row-title { font-size: 15px; font-weight: 600; color: #111; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mob-list-row-sub   { font-size: 12px; color: #6b7280; margin-top: 1px; }
  .mob-list-row-right { font-size: 13px; color: #6b7280; white-space: nowrap; }
  .mob-list-chev {
    color: #c7c7cc; font-size: 18px; font-weight: 400; flex-shrink: 0;
  }

  /* ── mob-kpi : KPI kutusu ── */
  .mob-kpi-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
    margin-bottom: 16px;
  }
  .mob-kpi {
    background: #fff; border-radius: 12px; padding: 14px 12px;
    box-shadow: 0 1px 3px rgba(0,0,0,.06);
  }
  .mob-kpi-label { font-size: 11px; font-weight: 600; color: #6b7280; text-transform: uppercase; letter-spacing: .4px; margin-bottom: 4px; }
  .mob-kpi-value { font-size: 22px; font-weight: 800; color: #111; letter-spacing: -.5px; }
  .mob-kpi-delta { font-size: 12px; font-weight: 600; margin-top: 2px; }
  .mob-kpi-delta.up   { color: #16a34a; }
  .mob-kpi-delta.down { color: #dc2626; }

  /* ── mob-search-bar : arama + filtre çubuğu ── */
  .mob-search-bar {
    display: flex; gap: 8px; align-items: center;
    padding: 10px 16px 8px;
    background: #f2f2f7;
    position: sticky; top: 0; z-index: 10;
  }
  .mob-search-inp {
    flex: 1; height: 38px; border-radius: 10px; border: none;
    background: #fff; padding: 0 12px 0 34px; font-size: 15px;
    box-shadow: 0 1px 3px rgba(0,0,0,.07);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23aaa' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: 10px center;
    outline: none;
  }
  .mob-search-inp:focus { box-shadow: 0 0 0 2px #1c3557; }
  .mob-filter-chip {
    height: 38px; padding: 0 14px; border-radius: 10px;
    border: none; background: #fff; font-size: 13px; font-weight: 600;
    color: #1c3557; cursor: pointer; white-space: nowrap;
    box-shadow: 0 1px 3px rgba(0,0,0,.07);
    display: flex; align-items: center; gap: 5px;
    -webkit-tap-highlight-color: transparent;
  }
  .mob-filter-chip.active { background: #1c3557; color: #fff; }

  /* ── mob-section-header : bölüm başlığı ── */
  .mob-section-header {
    font-size: 12px; font-weight: 700; color: #6b7280;
    text-transform: uppercase; letter-spacing: .6px;
    padding: 16px 16px 6px;
  }

  /* ── mob-empty : boş durum ── */
  .mob-empty {
    text-align: center; padding: 60px 20px;
    color: #9ca3af;
  }
  .mob-empty svg { width: 44px; height: 44px; margin-bottom: 10px; opacity: .4; }
  .mob-empty-title { font-size: 15px; font-weight: 600; color: #6b7280; }
  .mob-empty-sub   { font-size: 13px; margin-top: 4px; }

  /* ── mob-tag : durum etiketi / rozet ── */
  .mob-tag {
    display: inline-flex; align-items: center;
    font-size: 11px; font-weight: 600;
    padding: 2px 8px; border-radius: 6px;
    white-space: nowrap;
  }
  .mob-tag-success { background: #dcfce7; color: #15803d; }
  .mob-tag-warn    { background: #fef3c7; color: #92400e; }
  .mob-tag-danger  { background: #fee2e2; color: #991b1b; }
  .mob-tag-info    { background: #dbeafe; color: #1e40af; }
  .mob-tag-neutral { background: #f3f4f6; color: #374151; }
  .mob-tag-navy    { background: #1c3557; color: #fff; }

  /* ── mob-divider ── */
  .mob-divider { height: 1px; background: #f0f0f0; margin: 4px 0; }

  /* ── mob-amount : para rakamı ── */
  .mob-amount {
    font-variant-numeric: tabular-nums;
    letter-spacing: -.3px; white-space: nowrap;
  }

}

/* ══════════════════════════════════════════════════════════════════
   20. UYGULAMA HİSSİ — Global Mobil Deneyim Kuralları
   Telefonda tarayıcı değil, uygulama gibi hissettirmek için.
   Bu blok en sonda; tüm diğer kuralları ezer.
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ── 1. SAYFA ZEMİNİ & SCROLL ─────────────────────────────────
     Gri zemin + iOS momentum scroll her container'da aktif       */
  html, body {
    background: #f2f2f7 !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;        /* pull-to-refresh devre dışı */
  }
  /* Yatay scroll çubukları gizle — hiçbir şey taşmamalı */
  body { overflow-x: hidden !important; }

  /* ── 2. KARTLAR — yuvarlak ama abartısız ──────────────────────
     Apple: 12px radius, hafif gölge, sıfır kenar boşluğu        */
  .card, .mob-card, .panel,
  .prdc-card, .dg-card, .doc-card,
  .cusc-card, .invc-card, .purc-card,
  .pay-card, .rpm-card {
    border-radius: 12px !important;
    box-shadow: 0 1px 4px rgba(0,0,0,.07) !important;
    border: none !important;
    background: #fff !important;
  }
  /* Bağlı listede ilk/son kart köşe radius'u */
  .mob-list-group > *:first-child { border-radius: 12px 12px 0 0 !important; }
  .mob-list-group > *:last-child  { border-radius: 0 0 12px 12px !important; }
  .mob-list-group > *:only-child  { border-radius: 12px !important; }

  /* ── 3. ÜST BAŞLIK — sade, tek satır ─────────────────────────  */
  .mob-topbar {
    position: sticky !important;
    top: 0;
    z-index: 120;
    background: #f2f2f7 !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    padding: 10px 16px 8px !important;
    display: flex;
    align-items: center;
    gap: 10px;
  }
  /* Başlıkta alt satır / subtitle kalabalık eder */
  .mob-topbar .page-subtitle,
  .mob-topbar small { display: none !important; }

  /* ── 4. GERİ BUTONU — net, 44px ──────────────────────────────  */
  .mob-back-btn {
    display: flex !important;
    width: 36px !important; height: 36px !important;
    background: rgba(0,0,0,.06) !important;
    border-radius: 50% !important;
    align-items: center; justify-content: center;
    border: none !important;
    color: #1c3557 !important;
    flex-shrink: 0;
    -webkit-tap-highlight-color: transparent;
  }
  .mob-back-btn:active { background: rgba(0,0,0,.12) !important; }
  .mob-back-btn svg { width: 18px; height: 18px; }

  /* ── 5. BOTTOM-SHEET — modal'ın yerini alır ───────────────────
     Tüm dialog/bottom-sheet'ler için tutarlı stil               */
  .mob-sheet,
  dialog[class*="mob-"],
  dialog[class*="-sheet"] {
    position: fixed !important;
    bottom: 0 !important; left: 0 !important; right: 0 !important; top: auto !important;
    width: 100% !important; max-width: 100% !important;
    margin: 0 !important;
    border-radius: 20px 20px 0 0 !important;
    border: none !important;
    padding: 0 !important;
    padding-bottom: env(safe-area-inset-bottom, 16px) !important;
    max-height: 90dvh !important;
    overflow-y: auto !important;
    box-shadow: 0 -4px 32px rgba(0,0,0,.16) !important;
    animation: sheetUp .28s cubic-bezier(.32,1,.32,1);
  }
  @keyframes sheetUp {
    from { transform: translateY(100%); }
    to   { transform: translateY(0); }
  }
  /* Sheet handle (tutma çizgisi) */
  .mob-sheet-handle {
    width: 36px; height: 4px;
    background: #d1d5db;
    border-radius: 2px;
    margin: 12px auto 4px;
    flex-shrink: 0;
  }

  /* ── 6. FORMLAR — tam ekran his ──────────────────────────────
     Form container'ları nefes almalı, tablo değil              */
  .mob-form-page {
    padding: 0 16px 32px !important;
    background: #f2f2f7 !important;
  }
  .mob-form-section {
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 12px;
  }
  .mob-form-section label {
    font-size: 12px !important;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: .4px;
    margin-bottom: 4px;
    display: block;
  }

  /* ── 7. GÖLGELER — hafif, Apple tarzı ───────────────────────  */
  /* Ağır gölgeleri hafiflet */
  [style*="box-shadow"] { box-shadow: 0 1px 4px rgba(0,0,0,.08) !important; }
  /* Sticky başlıkların altında ince çizgi yeterli */
  .mob-topbar { box-shadow: none !important; border-bottom: 1px solid rgba(0,0,0,.06) !important; }

  /* ── 8. BOŞLUKLAR — 16px standart ────────────────────────────  */
  .mob-section { margin-bottom: 20px !important; }
  .mob-section-title {
    font-size: 13px !important;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: .5px;
    padding: 0 4px;
    margin-bottom: 6px;
  }

  /* ── 9. SAYFA GEÇİŞ HIZI — transition kaldır ─────────────────  */
  /* Tarayıcı gecikmesini minimize et */
  a, button { touch-action: manipulation; }

  /* ── 10. MASAÜSTÜ KALINTILARI — temizle ──────────────────────  */
  /* Tablolar, sidebar, desktop-only alanlar */
  .sidebar { -webkit-transform: translateX(-100%) !important; transform: translateX(-100%) !important; }   /* açılmadıkça gizli */
  .sidebar.mobile-open { -webkit-transform: translateX(0) !important; transform: translateX(0) !important; }
  /* Yatay kaydırma gerektiren tablo wrapper'lar */
  .table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  /* İkon + yazı yan yana inline butonlar mobilde küçülür */
  .btn .btn-label { display: none !important; }           /* sadece ikon göster */
  /* .btn-label'i olan açık butonlarda yazı korunsun */
  .mob-keep-label .btn-label,
  .mob-btn-primary .btn-label,
  .mob-btn-secondary .btn-label { display: inline !important; }

} /* end @media — Uygulama Hissi */

/* ══════════════════════════════════════════════════════════════════
   DESIGN TOKEN ENFORCEMENT — v1
   Buton dili, yazı boyutu ve liste satırı standardı.
   Bu blok en sonda, tüm diğer kuralların üzerinde.
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ─────────────────────────────────────────────────────────────
     1. TİPOGRAFİ — token değerleriyle bağla
  ───────────────────────────────────────────────────────────── */

  /* Sayfa başlığı: 22px */
  .page-title,
  .mob-page-title,
  .mob-topbar .page-title            { font-size: var(--mt-hero) !important; font-weight: 800 !important; letter-spacing: -.4px; }

  /* Kart / bölüm başlığı: 16px */
  .mob-card-title, .card-title,
  .section-title, h2.section-title,
  .ofc-no, .soc-no, .cusc-name,
  .prdc-name, .purc-no, .invc-no,
  .exm-card-desc, .doc-card-no      { font-size: var(--mt-title) !important; font-weight: 700 !important; }

  /* Açıklama / metaveri: 13px */
  .mob-meta, .mob-desc,
  .ofc-date, .soc-date, .cusc-meta,
  .prdc-code, .purc-sub, .invc-type,
  .exm-card-meta, .doc-card-cust    { font-size: var(--mt-meta) !important; color: var(--muted); }

  /* İkincil / etiket: 12px */
  .mob-label, small, .muted,
  .sk-sub, .mob-kpi-lbl,
  .mob-helper, .mob-section-header  { font-size: var(--mt-label) !important; }

  /* Badge / rozet: 11px */
  .mob-tag, .badge, .status-badge,
  .prdc-badge, .rpm-delta,
  .doc-type-badge, .soc-badge,
  .ofc-status, .line-badge          { font-size: var(--mt-tiny) !important; font-weight: 600 !important; }

  /* Para / tutar: 20px */
  .mob-amount-lg,
  .ofc-amount strong,
  .soc-amount, .cusc-balance,
  .pay-amount, .invc-amount,
  .rpm-val                          { font-size: var(--mt-amount) !important; font-weight: 800 !important; letter-spacing: -.5px; font-variant-numeric: tabular-nums; }

  /* Küçük tutar (kart meta): 14px */
  .mob-amount-sm,
  .exm-card-amount,
  .doc-card-amount                  { font-size: var(--mt-body) !important; font-weight: 700 !important; font-variant-numeric: tabular-nums; }

  /* ─────────────────────────────────────────────────────────────
     2. BUTON DİLİ — 5 tip, hepsi min 44px
  ───────────────────────────────────────────────────────────── */

  /* ANA İŞLEM — dolu lacivert (kaydet, oluştur, gönder) */
  .mob-btn-primary,
  .xdlg-save-btn, .pay-mob-save,
  #ns-submit-btn                    {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: var(--btn-h-lg) !important;
    padding: 0 20px !important;
    background: #1c3557 !important; color: #fff !important;
    border: none !important; border-radius: var(--radius-btn) !important;
    font-size: var(--mt-btn) !important; font-weight: 700 !important;
    cursor: pointer; text-decoration: none;
    -webkit-tap-highlight-color: transparent;
  }
  .mob-btn-primary:active,
  .xdlg-save-btn:active             { opacity: .82 !important; }

  /* OLUŞTUR / KAYDET YEŞIL — sadece gerçek create/save */
  .mob-btn-green,
  .exm-sh-apply                     {
    min-height: var(--btn-h-md) !important;
    background: #16a34a !important; color: #fff !important;
    border: none !important; border-radius: var(--radius-btn) !important;
    font-size: var(--mt-btn) !important; font-weight: 700 !important;
    cursor: pointer;
  }

  /* İKİNCİL İŞLEM — açık zeminli */
  .mob-btn-secondary,
  .xdlg-cancel-btn, .exm-sh-clear,
  #ns-cancel-btn                    {
    min-height: var(--btn-h-md) !important;
    background: #f2f2f7 !important; color: #1c3557 !important;
    border: 1.5px solid #e5e7eb !important;
    border-radius: var(--radius-btn) !important;
    font-size: var(--mt-btn) !important; font-weight: 600 !important;
    cursor: pointer;
  }
  .mob-btn-secondary:active         { background: #e5e7eb !important; }

  /* TEHLİKELİ — kırmızı kenarlıklı, sadece detayda */
  .mob-btn-danger,
  .btn.danger.detail-only           {
    min-height: var(--btn-h-md) !important;
    background: #fff !important; color: #dc2626 !important;
    border: 1.5px solid #fca5a5 !important;
    border-radius: var(--radius-btn) !important;
    font-size: var(--mt-btn) !important; font-weight: 600 !important;
    cursor: pointer;
  }
  .mob-btn-danger:active            { background: #fee2e2 !important; }

  /* ⋯ MENÜ BUTONU */
  .mob-btn-more                     {
    width: 44px !important; height: 44px !important;
    border-radius: 50% !important;
    background: #f2f2f7 !important; color: #1c3557 !important;
    border: none !important; font-size: 20px !important;
    display: inline-flex; align-items: center; justify-content: center;
    cursor: pointer; flex-shrink: 0;
    -webkit-tap-highlight-color: transparent;
  }

  /* FULL genişlik varyant */
  .mob-btn-primary.full,
  .mob-btn-green.full,
  .mob-btn-secondary.full           { width: 100% !important; }

  /* ─────────────────────────────────────────────────────────────
     3. LİSTE SATIRI STANDARDI
     Yapı: [sol ikon] [orta bilgi flex:1] [sağ ok ›]
  ───────────────────────────────────────────────────────────── */

  /* Tüm kart/liste linkler minimum 44px */
  .mob-card, .mob-list-row,
  .exm-card, .cusc-card, .prdc-card, .invc-card,
  .purc-card, .pay-card, .doc-card  {
    min-height: 60px;
    display: flex !important;
    align-items: center !important;
    -webkit-tap-highlight-color: transparent;
  }
  .ofc-card, .soc-card { min-height: 60px; }

  /* Sol ikon kutusu: 36×36, 9px radius */
  .mob-card-icon,
  .exm-card-icon                    {
    width: 36px !important; height: 36px !important;
    border-radius: 9px !important;
    flex-shrink: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 17px;
  }

  /* Orta bilgi: flex:1 */
  .mob-card-body,
  .exm-card-body, .ofc-card-body,
  .soc-meta, .cusc-body             { flex: 1 !important; min-width: 0 !important; }

  /* Sağ ok: renk + boyut standart */
  .mob-card-chev,
  .mob-list-chev,
  .exm-chev, .ofc-chev,
  .soc-chevron, .cusc-chev,
  .prdc-chev, .purc-chev, .invc-chev {
    color: #c7c7cc !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    flex-shrink: 0 !important;
    line-height: 1;
  }

  /* ─────────────────────────────────────────────────────────────
     4. GENEL LISTE / TABLO GIZLEME
     Tablo satırı butonları liste görünümünde gizli
  ───────────────────────────────────────────────────────────── */
  table .btn:not(.detail-only),
  .table-actions .btn:not(.detail-only) { display: none !important; }

} /* end Design Token Enforcement */

/* ══════════════════════════════════════════════════════════════════
   iOS DESIGN SYSTEM — Tüm Liste Sayfaları
   Cari · Teklif · Sipariş · Sevk
   Apple SF Pro hissi, tutarlı renk paleti, kompakt kartlar
   ══════════════════════════════════════════════════════════════════ */
:root {
  --ios-bg:       #f2f2f7;
  --ios-card:     #ffffff;
  --ios-blue:     #0a84ff;
  --ios-green:    #34c759;
  --ios-red:      #ff3b30;
  --ios-orange:   #ff9500;
  --ios-purple:   #5e5ce6;
  --ios-label:    #000000;
  --ios-label2:   #3c3c43;
  --ios-muted:    #8e8e93;
  --ios-sep:      rgba(60,60,67,.12);
  --ios-r:        20px;
  --ios-r-sm:     14px;
  --ios-shadow:   0 2px 14px rgba(0,0,0,.06);
  --ios-font:     -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', sans-serif;
}

/* ── Masaüstünde mobil-only bileşenleri gizle ── */
.cui-topbar, .cui-type-chips, .cui-card-list,
.ofc-topbar, .offer-card-list,
.inv-card-list,
.so-topbar, .so-mob-topbar, .so-card-list, .soc-card-list,
.smt-topbar, .smt-card-list { display: none; }

@media (max-width: 768px) {

/* ── Sayfa zemini ── */
body, .list-page-layout { background: var(--ios-bg) !important; font-family: var(--ios-font) !important; }

/* ── Masaüstü tablo ve eski header gizle ── */
.list-page-header, .list-page-table, .table-wrap, .data-table { display: none !important; }
/* ── Bulk işlem barı mobilede kesinlikle gizli (JS inline'ı bypass riski) ── */
#ofr-bulk-bar { display: none !important; }

/* ── Mobil kart listeleri: CSS ile göster (inline style:none bağımlılığı kaldırıldı) ── */
.offer-card-list { display: block !important; }
.inv-card-list { display: flex !important; flex-direction: column !important; }

/* ── Ortak topbar (so-mob-topbar = sipariş blade alias) ── */
.cui-topbar, .ofc-topbar, .so-topbar, .so-mob-topbar, .smt-topbar {
  position: sticky; top: 0; z-index: 50;
  background: rgba(242,242,247,.92);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border-bottom: .5px solid var(--ios-sep);
  padding: 10px 14px 8px;
  display: flex !important; align-items: center; gap: 8px;
}

/* ── Arama kutusu ── */
.so-mob-search-form, .cui-search-form, .ofc-search-form { flex: 1; display: flex; align-items: center; }
.cui-search-wrap, .ofc-search-wrap, .so-search-wrap, .so-mob-search-wrap {
  flex: 1; display: flex; align-items: center;
  background: rgba(118,118,128,.12); border-radius: 12px;
  padding: 0 10px; height: 38px; gap: 6px;
}
.cui-search-inp, .ofc-search-input, .so-search-inp, .so-mob-search-input {
  flex: 1; border: none; background: transparent;
  font-size: 15px; font-family: var(--ios-font); color: var(--ios-label);
  outline: none; height: 38px;
}
.cui-search-ico, .ofc-search-ico, .so-search-ico, .so-mob-search-ico {
  color: var(--ios-muted); flex-shrink: 0; width: 18px; height: 18px;
}

/* ── Filtre butonu ── */
.cui-filter-btn, .ofc-filter-btn, .so-filter-btn, .so-mob-filter-btn {
  height: 38px; padding: 0 14px; border-radius: 12px;
  background: rgba(118,118,128,.12); border: none;
  font-size: 13px; font-weight: 600; color: var(--ios-blue);
  font-family: var(--ios-font); cursor: pointer; white-space: nowrap;
  display: flex; align-items: center; gap: 5px;
}
.ofc-filter-btn--active,
.so-mob-filter-btn--active { background: var(--ios-blue) !important; color: #fff !important; }

/* ── Chip filtreler (durum/tip) ── */
.cui-type-chips, .offer-status-chips, .so-status-chips, .smt-status-chips {
  display: flex !important; gap: 7px; padding: 10px 14px 4px;
  overflow-x: auto; scrollbar-width: none;
}
.cui-type-chips::-webkit-scrollbar,
.offer-status-chips::-webkit-scrollbar,
.so-status-chips::-webkit-scrollbar { display: none; }

.cui-chip, .osc, .sosc, .smtc {
  display: inline-flex; align-items: center;
  padding: 5px 14px; border-radius: 20px; white-space: nowrap;
  font-size: 13px; font-weight: 600; text-decoration: none;
  background: rgba(118,118,128,.12); color: var(--ios-label2);
  border: none; cursor: pointer; font-family: var(--ios-font);
  transition: all .15s;
}
.cui-chip--on, .osc--active, .sosc--active, .smtc--active {
  background: var(--ios-blue) !important; color: #fff !important;
}

/* ══ CARİ KARTI ══ */
.cui-card-list { display: block !important; padding: 6px 14px 80px; }
.cui-card {
  display: flex !important; align-items: center; gap: 10px;
  background: var(--ios-card); border-radius: var(--ios-r);
  padding: 11px 12px; margin-bottom: 6px;
  box-shadow: var(--ios-shadow); border: .5px solid rgba(0,0,0,.06);
  text-decoration: none; -webkit-tap-highlight-color: transparent;
  transition: opacity .15s; position: relative; overflow: hidden;
}
.cui-card:active { opacity: .8; }
.cui-card-body { flex: 1; min-width: 0; }
.cui-card-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 3px; }
.cui-card-name { font-size: 15px; font-weight: 700; color: var(--ios-label); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cui-card-bal { font-size: 15px; font-weight: 800; color: var(--ios-label); white-space: nowrap; flex-shrink: 0; }
.cui-bal--debit { color: #dc2626; background: #fef2f2; padding: 2px 8px; border-radius: 8px; font-size: 14px; }
.cui-bal--credit { color: #15803d; background: #f0fdf4; padding: 2px 8px; border-radius: 8px; font-size: 14px; }
.cui-card-meta { display: flex; align-items: center; gap: 8px; flex-wrap: nowrap; overflow: hidden; }
.cui-card-meta span { font-size: 12px; color: var(--ios-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cui-ai-score {
  font-size: 10px; font-weight: 700; padding: 2px 7px; border-radius: 8px;
  border: 1px solid currentColor;
}
.cui-risk-dot { font-size: 11px; color: var(--ios-muted); }
.cui-chev { width: 16px; color: #c7c7cc; flex-shrink: 0; }
.cui-empty { text-align: center; padding: 32px; color: var(--ios-muted); font-size: 14px; }

/* ══ MOBİL KART STANDARDI ══
   Başlık: 15-16px 700
   Açıklama/meta: 12-13px muted
   Ana tutar: 19-20px 800
   Aksiyon butonları: height 40px, aynı border-radius (10px)
*/

/* Cari sayfası — body scroll, iç scroll yok */
.page-body:has(.cui-card-list) {
  overflow-y: auto !important;
  height: auto !important;
  min-height: 100dvh;
}

/* Cari kart: radius düşür, hiyerarşi netleştir */
.cui-card {
  border-radius: 10px !important;
  padding: 12px 13px !important;
}
.cui-card-name { font-size: 15px !important; font-weight: 700 !important; }
.cui-card-bal { font-size: 18px !important; font-weight: 800 !important; }
.cui-card-meta span { font-size: 12px !important; }

/* Sipariş kart: chip butonlar aynı yükseklik, WA ikona dönüşür */
.soc-card2 { border-radius: 10px !important; }
.soc2-name { font-size: 15px !important; font-weight: 700 !important; }
.soc2-amount { font-size: 19px !important; font-weight: 800 !important; }
.soc2-amount-sub { font-size: 12px !important; }
.soc2-chip {
  height: 36px !important;
  padding: 0 12px !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
}
/* Sevkiyat: ana buton — navy dolu */
.soc2-chip--ship { flex: 1; justify-content: center; }
/* Detay: ikincil — hafif mavi */
.soc2-chip--detail { background: #f1f5f9 !important; color: #475569 !important; border-color: #e2e8f0 !important; }
/* WA: sadece ikon, kare buton */
.soc2-chip--wa {
  width: 36px !important; flex-shrink: 0 !important; padding: 0 !important;
  justify-content: center !important;
  background: #dcfce7 !important; color: #15803d !important; border-color: #86efac !important;
}
.soc2-chip--wa .soc2-wa-label { display: none !important; }
.soc2-chip--wa svg { width: 18px !important; height: 18px !important; }

/* Teklif kart: radius standarda */
.ofc-card { border-radius: 10px !important; }

/* ══ TEKLİF KARTI ══ */
.offer-card-list { display: block !important; padding: 6px 14px; }
.ofc-card {
  display: flex !important; flex-direction: column !important;
  background: #fff !important; border-radius: 18px !important;
  padding: 15px 15px 13px !important; margin-bottom: 9px !important;
  box-shadow: 0 1px 5px rgba(0,0,0,.07) !important; border: none !important;
  text-decoration: none; -webkit-tap-highlight-color: transparent;
  position: relative; overflow: hidden;
}
.ofc-card.erp-urgent::after { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:#FF3B30; border-radius:18px 18px 0 0; }
.ofc-card.erp-warn::after   { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:#FF9500; border-radius:18px 18px 0 0; }
.ofc-empty { text-align: center; padding: 32px; color: var(--ios-muted); font-size: 14px; }

/* Teklif durum badge (tablo için de kullanılıyor) */
.ofc-badge {
  font-size: 10px; font-weight: 700; padding: 3px 9px; border-radius: 10px;
}
.ofc-badge--ok      { background: #f0fff4; color: #1a7f2e; }
.ofc-badge--info    { background: #f0f5ff; color: #185fa5; }
.ofc-badge--warn    { background: #fff8ee; color: #854f0b; }
.ofc-badge--danger  { background: #fff2f2; color: #c0392b; }
.ofc-badge--default { background: #f2f2f7; color: #636366; }

/* ══ SİPARİŞ KARTI ══ */
.so-card-list, .soc-card-list { display: block !important; padding: 6px 14px; }
.soc-card {
  display: flex !important; flex-direction: column !important;
  background: #fff !important; border-radius: 18px !important;
  padding: 15px 15px 13px !important; margin-bottom: 9px !important;
  box-shadow: 0 1px 5px rgba(0,0,0,.07) !important; border: none !important;
  text-decoration: none; -webkit-tap-highlight-color: transparent;
  position: relative; overflow: hidden;
}
.soc-card.erp-urgent { border-left: 4px solid #FF3B30 !important; padding-left: 11px !important; background: #fff8f7 !important; }
.soc-card.erp-warn   { border-left: 4px solid #FF9500 !important; padding-left: 11px !important; background: #fffcf5 !important; }
.soc-empty { text-align: center; padding: 32px; color: var(--ios-muted); font-size: 14px; }

/* ══ SEVKİYAT KARTI ══ */
.smt-card-list { display: block !important; padding: 6px 14px; }
.smt-card {
  display: flex !important; flex-direction: column !important;
  background: #fff !important; border-radius: 18px !important;
  padding: 15px 15px 13px !important; margin-bottom: 9px !important;
  box-shadow: 0 1px 5px rgba(0,0,0,.07) !important; border: none !important;
  text-decoration: none; -webkit-tap-highlight-color: transparent;
  position: relative; overflow: hidden;
}
.smt-card.erp-urgent::after { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:#FF3B30; border-radius:18px 18px 0 0; }

/* ══ ORTAK ERP KART ELEMANLARI ══ */
.erp-kpi-bar { display: grid; grid-template-columns: repeat(auto-fit, minmax(70px, 1fr)); gap: 8px; padding: 6px 14px 12px; }
.erp-kpi { background: #fff; border-radius: 14px; padding: 10px; text-align: center; box-shadow: 0 1px 3px rgba(0,0,0,.05); }
.erp-kpi-val { font-size: 17px; font-weight: 800; color: #000; letter-spacing: -.3px; line-height: 1; display: block; }
.erp-kpi-val.erp-kv--warn  { color: #FF9500; }
.erp-kpi-val.erp-kv--red   { color: #FF3B30; }
.erp-kpi-val.erp-kv--green { color: #34C759; }
.erp-kpi-lbl { font-size: 10px; color: #8E8E93; font-weight: 500; margin-top: 3px; letter-spacing: .1px; display: block; }
.erp-kpi--link { text-decoration: none; cursor: pointer; }
.erp-kpi--link .erp-kpi-lbl { color: #FF9500; }
.erp-kv--warn { color: #FF9500; }
.erp-head { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 4px; }
.erp-name { font-size: 15px; font-weight: 700; color: #000; letter-spacing: -.2px; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.erp-subno { font-size: 11px; color: #8E8E93; margin-bottom: 9px; }
.erp-amount { font-size: 21px; font-weight: 800; color: #000; letter-spacing: -.5px; line-height: 1; margin-bottom: 3px; display: block; }
.erp-amount.erp-amount--red { color: #FF3B30; }
.erp-amount-sub { font-size: 11px; color: #8E8E93; margin-bottom: 10px; display: block; }
.erp-amount-sub.erp-amount-sub--warn { color: #FF9500; font-weight: 600; }
.erp-foot { display: flex; justify-content: space-between; align-items: center; border-top: .5px solid rgba(0,0,0,.06); padding-top: 9px; }
.erp-date { font-size: 12px; color: #8E8E93; display: flex; align-items: center; gap: 4px; }
.erp-date.erp-date--late { color: #FF3B30; font-weight: 600; }
.erp-date.erp-date--soon { color: #FF9500; font-weight: 600; }
.erp-acts { display: flex; gap: 6px; }
.erp-act { padding: 5px 11px; border-radius: 8px; font-size: 11px; font-weight: 600; border: none; cursor: pointer; font-family: var(--ios-font); text-decoration: none; display: inline-flex; align-items: center; gap: 3px; -webkit-tap-highlight-color: transparent; }
.erp-act--call { background: #D6EBFF; color: #0A5BBF; }
.erp-act--doc  { background: rgba(142,142,147,.12); color: #3C3C43; }
.erp-act--wa   { background: #D6F5E0; color: #128C3B; }
.erp-pill { font-size: 10px; font-weight: 700; padding: 3px 9px; border-radius: 20px; white-space: nowrap; flex-shrink: 0; margin-left: 8px; }
.erp-pill--ok     { background: #DCF5E7; color: #1A7F2E; }
.erp-pill--blue   { background: #D6EBFF; color: #0A5BBF; }
.erp-pill--warn   { background: #FFF0D6; color: #7D4A00; }
.erp-pill--red    { background: #FFE5E5; color: #C0392B; }
.erp-pill--gray   { background: rgba(142,142,147,.15); color: #636366; }
.erp-pill--purple { background: #EFE8FF; color: #4A35B0; }
/* Sevkiyat chip'ler */
.smt-chip { font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 8px; background: #f2f2f7; color: #636366; }
.smt-chip--purple { background: #f3f0ff; color: #5e5ce6; }
.smt-chip--green  { background: #f0fff4; color: #1a7f2e; }
.smt-chip--blue   { background: #f0f5ff; color: #185fa5; }

/* ══ ORTAK: FAB (+ Yeni butonu) ══ */
.ios-fab,
.cust-mob-fab, .offer-mob-fab, .so-mob-fab {
  position: fixed; bottom: calc(80px + env(safe-area-inset-bottom));
  right: 18px; z-index: 900;
  width: 56px; height: 56px; border-radius: 16px;
  background: var(--ios-green); color: #fff;
  border: none; cursor: pointer;
  box-shadow: 0 4px 16px rgba(52,199,89,.45);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
  -webkit-tap-highlight-color: transparent; text-decoration: none;
}
.ios-fab:active, .cust-mob-fab:active, .offer-mob-fab:active, .so-mob-fab:active { transform: scale(.94); }
.fab-icon  { font-size: 22px; line-height: 1; font-weight: 300; }
.fab-label { font-size: 10px; font-weight: 700; letter-spacing: .3px; }

/* ══ ÖZET SATIRI (stats strip) ══ */
.ios-stats-strip {
  display: flex; gap: 8px; padding: 8px 14px 4px;
  overflow-x: auto; scrollbar-width: none;
}
.ios-stats-strip::-webkit-scrollbar { display: none; }
.ios-stat-pill {
  display: inline-flex; align-items: center; gap: 5px;
  background: var(--ios-card); border-radius: 12px;
  padding: 7px 12px; white-space: nowrap;
  box-shadow: 0 1px 6px rgba(0,0,0,.06); border: .5px solid rgba(0,0,0,.06);
}
.ios-stat-pill-lbl { font-size: 11px; color: var(--ios-muted); font-weight: 500; }
.ios-stat-pill-val { font-size: 13px; font-weight: 800; color: var(--ios-label); }
.ios-stat-pill--red  .ios-stat-pill-val { color: var(--ios-red); }
.ios-stat-pill--green .ios-stat-pill-val { color: var(--ios-green); }
.ios-stat-pill--blue  .ios-stat-pill-val { color: var(--ios-blue); }

/* ══ BOTTOM SHEET (filtre) ══ */
.ofc-sheet, .cui-sh, .so-sheet, .smt-sheet {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 500;
  background: var(--ios-card); border-radius: 24px 24px 0 0;
  padding: 16px 18px calc(24px + env(safe-area-inset-bottom));
  box-shadow: 0 -8px 40px rgba(0,0,0,.15);
  transform: translateY(100%); transition: transform .3s cubic-bezier(.32,1,.23,1);
}
.ofc-sheet.open, .cui-sh.open, .so-sheet.open, .smt-sheet.open { transform: translateY(0); }
.ofc-sheet-overlay, .cui-sh-overlay, .so-sheet-overlay {
  position: fixed; inset: 0; z-index: 499;
  background: rgba(0,0,0,.4); backdrop-filter: blur(4px);
  opacity: 0; pointer-events: none; transition: opacity .3s;
}
.ofc-sheet-overlay.open, .cui-sh-overlay.open, .so-sheet-overlay.open { opacity: 1; pointer-events: auto; }

/* Gelişmiş/tarih filtre toggle — tüm sayfalar */
.ofc-advanced-toggle, .so-advanced-toggle {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; padding: 10px 0; border: 0; background: none;
  font-size: 13px; font-weight: 600; color: var(--navy, #1e3a5f);
  cursor: pointer; border-top: 1px solid #e5e5ea; margin-top: 6px;
}
.ofc-advanced-toggle svg, .so-advanced-toggle svg { transition: transform .2s; }
.ofc-advanced-toggle.ofc-adv-open svg, .so-advanced-toggle.so-adv-open svg { transform: rotate(180deg); }

/* Sheet handle */
.ofc-sheet-handle, .cui-sh-handle {
  width: 40px; height: 4px; background: #e5e5ea;
  border-radius: 2px; margin: 0 auto 14px;
}
/* Sheet input */
.ofc-sheet-input, .cui-sh-input {
  width: 100%; height: 46px; border-radius: 14px;
  border: 1.5px solid #e5e5ea; padding: 0 14px;
  font-size: 16px; box-sizing: border-box; font-family: var(--ios-font);
  background: #f9fafb;
}
.ofc-sheet-input:focus, .cui-sh-input:focus { border-color: var(--ios-blue); background: #fff; outline: none; }
/* Sheet actions */
.ofc-sheet-actions, .cui-sh-footer {
  display: flex; gap: 10px; margin-top: 18px;
}
.ofc-sheet-apply, .cui-sh-apply {
  flex: 1; padding: 14px; background: var(--ios-blue); color: #fff;
  border: none; border-radius: 14px; font-size: 15px; font-weight: 700;
  cursor: pointer; font-family: var(--ios-font);
}
.ofc-sheet-clear, .cui-sh-clear {
  padding: 14px 18px; background: #f2f2f7; color: #636366;
  border: none; border-radius: 14px; font-size: 15px; font-weight: 600;
  cursor: pointer; font-family: var(--ios-font); text-decoration: none;
  display: flex; align-items: center;
}

/* ── Gizle: eski / desktop-only elementler ── */
.pr-wrap, .so-status-strip, .so-mob-kpi-row,
.list-stat-row, .list-filter-bar,
.cust-type-chips { display: none !important; }

/* ── Cari filtre chipler (cui-type-chips içindeki ctc/cui-chip) ── */
.cui-type-chips .cui-chip,
.cui-type-chips .ctc {
  display: inline-flex; align-items: center;
  padding: 5px 14px; border-radius: 20px; white-space: nowrap;
  font-size: 13px; font-weight: 600; text-decoration: none;
  background: rgba(118,118,128,.12); color: var(--ios-label2);
  border: none; cursor: pointer; font-family: var(--ios-font);
}
.cui-type-chips .cui-chip--on,
.cui-type-chips .ctc--active {
  background: var(--ios-blue) !important; color: #fff !important;
}

/* ── Göster: inline style="display:none" olan mobil card listleri ── */
div.offer-card-list[style*="display:none"],
div.so-card-list[style*="display:none"],
div.soc-card-list[style*="display:none"],
div.prod-card-list[style*="display:none"] {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px;
}

/* ── Göster: FAB ── */
.cust-mob-fab, .offer-mob-fab, .so-mob-fab, .inv-mob-fab { display: flex !important; }

/* ── Göster: topbar'lar ── */
.cui-topbar, .ofc-topbar, .so-topbar, .so-mob-topbar, .smt-topbar { display: flex !important; }

/* ── Göster: chip filtreler ── */
.cui-type-chips, .offer-status-chips,
.so-status-chips { display: flex !important; padding: 10px 14px 4px !important; overflow-x: auto !important; scrollbar-width: none !important; }

/* ── 44px touch target: tablo aksiyon linkleri ── */
.compact-actions a,
.compact-actions button {
  min-height: 36px;
  display: inline-flex; align-items: center;
}

/* ── Cari kartı: tam yuvarlak + urgency strip ── */
.cui-card {
  border-radius: 18px !important;
  position: relative; overflow: hidden;
}
.cui-card.erp-urgent::after { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:#FF3B30; border-radius:18px 18px 0 0; }
.cui-card.erp-warn::after   { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:#FF9500; border-radius:18px 18px 0 0; }

/* ── Sayfa arka planı ── */
.list-page-layout { background: #f2f2f7 !important; min-height: 100dvh; padding-bottom: 100px; height: auto !important; overflow: visible !important; }

} /* end iOS Design System */

/* ── Aramalı Müşteri Seçici ── */
.cust-picker { position: relative; }
.cust-picker-drop {
    position: absolute; top: 100%; left: 0; right: 0;
    background: #fff; border-radius: 12px; margin-top: 4px;
    box-shadow: 0 4px 20px rgba(0,0,0,.14); z-index: 500;
    max-height: 240px; overflow-y: auto;
}
.cust-picker-item {
    padding: 11px 14px; cursor: pointer; border-bottom: .5px solid rgba(0,0,0,.06);
}
.cust-picker-item:last-child { border-bottom: none; }
.cust-picker-item:active, .cust-picker-item:hover { background: #f5f5f7; }
.cpi-name { font-size: 14px; font-weight: 600; color: #1c1c1e; }
.cust-picker-empty { padding: 11px 14px; font-size: 13px; color: #8e8e93; }
.cust-picker-sel {
    display: flex; align-items: center; justify-content: space-between;
    background: #e8f4e8; border-radius: 10px; padding: 10px 12px;
    font-size: 14px; font-weight: 600; color: #1c3557;
}
.cust-picker-sel-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cust-picker-clear {
    width: 24px; height: 24px; border-radius: 50%; border: none;
    background: rgba(0,0,0,.12); color: #666; font-size: 16px; line-height: 1;
    cursor: pointer; flex-shrink: 0; margin-left: 8px;
}
.cust-picker-new {
    display: block; margin-top: 8px; font-size: 13px; font-weight: 600;
    color: #4338ca; text-decoration: none;
}
.cust-picker-new:hover { text-decoration: underline; }

/* ── MOBIL: iOS input odak zoom engelleme (font >=16px olmali) ── */
@media (max-width: 768px) {
  input, select, textarea { font-size: 16px !important; }
  /* Fixed alt bar / FAB olan liste sayfalarinda son satir gorunur kalsin */
  .list-page-layout { padding-bottom: 96px; }
}

/* ── Filtre bar kutulari: yazi kesilmesin (global) ── */
.list-filter-bar select,
.list-filter-bar input[type="search"],
.list-filter-bar input[type="date"],
.list-filter-bar input[type="text"] {
  min-height: 38px;
  padding: 8px 12px;
  font-size: 13px;
  line-height: 1.3;
  box-sizing: border-box;
}
.list-filter-bar select { padding-right: 28px; }

/* ── Cari KPI bar: masaustu yatay duzen ── */
@media (min-width: 769px) {
  .erp-kpi-bar { display:flex !important; gap:8px; padding:0 0 10px; grid-template-columns:none; }
  .erp-kpi { display:inline-flex; align-items:baseline; gap:7px; background:#fff; border:1px solid #e2e8f0; border-radius:20px; padding:6px 14px; box-shadow:none; text-align:left; }
  .erp-kpi-val { display:inline; font-size:14px; font-weight:800; color:#1e293b; letter-spacing:0; }
  .erp-kpi-lbl { display:inline; font-size:12px; color:#64748b; }
}