/* ============================================================
   Müşteriye Satış — kayıtlı cariye tam sayfa satış.
   Sepet/iskonto/toplam görünümü hizli_satis.css'teki hs2-* sınıflarını
   paylaşır; burada yalnız cari kartı + müşteri seçici + ödeme + eksik teslimat.
   ============================================================ */
/* [hidden] gerçekten gizlensin (table-cell / flex ezmesin) */
.hs2-table [hidden] { display: none !important; }

/* — Müşteri seçici — */
.ms-pick { padding: var(--space-4) var(--space-5); }
.ms-pick-head { font-size: var(--fs-md); font-weight: 800; color: var(--navy); margin-bottom: var(--space-3); }
.ms-pick-list { margin-top: var(--space-3); display: flex; flex-direction: column; gap: 2px; max-height: 420px; overflow: auto; }
.ms-pick-row { display: flex; align-items: center; gap: var(--space-3); width: 100%; border: 0; background: transparent; cursor: pointer; padding: 10px 12px; border-radius: var(--radius); text-align: left; }
.ms-pick-row:hover { background: var(--surface-alt); }
.ms-ava { width: 38px; height: 38px; border-radius: var(--radius); flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: var(--navy); color: #fff; font-weight: 800; font-size: var(--fs-sm); }
.ms-pick-info { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.ms-pick-name { font-weight: 700; color: var(--navy); }
.ms-pick-sub { font-size: var(--fs-xs); color: var(--text-muted); }
.ms-pick-tag { font-size: var(--fs-xs); font-weight: 700; color: var(--brand); background: color-mix(in srgb, var(--brand) 10%, transparent); padding: 2px 8px; border-radius: var(--radius-full); }

/* — Cari kartı — */
.ms-cust { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4) var(--space-5); }
/* Müşteri seçilmemişken: kart sadece arama kutusu (boş görünmesin) */
.ms-cust--empty { display: block; padding: var(--space-3) var(--space-4); }
.ms-cust-search { width: 100%; margin: 0; }
.ms-cust-left { display: flex; align-items: center; gap: var(--space-3); flex: 1; min-width: 0; }
.ms-cust-ava { width: 54px; height: 54px; border-radius: var(--radius); flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: var(--navy); color: #fff; font-weight: 800; font-size: var(--fs-lg); }
.ms-cust-title { display: flex; align-items: center; gap: var(--space-2); font-size: var(--fs-lg); font-weight: 800; color: var(--navy); }
.ms-cust-badge { font-size: var(--fs-xs); font-weight: 700; color: var(--navy); background: color-mix(in srgb, var(--navy) 12%, transparent); padding: 2px 9px; border-radius: var(--radius-full); }
.ms-cust-swap { border: 1px solid var(--border); background: var(--surface); cursor: pointer; width: 30px; height: 30px; border-radius: var(--radius-sm); display: inline-flex; align-items: center; justify-content: center; color: var(--text-muted); }
.ms-cust-swap:hover { border-color: var(--brand); color: var(--brand); }
.ms-cust-swap svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.ms-cust-sub { font-size: var(--fs-xs); color: var(--text-muted); margin-top: 3px; }
.ms-cust-disc { text-align: right; min-width: 90px; }

/* — Eksik teslimat toggle — */
.ms-teslim { display: flex; align-items: center; gap: var(--space-3); cursor: pointer; padding: 2px 4px; }
.ms-teslim input { position: absolute; opacity: 0; width: 0; height: 0; }
.ms-teslim-sw { width: 40px; height: 22px; border-radius: var(--radius-full); background: var(--border); position: relative; flex-shrink: 0; transition: background .15s; }
.ms-teslim-sw::after { content: ''; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: var(--shadow-sm); transition: transform .15s; }
.ms-teslim input:checked + .ms-teslim-sw { background: var(--brand); }
.ms-teslim input:checked + .ms-teslim-sw::after { transform: translateX(18px); }
.ms-teslim-txt strong { color: var(--navy); }
.ms-teslim-input { color: var(--brand) !important; }

/* — Belge İÇ NOTU (sipariş/fatura geneline ait, yalnız ERP'de görünür) ───────
   "Tedarikçinin listesinde vardı ama hiç gelmedi" gibi kayıtlar. Yazdırılan ya da
   paylaşılan belgeye BASILMAZ; iki listenin neden farklı olduğu buradan okunur. */
.ms-icnot { display: flex; flex-direction: column; gap: 6px; padding: var(--space-3); border-left: 3px solid var(--yellow); }
.ms-icnot-lbl { display: flex; align-items: center; gap: 6px; font-size: var(--fs-xs); font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: .04em; cursor: pointer; }
.ms-icnot-lbl svg { width: 14px; height: 14px; flex-shrink: 0; color: var(--yellow); fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ms-icnot-lbl span { font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--text-faint); }
.ms-icnot textarea { width: 100%; resize: vertical; min-height: 46px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); color: var(--text); padding: 8px 10px; font: inherit; font-size: var(--fs-sm); line-height: 1.45; }
.ms-icnot textarea:focus { outline: none; border-color: var(--yellow); box-shadow: 0 0 0 3px var(--yellow-soft); }

/* — Ödeme — */
.ms-paywrap { flex: 1; min-width: 300px; display: flex; flex-direction: column; gap: var(--space-3); }
/* Tek/Çoklu ödeme toggle — belirgin, kolay dokunulur turuncu toggle */
.ms-paymode { display: inline-flex; background: var(--surface-alt); border: 1px solid var(--border); border-radius: var(--radius-full); padding: 4px; gap: 4px; align-self: flex-start; }
.ms-paymode-btn { border: 0; background: transparent; cursor: pointer; font-weight: 800; font-size: var(--fs-sm); color: var(--text-muted); padding: 9px 24px; min-width: 78px; border-radius: var(--radius-full); transition: background .15s ease, color .15s ease; }
.ms-paymode-btn:hover { color: var(--brand); }
.ms-paymode-btn.is-active { background: var(--brand); color: #fff; box-shadow: 0 2px 6px rgba(200, 90, 30, .35); }
.ms-paymode-btn.is-active:hover { color: #fff; }
/* ÖDEME başlık satırı: "ÖDEME" + Tek/Çoklu toggle */
.ms-pay-head-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; }

/* Çoklu ödeme bilgi şeridi */
.ms-pay-info { display: flex; align-items: center; gap: 8px; background: color-mix(in srgb, var(--navy) 7%, transparent); border: 1px solid color-mix(in srgb, var(--navy) 16%, transparent); border-radius: var(--radius-sm); padding: 8px 12px; font-size: var(--fs-sm); color: var(--text); margin-bottom: 10px; }
.ms-pay-info-ico { width: 18px; height: 18px; fill: none; stroke: var(--navy); stroke-width: 2; stroke-linecap: round; flex-shrink: 0; }
.ms-pay-info strong { color: var(--navy); }

/* TEK mod: "Yöntem" / "Hesap" satırları (Hızlı Satış stili) */
.ms-pay-line { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-2); }
.ms-method-btns { flex-wrap: wrap; }

/* Hesap = YUKARI açılan özel dropdown */
.ms-dd { position: relative; flex: 1; min-width: 150px; }
.ms-dd-btn { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); color: var(--text); font-size: var(--fs-sm); cursor: pointer; text-align: left; }
.ms-dd-btn:hover { border-color: var(--brand); }
.ms-dd-chev { width: 16px; height: 16px; fill: none; stroke: var(--text-muted); stroke-width: 2; flex-shrink: 0; }
.ms-dd-menu { position: absolute; bottom: calc(100% + 4px); left: 0; right: 0; z-index: 40; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-md); max-height: 240px; overflow: auto; padding: 4px; }
.ms-dd-menu[hidden] { display: none !important; }
.ms-dd-opt { display: block; width: 100%; text-align: left; border: 0; background: transparent; cursor: pointer; padding: 8px 10px; border-radius: var(--radius-sm); font-size: var(--fs-sm); color: var(--text); }
.ms-dd-opt:hover { background: var(--surface-alt); }
.ms-dd-opt.is-sel { color: var(--brand); font-weight: 700; }
.ms-dd-empty { padding: 8px 10px; color: var(--text-muted); font-size: var(--fs-sm); }
/* Çoklu ödeme: her ödeme bir BLOK — 3 satır (Yöntem/Hesap/Tutar), başlık solda kontrol sağda, eşit genişlik.
   İndigo panelde: blok yarı-saydam beyaz, etiketler açık. */
.ms-payrow { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; padding: 12px; border-radius: var(--radius); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14); }
.ms-payrow-head { display: flex; align-items: center; justify-content: space-between; }
.ms-payrow-title { font-size: var(--fs-xs); font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: rgba(255,255,255,.62); }
.ms-payfield { display: flex; align-items: center; gap: 10px; }
.ms-payfield-lbl { width: 62px; flex: none; font-size: var(--fs-sm); font-weight: 600; color: rgba(255,255,255,.72); }
.ms-payfield-ctrl { flex: 1; min-width: 0; }
.ms-payfield-ctrl .ms-dd { width: 100%; min-width: 0; }
.ms-payfield-ctrl .ms-pay-amt, .ms-payfield-ctrl .ms-dd-btn { width: 100%; box-sizing: border-box; }
.ms-payfield-ctrl .ms-pay-acc-x { display: block; }
.ms-payfield--cek .ms-cek { margin-top: 0; }
.ms-pay-amt { padding: 8px 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: var(--fs-sm); background: var(--surface); color: var(--text); text-align: right; }
.ms-pay-acc-x { font-size: var(--fs-sm); color: rgba(255,255,255,.82); }
.ms-acik-note { color: var(--navy); font-weight: 600; line-height: 1.4; }
.ms-pay-rm { border: 0; background: transparent; cursor: pointer; color: var(--text-faint); display: inline-flex; }
.ms-pay-rm:hover { color: var(--red); }
.ms-pay-rm svg { width: 16px; height: 16px; }
.ms-pay-add { border: 1px dashed var(--border); background: transparent; cursor: pointer; color: var(--brand); font-weight: 600; font-size: var(--fs-sm); padding: 7px 12px; border-radius: var(--radius-sm); width: 100%; }
.ms-pay-add:hover { border-color: var(--brand); }
.ms-cek { display: flex; gap: 6px; flex-wrap: wrap; width: 100%; margin-top: 2px; }
.ms-cek input { padding: 7px 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: var(--fs-sm); }
.ms-cek-vade { width: 150px; }
.ms-cek-sahip, .ms-cek-seri { flex: 1; min-width: 110px; }
.ms-acik, .ms-acik .money { color: var(--brand); font-weight: 700; }

/* Alış: birim maliyet elle girilebilir input */
.ta-birim { width: 100px; text-align: right; padding: 6px 9px; border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: var(--fs-sm); font-weight: 600; color: var(--text); -moz-appearance: textfield; }
.ta-birim::-webkit-outer-spin-button, .ta-birim::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ta-birim:focus { outline: none; border-color: var(--brand); }

/* — Fiyat geçmişi: rozet + ikon + sağ panel — */
.ms-ph-btn { border: 0; background: transparent; cursor: pointer; color: var(--text-faint); padding: 0 2px; vertical-align: middle; display: inline-flex; margin-left: 6px; }
.ms-ph-btn:hover { color: var(--brand); }
.ms-ph-btn svg { width: 15px; height: 15px; }
.ms-rozet { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; margin-top: 5px; font-size: var(--fs-xs); color: var(--navy); background: color-mix(in srgb, var(--navy) 6%, transparent); border-radius: var(--radius-sm); padding: 3px 8px; width: fit-content; }
.ms-rozet-ico { width: 13px; height: 13px; flex-shrink: 0; }
.ms-rozet strong { color: var(--brand); }
.ms-rozet-apply { border: 0; background: var(--brand); color: #fff; cursor: pointer; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: var(--radius-full); margin-left: 2px; }

.ms-drawer-ov { position: fixed; inset: 0; background: rgba(46,43,95,.35); z-index: 60; }
.ms-drawer-ov[hidden], .ms-drawer[hidden] { display: none !important; }
.ms-drawer { position: fixed; top: 0; right: 0; bottom: 0; width: 420px; max-width: 92vw; z-index: 61; background: var(--surface); box-shadow: -8px 0 40px rgba(0,0,0,.18); display: flex; flex-direction: column; }
.ms-drawer-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--border); font-weight: 800; color: var(--navy); }
.ms-drawer-x { border: 0; background: transparent; cursor: pointer; color: var(--text-muted); display: inline-flex; }
.ms-drawer-x:hover { color: var(--red); }
.ms-drawer-x svg { width: 20px; height: 20px; }
.ms-drawer-tabs { display: flex; gap: 2px; padding: var(--space-2) var(--space-3) 0; border-bottom: 1px solid var(--border); }
.ms-dtab { border: 0; background: transparent; cursor: pointer; font-weight: 700; font-size: var(--fs-sm); color: var(--text-muted); padding: 9px 14px; border-bottom: 2px solid transparent; }
.ms-dtab.is-active { color: var(--brand); border-bottom-color: var(--brand); }
.ms-drawer-body { flex: 1; overflow: auto; padding: var(--space-3) var(--space-4); }
.ms-ph-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: 10px 4px; border-bottom: 1px solid var(--border); }
.ms-ph-info { display: flex; flex-direction: column; min-width: 0; }
.ms-ph-date { font-weight: 700; color: var(--navy); font-size: var(--fs-sm); }
.ms-ph-sub { font-size: var(--fs-xs); color: var(--text-muted); }
.ms-ph-act { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.ms-ph-price { font-weight: 800; color: var(--navy); }
.ms-ph-apply { border: 1px solid var(--brand); background: transparent; color: var(--brand); cursor: pointer; font-size: var(--fs-xs); font-weight: 700; padding: 4px 10px; border-radius: var(--radius-full); }
.ms-ph-apply:hover { background: var(--brand); color: #fff; }
.ms-ph-empty { padding: var(--space-6) var(--space-3); text-align: center; color: var(--text-muted); font-size: var(--fs-sm); }
.ms-ph-note { padding: 8px 4px 12px; font-size: var(--fs-sm); color: var(--text-muted); border-bottom: 1px solid var(--border); margin-bottom: 6px; }
.ms-ph-note strong { color: var(--navy); }

/* — Müşteriye Satış: sağ KALICI panel (hs2-cols/hs2-panel hizli_satis.css'ten gelir).
   Zengin ödeme (Tek/Çoklu · 5 yöntem · çek) için panel biraz daha geniş; yalnız .ms-sale'e scope'lu. —*/
.ms-sale .hs2-right { width: 404px; }
.ms-sale .hs2-panel .ms-paywrap { flex: none; min-width: 0; }
/* Panel dar olduğundan ödeme başlık satırı sarabilir; Tek/Çoklu toggle tam otursun.
   Köşeler diğer öğelerle uyumlu: pill DEĞİL, az yuvarlatılmış dörtgen. */
.ms-sale .hs2-panel .ms-paymode { border-radius: var(--radius); }
.ms-sale .hs2-panel .ms-paymode-btn { padding: 8px 16px; min-width: 0; border-radius: var(--radius-sm); }
/* 5 yöntem butonu (Nakit·Kart·Havale·Açık Hesap·Çek/Senet) tek satıra sığsın → daha küçük */
.ms-sale .hs2-panel .ms-method-btns .hs2-paybtn { font-size: 11px; padding: 8px 3px; }
/* Hesap dropdown'ı: eskiden ödeme en alttaydı → yukarı açılırdı. Artık sağ üst panelde → AŞAĞI aç. */
.ms-sale .hs2-panel .ms-dd-menu { top: calc(100% + 4px); bottom: auto; }
/* Ok aşağı açılıma uysun (˄ → ˅) */
.ms-sale .hs2-panel .ms-dd-chev { transform: rotate(180deg); }
@media (max-width: 900px) { .ms-sale .hs2-right { width: 100%; } }

/* Sepet satırında kalemin varsayılan (liste/kampanya/özel) fiyatı + geri döndürme.
   Yalnız kalem varsayılandan saptığında basılır — sapma yoksa satır hiç üretilmez. */
.ms-liste {
  display: flex; align-items: center; gap: 6px;
  margin-top: 3px; font-size: var(--fs-xs); color: var(--text-muted);
}
.ms-liste strong { color: var(--text); font-weight: 600; }
.ms-liste-reset {
  background: none; border: 0; padding: 0 2px; cursor: pointer;
  font-size: var(--fs-xs); color: var(--brand); text-decoration: underline;
}
.ms-liste-reset:hover { opacity: .8; }
.ms-ph-liste {
  padding: 8px 12px; margin-bottom: 8px;
  background: var(--surface); border-radius: var(--radius-sm);
  font-size: var(--fs-sm); color: var(--text-muted);
}
.ms-ph-liste strong { color: var(--text); }

/* Sepet başlık şeridi — toplu "varsayılana döndür". */
.ms-cart-bar { display: flex; justify-content: flex-end; padding: 8px 12px 0; }
.ms-reset-all {
  background: none; border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 5px 10px; font-size: var(--fs-xs); color: var(--brand); cursor: pointer;
}
.ms-reset-all:disabled { color: var(--text-muted); cursor: default; opacity: .6; }
.ms-reset-all:not(:disabled):hover { background: var(--surface); }

/* Tutar hücresinin altında iskonto sonrası net birim fiyat. */
.ms-netbirim { margin-top: 2px; font-size: var(--fs-xs); font-weight: 400; color: var(--text-muted); white-space: nowrap; }
.ms-netbirim strong { color: var(--text); font-weight: 600; }
