/* ==========================================================================
   osp-cart.css: magaza menu sayfasi, sagdan acilan sepet paneli (kp34/W, 2026-10-30)
   --------------------------------------------------------------------------
   Isaretleme: common_layouts/cart_sidebar.php + layouts/ajax_cart_item.php
   (topMenu.php `.shopping_cart.style_2` icinde). Sinif adlari auth.js'e bagli,
   hicbiri degismedi; bu dosya yalniz gorunum katmani.

   Yukleme: frontend/inc/header.php, osp-theme.css'ten HEMEN SONRA.
   Kapsam: her secici `.shopping_cart.style_2` altinda. ajax_cart_item.php
   odeme sayfasinda da (checkout_content.php) basiliyor; oraya dokunulmaz.

   Renk: osp-theme token'lari (--osp-ink, --osp-muted, --osp-line, --osp-brand-*).
   Zemin ve kart rengi sayfanin kendi degerleri: menu sayfasinin zemini
   style.css --body-color, urun karti acik temada beyaz, koyu temada
   zemin ustune %7 beyaz (ekrandan olculdu: #2a2e3b).

   !important GEREKCELERI (her biri karsi kuraliyla):
     style.css   .shopping_cart_content ul li { box-shadow !important }
     style.css   .style_2 .incress_area * { color: #777 !important }
     style.css   .c_red { color: red !important }   (kapatma ikonu)
     style.css   .order-btn { color: #fff !important }  (koyu temada 2,6:1)
     default.php .sidebarQty / .sidebarAmoutn .total_price / .f-color
                 { magaza rengi !important }  (Cajun sarisi beyazda 1,8:1)
   Eski tarayici (Edge 16, iOS 12, Chrome 58, Firefox 60): flex gap, grid,
   inset, clamp, aspect-ratio, :is/:where/:has YOK. :focus-visible ve env()
   yalniz yedekli kullanildi (bkz. ilgili kurallar).
   Geri alma: bu dosyanin link satirini header.php'den sil.
   ========================================================================== */

body .shopping_cart.style_2 {
  --cart-bg: var(--body-color, #f3f5f9);
  --cart-card: #ffffff;
  --cart-press: rgba(15, 23, 42, .06);
  padding: 0;
  background: var(--cart-bg);
  border-left: 1px solid var(--osp-line);
  box-shadow: var(--osp-shadow-2);
  color: var(--osp-ink);
  font-family: var(--osp-font);
}

body.theme-dark .shopping_cart.style_2 {
  --cart-card: rgba(255, 255, 255, .07);
  --cart-press: rgba(255, 255, 255, .10);
}

/* Govde: baslik ust, odeme alti sabit, liste aradaki tum yuksekligi alir.
   Eskiden .cart_body calc(100vh - 180px) idi; altinda bos gri alan kaliyordu. */
body .shopping_cart.style_2 .shopping_cart_content {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  flex-direction: column;
  height: 100%;
}

/* ---- Baslik ----------------------------------------------------------- */
body .shopping_cart.style_2 .cart_heading {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 64px;
  margin: 0;
  padding: var(--osp-3) var(--osp-3) var(--osp-3) var(--osp-5);
  background: var(--cart-card);
  border-bottom: 1px solid var(--osp-line);
}

body .shopping_cart.style_2 .cart_heading h4 {
  margin: 0;
  font-family: Montserrat, var(--osp-font);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--osp-ink);
}

body .shopping_cart.style_2 span.cartItemList {
  display: block;
  width: auto;
  height: auto;
}

/* Kapatma: kirmizi cerceveli kare yerine sakin, yuvarlak ikon dugmesi */
body .shopping_cart.style_2 span.cartItemList a,
body .shopping_cart.style_2 .right_cart a.remove_item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin: 0;
  padding: 0;
  border-radius: var(--osp-r-pill);
  text-decoration: none;
  transition: background-color var(--osp-t-fast) var(--osp-ease), color var(--osp-t-fast) var(--osp-ease);
}

body .shopping_cart.style_2 span.cartItemList a {
  background: var(--osp-surface-2);
  color: var(--osp-ink);
}

body.theme-dark .shopping_cart.style_2 span.cartItemList a {
  background: var(--cart-press);
}

body .shopping_cart.style_2 span.cartItemList a i {
  font-size: 18px;
  line-height: 1;
  color: var(--osp-ink) !important;
}

/* icofont-close-line-squared (kare cerceveli) yerine icofont-close-line glifi */
body .shopping_cart.style_2 span.cartItemList .icofont-close-line-squared:before {
  content: "\eee1";
}

/* ---- Liste ------------------------------------------------------------ */
body .shopping_cart.style_2 .cart_body {
  -webkit-box-flex: 1;
  flex: 1 1 auto;
  height: auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

body .shopping_cart.style_2 ul.cartItems {
  margin: 0;
  padding: var(--osp-3) var(--osp-3) var(--osp-1);
  list-style: none;
}

body .shopping_cart.style_2 .shopping_cart_content ul.cartItems > li {
  margin: 0 0 var(--osp-2);
  padding: var(--osp-3) var(--osp-2) var(--osp-3) var(--osp-4);
  background: var(--cart-card);
  border: 1px solid var(--osp-line);
  border-radius: var(--osp-r);
  box-shadow: none !important;
  color: var(--osp-ink);
}

/* Satir: [gorsel + ad/fiyat] [sil]  /  [- adet +] alt satirda.
   DOM sirasi (adet, bilgi, sil) auth.js icin ayni kaldi; yerlesim `order` ile. */
body .shopping_cart.style_2 .single_item_cart {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
}

/* Bilgi + sil ilk satiri doldurur (sil: 40 px + 8 px bosluk);
   adet secicisine yer kalmaz, alt satira iner. flex-basis'te calc yerine
   width: Edge 16'nin flex kisaltmasindaki calc hatasina takilmamak icin. */
body .shopping_cart.style_2 .left_cart {
  order: 1;
  flex: 0 0 auto;
  width: calc(100% - 48px);
  min-width: 0;
  align-items: flex-start;
  padding-top: 2px;
}

body .shopping_cart.style_2 .right_cart {
  order: 2;
  flex: 0 0 40px;
  margin: -6px 0 0 var(--osp-2);
}

body .shopping_cart.style_2 .incress_area {
  order: 3;
  flex: 0 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  width: auto;
  margin: var(--osp-3) 0 0;
  padding: 1px;
  background: var(--osp-surface-2);
  border: 1px solid var(--osp-line);
  border-radius: var(--osp-r-pill);
}

body.theme-dark .shopping_cart.style_2 .incress_area {
  background: var(--cart-press);
}

/* Urun gorseli (is_image = 0 olan magazalar) */
body .shopping_cart.style_2 .single_item_cart img {
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
  margin: 0 var(--osp-3) 0 0;
  border-radius: var(--osp-r-sm);
  object-fit: cover;
}

body .shopping_cart.style_2 .single_cart_item_details {
  width: auto;
  min-width: 0;
  flex: 1 1 0%;
}

body .shopping_cart.style_2 .single_cart_item_details h4 {
  display: block;
  margin: 0;
  font-family: Montserrat, var(--osp-font);
  font-size: .9375rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--osp-ink);
  opacity: 1;
  overflow-wrap: break-word;
  word-wrap: break-word;
}

body .shopping_cart.style_2 span.extrasTitleCard {
  margin: 2px 0 0;
  font-family: var(--osp-font);
  font-size: .8125rem;
  font-weight: 500;
  line-height: 1.4;
  color: var(--osp-muted);
}

body .shopping_cart.style_2 span.extrasTitleCard:empty {
  display: none;
}

body .shopping_cart.style_2 .sizePrice p {
  margin: 2px 0 0;
  font-family: var(--osp-font);
  font-size: .8125rem;
  font-weight: 500;
  line-height: 1.4;
  color: var(--osp-muted) !important;
}

body .shopping_cart.style_2 .sizePrice p:empty {
  display: none;
}

body .shopping_cart.style_2 p.currencyTag {
  margin: var(--osp-1) 0 0;
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.4;
  color: var(--osp-muted);
  font-variant-numeric: tabular-nums;
}

body .shopping_cart.style_2 p.tax_status {
  margin: 2px 0 0;
  font-size: .75rem;
  color: var(--osp-muted);
}

/* Adet secici: 40 px dokunma alani, yatay hap */
body .shopping_cart.style_2 .incress_area span.value-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: var(--osp-r-pill);
  background: transparent;
  cursor: pointer;
  transition: background-color var(--osp-t-fast) var(--osp-ease), transform var(--osp-t-fast) var(--osp-ease);
}

body .shopping_cart.style_2 .incress_area span.value-button:active {
  background: var(--cart-press);
  transform: scale(.94);
}

body .shopping_cart.style_2 .incress_area span.cart_qty_field {
  display: block;
  padding: 0;
}

body .shopping_cart.style_2 .incress_area i {
  font-size: 15px;
  line-height: 1;
  color: var(--osp-ink) !important;
}

body .shopping_cart.style_2 .incress_area span.cart_qty_field input.qty {
  display: block;
  width: 32px;
  height: 40px;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: center;
  font-family: var(--osp-font);
  font-size: 15px;
  font-weight: 600;
  color: var(--osp-ink) !important;
  font-variant-numeric: tabular-nums;
  pointer-events: none;
}

/* Sil: sessiz gri carpi; ustune gelince/odakta tehlike rengi */
body .shopping_cart.style_2 .right_cart a.remove_item {
  background: transparent;
  color: var(--osp-muted);
}

body .shopping_cart.style_2 .right_cart a.remove_item i {
  font-size: 17px;
  line-height: 1;
}

@media (hover: hover) {
  body .shopping_cart.style_2 span.cartItemList a:hover {
    background: var(--osp-line-strong);
  }
  body .shopping_cart.style_2 .incress_area span.value-button:hover {
    background: var(--cart-press);
  }
  body .shopping_cart.style_2 .right_cart a.remove_item:hover {
    background: var(--osp-danger-tint);
    color: var(--osp-danger);
  }
}

/* Odak halkasi. :focus-visible bilmeyen tarayicida (Edge 16, iOS 12,
   Chrome 58, Firefox 60) ikinci kural tumden gecersiz sayilir, halka
   :focus ile her zaman gorunur kalir. */
body .shopping_cart.style_2 span.cartItemList a:focus,
body .shopping_cart.style_2 .right_cart a.remove_item:focus,
body .shopping_cart.style_2 .cart_footer a.order-btn:focus {
  outline: 0;
  box-shadow: 0 0 0 2px var(--cart-bg), 0 0 0 4px var(--osp-brand-600);
}

body .shopping_cart.style_2 span.cartItemList a:focus:not(:focus-visible),
body .shopping_cart.style_2 .right_cart a.remove_item:focus:not(:focus-visible) {
  box-shadow: none;
}

body .shopping_cart.style_2 .right_cart a.remove_item:focus {
  color: var(--osp-danger);
}

/* ---- Alt bilgi: toplam + odeme ---------------------------------------- */
body .shopping_cart.style_2 .cart_footer {
  flex: 0 0 auto;
  padding: var(--osp-4);
  /* iPhone ev cubugu payi. var() KULLANILMAZ: var() iceren bildirim ayristirmada
     gecerli sayilir, env()'yi bilmeyen tarayicida (Chrome 58, Edge 16, Firefox 60)
     hesaplamada gecersiz olup 0'a duser (Chromium 58'de olculdu). Yalin 16px
     ile bildirim tumden atilir, yukaridaki padding kalir. */
  padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  background: var(--cart-card);
  border-top: 1px solid var(--osp-line);
}

body .shopping_cart.style_2 .sub_total_list {
  display: block;
  width: 100%;
  margin: 0 0 var(--osp-3);
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  text-align: left;
}

body .shopping_cart.style_2 .sub_total_list h4 {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 0;
  padding: 0;
  font-family: var(--osp-font);
  font-size: 1rem;
  color: var(--osp-ink);
}

body .shopping_cart.style_2 .sidebarQty {
  flex: 0 0 auto;
  min-width: 28px;
  min-height: 28px;
  margin: 0 var(--osp-3) 0 0;
  padding: 0 var(--osp-2);
  border: 0;
  border-radius: var(--osp-r-pill);
  background: var(--osp-brand-tint-2) !important;
  color: var(--osp-brand-700);
}

body .shopping_cart.style_2 .sidebarQty span.cart_count {
  font-family: var(--osp-font);
  font-size: .8125rem;
  font-weight: 700;
  line-height: 1;
  color: var(--osp-brand-700);
  font-variant-numeric: tabular-nums;
}

/* "Fiyat" metni ile tutar ayni kutuda: metin dugumu esnek ogeye donusur,
   tutar saga yaslanir. */
body .shopping_cart.style_2 .sidebarAmoutn {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex: 1 1 auto;
  min-width: 0;
  font-size: .875rem;
  font-weight: 500;
  color: var(--osp-muted);
}

body .shopping_cart.style_2 .sidebarAmoutn .total_price {
  margin-left: var(--osp-3);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  color: var(--osp-ink) !important;
  font-variant-numeric: tabular-nums;
}

/* Odeme / Yeni sepet: sayfadaki birincil dugmeyle ayni (osp-theme .btn-info) */
body .shopping_cart.style_2 .cart_footer a.order-btn {
  display: flex;
  width: 100%;
  min-height: 50px;
  margin: 0;
  border-radius: var(--osp-r);
  font-size: 1rem;
  font-weight: 600;
  background-color: var(--osp-brand-600) !important;
  border-color: var(--osp-brand-600);
  color: var(--osp-on-brand) !important;
}

body .shopping_cart.style_2 .cart_footer a.order-btn:hover,
body .shopping_cart.style_2 .cart_footer a.order-btn:active {
  background-color: var(--osp-brand-700) !important;
  border-color: var(--osp-brand-700);
  color: var(--osp-on-brand) !important;
}

/* ---- Bilgi durumlari: kapali / limit dolu / baska magazanin sepeti ----- */
body .shopping_cart.style_2 .top_cart_order {
  height: auto;
  min-height: 100%;
  padding: var(--osp-10) var(--osp-5);
}

body .shopping_cart.style_2 .limit_msg,
body .shopping_cart.style_2 .conflictText {
  color: var(--osp-muted);
}

body .shopping_cart.style_2 .conflictText {
  padding: var(--osp-8) var(--osp-5);
}

body .shopping_cart.style_2 .limit_msg h4,
body .shopping_cart.style_2 .conflictText h4 {
  margin: var(--osp-3) 0 var(--osp-2);
  font-family: Montserrat, var(--osp-font);
  font-size: 1.0625rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--osp-ink);
}

body .shopping_cart.style_2 .conflictText p {
  margin: 0 0 var(--osp-2);
  font-size: .875rem;
  line-height: 1.5;
}

@media (prefers-reduced-motion: reduce) {
  body .shopping_cart.style_2 span.cartItemList a,
  body .shopping_cart.style_2 .right_cart a.remove_item,
  body .shopping_cart.style_2 .incress_area span.value-button {
    transition: none;
  }
  body .shopping_cart.style_2 .incress_area span.value-button:active {
    transform: none;
  }
}

/* Eski tarayici: style.css kp33/V yedegi `.single_cart_item_details h4 > * + *`
   icin #kp33v ozgullugunde margin-left:5px veriyor; ek bilgisi artik alt
   satirda oldugu icin sifirlanir. Yalniz `inset` bilmeyen tarayicida calisir. */
@supports not (inset: 0) {
  body .shopping_cart.style_2 .single_cart_item_details h4 > span.extrasTitleCard:not(#kp34w) {
    margin-left: 0;
  }
}