/* ==========================================================================
   float.css — Sabit WhatsApp / telefon düğmeleri (sol alt) + ışık efekti
   Diğer tüm CSS'lerden SONRA yüklenir (site.css / footer.css üzerine yazar).
   Yalnız transform / opacity / box-shadow animasyonları.
   ========================================================================== */

:root{
  --fl-gap:max(24px,calc(env(safe-area-inset-left) + 16px));
  --fl-gap-b:max(24px,calc(env(safe-area-inset-bottom) + 16px));
  --fl-gap-r:max(24px,calc(env(safe-area-inset-right) + 16px));
  --fl-gold:183,143,85;
  --fl-gold-hi:210,178,126;
}

/* ---------- Konum: sol alt ---------- */
.contact-float{right:auto;left:var(--fl-gap);bottom:var(--fl-gap-b);align-items:flex-start}

/* Pergel "başa dön" sağ altta, kendi köşesinde */
.to-top{right:var(--fl-gap-r);bottom:calc(var(--fl-gap-b) + 28px - var(--tt) / 2)}
@media (max-width:1023.98px){
  .to-top{right:.9rem;bottom:calc(var(--mbar-h) + .9rem)}
}

/* ---------- Düğme gövdesi ---------- */
.fab{
  isolation:isolate;
  /* iç ince halka (eski ::before) artık arka plan katmanında */
  background-image:radial-gradient(circle closest-side,transparent 22.4px,rgba(var(--fl-gold),.3) 22.9px 23.8px,transparent 24.3px);
  box-shadow:0 12px 30px -10px rgba(0,0,0,.5),0 0 0 0 rgba(var(--fl-gold),0);
  transition:transform .5s var(--ease),background-color .4s,color .4s,box-shadow .5s var(--ease);
}
.fab:hover,.fab:focus-visible,.fab[aria-expanded="true"]{
  transform:translateY(-2px) scale(1.07);
  box-shadow:0 16px 34px -10px rgba(0,0,0,.55),0 0 26px 4px rgba(var(--fl-gold-hi),.45);
}
.fab:focus-visible{outline:2px solid var(--gold-soft);outline-offset:5px}
.fab:active{transform:scale(.96)}
.fab>svg{position:relative;z-index:2}

/* ::after — nefes alan altın hale (merkez şeffaf: düğmeyi örtmez) */
.fab::after{
  content:"";position:absolute;inset:-18px;border-radius:50%;pointer-events:none;z-index:-1;
  background:radial-gradient(circle closest-side,transparent 60%,rgba(var(--fl-gold-hi),.62) 64%,rgba(var(--fl-gold),.22) 80%,rgba(var(--fl-gold),0) 100%);
  opacity:.35;transform:scale(.9);
  animation:flHalo 2.2s ease-in-out infinite;
}
/* WhatsApp: altına çok düşük opaklıkta yeşil karışır */
.fab--wa::after{
  background:radial-gradient(circle closest-side,transparent 60%,rgba(var(--fl-gold-hi),.6) 64%,rgba(37,211,102,.13) 80%,rgba(var(--fl-gold),0) 100%);
}

/* ::before — dışa genişleyip kaybolan ince altın halka (ripple) */
.fab::before{
  inset:-1px;border:1px solid rgba(var(--fl-gold-hi),.85);
  opacity:0;transform:scale(1);
  animation:flRipple 2.2s cubic-bezier(.2,.6,.3,1) infinite;
}

/* Senkron olmasın */
.fab--tel::after,.fab--tel::before{animation-delay:-1.1s;animation-duration:2.4s}

/* Telefon: ~6 sn'de bir kısa "zil" */
.fab--tel>svg{transform-origin:50% 55%;animation:flRing 6s ease-in-out 1.6s infinite}

/* Hover / açık: ışık güçlenir */
.fab:hover::after,.fab:focus-visible::after,.fab[aria-expanded="true"]::after{animation:none;opacity:1;transform:scale(1.06);transition:opacity .4s,transform .5s var(--ease)}

/* Mevcut WhatsApp durum noktası sağ üstte kalsın */
.fab__pulse{z-index:3}

@keyframes flHalo{
  0%,100%{opacity:.28;transform:scale(.9)}
  50%{opacity:.95;transform:scale(1.04)}
}
@keyframes flRipple{
  0%{opacity:.85;transform:scale(1)}
  70%,100%{opacity:0;transform:scale(1.85)}
}
@keyframes flRing{
  0%,84%,100%{transform:rotate(0)}
  86%{transform:rotate(-14deg)}
  88%{transform:rotate(12deg)}
  90%{transform:rotate(-10deg)}
  92%{transform:rotate(8deg)}
  94%{transform:rotate(-4deg)}
  96%{transform:rotate(0)}
}

/* ---------- WhatsApp kartı: soldan açılır ---------- */
.wa-card{transform-origin:bottom left;animation:flCardIn .55s var(--ease)}
@keyframes flCardIn{
  from{opacity:0;transform:translate(-14px,10px) scale(.97)}
  to{opacity:1;transform:none}
}
/* WhatsApp düğmesini gösteren ok (kart açıkken) */
.contact-float:has(.wa-card:not([hidden]))::before{
  content:"";position:absolute;z-index:2;left:22px;
  bottom:calc(56px * 2 + .7rem * 2 - 6px);
  width:12px;height:12px;background:var(--ink);
  border-right:1px solid rgba(183,143,85,.5);border-bottom:1px solid rgba(183,143,85,.5);
  transform:rotate(45deg);animation:flFade .55s var(--ease);
}
@keyframes flFade{from{opacity:0}to{opacity:1}}

/* ---------- Mobil alt çubuk (mbar) ---------- */
@media (max-width:1023.98px){
  .mbar__btn{position:relative;overflow:hidden;isolation:isolate}
  .mbar__btn>svg,.mbar__btn>span{position:relative;z-index:1}

  /* İkon arkasında nabız gibi parıltı: flex öğesi olarak ikonun tam altına oturur */
  .mbar__btn::before{
    content:"";flex:none;order:-1;width:38px;height:38px;border-radius:50%;
    margin-left:-10px;margin-right:calc(-28px - .6rem);
    background:radial-gradient(circle closest-side,rgba(var(--fl-gold-hi),.55),rgba(var(--fl-gold),.18) 55%,rgba(var(--fl-gold),0) 100%);
    box-shadow:0 0 0 1px rgba(var(--fl-gold-hi),.0);
    opacity:.35;transform:scale(.8);
    animation:flHalo 2.2s ease-in-out infinite;
  }
  .mbar__btn--wa::before{
    background:radial-gradient(circle closest-side,rgba(255,250,240,.75),rgba(255,250,240,.25) 55%,rgba(255,250,240,0) 100%);
    animation-delay:-1.1s;animation-duration:2.4s;
  }
  .mbar__btn:not(.mbar__btn--wa)>svg{transform-origin:50% 55%;animation:flRing 6s ease-in-out 1.6s infinite}

  /* WhatsApp yarısı: soldan sağa kayan ışık süzmesi */
  .mbar__btn--wa::after{
    content:"";position:absolute;top:0;bottom:0;left:0;width:45%;z-index:0;pointer-events:none;
    background:linear-gradient(100deg,rgba(255,250,240,0) 0%,rgba(255,250,240,.5) 50%,rgba(255,250,240,0) 100%);
    transform:translateX(-120%) skewX(-18deg);
    animation:flShimmer 3.6s cubic-bezier(.45,.05,.35,1) .8s infinite;
  }
  .mbar__btn--wa{box-shadow:inset 0 1px 0 rgba(255,250,240,.35)}
}
@keyframes flShimmer{
  0%{transform:translateX(-120%) skewX(-18deg)}
  55%,100%{transform:translateX(330%) skewX(-18deg)}
}

/* ---------- Azaltılmış hareket: yalnız statik hafif hale ---------- */
@media (prefers-reduced-motion:reduce){
  .fab::after,.fab::before,.fab--tel>svg,.wa-card,
  .contact-float::before,.mbar__btn::before,.mbar__btn::after,.mbar__btn>svg{animation:none!important}
  .fab::after{opacity:.5;transform:none}
  .fab::before{opacity:0}
  .fab:hover,.fab:focus-visible,.fab[aria-expanded="true"]{transform:none}
  .mbar__btn::before{opacity:.45;transform:none}
  .mbar__btn--wa::after{display:none}
}

@media print{.contact-float,.mbar{display:none!important}}

/* Kısa ekranlarda kart başlığa taşmasın */
@media (max-height:760px) and (min-width:1024px){
  .wa-card__art{padding-top:.9rem}
  .wa-card__art svg{max-width:8.5rem}
  .wa-card__body{padding-top:.9rem;padding-bottom:1.1rem}
}