/* /public/css/cookie-banner.css (FINAL)
   - Modal sadece Tercihler ile açılır (JS kontrol)
   - Blur yok
   - Bar sabit altta
   - ✅ Bar varken footer kapanmasın: --cbx-safe-bottom ile sayfa altı boşluk
*/


#cookieBanner.cbx{
  position: fixed;
  inset: 0;
  z-index: 999999;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  pointer-events: none;
}

#cookieBanner[hidden]{ display:none !important; }

/* ✅ hidden attribute’u CSS override edemesin */
#cookieBanner .cbx-bar[hidden],
#cookieBanner .cbx-modal[hidden]{
  display:none !important;
}

#cookieBanner .cbx-bar,
#cookieBanner .cbx-modal{
  pointer-events: auto;
}

/* ===== BAR ===== */
#cookieBanner .cbx-bar{
  position:absolute;
  left:0; right:0; bottom:0;
  background:#0b0f14;
  color:#eaf2f9;
  border-top:1px solid rgba(255,255,255,.10);
}

#cookieBanner .cbx-bar__inner{
  max-width:1240px;
  margin:0 auto;
  padding:14px calc(16px + var(--cbx-safe-right)) 14px calc(16px + var(--cbx-safe-left));
  display:grid;
  grid-template-columns: 1fr auto;
  gap:14px;
  align-items:center;
}

#cookieBanner .cbx-bar__title{
  font-weight:900;
  font-size:14px;
  line-height:1.25;
  margin:0 0 4px;
}

#cookieBanner .cbx-bar__desc{
  font-size:12.5px;
  color:rgba(234,242,249,.75);
  line-height:1.35;
}

/* Metin içi linkler: normal + alt çizgi */
#cookieBanner .cbx-inline-link{
  color: rgba(234,242,249,.92);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  font-weight: 400;
}
#cookieBanner .cbx-inline-link:hover{ color:#fff; }

/* ===== ACTIONS ===== */
#cookieBanner .cbx-bar__actions{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
}

/* ===== MODAL ===== */
#cookieBanner .cbx-modal{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  padding:18px;
}

#cookieBanner .cbx-backdrop{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.45);
}

#cookieBanner .cbx-sheet{
  position:relative;
  width:min(920px, 100%);
  background:#fff;
  color:#0b1220;
  border-radius:14px;
  box-shadow:0 18px 70px rgba(0,0,0,.35);
  border:1px solid rgba(0,0,0,.08);
  overflow:hidden;
}

#cookieBanner .cbx-sheet__top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:16px 16px 10px;
  border-bottom:1px solid rgba(0,0,0,.08);
}

#cookieBanner .cbx-sheet__brand{
  display:grid;
  grid-template-columns:44px 1fr;
  gap:12px;
  align-items:start;
}

#cookieBanner .cbx-ico{
  width:44px; height:44px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background: rgba(15,33,44,.08);
  border:1px solid rgba(15,33,44,.10);
  font-size:18px;
}

#cookieBanner .cbx-title{
  margin:0;
  font-size:16px;
  font-weight:900;
}
#cookieBanner .cbx-sub{
  margin:4px 0 0;
  font-size:12.5px;
  line-height:1.35;
  color: rgba(11,18,32,.70);
}

#cookieBanner .cbx-x{
  width:36px; height:36px;
  border-radius:10px;
  border:1px solid rgba(0,0,0,.10);
  background: rgba(0,0,0,.04);
  font-size:20px;
  cursor:pointer;
  line-height:1;
}
#cookieBanner .cbx-x:hover{ background: rgba(0,0,0,.07); }

#cookieBanner .cbx-list{
  padding:12px 16px 6px;
  display:grid;
  gap:10px;
}

#cookieBanner .cbx-row{
  border:1px solid rgba(0,0,0,.08);
  background: rgba(0,0,0,.02);
  border-radius:12px;
  padding:12px 12px;
  display:grid;
  grid-template-columns: 1fr auto;
  gap:12px;
  align-items:start;
}
#cookieBanner .cbx-row--locked{
  background: rgba(0,0,0,.018);
}

#cookieBanner .cbx-row__topline{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}

#cookieBanner .cbx-badge{
  display:inline-flex;
  align-items:center;
  padding:4px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  border:1px solid rgba(0,0,0,.10);
  background:#fff;
}

#cookieBanner .cbx-badge--locked{
  color:#7a4d00;
  border-color: rgba(122,77,0,.25);
  background: rgba(255,209,138,.25);
}
#cookieBanner .cbx-badge--stats{
  color:#0b4ea8;
  border-color: rgba(11,78,168,.22);
  background: rgba(103,179,255,.20);
}
#cookieBanner .cbx-badge--mkt{
  color:#0a6a4d;
  border-color: rgba(10,106,77,.22);
  background: rgba(18,184,134,.18);
}

#cookieBanner .cbx-mini{
  font-size:12px;
  color: rgba(11,18,32,.62);
}
#cookieBanner .cbx-desc{
  margin:6px 0 0;
  font-size:12.5px;
  line-height:1.35;
  color: rgba(11,18,32,.75);
}

/* ===== SWITCH ===== */
#cookieBanner .cbx-switch{
  position:relative;
  display:inline-flex;
  align-items:center;
  cursor:pointer;
  user-select:none;
  margin-top:2px;
}
#cookieBanner .cbx-switch input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
#cookieBanner .cbx-slider{
  width:42px; height:24px;
  border-radius:999px;
  background: rgba(0,0,0,.10);
  border:1px solid rgba(0,0,0,.14);
  position:relative;
  transition:.2s ease;
}
#cookieBanner .cbx-slider::after{
  content:"";
  width:18px; height:18px;
  border-radius:999px;
  background:#fff;
  position:absolute;
  top:50%;
  left:3px;
  transform: translateY(-50%);
  transition:.2s ease;
  box-shadow:0 6px 14px rgba(0,0,0,.18);
}
#cookieBanner .cbx-switch input:checked + .cbx-slider{
  background: rgba(18,184,134,.35);
  border-color: rgba(18,184,134,.45);
}
#cookieBanner .cbx-switch input:checked + .cbx-slider::after{
  left:20px;
}
#cookieBanner .cbx-switch--disabled{
  cursor:not-allowed;
  opacity:.75;
}

/* ===== MODAL FOOTER ===== */
#cookieBanner .cbx-sheet__bottom{
  padding:10px 16px 14px;
  border-top:1px solid rgba(0,0,0,.08);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
#cookieBanner .cbx-link{
  color: rgba(11,18,32,.70);
  font-size:12.5px;
  text-decoration:underline;
  font-weight: 400;
}

/* ===== BUTTONS (base) ===== */
#cookieBanner .cbx-btn{
  border:1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.08);
  color:#eaf2f9;
  border-radius:10px;
  padding:9px 12px;
  font-weight:900;
  font-size:12.5px;
  cursor:pointer;
  transition:.15s ease;
}
#cookieBanner .cbx-btn:hover{ transform: translateY(-1px); }
#cookieBanner .cbx-btn:active{ transform: translateY(0); }

/* ✅ Tercihler butonu: çerçevesiz + normal + alt çizgi */
#cookieBanner .cbx-btn--ghost{
  background: transparent;
  border: 0 !important;
  color: rgba(234,242,249,.92);
  font-weight: 500 !important;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
#cookieBanner .cbx-btn--ghost:hover{
  background: rgba(255,255,255,.08);
  text-decoration-thickness: 2px;
}

/* ✅ Primary: Emlaktam lacivert + beyaz yazı */
#cookieBanner .cbx-btn--primary{
  background:#2f7c42 !important;
  border:1px solid rgba(255,255,255,.14) !important;
  color:#ffffff !important;
}
#cookieBanner .cbx-btn--primary:hover{ background:#428a42 !important; }
#cookieBanner .cbx-btn--primary:active{ background:#07121a !important; }

/* Bar içinde primary border biraz daha uyumlu */
#cookieBanner .cbx-bar .cbx-btn{
  border-color: rgba(255,255,255,.16);
}

/* Responsive */
@media (max-width: 860px){
  #cookieBanner .cbx-bar__inner{ grid-template-columns: 1fr; }
  #cookieBanner .cbx-bar__actions{ justify-content:flex-start; }
  #cookieBanner .cbx-sheet__bottom{
    flex-direction:column;
    align-items:stretch;
  }
  #cookieBanner .cbx-sheet__bottom .cbx-btn{ width:100%; }
}

/* ✅ Safe bottom uygulaması (JS --cbx-safe-bottom yazar) */
/* ✅ Safe bottom: JS --cbx-safe-bottom yazar (spacer ile garanti) */
:root{
  --cbx-safe-bottom: 0px;
  --cbx-safe-right: 96px; /* Jivo için sağ boşluk (80-120 arası oynat) */
  --cbx-safe-left: 12px;  /* hafif içeri */
}
html { scroll-padding-bottom: var(--cbx-safe-bottom, 0px); }