/* Çerez bandı (component/cookie_consent.php, IS-124). Bant bütün sayfalarda ortak ve ana sayfanın .nx kapsamı DIŞINDA
   (footer'da) durur; nx değişkenleri ve sıfırlamaları ona ulaşmaz. Eski tasarımlı ve footer_2 sayfalarında da aynı görünsün
   diye stil burada kendi başına yeterli: renkler ana sayfanın değerleri (nx.css --nx-red, --ink, cf-card gölgesi). */
.cookie-alert{
  --cc-red:#e8231a;--cc-red-hover:#cf1b13;--cc-ink:#202122;--cc-muted:#55585a;--cc-line:#ececea;
  position:fixed;left:16px;bottom:16px;z-index:39;
  /* Masaüstünde geniş ve basık (IS-128): 480 px'lik kart 1440'ta 245 px boyla kampanya sloganının ikinci satırını
     örtüyordu; aynı metin daha geniş satırda daha az satır tutar. */
  width:min(540px,calc(100% - 32px));
  padding:14px 20px 16px;
  background:#fff;color:var(--cc-ink);
  border:1px solid var(--cc-line);border-radius:18px;
  box-shadow:0 1px 0 #0000000a,0 28px 64px -22px #1f1f2059;
  font-family:inherit;font-size:14px;line-height:1.55;text-align:left
}
/* Tailwind'in .hidden kuralı bu dosyadan önce yüklenir ve aynı özgüllükteki konum kuralına yenilirdi; gizleme burada da yazılı.
   Göster/gizle sözleşmesi aynı: sb/registered-js-bundle.js hidden <-> block değiştirir. */
.cookie-alert.hidden{display:none}
/* z-index 39: demo penceresinin arka perdesi (z-40) ve telefondaki açılır menü (z-40) bandın üstünde kalır;
   WhatsApp (30) ve kampanyanın sabit düğmesi (29) altında. */
.cookie-alert .cc-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px;margin-bottom:6px}
.cookie-alert .cc-title{margin:0;font-size:16px;font-weight:600;line-height:1.3;letter-spacing:-.2px;color:var(--cc-ink)}
.cookie-alert .cc-text{margin:0;font-size:13.5px;line-height:1.5;color:var(--cc-muted)}
/* Kısa metin yalnız telefon ve tablette (aşağıdaki medya sorguları açar). */
.cookie-alert .cc-short{display:none;margin:0;font-size:13px;line-height:1.45;color:var(--cc-muted)}
.cookie-alert .cc-short .cc-link{font-size:inherit}
.cookie-alert .cc-link{font-size:13px;font-weight:600;line-height:1.3;color:var(--cc-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;white-space:nowrap}
.cookie-alert .cc-link:hover{color:var(--cc-red)}
/* Kabul Et dolu kırmızı (ana sayfanın .nx-btn'i), Reddet ondan küçük çerçeveli ikincil düğme: kullanıcı kararı 14 Eki
   ("redded daha küçük olsun"). Sınır: Reddet okunur kalır, sırası değişmez, tıklanan alanı Kabul Et kadar yüksek
   (telefonda 44px); yalnız GÖRÜNEN kutusu küçük. Kutu ::before ile çizilir, düğmenin kendisi tam yükseklikte kalır. */
.cookie-alert .cc-actions{display:flex;align-items:center;gap:10px;margin-top:12px}
.cookie-alert .cc-btn{
  position:relative;isolation:isolate;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:44px;margin:0;padding:0 18px;
  border:0;border-radius:10px;background:transparent;
  font:inherit;font-size:14px;font-weight:600;line-height:1.2;text-decoration:none;cursor:pointer;
  -webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;
  transition:background .2s,color .2s,transform .2s
}
.cookie-alert .cc-primary{flex:1 1 auto;background:var(--cc-red);color:#fff;box-shadow:0 12px 24px -14px #e8231acc}
.cookie-alert .cc-primary:hover{background:var(--cc-red-hover);color:#fff}
.cookie-alert .cc-secondary{flex:0 0 auto;padding:0 16px;font-size:13px;font-weight:500;color:var(--cc-ink)}
.cookie-alert .cc-secondary::before{content:"";position:absolute;inset:5px 0;z-index:-1;border:1px solid #d5d5d5;border-radius:9px;background:#fff;transition:border-color .2s}
.cookie-alert .cc-secondary:hover{color:var(--cc-ink)}
.cookie-alert .cc-secondary:hover::before{border-color:var(--cc-ink)}
.cookie-alert .cc-btn svg{flex:0 0 16px;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.cookie-alert .cc-secondary svg{flex-basis:14px;width:14px;height:14px}
.cookie-alert .cc-btn:focus-visible,.cookie-alert .cc-link:focus-visible{outline:3px solid #e95049;outline-offset:3px}
@media(hover:hover){.cookie-alert .cc-primary:hover{transform:translateY(-1px)}}
@media(prefers-reduced-motion:no-preference){
  .cookie-alert.block{animation:cc-in .35s cubic-bezier(.2,.9,.25,1)}
}
@keyframes cc-in{from{opacity:0;transform:translateY(14px)}}
@keyframes cc-in-top{from{opacity:0;transform:translateY(-14px)}}

/* Telefon ve tablet (IS-128): reklam trafiğinin çoğu telefondan geliyor ve 224 px'lik kart ilk ekranda kampanya formunu
   baştan sona örtüyordu. Bu genişliklerde başlık satırı ve uzun metin yerine kısa metin + tek sıra düğme çıkar. */
@media(max-width:1150px){
  .cookie-alert .cc-head,.cookie-alert .cc-text{display:none}
  .cookie-alert .cc-short{display:block}
}

/* Telefon: ekranın altına yapışık şerit, 390'da ~115 px. Kenar boşluğu bırakılmaz; o 12 px formun ilk alanına
   (390'da y 661–716) yer açıyor. */
@media(max-width:767px){
  .cookie-alert{
    left:0;right:0;bottom:0;width:auto;
    padding:12px max(14px,env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));
    border-width:1px 0 0;border-radius:16px 16px 0 0;
    box-shadow:0 -16px 36px -20px #1f1f2059
  }
  /* 12,5 px ve 14 px yan boşlukla kısa metin 360'ta da iki satırda kalıyor (13 px'te üçe çıkıp bandı 136 px yapıyordu). */
  .cookie-alert .cc-short{font-size:12.5px}
  .cookie-alert .cc-actions{gap:8px;margin-top:10px}
  .cookie-alert .cc-btn{padding:0 12px}
  .cookie-alert .cc-secondary{padding:0 14px}
}

/* Tablet: menünün hemen altında tek satır şerit. Bu aralıkta hero görseli üstte, başlık ve form görselin altında;
   alta konan her bant (dar kart da şerit de) 768×909'da formun ekrandaki ilk 117 px'ini örtüyordu. Görselin üstü
   tek boş yer. 76 px = sabit menünün yüksekliği (61) + 15 px; menü (z-50) bandın üstünde kalır. */
@media(min-width:768px) and (max-width:1150px){
  .cookie-alert{top:76px;bottom:auto;left:24px;right:24px;width:auto;align-items:center;gap:20px;padding:12px 12px 12px 20px;border-radius:14px}
  .cookie-alert.block{display:flex}
  .cookie-alert .cc-short{flex:1 1 auto;font-size:13.5px}
  .cookie-alert .cc-actions{flex:0 0 auto;margin-top:0}
  .cookie-alert .cc-primary{flex:0 0 auto}
}
@media(min-width:768px) and (max-width:1150px) and (prefers-reduced-motion:no-preference){
  .cookie-alert.block{animation-name:cc-in-top}
}
