/* =========================================================
   b2bNet — cerez.css
   Cerez rizasi: alt bant + ayar penceresi.
   Kablolama ve davranis: gorunum/js/cerez.js
   Kimlikler ve Consent Mode: sayfalar/izleme.php

   Sinif oneki .b2b-cerez- — main.css'teki genel siniflarla
   (.b2b-buton, .b2b-kart) BILEREK karismiyor: oradaki butonlar
   beyaz yazili, acik zeminde kayboluyor (bkz. 2-cms tuzak 5).
   ========================================================= */

/* ---------------------------------------------------------
   1. ALT BANT
   --------------------------------------------------------- */
.b2b-cerez{
  position:fixed;
  left:20px; bottom:20px;
  z-index:90;                      /* ust alan 70, canli destek widget'i ~99999 */
  width:min(420px, calc(100vw - 40px));
  background:#fff;
  border:1px solid #E2E8F0;
  border-radius:18px;
  box-shadow:0 24px 60px -18px rgba(9,32,86,.28), 0 4px 12px -4px rgba(9,32,86,.10);
  padding:22px 22px 18px;
  font-family:'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  color:#1E293B;
  transform:translateY(16px);
  opacity:0;
  transition:transform .38s var(--b2b-gecis, cubic-bezier(.22,1,.36,1)),
             opacity .28s ease;
}
.b2b-cerez.b2b-cerez--gorunur{ transform:translateY(0); opacity:1; }
.b2b-cerez[hidden]{ display:none !important; }   /* bkz. 2-cms tuzak 10 */

.b2b-cerez-baslik{
  display:flex; align-items:center; gap:10px;
  font-size:1rem; font-weight:700; line-height:1.3;
  color:#0F2C6B;
  margin:0 0 8px;
}
.b2b-cerez-baslik svg{ width:20px; height:20px; flex:none; color:var(--b2b-mavi-600,#2563EB); }

.b2b-cerez-metin{
  font-size:.875rem; line-height:1.6; color:#475569;
  margin:0 0 16px;
}
.b2b-cerez-metin a{
  color:var(--b2b-mavi-600,#2563EB);
  text-decoration:underline; text-underline-offset:2px;
}
.b2b-cerez-metin a:hover{ color:var(--b2b-mavi-700,#1D4ED8); }

/* ---------------------------------------------------------
   2. BUTONLAR
   --------------------------------------------------------- */
.b2b-cerez-eylem{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.b2b-cerez-btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:6px;
  min-height:42px;
  padding:0 14px;
  border-radius:11px;
  border:1px solid transparent;
  font:inherit; font-size:.875rem; font-weight:600;
  line-height:1;
  cursor:pointer;
  text-align:center;
  transition:background .18s ease, border-color .18s ease, color .18s ease;
}
.b2b-cerez-btn:active{ transform:scale(.985); }

.b2b-cerez-btn--kabul{
  background:var(--b2b-mavi-600,#2563EB);
  border-color:var(--b2b-mavi-600,#2563EB);
  color:#fff;
}
.b2b-cerez-btn--kabul:hover{
  background:var(--b2b-mavi-700,#1D4ED8);
  border-color:var(--b2b-mavi-700,#1D4ED8);
}

/* Reddet, kabul ile ayni agirlikta olmali — KVKK'da "reddetmek
   kabul etmek kadar kolay" sarti var. Ayni boy, ayni satir. */
.b2b-cerez-btn--red{
  background:#fff;
  border-color:#CBD5E1;
  color:#334155;
}
.b2b-cerez-btn--red:hover{ background:#F1F5F9; border-color:#94A3B8; }

.b2b-cerez-btn--ayar{
  grid-column:1 / -1;
  background:transparent;
  border-color:transparent;
  color:#64748B;
  min-height:34px;
  font-size:.8125rem;
  font-weight:500;
  text-decoration:underline;
  text-underline-offset:3px;
}
.b2b-cerez-btn--ayar:hover{ color:var(--b2b-mavi-600,#2563EB); }

/* ---------------------------------------------------------
   3. AYAR PENCERESI
   --------------------------------------------------------- */
.b2b-cerez-ort{
  position:fixed; inset:0;
  z-index:95;
  display:flex; align-items:center; justify-content:center;
  padding:20px;
  background:rgba(9,32,86,.45);
  -webkit-backdrop-filter:blur(4px);
  backdrop-filter:blur(4px);
  opacity:0;
  transition:opacity .24s ease;
}
.b2b-cerez-ort.b2b-cerez--gorunur{ opacity:1; }
.b2b-cerez-ort[hidden]{ display:none !important; }

.b2b-cerez-pencere{
  width:min(560px, 100%);
  max-height:min(88vh, 760px);
  display:flex; flex-direction:column;
  background:#fff;
  border-radius:20px;
  box-shadow:0 40px 90px -24px rgba(9,32,86,.45);
  font-family:'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  color:#1E293B;
  overflow:hidden;
  transform:translateY(12px) scale(.99);
  transition:transform .3s var(--b2b-gecis, cubic-bezier(.22,1,.36,1));
}
.b2b-cerez-ort.b2b-cerez--gorunur .b2b-cerez-pencere{ transform:translateY(0) scale(1); }

.b2b-cerez-tepe{
  display:flex; align-items:flex-start; gap:14px;
  padding:24px 24px 18px;
  border-bottom:1px solid #E2E8F0;
}
.b2b-cerez-tepe h2{
  flex:1;
  margin:0;
  font-size:1.125rem; font-weight:700; line-height:1.35;
  color:#0F2C6B;
}
.b2b-cerez-tepe p{
  margin:6px 0 0;
  font-size:.8125rem; line-height:1.6; color:#64748B;
  font-weight:400;
}

.b2b-cerez-kapat{
  flex:none;
  width:34px; height:34px;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid #E2E8F0; border-radius:10px;
  background:#fff; color:#64748B;
  cursor:pointer;
  transition:background .18s ease, color .18s ease;
}
.b2b-cerez-kapat:hover{ background:#F1F5F9; color:#0F172A; }
.b2b-cerez-kapat svg{ width:16px; height:16px; }

.b2b-cerez-govde{
  flex:1;
  overflow-y:auto;
  padding:8px 24px 4px;
}

/* --- tek kategori satiri --- */
.b2b-cerez-kat{
  display:flex; align-items:flex-start; gap:14px;
  padding:18px 0;
  border-bottom:1px solid #F1F5F9;
}
.b2b-cerez-kat:last-child{ border-bottom:0; }

.b2b-cerez-kat-bilgi{ flex:1; min-width:0; }
.b2b-cerez-kat-ad{
  margin:0 0 4px;
  font-size:.9375rem; font-weight:600; color:#0F172A;
}
.b2b-cerez-kat-ozet{
  margin:0;
  font-size:.8125rem; line-height:1.6; color:#64748B;
}
.b2b-cerez-kat-servis{
  margin:8px 0 0;
  font-size:.75rem; line-height:1.5; color:#94A3B8;
}

/* --- anahtar --- */
.b2b-cerez-anahtar{
  flex:none;
  position:relative;
  width:46px; height:26px;
  margin-top:2px;
}
.b2b-cerez-anahtar input{
  position:absolute; inset:0;
  width:100%; height:100%;
  margin:0; opacity:0; cursor:pointer;
}
.b2b-cerez-anahtar-govde{
  position:absolute; inset:0;
  background:#CBD5E1;
  border-radius:999px;
  transition:background .2s ease;
  pointer-events:none;
}
.b2b-cerez-anahtar-govde::after{
  content:'';
  position:absolute; top:3px; left:3px;
  width:20px; height:20px;
  background:#fff;
  border-radius:50%;
  box-shadow:0 1px 3px rgba(15,23,42,.25);
  transition:transform .2s var(--b2b-gecis, cubic-bezier(.22,1,.36,1));
}
.b2b-cerez-anahtar input:checked + .b2b-cerez-anahtar-govde{
  background:var(--b2b-mavi-600,#2563EB);
}
.b2b-cerez-anahtar input:checked + .b2b-cerez-anahtar-govde::after{
  transform:translateX(20px);
}
.b2b-cerez-anahtar input:focus-visible + .b2b-cerez-anahtar-govde{
  outline:3px solid var(--b2b-mavi-700,#1D4ED8);
  outline-offset:3px;
}
.b2b-cerez-anahtar input:disabled{ cursor:default; }
.b2b-cerez-anahtar input:disabled + .b2b-cerez-anahtar-govde{
  background:#93C5FD;
}

.b2b-cerez-kilit{
  flex:none;
  margin-top:4px;
  font-size:.6875rem; font-weight:600;
  letter-spacing:.04em; text-transform:uppercase;
  color:#94A3B8;
  white-space:nowrap;
}

/* --- pencere dibi --- */
.b2b-cerez-dip{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  padding:16px 24px 20px;
  border-top:1px solid #E2E8F0;
  background:#F8FAFC;
}
.b2b-cerez-dip .b2b-cerez-btn--secim{
  grid-column:1 / -1;
  background:#fff;
  border-color:#CBD5E1;
  color:#334155;
}
.b2b-cerez-dip .b2b-cerez-btn--secim:hover{ background:#F1F5F9; border-color:#94A3B8; }

/* Kayit gonderilirken butonlar kilitlenir */
.b2b-cerez-btn[disabled]{ opacity:.6; cursor:default; }

/* ---------------------------------------------------------
   4. FOOTER / SAYFA ICI "CEREZ AYARLARI" BAGLANTISI
   Herhangi bir <a> ya da <button> uzerine data-b2b-cerez-ac
   konursa pencere acilir; bu sinif sadece gorunum icin.
   --------------------------------------------------------- */
.b2b-cerez-baglanti{
  background:none; border:0; padding:0;
  font:inherit; color:inherit;
  cursor:pointer;
  text-decoration:underline; text-underline-offset:3px;
}
.b2b-cerez-baglanti:hover{ color:#fff; }

/* ---------------------------------------------------------
   5. DAR EKRAN
   --------------------------------------------------------- */
@media (max-width:640px){
  .b2b-cerez{
    left:12px; right:12px; bottom:12px;
    width:auto;
    padding:18px 18px 14px;
    border-radius:16px;
  }
  .b2b-cerez-metin{ font-size:.8125rem; }

  .b2b-cerez-ort{ padding:0; align-items:flex-end; }
  .b2b-cerez-pencere{
    width:100%;
    max-height:92vh;
    border-radius:20px 20px 0 0;
  }
  .b2b-cerez-tepe{ padding:20px 18px 16px; }
  .b2b-cerez-govde{ padding:4px 18px; }
  .b2b-cerez-dip{ padding:14px 18px 18px; }
  .b2b-cerez-kat{ gap:12px; }
}

/* ---------------------------------------------------------
   6. HAREKET AZALTMA
   --------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  .b2b-cerez,
  .b2b-cerez-ort,
  .b2b-cerez-pencere,
  .b2b-cerez-anahtar-govde::after{ transition:none; }
}
