/* ==========================================================================
   MAĞAZA — Sepet, mini sepet, ödeme adımları, ödeme ve sipariş alındı sayfaları.
   ========================================================================== */

/* ===== Sepet / özet ===================================================== */
.k-cart-page.is-updating { filter: blur(2.5px); opacity: .72; pointer-events: none; transition: filter .2s ease, opacity .2s ease; }
.k-cart-row { display: flex; gap: 1.1rem; padding: 1.2rem 0; border-bottom: 1px solid var(--k-line); }
.k-cart-row:last-child { border-bottom: 0; }
.k-cart-row img { width: 96px; height: 120px; object-fit: cover; border-radius: var(--k-radius-sm); background: var(--k-surface-2); }

/* Mini sepet paneli */
.k-cart-drawer {
  --k-cart-drawer-w: clamp(300px, 92vw, 420px);
  display: flex;
  flex-direction: column;
  width: var(--k-cart-drawer-w) !important;
  max-width: 100% !important;
  height: 100%;
  max-height: 100dvh;
  border: none !important;
  box-shadow: -12px 0 48px rgba(15, 15, 15, .12);
  transition: transform .48s cubic-bezier(.32, .72, 0, 1) !important;
  will-change: transform;
}
.k-cart-drawer-head {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: .75rem;
  width: 100%;
  padding: clamp(.85rem, 2.5vw, 1.1rem) clamp(.95rem, 3vw, 1.25rem);
  padding-top: max(clamp(.85rem, 2.5vw, 1.1rem), env(safe-area-inset-top, 0px));
  padding-right: max(clamp(.95rem, 3vw, 1.25rem), env(safe-area-inset-right, 0px));
  border-bottom: 1px solid var(--k-line);
}
.k-cart-drawer-head-text { flex: 1 1 auto; min-width: 0; }
.k-cart-drawer-head .offcanvas-title { font-size: clamp(15px, 3.8vw, 16px); font-weight: 600; letter-spacing: -.02em; }
.k-cart-drawer-meta { font-size: 12.5px; margin-top: .15rem; }
.k-cart-drawer-close {
  width: 38px; height: 38px; border: 1px solid var(--k-line); border-radius: 50%;
  background: #fff; color: var(--k-ink-2); display: flex; align-items: center; justify-content: center;
  margin-left: auto; flex-shrink: 0;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}
.k-cart-drawer-close:hover { background: var(--k-surface-2); border-color: var(--k-line-2); color: var(--k-ink); }
.k-cart-drawer-close:active { transform: scale(.94); }
.k-cart-drawer .offcanvas-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}
.k-cart-drawer-body,
.k-cart-drawer-empty { min-height: 0; }
.k-cart-drawer-ship { background: var(--k-surface-2); flex-shrink: 0; }

.k-cart-drawer-items {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.k-cart-drawer-item {
  display: flex; gap: .85rem; align-items: flex-start;
  padding: .95rem 0; border-bottom: 1px solid var(--k-line);
  position: relative;
  transition: opacity .28s ease, transform .28s ease,
              max-height .32s ease, padding .32s ease, margin .32s ease, border-color .32s ease;
}
.k-cart-drawer-item.is-removing {
  opacity: 0 !important; transform: translateX(28px) !important;
  max-height: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important;
  margin: 0 !important; border-color: transparent !important; overflow: hidden;
}
.k-cart-drawer-item:last-child { border-bottom: 0; }
.k-cart-drawer-thumb { flex: 0 0 72px; display: block; }
.k-cart-drawer-thumb img {
  width: 72px; height: 90px; object-fit: cover; border-radius: var(--k-radius-sm);
  background: var(--k-surface-2); display: block;
  transition: transform .22s ease;
}
.k-cart-drawer-thumb:hover img { transform: scale(1.03); }
.k-cart-drawer-item-title { font-size: 14px; font-weight: 500; color: var(--k-ink); padding-right: 1.5rem; }
.k-cart-drawer-item-title:hover { color: var(--k-ink); }
.k-cart-drawer-item-meta { font-size: 12px; margin-top: .1rem; }
.k-cart-drawer-item-unit { font-size: 12px; margin-top: .2rem; }
.k-cart-drawer-item-price { font-size: 14px; font-weight: 600; margin-top: .15rem; }
.k-cart-drawer-remove {
  position: absolute; top: .85rem; right: 0;
  width: 30px; height: 30px; border: none; border-radius: 50%;
  background: transparent; color: var(--k-muted);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; cursor: pointer;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}
.k-cart-drawer-remove:hover { background: color-mix(in srgb, var(--k-sale) 8%, transparent); color: var(--k-sale); }
.k-cart-drawer-remove:active { transform: scale(.9); }

.k-cart-drawer-foot {
  background: var(--k-surface);
  flex-shrink: 0;
}
.k-cart-drawer-foot .k-summary-total { font-size: 16px; padding-top: .5rem; margin-top: .35rem; }
.k-cart-drawer-ship-text { font-size: clamp(12px, 3.2vw, 13px); }
.k-cart-drawer-ship-free { color: var(--k-success); }
.k-cart-drawer-ship-track { font-size: 12px; white-space: nowrap; }

@media (max-width: 575.98px) {
  .k-cart-drawer {
    --k-cart-drawer-w: 100vw;
    width: 100% !important;
    border-radius: 0;
  }
  .k-cart-drawer-head { align-items: center; }
  .k-cart-drawer-close { width: 40px; height: 40px; }
  .k-cart-drawer-ship { padding: .85rem 1rem !important; }
  .k-cart-drawer-ship-text {
    flex-direction: column;
    align-items: flex-start !important;
    gap: .2rem;
  }
  .k-cart-drawer-ship-track { white-space: normal; }
  .k-cart-drawer-items { padding-left: 1rem !important; padding-right: 1rem !important; }
  .k-cart-drawer-item { gap: .7rem; padding: .8rem 0; }
  .k-cart-drawer-thumb { flex: 0 0 64px; }
  .k-cart-drawer-thumb img { width: 64px; height: 80px; }
  .k-cart-drawer-item-title { font-size: 13.5px; padding-right: 2rem; }
  .k-cart-drawer-remove { top: .65rem; width: 36px; height: 36px; font-size: 13px; }
  .k-cart-drawer-foot {
    padding: .85rem 1rem max(.85rem, env(safe-area-inset-bottom, 0px)) !important;
  }
  .k-cart-drawer-foot .btn { min-height: 44px; }
  .k-cart-drawer-empty .k-empty { padding-left: 1rem; padding-right: 1rem; }
}

/* Sepet paneli arka planı */
.offcanvas-backdrop.show {
  background: rgba(15, 15, 15, .38);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  transition: opacity .35s ease;
}

/* Sepette kullanılabilir kuponlar (inc/components/b2c_coupon_offers.php): kod + fayda | Uygula */
.k-coupon-offer {
  display: flex; justify-content: space-between; align-items: center; gap: .75rem;
  padding: .65rem .75rem; border: 1px dashed var(--k-line-2); border-radius: var(--k-radius-sm);
  background: var(--k-surface-2);
}
.k-coupon-offer-code { font-size: 13px; font-weight: 600; color: var(--k-ink); background: transparent; padding: 0; }
.k-coupon-offer-note { color: var(--k-warning); }

.k-summary { position: sticky; top: calc(var(--k-header-h) + 16px); }
/* Özet satırı: etiket sola, değer sağa hizalı; değer genişliğini alır, uzun metin (kargo/ödeme adı) kırılır. */
.k-summary-row {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem;
  font-size: 14px; padding: .32rem 0; color: var(--k-ink-2);
}
.k-summary-row > :first-child { flex: 1 1 0; min-width: 0; overflow-wrap: anywhere; }
.k-summary-row > :last-child { max-width: 65%; text-align: right; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.k-summary-total {
  display: flex; justify-content: space-between; align-items: baseline; gap: 1rem;
  font-size: 17px; font-weight: 600; padding-top: .8rem; margin-top: .6rem; border-top: 1px solid var(--k-line);
}
.k-summary-total > :last-child { white-space: nowrap; font-variant-numeric: tabular-nums; }

/* Özet kalemleri (ödeme sayfası): görsel | ad + varyant/adet | tutar. Uzun liste kutunun içinde kayar. */
.k-summary-items {
  padding: .35rem 1.25rem; border-bottom: 1px solid var(--k-line);
  max-height: 340px; overflow-y: auto; overscroll-behavior: contain;
}
.k-summary-item {
  display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; align-items: center; gap: .85rem;
  padding: .7rem 0;
}
.k-summary-item + .k-summary-item { border-top: 1px dashed var(--k-line); }
.k-summary-item .k-thumb { width: 52px; height: 66px; }
.k-summary-item-title {
  font-size: 13.5px; line-height: 1.35; color: var(--k-ink);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  overflow-wrap: anywhere;
}
.k-summary-item-meta { font-size: 12.5px; color: var(--k-muted); margin-top: .15rem; overflow-wrap: anywhere; }
.k-summary-item-price { font-size: 13.5px; font-weight: 500; white-space: nowrap; text-align: right; font-variant-numeric: tabular-nums; }

.k-progress { height: 5px; background: var(--k-surface-2); border-radius: 99px; overflow: hidden; }
.k-progress > span { display: block; height: 100%; background: var(--k-success); transition: width .4s ease; }

/* ===== Ödeme adımları ================================================== */
.k-step { border: 1px solid var(--k-line); border-radius: var(--k-radius); background: #fff; margin-bottom: 1rem; overflow: hidden; }
.k-step-head { display: flex; align-items: center; gap: .85rem; padding: 1.05rem 1.25rem; cursor: pointer; }
.k-step-no {
  width: 26px; height: 26px; border-radius: 50%; background: var(--k-surface-2); color: var(--k-ink-2);
  display: flex; align-items: center; justify-content: center; font-size: 12.5px; font-weight: 600; flex: 0 0 26px;
}
.k-step.done .k-step-no, .k-step.active .k-step-no { background: var(--k-ink); color: #fff; }
.k-step-head h3 { font-size: 15px; margin: 0; }
.k-step-body { padding: 0 1.25rem 1.35rem; overflow: visible; }

.k-choice { display: block; border: 1px solid var(--k-line-2); border-radius: var(--k-radius-sm); padding: .95rem 1.05rem; cursor: pointer; transition: all .16s ease; height: 100%; min-width: 0; }
.k-choice:hover { border-color: var(--k-ink); }
.k-choice.active { border-color: var(--k-ink); box-shadow: 0 0 0 1px var(--k-ink); }
.k-choice input { margin-right: .55rem; }
.k-choice--row {
  display: flex; align-items: flex-start; gap: .65rem;
}
.k-choice--row > input[type="radio"],
.k-choice--row > input[type="checkbox"] {
  margin: .15rem 0 0; flex: 0 0 auto;
}
.k-choice--row .k-choice-body { flex: 1; min-width: 0; }
.k-choice--compact { padding: .72rem .85rem; }
.k-choice--split {
  display: flex; align-items: center; justify-content: space-between;
  gap: .85rem 1rem; flex-wrap: wrap;
}
.k-choice--split .k-choice-main {
  display: flex; align-items: flex-start; gap: .65rem; min-width: 0; flex: 1 1 12rem;
}
.k-choice--split .k-choice-main > input { margin: .15rem 0 0; flex: 0 0 auto; }
.k-choice--split .k-choice-price { flex: 0 0 auto; white-space: nowrap; }

/* Ödeme sayfası */
.k-checkout { min-width: 0; }
.k-checkout > .row > [class*="col-"] { min-width: 0; }
.k-checkout .k-step-body .row > [class*="col-"] { min-width: 0; }
.k-checkout .k-step-body { min-width: 0; }
.k-checkout .input-group { flex-wrap: nowrap; }
.k-checkout .input-group .form-select { min-width: 0; }
.k-checkout .form-check-label { line-height: 1.45; }
.k-checkout .form-check-label a { word-break: break-word; }
@media (max-width: 575.98px) {
  .k-checkout .input-group { flex-wrap: wrap; }
  .k-checkout .input-group .form-select { max-width: 100% !important; width: 100%; }
  .k-summary { position: static; }
}

.k-iban {
  font-family: var(--k-font); font-size: clamp(12px, 3.2vw, 13.5px);
  letter-spacing: .02em; word-break: break-all; overflow-wrap: anywhere;
}

.k-bank-item {
  display: flex; flex-wrap: wrap; align-items: flex-start; gap: .75rem 1rem;
  padding: .85rem 0; min-width: 0;
}
.k-bank-item:first-child { padding-top: 0; }
.k-bank-item:last-child { padding-bottom: 0; }
.k-bank-name { font-size: 14px; font-weight: 600; }
.k-bank-list { min-width: 0; max-width: 100%; overflow: hidden; }
@media (max-width: 575.98px) {
  .k-bank-item { flex-direction: column; align-items: stretch; }
  .k-bank-item .btn { width: 100%; }
}

.k-qty-sm { transform: scale(.92); transform-origin: left; }
.k-order-no { font-size: 22px; font-weight: 650; letter-spacing: .04em; }

/* ===== Sipariş alındı sayfası (b2c_order_success) ======================= */
.k-os { max-width: 1040px; margin: 0 auto; }
.k-os-hero { text-align: center; padding: 40px 24px 32px; }
.k-os-check { width: 72px; height: 72px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
    background: color-mix(in srgb, var(--k-success) 14%, transparent); color: var(--k-success); font-size: 32px; margin-bottom: 18px; }
.k-os-hero h1 { font-size: clamp(26px, 3vw, 36px); margin-bottom: 8px; }
.k-os-number { display: inline-flex; align-items: center; gap: 10px; margin-top: 18px; padding: 8px 8px 8px 16px;
    border: 1px dashed var(--k-line-2); border-radius: 999px; background: var(--k-surface-2); }
.k-os-number strong { font-size: 18px; letter-spacing: .05em; }
.k-os-meta { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--k-line); }
.k-os-meta > div { padding: 16px 12px; text-align: center; }
.k-os-meta > div + div { border-left: 1px solid var(--k-line); }
.k-os-meta small { display: block; color: var(--k-muted); font-size: 12px; margin-bottom: 2px; }
.k-os-meta span { font-weight: 600; font-size: 14.5px; }
.k-os-steps { display: flex; list-style: none; padding: 20px 24px; margin: 0; border-top: 1px solid var(--k-line); }
.k-os-steps li { flex: 1; position: relative; text-align: center; font-size: 12.5px; color: var(--k-muted); }
.k-os-steps li::before { content: ""; position: absolute; top: 13px; left: -50%; width: 100%; height: 2px; background: var(--k-line); }
.k-os-steps li:first-child::before { display: none; }
.k-os-steps i { position: relative; z-index: 1; width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center;
    justify-content: center; background: var(--k-surface); border: 2px solid var(--k-line); font-size: 11px; margin-bottom: 6px; }
.k-os-steps li.done { color: var(--k-ink); font-weight: 600; }
.k-os-steps li.done i { background: var(--k-success); border-color: var(--k-success); color: #fff; }
.k-os-item { display: flex; gap: 14px; align-items: center; padding: 12px 0; }
.k-os-item + .k-os-item { border-top: 1px solid var(--k-line); }
.k-os-item img { width: 56px; height: 70px; object-fit: cover; border-radius: 6px; background: var(--k-surface-2); flex-shrink: 0; }
@media (max-width: 575.98px) {
    .k-os-meta { grid-template-columns: 1fr; }
    .k-os-meta > div + div { border-left: 0; border-top: 1px solid var(--k-line); }
    .k-os-steps { padding: 16px 8px; }
    .k-os-steps li { font-size: 11px; }
}

/* Duyarlılık */
@media (max-width: 575.98px) {
  .k-cart-row img { width: 74px; height: 92px; }
}