/* =====================================================================
   AnaBayiPanel — Ana Bayi (B2B) Yönetim Sistemi
   Tasarım sistemi: açık (beyaz) kabuk, tek tipografi ailesi (Inter),
   ölçülü renk (indigo yalnızca birincil aksiyon ve seçili durum için).
   ===================================================================== */

:root {
  /* --- marka ------------------------------------------------------- */
  --primary:#4f46e5;
  --primary-hover:#4338ca;
  --primary-press:#3730a3;
  --primary-soft:#eef1fe;
  --primary-soft-2:#e0e4fd;
  --primary-ink:#3b32b8;
  --on-primary:#ffffff;

  /* --- yüzeyler (3 katman: uygulama < kenar çubuğu/kart) ------------ */
  --app:#f5f6f9;
  --surface:#ffffff;
  --surface-2:#fafbfc;
  --sidebar:#ffffff;
  --sidebar-hover:#f3f4f8;

  /* --- mürekkep (hepsi ≥4.5:1) ------------------------------------- */
  --ink:#10131a;
  --ink-2:#39404f;
  --muted:#646c7d;
  --faint:#8a91a1;         /* yalnız simge/ayraç — metin için kullanma */

  --line:#e7e9ef;
  --line-2:#d8dce5;

  /* --- durum ------------------------------------------------------- */
  --success:#0f7a3d; --success-soft:#e6f6ec;
  --danger:#c81e46;  --danger-soft:#fdeaee;
  --warning:#a15c07; --warning-soft:#fdf2df;
  --info:#0369a1;    --info-soft:#e4f2fb;

  /* --- biçim ------------------------------------------------------- */
  --r-sm:8px; --r:10px; --r-lg:14px; --r-xl:18px;
  --sh-1:0 1px 2px rgba(16,24,40,.04);
  --sh-2:0 1px 3px rgba(16,24,40,.06), 0 1px 2px rgba(16,24,40,.04);
  --sh-3:0 4px 14px -4px rgba(16,24,40,.10), 0 1px 3px rgba(16,24,40,.05);
  --sh-pop:0 14px 34px -8px rgba(16,24,40,.18), 0 4px 10px -3px rgba(16,24,40,.08);

  /* --- katman sırası (asla rastgele sayı yazma) --------------------- */
  --z-sticky:20; --z-backdrop:1040; --z-drawer:1045; --z-dropdown:1055;
  --z-modal:1060; --z-toast:1080;

  /* --- hareket ----------------------------------------------------- */
  --ease:cubic-bezier(.22,1,.36,1);
  --dur:.18s;

  /* Bootstrap köprüleri */
  --bs-primary:#4f46e5; --bs-primary-rgb:79,70,229;
  --bs-link-color:#4338ca; --bs-link-hover-color:#3730a3;
  --bs-body-color:#10131a; --bs-border-color:#e7e9ef;
}

/* ---------------------------------------------------------------- taban */

*, *::before, *::after { box-sizing:border-box; }

body {
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  font-size:.9375rem; line-height:1.5;
  background:var(--app); color:var(--ink);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  margin-bottom:0;
}

/* Ürün arayüzü: tek aile, sabit rem ölçek (akışkan clamp değil). */
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6 {
  font-family:inherit; font-weight:700; color:var(--ink);
  letter-spacing:-.018em; line-height:1.25; text-wrap:balance;
}
h1,.h1{ font-size:1.85rem; }
h2,.h2{ font-size:1.55rem; }
h3,.h3{ font-size:1.3rem; }
h4,.h4{ font-size:1.15rem; }
h5,.h5{ font-size:1.02rem; }
h6,.h6{ font-size:.9375rem; }

p { text-wrap:pretty; }
a { text-decoration:none; color:var(--bs-link-color); }
a:hover { color:var(--bs-link-hover-color); }
hr { border-color:var(--line); opacity:1; }
code, kbd, .font-monospace { font-variant-ligatures:none; }

.text-muted { color:var(--muted) !important; }
.text-primary { color:var(--primary) !important; }
.border-primary { border-color:var(--primary) !important; }

/* Klavye odağı her yerde görünür olsun. */
:focus-visible { outline:2px solid var(--primary); outline-offset:2px; }

/* ------------------------------------------------------- bileşen: panel */

.panel {
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-lg); box-shadow:var(--sh-2);
  padding:1.15rem 1.25rem;
}
/* Panel başlığı — tüm ekranlarda aynı sözlük. */
.panel-hd {
  display:flex; align-items:center; gap:.75rem; flex-wrap:wrap;
  margin:-1.15rem -1.25rem 1rem; padding:.85rem 1.25rem;
  border-bottom:1px solid var(--line);
}
.panel-hd h1,.panel-hd h2,.panel-hd h3,.panel-hd h4,.panel-hd h5{ margin:0; font-size:.98rem; }

/* Sayfa başlığı bloğu */
.page-head { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; flex-wrap:wrap; margin-bottom:1.15rem; }
.page-head .sub { color:var(--muted); font-size:.85rem; margin-top:.15rem; }

/* Boş durum — "burada bir şey yok" değil, arayüzü öğreten metin. */
.empty-state { text-align:center; padding:2.5rem 1rem; color:var(--muted); }
.empty-state .bi { font-size:1.9rem; color:var(--faint); display:block; margin-bottom:.6rem; }

/* ----------------------------------------------------- bileşen: düğmeler */

.btn {
  --bs-btn-font-weight:600;
  --bs-btn-border-radius:9px;
  --bs-btn-padding-y:.45rem; --bs-btn-padding-x:.85rem;
  --bs-btn-font-size:.875rem;
  transition:background-color var(--dur) var(--ease), border-color var(--dur) var(--ease),
             color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.btn-sm { --bs-btn-border-radius:8px; --bs-btn-padding-y:.3rem; --bs-btn-padding-x:.62rem; --bs-btn-font-size:.8125rem; }
.btn-lg { --bs-btn-border-radius:11px; --bs-btn-font-size:1rem; }
.btn:focus-visible { box-shadow:0 0 0 3px rgba(79,70,229,.22); outline:none; }
.btn:disabled,.btn.disabled { opacity:.5; }

.btn-primary {
  --bs-btn-bg:var(--primary); --bs-btn-border-color:var(--primary);
  --bs-btn-hover-bg:var(--primary-hover); --bs-btn-hover-border-color:var(--primary-hover);
  --bs-btn-active-bg:var(--primary-press); --bs-btn-active-border-color:var(--primary-press);
  --bs-btn-disabled-bg:var(--primary); --bs-btn-disabled-border-color:var(--primary);
  box-shadow:var(--sh-1);
}
.btn-outline-primary {
  --bs-btn-color:var(--primary-ink); --bs-btn-border-color:var(--line-2);
  --bs-btn-hover-bg:var(--primary-soft); --bs-btn-hover-border-color:var(--primary-soft-2);
  --bs-btn-hover-color:var(--primary-ink);
  --bs-btn-active-bg:var(--primary-soft-2); --bs-btn-active-border-color:var(--primary-soft-2);
  --bs-btn-active-color:var(--primary-press);
}
/* Panel genelinde ikincil düğme = beyaz + ince kenarlık (gri blok değil). */
.btn-light {
  --bs-btn-bg:var(--surface); --bs-btn-color:var(--ink-2); --bs-btn-border-color:var(--line-2);
  --bs-btn-hover-bg:var(--app); --bs-btn-hover-color:var(--ink); --bs-btn-hover-border-color:var(--line-2);
  --bs-btn-active-bg:#eceef4; --bs-btn-active-border-color:var(--line-2); --bs-btn-active-color:var(--ink);
}
.btn-outline-secondary { --bs-btn-color:var(--ink-2); --bs-btn-border-color:var(--line-2); --bs-btn-hover-bg:var(--app); --bs-btn-hover-color:var(--ink); --bs-btn-hover-border-color:var(--line-2); }
.btn-outline-danger { --bs-btn-color:var(--danger); --bs-btn-border-color:var(--line-2); --bs-btn-hover-bg:var(--danger-soft); --bs-btn-hover-border-color:var(--danger-soft); --bs-btn-hover-color:var(--danger); }
.btn-danger  { --bs-btn-bg:var(--danger);  --bs-btn-border-color:var(--danger);  --bs-btn-hover-bg:#ac1a3c; --bs-btn-hover-border-color:#ac1a3c; }
.btn-success { --bs-btn-bg:var(--success); --bs-btn-border-color:var(--success); --bs-btn-hover-bg:#0c6733; --bs-btn-hover-border-color:#0c6733; }

/* Filtre şeritlerinde kullanılan düğme grubu */
.btn-group > .btn { --bs-btn-border-radius:9px; }

/* Yalnız simge taşıyan kare düğme (üst çubuk) */
.icon-btn {
  width:34px; height:34px; flex-shrink:0; border-radius:9px;
  border:1px solid var(--line-2); background:var(--surface); color:var(--ink-2);
  display:inline-flex; align-items:center; justify-content:center; font-size:1rem;
  transition:background-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.icon-btn:hover { background:var(--app); color:var(--ink); }
.icon-btn:focus-visible { outline:2px solid var(--primary); outline-offset:2px; }

/* -------------------------------------------------------- bileşen: form */

.form-control,.form-select {
  border-color:var(--line-2); border-radius:9px;
  font-size:.875rem; padding:.45rem .7rem; color:var(--ink); background-color:var(--surface);
  transition:border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.form-control-sm,.form-select-sm { font-size:.8125rem; padding:.32rem .6rem; border-radius:8px; }
.form-control:focus,.form-select:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(79,70,229,.18); }
.form-control::placeholder { color:var(--muted); opacity:1; }   /* soluk gri değil: 4.5:1 */
.form-control:disabled,.form-select:disabled { background:var(--app); color:var(--muted); }
.form-label { font-weight:600; font-size:.8125rem; color:var(--ink-2); margin-bottom:.35rem; }
.form-text { color:var(--muted); font-size:.78rem; }
.form-check-input:checked { background-color:var(--primary); border-color:var(--primary); }
.form-check-input:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(79,70,229,.18); }
.input-group-text { background:var(--app); border-color:var(--line-2); color:var(--muted); font-size:.8125rem; }

/* ------------------------------------------------------ bileşen: tablo */

.table {
  --bs-table-bg:transparent;
  --bs-table-hover-bg:#f6f7fb; --bs-table-hover-color:var(--ink);
  color:var(--ink); font-size:.875rem; margin-bottom:0;
}
.table > thead th {
  font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em;
  color:var(--muted); background:var(--surface-2);
  border-bottom:1px solid var(--line-2); padding:.6rem .75rem; white-space:nowrap;
}
.table > tbody > tr > td { padding:.68rem .75rem; border-bottom-color:var(--line); vertical-align:middle; }
.table > tbody > tr:last-child > td { border-bottom-width:0; }
.table-sm > thead th { padding:.45rem .7rem; }
.table-sm > tbody > tr > td { padding:.48rem .7rem; }
/* Rakam sütunları kaymasın. */
.table td,.table th { font-variant-numeric:tabular-nums; }

/* ----------------------------------------------------- bileşen: rozet */

.badge { font-weight:600; font-size:.72rem; letter-spacing:.005em; padding:.34em .6em; border-radius:6px; }
/* Durum rozetleri yumuşak tonda: pasif bilgi tam doygunlukta bağırmaz. */
.badge.text-bg-success { background:var(--success-soft) !important; color:var(--success) !important; }
.badge.text-bg-danger  { background:var(--danger-soft)  !important; color:var(--danger)  !important; }
.badge.text-bg-warning { background:var(--warning-soft) !important; color:var(--warning) !important; }
.badge.text-bg-info    { background:var(--info-soft)    !important; color:var(--info)    !important; }
.badge.text-bg-primary { background:var(--primary-soft) !important; color:var(--primary-ink) !important; }
.badge.text-bg-light   { background:var(--surface) !important; color:var(--ink-2) !important; border:1px solid var(--line-2); }
.badge.text-bg-secondary,.badge.text-bg-dark { background:#eceef3 !important; color:var(--ink-2) !important; }

/* İade talebinin süreçteki günü (bkz. ReturnStatusUi.DayBadge): 14 güne yaklaştıkça kızarır. */
.ret-day { display:inline-block; white-space:nowrap; font-weight:600; font-size:.72rem; line-height:1.3;
           padding:.22em .55em; border-radius:6px; }
.ret-day.rd-green  { background:var(--success-soft); color:var(--success); }
.ret-day.rd-yellow { background:#fef7c3; color:#854d0e; }
.ret-day.rd-orange { background:#ffedd5; color:#c2410c; }
.ret-day.rd-red    { background:var(--danger-soft); color:var(--danger); }
.ret-day.rd-over   { background:var(--danger); color:#fff; }

/* ---------------------------------------------------- bileşen: uyarı */

.alert { border-radius:var(--r); border-width:1px; font-size:.875rem; padding:.75rem 1rem; box-shadow:var(--sh-1); }
.alert-success { background:var(--success-soft); border-color:#c8ead6; color:var(--success); }
.alert-danger  { background:var(--danger-soft);  border-color:#f6ccd6; color:var(--danger); }
.alert-warning { background:var(--warning-soft); border-color:#f2debb; color:var(--warning); }
.alert-info    { background:var(--info-soft);    border-color:#c9e3f5; color:var(--info); }

/* -------------------------------------------------- bileşen: açılır menü */

.dropdown-menu {
  border-color:var(--line); border-radius:12px; box-shadow:var(--sh-pop);
  padding:.35rem; font-size:.875rem; z-index:var(--z-dropdown);
}
.dropdown-item { border-radius:8px; padding:.45rem .6rem; font-weight:500; color:var(--ink-2); }
.dropdown-item:hover,.dropdown-item:focus { background:var(--app); color:var(--ink); }
.dropdown-divider { border-color:var(--line); }

.modal-content { border:0; border-radius:var(--r-xl); box-shadow:var(--sh-pop); }
.modal-header,.modal-footer { border-color:var(--line); }
.nav-tabs { border-bottom-color:var(--line); }
.nav-tabs .nav-link { border:0; color:var(--muted); font-weight:600; font-size:.875rem; padding:.55rem .85rem; border-bottom:2px solid transparent; border-radius:0; }
.nav-tabs .nav-link:hover { color:var(--ink); }
.nav-tabs .nav-link.active { color:var(--primary-ink); background:transparent; border-bottom-color:var(--primary); }
.progress { background:var(--line); border-radius:999px; }
.progress-bar { background:var(--primary); border-radius:999px; }

/* ============================ YÖNETİM KABUĞU ============================ */

.admin-shell { display:flex; min-height:100vh; }

/* ------------------------------------------------------- kenar çubuğu */

.admin-sidebar {
  width:264px; flex-shrink:0; height:100vh; position:sticky; top:0;
  display:flex; flex-direction:column; min-height:0;
  background:var(--sidebar); border-right:1px solid var(--line);
  transition:width .2s var(--ease), transform .24s var(--ease);
}

.brand { display:flex; align-items:center; gap:.6rem; padding:.95rem .9rem .3rem; }
.brand-mark {
  width:32px; height:32px; flex-shrink:0; border-radius:9px;
  background:var(--primary); color:#fff; font-size:.95rem;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 2px 6px rgba(79,70,229,.32);
}
.brand-txt { min-width:0; }
.brand-name { font-weight:700; font-size:.95rem; letter-spacing:-.015em; color:var(--ink); line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.brand-sub  { font-size:.72rem; color:var(--muted); line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Menü araması — 25 kayıt arasında hedefe tek satırda gitmek için. */
.nav-search { position:relative; margin:.7rem .75rem .35rem; }
.nav-search input {
  width:100%; height:34px; border:1px solid var(--line-2); border-radius:9px;
  background:var(--app); color:var(--ink); font-size:.82rem;
  padding:0 2.1rem 0 2rem;
  transition:border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease), background-color var(--dur) var(--ease);
}
.nav-search input::placeholder { color:var(--muted); opacity:1; }
.nav-search input:focus { outline:none; background:var(--surface); border-color:var(--primary); box-shadow:0 0 0 3px rgba(79,70,229,.16); }
.nav-search input::-webkit-search-cancel-button { -webkit-appearance:none; appearance:none; }
.nav-search .ico { position:absolute; left:.62rem; top:50%; transform:translateY(-50%); color:var(--muted); font-size:.85rem; pointer-events:none; }
.nav-search kbd {
  position:absolute; right:.45rem; top:50%; transform:translateY(-50%);
  background:var(--surface); border:1px solid var(--line-2); border-radius:5px;
  color:var(--muted); font-size:.66rem; font-family:inherit; padding:.05rem .32rem; pointer-events:none;
}
.nav-search input:focus ~ kbd { opacity:0; }

.admin-nav { flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden; padding:.35rem .75rem 1rem; }

/* --- yaprak bağlantı --- */
.nav-item-link {
  display:flex; align-items:center; gap:.6rem;
  padding:.5rem .6rem; margin-bottom:1px; border-radius:9px;
  color:var(--ink-2); font-weight:500; font-size:.875rem;
  white-space:nowrap; overflow:hidden;
  transition:background-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.nav-item-link > .bi { font-size:1rem; width:20px; flex-shrink:0; text-align:center; color:var(--faint); transition:color var(--dur) var(--ease); }
.nav-item-link > span { overflow:hidden; text-overflow:ellipsis; }
.nav-item-link:hover { background:var(--sidebar-hover); color:var(--ink); }
.nav-item-link:hover > .bi { color:var(--ink-2); }
.nav-item-link.active { background:var(--primary-soft); color:var(--primary-ink); font-weight:600; }
.nav-item-link.active > .bi { color:var(--primary); }

/* --- katlanır grup --- */
.nav-group { margin-top:.3rem; }
.nav-group-hd {
  width:100%; display:flex; align-items:center; gap:.6rem;
  padding:.5rem .6rem; border:0; background:transparent; border-radius:9px;
  color:var(--muted); font-weight:600; font-size:.8rem; text-align:left;
  cursor:pointer; white-space:nowrap;
  transition:background-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.nav-group-hd > .bi:first-child { font-size:.95rem; width:20px; flex-shrink:0; text-align:center; color:var(--faint); }
.nav-group-hd > span { overflow:hidden; text-overflow:ellipsis; }
.nav-group-hd:hover { background:var(--sidebar-hover); color:var(--ink); }
.nav-group-hd .chev { margin-left:auto; font-size:.7rem; color:var(--faint); flex-shrink:0; transition:transform .24s var(--ease); }
.nav-group-hd .nav-count + .chev { margin-left:.4rem; }
.nav-group.open > .nav-group-hd .chev { transform:rotate(180deg); }
.nav-group.has-active > .nav-group-hd { color:var(--ink); }
.nav-group.has-active > .nav-group-hd > .bi:first-child { color:var(--ink-2); }

/* grid 0fr→1fr: sabit max-height tahmini olmadan gerçek yüksekliğe açılır.
   Geçiş yalnızca .nav-ready sonrası devrede — açılışta hatırlanan gruplar
   akordeonu oynatmadan doğrudan açık gelir. */
.nav-group-items { display:grid; grid-template-rows:0fr; }
.nav-ready .nav-group-items { transition:grid-template-rows .24s var(--ease); }
.nav-group.open > .nav-group-items { grid-template-rows:1fr; }
/* display:flex, [hidden] varsayılanını ezdiği için arama filtresi açıkça gizler. */
.nav-item-link[hidden],.nav-group[hidden],.nav-empty[hidden] { display:none !important; }
.nav-group-items > .inner { overflow:hidden; min-height:0; position:relative; padding-left:1.3rem; }
.nav-group-items > .inner::before {
  content:''; position:absolute; left:.92rem; top:.1rem; bottom:.3rem;
  width:1px; background:var(--line);
}

/* --- sayaç rozeti --- */
.nav-count {
  margin-left:auto; flex-shrink:0;
  min-width:19px; height:18px; padding:0 5px; border-radius:999px;
  background:var(--danger-soft); color:var(--danger);
  font-size:.68rem; font-weight:700; line-height:1;
  display:inline-flex; align-items:center; justify-content:center;
}
.nav-count.warn { background:var(--warning-soft); color:var(--warning); }
/* Grup açıkken toplam gereksiz — sayılar alt satırlarda zaten görünüyor. */
.nav-group.open > .nav-group-hd .nav-count.roll { display:none; }

/* --- alt bilgi --- */
.admin-foot {
  flex-shrink:0; border-top:1px solid var(--line);
  padding:.6rem .9rem; display:flex; align-items:center; gap:.5rem;
  font-size:.72rem; color:var(--muted); white-space:nowrap;
}
.admin-foot .dot { width:6px; height:6px; border-radius:50%; background:var(--success); flex-shrink:0; }

/* ---------------------------------------------------------- üst çubuk */

.admin-content { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; }

.admin-topbar {
  position:sticky; top:0; z-index:var(--z-sticky);
  background:var(--surface); border-bottom:1px solid var(--line);
  padding:.55rem 1.25rem; min-height:57px;
  display:flex; align-items:center; gap:.75rem;
}
.admin-topbar .ttl { font-weight:600; font-size:1rem; letter-spacing:-.015em; color:var(--ink); min-width:0; }

.user-chip {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.2rem .6rem .2rem .2rem; border:1px solid var(--line-2); border-radius:999px;
  background:var(--surface); color:var(--ink-2); font-weight:600; font-size:.82rem;
  transition:background-color var(--dur) var(--ease);
}
.user-chip:hover { background:var(--app); color:var(--ink); }
.user-chip::after { display:none; }              /* bootstrap ok işareti yerine chevron */
.user-chip .av {
  width:26px; height:26px; flex-shrink:0; border-radius:50%;
  background:var(--primary-soft); color:var(--primary-ink);
  display:flex; align-items:center; justify-content:center;
  font-size:.7rem; font-weight:700; letter-spacing:.02em;
}

.admin-body { padding:1.5rem 1.5rem 3rem; width:100%; max-width:1680px; margin-inline:auto; }

/* --------------------------------------------------- istatistik kartı */

.stat-card {
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:1rem 1.1rem; box-shadow:var(--sh-2);
  display:flex; align-items:center; gap:.9rem; height:100%;
  transition:box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease), transform var(--dur) var(--ease);
}
a.stat-card:hover { box-shadow:var(--sh-3); border-color:var(--line-2); transform:translateY(-1px); }
.stat-card .ico { width:42px; height:42px; border-radius:11px; display:inline-flex; align-items:center; justify-content:center; font-size:1.25rem; flex-shrink:0; }
.stat-card .val { font-weight:700; font-size:1.6rem; line-height:1.1; color:var(--ink); letter-spacing:-.025em; font-variant-numeric:tabular-nums; }
.stat-card .lbl { color:var(--muted); font-size:.8125rem; margin-top:.15rem; }
.ic-green { background:var(--success-soft); color:var(--success); }
.ic-blue  { background:var(--info-soft);    color:var(--info); }
.ic-amber { background:var(--warning-soft); color:var(--warning); }
.ic-rose  { background:var(--danger-soft);  color:var(--danger); }
.ic-indigo{ background:var(--primary-soft); color:var(--primary-ink); }
.ic-dark  { background:#eceef3;             color:var(--ink-2); }

/* ------------------------------------------------------------- giriş */

.login-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(140deg,#1e1b4b 0%,#111827 55%,#0b0d12 100%); padding:1rem; }
.login-card { background:var(--surface); border-radius:var(--r-xl); box-shadow:0 24px 64px -12px rgba(0,0,0,.45); padding:2.2rem; width:100%; max-width:404px; }

/* Sayfa altına yapışan aksiyon çubuğu (sevkiyat ekranları). Hem yönetim
   kabuğunda hem yalın toplayıcı kabuğunda kullanıldığı için burada. */
.pick-sticky-bottom {
  position:sticky; bottom:0; z-index:15; background:var(--surface);
  border-top:1px solid var(--line); padding:.75rem 1rem; margin-top:1rem;
  border-radius:var(--r-lg) var(--r-lg) 0 0; box-shadow:0 -6px 18px rgba(16,24,40,.06);
}

/* Dar ekranda çubuk yalnız düğmelerden ibaret kalır: açıklama metni ekranın
   yarısını yiyordu, iki düğme de alt alta kırpılıyordu. */
@media (max-width: 575.98px) {
  .pick-sticky-bottom { padding:.6rem .75rem; gap:.5rem; }
  .pick-sticky-bottom .pick-hint { display:none; }
  .pick-sticky-bottom > .ms-auto { width:100%; }
  .pick-sticky-bottom > .ms-auto > form { flex:1 1 auto; }
  .pick-sticky-bottom > .ms-auto .btn { width:100%; }
}

/* Sayfa içindeki ikinci yapışkan çubuk (toplama araç çubuğu) başlığın ALTINA
   oturur. Başlık yüksekliği içeriğe göre değiştiği için sabit değil; ölçülüp
   --pick-top-h'ye yazılır (js/yapiskan-baslik.js). */
.pick-sticky-top { position:sticky; top:var(--pick-top-h, 60px); z-index:5; }

/* DHL kolisi (paketleme / toplu sevk okutması): asıl firmadan AYRI kuryeye gider. DHL'in
   sarı/kırmızısı öteki uyarılardan (değişim mavi, hata kırmızı zemin) ilk bakışta ayrışır. */
.dhl-uyari { background:#ffcc00; color:#d40511; border:2px solid #d40511; }
.dhl-rozet { background:#ffcc00; color:#d40511; font-weight:700; }
/* !important: değişim satırının mavi kenarı (Bootstrap .border-primary) DHL'i örtmesin. */
.list-group-item.dhl-satir { border-left:6px solid #d40511 !important; background:#fff8d1; }

/* Toplama araç çubuğundaki arama: masaüstünde dar, telefonda tam genişlik. */
.pick-search { max-width:300px; }
@media (max-width: 575.98px) { .pick-search { max-width:none; flex:1 1 100%; } }

/* Bootstrap'te min-width yardımcısı YOK. Esnek bir satırda `text-truncate`
   ancak min-width:0 ile çalışır; olmayınca uzun ürün adı kutuyu ve sayfayı
   yana taşırıyordu (sevkiyat toplama kartı, toplayıcı başlığı). */
.min-w-0 { min-width:0; }

/* Bekleyen Ürünler → PTT AVM kartı: PTT siparişleri mağaza turuna girmez, kendi turunda toplanır.
   Renk sipariş kanalı rozetindeki PTT rengi (Services/OrderChannel.cs, #b45309). Telefonda düğme tam genişlik. */
.ptt-card { border-left:5px solid #b45309; }
.ptt-ink { color:#b45309; }
.ptt-bg { background:#b45309; color:#fff; }
.ptt-btn { background:#b45309; border-color:#b45309; color:#fff; }
.ptt-btn:hover, .ptt-btn:focus { background:#92400e; border-color:#92400e; color:#fff; }
@media (max-width: 575.98px) {
  .ptt-actions { width:100%; }
  .ptt-actions form, .ptt-actions .ptt-btn, .ptt-actions a.btn-primary { width:100%; }
}

/* Kabul & Değişim — yönetim kabuğundaki masaüstü düzeni (Views/Sevkiyat/Kabul*).
   Liste tablo olur, satırın tamamı talebi açar; ürünü depoda olan satır sol şeritle ayrışır.
   Detayda talep özeti solda yapışık durur, sağdaki uzun kontrol formu kayarken göz önünde kalır. */
.kabul-tablo tbody tr[data-href] { cursor:pointer; }
.kabul-tablo tbody tr.kontrolde > td:first-child { box-shadow:inset 3px 0 0 var(--warning); }
.kabul-tablo .kabul-urun > div { max-width:360px; }   /* hücrede max-width yok sayılır */
@media (min-width: 992px) {
  .kabul-ozet { position:sticky; top:calc(var(--pick-top-h, 60px) + 1rem); }
}

/* Görsel büyütme katmanı (sevkiyat ekranları): küçük kareye dokununca
   ürünün tam boy hâli açılır — depoda doğru ürünü ayırt etmenin tek yolu. */
.img-zoomable { cursor:zoom-in; }
.zoom-overlay {
  position:fixed; inset:0; z-index:1090; display:flex; align-items:center; justify-content:center;
  background:rgba(9,11,15,.92); padding:1rem; cursor:zoom-out;
  -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
}
.zoom-overlay img {
  max-width:100%; max-height:100%; object-fit:contain;
  border-radius:12px; box-shadow:0 20px 60px rgba(0,0,0,.6); background:#fff;
}
.zoom-overlay .zoom-cap {
  position:absolute; left:0; right:0; bottom:0; padding:.9rem 1rem calc(.9rem + env(safe-area-inset-bottom));
  color:#fff; font-size:.9rem; text-align:center; background:linear-gradient(transparent,rgba(0,0,0,.75));
}
.zoom-overlay .zoom-close {
  position:absolute; top:calc(.6rem + env(safe-area-inset-top)); right:.6rem;
  width:44px; height:44px; border:0; border-radius:50%;
  background:rgba(255,255,255,.14); color:#fff; font-size:1.3rem; line-height:1;
}

/* ================= MASAÜSTÜ: SİMGE ŞERİDİNE DARALT ================= */
/* Daraltılmışken gruplar zorla açılır; başlık satırları ayraca dönüşür,
   böylece 25 hedefin tamamı tek tıkla erişilebilir kalır. */

.nav-collapsed .admin-sidebar { width:72px; }
.nav-collapsed .brand { justify-content:center; padding:.95rem .5rem .3rem; }
.nav-collapsed .brand-txt,
.nav-collapsed .nav-search { display:none; }
.nav-collapsed .admin-nav { padding:.7rem .6rem 1rem; }
.nav-collapsed .nav-item-link { justify-content:center; padding:.55rem 0; position:relative; }
.nav-collapsed .nav-item-link > span:not(.nav-count) { display:none; }
.nav-collapsed .nav-item-link > .bi { width:auto; font-size:1.08rem; }
.nav-collapsed .nav-group-hd { display:none; }
.nav-collapsed .nav-group { margin-top:.55rem; padding-top:.55rem; border-top:1px solid var(--line); }
.nav-collapsed .nav-group-items { grid-template-rows:1fr; }
.nav-collapsed .nav-group-items > .inner { padding-left:0; }
.nav-collapsed .nav-group-items > .inner::before { display:none; }
/* Şeritte etiket yok: sayaç tek uyarı sinyali, o yüzden dolu renkle basılır. */
.nav-collapsed .nav-count {
  position:absolute; top:2px; right:5px; margin:0;
  min-width:16px; height:16px; padding:0 4px; font-size:.62rem;
  background:var(--danger); color:#fff; box-shadow:0 0 0 2px var(--sidebar);
}
.nav-collapsed .nav-count.warn { background:var(--warning); color:#fff; }
.nav-collapsed .nav-count.roll { display:none; }
.nav-collapsed .admin-foot { justify-content:center; padding-inline:.4rem; }
.nav-collapsed .admin-foot .txt { display:none; }

/* ================= MOBİL: MENÜ BİR ÇEKMECEDİR ================= */

.admin-backdrop { display:none; }

@media (max-width: 991.98px) {
  .admin-sidebar {
    position:fixed; top:0; left:0; bottom:0; z-index:var(--z-drawer);
    width:284px; height:100vh; transform:translateX(-100%);
    box-shadow:0 0 50px rgba(16,24,40,.28);
  }
  .nav-open .admin-sidebar { transform:translateX(0); }
  .admin-backdrop {
    display:block; position:fixed; inset:0; z-index:var(--z-backdrop);
    background:rgba(16,19,26,.42); opacity:0; pointer-events:none;
    transition:opacity .24s var(--ease);
  }
  .nav-open .admin-backdrop { opacity:1; pointer-events:auto; }
  .nav-open { overflow:hidden; }

  /* Daraltma yalnızca masaüstünde anlamlı; çekmece her zaman tam genişlikte. */
  .nav-collapsed .admin-sidebar { width:284px; }
  .nav-collapsed .brand { justify-content:flex-start; padding:.95rem .9rem .3rem; }
  .nav-collapsed .brand-txt { display:block; }
  .nav-collapsed .nav-search { display:block; }
  .nav-collapsed .admin-nav { padding:.35rem .75rem 1rem; }
  .nav-collapsed .nav-item-link { justify-content:flex-start; padding:.5rem .6rem; }
  .nav-collapsed .nav-item-link > span:not(.nav-count) { display:inline; }
  .nav-collapsed .nav-item-link > .bi { width:20px; font-size:1rem; }
  .nav-collapsed .nav-group-hd { display:flex; }
  .nav-collapsed .nav-group { margin-top:.3rem; padding-top:0; border-top:0; }
  .nav-collapsed .nav-group-items { grid-template-rows:0fr; }
  .nav-collapsed .nav-group.open > .nav-group-items { grid-template-rows:1fr; }
  .nav-collapsed .nav-group-items > .inner { padding-left:1.3rem; }
  .nav-collapsed .nav-group-items > .inner::before { display:block; }
  .nav-collapsed .nav-count { position:static; margin-left:auto; min-width:19px; height:18px; padding:0 5px; font-size:.68rem; }
  .nav-collapsed .nav-count.roll { display:inline-flex; }
  .nav-collapsed .nav-group.open > .nav-group-hd .nav-count.roll { display:none; }
  .nav-collapsed .admin-foot .txt { display:inline; }

  .admin-topbar { padding:.5rem .9rem; gap:.5rem; min-height:53px; }
  .admin-topbar .ttl { font-size:.95rem; }
  .admin-body { padding:1.1rem .9rem 2.5rem; min-width:0; }
  .panel { padding:1rem; }
  .panel-hd { margin:-1rem -1rem .85rem; padding:.75rem 1rem; }
}

/* Bitişik düğme grubu (ör. "Sipariş / Ürün / Domain bazında") sarmalanmadığı
   için dar ekranda tüm sayfayı yatay kaydırıyordu. Dar ekranda grup dağılır,
   her düğme kendi hapına döner; sayfa gövdesi asla yana kaymaz. */
@media (max-width: 767.98px) {
  .btn-group,.btn-group-sm { flex-wrap:wrap; gap:.35rem; max-width:100%; }
  .btn-group > .btn,.btn-group-sm > .btn { border-radius:8px !important; margin-left:0 !important; }
}

/* Dar telefonlarda tablolar sayfayı yatay kaydırmasın, kendi içinde kaysın. */
@media (max-width: 575.98px) {
  .table-responsive { -webkit-overflow-scrolling:touch; }
  .stat-card { padding:.8rem .85rem; gap:.7rem; }
  .stat-card .ico { width:38px; height:38px; font-size:1.1rem; }
  .stat-card .val { font-size:1.3rem; }
  h1,.h1 { font-size:1.45rem; }
  h2,.h2 { font-size:1.3rem; }
  h3,.h3 { font-size:1.18rem; }
  .page-head { margin-bottom:.9rem; }
}

/* ------------------------------------------------------------ hareket */

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;
  }
  /* Akordeon anlık açılıp kapansın — ara kare yok. */
  .nav-group-items { transition:none; }
}

@media print {
  .admin-sidebar,.admin-topbar,.admin-backdrop { display:none !important; }
  .admin-body { padding:0; max-width:none; }
  .panel { border:0; box-shadow:none; }
}

/* ------------------------------------------------ tablo filtresi (arama + koşul kurucusu)
   Sipariş vb. listelerde üstteki arama kutusu, "Filtre" açılır paneli ve uygulanmış
   koşul çipleri. Bileşen iki panelde de aynı görünsün diye yalnız tasarım belirteçleri
   (token) kullanılır — bkz. Views/Shared/_TableFilter.cshtml + js/table-filter.js. */

.tfilter { position:relative; margin-bottom:1rem; }
.tfilter-bar { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }

.tfilter-search { position:relative; display:flex; align-items:center; flex:0 1 340px; min-width:210px; margin:0; }
.tfilter-search .bi-search { position:absolute; left:.7rem; color:var(--faint); font-size:.9rem; pointer-events:none; }
.tfilter-search input { width:100%; padding:.45rem 1.9rem .45rem 2.1rem; border:1px solid var(--line-2);
  border-radius:var(--r); background:var(--surface); color:var(--ink); font-size:.875rem; }
.tfilter-search input:focus { outline:none; border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-soft); }
.tfilter-search input::-webkit-search-cancel-button { display:none; }
.tfilter-x { position:absolute; right:.6rem; color:var(--muted); font-size:.72rem; line-height:1; text-decoration:none; }
.tfilter-x:hover { color:var(--ink); }

.tfilter-open { display:inline-flex; align-items:center; gap:.4rem; padding:.45rem .8rem; border:1px solid var(--line-2);
  border-radius:var(--r); background:var(--surface); color:var(--ink-2); font-size:.875rem; font-weight:600; }
.tfilter-open:hover { background:var(--sidebar-hover); }
.tfilter-on .tfilter-open { border-color:var(--primary); background:var(--primary-soft); color:var(--primary-ink); }
.tfilter-badge { min-width:1.25rem; padding:0 .35rem; border-radius:999px; background:var(--primary);
  color:var(--on-primary); font-size:.7rem; font-weight:700; line-height:1.25rem; text-align:center; }
.tfilter-result { margin-left:auto; color:var(--muted); font-size:.8rem; }

/* "Excel'e Aktar": filtre düğmesiyle aynı kalıp, ikonu Excel yeşili. */
.tfilter-export { display:inline-flex; align-items:center; gap:.4rem; padding:.45rem .8rem; border:1px solid var(--line-2);
  border-radius:var(--r); background:var(--surface); color:var(--ink-2); font-size:.875rem; font-weight:600;
  text-decoration:none; white-space:nowrap; }
.tfilter-export:hover { background:var(--sidebar-hover); color:var(--ink); }
.tfilter-export i { color:#1d6f42; }

/* Kırılım (görünüm) seçimi: arama satırında duran bitişik düğme grubu. */
.tfilter-modes { display:inline-flex; border:1px solid var(--line-2); border-radius:var(--r); overflow:hidden; }
.tfilter-mode { display:inline-flex; align-items:center; gap:.35rem; padding:.45rem .75rem; border-left:1px solid var(--line);
  background:var(--surface); color:var(--muted); font-size:.85rem; font-weight:600; text-decoration:none; white-space:nowrap; }
.tfilter-mode:first-child { border-left:0; }
.tfilter-mode:hover { background:var(--sidebar-hover); color:var(--ink-2); }
.tfilter-mode.on { background:var(--primary-soft); color:var(--primary-ink); }

.tfilter-chips { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; margin-top:.6rem; }
.tfilter-chip { display:inline-flex; align-items:center; gap:.3rem; padding:.25rem .3rem .25rem .65rem;
  border:1px solid var(--primary-soft-2); border-radius:999px; background:var(--primary-soft);
  color:var(--primary-ink); font-size:.78rem; font-weight:600; }
.tfilter-chip a { display:inline-flex; align-items:center; justify-content:center; width:1.15rem; height:1.15rem;
  border-radius:50%; color:inherit; text-decoration:none; opacity:.65; }
.tfilter-chip a:hover { background:rgba(16,24,40,.10); opacity:1; }
.tfilter-clear { font-size:.78rem; color:var(--muted); }

.tfilter-panel { position:absolute; z-index:var(--z-dropdown); top:calc(100% + .4rem); left:0;
  width:min(700px, calc(100vw - 2rem)); padding:.9rem; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-lg); box-shadow:var(--sh-pop); }
.tfilter-row { display:flex; align-items:flex-start; gap:.4rem; margin-bottom:.5rem; }
.tfilter-field { flex:0 0 11rem; }
.tfilter-op { flex:0 0 9.5rem; }
.tfilter-value { flex:1 1 auto; display:flex; align-items:center; gap:.35rem; min-width:0; }
.tfilter-del { flex:0 0 auto; width:2rem; height:2rem; border:0; background:transparent; color:var(--muted);
  border-radius:var(--r-sm); }
.tfilter-del:hover { background:var(--danger-soft); color:var(--danger); }

.tfilter-opts { display:flex; flex-wrap:wrap; gap:.3rem; width:100%; max-height:9.5rem; overflow:auto;
  padding:.3rem; border:1px solid var(--line); border-radius:var(--r-sm); }
.tfilter-opt { display:inline-flex; align-items:center; gap:.3rem; padding:.15rem .55rem; border:1px solid var(--line-2);
  border-radius:999px; font-size:.78rem; cursor:pointer; user-select:none; }
.tfilter-opt.on { border-color:var(--primary); background:var(--primary-soft); color:var(--primary-ink); font-weight:600; }
.tfilter-opt input { accent-color:var(--primary); margin:0; }
.tfilter-hint, .tfilter-sep { color:var(--muted); font-size:.8rem; }

.tfilter-empty { margin:.2rem 0 .8rem; color:var(--muted); font-size:.85rem; }
.tfilter-foot { display:flex; align-items:center; gap:.5rem; padding-top:.65rem; border-top:1px solid var(--line); }
.tfilter-add { margin-right:auto; display:inline-flex; align-items:center; gap:.35rem; border:0; background:transparent;
  color:var(--primary); font-size:.85rem; font-weight:600; }
.tfilter-add:hover { text-decoration:underline; }

/* Kayıtlı süzgeçler: panelin üstünde ad çipleri, altta ad kutusu. Liste şu an kayıtlı bir
   süzgeçle açıksa adı Filtre düğmesinin yanında durur (üç nokta için blok kutu; esnek kutuda çalışmaz). */
.tfilter-current { display:inline-block; max-width:16rem; padding:.45rem .7rem; border-radius:var(--r);
  background:var(--primary-soft); color:var(--primary-ink); font-size:.82rem; font-weight:600;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; vertical-align:middle; }
.tfilter-saved { margin-bottom:.8rem; padding-bottom:.75rem; border-bottom:1px solid var(--line); }
.tfilter-saved-hd { display:flex; align-items:center; gap:.35rem; margin-bottom:.45rem; color:var(--muted);
  font-size:.78rem; font-weight:700; }
.tfilter-saved-list { display:flex; flex-wrap:wrap; gap:.35rem; }
.tfilter-saved-item { display:inline-flex; align-items:center; max-width:100%; border:1px solid var(--line-2);
  border-radius:999px; background:var(--surface); font-size:.8rem; }
.tfilter-saved-item:hover { border-color:var(--primary-soft-2); }
.tfilter-saved-item a { min-width:0; padding:.28rem .2rem .28rem .7rem; color:var(--ink-2); font-weight:600;
  text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tfilter-saved-item a:hover { color:var(--primary); }
.tfilter-saved-item button { flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
  width:1.4rem; height:1.4rem; margin-right:.2rem; border:0; border-radius:50%; background:transparent; color:var(--muted); }
.tfilter-saved-item button:hover { background:var(--danger-soft); color:var(--danger); }
.tfilter-saved-item.on { border-color:var(--primary); background:var(--primary-soft); }
.tfilter-saved-item.on a { color:var(--primary-ink); }
.tfilter-saved-none { margin:0; color:var(--muted); font-size:.82rem; }
.tfilter-save { padding-top:.65rem; border-top:1px solid var(--line); }
.tfilter-save-lbl { display:block; margin-bottom:.3rem; color:var(--ink-2); font-size:.8rem; font-weight:600; }
.tfilter-save-row { display:flex; align-items:center; gap:.4rem; }
.tfilter-save-row input { flex:1 1 auto; min-width:0; }
.tfilter-save-note { margin:.45rem 0 0; color:var(--muted); font-size:.78rem; }
.tfilter-save-note.bad { color:var(--danger); }

@media (max-width:575.98px) {
  /* Telefonda dört öğe dört satır yiyordu. Sıra değiştirilerek "Filtre" ile
     "Excel'e Aktar" tek satırı paylaşır; altında görünüm seçimi tam genişlikte. */
  .tfilter-search { flex:1 1 100%; order:1; }
  .tfilter-open   { flex:1 1 0; justify-content:center; order:2; }
  .tfilter-export { flex:1 1 0; width:auto; justify-content:center; order:3; }
  .tfilter-current { flex:1 1 100%; max-width:none; order:4; }
  .tfilter-modes  { width:100%; order:4; }
  .tfilter-result { width:100%; margin-left:0; order:5; }
  .tfilter-mode { flex:1 1 0; justify-content:center; padding:.45rem .4rem; min-width:0; }
  .tfilter-row { flex-wrap:wrap; }
  /* Kaydet ile alt çubukta dört düğme var: "Filtre Ekle" kendi satırına, kalan üçü eşit paylaşır. */
  .tfilter-foot { flex-wrap:wrap; }
  .tfilter-foot .tfilter-add { flex:1 1 100%; }
  .tfilter-foot .btn { flex:1 1 0; white-space:nowrap; }
  .tfilter-field, .tfilter-op { flex:1 1 46%; }
  .tfilter-value { flex:1 1 100%; }
}

/* 320-360px arasında üç etiket kutuya sığmıyor ve .tfilter-modes overflow:hidden
   olduğu için GÖRÜNMEDEN kırpılıyordu (üç nokta esnek kutuda çalışmaz). En dar
   ekranlarda simgeler düşer, yazı bir tık küçülür; etiketin tamamı okunur. */
@media (max-width:400px) {
  .tfilter-mode { font-size:.8rem; gap:0; }
  .tfilter-mode > .bi { display:none; }
}

/* ------------------------------------------------ sipariş kanalı rozeti
   Web / Mobil Uygulama / Instagram / PTT AVM… Renk satırdan --ch ile verilir (bkz. OrderChannel);
   B2C Admin admin.css'te aynı kural var, iki panel aynı görünsün. */
.ch-badge { display:inline-flex; align-items:center; gap:.3rem; padding:.16rem .5rem; border-radius:999px;
  font-size:.74rem; font-weight:600; line-height:1.35; white-space:nowrap; color:var(--ch, #64748b);
  background:color-mix(in srgb, var(--ch, #64748b) 11%, transparent);
  border:1px solid color-mix(in srgb, var(--ch, #64748b) 24%, transparent); }
.ch-badge .ch-dev { margin-left:.1rem; opacity:.6; font-size:.72rem; }
.ch-badge b { font-weight:700; }
/* Liste üstündeki kanal şeridinde rozet bağlantıdır: tıklanınca liste o kanala süzülür
   (bkz. OrderFilters.ChannelToggle). Seçili rozet dolu renk, öbürleri soluk. */
a.ch-badge { text-decoration:none; cursor:pointer; transition:background-color .15s, color .15s, opacity .15s; }
a.ch-badge:hover { color:var(--ch, #64748b); background:color-mix(in srgb, var(--ch, #64748b) 20%, transparent); }
a.ch-badge:focus-visible { outline:2px solid var(--ch, #64748b); outline-offset:2px; }
a.ch-badge.on, a.ch-badge.on:hover { color:#fff; background:var(--ch, #64748b); border-color:var(--ch, #64748b); }
.ch-strip.has-on a.ch-badge:not(.on) { opacity:.6; }
.ch-strip.has-on a.ch-badge:not(.on):hover { opacity:1; }
.ch-badge .ch-x { margin-left:.1rem; font-size:.6rem; opacity:.85; }

/* ================== DURUM ŞERİDİ (liste üstü hızlı süzgeç) ==================
   "Tümü · Beklemede · Ödendi…" satırı. Telefonda 7 düğme sarmalanıp ekranın üçte
   birini yiyordu; dar ekranda tek satırda yatay kayar (seçili olan js ile görünüre
   alınır), masaüstünde eskisi gibi sarmalanır. Renkli nokta durum rozetiyle aynı
   renktedir — sınıf, rozetin `text-bg-*` adından türetilir (bkz. Orders/Index). */

.sfilter { display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; margin-bottom:.9rem; }
.sfilter-chip {
  display:inline-flex; align-items:center; gap:.4rem; padding:.42rem .75rem;
  border:1px solid var(--line-2); border-radius:999px; background:var(--surface);
  color:var(--ink-2); font-size:.8125rem; font-weight:600; text-decoration:none; white-space:nowrap;
  transition:background-color var(--dur) var(--ease), border-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.sfilter-chip:hover { background:var(--sidebar-hover); color:var(--ink); }
.sfilter-chip .dot { width:7px; height:7px; border-radius:50%; background:var(--faint); flex-shrink:0; }
.sfilter-chip .n { color:var(--muted); font-weight:700; font-variant-numeric:tabular-nums; }
.sfilter-chip.on { border-color:var(--primary); background:var(--primary-soft); color:var(--primary-ink); }
.sfilter-chip.on .n { color:var(--primary-ink); }
.sf-warning .dot { background:var(--warning); }
.sf-info    .dot { background:var(--info); }
.sf-primary .dot { background:var(--primary); }
.sf-success .dot { background:var(--success); }
.sf-danger  .dot { background:var(--danger); }
.sf-dark    .dot { background:var(--ink); }

/* Kanal dağılımı (Web · Mobil · Instagram…) aynı şerit kalıbını kullanır. */
.ch-strip { display:flex; align-items:center; gap:.45rem; flex-wrap:wrap; margin-bottom:.9rem; font-size:.8rem; }

/* Şeridin ekran kenarına uzanması için kabuğun yan payı gerekir; yalnız yönetim
   kabuğu bunu bildirir (--gutter), yalın sevkiyat kabuğunda pay 0 → taşma olmaz.
   Değer gövdenin gerçek yan payıyla birebir olmalı, yoksa sayfa yana kayar; bu yüzden
   mobil karşılığı da (yukarıdaki .admin-body kuralıyla aynı) burada, en sonda durur. */
.admin-body { --gutter:1.5rem; }
@media (max-width: 991.98px) { .admin-body { --gutter:.9rem; } }

@media (max-width: 767.98px) {
  .sfilter, .ch-strip {
    flex-wrap:nowrap; overflow-x:auto; scroll-snap-type:x proximity;
    margin-inline:calc(var(--gutter, 0px) * -1); padding:.15rem var(--gutter, 0px);
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
  }
  .sfilter::-webkit-scrollbar, .ch-strip::-webkit-scrollbar { display:none; }
  .sfilter-chip { scroll-snap-align:center; padding:.45rem .8rem; }
  .ch-strip > * { flex:0 0 auto; }
}

/* ============== SİPARİŞ TABLOSU: TELEFONDA HER SATIR BİR KARTTIR ==============
   Sipariş listeleri telefonda da açılıyor (sevkiyat personeli, sahada). 10 kolonu
   yatay kaydırmak yerine ≤767px'de satır karta döner:

     30124                                    [Beklemede]
     Ahmet Yılmaz
     [Web]  moora.com.tr  17.09.2026 14:32        [Sevk]
     Ciro 1.250 ₺   Kâr 320 ₺                     [Yönet]

   Tek kaynak: aynı <td> hücreleri, yalnız yerleşim değişir — bu yüzden AJAX ile
   sonradan gelen kırılım satırları da kendiliğinden kapsanır. Hücre sınıfları:
   o-no o-cust o-ch o-dom o-date o-st o-ship o-var o-qty o-rev o-profit o-act */

.otable > thead > tr > th:first-child,
.otable > tbody > tr > td:first-child { padding-left:1.25rem; }
.otable > thead > tr > th:last-child,
.otable > tbody > tr > td:last-child  { padding-right:1.25rem; }
/* Satırın tamamı siparişi açar (düğmeyi hedeflemek telefonda zor). */
.otable tbody tr[data-href] { cursor:pointer; }
.o-m, .o-go { display:none; }   /* yalnız kart görünümünde görünen etiket / ok işareti */
/* Mağaza hücresi: bayi adı üstte, alan adı altında (PTT AVM siparişinde yalnız bayi). */
.o-dom .o-store { display:block; color:var(--ink); font-weight:500; }
.o-dom .o-host  { display:block; }

@media (max-width: 767.98px) {
  .otable-wrap.table-responsive { overflow:visible; }   /* kartta yatay kaydırma yok */

  .otable > thead { display:none; }
  .otable > tbody { display:block; }
  /* Yerleşim ızgaradır, esnek sarmalama değil: sarmalamada "şu hücreden sonra satır
     kır" denemediği için tutar satırı ekran genişliğine göre meta satırına kaçıyordu.
     Satır sırası sabittir. Kullanılmayan satır (ör. sipariş bazında varyant yok) sıfır
     yükseklik alsın diye dikey boşluk satır aralığından değil hücre dolgusundan gelir. */
  .otable > tbody > tr {
    display:grid; align-items:center;
    grid-template-columns:auto minmax(0,1fr) auto auto auto;
    grid-template-areas:
      "no   no   ship st     act"
      "cust cust cust cust   cust"
      "var  var  var  qty    qty"
      "ch   dom  dom  date   date"
      "rev  rev  rev  profit profit";
    column-gap:.5rem; padding:.6rem .85rem .65rem;
    border-bottom:1px solid var(--line);
  }
  .otable > tbody > tr:last-child { border-bottom:0; }
  /* Kartta hücre bazlı vurgu lekeli görünür (boş ızgara gözleri boyanmaz): dokunma
     ve fare vurgusu satırın tamamına uygulanır. */
  .otable > tbody > tr:hover > *, .otable > tbody > tr:active > * { --bs-table-bg-state:transparent; }
  .otable > tbody > tr:hover, .otable > tbody > tr:active { background:var(--sidebar-hover); }
  /* Hücre payları kart yerleşimini bozmasın (ilk/son hücrenin masaüstü payı da). */
  .otable > tbody > tr > td,
  .otable > tbody > tr > td:first-child,
  .otable > tbody > tr > td:last-child { padding:.12rem 0; border:0; min-width:0; }
  /* Yükleniyor · boş liste · "daha fazla göster" satırları tek parça kalır. */
  .otable > tbody > tr > td[colspan] { grid-column:1 / -1; text-align:center; }

  .o-no   { grid-area:no; font-size:.95rem; font-weight:700; letter-spacing:-.01em; }
  .o-st   { grid-area:st; justify-self:end; }
  /* "Yönet" düğmesi kartta koca bir satır yiyordu; ilk satırın sonunda bir ok
     işaretine döner (satırın tamamı zaten siparişi açar). Bağlantı erişilebilir
     kalsın diye metin silinmez, yalnız ekran okuyucuya bırakılır. */
  .o-act  { grid-area:act; justify-self:end; }
  .o-act .btn { border:0; background:transparent; color:var(--faint); box-shadow:none; padding:.1rem 0 .1rem .3rem; }
  .o-act .o-txt { position:absolute; width:1px; height:1px; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
  .o-act .o-go { display:inline; font-size:1.05rem; }
  .o-cust { grid-area:cust; color:var(--ink); font-weight:500; }
  .o-var  { grid-area:var; color:var(--muted); font-size:.8rem; }
  .o-ch   { grid-area:ch; }
  /* Uzun mağaza adı kartı taşırmasın: esnek sütunda kısalır. */
  .o-dom  { grid-area:dom; font-size:.8rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  /* Kartta tek satır: "OUTLET BOX · outletbox.tr". */
  .o-dom .o-store, .o-dom .o-host { display:inline; }
  .o-dom .o-store + .o-host::before { content:" · "; }
  .o-date { grid-area:date; font-size:.8rem; white-space:nowrap; }
  .o-date > div { display:inline; margin-left:.3rem; }
  .o-ship { grid-area:ship; justify-self:end; }   /* durum rozetinin solunda */
  /* Tutar satırı kartın sol kenarından başlar (üç sütun boyu), kâr sağ kenarda.
     Adet ürün kırılımında varyantın karşısına oturur. text-align'ı Bootstrap'in
     text-end yardımcısı !important ile verdiği için karşılığı da öyle olmak zorunda. */
  .o-qty    { grid-area:qty; justify-self:end; text-align:right !important; }
  .o-rev    { grid-area:rev; font-weight:600; text-align:left !important; }
  .o-profit { grid-area:profit; justify-self:end; text-align:right !important; }

  /* Başlık satırı gizli olduğu için sayının ne olduğu etiketinden okunur. */
  .otable [data-label]::before {
    content:attr(data-label) " ";
    color:var(--muted); font-weight:500; font-size:.76rem;
  }
  /* Kartta "—" bilgi taşımaz; hücre boşalıp büzülür. */
  .otable .o-dash { display:none; }
  .o-m { display:inline; margin-left:.2rem; }
}

/* ============ KIRILIM PANELİ BAŞLIĞI (ürün / domain bazında görünüm) ============
   Başlık artık gerçek bir <button>: klavyeyle de açılır, ok işareti açık durumda
   döner. Masaüstünde tek satır; telefonda ürün adı kendi satırına geçer, sayılar
   altında sarmalanır (eskiden min-width'li satır içi stiller kutuyu taşırıyordu). */

.grp-sum { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:.5rem; margin-bottom:.6rem; }
.grp-hd {
  display:flex; align-items:center; gap:.75rem; width:100%;
  padding:.85rem 1rem; border:0; background:transparent; color:inherit; text-align:left;
  border-radius:var(--r-lg);
}
.grp-hd:hover { background:var(--surface-2); }
.grp-caret { color:var(--faint); flex:0 0 auto; transition:transform var(--dur) var(--ease); }
.grp-hd[aria-expanded="true"] .grp-caret { transform:rotate(180deg); }
.grp-hd[aria-expanded="true"] { border-radius:var(--r-lg) var(--r-lg) 0 0; }
.grp-sku { flex:0 0 auto; min-width:88px; color:var(--muted); font-size:.78rem; }
.grp-name { flex:1 1 auto; min-width:0; font-weight:600; }
.grp-meta { display:flex; align-items:center; gap:.7rem; flex:0 0 auto; margin-left:auto; }
.grp-meta .lbl { color:var(--muted); font-size:.8rem; white-space:nowrap; }
.grp-money { font-weight:600; font-variant-numeric:tabular-nums; white-space:nowrap; }

@media (max-width: 767.98px) {
  .grp-hd { flex-wrap:wrap; gap:.35rem .6rem; padding:.7rem .85rem; }
  .grp-caret { order:1; }
  .grp-sku { order:2; min-width:0; }
  .grp-name { order:3; flex:1 1 100%; }
  .grp-meta { order:4; flex:1 1 100%; margin-left:0; flex-wrap:wrap; gap:.35rem .6rem; }
}

/* Yönetim kabuğunda iOS zoom'u: kök yazı boyutu 15px olduğundan telefonda bir
   form alanına dokununca Safari sayfayı zorla yakınlaştırıyor (16px altı her alan).
   Yalın sevkiyat kabuğunda aynı kural kendi layout'unda tanımlı. */
@media (max-width: 991.98px), (hover: none) and (pointer: coarse) {
  .admin-shell input:not([type=checkbox]):not([type=radio]):not([type=range]),
  .admin-shell select, .admin-shell textarea { font-size:16px; }
}

/* ============ ETİKET YAZICISI: PAKETLER (Yazici/Index) ============
   Kuyruk tek tek iş değil, birlikte gönderilen etiketlerin paketi olarak listelenir.
   Başlık .grp-hd kalıbıdır; simgenin rengi paketin durumunu, sağdaki şerit basılan /
   hatalı / sırada bekleyen oranını taşır. Paket açılınca etiketler gidiş sırasıyla. */

.pq-batch { scroll-margin-top:84px; }
.pq-head { display:flex; align-items:center; gap:.5rem; padding-right:1rem; }
.pq-toggle { flex:1 1 auto; min-width:0; }
.pq-resend { flex:0 0 auto; margin:0; }

.pq-ico {
  width:38px; height:38px; border-radius:10px; flex:0 0 auto; font-size:1.1rem;
  display:inline-flex; align-items:center; justify-content:center;
  background:#eceef3; color:var(--ink-2);
}
.pq-ok   .pq-ico { background:var(--success-soft); color:var(--success); }
.pq-run  .pq-ico { background:var(--warning-soft); color:var(--warning); }
.pq-err  .pq-ico { background:var(--danger-soft);  color:var(--danger); }
.pq-part .pq-ico { background:var(--info-soft);    color:var(--info); }

.pq-main { flex:1 1 0; min-width:0; display:flex; flex-direction:column; gap:.12rem; }
.pq-title { font-weight:600; display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.pq-count {
  font-size:.72rem; font-weight:600; border-radius:999px; padding:.1rem .5rem;
  background:var(--primary-soft); color:var(--primary-ink);
}
.pq-meta { display:flex; flex-wrap:wrap; gap:.1rem .9rem; color:var(--muted); font-size:.8rem; min-width:0; }
.pq-resent { color:var(--primary-ink); }
.pq-orders {
  color:var(--muted); font-size:.78rem; font-variant-numeric:tabular-nums;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

.pq-status { flex:0 0 190px; display:flex; flex-direction:column; align-items:flex-end; gap:.35rem; }
.pq-bar { display:flex; width:100%; height:6px; border-radius:999px; background:var(--line); overflow:hidden; }
.pq-bar > span { height:100%; }
.pq-bar .s-ok  { background:var(--success); }
.pq-bar .s-err { background:var(--danger); }
.pq-bar .s-run { background:#e3a008; }
.pq-state { font-size:.78rem; font-weight:600; color:var(--ink-2); white-space:nowrap; }
.pq-ok  .pq-state { color:var(--success); }
.pq-run .pq-state { color:var(--warning); }
.pq-err .pq-state { color:var(--danger); }

.pq-form { border-top:1px solid var(--line); }
.pq-tools {
  display:flex; align-items:center; flex-wrap:wrap; gap:.5rem 1rem;
  padding:.65rem 1rem; background:var(--surface-2); border-bottom:1px solid var(--line);
}
.pq-tools-act { display:flex; flex-wrap:wrap; gap:.5rem; margin-left:auto; }

.pq-jobs { list-style:none; margin:0; padding:0; }
.pq-job {
  display:grid; align-items:center; gap:.35rem .75rem; padding:.55rem 1rem;
  grid-template-columns:auto 1.75rem minmax(0,1fr) 180px auto;
  grid-template-areas:"cb no name state act";
  border-bottom:1px solid var(--line);
}
.pq-job:last-child { border-bottom:0; border-radius:0 0 var(--r-lg) var(--r-lg); }
.pq-job:hover { background:var(--surface-2); }
.pq-job.is-match { background:var(--warning-soft); }
.pq-job > input { grid-area:cb; margin:0; }
.pq-no { grid-area:no; color:var(--muted); font-size:.78rem; font-variant-numeric:tabular-nums; text-align:right; }
.pq-jname { grid-area:name; min-width:0; overflow-wrap:anywhere; }
.pq-jstate { grid-area:state; display:flex; align-items:center; gap:.5rem; }
.pq-jact { grid-area:act; display:flex; justify-content:flex-end; gap:.35rem; }
.pq-x { flex:0 0 2.25rem; width:2.25rem; padding-inline:0; }

.pq-val-sm { font-size:1.15rem !important; }

@media (max-width: 767.98px) {
  .pq-head { flex-wrap:wrap; padding:0 0 .75rem; }
  .pq-toggle { flex:1 1 100%; }
  .pq-status { order:4; flex:1 1 100%; align-items:stretch; }
  .pq-state { text-align:right; }
  .pq-resend { padding:0 .85rem; width:100%; }
  .pq-resend .btn { width:100%; }
  .pq-tools-act { margin-left:0; width:100%; }
  .pq-tools-act .btn { flex:1 1 auto; }
  .pq-job {
    grid-template-columns:auto minmax(0,1fr) auto;
    grid-template-areas:"cb name act" "cb state act";
    padding:.6rem .85rem;
  }
  .pq-no { display:none; }
  .pq-jact .btn span { display:none; }   /* telefonda yalnız simge; title/aria yine okunur */
}

/* ==================================================================== DEĞİŞİM TALEP KARTI
   Views/Degisim/_TalepKart — talep detayında ve siparişin Değişim sekmesinde aynı kart:
   ne neyle değişiyor · süreç nerede (aşama çizgisi) · sırada ne var (tek asıl düğme). */
.xf-card { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-1); padding:1rem 1.1rem; }
.xf-card + .xf-card { margin-top:.85rem; }
.xf-hd { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem .55rem; margin-bottom:.8rem; }
.xf-code { font-family:var(--bs-font-monospace); font-weight:700; font-size:.95rem; color:var(--ink); text-decoration:none; }
.xf-code:hover { color:var(--primary-ink); text-decoration:underline; text-underline-offset:2px; }
.xf-chip { font-size:.72rem; font-weight:600; color:var(--ink-2); background:var(--app); border:1px solid var(--line); border-radius:999px; padding:.12rem .55rem; }
.xf-meta { margin-left:auto; font-size:.76rem; color:var(--muted); }

.xf-prod { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:.6rem; align-items:stretch; }
.xf-side { border:1px solid var(--line); border-radius:var(--r); padding:.55rem .7rem; min-width:0; background:var(--surface-2); }
.xf-side.ok { border-color:#bfe3cc; background:var(--success-soft); }
.xf-side.empty { border-style:dashed; border-color:var(--line-2); background:var(--surface); }
.xf-side .k { font-size:.7rem; font-weight:600; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
.xf-side .v { font-weight:600; font-size:.88rem; line-height:1.3; margin-top:.1rem; overflow-wrap:anywhere; }
.xf-side .s { font-size:.76rem; color:var(--muted); margin-top:.15rem; font-variant-numeric:tabular-nums; }
.xf-arrow { align-self:center; color:var(--faint); font-size:1.1rem; }

.xf-steps { list-style:none; margin:1rem 0 .9rem; padding:0; display:flex; }
.xf-steps li { flex:1 1 0; min-width:0; position:relative; display:flex; flex-direction:column; align-items:center; gap:.2rem; text-align:center; }
.xf-steps li::before { content:""; position:absolute; top:11px; right:50%; width:100%; height:2px; background:var(--line-2); }
.xf-steps li:first-child::before { display:none; }
.xf-steps li.done::before, .xf-steps li.current::before, .xf-steps li.fail::before { background:var(--primary); }
.xf-steps .dot { position:relative; width:24px; height:24px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
                 background:var(--surface); border:2px solid var(--line-2); color:var(--faint); font-size:.7rem; }
.xf-steps li.done .dot { background:var(--primary); border-color:var(--primary); color:var(--on-primary); }
.xf-steps li.current .dot { border-color:var(--primary); color:var(--primary); box-shadow:0 0 0 4px var(--primary-soft); font-size:.45rem; }
.xf-steps li.fail .dot { background:var(--danger); border-color:var(--danger); color:#fff; }
.xf-steps .lbl { font-size:.74rem; font-weight:600; color:var(--muted); line-height:1.2; padding:0 .15rem; }
.xf-steps li.done .lbl, .xf-steps li.current .lbl { color:var(--ink); }
.xf-steps li.fail .lbl { color:var(--danger); }
.xf-steps .sub { font-size:.68rem; color:var(--muted); font-variant-numeric:tabular-nums; }
.xf-steps li.current .sub { color:var(--primary-ink); font-weight:600; }

.xf-next { display:flex; gap:.75rem; align-items:flex-start; border-radius:var(--r); padding:.8rem .9rem; border:1px solid transparent; }
.xf-next-ico { font-size:1.2rem; line-height:1.2; flex:0 0 auto; }
.xf-next-body { min-width:0; flex:1 1 auto; }
.xf-next .t { font-weight:700; font-size:.92rem; color:var(--ink); }
.xf-next .d { font-size:.83rem; color:var(--ink-2); margin-top:.15rem; line-height:1.45; }
.xf-next.tone-warning { background:var(--warning-soft); border-color:#f3dcb2; } .xf-next.tone-warning .xf-next-ico { color:var(--warning); }
.xf-next.tone-info { background:var(--info-soft); border-color:#c7e3f5; } .xf-next.tone-info .xf-next-ico { color:var(--info); }
.xf-next.tone-primary { background:var(--primary-soft); border-color:var(--primary-soft-2); } .xf-next.tone-primary .xf-next-ico { color:var(--primary); }
.xf-next.tone-success { background:var(--success-soft); border-color:#bfe3cc; } .xf-next.tone-success .xf-next-ico { color:var(--success); }
.xf-next.tone-danger { background:var(--danger-soft); border-color:#f6c4cf; } .xf-next.tone-danger .xf-next-ico { color:var(--danger); }
.xf-next.tone-secondary { background:var(--app); border-color:var(--line); } .xf-next.tone-secondary .xf-next-ico { color:var(--muted); }
.xf-acts { display:flex; flex-wrap:wrap; gap:.45rem; margin-top:.65rem; align-items:center; }
.xf-inline { display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; margin:0; }

.xf-pick { margin-top:.65rem; }
.xf-pick > summary { cursor:pointer; font-size:.82rem; font-weight:600; color:var(--primary-ink); list-style:none; display:inline-flex; align-items:center; gap:.35rem; }
.xf-pick > summary::-webkit-details-marker { display:none; }
.xf-pick > summary::before { content:"\F285"; font-family:"bootstrap-icons"; font-size:.7rem; transition:transform var(--dur) var(--ease); }
.xf-pick[open] > summary::before { transform:rotate(90deg); }
.xf-pick-body { margin-top:.5rem; max-width:560px; }
.xf-results { margin-top:.4rem; max-height:340px; overflow:auto; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--sh-2); }
.xf-row { display:flex; gap:.6rem; padding:.55rem .7rem; align-items:flex-start; }
.xf-row + .xf-row { border-top:1px solid var(--line); }
.xf-row img, .xf-row .ph { width:40px; height:40px; border-radius:8px; object-fit:cover; flex-shrink:0; background:var(--app); }
.xf-row .nm { font-weight:600; font-size:.84rem; line-height:1.25; }
.xf-row .meta { font-size:.74rem; color:var(--muted); }
.xf-row .vs { display:flex; flex-wrap:wrap; gap:.3rem; margin-top:.35rem; }
.xf-row .vs .btn { font-size:.74rem; padding:.12rem .5rem; }
.xf-empty { padding:.6rem .75rem; font-size:.82rem; color:var(--muted); }

.xf-foot { display:flex; flex-wrap:wrap; gap:.35rem 1.1rem; align-items:center; margin-top:.8rem; font-size:.8rem; color:var(--ink-2); }
.xf-foot .bi { color:var(--faint); margin-right:.2rem; }
.xf-more-link { margin-left:auto; font-weight:600; font-size:.8rem; text-decoration:none; }

@media (max-width: 575.98px) {
  .xf-card { padding:.85rem .85rem; }
  .xf-meta { margin-left:0; width:100%; }
  .xf-prod { grid-template-columns:1fr; }
  .xf-arrow { transform:rotate(90deg); justify-self:center; }
  .xf-steps .lbl { font-size:.66rem; }
  .xf-steps .sub { display:none; }
  .xf-more-link { margin-left:0; }
}

/* ==================================================================== ÜRÜN DEĞİŞİMİ MERKEZİ
   Views/Degisim/Index — akış aşamaları sekme (xh-flow), satırda tek düğme (xh-row), yan panelde kart. */
.xh-top { display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:.75rem; margin-bottom:1rem; }
.xh-top-acts { display:flex; flex-wrap:wrap; gap:.45rem; align-items:center; }
.xh-back { display:inline-flex; align-items:center; gap:.3rem; font-size:.8rem; font-weight:600; color:var(--muted); text-decoration:none; margin-bottom:.2rem; }
.xh-back:hover { color:var(--primary-ink); }

.xh-flow { display:flex; gap:.6rem; align-items:stretch; margin-bottom:1rem; }
.xh-flow ol { list-style:none; margin:0; padding:0; display:flex; flex:1 1 auto; min-width:0; background:var(--surface);
              border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-1); overflow:hidden; }
.xh-flow li { flex:1 1 0; min-width:0; position:relative; }
.xh-flow li + li::before { content:""; position:absolute; left:-1px; top:18%; bottom:18%; width:1px; background:var(--line); }
.xh-flow li a { display:flex; align-items:center; gap:.6rem; height:100%; padding:.75rem .9rem; text-decoration:none; color:var(--ink-2);
                transition:background var(--dur) var(--ease); }
.xh-flow li a:hover { background:var(--surface-2); }
.xh-flow .no { flex:0 0 auto; width:26px; height:26px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
               font-size:.78rem; font-weight:700; background:var(--app); color:var(--muted); border:1px solid var(--line-2); }
.xh-flow .txt { display:flex; flex-direction:column; min-width:0; }
.xh-flow .lbl { font-size:.8rem; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.xh-flow .lbl .bi { color:var(--faint); }
.xh-flow .cnt { font-size:1.35rem; font-weight:700; line-height:1.1; color:var(--ink); font-variant-numeric:tabular-nums; }
.xh-flow li.empty .cnt { color:var(--faint); }
.xh-flow li.on a { background:var(--primary-soft); color:var(--primary-ink); box-shadow:inset 0 -3px 0 var(--primary); }
.xh-flow li.on .no { background:var(--primary); border-color:var(--primary); color:var(--on-primary); }
.xh-flow li.on .lbl .bi { color:var(--primary); }
.xh-closed { flex:0 0 auto; display:flex; flex-direction:column; justify-content:center; gap:.05rem; padding:.6rem .9rem; border-radius:var(--r-lg);
             border:1px dashed var(--line-2); color:var(--muted); text-decoration:none; font-size:.8rem; font-weight:600; min-width:8.5rem; }
.xh-closed .cnt { font-size:1.1rem; font-weight:700; color:var(--ink-2); }
.xh-closed .sub { font-size:.7rem; font-weight:500; color:var(--faint); }
.xh-closed:hover { border-color:var(--primary-soft-2); color:var(--primary-ink); }
.xh-closed.on { border-style:solid; border-color:var(--primary); background:var(--primary-soft); color:var(--primary-ink); }

.xh-tools { display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; justify-content:space-between; margin-bottom:.75rem; }
.xh-seg { display:inline-flex; background:var(--app); border:1px solid var(--line); border-radius:10px; padding:3px; gap:2px; }
.xh-seg a { padding:.3rem .7rem; border-radius:8px; font-size:.82rem; font-weight:600; color:var(--muted); text-decoration:none; white-space:nowrap; }
.xh-seg a span { font-weight:500; color:var(--faint); margin-left:.2rem; font-variant-numeric:tabular-nums; }
.xh-seg a.on { background:var(--surface); color:var(--ink); box-shadow:var(--sh-2); }
.xh-search { display:flex; gap:.45rem; align-items:center; flex:0 1 480px; }
.xh-search select { width:auto; max-width:12rem; }

.xh-hint { font-size:.84rem; color:var(--ink-2); margin-bottom:.6rem; }
.xh-hint .bi { color:var(--faint); margin-right:.2rem; }
.xh-strip { display:flex; flex-wrap:wrap; align-items:center; gap:.35rem .75rem; padding:.55rem .85rem; margin-bottom:.6rem;
            border:1px solid #f3dcb2; background:var(--warning-soft); border-radius:var(--r); font-size:.84rem; }
.xh-strip .bi { color:var(--warning); }
.xh-strip.calm { border-color:#c7e3f5; background:var(--info-soft); }
.xh-strip.calm .bi { color:var(--info); }
.xh-strip a { font-weight:600; text-decoration:none; }

.xh-queues { display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:.75rem; }
.xq-chip { display:inline-flex; align-items:center; gap:.35rem; padding:.3rem .65rem; border-radius:999px; border:1px solid var(--line);
           background:var(--surface); font-size:.8rem; font-weight:600; color:var(--ink-2); text-decoration:none; }
.xq-chip span { font-variant-numeric:tabular-nums; color:var(--muted); font-weight:700; }
.xq-chip:hover { border-color:var(--line-2); color:var(--ink); }
.xq-chip.on { border-color:var(--primary); background:var(--primary-soft); color:var(--primary-ink); }
.xq-chip.tone-warning .bi { color:var(--warning); } .xq-chip.tone-danger .bi { color:var(--danger); }
.xq-chip.tone-primary .bi { color:var(--primary); } .xq-chip.tone-info .bi { color:var(--info); }
.xq-chip.tone-success .bi { color:var(--success); } .xq-chip.tone-secondary .bi { color:var(--muted); }

.xh-bulk { display:flex; align-items:center; gap:.75rem; padding:.55rem .85rem; margin-bottom:.6rem; border-radius:var(--r);
           background:var(--primary-soft); border:1px solid var(--primary-soft-2); font-size:.86rem; position:sticky; top:.5rem; z-index:var(--z-sticky); }
.xh-bulk[hidden] { display:none; }

.xh-list { overflow:hidden; }
.xh-head, .xh-row { display:grid; grid-template-columns:2rem minmax(9rem,.9fr) minmax(10rem,1fr) minmax(14rem,1.6fr) minmax(12rem,1.1fr) 9.5rem;
                    gap:.75rem; align-items:center; padding:.7rem 1rem; }
.xh-head { font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.04em; color:var(--muted);
           background:var(--surface-2); border-bottom:1px solid var(--line); padding-top:.55rem; padding-bottom:.55rem; }
.xh-row { border-bottom:1px solid var(--line); cursor:pointer; transition:background var(--dur) var(--ease); }
.xh-row:last-child { border-bottom:0; }
.xh-row:hover { background:var(--surface-2); }
.xh-row:focus-visible { outline:2px solid var(--primary); outline-offset:-2px; }
.xh-row > span { min-width:0; }
.xh-row .code { display:block; font-family:var(--bs-font-monospace); font-weight:700; font-size:.86rem; color:var(--ink); }
.xh-row .meta { display:flex; flex-wrap:wrap; gap:.15rem .4rem; align-items:center; font-size:.75rem; color:var(--muted); margin-top:.1rem; }
.xh-row .meta a { font-weight:600; text-decoration:none; }
.xh-row .chip { font-size:.68rem; font-weight:600; padding:.05rem .45rem; border-radius:999px; background:var(--app); border:1px solid var(--line); color:var(--ink-2); }
.xh-row .chip.warn { background:var(--warning-soft); border-color:#f3dcb2; color:var(--warning); }
.xh-row .nm { display:block; font-weight:600; font-size:.86rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.xh-row .from { display:block; font-size:.8rem; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.xh-row .to { display:block; font-size:.84rem; font-weight:600; color:var(--success); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.xh-row .to.empty { color:var(--warning); font-weight:500; }
.xh-row .c-next { font-size:.82rem; font-weight:600; line-height:1.3; }
.xh-row .c-act { display:flex; justify-content:flex-end; }
.xh-row .c-act form { margin:0; }
.xh-row .c-act .btn { white-space:nowrap; }
.xh-more { padding:.7rem 1rem; font-size:.8rem; color:var(--muted); background:var(--surface-2); border-top:1px solid var(--line); }

.xf-drawer { --bs-offcanvas-width:min(600px, 100vw); }
.xf-drawer .offcanvas-body { background:var(--app); }
.xf-drawer .xf-card { box-shadow:none; }

@media (max-width: 1199.98px) {
  .xh-flow { flex-direction:column; }
  .xh-flow ol { overflow-x:auto; scrollbar-width:none; }
  .xh-flow li { flex:1 0 auto; }
  .xh-closed { flex-direction:row; align-items:center; gap:.5rem; min-width:0; }
}
@media (max-width: 991.98px) {
  .xh-head { display:none; }
  .xh-row { grid-template-columns:auto minmax(0,1fr) auto; grid-template-areas:"sel code act" "sel cust cust" "sel swap swap" "sel next next";
            gap:.3rem .6rem; align-items:start; }
  .xh-row .c-sel { grid-area:sel; } .xh-row .c-code { grid-area:code; } .xh-row .c-act { grid-area:act; }
  .xh-row .c-cust { grid-area:cust; } .xh-row .c-swap { grid-area:swap; } .xh-row .c-next { grid-area:next; }
  .xh-row .c-sel:empty { display:none; }
  .xh-search { flex:1 1 100%; }
}
@media (max-width: 575.98px) {
  .xh-flow li a { flex-direction:column; align-items:flex-start; gap:.3rem; padding:.6rem .7rem; }
  .xh-flow .lbl { font-size:.72rem; }
  .xh-flow .lbl .bi { display:none; }
  .xh-flow .cnt { font-size:1.1rem; }
  .xh-seg { width:100%; overflow-x:auto; }
}

/* Değişim talep detayı (Views/Degisim/Detay): bilgi listesi + süreç geçmişi zaman çizgisi. */
.xd-kv { display:grid; grid-template-columns:8.5rem minmax(0,1fr); gap:.45rem .9rem; margin:0; font-size:.86rem; }
.xd-kv dt { color:var(--muted); font-weight:500; }
.xd-kv dd { margin:0; min-width:0; overflow-wrap:anywhere; }
.xd-tl { list-style:none; margin:0; padding:0; position:relative; }
.xd-tl::before { content:""; position:absolute; left:13px; top:6px; bottom:6px; width:2px; background:var(--line); }
.xd-tl li { position:relative; display:flex; gap:.65rem; padding:.35rem 0; }
.xd-tl .ic { position:relative; z-index:1; flex:0 0 auto; width:28px; height:28px; border-radius:50%; display:inline-flex; align-items:center;
             justify-content:center; background:var(--surface); border:2px solid var(--line-2); color:var(--muted); font-size:.8rem; }
.xd-tl li.tone-success .ic { border-color:#bfe3cc; background:var(--success-soft); color:var(--success); }
.xd-tl li.tone-danger .ic { border-color:#f6c4cf; background:var(--danger-soft); color:var(--danger); }
.xd-tl li.tone-primary .ic { border-color:var(--primary-soft-2); background:var(--primary-soft); color:var(--primary); }
.xd-tl .bd { min-width:0; padding-top:.2rem; }
.xd-tl .t { font-size:.84rem; font-weight:600; color:var(--ink); }
.xd-tl .at { font-weight:500; font-size:.74rem; color:var(--muted); margin-left:.35rem; font-variant-numeric:tabular-nums; white-space:nowrap; }
.xd-tl .d { font-size:.78rem; color:var(--muted); overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.xd-adv > summary { cursor:pointer; font-weight:600; font-size:.9rem; color:var(--ink-2); list-style:none; display:flex; align-items:center; gap:.4rem; }
.xd-adv > summary::-webkit-details-marker { display:none; }
.xd-adv > summary::after { content:"\F282"; font-family:"bootstrap-icons"; margin-left:auto; font-size:.8rem; color:var(--faint); transition:transform var(--dur) var(--ease); }
.xd-adv[open] > summary::after { transform:rotate(180deg); }
@media (max-width: 575.98px) { .xd-kv { grid-template-columns:1fr; gap:.1rem; } .xd-kv dd { margin-bottom:.45rem; } }

/* Talep kartı: müşterinin yazdığına uyan hazır ürün önerileri (ProductMatch). */
.xf-sug { border:1px solid var(--primary-soft-2); background:var(--surface); border-radius:var(--r); margin-bottom:.5rem; overflow:hidden; }
.xf-sug-hd { display:flex; align-items:center; gap:.4rem; padding:.45rem .7rem; font-size:.8rem; font-weight:700; color:var(--primary-ink); background:var(--primary-soft); }
.xf-sug-size { margin-left:auto; font-weight:600; font-size:.74rem; padding:.05rem .45rem; border-radius:999px; background:var(--surface); color:var(--ink-2); }
.xf-sug-ft { padding:.35rem .7rem .5rem; font-size:.74rem; color:var(--muted); border-top:1px solid var(--line); }

.xf-sug-main { padding:.55rem .7rem; border-bottom:1px solid var(--line); }
.xf-sug-main .btn { white-space:normal; text-align:left; }

/* Eksik gönderim ekranı: "Süresi doldu" sekmesinin satırları (talep değil, bekleyen sipariş kalemi). */
.xh-head-sure, .xh-row-sure { grid-template-columns:minmax(14rem,1.6fr) minmax(10rem,1fr) 8rem 10rem; }
.xh-row-sure { cursor:default; }
.xh-row-sure .c-prod { display:flex; gap:.6rem; align-items:center; min-width:0; }
.xh-row-sure .c-prod img, .xh-row-sure .c-prod .ph { width:40px; height:40px; border-radius:8px; object-fit:cover; flex-shrink:0; background:var(--app); }
.xh-row-sure .c-wait { display:flex; flex-direction:column; gap:.15rem; align-items:flex-start; }
.xh-row-sure .c-wait .meta { font-size:.72rem; color:var(--muted); }
@media (max-width: 991.98px) {
  .xh-row-sure { grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"prod act" "cust wait"; }
  .xh-row-sure .c-prod { grid-area:prod; } .xh-row-sure .c-act { grid-area:act; }
  .xh-row-sure .c-cust { grid-area:cust; } .xh-row-sure .c-wait { grid-area:wait; align-items:flex-end; }
}